✨ feat(海科一卡通): 海科一卡通

添加菜品显示
1 년 전 · b53287f274
--- a/src/pages/card/gate/components/gateSetUp.jsx
+++ b/src/pages/card/gate/components/gateSetUp.jsx
@@ -0,0 +1,140 @@
 import React, { useState, useRef, useEffect } from 'react';
 import { Upload, Modal, Transfer, Input, Search, Tag, List, Button, message } from 'antd';
 import ProTable, { TableDropdown } from '@ant-design/pro-table';
 import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
 import cardAPI from "../../service";
 import { UploadOutlined } from '@ant-design/icons';

 const gateSetUp = (props) => {
  const actionRef = useRef();
  const [oneWay, setOneWay] = useState(true);
  const key = 'sendCoupon';
  // 右侧的集合
  const [targetKeys, setTargetKeys] = useState();
  //已选中
  const [selectedKeys, setSelectedKeys] = useState([]);
  const [mockDataAll, setMockDataAll] = useState([]);
  const [mockData, setMockData] = useState([]);
  //初始化数据
  useEffect(() => {
    const initCustomerInfo = async (value) => {
      cardAPI.GetDicList('GateSetUp').then((r) => {
        var arr = r.data;
        var list = [];
        if (r.succeeded) {
          arr.forEach((item) => {
            list.push({
              key: item.value,
              title: item.value,
              description: value,
              disabled: false,
              tag: item.value,
            });
          });
        }
        setMockData(list);
        setMockDataAll(list);
      });
    };
    initCustomerInfo();
  }, []);

  //选项在两栏之间转移时的回调函数
  const onChange = (nextTargetKeys, direction, moveKeys) => {
    setTargetKeys(nextTargetKeys);
  };

  //选中项发生改变时的回调函数
  const onSelectChange = (sourceSelectedKeys, targetSelectedKeys) => {
    setSelectedKeys([...sourceSelectedKeys, ...targetSelectedKeys]);
  };

  //选择列表滚动滚动
  const onScroll = (direction, e) => {};
  const onSearch = async (direction, value) => {
    if (direction == 'right') {
      return;
    }

  };

  //正定会员发卷
  const sendCoupon = async (props) => {
    if (targetKeys == undefined || targetKeys.length <= 0) {
      //正定会员发卷
      message.error('选择');
      return;
    }
    message.loading('正在添加...', key);
    try {
      var list = [];
      targetKeys.forEach((item) => {
        list.push({
          Key:item,
          GateId:props.values.id,
          IsShow:true
        });
      });
    cardAPI.AddGateSetUp(list).then((r) => {
        message.destroy(key);
        if (r.data) {
          message.success('添加成功');
          setTargetKeys([]);
          setSelectedKeys([]);
          props.onCancel();
        } else {
          message.error('添加失败');
        }
      });
      return true;
    } catch (error) {
      console.log(error);
      message.destroy(key);
      message.error('添加请重试！');
      return false;
    }
  };
  return (
    <Modal
      destroyOnClose
      visible={props.shows}
      width={700}
      onCancel={() => {
        setMockData(mockDataAll);
        props.onCancel();
      }}
      onOk={() => {
        sendCoupon(props);
        props.actionRef.current.reload();
      }}
    >
      <PageContainer
        header={{
          title: '设置屏幕显示',
          breadcrumb: {},
        }}
      >
        <Transfer
          oneWay={oneWay}
          showSearch
          showSelectAll
          onSearch={onSearch}
          dataSource={mockData}
          titles={['未选择', '已选中']}
          targetKeys={targetKeys}
          selectedKeys={selectedKeys}
          onChange={onChange}
          onSelectChange={onSelectChange}
          onScroll={onScroll}
          render={(item) => item.title}
          pagination={{ pageSize: 8 }}
          listStyle={{
            width: 500,
            height: 400,
          }}
        />
      </PageContainer>
    </Modal>
  );
 };
 export default gateSetUp;
