前端:商品添加。提交部分,让小范帮忙看看~

This commit is contained in:
YunaiV 2019-03-17 11:55:55 +08:00
parent 6ce040fbd6
commit 8a652c24eb
4 changed files with 230 additions and 16 deletions

View File

@ -0,0 +1,75 @@
import { message } from 'antd';
import { productSpuPage, productAttrTree, productCategoryUpdate, productCategoryUpdateStatus, productCategoryDelete } from '../../services/product';
export default {
namespace: 'productAttrList',
state: {
list: [],
},
effects: {
// *add({ payload }, { call, put }) {
// const { callback, body } = payload;
// const response = yield call(productCategoryAdd, body);
// if (callback) {
// callback(response);
// }
// yield put({
// type: 'tree',
// payload: {},
// });
// },
// *update({ payload }, { call, put }) {
// const { callback, body } = payload;
// const response = yield call(productCategoryUpdate, body);
// if (callback) {
// callback(response);
// }
// yield put({
// type: 'tree',
// payload: {},
// });
// },
// *updateStatus({ payload }, { call, put }) {
// const { callback, body } = payload;
// const response = yield call(productCategoryUpdateStatus, body);
// if (callback) {
// callback(response);
// }
// yield put({
// type: 'tree',
// payload: {},
// });
// },
// *delete({ payload }, { call, put }) {
// const response = yield call(productCategoryDelete, payload);
// message.info('删除成功!');
// yield put({
// type: 'tree',
// payload: {},
// });
// },
*tree({ payload }, { call, put }) {
const { queryParams } = payload;
const response = yield call(productAttrTree, queryParams);
message.info('查询成功!');
yield put({
type: 'treeSuccess',
payload: {
tree: response.data,
},
});
},
},
reducers: {
treeSuccess(state, { payload }) {
return {
...state,
...payload,
};
},
},
};

View File

@ -0,0 +1,94 @@
import { message } from 'antd';
import { productCategoryTree, productCategoryAdd, productCategoryUpdate, productCategoryUpdateStatus, productCategoryDelete } from '../../services/product';
export default {
namespace: 'productSpuAddOrUpdate',
state: {
list: [],
attrTree: [{
}
// {
// id: //
// name: //
// values: [{
// id: //
// name: //
// }]
// }
]
},
effects: {
// *add({ payload }, { call, put }) {
// const { callback, body } = payload;
// const response = yield call(productCategoryAdd, body);
// if (callback) {
// callback(response);
// }
// yield put({
// type: 'tree',
// payload: {},
// });
// },
// *update({ payload }, { call, put }) {
// const { callback, body } = payload;
// const response = yield call(productCategoryUpdate, body);
// if (callback) {
// callback(response);
// }
// yield put({
// type: 'tree',
// payload: {},
// });
// },
// *updateStatus({ payload }, { call, put }) {
// const { callback, body } = payload;
// const response = yield call(productCategoryUpdateStatus, body);
// if (callback) {
// callback(response);
// }
// yield put({
// type: 'tree',
// payload: {},
// });
// },
// *delete({ payload }, { call, put }) {
// const response = yield call(productCategoryDelete, payload);
// message.info('删除成功!');
// yield put({
// type: 'tree',
// payload: {},
// });
// },
*addAttr({ payload }, { call, put }) {
// const { queryParams } = payload;
// const response = yield call(productCategoryTree, queryParams);
message.info('调试:添加规格成功!');
yield put({
type: 'addAttrSuccess',
payload: {
attrAdd: {},
},
});
},
},
reducers: {
addAttrSuccess(state, {payload}) {
// debugger;
console.log(state.attrTree);
state.attrTree.push(payload.attrAdd);
return {
...state
}
},
treeSuccess(state, { payload }) {
return {
...state,
...payload,
};
},
},
};

View File

