From 14f6d76088155bafa69dd291266d98b80e5956c5 Mon Sep 17 00:00:00 2001 From: zhenxianyimeng <1920405993@qq.com> Date: Sun, 1 Sep 2019 12:43:17 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E8=A7=84=E6=A0=BC=E5=88=97?= =?UTF-8?q?=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/models/product/productAttrList.js | 94 ++++-- .../src/pages/Product/ProductAttrList.js | 287 +++++++++++++++++- admin-web/src/services/product.js | 35 +++ 3 files changed, 385 insertions(+), 31 deletions(-) diff --git a/admin-web/src/models/product/productAttrList.js b/admin-web/src/models/product/productAttrList.js index db3b6cc1d..80405882d 100644 --- a/admin-web/src/models/product/productAttrList.js +++ b/admin-web/src/models/product/productAttrList.js @@ -1,5 +1,14 @@ import { message } from 'antd'; -import { productAttrTree, productAttrValueAdd, productAttrPage } from '../../services/product'; +import { + productAttrTree, + productAttrValueAdd, + productAttrPage, + productAttrAdd, + productAttrUpdate, + productAttrUpdateStatus, + productAttrValueUpdate, + productAttrValueUpdateStatus, +} from '../../services/product'; import PaginationHelper from '../../../helpers/PaginationHelper'; export default { @@ -7,33 +16,61 @@ export default { state: { list: [], + // tree: [], attrData: [], pagination: PaginationHelper.defaultPaginationConfig, }, 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: {}, - // }); - // }, + *add({ payload }, { call, put }) { + const { onSuccess, onFail, body } = payload; + const response = yield call(productAttrAdd, body); + if (response && response.code === 0) { + onSuccess && onSuccess(); + } else { + onFail && onFail(response); + } + }, + + *update({ payload }, { call, put }) { + const { onSuccess, onFail, body } = payload; + const response = yield call(productAttrUpdate, body); + if (response && response.code === 0) { + onSuccess && onSuccess(); + } else { + onFail && onFail(response); + } + }, + + *value_update({ payload }, { call, put }) { + const { onSuccess, onFail, body } = payload; + const response = yield call(productAttrValueUpdate, body); + if (response && response.code === 0) { + onSuccess && onSuccess(); + } else { + onFail && onFail(response); + } + }, + + *update_status({ payload }, { call, put }) { + const { onSuccess, onFail, body } = payload; + const response = yield call(productAttrUpdateStatus, body); + if (response && response.code === 0) { + onSuccess && onSuccess(); + } else { + onFail && onFail(response); + } + }, + + *value_update_status({ payload }, { call, put }) { + const { onSuccess, onFail, body } = payload; + const response = yield call(productAttrValueUpdateStatus, body); + if (response && response.code === 0) { + onSuccess && onSuccess(); + } else { + onFail && onFail(response); + } + }, // *updateStatus({ payload }, { call, put }) { // const { callback, body } = payload; // const response = yield call(productCategoryUpdateStatus, body); @@ -80,6 +117,17 @@ export default { }, }); }, + + *value_add({ payload }, { call, put }) { + const { onSuccess, onFail, body } = payload; + const response = yield call(productAttrValueAdd, body); + if (response && response.code === 0) { + onSuccess && onSuccess(); + } else { + onFail && onFail(response); + } + }, + *addValue({ payload, callback }, { call, put }) { // debugger; // const {queryParams} = payload; diff --git a/admin-web/src/pages/Product/ProductAttrList.js b/admin-web/src/pages/Product/ProductAttrList.js index 45566077c..50ca26ee2 100644 --- a/admin-web/src/pages/Product/ProductAttrList.js +++ b/admin-web/src/pages/Product/ProductAttrList.js @@ -1,5 +1,5 @@ import React, { PureComponent, Fragment, Component } from 'react'; -import { Form, Card, Table, Button, Divider, Modal, Input } from 'antd'; +import { Form, Card, Table, Button, Divider, Modal, Input, message, Switch, Select } from 'antd'; import moment from 'moment'; import { connect } from 'dva'; import PageHeaderWrapper from '@/components/PageHeaderWrapper'; @@ -7,6 +7,85 @@ import PaginationHelper from '../../../helpers/PaginationHelper'; import styles from './ProductAttrList.less'; const FormItem = Form.Item; +const Option = Select.Option; + +const ValueCreateForm = Form.create()(props => { + const { + valueModalVisible, + form, + handleValueAdd, + handleValueModalVisible, + modalType, + initValues, + tree, + } = props; + + const okHandle = () => { + form.validateFields((err, fieldsValue) => { + if (err) return; + let pid = fieldsValue.pid; + if (fieldsValue.pid) { + pid = pid.split('-')[1]; + fieldsValue.pid = pid; + } + form.resetFields(); + handleValueAdd({ + fields: fieldsValue, + modalType, + initValues, + }); + }); + }; + + const selectStyle = { + width: 200, + }; + + function onTypeChange(event) { + initValues.type = parseInt(event.target.value); + } + + const title = modalType === 'add' ? '添加规格值' : '编辑规格值'; + const okText = modalType === 'add' ? '添加' : '编辑'; + return ( + handleValueModalVisible()} + > + {modalType === 'add' ? ( + + {form.getFieldDecorator('attrId', { + // initialValue: template.durationHour ? template.durationHour : '3', + rules: [ + { + required: true, + message: '请选择规格', + }, + ], + })( + + )} + + ) : null} + + {form.getFieldDecorator('name', { + initialValue: initValues ? initValues.name : null, + rules: [{ required: true, message: '请输入规格值！', min: 2 }], + })()} + + + ); +}); + const CreateForm = Form.create()(props => { const { modalVisible, form, handleAdd, handleModalVisible, modalType, initValues } = props; @@ -59,17 +138,23 @@ const CreateForm = Form.create()(props => { @connect(({ productAttrList, loading }) => ({ productAttrList, attrData: productAttrList.attrData, + tree: productAttrList.tree, loading: loading.models.productAttrList, })) @Form.create() export default class ProductAttrList extends PureComponent { state = { modalVisible: false, + valueModalVisible: false, modalType: 'add', //add or update initValues: {}, }; componentDidMount() { + this.initFetch(); + } + + initFetch = () => { const { dispatch } = this.props; dispatch({ type: 'productAttrList/page', @@ -77,7 +162,133 @@ export default class ProductAttrList extends PureComponent { ...PaginationHelper.defaultPayload, }, }); - } + // const { dispatch } = this.props; + dispatch({ + type: 'productAttrList/tree', + payload: { + ...PaginationHelper.defaultPayload, + }, + }); + }; + + expandedRowRender = record => { + const columns = [ + { + title: '规格值', + dataIndex: 'name', + }, + { + title: '状态', + // dataIndex: 'status', + render: (text, record) => ( + this.switchValueChange(checked, record)} + /> + ), + }, + { + title: '创建时间', + dataIndex: 'createTime', + sorter: true, + render: val => {moment(val).format('YYYY-MM-DD')}, + }, + { + title: '操作', + render: (text, record) => ( + + this.handleValueModalVisible(true, 'update', record)}>编辑 + + {/* this.handleDelete(record)}> + 删除 + */} + + ), + }, + ]; + + return ; + }; + + handleAdd = ({ fields, modalType, initValues }) => { + const { dispatch } = this.props; + if (modalType === 'add') { + dispatch({ + type: 'productAttrList/add', + payload: { + body: { + ...fields, + }, + onSuccess: () => { + message.success('添加成功'); + this.handleModalVisible(); + this.initFetch(); + }, + onFail: response => { + message.warn('添加失败' + response.message); + }, + }, + }); + } else { + dispatch({ + type: 'productAttrList/update', + payload: { + body: { + ...initValues, + ...fields, + }, + onSuccess: () => { + message.success('更新成功'); + this.handleModalVisible(); + this.initFetch(); + }, + onFail: response => { + message.warn('更新失败' + response.message); + }, + }, + }); + } + }; + + handleValueAdd = ({ fields, modalType, initValues }) => { + const { dispatch } = this.props; + if (modalType === 'add') { + dispatch({ + type: 'productAttrList/value_add', + payload: { + body: { + ...fields, + }, + onSuccess: () => { + message.success('添加成功'); + this.handleValueModalVisible(); + this.initFetch(); + }, + onFail: response => { + message.warn('添加失败' + response.message); + }, + }, + }); + } else { + dispatch({ + type: 'productAttrList/value_update', + payload: { + body: { + ...initValues, + ...fields, + }, + onSuccess: () => { + message.success('更新成功'); + this.handleValueModalVisible(); + this.initFetch(); + }, + onFail: response => { + message.warn('更新失败' + response.message); + }, + }, + }); + } + }; handleModalVisible = (flag, modalType, initValues) => { this.setState({ @@ -87,8 +298,50 @@ export default class ProductAttrList extends PureComponent { }); }; + handleValueModalVisible = (flag, modalType, initValues) => { + this.setState({ + valueModalVisible: !!flag, + initValues: initValues || {}, + modalType: modalType || 'add', + }); + }; + + switchValueChange = (checked, record) => { + const { dispatch } = this.props; + dispatch({ + type: 'productAttrList/value_update_status', + payload: { + body: { + id: record.id, + status: checked ? 1 : 2, + }, + onSuccess: () => { + message.success('修改状态成功'); + this.initFetch(); + }, + }, + }); + }; + + switchChange = (checked, record) => { + const { dispatch } = this.props; + dispatch({ + type: 'productAttrList/update_status', + payload: { + body: { + id: record.id, + status: checked ? 1 : 2, + }, + onSuccess: () => { + message.success('修改状态成功'); + this.initFetch(); + }, + }, + }); + }; + render() { - const { attrData, productAttrList, loading, pagination } = this.props; + const { attrData, productAttrList, loading, pagination, tree } = this.props; const columns = [ { title: '规格名称', @@ -96,8 +349,13 @@ export default class ProductAttrList extends PureComponent { }, { title: '状态', - dataIndex: 'status', - render: val => {val === 1 ? '开启' : '禁用'}, + // dataIndex: 'status', + render: (text, record) => ( + this.switchChange(checked, record)} + /> + ), }, { title: '创建时间', @@ -111,15 +369,16 @@ export default class ProductAttrList extends PureComponent { this.handleModalVisible(true, 'update', record)}>编辑 - this.handleDelete(record)}> + this.handleValueModalVisible(true, 'add', {})}>新建规格值 + {/* this.handleDelete(record)}> 删除 - + */} ), }, ]; - const { modalVisible, modalType, initValues } = this.state; + const { modalVisible, modalType, initValues, valueModalVisible } = this.state; const parentMethods = { handleAdd: this.handleAdd, @@ -128,6 +387,14 @@ export default class ProductAttrList extends PureComponent { initValues, }; + const valueFormParentMethods = { + handleValueAdd: this.handleValueAdd, + handleValueModalVisible: this.handleValueModalVisible, + modalType, + initValues, + tree: tree, + }; + return ( @@ -149,9 +416,13 @@ export default class ProductAttrList extends PureComponent { rowKey="id" loading={loading} pagination={pagination} + expandedRowRender={this.expandedRowRender} /> {modalVisible ? : null} + {valueModalVisible ? ( + + ) : null} ); } diff --git a/admin-web/src/services/product.js b/admin-web/src/services/product.js index 0e3014ac9..2236d74fc 100644 --- a/admin-web/src/services/product.js +++ b/admin-web/src/services/product.js @@ -91,12 +91,47 @@ export async function productAttrPage(params) { }); } +export async function productAttrAdd(params) { + return request(`/product-api/admins/attr/add?${stringify(params)}`, { + method: 'POST', + body: {}, + }); +} + +export async function productAttrUpdate(params) { + return request(`/product-api/admins/attr/update?${stringify(params)}`, { + method: 'POST', + body: {}, + }); +} + +export async function productAttrUpdateStatus(params) { + return request(`/product-api/admins/attr/update_status?${stringify(params)}`, { + method: 'POST', + body: {}, + }); +} + export async function productAttrTree(params) { return request(`/product-api/admins/attr/tree?${stringify(params)}`, { method: 'GET', }); } +export async function productAttrValueUpdate(params) { + return request(`/product-api/admins/attr_value/update?${stringify(params)}`, { + method: 'POST', + body: {}, + }); +} + +export async function productAttrValueUpdateStatus(params) { + return request(`/product-api/admins/attr_value/update_status?${stringify(params)}`, { + method: 'POST', + body: {}, + }); +} + export async function productAttrValueAdd(params) { return request(`/product-api/admins/attr_value/add?${stringify(params)}`, { method: 'POST',