人日新需求修改

src/pages/PurchaseAdmin/PurchaseList/Approval/ApprovalModal.js

@@ -1,8 +1,10 @@
 import React, { useState, useEffect } from 'react';
-import { Form, Select, Modal, Input, TreeSelect } from 'antd';
+import { Form, Select, Modal, Input, TreeSelect, Button } from 'antd';
 import moment from 'moment';
 import provinces from './provinces';
 import { queryApproval } from '@/services/approval';
+import FirmModal from './ManufacturerModal';
+import TableRender from './TableRender';
 const { Option } = Select;
 const { TreeNode } = TreeSelect;
 // 新建
@@ -21,6 +23,8 @@ function AddModal(props) {
     typeList = [],
     disabled,
     loading,
+    supplierList = [],
+    onAddFirm,
   } = props;
   const [form] = Form.useForm();
   const [codes, setCodes] = useState({
@@ -31,6 +35,7 @@ function AddModal(props) {
     version: '',
   });
   const [type, setType] = useState({});
+  const [addFirmVisible, setAddFirmVisible] = useState(false);
 
   const handleOk = () => {
     form.validateFields().then(fieldsValue => {
@@ -54,6 +59,8 @@ function AddModal(props) {
       } else {
         values.author = null;
       }
+      const supplierName = supplierList.find(item => item.id == fieldsValue.supplier_id)?.name;
+      if (supplierName) values.supplier_name = supplierName;
       onOk(values);
     });
   };
@@ -136,6 +143,35 @@ function AddModal(props) {
             ))}
           </Select>
         </Form.Item>
+        <Form.Item
+          label="项目客户"
+          name="supplier_id"
+          initialValue={data.supplier_id}
+          rules={[{ required: true, message: '请选择项目客户' }]}
+        >
+          <Select style={{ width: '100%' }} onChange={e => form.setFieldsValue({ supplier_id: e })}>
+            {supplierList.map(item => (
+              <Option key={item.id} value={item.id}>
+                {item.name}({item.id})
+              </Option>
+            ))}
+          </Select>
+          <Button
+            style={{ position: 'absolute', right: ' -95px' }}
+            type="primary"
+            onClick={onAddFirm}
+          >
+            新建客户
+          </Button>
+        </Form.Item>
+        <Form.Item
+          label="项目规模"
+          name="process_info"
+          // initialValue={String(data.industry_id || '')}
+          rules={[{ required: true, message: '请填写项目规模' }]}
+        >
+          <TableRender />
+        </Form.Item>
         <Form.Item
           label="项目地区"
           name="location"

src/pages/PurchaseAdmin/PurchaseList/Approval/DetailModal.js

@@ -1,6 +1,9 @@
 import React, { useState, useEffect, useMemo } from 'react';
-import { Form, Modal, Steps } from 'antd';
+import { Form, Modal, Steps, Tabs } from 'antd';
 import styles from './DetailModal.less';
+import TableRender from './TableRender';
+import MemberModal from './MemberModal';
+import StatusRender from './StatusRender';
 
 const { Step } = Steps;
 // 新建
@@ -81,6 +84,12 @@ function DetailModal(props) {
             {data.OptManager.CName}
           </Form.Item>
         )}
+        <Form.Item className={styles.formItem} label="项目规模">
+          <TableRender
+            onlyShow={true}
+            value={'[{"type":"UF","scale":"10"},{"type":"RO","scale":"20"}]'}
+          />
+        </Form.Item>
       </Form>
     </>
   );
@@ -110,11 +119,12 @@ function DetailModal(props) {
     }
   };
 