@ -3,19 +3,21 @@
import React, { PureComponent, Fragment } from 'react'; import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva'; import { connect } from 'dva';
import moment from 'moment'; import moment from 'moment';
import {Card, Form, Input, Radio, Button, Table, Divider} from 'antd'; import {Card, Form, Input, Radio, Button, Table, Select} from 'antd';
import PageHeaderWrapper from '@/components/PageHeaderWrapper'; import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import styles from './ProductSpuAddOrUpdate.less'; import styles from './ProductSpuAddOrUpdate.less';
const FormItem = Form.Item; const FormItem = Form.Item;
const RadioGroup = Radio.Group; const RadioGroup = Radio.Group;
const Option = Select.Option;
// roleList // roleList
@connect(({ productSpuList, loading }) => ({ @connect(({ productSpuList, productAttrList, productSpuAddOrUpdate, loading }) => ({
productSpuList, // list: productSpuList.list.spus,
list: productSpuList.list.spus, // loading: loading.models.productSpuList,
loading: loading.models.productSpuList, allAttrTree: productAttrList.tree,
attrTree: productSpuAddOrUpdate.attrTree
})) }))
@Form.create() @Form.create()
@ -31,7 +33,7 @@ class ProductSpuAddOrUpdate extends PureComponent {
componentDidMount() { componentDidMount() {
const { dispatch } = this.props; const { dispatch } = this.props;
dispatch({ dispatch({
type: 'productSpuList/page', type: 'productAttrList/tree',
payload: { payload: {
name: '', name: '',
pageNo: 0, pageNo: 0,
@ -53,9 +55,19 @@ class ProductSpuAddOrUpdate extends PureComponent {
}); });
} }
handleAddAttr = e => {
// alert('你猜');
const { dispatch } = this.props;
dispatch({
type: 'productSpuAddOrUpdate/addAttr',
payload: {
},
});
}
render() { render() {
// debugger; // debugger;
const { form, data } = this.props; const { form, data, attrTree } = this.props;
// 规格明细 // 规格明细
const columns = [ const columns = [
@ -76,6 +88,28 @@ class ProductSpuAddOrUpdate extends PureComponent {
} }
]; ];
// 添加规格
// debugger;
let attrTreeHTML = [];
if (attrTree && attrTree.length > 0) {
for (let i in attrTree) {
let attr = attrTree[i];
attr = <div>
<Select defaultValue="lucy" style={{ width: 120 }}>
{
}
<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
<Option value="disabled" disabled>Disabled</Option>
<Option value="Yiminghe">yiminghe</Option>
</Select>
</div>;
attrTreeHTML.push(attr);
// debugger;
}
}
return ( return (
<PageHeaderWrapper title=""> <PageHeaderWrapper title="">
<Card bordered={false}> <Card bordered={false}>
@ -123,16 +157,19 @@ class ProductSpuAddOrUpdate extends PureComponent {
{form.getFieldDecorator('visible', { {form.getFieldDecorator('visible', {
initialValue: 1, // TODO 修改 initialValue: 1, // TODO 修改
})( })(
<Button>添加规格项目</Button> <div>
)} {attrTreeHTML}
</FormItem> <Button onClick={this.handleAddAttr}>添加规格项目</Button>
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="规格明细"> </div>
{form.getFieldDecorator('visible', {
initialValue: 1, // TODO 修改
})(
<Table defaultExpandAllRows={true} columns={columns} rowKey="id" />
)} )}
</FormItem> </FormItem>
{/*<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="规格明细">*/}
{/*{form.getFieldDecorator('visible', {*/}
{/*initialValue: 1, // TODO 修改*/}
{/*})(*/}
{/*<Table defaultExpandAllRows={true} columns={columns} rowKey="id" />*/}
{/*)}*/}
{/*</FormItem>*/}
</Form> </Form>
</Card> </Card>
</PageHeaderWrapper> </PageHeaderWrapper>

View File

@ -36,10 +36,18 @@ export async function productCategoryDelete(params) {
}); });
} }
// product spu // product spu + sku
export async function productSpuPage(params) { export async function productSpuPage(params) {
return request(`/product-api/admins/spu/page?${stringify(params)}`, { return request(`/product-api/admins/spu/page?${stringify(params)}`, {
method: 'GET', method: 'GET',
}); });
} }
// product attr + attr value
export async function productAttrTree(params) {
return request(`/product-api/admins/attr/tree?${stringify(params)}`, {
method: 'GET',
});
}