--- a/src/pages/card/gate/components/setGateFood.jsx
+++ b/src/pages/card/gate/components/setGateFood.jsx
@@ -0,0 +1,143 @@
 import React, { useState, useRef, useEffect } from 'react';
 import { Upload, Modal, Transfer, Input, Search, Tag, List, Button, message } from 'antd';
 import ProTable, { TableDropdown } from '@ant-design/pro-table';
 import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
 import cardAPI from "../../service";
 import { UploadOutlined } from '@ant-design/icons';

 const setGateFood = (props) => {
  const actionRef = useRef();
  const [oneWay, setOneWay] = useState(true);
  const key = 'setGateFood';
  // 右侧的集合
  const [targetKeys, setTargetKeys] = useState();
  //已选中
  const [selectedKeys, setSelectedKeys] = useState([]);
  const [mockDataAll, setMockDataAll] = useState([]);
  const [mockData, setMockData] = useState([]);
  //初始化数据
  useEffect(() => {
    const initCustomerInfo = async (value) => {
      cardAPI.GetGoodsByMenuIdPage({
        "current": 1,
        "pageSize": 5000
      }).then((r) => {
        var arr = r.data.data;
        var list = [];
        if (r.succeeded) {
          arr.forEach((item) => {
            list.push({
              key: item.id,
              title: item.name,
              description: value,
              disabled: false,
              tag: item.name,
            });
          });
        }
        setMockData(list);
        setMockDataAll(list);
      });
    };
    initCustomerInfo();
  }, []);

  //选项在两栏之间转移时的回调函数
  const onChange = (nextTargetKeys, direction, moveKeys) => {
    setTargetKeys(nextTargetKeys);
  };

  //选中项发生改变时的回调函数
  const onSelectChange = (sourceSelectedKeys, targetSelectedKeys) => {
    setSelectedKeys([...sourceSelectedKeys, ...targetSelectedKeys]);
  };

  //选择列表滚动滚动
  const onScroll = (direction, e) => {};
  const onSearch = async (direction, value) => {
    if (direction == 'right') {
      return;
    }

  };

  //正定会员发卷
  const sendCoupon = async (props) => {
    if (targetKeys == undefined || targetKeys.length <= 0) {
      //正定会员发卷
      message.error('选择');
      return;
    }
    message.loading('正在添加...', key);
    try {
      var list = [];
      targetKeys.forEach((item) => {
        list.push({
          FoodId:item,
          GateId:props.values.id,
          FoodName:""
        });
      });
    cardAPI.AddGateFood(list).then((r) => {
        message.destroy(key);
        if (r.data) {
          message.success('添加成功');
          setTargetKeys([]);
          setSelectedKeys([]);
          props.onCancel();
        } else {
          message.error('添加失败');
        }
      });
      return true;
    } catch (error) {
      console.log(error);
      message.destroy(key);
      message.error('添加请重试！');
      return false;
    }
  };
  return (
    <Modal
      destroyOnClose
      visible={props.shows}
      width={700}
      onCancel={() => {
        setMockData(mockDataAll);
        props.onCancel();
      }}
      onOk={() => {
        sendCoupon(props);
        props.actionRef.current.reload();
      }}
    >
      <PageContainer
        header={{
          title: '设置屏幕显示',
          breadcrumb: {},
        }}
      >
        <Transfer
          oneWay={oneWay}
          showSearch
          showSelectAll
          onSearch={onSearch}
          dataSource={mockData}
          titles={['未选择', '已选中']}
          targetKeys={targetKeys}
          selectedKeys={selectedKeys}
          onChange={onChange}
          onSelectChange={onSelectChange}
          onScroll={onScroll}
          render={(item) => item.title}
          pagination={{ pageSize: 8 }}
          listStyle={{
            width: 500,
            height: 400,
          }}
        />
      </PageContainer>
    </Modal>
  );
 };
 export default setGateFood;