+  console.log(flow.Nodes);
+
   const renderAuth = () => (
     <div className={styles.authDetail}>
       <div className={styles.subTitle}>审核详情</div>
       <Steps className={styles.auth} current={current}>
-        {/* <Steps current={data?.node_id}> */}
         {(flow.Nodes || []).map(item => (
           <Step key={item.id} title={item.node} description={`审批人：${getAudits(item)}`} />
         ))}
@@ -124,9 +134,19 @@ function DetailModal(props) {
 
   return (
     <Modal title="项目详情" width={800} visible={visible} onCancel={onClose} footer={null}>
-      {/* {data.type_id != 7 && renderDetail()} */}
       {renderDetail()}
-      {data.audit_status != 0 && renderAuth()}
+      {/* {data.audit_status != 0 && renderAuth()} */}
+      <Tabs defaultActiveKey="3">
+        <Tabs.TabPane tab="成员管理" key="1">
+          <MemberModal currentItem={data} />
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="审核详情" key="2">
+          {renderAuth()}
+        </Tabs.TabPane>
+        <Tabs.TabPane tab="状态记录" key="3">
+          <StatusRender />
+        </Tabs.TabPane>
+      </Tabs>
     </Modal>
   );
 }

src/pages/PurchaseAdmin/PurchaseList/Approval/List.js

@@ -1,5 +1,16 @@
 import React, { useState, useEffect } from 'react';
-import { Table, Button, Form, Select, Divider, Modal, Popover, Input, Checkbox } from 'antd';
+import {
+  Table,
+  Button,
+  Form,
+  Select,
+  Divider,
+  Modal,
+  Popover,
+  Input,
+  Checkbox,
+  message,
+} from 'antd';
 import moment from 'moment';
 import router from 'umi/router';
 import styles from './List.less';
@@ -11,6 +22,8 @@ import QualityOperateModal from './QualityOperateModal';
 import BudgetModal from './BudgetModal';
 import ModifyManagerModal from './ModifyManagerModal';
 import { connect } from 'dva';
+import FirmModal from './ManufacturerModal';
+import { queryCreaterList, saveMfr } from '@/services/manufacturer';
 
 const { Option } = Select;
 //状态
@@ -34,6 +47,7 @@ function List(props) {
     depUserTree,
     member,
     budget,
+    supplierList,
   } = props;
   const [form] = Form.useForm();
   const [addVisible, setAddVisible] = useState(false);
@@ -46,6 +60,7 @@ function List(props) {
   const [currentItem, setCurrentItem] = useState({});
   const [qualityOperate, setQualityOperate] = useState(0);
   const [modifyManagerVisible, setModifyManagerVisible] = useState(false);
+  const [addFirmVisible, setAddFirmVisible] = useState(false);
   const columns = [
     {
       title: '项目编号',
@@ -56,10 +71,39 @@ function List(props) {
       dataIndex: 'project_name',
     },
     {
-      title: '分类',
-      dataIndex: 'TypeInfo',
-      render: TypeInfo => (TypeInfo ? `${TypeInfo.name}(${TypeInfo.code})` : '-'),
+      title: '客户',
+      dataIndex: 'supplier_name',
+      render: () => '-',
     },
+    {
+      title: '规模',
+      render: () => '-',
+    },
+    {
+      title: '技术',
+      render: () => '-',
+    },
+    {
+      title: '项目种类（前分类）',
+      render: () => '-',
+    },
+    {
+      title: '项目阶段（前流程）',
+      render: () => '-',
+    },
+    {
+      title: '现阶段状态（前状态）',
+      render: () => '-',
+    },
+    {
+      title: '现阶段状态时间（月）',
+      render: () => '-',
+    },
+    // {
+    //   title: '分类',
+    //   dataIndex: 'TypeInfo',
+    //   render: TypeInfo => (TypeInfo ? `${TypeInfo.name}(${TypeInfo.code})` : '-'),
+    // },
     /*
     {
       title: '名称',
@@ -81,28 +125,28 @@ function List(props) {
       render: version => `${version}期`,
     },
     */
-    {
-      title: '流程',
-      dataIndex: ['FlowInfo', 'name'],
-    },
-    {
-      title: '状态',
-      dataIndex: 'project_status',
-      render: project_status => {
-        // return project_status === 0 ? <>售前</> : <>转执行</>;
-        //若添加其他状态则启用以下switch case：
-        switch (project_status) {
-          case 0:
-            return <>售前</>;
-          case 1:
-            return <>转执行</>;
-          case 2:
-            return <>转运营</>;
-          case 3:
-            return <>转质保</>;
-        }
-      },
-    },
+    // {
+    //   title: '流程',
+    //   dataIndex: ['FlowInfo', 'name'],
+    // },
+    // {
+    //   title: '状态',
+    //   dataIndex: 'project_status',
+    //   render: project_status => {
+    //     // return project_status === 0 ? <>售前</> : <>转执行</>;
+    //     //若添加其他状态则启用以下switch case：
+    //     switch (project_status) {
+    //       case 0:
+    //         return <>售前</>;
+    //       case 1:
+    //         return <>转执行</>;
+    //       case 2:
+    //         return <>转运营</>;
+    //       case 3:
+    //         return <>转质保</>;
+    //     }
+    //   },
+    // },
     {
       title: '节点',
       dataIndex: 'NodeInfo',
@@ -150,10 +194,31 @@ function List(props) {
     },
     {
       title: '操作',
-      render: record => renderEditBtns(record),
+      render: record => renderEditBtns2(record),
     },
   ];
 
+  const renderEditBtns = record => {
+    return (
+      <>
+        <a
+          onClick={() => {
+            setCurrentItem(record);
+            setDetailVisible(true);
+          }}
+        >
+          项目详情
+        </a>
+        <Divider type="vertical" />
+        <a onClick={() => {}}>项目编辑</a>
+        <Divider type="vertical" />
+        <a onClick={() => {}}>项目日志</a>
+        <Divider type="vertical" />
+        <a onClick={() => {}}>设置人日预算</a>
+      </>
+    );
+  };
+
   const handleSearch = () => {
     const { projectName, projectCode, projectStatus } = form.getFieldsValue();
     let params = {};
@@ -274,7 +339,7 @@ function List(props) {
     });
   };
 
-  const renderEditBtns = record => {
+  const renderEditBtns2 = record => {
     let dividerPush = (item, list) => {
       if (list.length === 0) list.push(item);
       else {
@@ -487,8 +552,29 @@ function List(props) {
     dispatch({
       type: 'approval/fetchDepV2',
     });
+    dispatch({
+      type: 'approval/querySupplierList',
+      payload: { project_id: 1, is_super: true, page_size: 999 },
+    });
   }, []);
 
+  const handlerSaveFirm = async fieldsValue => {
+    const res = await saveMfr({
+      ...fieldsValue,
+      project_id: 1,
+      created_by: currentUser?.CName,
+    });
+    if (res.code == 200) {
+      message.success('新增成功');
+      setAddFirmVisible(false);
+      dispatch({
+        type: 'approval/querySupplierList',
+        payload: { project_id: 1, is_super: true, page_size: 999 },
+      });
+    }
+    console.log(res);
+  };
+
   return (
     <div>
       {renderSearch()}
@@ -514,6 +600,7 @@ function List(props) {
         onChange={queryList}
       />
       <ApprovalModal
+        supplierList={supplierList}
         currentUser={currentUser}
         depUserTree={depUserTree}
         loading={loading}
@@ -525,6 +612,7 @@ function List(props) {
         data={currentItem}
         total={data.pagination.total}
         onClose={() => setAddVisible(false)}
+        onAddFirm={() => setAddFirmVisible(true)}
       />
       <DetailModal
         industryList={industryList}
@@ -542,14 +630,14 @@ function List(props) {
         onOk={() => setExecutionVisible(false)}
         onClose={() => setExecutionVisible(false)}
       />
-      <MemberModal
+      {/* <MemberModal
         depUserTree={depUserTree}
         loading={loading}
         visible={memberVisible}
         onClose={() => setMemberVisible(false)}
         currentItem={currentItem}
         dataSource={member}
-      />
+      /> */}
       <QualityOperateModal
         depUserTree={depUserTree}
         loading={loading}
@@ -576,6 +664,12 @@ function List(props) {
         dataSource={member}
         onOk={() => setModifyManagerVisible(false)}
       />
+      <FirmModal
+        // projectId={projectId}
+        visible={addFirmVisible}
+        onCancel={() => setAddFirmVisible(false)}
+        onOk={handlerSaveFirm}
+      />
     </div>
   );
 }
@@ -591,4 +685,5 @@ export default connect(({ approval, user, loading }) => ({
   depUserTree: approval.depUserTree,
   member: approval.member,
   budget: approval.budget,
+  supplierList: approval.supplierList,
 }))(List);

src/pages/PurchaseAdmin/PurchaseList/Approval/ManufacturerModal.js

@@ -0,0 +1,330 @@
+import React, { Fragment, useState, useEffect, useRef, useMemo } from 'react';
+import {
+  Table,
+  Icon,
+  message,
+  Spin,
+  Button,
+  Form,
+  DatePicker,
+  Row,
+  Col,
+  Modal,
+  Input,
+  Upload,
+  Select,
+} from 'antd';
+import dayjs from 'dayjs';
+import { getToken, GetTokenFromUrl } from '@/utils/utils';
+const { RangePicker } = DatePicker;
+const { TextArea } = Input;
+function FirmModal(props) {
+  const {
+    onCancel,
+    onOk,
+    visible,
+    item = null,
+    disabled = true,
+    form,
+    typeDisabled = false,
+  } = props;
+  const [formRef] = Form.useForm();
+  const [type, setType] = useState(item?.type || 1);
+  console.log(type);
+  const handleOnOk = async () => {
+    formRef
+      .validateFields()
+      .then(values => {
+        console.log(values);
+        formRef.resetFields();
+        onOk?.({ ...values });
+      })
+      .catch(info => {
+        console.log('Validate Failed:', info);
+      });
+
+    // ((err, fieldsValue) => {
+    //   if (err)
+    //     return;
+    //   const values = {
+    //     ...fieldsValue,
+    //   };
+    //   onOk?.(values);
+    // });
+  };
+  const handleOnCancel = () => {
+    formRef.resetFields();
+    onCancel?.();
+  };
+  const handleType = value => {
+    formRef.resetFields();
+    formRef.setFieldValue('type', value);
+    setType(value);
+  };
+  const token = getToken() || GetTokenFromUrl();
+  const uploadProps = {
+    name: 'files',
+    // action: `/api/v1/device-color/upload/${ID}`,
+    headers: {
+      'JWT-TOKEN': token,
+    },
+    showUploadList: false,
+    onChange: info => {
+      if (info.file.status !== 'uploading') {
+        console.log(info.file, info.fileList);
+      }
+      if (info.file.status === 'done') {
+        message.success(`${info.file.name} 文件上传成功`);
+      } else if (info.file.status === 'error') {
+        message.error(`${info.file.name} 文件上传失败`);
+      }
+    },
+  };
+  useEffect(() => {
+    formRef.resetFields();
+    if (visible) setType(item?.type || 1);
+  }, [visible]);
+
+  return (
+    <Modal
+      maskClosable={false}
+      open={visible}
+      destroyOnClose
+      onCancel={handleOnCancel}
+      onOk={handleOnOk}
+      // forceRender
+      width="60%"
+      title="新增"
+      // footer={disabled ? null : undefined}
+    >
+      <div style={{ padding: 30 }}>
+        <Form
+          form={formRef}
+          // layout="inline"
+          labelCol={{ span: 4 }}
+          wrapperCol={{ span: 20 }}
+          preserve={false}
+          initialValues={{
+            name: item?.name || '',
+            tax_code: item?.tax_code || '',
+            contact: item?.contact || '',
+            phone_number: item?.phone_number || '',
+            bank_account: item?.bank_account || '',
+            bank_number: item?.bank_number || '',
+            address: item?.address || '',
+            type: item?.type || 1,
+            id_type: item?.id_type || '',
+            id_card: item?.id_card || '',
+          }}
+        >
+          <Row gutter={[48, 24]}>
+            <Col span={12}>
+              <Form.Item
+                style={{ width: '100%' }}
+                label="主体类型:"
+                name="type"
+                rules={[
+                  {
+                    required: true,
+                    message: '请选择主体类型',
+                  },
+                ]}
+              >
+                <Select
+                  options={[
+                    { value: 1, label: '供应商' },
+                    { value: 4, label: '自然人' },
+                  ]}
+                  placeholder="请选择主体类型"
+                  onChange={handleType}
+                ></Select>
+              </Form.Item>
+            </Col>
+          </Row>
+          {type === 1 && (
+            <>
+              <Row gutter={[48, 24]}>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="名称:"
+                    name="name"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入供应商名称',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入供应商名称" />
+                  </Form.Item>
+                </Col>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="税号:"
+                    name="tax_code"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入税号',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入税号" />
+                  </Form.Item>
+                </Col>
+              </Row>
+              <Row gutter={[48, 24]}>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="联系人:"
+                    name="contact"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入联系人',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入联系人" />
+                  </Form.Item>
+                </Col>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="联系电话:"
+                    name="phone_number"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入联系电话',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入联系电话" />
+                  </Form.Item>
+                </Col>
+              </Row>
+              <Row gutter={[48, 24]}>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="开户银行:"
+                    name="bank_account"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入开户银行',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入开户银行" />
+                  </Form.Item>
+                </Col>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="银行账号:"
+                    name="bank_number"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入银行账号',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入银行账号" />
+                  </Form.Item>
+                </Col>
+              </Row>
+              <Row>
+                <Col span={24}>
+                  <Form.Item
+                    labelCol={{ span: 2 }}
+                    wrapperCol={{ span: 22 }}
+                    style={{ width: '100%' }}
+                    label="地址:"
+                    name="address"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入地址',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入地址" />
+                  </Form.Item>
+                </Col>
+              </Row>
+            </>
+          )}
+          {type === 4 && (
+            <>
+              <Row gutter={[48, 24]}>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="姓名:"
+                    name="name"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入姓名',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入姓名" />
+                  </Form.Item>
+                </Col>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="证件类型:"
+                    name="id_type"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请选择证件类型',
+                      },
+                    ]}
+                  >
+                    <Select placeholder="请选择证件类型">
+                      <Option value={1}>身份证</Option>
+                      <Option value={2}>护照</Option>
+                    </Select>
+                  </Form.Item>
+                </Col>
+              </Row>
+              <Row gutter={[48, 24]}>
+                <Col span={12}>
+                  <Form.Item
+                    style={{ width: '100%' }}
+                    label="证件号:"
+                    name="id_card"
+                    rules={[
+                      {
+                        required: true,
+                        message: '请输入证件号',
+                      },
+                    ]}
+                  >
+                    <Input placeholder="请输入证件号" />
+                  </Form.Item>
+                </Col>
+                <Col span={12}>
+                  <Form.Item style={{ width: '100%' }} label="银行账号:" name="bank_number">
+                    <Input placeholder="请输入银行账号" />
+                  </Form.Item>
+                </Col>
+              </Row>
+            </>
+          )}
+        </Form>
+      </div>
+    </Modal>
+  );
+}
+
+export default FirmModal;

src/pages/PurchaseAdmin/PurchaseList/Approval/MemberModal.js

@@ -12,8 +12,16 @@ const STATUS = [
   { value: 6, label: '质保' },
 ];
 
-function MemberModal(props) {
-  const { visible, onClose, currentItem, loading, depUserTree, dataSource, dispatch } = props;
+function MemberRender(props) {
+  const {
+    visible,
+    onClose,
+    currentItem,
+    loading,
+    depUserTree,
+    member: dataSource,
+    dispatch,
+  } = props;
   const [type, setType] = useState('1');
   const [form] = Form.useForm();
   const [currentMember, setCurrentMember] = useState({});
@@ -90,20 +98,7 @@ function MemberModal(props) {
   }, [currentItem]);
 
   return (
-    <Modal
-      title="成员管理"
-      confirmLoading={loading}
-      maskClosable={false}
-      destroyOnClose
-      visible={visible}
-      onCancel={() => {
-        form.resetFields();
-        setType('1');
-        onClose();
-      }}
-      footer={null}
-      width="70%"
-    >
+    <>
       <Tabs defaultActiveKey="1" activeKey={type} onChange={type => handleChange(type)}>
         {STATUS.map(
           item =>
@@ -145,8 +140,13 @@ function MemberModal(props) {
         </Form.Item>
       </Form>
       <Table columns={columns} loading={loading} dataSource={dataSource} pagination={false} />
-    </Modal>
+    </>
   );
 }
 
-export default connect()(MemberModal);
+export default connect(({ approval, user, loading }) => ({
+  currentUser: user.currentUser,
+  loading: loading.models.approval,
+  depUserTree: approval.depUserTree,
+  member: approval.member,
+}))(MemberRender);

src/pages/PurchaseAdmin/PurchaseList/Approval/StatusRender.js

@@ -0,0 +1,46 @@
+import { Timeline } from 'antd';
+
+const StatusRender = () => {
+  const renderIcon = idx => {
+    <div
+      style={{
+        backgroundColor: '#1890ff',
+        color: '#fff',
+        width: '30px',
+        height: '30px',
+        textAlign: 'center',
+        lineHeight: '30px',
+      }}
+    >
+      {idx}
+    </div>;
+  };
+  return (
+    <Timeline>
+      <Timeline.Item
+        dot={
+          <div
+            style={{
+              backgroundColor: '#1890ff',
+              color: '#fff',
+              width: '30px',
+              height: '30px',
+              textAlign: 'center',
+              lineHeight: '30px',
+              borderRadius: '15px',
+            }}
+          >
+            1
+          </div>
+        }
+      >
+        <div style={{ fontSize: '20px', color: '#1890ff' }}>售前经理</div>
+        <div>售前Solve initial network problems 2015-09-01经理</div>
+      </Timeline.Item>
+      <Timeline.Item>Solve initial network problems 2015-09-01</Timeline.Item>
+      <Timeline.Item>Technical testing 2015-09-01</Timeline.Item>
+      <Timeline.Item>Network problems being solved 2015-09-01</Timeline.Item>
+    </Timeline>
+  );
+};
+export default StatusRender;

src/pages/PurchaseAdmin/PurchaseList/Approval/TableRender.js

@@ -0,0 +1,84 @@
+import { useMemo, useState } from 'react';
+import styles from './index.less';
+import { Input, Select } from 'antd';
+import { DeleteOutlined } from '@ant-design/icons';
+const TableRender = ({ value, onChange, onlyShow = false }) => {
+  const defaultItem = { type: '', scale: '' };
+  const options = ['UF', 'RO', 'NF', 'MF', 'MBR'];
+
+  const list = useMemo(() => {
+    return value ? JSON.parse(value) : [defaultItem];
+  }, [value]);
+
+  const handleChange = (idx, item) => {
+    const newList = JSON.parse(JSON.stringify(list));
+    newList[idx] = item;
+    const result = JSON.stringify(newList);
+    onChange(result);
+  };
+
+  const handleAddClick = () => {
+    const result = JSON.stringify([...list, defaultItem]);
+    onChange(result);
+  };
+
+  const handleDelClick = idx => {
+    const newList = JSON.parse(JSON.stringify(list));
+    newList.splice(idx, 1);
+    const result = JSON.stringify(newList);
+    onChange(result);
+  };
+
+  const renderItems = (item, idx) => {
+    const { type, scale } = item;
+    return (
+      <div className={styles.item} key={`${type}_${scale}_${idx}`}>
+        {onlyShow ? (
+          <>
+            <span>{type}</span>
+            <div className={styles.line}></div>
+            <span>{scale}</span>
+          </>
+        ) : (
+          <>
+            <Select
+              value={type}
+              className={styles.itemLeft}
+              style={{ width: '100%' }}
+              onChange={e => handleChange(idx, { ...item, type: e })}
+            >
+              {options.map(value => (
+                <Option key={value}>{value}</Option>
+              ))}
+            </Select>
+            <Input
+              value={scale}
+              onChange={e => handleChange(idx, { ...item, scale: e.target.value })}
+            />
+
+            <DeleteOutlined className={styles.deleteIcon} onClick={() => handleDelClick(idx)} />
+          </>
+        )}
+      </div>
+    );
+  };
+  return (
+    <div>
+      {!onlyShow && (
+        <div className={styles.titleContent}>
+          <div>工艺技术</div>
+          <div>项目规模</div>
+        </div>
+      )}
+      <div className={styles.content}>
+        {list.map((item, idx) => renderItems(item, idx))}
+        {!onlyShow && (
+          <div className={styles.addBtn} onClick={handleAddClick}>
+            + 添加
+          </div>
+        )}
+      </div>
+    </div>
+  );
+};
+export default TableRender;

src/pages/PurchaseAdmin/PurchaseList/Approval/index.less

@@ -0,0 +1,50 @@
+.titleContent {
+  background-color: #d5f1ff;
+  height: 32px;
+  //   font-size: 18px;
+  display: flex;
+  justify-content: space-around;
+  border-radius: 2px;
+  align-items: center;
+}
+.content {
+  border: 1px solid #eee;
+  .item {
+    position: relative;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    margin: 4px 8px;
+    padding-bottom: 4px;
+    border-bottom: 1px solid #eee;
+    .itemLeft {
+      border-right: 1px solid #eee;
+    }
+  }
+  .addBtn {
+    height: 32px;
+    color: #93cafe;
+    text-align: center;
+    line-height: 32px;
+  }
+  .deleteIcon {
+    position: absolute;
+    right: -32px;
+  }
+  .line {
+    height: 30px;
+    width: 1px;
+    background-color: #eee;
+  }
+  :global {
+    .ant-input {
+      border: none;
+    }
+    .ant-select:not(.ant-select-customize-input) .ant-select-selector {
+      border: none;
+    }
+  }
+}
+.content:last-child {
+  border-bottom: none;
+}

src/pages/PurchaseAdmin/PurchaseList/Approval/models/approval.js

@@ -20,6 +20,7 @@ import {
   setBudget,
   modifyManager,
 } from '@/services/approval';
+import { queryMfrList } from '@/services/manufacturer';
 import { message } from 'antd';
 import moment from 'moment';
 
@@ -67,6 +68,7 @@ export default {
     depUserTree: [],
     member: [],
     budget: [],
+    supplierList: [],
   },
 
   effects: {
@@ -270,6 +272,16 @@ export default {
         type: 'queryApproval',
       });
     },
+    *querySupplierList({ payload, callback }, { call, put }) {
+      const res = yield call(queryMfrList, payload);
+      if (!res.data) return;
+      console.log(res);
+      yield put({
+        type: 'save',
+        payload: { supplierList: res.data.list },
+      });
+      callback?.();
+    },
   },
 
   reducers: {

src/services/manufacturer.js

@@ -0,0 +1,43 @@
+import request from '@/utils/request';
+import { stringify } from 'qs';
+
+export function queryMfrList(data) {
+  return request('/api/supplier/v1/supplier/list', {
+    method: 'POST',
+    body: data,
+  });
+}
+
+export async function queryCreaterList() {
+  let res = await request('/api/supplier/v1/supplier-name/list', {
+    method: 'POST',
+  });
+  var obj = {};
+  res.data.list = res.data.list.reduce(function(item, next) {
+    obj[next.created_by] ? '' : (obj[next.created_by] = true && item.push(next));
+    return item;
+  }, []);
+  console.log(res);
+  res.data.list = res?.data?.list.map(item => {
+    return { value: item.created_by, label: item.created_by };
+  });
+  return res;
+}
+export function editMfr(data) {
+  return request('/api/supplier/v1/supplier/edit', {
+    method: 'POST',
+    body: data,
+  });
+}
+export function deleteMfr(data) {
+  return request('/api/supplier/v1/supplier/del', {
+    method: 'POST',
+    body: data,
+  });
+}
+export function saveMfr(data) {
+  return request('/api/supplier/v1/supplier/save', {
+    method: 'POST',
+    body: data,
+  });
+}

src/utils/request.js

@@ -41,9 +41,9 @@ const checkStatus = response => {
   const error = new Error(response.data);
   error.name = response.status;
   error.response = response;
-  console.error(error)
+  console.error(error);
   // throw error;
-  return Promise.reject()
+  return Promise.reject();
 };
 
 const cachedSave = response => {
@@ -78,7 +78,9 @@ export default function request(url, option, jwt) {
   // console.log(API_HOST);
   const time = url.indexOf('?') > -1 ? `&time=${number}` : `?time=${number}`;
   if (url.indexOf('http://') == -1 && url.indexOf('https://') == -1) {
-    if (url.indexOf('/api/v') === -1) {
+    // 注意 我把这个/v删了 不知道会不会有接口有问题
+    // if (url.indexOf('/api/v') === -1) {
+    if (url.indexOf('/api') === -1) {
       url = `/api/v1${url}${time}`;
     }
     // API_HOST在config/config.js的define中配置