From 20bd25b20d362318aed5f3a72a19cfb2b688e418 Mon Sep 17 00:00:00 2001
From: gwbvipvip <gwbvipvip@163.com>
Date: Mon, 19 Feb 2024 14:14:45 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../database/bom/components/CreateBom.jsx     | 145 ++++++++++++++++++
 src/pages/database/bom/index.jsx              | 118 +++++++++-----
 src/pages/database/bom/services.js            |  22 +++
 .../goods/goodsInfo/components/CreateBom.jsx  |   2 +
 4 files changed, 250 insertions(+), 37 deletions(-)
 create mode 100644 src/pages/database/bom/components/CreateBom.jsx

diff --git a/src/pages/database/bom/components/CreateBom.jsx b/src/pages/database/bom/components/CreateBom.jsx
new file mode 100644
index 0000000..0e88c7f
--- /dev/null
+++ b/src/pages/database/bom/components/CreateBom.jsx
@@ -0,0 +1,145 @@
+import React, { useState, useRef } from 'react';
+import { Button, Modal, Form, Input, Select, Divider, Space, message } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import { EditableProTable } from '@ant-design/pro-table';
+import { AddBomType } from '../services';
+
+const App = (props) => {
+
+  const [form] = Form.useForm();
+  const inputRef = useRef(null);
+  const [typename, settypename] = useState('');
+  const [dataSource, setDataSource] = useState([]);
+  const [editableKeys, setEditableRowKeys] = useState([]);
+  
+  const onNameChange = (event) => {
+    settypename(event.target.value);
+  }
+
+  const columns = [
+    {
+      title: '物料名称',
+      dataIndex: 'batchingId',
+      formItemProps: (form, { rowIndex }) => {
+        return {
+          rules:
+            rowIndex > 1 ? [{ required: true, message: '此项为必填项' }] : [],
+        };
+      },
+      valueType: 'select',
+      fieldProps: {
+        showSearch: true,
+        options: props.matedata.map((item, index) => { return { label: item.name, value: item.id } })
+      },
+      width: '25%',
+    },
+    {
+      title: '用量',
+      dataIndex: 'dosage',
+      valueType: 'digit',
+      width: '15%',
+    },
+    {
+      title: '操作',
+      valueType: 'option',
+      width: '15%',
+      render: () => {
+        return null;
+      },
+    },
+  ]
+
+
+  const addItem = (e) => {
+    e.preventDefault();
+    if (typename.length == 0) {
+      message.error("请输入名称");
+    } else {
+      var parm = { name: typename }
+      AddBomType(parm).then((r) => {
+        if (r.succeeded) {
+          message.success('添加成功');
+          props.initTypeList();
+          settypename('');
+        } else {
+          message.error(r.errors);
+        }
+      })
+    }
+
+  }
+
+  return (
+    <>
+
+      <Modal title="Basic Modal" 
+      onCancel={props.onCancel} 
+      open={props.modalVisible} >
+        <Form layout="horizontal" preserve={false} form={form}  >
+
+          <Form.Item name="bomName" label="配方名称" rules={[{ required: true, message: '配方名称' }]}>
+            <Input placeholder="请输入配方名称" />
+          </Form.Item>
+
+          <Form.Item name="bomTypeList" rules={[{ required: true, message: '配方分类' }]} label="配方分类" >
+            <Select
+              style={{ width: '100%' }}
+              mode="tags"
+              placeholder="请选配方分类"
+              options={props.bomTypeData}
+              dropdownRender={(menu) => (
+                <>
+                  {menu}
+                  <Divider style={{ margin: '8px 0' }} />
+                  <Space style={{ padding: '0 8px 4px' }}>
+                    <Input
+                      placeholder="请输入配方分类"
+                      ref={inputRef}
+                      value={typename}
+                      onChange={onNameChange}
+                      onKeyDown={(e) => e.stopPropagation()}
+                    />
+                    <Button type="text" icon={<PlusOutlined />} onClick={addItem}>
+                      新增
+                    </Button>
+                  </Space>
+                </>
+              )}
+            />
+          </Form.Item>
+        </Form>
+        <EditableProTable
+          headerTitle={<span><span style={{ color: 'red', marginRight: 3 }}>*</span>配方详情</span>}
+          columns={columns}
+          rowKey="id"
+          value={dataSource}
+          onChange={setDataSource}
+          recordCreatorProps={{
+            newRecordType: 'dataSource',
+            record: () => ({
+              id: Date.now(),
+            }),
+          }}
+
+          editable={{
+            type: 'multiple',
+            editableKeys,
+            actionRender: (row, config, defaultDoms) => {
+              return [defaultDoms.delete, defaultDoms.Button];
+            },
+            onValuesChange: (record, recordList) => {
+              setDataSource(recordList);
+            },
+            onDelete: async (key, row) => {
+              console.log(key)
+              console.log(row)
+
+            },
+            onChange: setEditableRowKeys,
+          }} />
+
+      </Modal>
+    </>
+  );
+};
+export default App;
\ No newline at end of file
diff --git a/src/pages/database/bom/index.jsx b/src/pages/database/bom/index.jsx
index 564af0a..3da88cb 100644
--- a/src/pages/database/bom/index.jsx
+++ b/src/pages/database/bom/index.jsx
@@ -1,18 +1,54 @@
 import { PlusOutlined } from '@ant-design/icons';
