efats

src/pages/dish/edit/index.jsx

@@ -1,16 +1,28 @@
-import { addDish, updataDish, getDishById, getDishList } from '@/services/api/dish';
+import { addDish, updataDish, getDishById, getDishList, getFoodIngredientsList } from '@/services/api/dish';
 import { queryTable } from '@/utils/request';
-import { PageContainer, ProForm, ProFormDigit, ProFormText, ModalForm, Select, Option } from '@ant-design/pro-components';
+import { PageContainer, ProForm, ProFormDigit, ProFormText, ModalForm, ProFormSelect } from '@ant-design/pro-components';
 import { history, useSearchParams } from '@umijs/max';
-import { Card, Col, message, Row, Space, Image } from 'antd';
+import { Card, Col, message, Row, Space, Image, Select, Option } from 'antd';
 import { values } from 'lodash';
 import { useEffect, useRef, useState } from 'react';
 
 export default (props) => {
   const [searchParams, setSearchParams] = useSearchParams();
   const id = searchParams.get('id');
+  const [datas, setDatas] = useState([]);
   const [data, setData] = useState({});
   const formRef = useRef();
+  useEffect(() => {
+
+    getFoodIngredientsList().then((res) => {
+      setDatas(res?.records?.map((x) => ({
+        label: x.name,
+        value: x.dishId
+      })))
+
+    });
+  }, [id]);
+
   useEffect(() => {
     if (id) {
       getDishById(id).then((res) => {
@@ -22,7 +34,7 @@ export default (props) => {
   }, [id]);
 
   const onFinish = async (values) => {
-    console.log(values)
+
 
     if (id) {
       // 修改
@@ -40,7 +52,7 @@ export default (props) => {
 
     return false;
   };
-
+  console.log("datas", datas)
   return (
     <PageContainer>
       <Card>
@@ -70,11 +82,9 @@ export default (props) => {
         >
           <ProFormText name="name" label="菜肴名称" placeholder="请输入菜肴名称" width={460} />
           <ProFormText name="unit" label="菜肴单位" placeholder="请输入菜肴单位" width={460} />
-          {/* <Select label="包含食材" mode="multiple" >
-            <Option></Option>
-            <Option></Option>
-          </Select> */}
-
+          <ProFormSelect mode="multiple" label="包含食材" placeholder="多选下拉" width={460}
+            options={datas}
+          />
         </ProForm>
       </Card>
     </PageContainer>

src/pages/dish/list/index.jsx

@@ -39,10 +39,11 @@ const DishList = (props) => {
       title: '菜肴单位',
       dataIndex: 'unit',
     },
-    // {
-    //   title: '包含食材(种)',
-    //   dataIndex: 'status',
-    // },
+    {
+      title: '包含食材(种)',
+      dataIndex: 'status',
+      search: false,
+    },
     {
       title: '操作',
       valueType: 'option',

src/services/api/dish.js

@@ -7,6 +7,13 @@ import { request } from '@umijs/max';
  */
 export const getDishList = (params) => request('/dishes', { params });
 
+/**
+ * 查询食材列表
+ * @param {*} params
+ * @returns
+ */
+export const getFoodIngredientsList = (params) => request('/foodIngredients', { params });
+
 /**
  * 详情
  * @param {*} id