diff --git a/src/pages/card/memberAccount/index.jsx b/src/pages/card/memberAccount/index.jsx index 19223ee..7e2d4e2 100644 --- a/src/pages/card/memberAccount/index.jsx +++ b/src/pages/card/memberAccount/index.jsx @@ -4,6 +4,7 @@ import { PageContainer } from '@ant-design/pro-layout'; import { PlusOutlined } from '@ant-design/icons'; import ProTable from '@ant-design/pro-table'; import { Button, Form, Input, DatePicker, Modal, Select, Popconfirm } from 'antd'; +import cardAPI from "../service"; /** * 储值卡账户管理 @@ -11,9 +12,12 @@ import { Button, Form, Input, DatePicker, Modal, Select, Popconfirm } from 'antd */ const memberAccount = () => { const actionRef = useRef(); - const modalForm = Form.useForm(); + const [modalForm] = Form.useForm(); const [isModalOpen, setIsModalOpen] = useState(false); const [currentOption, setCurrentOption] = useState({ id: '' }); + const [current, setCurrent] = useState(1); + const [pageSize, setPageSize] = useState(10); + const [total, setTotal] = useState(0); /** * 点击编辑按钮 @@ -22,7 +26,7 @@ const memberAccount = () => { const onEditTableRow = (record) => { setCurrentOption(record); setIsModalOpen(true); - // modalForm.setFieldsValue(record); + modalForm.setFieldsValue(record); } /** @@ -65,33 +69,33 @@ const memberAccount = () => { }, { title: '会员ID', - dataIndex: 'cardId', + dataIndex: 'memberInfoId', ellipsis: true, }, - { - disable: true, - title: '状态', - dataIndex: 'status', - valueType: 'select', - valueEnum: { - 0: { - text: '禁用', - status: 'Error', - }, - 1: { - text: '正常', - status: 'Success', - }, - 2: { - text: '挂失', - status: 'Error', - }, - 3: { - text: '作废', - status: 'Error', - }, - }, - }, + // { + // disable: true, + // title: '状态', + // dataIndex: 'status', + // valueType: 'select', + // valueEnum: { + // 0: { + // text: '禁用', + // status: 'Error', + // }, + // 1: { + // text: '正常', + // status: 'Success', + // }, + // 2: { + // text: '挂失', + // status: 'Error', + // }, + // 3: { + // text: '作废', + // status: 'Error', + // }, + // }, + // }, { title: '余额', dataIndex: 'money', @@ -122,27 +126,16 @@ const memberAccount = () => { columns={columns} actionRef={actionRef} request={ - () => { - const data = [ - { - id: '1008611', - name: '彭于晏', - cardId: '1008611-100111', - status: 0, - money: '18208', - }, - { - id: '10086112', - name: '彭于晏2', - cardId: '21008611-100111', - status: 1, - money: '18206', - }, - ] + async () => { + const response = await cardAPI.GetMemberAccountPageList({ + current, + pageSize + }); + setTotal(response.data.data); return { - data: data, + data: response.data.data, success: true, - total: 2, + total: response.data.total, } } } @@ -151,17 +144,15 @@ const memberAccount = () => { type: 'multiple', }} rowKey="id" - search={{ - labelWidth: 'auto', - }} + search={false} options={{ setting: { listsHeight: 400, }, }} pagination={{ - pageSize: 5, - onChange: (page) => console.log(page), + pageSize: pageSize, + onChange: (page) => setCurrent(page) }} dateFormatter="string" headerTitle="储值卡账户管理" @@ -175,6 +166,7 @@ const memberAccount = () => {
{ const actionRef = useRef(); - const modalForm = Form.useForm(); + const [modalForm] = Form.useForm(); const [isModalOpen, setIsModalOpen] = useState(false); const [currentOption, setCurrentOption] = useState({ id: '' }); + const [current, setCurrent] = useState(1); + const [pageSize, setPageSize] = useState(10); + const [total, setTotal] = useState(0); + /** * 点击编辑按钮 * @param {*} record */ const onEditTableRow = (record) => { + modalForm.setFieldsValue(record); setCurrentOption(record); setIsModalOpen(true); - // modalForm.setFieldsValue(record); } /** * 点击新建 */ const onCreateTableRow = () => { + modalForm.resetFields(); + setCurrentOption({id: ''}) setIsModalOpen(true); } @@ -43,12 +50,32 @@ const storedValueCard = () => { /** * 提交表单 */ - const onFinish = (values) => { - console.log('value', values); + const onFinish = async (values) => { if (values.id) { - console.log('更新') + const response = await cardAPI.UpdateMemberCardState({ + id: values.id, + type: values.type, + state: values.state + }); + if (response.statusCode === 200) { + message.success('更新成功'); + setIsModalOpen(false); + actionRef.current.reload(); + } else { + message.error(response.errors || '更新储值卡失败'); + } } else { - console.log('创建') + const response = await cardAPI.AddMemberCard({ + type: values.type, + state: values.state + }); + if (response.statusCode === 200) { + message.success('添加成功'); + setIsModalOpen(false); + actionRef.current.reload(); + } else { + message.error(response.errors || '添加储值卡失败'); + } } } @@ -64,14 +91,8 @@ const storedValueCard = () => { ellipsis: true, }, { - title: '会员ID', - dataIndex: 'cardId', - ellipsis: true, - }, - { - disable: true, title: '状态', - dataIndex: 'status', + dataIndex: 'state', valueType: 'select', valueEnum: { 0: { @@ -117,14 +138,6 @@ const storedValueCard = () => { key: 'option', render: (text, record, _, action) => [ onEditTableRow(record)}>编辑, - onDeleteTableRow(record)} - okText="确定" - cancelText="取消" - > - 删除 - ], }, ]; @@ -137,27 +150,15 @@ const storedValueCard = () => { columns={columns} actionRef={actionRef} request={ - () => { - const data = [ - { - id: '1008611', - cardNum: '100546549568', - cardId: '1008611-100111', - type: 0, - status: 0, - }, - { - id: '10086112', - cardNum: '111彭于213123asdf晏2', - cardId: '21008611-100111', - status: 1, - type: 1, - }, - ] + async () => { + const response = await cardAPI.GetMemberCardPageList({ + current, + pageSize + }); return { - data: data, + data: response.data.data, success: true, - total: 2, + total: response.data.total, } } } @@ -166,17 +167,15 @@ const storedValueCard = () => { type: 'multiple', }} rowKey="id" - search={{ - labelWidth: 'auto', - }} + search={false} options={{ setting: { listsHeight: 400, }, }} pagination={{ - pageSize: 5, - onChange: (page) => console.log(page), + pageSize: pageSize, + onChange: (page) => setCurrent(page), }} dateFormatter="string" headerTitle="储值卡账户管理" @@ -186,10 +185,12 @@ const storedValueCard = () => { ]} /> - setIsModalOpen(false)}> + setIsModalOpen(false)}> { - - - - - +