-import { Button, message, Input, Drawer, Modal, Space, Tag,Popconfirm } from 'antd';
+import { Button, message, Input, Drawer, Modal, Space, Tag, Popconfirm } from 'antd';
 import React, { useState, useRef, useEffect } from 'react';
 import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
 import ProTable from '@ant-design/pro-table';
-import {bomPage} from './services';
+import { bomPage, getproductpage,GetbomTypelist } from './services';
+import CreateBom from './components/CreateBom';
 
 const GoodsBomsManage = (props) => {
   const actionRef = useRef();
   const [modalVisible, setModalVisible] = useState(false);
+  const [matedata, setMatedata] = useState([]);
+  const [bomTypeData,setbomTypeData]= useState([]);
 
   useEffect(() => {
+    intBatching();//默认原料
 
   }, []);
 
+  function intBatching() {
+    getproductpage().then((r) => {
+      setMatedata(r.data);
+    });
+  }
+  function initTypeList() {
+    initGetbomType();
+  }
+  function initGetbomType() {
+    GetbomTypelist().then((r) => {
+      var list = [];
+      if (r.data.length > 0) {
+        r.data.forEach((item) => {
+          list.push({ text: item.name, value: item.id, label: item.name });
+        });
+      }
+      setbomTypeData(list)
+    })
+
+  }
+  function initGetbomType(){
+    GetbomTypelist().then((r)=>{
+      var list = [];
+      if (r.data.length > 0) {
+        r.data.forEach((item) => {
+          list.push({ text: item.name, value: item.id, label: item.name });
+        });
+      }
+      setbomTypeData(list)
+    })
+   
+  }
 
   const columns = [
     {
@@ -76,7 +112,7 @@ const GoodsBomsManage = (props) => {
           okText="是"
           cancelText="否"
           onConfirm={async () => {
-            
+
           }}
           onCancel={() => { }}
         >
@@ -92,42 +128,50 @@ const GoodsBomsManage = (props) => {
       title: '',
       breadcrumb: {},
     }}>
-       <ProTable
-          columns={columns}
-          actionRef={actionRef}
-          rowKey="id"
-          toolBarRender={() => [
-            <Button
-              type="primary"
-              key="primary"
-              onClick={() => {
-                setModalVisible(true);
-              }}
-            >
-              <PlusOutlined /> 新建
-            </Button>,
-          ]}
+      <ProTable
+        columns={columns}
+        actionRef={actionRef}
+        rowKey="id"
+        toolBarRender={() => [
+          <Button
+            type="primary"
+            key="primary"
+            onClick={() => {
+              setModalVisible(true);
+            }}
+          >
+            <PlusOutlined /> 新建
+          </Button>,
+        ]}
+
+        request={async (params) => {
+          var total = 0;
+          var data = [];
+          const res = await bomPage(params);
+          if (res.statusCode == 200) {
+            data = res.data.data;
+            total = res.data.total;
+          }
+          return {
+            data: data,
+            success: true,
+            total: total,
+          };
+
+        }}
+        rowSelection={{
+          onChange: (_, selectedRows) => setSelectedRows(selectedRows),
+        }}
+      />
+
+      {/* 新增菜谱 */}
+      <CreateBom modalVisible={modalVisible}
+        matedata={matedata}
+        initTypeList={initTypeList}
+        onCancel={() => { setModalVisible(false); }}
+      />
 
-          request={async (params) => {
-            var total = 0;
-            var data=[];
-              const res = await bomPage(params);
-              if(res.statusCode==200){
-                data=res.data.data;
-                total=res.data.total;
-              }
-              return {
-                data: data,
-                success: true,
-                total: total,
-              };
 
-          }}
-          rowSelection={{
-            onChange: (_, selectedRows) => setSelectedRows(selectedRows),
-          }}
-        />
-      
     </PageContainer>
   );
 };
diff --git a/src/pages/database/bom/services.js b/src/pages/database/bom/services.js
index d6df3e0..2120a38 100644
--- a/src/pages/database/bom/services.js
+++ b/src/pages/database/bom/services.js
@@ -8,4 +8,26 @@ export async function bomPage(data) {
     });
   }
 
+  export async function AddBomType (data) {
+    return request(getDataBaseUrl()+`/api/bom/addbomtype`, {
+      method: 'Post',
+      data: data,
+      // params: { ...params },
+      // ...(options || {}),
+    });
+  }
+
+  export async function getproductpage(params) {
+    return request(getDataBaseUrl()+'/api/batching/getbatchingselectlist', {
+      method: 'Get',
+    });
+  }
+
+  export async function GetbomTypelist (data) {
+    return request(getDataBaseUrl()+`/api/bom/getbomtypelist`, {
+      method: 'Get',
+      // params: { ...params },
+      // ...(options || {}),
+    });
+  }
 
diff --git a/src/pages/database/goods/goodsInfo/components/CreateBom.jsx b/src/pages/database/goods/goodsInfo/components/CreateBom.jsx
index 6600c04..d1a973d 100644
--- a/src/pages/database/goods/goodsInfo/components/CreateBom.jsx
+++ b/src/pages/database/goods/goodsInfo/components/CreateBom.jsx
@@ -214,6 +214,8 @@ const GoodsbomFrom = (props) => {
           </Select>
         </Form.Item>
       </Form>
+
+      
       <span><span style={{color:'red',marginRight: 3}}>*</span>商品属性</span>
       {
             props.goodsAttriburteData == undefined ? '' :(