修改上传模板的名称显示/版本树加时间轴

src/components/Flow/node/rect/mapServe.tsx

@@ -15,6 +15,11 @@ import { PREFIX } from '../constants';
 import { UnityAction } from '@/utils/utils';
 import { connect } from 'dva';
 
+interface ExcelInfo {
+  file_name?: string;
+  excel_cols?: any;
+}
+
 export interface IConfig {
   label?: string;
   x?: number;
@@ -31,19 +36,21 @@ export interface IConfig {
   bom_template?: string;
   version_name?: string;
   data?: any;
-  excel_info?: any;
-  role_list?:string;
+  excel_info?: ExcelInfo;
+  role_list?: string;
 }
 
 const defaultConfig: IConfig = {
   muti_version: 1,
   is_start_node: 0,
+  excel_info: { file_name: '' },
 };
 
 const Component = (props: any) => {
   const { config, plugin = {}, roleList } = props;
   const { updateNode } = plugin;
-  const [options, setOptions] = useState([])
+  const [options, setOptions] = useState([]);
+  const [fileName, setFileName] = useState('');
   const [nodeConfig, setNodeConfig] = useState<IConfig>({
     ...defaultConfig,
     ...config,
@@ -82,13 +89,13 @@ const Component = (props: any) => {
       const sheet = exportJson.sheets[0];
       let titleCell = [];
       sheet.celldata.forEach(item => {
-        if(item.r == 0) {
+        if (item.r == 0) {
           // 标题头
-          titleCell.push(item)
+          titleCell.push(item);
         }
         // 生成cid
-        item.v.cid = `${item.r}-${item.c}`
-      })
+        item.v.cid = `${item.r}-${item.c}`;
+      });
       let cell = titleCell.map(item => {
         let value = '';
         if (item.v?.v) {
@@ -114,18 +121,31 @@ const Component = (props: any) => {
       ...config,
     });
   }, [config]);
+
+  const updataFileName = (name: string) => {
+    var idx = name?.lastIndexOf('/');
+    let str = name.substring(idx + 1, name.length);
+    setFileName(str);
+  };
+
+  useEffect(() => {
+    if (config.bom_template) updataFileName(config.bom_template);
+    if (nodeConfig.excel_info?.file_name) updataFileName(nodeConfig.excel_info.file_name);
+  }, [nodeConfig.bom_template, nodeConfig.excel_info.file_name]);
   // console.log(nodeConfig, config)
 
   useEffect(() => {
-    if(!roleList || roleList.length <= 0) return;
-    let op = []
-    console.log(roleList)
-    roleList.filter(cur=>cur.RoleType == 4).forEach(item => {
-      op.push({label:`${item.Name}(${item.ID})`, value:item.ID})
-    })
+    if (!roleList || roleList.length <= 0) return;
+    let op = [];
+    console.log(roleList);
+    roleList
+      .filter(cur => cur.RoleType == 4)
+      .forEach(item => {
+        op.push({ label: `${item.Name}(${item.ID})`, value: item.ID });
+      });
     setOptions(op);
-    console.log(op)
-  },[roleList])
+    console.log(op);
+  }, [roleList]);
 
   return (
     <div className={`${PREFIX}-panel-body`}>
@@ -177,19 +197,21 @@ const Component = (props: any) => {
               onChange={url => onNodeConfigChange('bom_template', url)}
               beforeUpload={beforeUpload}
             />
-            <div>{nodeConfig.excel_info?.file_name}</div>
+            <div>{fileName}</div>
           </>
         )}
-        <div className='group'>
+        <div className="group">
           <label>权限</label>
           <Select
-            value= {nodeConfig.role_list ? nodeConfig.role_list.split(",").map(item=>Number(item)) : []}
+            value={
+              nodeConfig.role_list ? nodeConfig.role_list.split(',').map(item => Number(item)) : []
+            }
             mode="multiple"
             allowClear
             style={{ width: '100%' }}
             placeholder="选择权限"
             onChange={(v: number[]) => {
-              onNodeConfigChange('role_list', v.join(','))
+              onNodeConfigChange('role_list', v.join(','));
             }}
             options={options}
           />
@@ -265,4 +287,4 @@ function RecthServe(props: any) {
   );
 }
 
-export default connect(({ flow }) => ({ roleList: flow.roleList }))(RecthServe);
+export default connect(({ flow }) => ({ roleList: flow.roleList }))(RecthServe);

src/pages/PurchaseAdmin/PurchaseList/Detail/HistoryDrawer.js

@@ -2,10 +2,11 @@ import React, { useEffect, useState, useRef, useMemo } from 'react';
 import { UserOutlined } from '@ant-design/icons';
 import { Form } from '@ant-design/compatible';
 import '@ant-design/compatible/assets/index.css';
-import { Drawer, Descriptions, Card, Table } from 'antd';
+import { Drawer, Descriptions, Card, Table, Timeline, Button, Space } from 'antd';
 import moment from 'moment';
 import { connect } from 'dva';
 import CommentContent from '@/components/CommentContent';
+import TimelineItem from 'antd/lib/timeline/TimelineItem';
 
 // 评论
 function HistoryDrawer(props) {
@@ -24,7 +25,7 @@ function HistoryDrawer(props) {
       {
         title: '名称',
         render: item => (
-          <div style={{ color: '#9b9b9b'}}>
+          <div style={{ color: '#9b9b9b' }}>
             {item.version_no ? `${item.version_name}.${item.version_no}` : item.version_name}
           </div>
         ),
@@ -33,16 +34,20 @@ function HistoryDrawer(props) {
         title: '业务节点',
         width: '20%',
         render: item => {
-          let node = flowDetail.Nodes.find(cur => cur.Id == item.template_node_id)
-          return <span style={{ color: '#9b9b9b'}}>{node?.label ? node.label : '-'}</span>;
+          let node = flowDetail.Nodes.find(cur => cur.Id == item.template_node_id);
+          return <span style={{ color: '#9b9b9b' }}>{node?.label ? node.label : '-'}</span>;
         },
       },
       {
-        title:'提交人',
+        title: '提交人',
         width: '20%',
         render: item => {
-          return <span style={{ color: '#9b9b9b'}}>{item.AuthorInfo?.UserName ? item.AuthorInfo?.UserName : '-'}</span>
-        }
+          return (
+            <span style={{ color: '#9b9b9b' }}>
+              {item.AuthorInfo?.UserName ? item.AuthorInfo?.UserName : '-'}
+            </span>
+          );
+        },
       },
       {
         title: '操作',
@@ -61,34 +66,28 @@ function HistoryDrawer(props) {
       },
     ];
   }, [version]);
-  // const [commentList, setCommentList] = useState([]);
-
-  // const handleSubmitBom = (value, callback) => {
-  //   if (!value) return;
-  //   dispatch({
-  //     type: 'detail/addBomComment',
-  //     payload: {
-  //       excel_id: version.id,
-  //       comment: value,
-  //     },
-  //     callback,
-  //   });
-  // };
-  // const handleSubmitCell = (value, callback) => {
-  //   if (!value) return;
-  //   dispatch({
-  //     type: 'detail/addComment',
-  //     payload: {
-  //       ...cellPosition.current,
-  //       comment: value,
-  //     },
-  //     callback,
-  //   });
-  // };
 
-  useEffect(() => {
-    console.log("====================================",versionTree)
-  }, [version.id]);
+  const TimeLineItemRender = item => {
+    let time = item.m_time ? item.m_time.split('T')[0] : '-';
+    let node = flowDetail.Nodes.find(cur => cur.Id == item.template_node_id);
+    return (
+      <TimelineItem>
+        <Space>
+          <a
+            onClick={() => {
+              onChangeVersion(item);
+              onClose();
+            }}
+          >
+            {item.version_no ? `${item.version_name}.${item.version_no}` : item.version_name}
+          </a>
+          <span>{node?.label ? node.label : '-'}</span>
+          <span>提交人: {item.AuthorInfo?.UserName ? item.AuthorInfo?.UserName : '-'}</span>
+          <span>时间: {time}</span>
+        </Space>
+      </TimelineItem>
+    );
+  };
 
   return (
     <Drawer
@@ -99,7 +98,8 @@ function HistoryDrawer(props) {
       onClose={onClose}
       visible={visible}
     >
-      <Table columns={columns} dataSource={versionTree} bordered={false} />
+      {/* <Table columns={columns} dataSource={versionTree} bordered={false} /> */}
+      <Timeline>{versionTree.map(item => TimeLineItemRender(item))}</Timeline>
     </Drawer>
   );
 }