diff --git a/src/pages/card/gate/index.jsx b/src/pages/card/gate/index.jsx index 15acf0d..a96d452 100644 --- a/src/pages/card/gate/index.jsx +++ b/src/pages/card/gate/index.jsx @@ -12,380 +12,392 @@ import cardAPI from "../service"; /** * 档口管理 - * @returns + * @returns */ const Gate = () => { - const actionRef = useRef(); - const [modalForm] = Form.useForm(); - const [isModalOpen, setIsModalOpen] = useState(false); - const [currentOption, setCurrentOption] = useState({ id: '' }); - const [storeList, setStoreList] = useState([]); - const [selectedStore, setSelectedStore] = useState(''); - const [current, setCurrent] = useState(1); - const [pageSize, setPageSize] = useState(10); - - // editor 实例 - const [editor, setEditor] = useState(null); - // 编辑器内容 - const [html, setHtml] = useState(''); - // 工具栏配置 - const toolbarConfig = {}; - // 编辑器配置 - const editorConfig = { - placeholder: '请输入大屏横幅...', - MENU_CONF: { - uploadImage: { - async customUpload(file, insertFn) { - // file 即选中的文件 - // 自己实现上传,并得到图片 url alt href - //覆盖action 上传之前获取上传地址 - let index = file.name.lastIndexOf("."); - let ext = file.name.substr(index + 1); - let fileData = null; - cardAPI.GetCosRequestURL({ directory: "kitchen", fileExtension: ext, method: "PUT" }).then((r) => { - const action = r.allUrl; - const reader = new FileReader(); - reader.readAsArrayBuffer(file); - reader.onload = (e) => { - fileData = e.target.result; - axios.put(action, fileData).then(response => { - if (response.status == 200 || response.statusText == 'OK') { - // 最后插入图片 - insertFn(r.seeUrl, r.seeUrl, r.seeUrl); - message.success('上传成功!'); - } - }); - }; - }); + const actionRef = useRef(); + const [modalForm] = Form.useForm(); + const [isModalOpen, setIsModalOpen] = useState(false); + const [currentOption, setCurrentOption] = useState({ id: '' }); + const [storeList, setStoreList] = useState([]); + const [selectedStore, setSelectedStore] = useState(''); + const [current, setCurrent] = useState(1); + const [pageSize, setPageSize] = useState(10); + // editor 实例 + const [editor, setEditor] = useState(null); + // 编辑器内容 + const [html, setHtml] = useState(''); + // 工具栏配置 + const toolbarConfig = {}; + // 编辑器配置 + const editorConfig = { + placeholder: '请输入大屏横幅...', + MENU_CONF: { + fontSize: { + fontSizeList: [ + '10px', '20px', '40px', '60px', '80px', '100px', '150px', '180px', '200px', + ] + }, + uploadImage: { + async customUpload(file, insertFn) { + // file 即选中的文件 + // 自己实现上传,并得到图片 url alt href + //覆盖action 上传之前获取上传地址 + let index = file.name.lastIndexOf("."); + let ext = file.name.substr(index + 1); + let fileData = null; + cardAPI.GetCosRequestURL({ directory: "kitchen", fileExtension: ext, method: "PUT" }).then((r) => { + const action = r.allUrl; + const reader = new FileReader(); + reader.readAsArrayBuffer(file); + reader.onload = (e) => { + fileData = e.target.result; + axios.put(action, fileData).then(response => { + if (response.status == 200 || response.statusText == 'OK') { + // 最后插入图片 + insertFn(r.seeUrl, r.seeUrl, r.seeUrl); + message.success('上传成功!'); } - } + }); + }; + }); + } + } } + } - // 及时销毁 editor ,重要! - useEffect(() => { - if (editor == null) return; - editor.destroy() - setEditor(null) - setHtml(''); - }, [isModalOpen]) + // 及时销毁 editor ,重要! + useEffect(() => { + if (editor == null) return; + editor.destroy() + setEditor(null) + setHtml(''); + }, [isModalOpen]) - /** - * 点击编辑按钮 - * @param {*} record - */ - const onEditTableRow = (record) => { - setCurrentOption(record); - setIsModalOpen(true); - setHtml(record.remaek); - modalForm.setFieldsValue(record); - } + /** + * 点击编辑按钮 + * @param {*} record + */ + const onEditTableRow = (record) => { + setCurrentOption(record); + setIsModalOpen(true); + setHtml(record.remaek); + modalForm.setFieldsValue(record); + } - /** - * 点击新建 - */ - const onCreateTableRow = () => { - setIsModalOpen(true); - modalForm.resetFields(); - } + /** + * 点击新建 + */ + const onCreateTableRow = () => { + setIsModalOpen(true); + modalForm.resetFields(); + } - /** - * 提交表单 - */ - const onFinish = async (values) => { - if (values.id) { - values.remaek = html; - const response = await cardAPI.UpdateGateInfo(values); - if (response.statusCode === 200) { - message.success('更新档口成功!'); - setIsModalOpen(false); - actionRef.current.reload(); - } else { - message.error(response.errors || '更新档口失败'); - } - } else { - values.remaek = html; - const response = await cardAPI.AddGate(values); - if (response.statusCode === 200) { - message.success('新增档口成功!'); - setIsModalOpen(false); - actionRef.current.reload(); - } else { - message.error(response.errors || '新增档口失败'); - } - } + /** + * 提交表单 + */ + const onFinish = async (values) => { + if (values.id) { + values.remaek = html; + const response = await cardAPI.UpdateGateInfo(values); + if (response.statusCode === 200) { + message.success('更新档口成功!'); + setIsModalOpen(false); + actionRef.current.reload(); + } else { + message.error(response.errors || '更新档口失败'); + } + } else { + values.remaek = html; + const response = await cardAPI.AddGate(values); + if (response.statusCode === 200) { + message.success('新增档口成功!'); + setIsModalOpen(false); + actionRef.current.reload(); + } else { + message.error(response.errors || '新增档口失败'); + } } + } - const columns = [ - { - title: '档口名称', - dataIndex: 'name', - ellipsis: true, - }, - { - title: '归属门店', - dataIndex: 'storeId', - render: (_, record) => { - const find = storeList.find(item => item.id === record.storeId); - if (find) { - return
{find.store_Name}
- } - } - }, - { - title: '属性', - dataIndex: 'mode', - valueType: 'select', - valueEnum: { - 1: { - text: '固定', - status: 'Success', - }, - 2: { - text: '自由设定', - status: 'Success', - } - }, - }, - { - title: '金额', - dataIndex: 'price', + const columns = [ + { + title: '档口名称', + dataIndex: 'name', + ellipsis: true, + }, + { + title: '归属门店', + dataIndex: 'storeId', + render: (_, record) => { + const find = storeList.find(item => item.id === record.storeId); + if (find) { + return
{find.store_Name}
+ } + } + }, + { + title: '属性', + dataIndex: 'mode', + valueType: 'select', + valueEnum: { + 1: { + text: '固定', + status: 'Success', }, - { - title: '状态', - dataIndex: 'status', - valueType: 'select', - valueEnum: { - 0: { - text: '正常', - status: 'Success', - }, - 1: { - text: '禁用', - status: 'Error', - }, - 2: { - text: '删除', - status: 'Error', - } - }, + 2: { + text: '自由设定', + status: 'Success', + } + }, + }, + { + title: '金额', + dataIndex: 'price', + }, + { + title: '状态', + dataIndex: 'status', + valueType: 'select', + valueEnum: { + 0: { + text: '正常', + status: 'Success', }, - { - title: '操作', - valueType: 'option', - key: 'option', - render: (text, record, _, action) => [ - onEditTableRow(record)}>编辑 - ], + 1: { + text: '禁用', + status: 'Error', }, - ]; - - /** - * 获取店铺列表 - */ - const onFetchStoreList = async () => { - const response = await cardAPI.GetAllStore(); - if (response.isSuccess) { - setStoreList(response.data); - setSelectedStore(response.data[0].id); - actionRef.current.reload(); - } else { - message.error(response.msg || '获取店铺列表失败'); + 2: { + text: '删除', + status: 'Error', } + }, + }, + { + title: '操作', + valueType: 'option', + key: 'option', + render: (text, record, _, action) => [ + onEditTableRow(record)}>更新 + ], + }, + ]; + + /** + * 获取店铺列表 + */ + const onFetchStoreList = async () => { + const response = await cardAPI.GetAllStore(); + if (response.isSuccess) { + setStoreList(response.data); + setSelectedStore(response.data[0].id); + actionRef.current.reload(); + } else { + message.error(response.msg || '获取店铺列表失败'); } + } + + useEffect(() => { + onFetchStoreList(); + }, []); - useEffect(() => { - onFetchStoreList(); - }, []); + return ( + +
+ { + if (selectedStore) { + const response = await cardAPI.GetGateListByStorePage(selectedStore, current, pageSize); + if (response.statusCode === 200) { + return { + data: response.data.data, + success: true, + total: response.data.total + } + } + } + } + } + cardBordered + editable={{ + type: 'multiple', + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: pageSize, + onChange: (page) => setCurrent(page), + }} + dateFormatter="string" + headerTitle="档口管理" + toolBarRender={() => [ +
+
+ 当前门店: +
+ +
, + + ]} + /> + setIsModalOpen(false)}> +
+ - return ( - -
- { - if (selectedStore) { - const response = await cardAPI.GetGateListByStorePage(selectedStore, current, pageSize); - if (response.statusCode === 200) { - return { - data: response.data.data, - success: true, - total: response.data.total - } - } - } - } + + + + + + + + + { - setSelectedStore(value); - actionRef.current.reload(); - }}> - { - storeList.map(item => { - return - }) - } - -
, - - ]} - /> - setIsModalOpen(false)}> - - + + + + + + + + + + + + prevValues.mode !== currentValues.mode + } > + {({ getFieldValue }) => + (getFieldValue('mode') == '1') ? ( + + + + + ) : null + } + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - setHtml(editor.getHtml())} - mode="default" - style={{ height: '500px', overflowY: 'hidden' }} - /> -
- - - - -
+ > + + + + +
+ + setHtml(editor.getHtml())} + mode="default" + style={{ height: '500px', overflowY: 'hidden' }} + />
-
- ) + + + + +
+
+
+ ) } -export default Gate; \ No newline at end of file +export default Gate; diff --git a/src/pages/card/machine/index.jsx b/src/pages/card/machine/index.jsx index f2b80bc..2b0ad99 100644 --- a/src/pages/card/machine/index.jsx +++ b/src/pages/card/machine/index.jsx @@ -3,12 +3,12 @@ import styles from "./index.less"; import { PageContainer } from '@ant-design/pro-layout'; import { PlusOutlined } from '@ant-design/icons'; import ProTable from '@ant-design/pro-table'; -import { Button, Form, Input, Modal, Select, Popconfirm, message } from 'antd'; +import { Button, Form, Input, Modal, Select, Popconfirm, message,InputNumber } from 'antd'; import cardAPI from "../service"; /** * 刷卡机管理 - * @returns + * @returns */ const Machine = () => { const actionRef = useRef(); @@ -42,7 +42,7 @@ const Machine = () => { /** * 删除数据 - * @param {*} record + * @param {*} record */ const onDeleteTableRow = (record) => { console.log('删除', record) @@ -147,8 +147,11 @@ const Machine = () => { const onFetchGateList = async (storeId) => { const response = await cardAPI.GetGateListByStoreList(storeId); if (response.statusCode === 200) { - setGateList(response.data); + if(response.data.length>0) + {setGateList(response.data); setSelectedGate(response.data[0].id); + } + actionRef.current.reload(); } else { message.error(response.error || '获取档口列表失败'); @@ -290,18 +293,11 @@ const Machine = () => { - + { }, ]} > - + { ) } -export default Machine; \ No newline at end of file +export default Machine;