--- a/src/pages/card/gate/index.jsx
+++ b/src/pages/card/gate/index.jsx
@@ -8,6 +8,8 @@ import '@wangeditor/editor/dist/css/style.css'
 import { Editor, Toolbar } from '@wangeditor/editor-for-react'
 import axios from 'axios';
 import cardAPI from "../service";
 import GateSetUp from './components/gateSetUp';
 import SetGateFood from './components/setGateFood';


 /**
@@ -15,392 +17,427 @@ import cardAPI from "../service";
 * @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);
  const actionRef = useRef();
  const [modalForm] = Form.useForm();
  const [isModalOpen, setIsModalOpen] = useState(false);
  const [currentOption, setCurrentOption] = useState({ id: '' });
  const [GateSetUpIsVisible, GateSetUpVisible] = useState(false);
  const [SetGateFoodIsVisible, setGateFoodVisible] = useState(false);
  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 实例
  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(() => {
 		return () => {
 			if (editor == null) return
 			editor.destroy()
 			setEditor(null)
 		}
 	}, [editor])
  // 及时销毁 editor ，重要！
  useEffect(() => {
    return () => {
      if (editor == null) return
      editor.destroy()
      setEditor(null)
    }
  }, [editor])

 	/**
 	 * 点击编辑按钮
 	 * @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);
  }
  /**
   * 设置界面显示
   * @param {*} record
   */
  const onGateSet = (record) => {
    setCurrentOption(record);
    GateSetUpVisible(true);
  }
  const setGateFood = (record) => {
    setCurrentOption(record);
    setGateFoodVisible(true);
  }

 	/**
 	 * 点击新建
 	 */
 	const onCreateTableRow = () => {
 		setIsModalOpen(true);
 		editor.setHtml('');
 		setHtml('');
 		modalForm.resetFields();
 	}
  /**
   * 点击新建
   */
  const onCreateTableRow = () => {
    setIsModalOpen(true);
    if (editor) {
      editor.setHtml('');
    }
    setHtml('');
    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 <div>{find.store_Name}</div>
 				}
 			}
 		},
 		{
 			title: '属性',
 			dataIndex: 'mode',
 			valueType: 'select',
 			valueEnum: {
 				1: {
 					text: '固定',
 					status: 'Success',
 				},
 				2: {
 					text: '自由设定',
 					status: 'Success',
 				}
 			},
 		},
 		{
 			title: '金额',
 			dataIndex: 'price',
 		},
 		{
 			title: '状态',
 			dataIndex: 'status',
 			valueType: 'select',
 			valueEnum: {
 				0: {
 					text: '正常',
 					status: 'Success',
 				},
 				1: {
 					text: '禁用',
 					status: 'Error',
 				},
 				2: {
 					text: '删除',
 					status: 'Error',
 				}
 			},
 		},
 		{
 			title: '操作',
 			valueType: 'option',
 			key: 'option',
 			render: (text, record, _, action) => [
 				<a onClick={() => onEditTableRow(record)}>更新</a>
 			],
 		},
 	];
  const columns = [
    {
      title: '档口名称',
      dataIndex: 'name',
      ellipsis: true,
    },
    {
      title: '归属门店',
      dataIndex: 'storeId',
      render: (_, record) => {
        const find = storeList.find(item => item.id === record.storeId);
        if (find) {
          return <div>{find.store_Name}</div>
        }
      }
    },
    {
      title: '属性',
      dataIndex: 'mode',
      valueType: 'select',
      valueEnum: {
        1: {
          text: '固定',
          status: 'Success',
        },
        2: {
          text: '自由设定',
          status: 'Success',
        }
      },
    },
    {
      title: '金额',
      dataIndex: 'price',
    },
    {
      title: '状态',
      dataIndex: 'status',
      valueType: 'select',
      valueEnum: {
        0: {
          text: '正常',
          status: 'Success',
        },
        1: {
          text: '禁用',
          status: 'Error',
        },
        2: {
          text: '删除',
          status: 'Error',
        }
      },
    },
    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      render: (text, record, _, action) => [
        <a onClick={() => onEditTableRow(record)}>更新</a>,
        <a onClick={() => setGateFood(record)}>设置菜品</a>,
        <a onClick={() => onGateSet(record)}>设置屏幕显示</a>
      ],
    },
  ];

 	/**
 	 * 获取店铺列表
 	 */
 	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 || '获取店铺列表失败');
 		}
 	}
  /**
   * 获取店铺列表
   */
  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 (
 		<PageContainer>
 			<div className={styles.member_card_container}>
 				<ProTable
 					columns={columns}
 					actionRef={actionRef}
 					request={
 						async () => {
 							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={() => [
 						<div className={styles.table_search_item}>
 							<div>
 								当前门店：
 							</div>
 							<Select style={{ width: 300 }} value={selectedStore} onChange={(value) => {
 								setSelectedStore(value);
 								actionRef.current.reload();
 							}}>
 								{
 									storeList.map(item => {
 										return <Option value={item.id} key={item.id}>{item.store_Name}</Option>
 									})
 								}
 							</Select>
 						</div>,
 						<Button key="button" icon={<PlusOutlined />} type="primary" onClick={onCreateTableRow}>
 							新建
 						</Button>
 					]}
 				/>
 				<Drawer destroyOnClose width='100%' title={currentOption.id ? '编辑档口' : '添加档口'} visible={isModalOpen} onClose={() => setIsModalOpen(false)}>
 					<Form
 						name="basic"
 						onFinish={onFinish}
 						form={modalForm}
 						labelCol={{ span: 4 }}
 					>
 						<Form.Item
 							label="id"
 							name="id"
 							hidden={true}
 						>
 							<Input size="large" />
 						</Form.Item>
  return (
    <PageContainer>
      <div className={styles.member_card_container}>
        <ProTable
          columns={columns}
          actionRef={actionRef}
          request={
            async () => {
              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={() => [
            <div className={styles.table_search_item}>
              <div>
                当前门店：
              </div>
              <Select style={{ width: 300 }} value={selectedStore} onChange={(value) => {
                setSelectedStore(value);
                actionRef.current.reload();
              }}>
                {
                  storeList.map(item => {
                    return <Option value={item.id} key={item.id}>{item.store_Name}</Option>
                  })
                }
              </Select>
            </div>,
            <Button key="button" icon={<PlusOutlined />} type="primary" onClick={onCreateTableRow}>
              新建
            </Button>
          ]}
        />
        <Drawer destroyOnClose width='100%' title={currentOption.id ? '编辑档口' : '添加档口'} visible={isModalOpen} onClose={() => setIsModalOpen(false)}>
          <Form
            name="basic"
            onFinish={onFinish}
            form={modalForm}
            labelCol={{ span: 4 }}
          >
            <Form.Item
              label="id"
              name="id"
              hidden={true}
            >
              <Input size="large" />
            </Form.Item>

 						<Row>
 							<Col xs={12} sm={12} md={12} lg={12} xl={12}>
 								<Form.Item
 									label="档口名称"
 									name="name"
 									rules={[
 										{
 											required: true,
 											message: '请输入档口名称！',
 										},
 									]}
 								>
 									<Input size="large" />
 								</Form.Item>
 							</Col>
 							<Col xs={12} sm={12} md={12} lg={12} xl={12}>
 								<Form.Item
 									label="归属门店"
 									name="storeId"
 									rules={[
 										{
 											required: true,
 											message: '请输入归属门店！',
 										},
 									]}
 								>
 									<Select size="large">
 										{
 											storeList.map(store => {
 												return (
 													<Select.Option key={store.id} value={store.id}>{store.store_Name}</Select.Option>
 												)
 											})
 										}
 									</Select>
 								</Form.Item>
 							</Col>
 							<Col xs={12} sm={12} md={12} lg={12} xl={12}>
 								<Form.Item
 									label="属性"
 									name="mode"
 									rules={[
 										{
 											required: true,
 											message: '请输入选择属性！',
 										},
 									]}
 								>
 									<Select size="large">
 										<Select.Option value={1}>固定金额</Select.Option>
 										<Select.Option value={2}>自由设定</Select.Option>
 									</Select>
 								</Form.Item>
 							</Col>
 							<Col xs={12} sm={12} md={12} lg={12} xl={12}>
            <Row>
              <Col xs={12} sm={12} md={12} lg={12} xl={12}>
                <Form.Item
                  label="档口名称"
                  name="name"
                  rules={[
                    {
                      required: true,
                      message: '请输入档口名称！',
                    },
                  ]}
                >
                  <Input size="large" />
                </Form.Item>
              </Col>
              <Col xs={12} sm={12} md={12} lg={12} xl={12}>
                <Form.Item
                  label="归属门店"
                  name="storeId"
                  rules={[
                    {
                      required: true,
                      message: '请输入归属门店！',
                    },
                  ]}
                >
                  <Select size="large">
                    {
                      storeList.map(store => {
                        return (
                          <Select.Option key={store.id} value={store.id}>{store.store_Name}</Select.Option>
                        )
                      })
                    }
                  </Select>
                </Form.Item>
              </Col>
              <Col xs={12} sm={12} md={12} lg={12} xl={12}>
                <Form.Item
                  label="属性"
                  name="mode"
                  rules={[
                    {
                      required: true,
                      message: '请输入选择属性！',
                    },
                  ]}
                >
                  <Select size="large">
                    <Select.Option value={1}>固定金额</Select.Option>
                    <Select.Option value={2}>自由设定</Select.Option>
                  </Select>
                </Form.Item>
              </Col>
              <Col xs={12} sm={12} md={12} lg={12} xl={12}>

 								<Form.Item
 									noStyle
 									shouldUpdate={(prevValues, currentValues) =>
 										prevValues.mode !== currentValues.mode
 									}  >
 									{({ getFieldValue }) =>
 										(getFieldValue('mode') == '1') ? (
 											<Form.Item
 												label="金额"
 												name="price"
 												rules={[
 													{
 														required: true,
 														message: '请输入金额！',
 													},
 												]}
 											>
 												<Input size="large" />
 											</Form.Item>
                <Form.Item
                  noStyle
                  shouldUpdate={(prevValues, currentValues) =>
                    prevValues.mode !== currentValues.mode
                  }  >
                  {({ getFieldValue }) =>
                    (getFieldValue('mode') == '1') ? (
                      <Form.Item
                        label="金额"
                        name="price"
                        rules={[
                          {
                            required: true,
                            message: '请输入金额！',
                          },
                        ]}
                      >
                        <Input size="large" />
                      </Form.Item>

 										) : null
 									}
 								</Form.Item>
                    ) : null
                  }
                </Form.Item>

 							</Col>
 							<Col xs={12} sm={12} md={12} lg={12} xl={12}>
 								<Form.Item
 									label="状态"
 									name="status"
              </Col>
              <Col xs={12} sm={12} md={12} lg={12} xl={12}>
                <Form.Item
                  label="状态"
                  name="status"

 								>
 									<Select size="large" defaultValue={1}>
 										<Option value={0}>正常</Option>
 										<Option value={1}>禁用</Option>
 									</Select>
 								</Form.Item>
 							</Col>
 						</Row>
 						<div style={{ border: '1px solid #ccc', zIndex: 100 }}>
 							<Toolbar
 								editor={editor}
 								defaultConfig={toolbarConfig}
 								mode="default"
 								style={{ borderBottom: '1px solid #ccc' }}
 							/>
 							<Editor
 								defaultConfig={editorConfig}
 								value={html}
 								onCreated={setEditor}
 								onChange={editor => setHtml(editor.getHtml())}
 								mode="default"
 								style={{ height: '500px', overflowY: 'hidden' }}
 							/>
 						</div>
 						<Form.Item>
 							<Button type="primary" htmlType="submit" style={{ marginTop: '10px' }}>
 								确定
 							</Button>
 						</Form.Item>
 					</Form>
 				</Drawer>
 			</div>
 		</PageContainer>
 	)
                >
                  <Select size="large" defaultValue={1}>
                    <Option value={0}>正常</Option>
                    <Option value={1}>禁用</Option>
                  </Select>
                </Form.Item>
              </Col>
            </Row>
            <div style={{ border: '1px solid #ccc', zIndex: 100 }}>
              <Toolbar
                editor={editor}
                defaultConfig={toolbarConfig}
                mode="default"
                style={{ borderBottom: '1px solid #ccc' }}
              />
              <Editor
                defaultConfig={editorConfig}
                value={html}
                onCreated={setEditor}
                onChange={editor => setHtml(editor.getHtml())}
                mode="default"
                style={{ height: '500px', overflowY: 'hidden' }}
              />
            </div>
            <Form.Item>
              <Button type="primary" htmlType="submit" style={{ marginTop: '10px' }}>
                确定
              </Button>
            </Form.Item>
          </Form>
        </Drawer>
        <GateSetUp
          shows={GateSetUpIsVisible}
          values={currentOption}
          actionRef={actionRef}
          onCancel={() => {
            GateSetUpVisible(false);
          }}
        />
        <SetGateFood
          shows={SetGateFoodIsVisible}
          values={currentOption}
          actionRef={actionRef}
          onCancel={() => {
            setGateFoodVisible(false);
          }}
        />

      </div>
    </PageContainer>
  )
 }

 export default Gate;
--- a/src/pages/card/service.js
+++ b/src/pages/card/service.js
@@ -1,204 +1,234 @@
 import { request } from 'umi';

 export default {
    //获取所有门店
    GetAllStore() {
 		return request('/kitchen/api/StoreHelper/GetAllStore', {
 			method: 'GET',
            headers: {
                TenantId: ''
            }
 		});
 	},

    //获取会员分页
    GetMemberListByPage(data) {
        return request('/kitchen/api/member/member-page-query', {
            method: 'POST',
            data
        });
    },

    //绑定会员
    OnBindMember(data) {
        return request('/kitchen/api/member/member-binding-cards', {
            method: 'POST',
            data
        });
    },

    //查询会员账户/卡号消费记录
    GetMemberAccountCardConsRecord(data) {
        return request('/kitchen/api/member/member-account-amount-page', {
            method: 'POST',
            data
        });
    },

    /**
     * 获取会员消费记录总次数和总人数
     * @param {*} data 
     * @returns 
     */
    GetMemberAccountRecordTotal(data) {
        return request('/kitchen/api/member/member-account-record-total', {
            method: 'POST',
            data
        });
    },

    /** 档口管理：Start */
    // 新增档口
    AddGate(data) {
        return request(`/kitchen/api/GateInfo/add`, {
            method: 'POST',
            data
        });
    },

    //档口状态修改
    EnableGate(data, TenantId = '') {
        return request(`/kitchen/api/GateInfo/Enable`, {
            method: 'POST',
            data,
            headers: {
                TenantId: TenantId
            }
        });
    },

    //根据门店ID查询 档口分页列表
    GetGateListByStorePage(StoreId, Current, PageSize, TenantId = '') {
        return request(`/kitchen/api/GateInfo/gatelist?StoreId=${StoreId}&Current=${Current}&PageSize=${PageSize}`, {
            method: 'GET',
            headers: {
                TenantId: TenantId
            }
        });
    },

    //根据门店ID查询 档口分页列表
    GetGateListByStorePageNew(StoreId, Current, PageSize, TenantId = '') {
        return request(`/kitchen/api/one-card/gate-list?StoreId=${StoreId}&Current=${Current}&PageSize=${PageSize}`, {
            method: 'GET',
            headers: {
                TenantId: TenantId
            }
        });
    },

    //根据门店ID查询 档口列表
    GetGateListByStoreList(StoreId) {
        return request(`/kitchen/api/GateInfo/gatealllist?StoreId=${StoreId}`, {
            method: 'GET'
        });
    },

    //更新档口信息
    UpdateGateInfo(data, TenantId = '') {
        return request(`/kitchen/api/GateInfo/Update`, {
            method: 'POST',
            data,
            headers: {
                TenantId: TenantId
            }
        });
    },

    UpdateGateInfoNew(data, TenantId = '') {
        return request(`/kitchen/api/one-card`, {
            method: 'PUT',
            data,
            headers: {
                TenantId: TenantId
            }
        });
    },

    /** 档口管理：End */

    /** 刷卡机管理：Start */
    //  新增刷卡机
    PayCardAdd(data) {
        return request(`/kitchen/api/PayCard/add`, {
            method: 'POST',
            data
        });
    },

    //刷卡机状态更改
    PayCardEnable(data) {
        return request(`/kitchenapi/PayCard/enable`, {
            method: 'POST',
            data
        });
    },

    //根据档口信息查询刷卡机列表
    PayCardByGateId(GateId, Current, PageSize) {
        return request(`/kitchen/api/PayCard/gateList?GateId=${GateId}&Current=${Current}&PageSize=${PageSize}`, {
            method: 'GET'
        });
    },

    //更新刷卡机信息
    UpdatePayCardInfo(data) {
        return request(`/kitchen/api/PayCard/update`, {
            method: 'POST',
            data
        });
    },
    /** 刷卡机管理：End */

    GetCosRequestURL(data) {
 		return request(`/kitchen/api/systemconfig/GetCosRequestSignURL`, {
 			method: 'POST',
 			data: data,
 		});
 	},



    /** 会员账户管理： Start */
    //获取会员账户列表
    GetMemberAccountPageList(data) {
        return request(`/kitchen/api/member/member-account-page-list`, {
 			method: 'POST',
 			data: data,
 		});
    },

    //更新会员账户状态
    UpdateMemberAccountStatus(data) {
        return request(`/kitchen/api/member/member-account-status`, {
 			method: 'POST',
 			data: data,
 		});
    },
    /** 会员账户管理： End */

    //获取会员储值卡列表
    GetMemberCardPageList(data) {
        return request(`/kitchen/api/member/mmenber-card-page`, {
 			method: 'POST',
 			data: data,
 		});
    },

    //添加会员储值卡
    AddMemberCard(data) {
        return request(`/kitchen/api/member/mmenber-card`, {
 			method: 'POST',
 			data: data,
 		});
    },

    //修改会员卡状态
    UpdateMemberCardState(data) {
        return request(`/kitchen/api/member/mmenber-card-state`, {
 			method: 'PUT',
 			data: data,
 		});
    },

 }
  //获取所有门店
  GetAllStore() {
    return request('/kitchen/api/StoreHelper/GetAllStore', {
      method: 'GET',
      headers: {
        TenantId: ''
      }
    });
  },

  //获取会员分页
  GetMemberListByPage(data) {
    return request('/kitchen/api/member/member-page-query', {
      method: 'POST',
      data
    });
  },

  //绑定会员
  OnBindMember(data) {
    return request('/kitchen/api/member/member-binding-cards', {
      method: 'POST',
      data
    });
  },

  //查询会员账户/卡号消费记录
  GetMemberAccountCardConsRecord(data) {
    return request('/kitchen/api/member/member-account-amount-page', {
      method: 'POST',
      data
    });
  },

  /**
   * 获取会员消费记录总次数和总人数
   * @param {*} data
   * @returns
   */
  GetMemberAccountRecordTotal(data) {
    return request('/kitchen/api/member/member-account-record-total', {
      method: 'POST',
      data
    });
  },

  /** 档口管理：Start */
  // 新增档口
  AddGate(data) {
    return request(`/kitchen/api/GateInfo/add`, {
      method: 'POST',
      data
    });
  },

  //档口状态修改
  EnableGate(data, TenantId = '') {
    return request(`/kitchen/api/GateInfo/Enable`, {
      method: 'POST',
      data,
      headers: {
        TenantId: TenantId
      }
    });
  },

  //根据门店ID查询 档口分页列表
  GetGateListByStorePage(StoreId, Current, PageSize, TenantId = '') {
    return request(`/kitchen/api/GateInfo/gatelist?StoreId=${StoreId}&Current=${Current}&PageSize=${PageSize}`, {
      method: 'GET',
      headers: {
        TenantId: TenantId
      }
    });
  },

  //根据门店ID查询 档口分页列表
  GetGateListByStorePageNew(StoreId, Current, PageSize, TenantId = '') {
    return request(`/kitchen/api/one-card/gate-list?StoreId=${StoreId}&Current=${Current}&PageSize=${PageSize}`, {
      method: 'GET',
      headers: {
        TenantId: TenantId
      }
    });
  },

  //根据门店ID查询 档口列表
  GetGateListByStoreList(StoreId) {
    return request(`/kitchen/api/GateInfo/gatealllist?StoreId=${StoreId}`, {
      method: 'GET'
    });
  },

  //更新档口信息
  UpdateGateInfo(data, TenantId = '') {
    return request(`/kitchen/api/GateInfo/Update`, {
      method: 'POST',
      data,
      headers: {
        TenantId: TenantId
      }
    });
  },

  UpdateGateInfoNew(data, TenantId = '') {
    return request(`/kitchen/api/one-card`, {
      method: 'PUT',
      data,
      headers: {
        TenantId: TenantId
      }
    });
  },

  /** 档口管理：End */

  /** 刷卡机管理：Start */
  //  新增刷卡机
  PayCardAdd(data) {
    return request(`/kitchen/api/PayCard/add`, {
      method: 'POST',
      data
    });
  },

  //刷卡机状态更改
  PayCardEnable(data) {
    return request(`/kitchenapi/PayCard/enable`, {
      method: 'POST',
      data
    });
  },

  //根据档口信息查询刷卡机列表
  PayCardByGateId(GateId, Current, PageSize) {
    return request(`/kitchen/api/PayCard/gateList?GateId=${GateId}&Current=${Current}&PageSize=${PageSize}`, {
      method: 'GET'
    });
  },

  //更新刷卡机信息
  UpdatePayCardInfo(data) {
    return request(`/kitchen/api/PayCard/update`, {
      method: 'POST',
      data
    });
  },
  /** 刷卡机管理：End */

  GetCosRequestURL(data) {
    return request(`/kitchen/api/systemconfig/GetCosRequestSignURL`, {
      method: 'POST',
      data: data,
    });
  },



  /** 会员账户管理： Start */
  //获取会员账户列表
  GetMemberAccountPageList(data) {
    return request(`/kitchen/api/member/member-account-page-list`, {
      method: 'POST',
      data: data,
    });
  },

  //更新会员账户状态
  UpdateMemberAccountStatus(data) {
    return request(`/kitchen/api/member/member-account-status`, {
      method: 'POST',
      data: data,
    });
  },
  /** 会员账户管理： End */

  //获取会员储值卡列表
  GetMemberCardPageList(data) {
    return request(`/kitchen/api/member/mmenber-card-page`, {
      method: 'POST',
      data: data,
    });
  },

  //添加会员储值卡
  AddMemberCard(data) {
    return request(`/kitchen/api/member/mmenber-card`, {
      method: 'POST',
      data: data,
    });
  },

  //修改会员卡状态
  UpdateMemberCardState(data) {
    return request(`/kitchen/api/member/mmenber-card-state`, {
      method: 'PUT',
      data: data,
    });
  },
  //获取数据
  GetDicList(TypeCode) {
    return request(`/kitchen/api/dict-data/dic-list/${TypeCode}`, {
      method: 'Get',
    });
  },
  AddGateSetUp(data) {
    return request(`/kitchen/api/GateInfo/AddGateSetUp`, {
      method: 'POST',
      data
    });
  },
  GetFoodList(TypeCode) {
    return request(`/kitchen/api/dict-data/dic-list/${TypeCode}`, {
      method: 'Get',
    });
  },
  AddGateFood(data) {
    return request(`/kitchen/api/GateInfo/AddGateFood`, {
      method: 'POST',
      data
    });
  },
  GetGoodsByMenuIdPage(params) {
    return request('/kitchen/api/FoodMenu/GetGoodsByMenuIdPage', {
      method: 'POST',
      data: {
        ...params,
      },
    });
  }
 }