fix bug

README.md

@@ -119,10 +119,12 @@ npm run start:dev //开发环境，不使用mock,所有数据通过代理接口
     const [data,setData] = useSate<DataType>();
 
     useEffect(()=>{
-          //处理相关逻辑
+          //处理改变data后的相关逻辑
     },[data]);
 ...
 
+//条文管理和台账上传界面是共用页面模块，在编写这两块的逻辑时注意状态区分
+
 //项目数据共享使用的是umi 的model插件，每个page对应一个model.ts文件
 //model文件分布在每个page下面，然后统一在src/models/allModel.ts里引入使用
 

config/config.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-03 14:28:27
- * @LastEditTime: 2021-12-27 18:28:29
+ * @LastEditTime: 2022-01-01 13:13:35
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/config/config.ts
@@ -69,8 +69,11 @@ export default defineConfig({
     },
   ],
   nodeModulesTransform: { type: 'none' },
-  // mfsu: {},
-  webpack5: {},
+  mfsu: {
+    // production: { output: '.mfsu-production' }
+  },
+  // webpack5: {
+  // },
   exportStatic: {},
   // qiankun: {
   //   slave: {},

config/proxy.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-03 14:28:27
- * @LastEditTime: 2021-12-07 14:33:34
+ * @LastEditTime: 2022-01-01 13:38:08
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/config/proxy.ts

src/app.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-03 14:28:27
- * @LastEditTime: 2021-12-21 10:23:15
+ * @LastEditTime: 2022-01-04 17:47:22
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/app.tsx
@@ -152,10 +152,21 @@ const authHeaderInterceptor = (url: string, options: RequestOptionsInit) => {
 };
 
 
-const responseInterceptors = async (response: Response, options: RequestOptionsInit) => {
+interface responseInterceptorsOptions extends RequestOptionsInit {
+  isCloseNotify?:boolean, //是否关闭POST请求后反馈
+  responseSpecifyFeedback?:{
+       successMessage:string,
+       errorMessage:string,
+       isShow:boolean,  //是否启用
+  }
+}
+
+const responseInterceptors = async (response: Response, options: responseInterceptorsOptions) => {
   // console.log({response,options});
   const requestMethod = options.method;
-  const url = options.url;
+
+  const {url,responseSpecifyFeedback,isCloseNotify=false} = options;
+  
   try {
     const {status} = response;
     if(status == 200){
@@ -164,10 +175,16 @@ const responseInterceptors = async (response: Response, options: RequestOptionsI
         const { status: dataStatus,errorCode,errorMessage,data} = _response;
         if(dataStatus == 200){
              //接口请求成功
-             if(requestMethod=='POST'&&url != "/api/pfm/login"){
-               notification.success({
-                message:'操作成功！'
-               });
+             if(requestMethod=='POST'&&url != "/api/pfm/login"&&!isCloseNotify){
+               if(responseSpecifyFeedback&&responseSpecifyFeedback.isShow){
+                 //当指定了请求成功反馈时
+                   
+               }else{
+                 //否则用默认提示
+                notification.success({
+                  message:'操作成功！'
+                 });
+               }
              }
 
              if(data){

src/components/MccsDrawerForm/index.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-15 16:25:53
- * @LastEditTime: 2021-11-29 14:53:21
+ * @LastEditTime: 2021-12-31 18:19:24
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsDrawerForm/index.tsx
@@ -9,19 +9,30 @@
 
 
 
-import React,{} from 'react'
+import React,{useState,useEffect} from 'react'
 import { Drawer } from 'antd';
 import {
     DrawerForm,
   } from '@ant-design/pro-form';
 
 const MccsDrawerForm:React.FC<MccsDrawerForm.propsType> = (props)=>{
-    const {children,noFormMode,onVisibleChange,...rest} = props;
+    const {children,noFormMode,onVisibleChange,drawerProps,visible,...rest} = props;
+    const [drawerVisible,setDrawerVisible] = useState(false);
+
+    useEffect(() => {
+        setDrawerVisible(visible);
+
+        return ()=>{
+            setDrawerVisible(false);
+        }
+    }, [visible])
+
     return !noFormMode?(
         <DrawerForm
              onVisibleChange={onVisibleChange}
+             visible={visible}
              drawerProps={{
-                 
+                ...drawerProps,
                 destroyOnClose:true
              }}
              {...rest}
@@ -30,6 +41,9 @@ const MccsDrawerForm:React.FC<MccsDrawerForm.propsType> = (props)=>{
         </DrawerForm>
     ):(
         <Drawer 
+           destroyOnClose={true}
+           visible={drawerVisible}
+           onClose={()=>onVisibleChange(false)}
            {...rest}
         >
             {children}

src/components/MccsDrawerForm/typings.d.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-15 16:26:10
- * @LastEditTime: 2021-09-29 11:05:08
+ * @LastEditTime: 2021-12-30 20:39:14
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsDrawerForm/typings.d.ts
@@ -11,6 +11,7 @@
 declare namespace MccsDrawerForm {
      type propsType = {
           noFormMode?:boolean,  //是否不带有表单
+          drawerProps?:object,
           [propsName:string]:any
      }
 }

src/components/MccsEditableTable/index.tsx

@@ -1,64 +1,198 @@
 /*
  * @Author: your name
  * @Date: 2021-09-27 10:45:50
- * @LastEditTime: 2021-11-26 15:15:57
+ * @LastEditTime: 2022-01-04 16:51:39
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsEditableTable/index.tsx
  */
 
-
-import React,{useState,useEffect,useRef} from 'react'
+import { Pagination, Popconfirm } from 'antd';
+import React, { useState, useEffect, useRef } from 'react'
 import { EditableProTable } from '@ant-design/pro-table';
-
+import { Key } from 'antd/lib/table/interface';
 
 
 //仅仅对pro-table简单的包装，详细使用参考antd pro
 
+const objectSimpleFilter = (obj: object, keyToDel: string) => {
+    return JSON.parse(JSON.stringify(obj, function (key, value) {
+        if (key == keyToDel) {
+            return undefined;
+        } else {
+            return value;
+        }
+    }))
+}
+
 const MccsEditableTable: React.FC<MccsEditableTableType.MccsEditableTableProps> = (props) => {
 
-    const {columns=[],request,addHandle,editHandle,reload,...rest} = props;
+    const { columns = [], request, addHandle, pagination, editHandle, delHandle, reload, edit = true, ...rest } = props;
     const [editableKeys, setEditableRowKeys] = useState<React.Key[]>([]);
-    const [dataSource,setDataSource] = useState<any>([]);
+    const [dataSource, setDataSource] = useState<any>([]);
     const tableRef = useRef<any>();
+    const [tableColumns, setTableColumns] = useState<any[]>([]);
+    const [pageData, setPageData] = useState({ current: 1, pageSize: 10 });
+    const [total, setTotal] = useState(0);
+
+
+
+    const mccsEditableTableAction = {
+        title: '操作',
+        valueType: 'option',
+        width: '10%',
+        align: 'center',
+        render: (text: string, record: any, _: any, action: any) => [
+            <a
+                key="editable"
+                onClick={() => {
+                    action?.startEditable?.(record.id);
+                }}
+            >
+                编辑
+            </a>,
+            <Popconfirm
+                title="是否确定删除?"
+                key="del"
+                onConfirm={()=>{
+                    // console.log({text,record,_,action});
+                    delHandle && delHandle(record);
+                    setDataSource(dataSource.filter((item: any) => item.id !== record.id));
+                }}
+                okText="确定"
+                cancelText="取消"
+            >
+                <a> 删除 </a>
+            </Popconfirm>
+        ]
+    }
+
+
+    const getData = async () => {
+        if (request) {
+            const resp = await request(pageData.current, pageData.pageSize);
+            const { data, current = 1, total = 0 } = resp;
+
+            setTotal(total);
+            setDataSource(data);
+        }
+    }
+
+    const onShowSizeChangeHandle = (current: number, pageSize: number) => {
+        setPageData({ ...pageData, current, pageSize });
+
+    }
+
+    const pageChangeHandle = (page:number,pageSize:number|undefined)=>{
+        //分页页码变化时
+        // console.log({page,pageSize});
+        setPageData({current:page,pageSize:pageSize?pageSize:10});
+    }
+
+    const generateRowKey = ()=>{
+        const currentAddRowkey = (Math.random() * 1000000).toFixed(0);
+        // setCurrentEditRowkey(currentAddRowkey);
+        return currentAddRowkey
+    }
 
     useEffect(() => {
-        
-        tableRef.current.reload();
-    
+        //加载模块获取数据
+        getData();
+
     }, [reload]);
 
- 
+
+
+    useEffect(() => {
+
+        const hasIndex = columns.findIndex(item => item.valueType == 'option');
+        // console.log({hasIndex,edit});
+        if (hasIndex == -1 && edit) {
+            //当无操作按钮时，自行添加默认
+            setTableColumns([...columns, mccsEditableTableAction]);
+            return;
+        }
+        if (!edit) {
+            //当非编辑下时除去操作项
+            setTableColumns(columns.filter(item => item.valueType != 'option'));
+            tableRef.current.cancelEditable(editableKeys[editableKeys.length-1]);
+
+            return;
+        }
+
+
+
+        setTableColumns(columns);
+
+    }, [columns, edit]);
+
+
+    useEffect(() => {
+        getData();
+    }, [pageData]);
+
+
+
 
     return (
-        <EditableProTable
-            {...rest}
-            rowKey="id"
-            columns={columns}
-            request={request}
-            value={dataSource}
-            actionRef={tableRef}
-            onChange={setDataSource}
-            recordCreatorProps={
-               {
-                  record: () => ({ id:'-'}),
-               }
+        <div>
+            <EditableProTable
+                {...rest}
+                rowKey="id"
+                columns={tableColumns}
+                // request={request}
+                controlled={edit}
+                value={dataSource}
+                actionRef={tableRef}
+                onChange={setDataSource}
+                recordCreatorProps={
+                    edit ? {
+                        record: () => {
+                            return { id:generateRowKey()}
+                        },
+                        newRecordType: 'dataSource',
+                    } : false
+                }
+                editable={{
+                    type:'multiple',
+                    editableKeys,
+                    actionRender: (row, config, defaultDoms) => {
+                        return [defaultDoms.save, defaultDoms.cancel];
+                    },
+                    onSave: async (rowKey, data, row) => {
+                        const { id } = data;
+                        console.log({dataSource});
+                        if (typeof id == 'string') {
+                            //新增
+                            addHandle && addHandle(objectSimpleFilter(data, 'id'));
+                        } else if(typeof id == 'number') {
+    
+                            editHandle && editHandle(data);
+                        }
+                    },
+                    onChange: (editableKeys: Key[], editableRows: {id:string}|{id:string}[])=>{
+                        //  console.log({editableKeys,editableRows});
+                         setEditableRowKeys(editableKeys)
+                    },
+                    deletePopconfirmMessage: '确认删除？'
+                }}
+            />
+
+            {
+                pagination && (
+                    <div className='pagination' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'flex-end' }}>
+                        <Pagination
+                            size='small'
+                            showSizeChanger
+                            onChange={(page,pageSize)=>pageChangeHandle(page,pageSize)}
+                            onShowSizeChange={onShowSizeChangeHandle}
+                            current={pageData.current}
+                            total={total}
+                        />
+                    </div>
+                )
             }
-            editable={{
-                type: 'multiple',
-                editableKeys,
-                onSave: async (rowKey, data, row) => {
-                  const {id} = data;
-                  if(id=='-'){
-                       //新增
-                       addHandle&&addHandle(data);
-                  }else{
-                       editHandle&&editHandle(data);
-                  }
-                },
-                onChange: setEditableRowKeys,
-              }}
-        />
+        </div>
     )
 }
 

src/components/MccsEditableTable/typings.d.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-27 10:46:48
- * @LastEditTime: 2021-09-27 17:56:12
+ * @LastEditTime: 2021-12-30 11:41:26
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsEditableTable/typings.d.ts
@@ -13,16 +13,28 @@
 
 declare namespace MccsEditableTableType {
 
-    type RowDataType = {
+    export type RowDataType = {
         [key:string]:any
     }
      
-    type MccsEditableTableProps = {
+    export type MccsEditableTableProps = {
          columns:any[],
-         request?:Promise,
+         request?:(
+             current:number,
+             pageSize:number,
+         )=>Promise<{
+             data:any[],
+             current?:number,
+             total?:number,
+             success?:boolean
+         }>,
          addHandle?:(data:any)=>void,
          editHandle?:(data:any)=>void,
+         delHandle?:(data:any)=>void,   //当使用默认操作项才存在
+         pagination?:boolean,
          reload?:boolean,
+         edit?:boolean,
+         getTableRef?:(ref:any)=>void,
          [key:string]:any
     }
 }

src/components/MccsFileTree/components/DirectoryTree/index.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-07 16:40:33
- * @LastEditTime: 2021-12-07 09:18:41
+ * @LastEditTime: 2021-12-31 16:47:41
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsFileTree/components/directoryTree.tsx
@@ -80,13 +80,13 @@ const DirectoryTree: React.FC<DirectoryTreeProps> = (props) => {
         />
     );
     
-    useEffect(() => {
-        //当设置默认展开项时触发
-        if(props.currentActivedIndex==props.id){
-            const {title,id,isLeaf=false,code} = props;
-            handleClick({title,id,isLeaf,code});
-        }
-    }, [])
+    // useEffect(() => {
+    //     //当文件夹结点设置默认展开项时触发
+    //     if(props.currentActivedIndex==props.id){
+    //         const {title,id,isLeaf=false,code} = props;
+    //         handleClick({title,id,isLeaf,code});
+    //     }
+    // }, [])
 
     return (
         <div className={'treeView ' + treeViewClassName}>

src/components/MccsFileTree/index.less

@@ -5,7 +5,7 @@
   overflow: hidden;
 }
 .treeContainer {
-  height:calc(100% - 50px);
+  height:calc(100% - 100px);
   overflow-y: scroll;
 }
 

src/components/MccsFileTree/index.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-06 10:28:12
- * @LastEditTime: 2021-11-24 15:11:07
+ * @LastEditTime: 2021-12-31 16:47:55
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsFileTree/index.tsx
@@ -36,20 +36,22 @@ type MccsFileTreeProps = {
   treeData: MccsFileTree.childTree[] | [],
   defaultSelected?: string,  //传id
   formContent?: ReactNode,
-  editable?: boolean
+  editable?: boolean,
+  renderFilter?: () => ReactNode,//添加自定义过滤操作
 }
 
 const MccsFileTree: React.FC<MccsFileTreeProps> = (props) => {
-  const { treeData, onSelectHandle, actionHandle, defaultSelected, searchHandle, editable } = props;
+  const { treeData, onSelectHandle, actionHandle, defaultSelected, searchHandle, editable, renderFilter } = props;
   const [isLoading, setIsLoading] = useState(true);
   //当前选中的
-  const [currentActivedIndex, setcurrentActivedIndex] = useState(defaultSelected ? defaultSelected : '');
+  const [currentActivedIndex, setcurrentActivedIndex] = useState('');
 
-  const actionFunc = (event:MouseEvent|undefined, type: TypeVals, data: MccsFileTree.childTree) => {
+  const actionFunc = (event: MouseEvent | undefined, type: TypeVals, data: MccsFileTree.childTree) => {
     event?.stopPropagation();
     actionHandle && actionHandle({ type, data: data });
   }
 
+
   //操作
   const Action = (props: MccsFileTree.childTree) => {
     const { isLeaf } = props;
@@ -67,11 +69,11 @@ const MccsFileTree: React.FC<MccsFileTreeProps> = (props) => {
         <div style={{ width: 5 }}></div>
         <Popconfirm
           title="是否确定删除?"
-          onConfirm={(e)=>{actionFunc(e, 'del', props)}}
+          onConfirm={(e) => { actionFunc(e, 'del', props) }}
           okText="确定"
           cancelText="取消"
         >
-          <Image width={15} preview={false} onClick={e=>e.stopPropagation()}  src={DelActionIcon} />
+          <Image width={15} preview={false} onClick={e => e.stopPropagation()} src={DelActionIcon} />
         </Popconfirm>
       </div>
     )
@@ -79,7 +81,8 @@ const MccsFileTree: React.FC<MccsFileTreeProps> = (props) => {
 
   //叶子结点结构
   const TreeNode = (nodeProps: MccsFileTree.childTree) => {
-    const { title, id,code } = nodeProps;
+    const { title, id, code, ...rest } = nodeProps;
+
     return (
       <div className={currentActivedIndex == id ? 'treeNode actived' : 'treeNode'} onClick={onSelectHandle ? () => {
         setcurrentActivedIndex(id);
@@ -105,6 +108,7 @@ const MccsFileTree: React.FC<MccsFileTreeProps> = (props) => {
     if (data.isLeaf) {
       return <TreeNode key={data.id} currentActivedIndex={currentActivedIndex} setcurrentActivedIndex={setcurrentActivedIndex} title={title} {...restProps} />
     }
+
     return (
       <DirectoryTree key={data.id} currentActivedIndex={currentActivedIndex} setcurrentActivedIndex={setcurrentActivedIndex}
         nodeLabel={node}  {...data} onClick={() => onSelectHandle ? onSelectHandle(data) : () => { }}
@@ -123,12 +127,47 @@ const MccsFileTree: React.FC<MccsFileTreeProps> = (props) => {
     )
   }
 
+
+  const deepGetVal = (dataToDeep: any[], key: string, subArr: string, findVal: number) => {
+    // console.log({dataToDeep,key,subArr});
+    let needVal = {};
+
+    function looper(dataToDeep: any[], key: string, subArr: string) {
+      dataToDeep.forEach(item => {
+        if (item[key] == findVal) {
+          needVal = item;
+          return;
+        }
+      
+        if (item[subArr] && item[subArr].length > 0) {
+          looper(item[subArr], key, subArr);
+        }
+      
+
+      });
+    }
+
+    looper(dataToDeep, key, subArr);
+
+    return needVal
+  }
+
+  useEffect(() => {
+    //当设置默认激活项时触发
+    if (defaultSelected != currentActivedIndex) {
+      setcurrentActivedIndex(defaultSelected ? defaultSelected : '');
+      const result = deepGetVal(treeData,'id','children',Number(defaultSelected));
+      onSelectHandle&&onSelectHandle(result as MccsFileTree.childTree);
+    }
+  }, [defaultSelected]);
+
   useEffect(() => {
     if (treeData.length > 0) {
       setIsLoading(false);
     }
   }, [treeData]);
 
+
   return (
     <div className='fileTree'>
       <div className="searchBar">
@@ -145,16 +184,25 @@ const MccsFileTree: React.FC<MccsFileTreeProps> = (props) => {
         }
         <Search placeholder='请输入' className="inputArea" allowClear onSearch={(val, e) => searchHandle && searchHandle(val)} />
       </div>
+      {
+        renderFilter && (
+          <div className='filter'>
+            {
+              renderFilter()
+            }
+          </div>
+        )
+      }
       <div className='treeContainer'>
-          {
-            isLoading ? <div className='spinWrap'><Spin delay={500} /></div> : (
-              <>
-                {treeData.map((node, i) => {
-                  return loop(node, i);
-                })}
-              </>
-            )
-          }
+        {
+          isLoading ? <div className='spinWrap'><Spin delay={500} /></div> : (
+            <>
+              {treeData.map((node, i) => {
+                return loop(node, i);
+              })}
+            </>
+          )
+        }
       </div>
     </div>
   );

src/components/MccsLightTable/index.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-12-24 09:43:04
- * @LastEditTime: 2021-12-27 11:45:37
+ * @LastEditTime: 2022-01-04 09:26:49
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsLightTable/index.tsx
@@ -57,6 +57,12 @@ const MccsLightTable: React.FC<{
         getData(current+1,size); //current 默认从0开始
     }
 
+    const pageChangeHandle = (page:number,pageSize:number|undefined)=>{
+        //分页页码变化时
+        // console.log({page,pageSize});
+        getData(page,pageSize?pageSize:10);
+    }
+
     useEffect(() => {
         const hasSetWidColumns = columns.filter(item => item.width);
         const needCountWidCloumnsNum = columns.length - hasSetWidColumns.length;
@@ -197,6 +203,7 @@ const MccsLightTable: React.FC<{
                             pageSize={pageData?.pageSize}
                             showSizeChanger 
                             showQuickJumper 
+                            onChange={(page,pageSize)=>pageChangeHandle(page,pageSize)}
                             onShowSizeChange={onShowSizeChangeHandle}
                         />
                     </div>

src/components/MccsLightTable/style.less

@@ -36,7 +36,7 @@
           top:0;
           content: '';
           width: 1px;
-          height:500px;
+          height:1000px;
           border-left:1px solid #CFD6E6;
       }
 

src/components/MccsPageContainer/index.tsx

@@ -100,15 +100,15 @@ const MccsPageContainer:React.FC<MccsPageContainerType> = (props)=>{
                             password,
                             rePassword
                         }
-                        resetPasswordHandle?.(params).then(bool=>{
+                        resetPasswordHandle?.(params).then((bool:boolean)=>{
                                 if(bool){
-                                    update(t => ({ ...t, goSetting: false }))
+                                    update((t:any) => ({ ...t, goSetting: false }))
                                 }
                         })
                     }
                 },
                 closable: false,
-                onCancel: () => update(t => ({ ...t, goSetting: false }))
+                onCancel: () => update((t:any) => ({ ...t, goSetting: false }))
             })
         }
     }, [goSetting]);

src/components/MccsProFormSelect/index.tsx

@@ -1,13 +1,13 @@
 /*
  * @Author: your name
  * @Date: 2021-12-07 09:47:50
- * @LastEditTime: 2021-12-09 15:32:45
+ * @LastEditTime: 2022-01-01 14:29:55
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /MedicalWisdomCheckSys/src/components/MccsProFormSelect/index.tsx
  */
 
-import { useState } from 'react'
+import React,{ useState,useEffect } from 'react'
 
 import {
     ProFormSelect,
@@ -23,18 +23,21 @@ import './style.less';
 type MccsSelectProps = {
     withInput?: boolean, //是否带有输入功能
     selectList?: { label: string, value: string }[], //select可选项
+    value?:string|number,
+    onChange?:(val:any)=>void
 } & ProFormSelectProps
 
 //props 参考proComponent
-const MccsSelect = (props: MccsSelectProps) => {
+const MccsSelect = (props:MccsSelectProps) => {
 
-    const { withInput, fieldProps, selectList,name,label, ...restProperty } = props;
+    const { withInput, fieldProps, selectList,name,label,value,onChange,...restProperty } = props;
     const [selectMode, setSelectMode] = useState<'SELECT' | 'INPUT'>('SELECT');
-    const [value,setValue] = useState<string>('');  //输入关键字
+    const [keyValue,setKeyValue] = useState<string>('');  //输入关键字
     const [find,setFind] = useState(false);
 
+
     const onSearchHandle = (val: string) => {
-        setValue(val);
+        setKeyValue(val);
         if (selectList&&withInput&&val.length>0) {
             //且需要带有输入框时
             const findeIndex = selectList.findIndex((t) => {
@@ -52,7 +55,7 @@ const MccsSelect = (props: MccsSelectProps) => {
 
     const inputOnChange = (e:any)=>{
         // console.log(e.target.value);
-        setValue(e.target.value);
+        setKeyValue(e.target.value);
         if (selectList&&withInput) {
             //且需要带有输入框时
             const findeIndex = selectList.findIndex((t) => {
@@ -71,11 +74,12 @@ const MccsSelect = (props: MccsSelectProps) => {
         if(withInput){
             //带有输入框且单选的时候
             if(Object.prototype.toString.call(values) == '[object String]'){
-                setValue(values);
+                setKeyValue(values);
             }
         }
     }
 
+
     return (
         <>
             {
@@ -86,9 +90,10 @@ const MccsSelect = (props: MccsSelectProps) => {
                         name={name}
                         fieldProps={{
                             onSearch: onSearchHandle,
-                            searchValue:value,
+                            searchValue:keyValue,
                             autoFocus:true,
-                            onChange:onSelectionchange,
+                            onChange:val=>{onSelectionchange(val);onChange&&onChange(val)},
+                            value,
                             ...fieldProps
                         }}
                         {...restProperty}
@@ -98,7 +103,7 @@ const MccsSelect = (props: MccsSelectProps) => {
             {
                 selectMode === 'INPUT' && (
                     <Form.Item name={name} label={label} >
-                        <Input style={{width:'216px'}} onChange={inputOnChange} value={value} placeholder="请输入" />
+                        <Input style={{width:'216px'}} onChange={inputOnChange} value={keyValue} placeholder="请输入" />
                     </Form.Item>
                 )
             }

src/global.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-03 14:28:27
- * @LastEditTime: 2021-12-22 16:01:41
+ * @LastEditTime: 2022-01-01 16:17:14
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/global.tsx
@@ -14,7 +14,10 @@ const { pwa } = defaultSettings;
 const isHttps = document.location.protocol === 'https:';
 
 
-// if pwa is true
+
+
+    
+  // if pwa is true
 if (pwa) {
   // Notify user if offline now
   window.addEventListener('sw.offline', () => {
@@ -22,7 +25,7 @@ if (pwa) {
   });
 
   // Pop up a prompt on the page asking the user if they want to use the latest version
-  window.addEventListener('sw.updated', (event: Event) => {
+  window.addEventListener('sw.updated',(event: Event) => {
     const e = event as CustomEvent;
     const reloadSW = async () => {
       // Check if there is sw whose state is waiting in ServiceWorkerRegistration
@@ -81,15 +84,16 @@ if (pwa) {
     if (sw) sw.unregister();
   });
 
-  // remove all caches
-  if (window.caches && await window.caches.keys()) {
-    caches.keys().then((keys) => {
-      keys.forEach((key) => {
-        caches.delete(key);
-      });
-    });
-  }
+  //remove all caches
+  // if (window.caches && await window.caches.keys()) {
+  //   caches.keys().then((keys) => {
+  //     keys.forEach((key) => {
+  //       caches.delete(key);
+  //     });
+  //   });
+  // }
 }
 
 
 
+

src/pages/GradeHospitalAccreditation/accreditationDetail/index.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-06 09:07:56
- * @LastEditTime: 2021-12-14 14:22:14
+ * @LastEditTime: 2022-01-04 08:58:30
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/accreditationDetail/index.tsx
@@ -93,9 +93,12 @@ const AccreditationDetail: React.FunctionComponent<AccreditationDetailProps> = p
       //叶子结点
       setIsLeaf(true);
       getDetailRuleListHandle(id);
+      //获取四码对应所有档次
       getMaterialListGradesFunc(code, version);
       setMode(2);
       setShowCardThree(true);
+      //每次切换叶子节点刷新资料目录表格数据
+      setReloadMaterialDirData(true);
 
     } else {
       //文件夹结点
@@ -135,7 +138,7 @@ const AccreditationDetail: React.FunctionComponent<AccreditationDetailProps> = p
       setModalVisible(true);
     }
   }
-  //搜索回调
+  //左侧树搜索回调
   const searchHandle = (val: any) => {
     getTreeData(val);
   }
@@ -149,7 +152,7 @@ const AccreditationDetail: React.FunctionComponent<AccreditationDetailProps> = p
     }
   }
 
-  //获取资料目录表格数据
+  //获取叶子节点下资料目录表格数据
   const getMaterialListFunc = async (params: MaterialTable.GeDataParams) => {
     const { selectorFilter, keyword,pageSize=10,current } = params;
     if (currentActived) {
@@ -176,7 +179,6 @@ const AccreditationDetail: React.FunctionComponent<AccreditationDetailProps> = p
   const getMaterialDirListFunc = async () => {
     //获取所有资料目录集合用于弹窗表单
     if (currentActived) {
-      console.log({currentActived});
       const { code, version } = currentActived;
       const resp = await getMaterialDirList({ numStr: code, version });
       if (resp) {

src/pages/GradeHospitalAccreditation/accreditationDetail/model.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-06 17:42:57
- * @LastEditTime: 2021-09-28 10:28:42
+ * @LastEditTime: 2021-12-30 17:02:55
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/accreditationDetail/model.ts
@@ -21,7 +21,7 @@ const accreditationDetail = () => {
   const getTreeData = async (keyword?:string|number) => {
     const {
       list=[]
-    } = await getTreeList(keyword);
+    } = await getTreeList(false,keyword);
 
     setTreeData(list);
   };

src/pages/GradeHospitalAccreditation/accreditationDetail/service.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-07 09:29:27
- * @LastEditTime: 2021-12-09 17:33:10
+ * @LastEditTime: 2021-12-30 17:19:47
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/accreditationDetail/service.ts
@@ -11,10 +11,43 @@ import { request } from 'umi';
 
 
 
+interface MineTreeData {
+    list:{
+        id:number,
+        numStr:string,
+        name:string,
+        parentId:number,
+        allParentIds:number,
+        ruleLevel:number,
+        ruleLevelNum:string,
+        version:string,
+        hospId:string,
+    }[]
+}
+
 
 //获取树结构
-export const getTreeList  = (keyword?:string|number)=>{
-  
+export const getTreeList  = async (isShowMineOnly:boolean,keyword?:string|number)=>{
+
+    if(isShowMineOnly){
+        const resp = await request<MineTreeData>('/api/pfm/reviewArticle/getAllByMy', {
+            method: 'GET',
+            params: {keyword:keyword},
+          });
+          const {list=[]} = resp;
+          const data =  list.map(item=>({
+            code:item.numStr,
+            id:item.id,
+            isLeaf:true,
+            levelNum:4,
+            title:item.name,
+            version:item.version
+          }));
+
+          return {list:data}
+        
+    }
+
     return request('/api/pfm/reviewRules/getAllTree', {
         method: 'GET',
         params:{keyword}

src/pages/GradeHospitalAccreditation/articleManagement/index.less

@@ -1,4 +1,6 @@
-//overwrite antd css
+
+.ArticleManagement {
+      //overwrite antd css
 .ant-col-6 {
   margin-bottom: 10px;
 }
@@ -12,51 +14,58 @@
 }
 
 .ant-pro-page-container-warp {
-  display: none;
+  display: none !important;
+}
+
+.ant-pro-card-col {
+  transition: width 0.2s ease-in;
+  transform: translate3d(0,0,0);
 }
 
 textarea.ant-input {
   font-size: 14px !important;
-font-family: SourceHanSansCN-Normal, SourceHanSansCN;
-font-weight: 400;
-color: #525866 !important;
-  background-color: #F0F2F5 !important;
+  font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+  font-weight: 400;
+  color: #525866 !important;
 }
 
 //----------------
 
 
-
-.cardWrap {
-    height: calc(100vh - 364px);
-    border-bottom: 2px solid red;
-    overflow-y: scroll;
-}
-.card {
-  padding: 16px;
-  background: #FFFFFF;
-  border-radius: 2px;
+.onlyMyselfFilter {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
   margin-bottom: 16px;
-  &:last-child {
-    margin-bottom: 0;
-  }
-  .cardTitle {
+  padding: 0 8px;
+  &>span {
     font-size: 14px;
     font-family: SourceHanSansCN-Normal, SourceHanSansCN;
     font-weight: 400;
-    color: #292C33;
-    margin-bottom: 16px;
+    color: #525966;
   }
+}
+
+
+.selfEvaluationWrap {
+    padding: 16px;
+    background: #FFFFFF;
+    border-radius: 2px;
+    margin-bottom: 16px;
+    margin-top: 16px;
   .selfEvaluation {
-      display: flex;
-      flex-direction: row;
-      align-items:center;
-      span {
-        font-size: 20px;
-        font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-        font-weight: 500;
-        padding-left: 16px;
-      }
+    display: flex;
+    height: 28px;
+    flex-direction: row;
+    align-items: center;
+
+    span {
+      font-size: 20px;
+      font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+      font-weight: 500;
+      padding-left: 16px;
+    }
   }
   .wrap {
     .tab {
@@ -71,18 +80,59 @@ color: #525866 !important;
       font-family: SourceHanSansCN-Normal, SourceHanSansCN;
       font-weight: 400;
       color: #525866;
-      margin-right:16px;
-  
+      margin-right: 16px;
+
       &.on {
         color: #3377FF;
         background: #EBF1FF;
       }
 
       &:last-child {
-        margin-bottom: 0;
+        margin-right: 0;
       }
     }
-  } 
+  }
+
+}
+.cardWrap {
+  // padding-top: 16px;
+  height: calc(100vh - 364px);
+  // border-bottom: 2px solid red;
+  overflow-y: scroll;
+  padding-bottom: 16px;
+
+  .card {
+    padding: 16px;
+    background: #FFFFFF;
+    border-radius: 2px;
+    margin-bottom: 16px;
+
+    .cardTitle {
+      font-size: 14px;
+      font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+      font-weight: 400;
+      color: #292C33;
+      margin-bottom: 16px;
+    }
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+
+  &.isModeTwo {
+    padding-top: 16px;
+    background-color: #FFFFFF;
+  }
+
+  .ant-form-item {
+    margin-bottom: 0;
+  }
+}
+
+.card {
+  padding: 16px;
+  background-color: #FFFFFF;
 }
 
 .leafContent {
@@ -123,6 +173,7 @@ color: #525866 !important;
     flex-direction: row;
     justify-content: space-between;
     align-items: center;
+    height:32px;
 
     .scoreInfo {
       display: flex;
@@ -163,7 +214,8 @@ color: #525866 !important;
       }
     }
 
-    .ruleSettingBtn,.editPageBtn {
+    .ruleSettingBtn,
+    .editPageBtn {
       font-size: 14px;
       font-family: SourceHanSansCN-Normal, SourceHanSansCN;
       font-weight: 400;
@@ -206,6 +258,7 @@ color: #525866 !important;
     margin-top: 26px;
     border-radius: 2px;
     overflow: hidden;
+
     .scoreGradeDetailList {
       position: relative;
       display: flex;
@@ -311,3 +364,5 @@ color: #525866 !important;
   color: #7A8599;
   margin-bottom: 16px;
 }
+
+}

src/pages/GradeHospitalAccreditation/articleManagement/index.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-14 10:22:09
- * @LastEditTime: 2021-12-27 18:25:26
+ * @LastEditTime: 2022-01-04 16:50:00
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/articleManagement/index.tsx
@@ -10,24 +10,28 @@
 
 import React, { useRef, useEffect, useState } from 'react'
 import MccsPageContainer from '@/components/MccsPageContainer/index'
-import MccsProCard from '@/components/MccsProCard/index';
+// import MccsProCard from '@/components/MccsProCard/index';
 import { useModel } from 'umi';
 import MccsFileTree from '@/components/MccsFileTree/index';
 import MccsTable from '@/components/MccsTable/index';
-
-import MccsRecordList from '@/components/MccsRecordList/index';
+// import MccsSelect from '@/components/MccsProFormSelect';
 import MccsDrawerForm from '@/components/MccsDrawerForm/index';
 import MccsClickableTabs from '@/components/MccsClickableTabs/index';
 import MccsUpload from '@/components/MccsUpload/index';
 import { MccsModal } from '@/components/MccsModal';
 import type { ProFormInstance, } from '@ant-design/pro-form';
-import { getScoreLevelData } from '@/pages/PlatformMana/generalSetting/serve';
+
 import { getScoreColor } from '@/constant';
 import MccsLightTable from '@/components/MccsLightTable';
 
-import { getCurrentLevelTable } from './server';
+import MccsEditableTable from '@/components/MccsEditableTable/index';
+
+import { getCurrentLevelTable, getTaizhangDirectoryTable } from './server';
+
+import { getScoreLevelData } from '@/pages/PlatformMana/generalSetting/serve';
+
 
-import { Form, Table, Space, Row, Col, Button, Tabs, Input } from 'antd'
+import { Form, Table, Space, Row, Col, Button, Input, Switch, Select } from 'antd'
 import {
     ProFormText,
     ProFormSelect,
@@ -36,9 +40,9 @@ import {
 
 import './index.less';
 
-const { TextArea } = Input;
-
 
+const { TextArea } = Input;
+const { Option } = Select;
 
 type ArticleManagementProps = {
     //组件配置信息
@@ -52,7 +56,6 @@ type SelectedRowsType = {
     [propsName: string]: any
 }
 
-const { TabPane } = Tabs;
 
 const columns = [
 
@@ -213,12 +216,9 @@ const MccsLightTableColumns = [
             return record.accountStatus == 0 ? '否' : '是'
         }
     },
-    // {
-    //     key:4,
-    //     title:'操作',
-    // }
 ]
 
+
 //条文管理
 const ArticleManagement: React.FC<ArticleManagementProps> = (props) => {
     const { columnsFromProps = [], headerConcig, isModeTwo } = props;
@@ -240,6 +240,109 @@ const ArticleManagement: React.FC<ArticleManagementProps> = (props) => {
 
     const [articleSettingFormInit, setArticleSettingFormInit] = useState<{}>({});  //条文设置表单回显默认值
     const [defaultOpened, setDefaultOpened] = useState<string>();
+    const [scrollAreaH,setScrollAreaH] = useState(100);
+    const leafContentRef = useRef<HTMLDivElement>(null);
+  
+
+    const mccsEditableTableColumns = [
+        {
+            title: '名称',
+            dataIndex: 'directory',
+            width: '50%',
+            align: 'center',
+            formItemProps: () => {
+                return {
+                    rules: [{ required: true, message: '此项为必填项' }],
+                };
+            },
+        },
+        {
+            title: '档次',
+            dataIndex: 'grade',
+            width: '15%',
+            align: 'center',
+            formItemProps: () => {
+                return {
+                    rules: [{ required: true, message: '此项为必填项' }],
+                };
+            },
+            renderFormItem: (_: any, config: any, form: any) => {
+
+                const { isEditable } = config;
+
+                return isEditable ? (
+                    <Select
+                        mode='multiple'
+                        placeholder='请选择'
+                    >
+                        {
+                            restModelData.gradeOptions.map((item,index)=>(
+                                <Option value={item.value} key={index}>{item.label}</Option>
+                            ))
+                        }
+                    </Select>
+  
+                ): <Input />;
+            },
+            render: (_: any, row: any) => {
+                return typeof _ == 'object' ? _.join(',') : _;
+            },
+        },
+        {
+            title: '类型',
+            dataIndex: 'accountType',
+            align: 'center',
+            width: '15%',
+            formItemProps: () => {
+                return {
+                    rules: [{ required: true, message: '此项为必填项' }],
+                };
+            },
+            renderFormItem: (_: any, { isEditable }: { isEditable: boolean }, form: any) => {
+
+                return isEditable ? (
+                    <Select
+                       placeholder='请选择'
+                    >
+                        {
+                            restModelData.accountTypeOptions.map((item,index)=>(
+                                <Option value={item.value} key={index}>{item.label}</Option>
+                            ))
+                        }
+                    </Select>
+                ) : <Input />;
+            },
+
+
+        },
+        {
+            title: '台账上传',
+            align: 'center',
+            dataIndex: 'accountStatus',
+            width: '10%',
+            valueType: 'switch',
+            // renderFormItem: (_: any, { isEditable }: { isEditable: boolean }) => {
+            //     return isEditable?(
+            //         <Form.Item name='accountStatus' valuePropName='checked'>
+            //             <Switch size='small'   />
+            //         </Form.Item>
+            //     ):<Input />
+            // },
+            render: (_: any, row: any) => {
+                // return <Switch size='small' defaultChecked={_=='0'?false:true}/>
+                return (
+                    <Switch size='small' disabled checked={row.accountStatus} />
+                )
+            },
+        },
+
+    ]
+
+
+    //左侧树搜索回调
+    const searchHandle = (val: any) => {
+        restModelData.getArticleTreeData(val);
+    }
 
     const onSelectHandle = (data: MccsFileTree.childTree) => {
         //左侧树节点点击回调
@@ -310,9 +413,85 @@ const ArticleManagement: React.FC<ArticleManagementProps> = (props) => {
     }
 
     const setEditPageStatus = () => {
+        //更改页面的编辑状态
         restModelData.setEditMode(!restModelData.editMode);
     }
 
+    const onTextAreaChange = (e: React.ChangeEvent<HTMLTextAreaElement>, level: string) => {
+        //更改执行情况说明数据
+        //首先找出要更新的项，再进行整体替换
+
+        if (restModelData.selectedSelfEvolution) {
+
+            const editTargetLevel = restModelData.selectedSelfEvolution.label;  //目标等级
+            //找出目标等级下正在更新的level
+            const editImplementationDataItemIndex = restModelData.implementationData[editTargetLevel].findIndex(item => item.level == level);
+            //拷贝旧的目标等级数据
+            let _cpOldImplemetationItem = restModelData.implementationData[editTargetLevel];
+            //将新的编辑内容赋值给正在编辑的目标下的level
+            _cpOldImplemetationItem[editImplementationDataItemIndex].note = e.target.value;
+
+            if (editImplementationDataItemIndex != -1) {
+                restModelData.setImplementationData({
+                    ...restModelData.implementationData,
+                    //插入更新
+                    [editTargetLevel]: _cpOldImplemetationItem
+                }
+                )
+            }
+        }
+
+    }
+
+    enum ActType {
+        'NOACT',  //不操作
+        'ADD',
+        'EDIT',
+        'DEL'
+    };
+
+    const taizhangDataDerectoryEditHandle = (data: any, actType: ActType) => {
+        //台账资料目录编辑回调
+        // console.log({data,actType});
+
+        const version = restModelData.leafData?.reviewArticle.version;
+        let prevData = restModelData.taizhangDataDirectoryCommitList;
+        const numStr = restModelData.leafData?.reviewArticle.numStr;
+
+        if (actType == ActType.DEL && (typeof data.id == 'string')) {
+            //如果是删除操作且删除的不是数据库已有数据时,剔除之前暂时保留数据
+            prevData = prevData.filter(item => item.directory != data.directory);
+            restModelData.setTaizhangDataDirectoryCommitList([...prevData]);
+            return;
+        }
+
+        restModelData.setTaizhangDataDirectoryCommitList(
+            [...prevData, {
+                ...data, dataStatus: actType, version: version ? version : '',
+                grade: data.grade.join(','), numStr: numStr, accountStatus: data.accountStatus?'1':'0'
+            }]
+        )
+    }
+
+    const taizhangImplementationCommit = () => {
+        //台账执行情况编辑结果提交
+        restModelData.commitTaizhangImplementationHandle();
+    }
+
+    const followWindowResize = ()=>{
+        //    console.log('resize',window);
+           if(leafContentRef.current){
+            const leafContentH = leafContentRef.current.clientHeight + 50;  //加上padding
+            const headerH = 48 + 16;
+            const scoreH = isModeTwo?(60+32):0;
+            const h =   window.innerHeight - (leafContentH + headerH + scoreH);
+            setScrollAreaH(h);
+          }
+    }
+
+    
+
+
 
     useEffect(() => {
 
@@ -321,6 +500,7 @@ const ArticleManagement: React.FC<ArticleManagementProps> = (props) => {
             tableRef?.current?.getTableRef().current?.reload();
             tableRef?.current?.getTableRef().current?.clearSelected();
         }
+
     }, [restModelData]);
 
 
@@ -336,6 +516,10 @@ const ArticleManagement: React.FC<ArticleManagementProps> = (props) => {
                     articleType: { label: accountType, value: accountType },
                 });
             }
+
+            restModelData.getGradeOptions();  //获取可选档次
+            restModelData.getAccoutTypeOptions(); //可选类型
+
         }
 
     }, [restModelData.leafData]);
@@ -354,332 +538,449 @@ const ArticleManagement: React.FC<ArticleManagementProps> = (props) => {
     useEffect(() => {
         if (treeData.length > 0) {
             //默认展开书结构第一个结点
+            //树结构组件会默认执行一遍onSelectHandle,将选中结点信息传出来
             const { id } = treeData[0];
             setDefaultOpened(`${id}`);
         }
     }, [treeData]);
 
+
+    useEffect(()=>{
+        // followWindowResize();
+        if(isLeaf){
+            setTimeout(()=>{
+                //首次加载叶子节点内容触发一次
+                var myEvent = new Event('resize');
+                window.dispatchEvent(myEvent); 
+                document.body.style.overflowY = 'hidden';  //叶子节点下锁住页面滚动
+            },100);
+        }
+        
+        if(!isLeaf){
+            document.body.style.overflowY = 'auto';  //非叶子节点放开
+        }
+    },[isLeaf]);
+
+
     useEffect(() => {
+        //页面加载完
+        //获取左侧输结构
         restModelData.getArticleTreeData();
+        //获取当前评分
         restModelData.getCurrentHospScore();
+        
+        // followWindowResize();
+    
+        window.addEventListener("resize",followWindowResize);
+
+        return ()=>{
+            window.removeEventListener("resize",followWindowResize);
+        }
+        
     }, [])
 
-    return (
-        <MccsPageContainer
-            config={headerConcig ? headerConcig : {
-                content: !isModeTwo && <div style={{ textAlign: 'right', fontSize: 12, color: '#525866' }}>{restModelData.currentHospSelfScoreAndOthers}</div>
-            }}
-        >
-            {
-                restModelData.modalVisible && (
-                    //台账上传弹窗
-                    <MccsModal title='台账上传' visible={restModelData.modalVisible}
-                        onFinish={(values: any) => restModelData.uploadFile(values)}
-                        initialValues={!restModelData.uploadFormInitValue ? {} : restModelData.uploadFormInitValue}
-                        onVisibleChange={onModalVisibleChange}
-                        params={restModelData.uploadFormInitValue}
-                        request={(params: any) => {
-                            return Promise.resolve(params)
-                        }}
-                    >
-                        <div className='formItemTitle'>选择类型</div>
-                        <Form.Item name='tab' rules={[
-                            {
-                                required: true,
-                                message: '请选择类型！',
-                            },
-                        ]}>
-                            <MccsClickableTabs
-                                //重新上传不允许更改类型
-                                disabled={(restModelData.uploadFormInitValue && JSON.stringify(restModelData.uploadFormInitValue) != '{}') ? true : false}
-                                type='multi'
-                                onChange={uploadLedgerChangeHandle}
-                                data={restModelData.uploadLedgerTypeList}
-                            />
-                        </Form.Item>
-                        <ProFormDependency name={['tab']}>
-                            {
-                                ({ tab }) => {
-                                    //制度特殊处理
-                                    return tab && tab.value.label == '制度' && (
-                                        <ProFormSelect
-                                            name="publicCateId"
-                                            label="制度下类型"
-                                            width='md'
-                                            request={async () => await restModelData.getSelectableRuleChilds(tab.value.value)}
-                                            placeholder="请选择"
-                                            rules={[{ required: true, message: '请选择!' }]}
-                                        />
-                                    )
-                                }
-                            }
-                        </ProFormDependency>
-                        <Form.Item name='files' rules={[
-                            {
-                                required: true,
-                                message: '请上传文件！',
-                            },
-                        ]}>
-                            <MccsUpload maxCount={10} />
-                        </Form.Item>
-                    </MccsModal>
-                )
-            }
 
-            {
-                //条文设置/表格批量设置drawer弹窗
-                restModelData.drawerVisible && (
-                    <MccsDrawerForm
-                        title={restModelData.drawerFormType == 'ARTICLE_SET' ? '条文设置' : '批量设置'}
-                        width={500}
-                        formRef={drawerFormRef}
-                        visible={restModelData.drawerVisible}
-                        initialValues={restModelData.drawerFormType == 'ARTICLE_SET' ? { ...articleSettingFormInit } : {}}
-                        onFinish={(values: any) => restModelData.drawerFormType == 'ARTICLE_SET' ? restModelData.setArticle(values) : restModelData.batchSetting(values)}
-                        onVisibleChange={onVisibleChangeHandle}
-                    >
-                        <div className='formItemTitle'>负责人及单位</div>
-                        <Row gutter={16}>
-                            <Col className="gutter-row" span={10}>
-                                <ProFormSelect
-                                    name="responsibilityDepartment"
-                                    width='sm'
-                                    showSearch
-                                    request={getDepartmentRequest}
-                                    placeholder="选择单位"
-                                    fieldProps={{
-                                        labelInValue: true,
-                                        onChange: (value, option) => {
-                                            //责任单位修改时清空责任人
-                                            drawerFormRef.current?.setFieldsValue({ ...articleSettingFormInit, responsibilityUser: { label: '', value: '' } });
-                                            getDepartment(value, option)
-                                        }
-                                    }}
-                                    rules={[{ required: true, message: '请选择单位！' }]}
-                                />
-                            </Col>
 
-                            <Col className="gutter-row" span={8}>
-                                <ProFormDependency name={['responsibilityDepartment']}>
-                                    {({ responsibilityDepartment }) => {
-                                        return (
+    return (
+        <div className='ArticleManagement'>
+            <MccsPageContainer
+                config={headerConcig ? headerConcig : {
+                    content: !isModeTwo && <div style={{ textAlign: 'right', fontSize: 12, color: '#525866' }}>{restModelData.currentHospSelfScoreAndOthers}</div>,
+                    footer: restModelData.editMode ? [
+                        <Button key="3" onClick={() => restModelData.setEditMode(false)}>取消</Button>,
+                        <Button key="2" type="primary" onClick={() => taizhangImplementationCommit()}>
+                            保存
+                        </Button>,
+                    ] : null
+                }}
+            >
+                {
+                    restModelData.modalVisible && (
+                        //台账上传弹窗
+                        <MccsModal title='台账上传' visible={restModelData.modalVisible}
+                            onFinish={(values: any) => restModelData.uploadFile(values)}
+                            initialValues={!restModelData.uploadFormInitValue ? {} : restModelData.uploadFormInitValue}
+                            onVisibleChange={onModalVisibleChange}
+                            params={restModelData.uploadFormInitValue}
+                            request={(params: any) => {
+                                return Promise.resolve(params)
+                            }}
+                        >
+                            <div className='formItemTitle'>选择类型</div>
+                            <Form.Item name='tab' rules={[
+                                {
+                                    required: true,
+                                    message: '请选择类型！',
+                                },
+                            ]}>
+                                <MccsClickableTabs
+                                    //重新上传不允许更改类型
+                                    disabled={(restModelData.uploadFormInitValue && JSON.stringify(restModelData.uploadFormInitValue) != '{}') ? true : false}
+                                    type='multi'
+                                    onChange={uploadLedgerChangeHandle}
+                                    data={restModelData.uploadLedgerTypeList}
+                                />
+                            </Form.Item>
+                            <ProFormDependency name={['tab']}>
+                                {
+                                    ({ tab }) => {
+                                        //制度特殊处理
+                                        return tab && tab.value.label == '制度' && (
                                             <ProFormSelect
-                                                name="responsibilityUser"
-                                                width='sm'
-                                                disabled={!responsibilityDepartment || JSON.stringify(responsibilityDepartment) == '{}'}
-                                                options={departmentManagers}
-                                                placeholder="选择负责人"
-                                                fieldProps={{
-                                                    labelInValue: true,
-                                                    // onChange:(value,option)=>getManagers(value,option)
-                                                }}
-                                                rules={[{ required: true, message: '请选择负责人！' }]}
+                                                name="publicCateId"
+                                                label="制度下类型"
+                                                width='md'
+                                                request={async () => await restModelData.getSelectableRuleChilds(tab.value.value)}
+                                                placeholder="请选择"
+                                                rules={[{ required: true, message: '请选择!' }]}
                                             />
                                         )
-                                    }}
-                                </ProFormDependency>
-                            </Col>
-                        </Row>
-                        <div className='formItemTitle'>目标分数</div>
-                        <Row >
-                            <Col span={24}>
-                                <Form.Item name='targetScores' rules={[
-                                    {
-                                        required: true,
-                                        message: '请选择目标分数!',
-                                    },
-                                ]}>
-                                    <MccsClickableTabs
-                                        data={restModelData.targetScores}
+                                    }
+                                }
+                            </ProFormDependency>
+                            <Form.Item name='files' rules={[
+                                {
+                                    required: true,
+                                    message: '请上传文件！',
+                                },
+                            ]}>
+                                <MccsUpload maxCount={10} />
+                            </Form.Item>
+                        </MccsModal>
+                    )
+                }
+
+                {
+                    //条文设置/表格批量设置drawer弹窗
+                    //restModelData.drawerVisible && 
+                    (
+                        <MccsDrawerForm
+                            title={restModelData.drawerFormType == 'ARTICLE_SET' ? '条文设置' : '批量设置'}
+                            width={500}
+                            formRef={drawerFormRef}
+                            visible={restModelData.drawerVisible}
+                            initialValues={restModelData.drawerFormType == 'ARTICLE_SET' ? { ...articleSettingFormInit } : {}}
+                            onFinish={(values: any) => restModelData.drawerFormType == 'ARTICLE_SET' ? restModelData.setArticle(values) : restModelData.batchSetting(values)}
+                            onVisibleChange={onVisibleChangeHandle}
+                        >
+                            <div className='formItemTitle'>负责人及单位</div>
+                            <Row gutter={16}>
+                                <Col className="gutter-row" span={10}>
+                                    <ProFormSelect
+                                        name="responsibilityDepartment"
+                                        width='sm'
+                                        showSearch
+                                        request={getDepartmentRequest}
+                                        placeholder="选择单位"
+                                        fieldProps={{
+                                            labelInValue: true,
+                                            onChange: (value, option) => {
+                                                //责任单位修改时清空责任人
+                                                drawerFormRef.current?.setFieldsValue({ ...articleSettingFormInit, responsibilityUser: { label: '', value: '' } });
+                                                getDepartment(value, option)
+                                            }
+                                        }}
+                                        rules={[{ required: true, message: '请选择单位！' }]}
                                     />
-                                </Form.Item>
-                            </Col>
-                        </Row>
-                        {
-                            true && (
-                                <>
-                                    <div className='formItemTitle'>条文组别</div>
-                                    <Row>
-                                        <Col span={24}>
-                                            <Form.Item name='articleType' rules={[
-                                                {
-                                                    required: true,
-                                                    message: '请选择条文组别!',
-                                                },
-                                            ]}>
-                                                <MccsClickableTabs
-                                                    data={restModelData.ruleTypes}
+                                </Col>
+
+                                <Col className="gutter-row" span={8}>
+                                    <ProFormDependency name={['responsibilityDepartment']}>
+                                        {({ responsibilityDepartment }) => {
+                                            return (
+                                                <ProFormSelect
+                                                    name="responsibilityUser"
+                                                    width='sm'
+                                                    disabled={!responsibilityDepartment || JSON.stringify(responsibilityDepartment) == '{}'}
+                                                    options={departmentManagers}
+                                                    placeholder="选择负责人"
+                                                    fieldProps={{
+                                                        labelInValue: true,
+                                                        // onChange:(value,option)=>getManagers(value,option)
+                                                    }}
+                                                    rules={[{ required: true, message: '请选择负责人！' }]}
                                                 />
-                                            </Form.Item>
-                                        </Col>
-                                    </Row>
-                                </>
-                            )
-                        }
+                                            )
+                                        }}
+                                    </ProFormDependency>
+                                </Col>
+                            </Row>
+                            <div className='formItemTitle'>目标分数</div>
+                            <Row >
+                                <Col span={24}>
+                                    <Form.Item name='targetScores' rules={[
+                                        {
+                                            required: true,
+                                            message: '请选择目标分数!',
+                                        },
+                                    ]}>
+                                        <MccsClickableTabs
+                                            data={restModelData.targetScores}
+                                        />
+                                    </Form.Item>
+                                </Col>
+                            </Row>
+                            {
+                                true && (
+                                    <>
+                                        <div className='formItemTitle'>条文组别</div>
+                                        <Row>
+                                            <Col span={24}>
+                                                <Form.Item name='articleType' rules={[
+                                                    {
+                                                        required: true,
+                                                        message: '请选择条文组别!',
+                                                    },
+                                                ]}>
+                                                    <MccsClickableTabs
+                                                        data={restModelData.ruleTypes}
+                                                    />
+                                                </Form.Item>
+                                            </Col>
+                                        </Row>
+                                    </>
+                                )
+                            }
 
-                    </MccsDrawerForm>
+                        </MccsDrawerForm>
 
-                )
-            }
+                    )
+                }
 
-            <MccsProCard gutter={16} ghost direction='row'>
-                <MccsProCard colSpan={6} style={{ height: '78vh' }} bodyStyle={{ padding: '16px' }}>
-                    {
-                        defaultOpened && (
-                            <MccsFileTree
-                                treeData={treeData}
-                                defaultSelected={defaultOpened}
-                                onSelectHandle={onSelectHandle}
-                                // actionHandle={actionHandle}
-                                // searchHandle={searchHandle}
-                                editable={false}
-                            />
-                        )
-                    }
-                </MccsProCard>
-                <MccsProCard colSpan={18} bodyStyle={{ padding: 0, background: '#F2F5FA' }}>
-                    <div className='card'>
+                <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', width: '100%' }}>
+                    <div style={{ height: '85vh', width: restModelData.editMode ? 0 : '25%', transition: 'width 0.2s ease-in', padding: '16px', backgroundColor: '#fff', marginRight: '16px', boxSizing: 'border-box' }} >
                         {
-                            !isLeaf && (
-                                <MccsTable
-                                    ref={tableRef}
-                                    columns={columnsFromProps.length > 0 ? columnsFromProps : columns}
-                                    request={getTableData}
-                                    search={{
-                                        span: 6
-                                    }}
-                                    rowSelection={isModeTwo ? false : {
-                                        // 自定义选择项参考: https://ant.design/components/table-cn/#components-table-demo-row-selection-custom
-                                        // 注释该行则默认不显示下拉选项
-                                        selections: [Table.SELECTION_ALL, Table.SELECTION_INVERT],
-                                    }}
-                                    rowKey="id"
-                                    tableAlertOptionRender={({ selectedRowKeys, selectedRows, onCleanSelected }: { selectedRowKeys: number[] | string[], selectedRows: SelectedRowsType[], onCleanSelected: () => void }) => {
-                                        return (
-                                            <Space size={16}>
-                                                <Button type='primary' onClick={() => batchSelfAssessment(selectedRowKeys)}>批量设置</Button>
-                                                <Button type='ghost' onClick={onCleanSelected}>取消选择</Button>
-                                            </Space>
-                                        );
+                            defaultOpened && (
+                                <MccsFileTree
+                                    treeData={treeData}
+                                    defaultSelected={defaultOpened}
+                                    onSelectHandle={onSelectHandle}
+                                    searchHandle={searchHandle}
+                                    renderFilter={() => {
+                                        //只在台账上传时展示
+                                        return isModeTwo ? (
+                                            <div className='onlyMyselfFilter'>
+                                                <span>只看我的</span>
+                                                <Switch size='small' onChange={(checked) => restModelData.setIsShowMineOnly(checked)} />
+                                            </div>
+                                        ) : null
                                     }}
-                                // searchNode={searchNode()}
+                                    editable={false}
                                 />
                             )
                         }
+                    </div>
+                    <div style={{ padding: 0, width: restModelData.editMode ? '100%' : '75%', transition: 'width 0.2s ease-in' }}>
+                        <div className='card'>
+                            {
+                                !isLeaf && (
+                                    <MccsTable
+                                        ref={tableRef}
+                                        columns={columnsFromProps.length > 0 ? columnsFromProps : columns}
+                                        request={getTableData}
+                                        search={{
+                                            span: 6
+                                        }}
+                                        rowSelection={isModeTwo ? false : {
+                                            // 自定义选择项参考: https://ant.design/components/table-cn/#components-table-demo-row-selection-custom
+                                            // 注释该行则默认不显示下拉选项
+                                            selections: [Table.SELECTION_ALL, Table.SELECTION_INVERT],
+                                        }}
+                                        rowKey="id"
+                                        tableAlertOptionRender={({ selectedRowKeys, selectedRows, onCleanSelected }: { selectedRowKeys: number[] | string[], selectedRows: SelectedRowsType[], onCleanSelected: () => void }) => {
+                                            return (
+                                                <Space size={16}>
+                                                    <Button type='primary' onClick={() => batchSelfAssessment(selectedRowKeys)}>批量设置</Button>
+                                                    <Button type='ghost' onClick={onCleanSelected}>取消选择</Button>
+                                                </Space>
+                                            );
+                                        }}
+                                    // searchNode={searchNode()}
+                                    />
+                                )
+                            }
 
-                        {
-                            isLeaf && (
-                                <div className='leafContent'>
-                                    <div className='leafContentTitle'>{currentActivedTree ? currentActivedTree.title : ''}</div>
-                                    <div className='peopleGroup'>
-                                        <span>条文组别：</span>
-                                        <span>{restModelData.leafData?.reviewArticle?.accountType}</span>
-                                        <span>负责单位：</span>
-                                        <span>{restModelData.leafData?.reviewArticle?.responsibilityDepartmentName}</span>
-                                        <span>负责人：</span>
-                                        <span>{restModelData.leafData?.reviewArticle?.responsibilityUserName}</span>
-                                    </div>
-                                    {/* <MccsScoreBanner list={scoreList} /> */}
-                                    <div className='scoreRow'>
-                                        <div className='scoreInfo'>
+                            {
+                                isLeaf && (
+                                    <div className='leafContent' ref={leafContentRef}>
+                                        <div className='leafContentTitle'>{currentActivedTree ? currentActivedTree.title : ''}</div>
+                                        <div className='peopleGroup'>
+                                            <span>条文组别：</span>
+                                            <span>{restModelData.leafData?.reviewArticle?.accountType}</span>
+                                            <span>负责单位：</span>
+                                            <span>{restModelData.leafData?.reviewArticle?.responsibilityDepartmentName}</span>
+                                            <span>负责人：</span>
+                                            <span>{restModelData.leafData?.reviewArticle?.responsibilityUserName}</span>
+                                        </div>
+                                        {/* <MccsScoreBanner list={scoreList} /> */}
+                                        <div className='scoreRow'>
+                                            <div className='scoreInfo'>
+                                                {
+                                                    scoreList.map((item, index) => {
+                                                        return (
+                                                            <div key={index} className='scoreBlock'>
+                                                                {item.label}
+                                                                {item.value && item.value != '-' ? (<span style={{ color: getScoreColor(item.value) }}>{item.value}</span>) : ' -'}
+                                                            </div>
+                                                        )
+                                                    })
+                                                }
+                                            </div>
                                             {
-                                                scoreList.map((item, index) => {
-                                                    return (
-                                                        <div key={index} className='scoreBlock'>
-                                                            {item.label}
-                                                            {item.value && item.value != '-' ? (<span style={{ color: getScoreColor(item.value) }}>{item.value}</span>) : ' -'}
+                                                //条文页面
+                                                !restModelData.moduleMode && <div className='ruleSettingBtn' onClick={articleSetBtnHandle}>条文设置</div>
+                                            }
+                                            {
+                                                //台账上传页面且非编辑状态下
+                                                (restModelData.moduleMode && !restModelData.editMode && restModelData.hasEditAuthority) && <div className='editPageBtn' onClick={() => setEditPageStatus()}>{restModelData.editMode ? '取消编辑' : '开启编辑'}</div>
+                                            }
+                                        </div>
+                                        <div className='scoreGradeDetail'>
+
+                                            {
+                                                restModelData.leafData?.pfmViewRuleDetailDataVoList.map((item, index) => (
+                                                    <div className='scoreGradeDetailList' key={index}>
+                                                        <div className='head'>{item.evaluation}</div>
+                                                        <div className='detail'>
+                                                            {
+                                                                item.viewRuleAndLevelVos && item.viewRuleAndLevelVos.map((v, k) => (
+                                                                    <div className='textLine' key={k}>{`${v.grade} ${v.detail}`}</div>
+                                                                ))
+                                                            }
                                                         </div>
-                                                    )
-                                                })
+                                                    </div>
+                                                ))
                                             }
                                         </div>
+                                    </div>
+                                )
+                            }
+                        </div>
+                        {
+                            isLeaf && isModeTwo && (
+                                <div className='selfEvaluationWrap'>
+                                    <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', width: '100%', }}>
+                                        <div className='selfEvaluation'>
+                                            自评等级
+                                            {!restModelData.editMode && (
+                                                <span style={{ color: getScoreColor(restModelData.leafData ? restModelData.leafData.reviewArticle.selfEvaluation : '') }}>{restModelData.leafData?.reviewArticle.selfEvaluation ? restModelData.leafData?.reviewArticle.selfEvaluation : '-'}</span>
+                                            )}
+                                        </div>
                                         {
-                                            //条文页面
-                                            !restModelData.moduleMode && <div className='ruleSettingBtn' onClick={articleSetBtnHandle}>条文设置</div>
-                                        }
-                                        {
-                                            //台账上传页面
-                                            restModelData.moduleMode && <div className='editPageBtn' onClick={() => setEditPageStatus()}>{restModelData.editMode ? '取消编辑' : '开启编辑'}</div>
+                                            restModelData.editMode && (
+                                                <div className='wrap' style={{ width: '60%', display: 'flex', flexDirection: 'row', justifyContent: 'flex-end' }}>
+                                                    {
+                                                        restModelData.targetScores.map((item, index) => (
+                                                            <div className={restModelData.selectedSelfEvolution?.label == item.label ? 'tab on' : 'tab'} key={index} onClick={() => restModelData.onSelfEvolutionTabChange(item)}>{item.label}</div>
+                                                        ))
+                                                    }
+                                                </div>
+                                            )
                                         }
                                     </div>
-                                    <div className='scoreGradeDetail'>
+                                </div>
+                            )
+                        }
 
+                        {
+                            isLeaf && restModelData.leafData && (
+                                //台账上传页面时，背景色统一白色，cardWrap提供容器实现上下滑动
+                                <div className={isModeTwo ? 'cardWrap isModeTwo' : 'cardWrap'} style={{height:`${scrollAreaH}px`,marginTop:'16px'}}>
+                                    <div>
                                         {
-                                            restModelData.leafData?.pfmViewRuleDetailDataVoList.map((item, index) => (
-                                                <div className='scoreGradeDetailList' key={index}>
-                                                    <div className='head'>{item.evaluation}</div>
-                                                    <div className='detail'>
+                                            //渲染执行情况说明
+                                            /**
+                                             * 满足条件：
+                                             * 1.存在自评等级从接口获取或手动点击选择
+                                             * 2.implementationData里有当前等级的数据
+                                             */
+                                            (restModelData.selectedSelfEvolution && restModelData.implementationData[restModelData.selectedSelfEvolution.label])
+                                            && restModelData.implementationData[restModelData.selectedSelfEvolution.label].map((item, index) => {
+
+                                                return (
+                                                    <div className='card' key={index} style={{ marginBottom: isModeTwo ? 0 : '16px', paddingBottom: isModeTwo ? 0 : '16px', paddingTop: isModeTwo ? 0 : '16px' }}>
+                                                        <div className='cardTitle' style={{ marginBottom: isModeTwo ? '8px' : '16px' }}>{`执行情况说明（等级${item.level}）`}</div>
+
+                                                        <TextArea allowClear showCount maxLength={2000}
+                                                            autoSize={{
+                                                                minRows: 5,
+                                                                maxRows: 20
+                                                            }}
+                                                            disabled={!restModelData.editMode} value={item.note}
+                                                            onChange={e => onTextAreaChange(e, item.level)}
+                                                            style={{ marginBottom: 20 }} />
+
                                                         {
-                                                            item.viewRuleAndLevelVos && item.viewRuleAndLevelVos.map((v, k) => (
-                                                                <div className='textLine' key={k}>{`${v.grade} ${v.detail}`}</div>
-                                                            ))
+                                                            !isModeTwo && (
+                                                                <MccsLightTable
+                                                                    columns={MccsLightTableColumns}
+                                                                    request={(current, pageSize) => getCurrentLevelTable({
+                                                                        level: item.level,
+                                                                        numStr: currentActivedTree ? currentActivedTree.code : 'null',
+                                                                        version: restModelData.leafData ? (restModelData.leafData.reviewArticle.version) : 'null',
+                                                                        current,
+                                                                        pageSize
+                                                                    })}
+                                                                />
+                                                            )
                                                         }
                                                     </div>
-                                                </div>
-                                            ))
+                                                )
+                                            })
+                                        }
+                                    </div>
+                                    <div style={{ padding: '0 16px' }}>
+                                        {
+                                            //台帐下展示
+                                            (isModeTwo && restModelData.leafData) && (
+                                                <MccsEditableTable
+                                                    bordered={true}
+                                                    controlled={false}
+                                                    edit={restModelData.editMode}
+                                                    reload={!restModelData.editMode}
+                                                    pagination={true}
+                                                    addHandle={
+                                                        (data: any) => taizhangDataDerectoryEditHandle(data, ActType.ADD)
+                                                    }
+                                                    editHandle={
+                                                        (data: any) => taizhangDataDerectoryEditHandle(data, ActType.EDIT)
+                                                    }
+                                                    delHandle={
+                                                        (data: any) => taizhangDataDerectoryEditHandle(data, ActType.DEL)
+                                                    }
+                                                    request={async (current, pageSize) => {
+                                        
+                                                        if (restModelData.leafData) {
+
+                                                            const { numStr, version } = restModelData.leafData.reviewArticle;
+                                                            const resp = await getTaizhangDirectoryTable({ numStr, version, current, pageSize });
+                                                            const { list = [] } = resp;
+                                                            return {
+                                                                data: list.map(item => ({ ...item, grade: item.grade ? item.grade.split(',') : [], accountStatus: item.accountStatus == '0' ? false : true })), //多选下拉需传数组值
+                                                                total: resp.totalCount,
+                                                                current: resp.current,
+                                                                success: true
+                                                            };
+                                                        }
+                                                        return {
+                                                            data: [],
+                                                            total: 0,
+                                                            success: false
+                                                        }
+                                                    }}
+                                                    columns={mccsEditableTableColumns}
+                                                />
+                                            )
                                         }
                                     </div>
                                 </div>
                             )
                         }
-                    </div>
-
 
-                    {
-                        isLeaf && (
-                            <div className='cardWrap'>
-                                {
-                                    isModeTwo && (
-                                        <div className='card'>
-                                            <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', width: '100%' }}>
-                                                <div className='selfEvaluation'>
-                                                    自评等级
-                                                    {!restModelData.editMode && (
-                                                        <span style={{ color: getScoreColor(restModelData.leafData ? restModelData.leafData.reviewArticle.selfEvaluation : '') }}>{restModelData.leafData?.reviewArticle.selfEvaluation}</span>
-                                                    )}
-                                                </div>
-                                                {
-                                                    restModelData.editMode && (
-                                                        <div className='wrap' style={{ width: '60%', display: 'flex', flexDirection: 'row', justifyContent: 'flex-end' }}>
-                                                            {
-                                                                restModelData.targetScores.map((item, index) => (
-                                                                    <div className={restModelData.selectedSelfEvolution?.label == item.label ? 'tab on' : 'tab'} key={index} onClick={() => restModelData.onSelfEvolutionTabChange(item)}>{item.label}</div>
-                                                                ))
-                                                            }
-                                                        </div>
-                                                    )
-                                                }
-                                            </div>
-                                        </div>
-                                    )
-                                }
-                                {
-                                    restModelData.leafData?.pfmImplementations.map((item, index) => {
-                                        return (
-                                            <div className='card' key={index}>
-                                                <div className='cardTitle'>{`执行情况说明（等级${item.level}）`}</div>
-                                                <TextArea allowClear showCount maxLength={2000} disabled={!restModelData.editMode} value={item.note} style={{ marginBottom: 20 }} />
-                                                <MccsLightTable
-                                                    columns={MccsLightTableColumns}
-                                                    request={(current, pageSize) => getCurrentLevelTable({
-                                                        level: item.level,
-                                                        numStr: currentActivedTree ? currentActivedTree.code : 'null',
-                                                        version: restModelData.leafData ? (restModelData.leafData.reviewArticle.version) : 'null',
-                                                        current,
-                                                        pageSize
-                                                    })}
-                                                />
-                                            </div>
-                                        )
-                                    })
-                                }
-                            </div>
-                        )
-                    }
-
-                </MccsProCard>
-            </MccsProCard>
-        </MccsPageContainer>
+                    </div>
+                </div>
+            </MccsPageContainer>
+        </div>
     )
 }
 

src/pages/GradeHospitalAccreditation/articleManagement/model.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-14 10:46:45
- * @LastEditTime: 2021-12-27 18:07:40
+ * @LastEditTime: 2022-01-04 11:21:25
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/articleManagement/model.ts
@@ -20,14 +20,29 @@ import {
   getUploadLedgerSelectableType,
   getCurrentHospSelfScore,
   getRuleChildrens,
+  getTaizhangImplementation,
+  commitTaizhangImplementation,
+  commitTaizhangDataDirectoryTableList,
+  
 } from './server';
-import { getTreeList } from '@/pages/GradeHospitalAccreditation/accreditationDetail/service';
+import { getTreeList,getMaterialListGrades} from '@/pages/GradeHospitalAccreditation/accreditationDetail/service';
 import {
   getScoreLevelData,
   getAccreditationTypeData,
+  getLedgerType
 } from '@/pages/PlatformMana/generalSetting/serve';
+
 import { notification } from 'antd';
 
+export interface ImplementationDataItem {
+  level: string;
+  note: string;
+}
+
+export interface ImplementationDataItemCache {
+  [tabkey: string]: ImplementationDataItem[];
+}
+
 //articleManagement
 const articleManagement = () => {
   const [treeData, setTreeData] = useState<any[]>([]);
@@ -36,7 +51,9 @@ const articleManagement = () => {
   const [isLeaf, setIsLeaf] = useState(false);
   const [scoreList, setScoreList] = useState<{ label: string; value: string }[]>([]);
   const [leafData, setLeafData] = useState<API.LeafDataType>(); //叶子结点数据
-  const [departmentManagers, setDepartmentManagers] = useState<{label:string,value:number}[]>([]);
+  const [departmentManagers, setDepartmentManagers] = useState<{ label: string; value: number }[]>(
+    [],
+  );
   const [selectedDepartment, setSelectedDepartment] = useState<any>();
   const [targetScores, setTargetScores] = useState<MccsClickableTabs.TabType[]>([]);
   const [ruleTypes, setRuleTypes] = useState<MccsClickableTabs.TabType[]>([]);
@@ -53,8 +70,6 @@ const articleManagement = () => {
 
   const [moduleMode, setModuleMode] = useState(false); //true台账上传 false条文管理
 
-  const [tabKey, setTabKey] = useState<string | number>(); //antd Tab切换
-
   const [modalVisible, setModalVisible] = useState(false);
 
   const [uploadFormInitValue, setUploadFormInitValue] = useState<any>();
@@ -62,18 +77,31 @@ const articleManagement = () => {
   const [selectedSelfEvolution, setSelectedSelfEvolution] =
     useState<{ label: string; value: any }>(); //MccsClickableTabs value值
 
-  const [currentSelectedSelefEvolution, setCurrentSelectedSelefEvolution] = useState<{ label: string; value: any }>(); //当前选中自评 点击对象
+  const [currentSelectedSelefEvolution, setCurrentSelectedSelefEvolution] =
+    useState<{ label: string; value: any }>(); //当前选中自评 点击对象
 
   const [uploadLedgerTypeList, setUploadLedgerTypeList] = useState<MccsClickableTabs.TabType[]>([]); //上传台账可选类型
 
   const [currentHospSelfScoreAndOthers, setCurrentHospSelfScoreAndOthers] = useState<string>(); //当前医院评分及自评结果
 
-  const [editMode,setEditMode] = useState(false);  //编辑模式，台帐上传页面用到
+  const [editMode, setEditMode] = useState(false); //编辑模式，台帐上传页面用到
+
+  const [implementationData, setImplementationData] = useState<ImplementationDataItemCache>({}); //执行情况说明数据
+  const [taizhangDataDirectoryCommitList, setTaizhangDataDirectoryCommitList] = useState<
+    API.TaizhangDataDirectoryCommitListItem[]
+  >([]);
+
+  const [isShowMineOnly, setIsShowMineOnly] = useState(false); //左侧树形结构是否只展示当前用户所属的
+
+  const [hasEditAuthority, setHasEditAuthority] = useState(false); //是否有编辑权限
+
+  const [gradeOptions, setGradeOptions] = useState<{ label: string, value: string | number }[]>([]);
+  const [accountTypeOptions, setAccountTypeOptions] = useState<{ label: string, value: string | number }[]>([]);
 
 
   const getArticleTreeData = async (keyword?: string | number) => {
     //获取树数据
-    const { list = [] } = await getTreeList(keyword);
+    const { list = [] } = await getTreeList(isShowMineOnly, keyword);
     setTreeData(list);
   };
 
@@ -93,11 +121,13 @@ const articleManagement = () => {
         specifyId
           ? {
               //传入树结构id指定获取某一节点对应数据
+              pageSize: 10,
               ...params,
               id: specifyId,
             }
           : {
               //直接拿树结构id
+              pageSize: 10,
               ...params,
               id: currentActivedTree ? currentActivedTree.id : 0,
             },
@@ -106,7 +136,7 @@ const articleManagement = () => {
 
       if (resp) {
         const { page, leafData, isLeaf } = resp;
-
+        // console.log({page, leafData, isLeaf});
         if (!isLeaf && page) {
           //非叶子结点返回table数据
           const { list = [], totalCount } = page;
@@ -116,9 +146,31 @@ const articleManagement = () => {
             total: totalCount,
           };
         }
-
+        setLeafData(undefined);
         if (isLeaf && leafData) {
           setLeafData(leafData);
+        } else {
+          setLeafData({
+            reviewArticle: {
+              id: -1,
+              ruleId: -1,
+              numStr: '',
+              version: '',
+              selfEvaluation: '',
+              targetEvaluation: '',
+              systemEvaluation: '',
+              siteEvaluation: '',
+              responsibilityDepartmentId: -1,
+              responsibilityDepartmentName: '-',
+              responsibilityUserId: -1,
+              responsibilityUserName: '-',
+              accountType: '-',
+              hospId: -1,
+              userId:-1
+            },
+            pfmViewRuleDetailDataVoList: [],
+            pfmImplementations: [],
+          });
         }
       }
       return [];
@@ -134,8 +186,8 @@ const articleManagement = () => {
         label: item.name,
         value: item.id,
       }));
-    }else{
-      return []
+    } else {
+      return [];
     }
   };
 
@@ -200,8 +252,8 @@ const articleManagement = () => {
       const { list = [] } = resp;
       if (list.length > 0) {
         const tempPeople = list[0].sysEmployeeVOList.map((item) => ({
-          label: item?item.name:'null',
-          value: item?item.id:0,
+          label: item ? item.name : 'null',
+          value: item ? item.id : 0,
         }));
         setDepartmentManagers(tempPeople);
       }
@@ -275,9 +327,92 @@ const articleManagement = () => {
     }
   };
 
+  const compalier = (data: ImplementationDataItem[], base: any[]) => {
+    let result: ImplementationDataItem[] = [];
+
+    const hasDataKeys = data.map((item) => item.level); //找出已经请求到数据的集合
+
+    let difference = hasDataKeys
+      .concat(base)
+      .filter((v) => !hasDataKeys.includes(v) || !base.includes(v)); //找出缺失的项
+    // console.log({difference});
+    const needAddImplementationData = difference.map((item) => ({ level: item, note: '' }));
+    const lastimplementationData = [...data, ...needAddImplementationData]; //将需要新增的项添加
+    lastimplementationData.forEach((item) => {
+      //数据排序，A>B>C
+      switch (item.level) {
+        case 'A':
+          result[2] = item;
+          break;
+        case 'B':
+          result[1] = item;
+          break;
+        case 'C':
+          result[0] = item;
+          break;
+      }
+    });
+    return result;
+  };
+
+  const implementationDataFilter = (data: ImplementationDataItem[]) => {
+    if (editMode && moduleMode) {
+      if (selectedSelfEvolution?.label == 'A') {
+        /**
+         * 根据业务逻辑，当选中的值为A时，需要提供A，B，C三个的数据，若没有则需要添加
+         */
+        if (data.length == 3) return data; //存在三个值时，直接返回
+        return compalier(data, ['A', 'B', 'C']);
+      }
+
+      if (selectedSelfEvolution?.label == 'B') {
+        /**
+         * 根据业务逻辑，当选中的值为B时，需要提供B,C两个的数据，若没有则需要添加
+         */
+        if (data.length == 2) return data; //存在2个值时，直接返回
+        return compalier(data, ['B', 'C']);
+      }
+      if (selectedSelfEvolution?.label == 'C') {
+        /**
+         * 根据业务逻辑，当选中的值为C时，需要提供C一个个的数据，若没有则需要添加
+         */
+        if (data.length == 1) return data; //存在1个值时，直接返回
+        return compalier(data, ['C']);
+      }
+    }
+    return data;
+  };
+
+  const getImplementationForEdit = async ({
+    numStr,
+    version,
+    level,
+  }: {
+    numStr: string;
+    version: string;
+    level: string;
+  }) => {
+    //或区指定等级的执行情况说明数据，同时根据返回的数据自行添加需要补充的项
+
+    if (implementationData[level]) return; //implementationData集合里已经有了该等级对应的数据时，不请求，为了保证编辑的数据缓存
+
+    const data = await getTaizhangImplementation({ numStr, version, level });
+    const implementData: ImplementationDataItem[] = data.map((item) => ({
+      level: item.level,
+      note: item.note,
+    }));
+    const resultData = implementationDataFilter(implementData); //得到改造过的数据
+    /**
+     * 为什么不直接赋值渲染？
+     * 应业务要求，自评等级切换时保留之前填写数据
+     * 所以额外建立一个键值对象进行缓存
+     */
+
+    setImplementationData({ ...implementationData, [level]: resultData });
+  };
+
   const onSelfEvolutionTabChange = (value: { label: string; value: any }) => {
     //自评tab切换回调
-    // console.log({value});
     value && setCurrentSelectedSelefEvolution(value);
     value && setSelectedSelfEvolution(value);
   };
@@ -376,6 +511,55 @@ const articleManagement = () => {
     return resp.map((t: { id: number; name: string }) => ({ label: t.name, value: t.id }));
   };
 
+  const commitTaizhangImplementationHandle = async () => {
+    // console.log({taizhangDataDirectoryCommitList});
+    if (leafData) {
+      const selfEvo = selectedSelfEvolution ? selectedSelfEvolution.label : '';
+      const list = implementationData[selfEvo].map((item) => ({
+        selfEvaluation: item.level,
+        node: item.note,
+      }));
+      //提交台账执行情况说明
+      const respImplementation = await commitTaizhangImplementation({
+        hospId: `${leafData.reviewArticle.hospId}`,
+        id: leafData.reviewArticle.id,
+        numStr: leafData.reviewArticle.numStr,
+        selfEvaluation: selfEvo,
+        version: leafData.reviewArticle.version,
+        implementationDtoList: list,
+      });
+
+      if (taizhangDataDirectoryCommitList.length > 0) {
+        //需要操作的列表数大于0
+        const respDataDirectoryTable = await commitTaizhangDataDirectoryTableList(
+          taizhangDataDirectoryCommitList,
+        );
+      }
+      setEditMode(false);
+      getTableData();
+    }
+  };
+
+
+  const getGradeOptions = async () => {
+    if (leafData) {
+        const { numStr, version } = leafData.reviewArticle;
+        const resp = await getMaterialListGrades({ numStr, version });
+        if (resp) {
+            const options = resp.map(item => ({ label: item.grade, value: item.grade }));
+            setGradeOptions(options);
+        }
+    }
+}
+
+const getAccoutTypeOptions = async () => {
+    const resp = await getLedgerType();
+    if (resp) {
+        const options =  resp.map(item => ({ label: item.generalName, value: item.generalName }));
+        setAccountTypeOptions(options);
+    }
+}
+
   useEffect(() => {
     if (currentActivedTree) {
       const { isLeaf } = currentActivedTree;
@@ -391,18 +575,18 @@ const articleManagement = () => {
           setRuleTypes(data);
         });
       }
+
+      //每次切换树结构，清空台账上传的缓存数据
+      setImplementationData({}); //清空执行情况说明
+      setTaizhangDataDirectoryCommitList([]); //清空台账上传资料目录
     }
   }, [currentActivedTree]);
 
   useEffect(() => {
     //叶子结点数据变化后相关回调
     if (leafData) {
-
-      const {
-        systemEvaluation,
-        targetEvaluation,
-        selfEvaluation,
-      } = leafData.reviewArticle;
+      const { systemEvaluation, targetEvaluation, selfEvaluation, userId } =
+        leafData.reviewArticle;
 
       const tempScoreList = [
         {
@@ -422,17 +606,27 @@ const articleManagement = () => {
           value: systemEvaluation ? systemEvaluation : '-',
         },
       ];
+      /**
+       * 默认加载页面时执行获取执行情况说明数据
+       */
+
 
-      
 
+      const t = localStorage.getItem('userData') ? localStorage.getItem('userData') : '';
+      const userData = JSON.parse(t as string);
+
+      setHasEditAuthority(userId == userData.userId);
+
+      setImplementationData({ [selfEvaluation]: leafData.pfmImplementations });
+      
+      const selfEvolution = leafData.reviewArticle.selfEvaluation;
+      setSelectedSelfEvolution({ label: selfEvolution, value: selfEvolution });
       setScoreList(tempScoreList);
       getSelectableSelfScoreList();
       // setRecords(tempRecords);
     }
   }, [leafData]);
 
-  
-
   useEffect(() => {
     //当抽屉类型改变时
     if (drawerFormType == 'BATCHSETTING') {
@@ -446,6 +640,43 @@ const articleManagement = () => {
     }
   }, [drawerFormType]);
 
+  useEffect(() => {
+    //左侧树结构只看我的开关切换时，重新获取树结构数据
+    getArticleTreeData();
+  }, [isShowMineOnly]);
+
+  useEffect(() => {
+    // console.log({ leafData, selectedSelfEvolution });
+    if (leafData && selectedSelfEvolution) {
+      //更新台账页面编辑下的执行情况说明
+      getImplementationForEdit({
+        level: selectedSelfEvolution.label,
+        /**
+         * 不能拿currentActivedTree里的version，numStr，
+         * 因为台账上传页面详情抽屉读不到准确的四码和版本
+         */
+        version: leafData?.reviewArticle.version,
+        numStr: leafData?.reviewArticle.numStr,
+      });
+    }
+  }, [selectedSelfEvolution]);
+
+  useEffect(() => {
+    if (!editMode && leafData) {
+      //取消编辑时，将原自评等级设为默认
+      const selfEvolution = leafData.reviewArticle.selfEvaluation;
+      setSelectedSelfEvolution({ label: selfEvolution, value: selfEvolution });
+    }
+  }, [editMode]);
+
+  useEffect(() => {
+    //切换页面类型时做相关处理，如清除之前页面的默认数据
+    if (!moduleMode) {
+      setEditMode(false); //条文管理界面无需编辑
+      setIsShowMineOnly(false); //条文管理界面关闭
+    }
+  }, [moduleMode]);
+
   return {
     isLeaf,
     treeData,
@@ -492,6 +723,19 @@ const articleManagement = () => {
     getSelectableRuleChilds,
     editMode,
     setEditMode,
+    implementationData,
+    setImplementationData,
+    commitTaizhangImplementationHandle,
+    taizhangDataDirectoryCommitList,
+    setTaizhangDataDirectoryCommitList,
+    setIsShowMineOnly,
+    isShowMineOnly,
+    setSelectedSelfEvolution,
+    hasEditAuthority,
+    gradeOptions,
+    accountTypeOptions,
+    getGradeOptions,
+    getAccoutTypeOptions
   };
 };
 

src/pages/GradeHospitalAccreditation/articleManagement/server.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-14 10:22:20
- * @LastEditTime: 2021-12-27 10:48:59
+ * @LastEditTime: 2022-01-04 17:23:50
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/articleManagement/server.ts
@@ -9,9 +9,11 @@
 
 import { request } from 'umi';
 
+
+
 //获取条文表格数据
-export const getTreeFileTableData = async (
-  query: { id: string | number; keyword?: string | number },
+export const getTreeFileTableData = (
+  query: { id: string | number; keyword?: string | number,pageSize?:number},
   mode?: boolean,
 ) => {
   if (!mode) {
@@ -20,7 +22,7 @@ export const getTreeFileTableData = async (
       method: 'GET',
       params: { ...query },
     });
-  } else {
+  } else if(mode){
     //台账
     return request('/api/pfm/recordUpload/list', {
       method: 'GET',
@@ -148,5 +150,68 @@ export const getCurrentLevelTable = async (params:{
       method: 'GET',
       params:params
     });
-  };
+};
+
+//台账上传时获取四码对应的资料目录表格数据
+
+export const getTaizhangDirectoryTable = async (params:{
+    numStr:string, //四码
+    version:string,
+    current?:number,//当前页码
+    pageSize?:number,
+}) => {
+    return request<{
+        totalCount:number,
+        pageSize:number,
+        totalPage:number,
+        current:number,
+        list:API.TaizhangDirectoryTableItem[]
+    }>('/api/pfm/pfmdatadirectory/getPfmDataDirectory', {
+      method: 'GET',
+      params:params,
+    });
+};
+
+
+
+
+//根据指定level值获取对应的执行情况说明，用于台账上传界面
+
+export const getTaizhangImplementation = async (params:{
+   numStr:string, //四码
+   version:string,
+   level:string,//等级
+}) => {
+   return request<API.TaizhangImplementationItem[]>('/api/pfmimplementation/getImplementationByLevel', {
+     method: 'GET',
+     params:params,
+   });
+};
+
+//台账界面提交执行情况说明
+export const commitTaizhangImplementation = async (params:{
+    hospId:string, //医院标识
+    id:number,
+    numStr:string,
+    selfEvaluation:string,
+    version:string,
+    implementationDtoList:API.ImplementationDtoListItem[]
+}) => {
+   return request('/api/pfm/recordUpload/addAccountData', {
+     method: 'POST',
+     data:params
+   });
+};
+
+
+//台账界面提交资料目录编辑/新增/删除数据
+export const commitTaizhangDataDirectoryTableList = async (params:API.TaizhangDataDirectoryCommitListItem[]) => {
+   return request('/api/pfm/pfmdatadirectory/addPfmDataDirectory', {
+     method: 'POST',
+     data:params
+   });
+};
+
+
+
 

src/pages/GradeHospitalAccreditation/articleManagement/typings.d.ts

@@ -1,12 +1,14 @@
 /*
  * @Author: your name
  * @Date: 2021-09-14 10:22:42
- * @LastEditTime: 2021-12-23 15:15:08
+ * @LastEditTime: 2021-12-31 14:51:31
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/articleManagement/typings.d.ts
  */
 
+
+
 declare namespace API {
   type RecordsItemType = {
     evaluation: string;
@@ -42,7 +44,7 @@ declare namespace API {
       | [];
   };
 
-  type Type_fmImplementations = {
+  export type Type_fmImplementations = {
     id: number;
     numStr: string;
     version: string;
@@ -79,10 +81,11 @@ declare namespace API {
     responsibilityUserName: string; //负责人名称
     accountType: string; //条文组别
     hospId: number;
-    recordDay: number;
-    createTime: number;
-    updateTime: number;
-    deleteTime: number;
+    userId:number,
+    // recordDay: number;
+    // createTime: number;
+    // updateTime: number;
+    // deleteTime: number;
   };
 
   type LeafDataType = {
@@ -145,4 +148,40 @@ declare namespace API {
     levelNumber: string;
     generalNameList: { id: number; generalName: string }[];
   };
+
+  type TaizhangDirectoryTableItem = {
+    id:number,
+    numStr:string,
+    grade:string,
+    directory:string,
+    accountType:string,
+    accountStatus:string
+  }
+
+  type TaizhangImplementationItem = {
+    id:number,
+    numStr:string,
+    level:string,
+    note:string,
+    userAccount:string,
+    userName:string,
+    hospId:string,
+    [key:string]:any
+  }  
+
+  type ImplementationDtoListItem =  {
+    node:string,
+    selfEvaluation:string
+  }
+
+  type  TaizhangDataDirectoryCommitListItem = {
+    accountStatus:string,
+    accountType:string,
+    dataStatus:number, //操作状态 0不操作 1增加 2修改 3删除
+    directory:string,
+    grade:string,
+    id:number,
+    numStr:string,
+    version:string
+  }
 }

src/pages/GradeHospitalAccreditation/ledgerUpload/componets/deitailModule/detail.tsx

@@ -0,0 +1,412 @@
+/*
+ * @Author: your name
+ * @Date: 2021-12-30 18:57:21
+ * @LastEditTime: 2022-01-04 08:49:19
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/ledgerUpload/detail.tsx
+ */
+
+
+import React, { useEffect, useState } from 'react';
+import { useModel } from 'umi';
+import { Select, Input, Switch } from 'antd'
+import { getScoreColor } from '@/constant';
+import MccsLightTable from '@/components/MccsLightTable';
+
+import MccsEditableTable from '@/components/MccsEditableTable/index';
+
+
+
+import { getCurrentLevelTable, getTaizhangDirectoryTable } from '@/pages/GradeHospitalAccreditation/articleManagement/server';
+
+
+import './style.less';
+
+const { TextArea } = Input;
+const {Option} = Select;
+
+enum ActType {
+    'NOACT',  //不操作
+    'ADD',
+    'EDIT',
+    'DEL'
+};
+
+
+
+const DetailModule = () => {
+
+    const { articleManagement } = useModel('allModels', model => {
+        return { articleManagement: model.articleManagement, ledgerUpload: model.ledgerUpload };
+    });
+
+    const {
+        currentActivedTree,
+        scoreList,
+        accountTypeOptions,
+        gradeOptions,
+        ...restModelData
+    } = articleManagement;
+
+    const [idEditMode, setIfEditMode] = useState(false);
+
+    const [isModeTwo, setIsModeTwo] = useState(true);
+
+    const MccsLightTableColumns = [
+        {
+            key: 'gradeLevel',
+            title: '档次',
+            width: 10
+        },
+        {
+            key: 'directory',
+            title: '名称',
+            width: 60
+        },
+        {
+            key: 'accountType',
+            title: '类型',
+        },
+        {
+            key: 'accountStatus',
+            title: '需要台账',
+            render: (record: any) => {
+                return record.accountStatus == 0 ? '否' : '是'
+            }
+        },
+    ]
+
+
+    const mccsEditableTableColumns = [
+        {
+            title: '名称',
+            dataIndex: 'directory',
+            width: '50%',
+            align: 'center',
+            formItemProps: () => {
+                return {
+                    rules: [{ required: true, message: '此项为必填项' }],
+                };
+            },
+        },
+        {
+            title: '档次',
+            dataIndex: 'grade',
+            width: '15%',
+            align: 'center',
+            formItemProps: () => {
+                return {
+                    rules: [{ required: true, message: '此项为必填项' }],
+                };
+            },
+            renderFormItem: (_: any, config: any, form: any) => {
+
+                const { isEditable } = config;
+
+                return isEditable ? (
+                    <Select
+                        mode='multiple'
+                        placeholder='请选择'
+                    >
+                        {
+                            gradeOptions.map((item, index) => (
+                                <Option value={item.value} key={index}>{item.label}</Option>
+                            ))
+                        }
+                    </Select>
+
+                ) : <Input />;
+            },
+            render: (_: any, row: any) => {
+                // console.log({ _, row }); 
+                return typeof _ == 'object' ? _.join(',') : _;
+            },
+        },
+        {
+            title: '类型',
+            dataIndex: 'accountType',
+            align: 'center',
+            width: '15%',
+            formItemProps: () => {
+                return {
+                    rules: [{ required: true, message: '此项为必填项' }],
+                };
+            },
+            renderFormItem: (_: any, { isEditable }: { isEditable: boolean }, form: any) => {
+
+                return isEditable ? (
+                    <Select
+                        placeholder='请选择'
+                    >
+                        {
+                            accountTypeOptions.map((item, index) => (
+                                <Option value={item.value} key={index}>{item.label}</Option>
+                            ))
+                        }
+                    </Select>
+                ) : <Input />;
+            },
+
+
+        },
+        {
+            title: '台账上传',
+            align: 'center',
+            dataIndex: 'accountStatus',
+            width: '10%',
+            valueType: 'switch',
+            renderFormItem: (_: any, { isEditable }: { isEditable: boolean }) => {
+                return isEditable ? (
+                    // <Form.Item name='accountStatus' valuePropName='checked'>
+                    <Switch size='small' />
+                    // </Form.Item>
+                ) : <Input />
+            },
+            render: (_: any, row: any) => {
+                return (
+                    <Switch size='small' disabled checked={row.accountStatus} />
+                )
+            },
+        },
+
+    ]
+
+
+    const setEditStatus = () => {
+        setIfEditMode(true);
+        restModelData.setEditMode(true);
+    }
+
+    const taizhangDataDerectoryEditHandle = (data: any, actType: ActType) => {
+        //台账资料目录编辑回调
+        const version = restModelData.leafData?.reviewArticle.version;
+        let prevData = restModelData.taizhangDataDirectoryCommitList;
+        const numStr = restModelData.leafData?.reviewArticle.numStr;
+
+        if (actType == ActType.DEL && data.id == '-') {
+            //如果是删除操作且删除的不是数据库已有数据时,剔除之前暂时保留数据
+            prevData = prevData.filter(item => item.directory != data.directory);
+            restModelData.setTaizhangDataDirectoryCommitList([...prevData]);
+            return;
+        }
+
+        restModelData.setTaizhangDataDirectoryCommitList([...prevData, { ...data, dataStatus: actType, version: version ? version : '', grade: data.grade.join(','), numStr: numStr, accountStatus: data.accountStatus ? '1' : '0' }])
+    }
+
+    const onTextAreaChange = (e: React.ChangeEvent<HTMLTextAreaElement>, level: string) => {
+        //更改执行情况说明数据
+        //首先找出要更新的项，再进行整体替换
+
+        if (restModelData.selectedSelfEvolution) {
+
+            const editTargetLevel = restModelData.selectedSelfEvolution.label;  //目标等级
+            //找出目标等级下正在更新的level
+            const editImplementationDataItemIndex = restModelData.implementationData[editTargetLevel].findIndex(item => item.level == level);
+            //拷贝旧的目标等级数据
+            let _cpOldImplemetationItem = restModelData.implementationData[editTargetLevel];
+            //将新的编辑内容赋值给正在编辑的目标下的level
+            _cpOldImplemetationItem[editImplementationDataItemIndex].note = e.target.value;
+
+            if (editImplementationDataItemIndex != -1) {
+                restModelData.setImplementationData({
+                    ...restModelData.implementationData,
+                    //插入更新
+                    [editTargetLevel]: _cpOldImplemetationItem
+                }
+                )
+            }
+        }
+
+    }
+
+
+
+    useEffect(() => {
+        const leafData = restModelData.leafData;
+        if (leafData) {
+            restModelData.setSelectedSelfEvolution({
+                label: leafData.reviewArticle.selfEvaluation,
+                value: leafData.reviewArticle.selfEvaluation
+            });
+        }
+        
+        restModelData.getAccoutTypeOptions();
+        restModelData.getGradeOptions();
+
+    }, [])
+
+
+    return (
+        <div className='DetailModule'>
+            <div className='leafContentTitle'>{currentActivedTree ? currentActivedTree.title : ''}</div>
+            <div className='peopleGroup'>
+                <span>条文组别：</span>
+                <span>{restModelData.leafData?.reviewArticle?.accountType}</span>
+                <span>负责单位：</span>
+                <span>{restModelData.leafData?.reviewArticle?.responsibilityDepartmentName}</span>
+                <span>负责人：</span>
+                <span>{restModelData.leafData?.reviewArticle?.responsibilityUserName}</span>
+            </div>
+
+            <div className='scoreRow'>
+                <div className='scoreInfo'>
+                    {
+                        scoreList.map((item, index) => {
+                            return (
+                                <div key={index} className='scoreBlock'>
+                                    {item.label}
+                                    {item.value && item.value != '-' ? (<span style={{ color: getScoreColor(item.value) }}>{item.value}</span>) : ' -'}
+                                </div>
+                            )
+                        })
+                    }
+                </div>
+
+                {
+                    //台账上传页面且非编辑状态下
+                    !restModelData.editMode && restModelData.hasEditAuthority && <div className='editPageBtn' onClick={() => setEditStatus()}>{restModelData.editMode ? '取消编辑' : '开启编辑'}</div>
+                }
+            </div>
+
+            <div className='scoreGradeDetail'>
+
+                {
+                    restModelData.leafData?.pfmViewRuleDetailDataVoList.map((item, index) => (
+                        <div className='scoreGradeDetailList' key={index}>
+                            <div className='head'>{item.evaluation}</div>
+                            <div className='detail'>
+                                {
+                                    item.viewRuleAndLevelVos && item.viewRuleAndLevelVos.map((v, k) => (
+                                        <div className='textLine' key={k}>{`${v.grade} ${v.detail}`}</div>
+                                    ))
+                                }
+                            </div>
+                        </div>
+                    ))
+                }
+            </div>
+
+            {
+                true && (
+                    <div className='selfEvaluationWrap'>
+                        <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', width: '100%', }}>
+                            <div className='selfEvaluation'>
+                                自评等级
+                                {!restModelData.editMode && (
+                                    <span style={{ color: getScoreColor(restModelData.leafData ? restModelData.leafData.reviewArticle.selfEvaluation : '') }}>{restModelData.leafData?.reviewArticle.selfEvaluation ? restModelData.leafData?.reviewArticle.selfEvaluation : '-'}</span>
+                                )}
+                            </div>
+                            {
+                                restModelData.editMode && (
+                                    <div className='wrap' style={{ width: '60%', display: 'flex', flexDirection: 'row', justifyContent: 'flex-end' }}>
+                                        {
+                                            restModelData.targetScores.map((item, index) => (
+                                                <div className={restModelData.selectedSelfEvolution?.label == item.label ? 'tab on' : 'tab'} key={index} onClick={() => restModelData.onSelfEvolutionTabChange(item)}>{item.label}</div>
+                                            ))
+                                        }
+                                    </div>
+                                )
+                            }
+                        </div>
+                    </div>
+                )
+            }
+
+            {
+                restModelData.leafData && (
+                    //台账上传页面时，背景色统一白色，cardWrap提供容器实现上下滑动
+                    <div className={isModeTwo ? 'cardWrap isModeTwo' : 'cardWrap'}>
+                        <div>
+                            {
+                                //渲染执行情况说明
+                                /**
+                                 * 满足条件：
+                                 * 1.存在自评等级从接口获取或手动点击选择
+                                 * 2.implementationData里有当前等级的数据
+                                 */
+                                (restModelData.selectedSelfEvolution && restModelData.implementationData[restModelData.selectedSelfEvolution.label])
+                                && restModelData.implementationData[restModelData.selectedSelfEvolution.label].map((item, index) => {
+
+                                    return (
+                                        <div className='card' key={index} style={{ marginBottom: isModeTwo ? 0 : '16px', paddingBottom: isModeTwo ? 0 : '16px', paddingTop: isModeTwo ? 0 : '16px' }}>
+                                            <div className='cardTitle' style={{ marginBottom: isModeTwo ? '8px' : '16px' }}>{`执行情况说明（等级${item.level}）`}</div>
+
+                                            <TextArea allowClear showCount maxLength={2000}
+                                                autoSize={{
+                                                    minRows: 5,
+                                                    maxRows: 20
+                                                }}
+                                                disabled={!restModelData.editMode} value={item.note}
+                                                onChange={e => onTextAreaChange(e, item.level)}
+                                                style={{ marginBottom: 20 }} />
+
+                                            {
+                                                !isModeTwo && (
+                                                    <MccsLightTable
+                                                        columns={MccsLightTableColumns}
+                                                        request={(current, pageSize) => getCurrentLevelTable({
+                                                            level: item.level,
+                                                            numStr: currentActivedTree ? currentActivedTree.code : 'null',
+                                                            version: restModelData.leafData ? (restModelData.leafData.reviewArticle.version) : 'null',
+                                                            current,
+                                                            pageSize
+                                                        })}
+                                                    />
+                                                )
+                                            }
+                                        </div>
+                                    )
+                                })
+                            }
+                            <div >
+                                {
+                                    //台帐下展示
+                                    (isModeTwo && restModelData.leafData) && (
+                                        <MccsEditableTable
+                                            bordered={true}
+                                            edit={restModelData.editMode}
+                                            pagination={true}
+                                            addHandle={
+                                                (data: any) => taizhangDataDerectoryEditHandle(data, ActType.ADD)
+                                            }
+                                            editHandle={
+                                                (data: any) => taizhangDataDerectoryEditHandle(data, ActType.EDIT)
+                                            }
+                                            delHandle={
+                                                (data: any) => taizhangDataDerectoryEditHandle(data, ActType.DEL)
+                                            }
+                                            request={async (current, pageSize) => {
+                                                console.log('leafData', restModelData.leafData)
+                                                if (restModelData.leafData) {
+                                                    const { numStr, version } = restModelData.leafData.reviewArticle;
+                                                    const resp = await getTaizhangDirectoryTable({ numStr, version, current, pageSize });
+                                                    const { list = [] } = resp;
+                                                    return {
+                                                        data: list.map(item => ({ ...item, grade: item.grade ? item.grade.split(',') : [], accountStatus: item.accountStatus == '0' ? false : true })), //多选下拉需传数组值
+                                                        total: resp.totalCount,
+                                                        current: resp.current,
+                                                        success: true
+                                                    };
+                                                }
+                                                return {
+                                                    data: [],
+                                                    total: 0,
+                                                    success: false
+                                                }
+                                            }}
+                                            columns={mccsEditableTableColumns}
+                                        />
+                                    )
+                                }
+                            </div>
+                        </div>
+                    </div>
+                )
+            }
+
+        </div>
+    )
+}
+
+export default DetailModule;

src/pages/GradeHospitalAccreditation/ledgerUpload/componets/deitailModule/style.less

@@ -0,0 +1,250 @@
+.DetailModule {
+  .scoreRow {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    height: 32px;
+
+    .scoreInfo {
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: center;
+
+      .scoreBlock {
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        align-items: center;
+        width: 117px;
+        height: 16px;
+        font-size: 12px;
+        font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+        font-weight: 400;
+        color: #525866;
+        border-right: 1px solid #DADEE6;
+
+        &>span {
+          position: relative;
+          top: -2px;
+          display: inline-block;
+          margin-left: 16px;
+          font-size: 20px;
+          font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+          font-weight: 500;
+        }
+
+        &:last-child {
+          border: none;
+        }
+
+        &:first-child {
+          width: 94px;
+        }
+      }
+    }
+
+    .ruleSettingBtn,
+    .editPageBtn {
+      font-size: 14px;
+      font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+      font-weight: 400;
+      color: #525966;
+      padding-right: 16px;
+      cursor: pointer;
+
+      &::before {
+        position: relative;
+        top: 3px;
+        display: inline-block;
+        content: '';
+        width: 16px;
+        height: 16px;
+        margin-right: 8px;
+        background: url('../../../../../../public//pageEditIcon.png');
+        background-size: contain;
+
+      }
+    }
+
+    .editPageBtn {
+      &::before {
+        position: relative;
+        top: 3px;
+        display: inline-block;
+        content: '';
+        width: 16px;
+        height: 16px;
+        margin-right: 8px;
+        background: url('../../../../../../public//pageEditIcon.png');
+        background-size: contain;
+
+      }
+    }
+  }
+
+  .scoreGradeDetail {
+    width: 100%;
+    margin-top: 26px;
+    border-radius: 2px;
+    overflow: hidden;
+
+    .scoreGradeDetailList {
+      position: relative;
+      display: flex;
+      width: 100%;
+      height: 100%;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: stretch;
+      padding-left: 40px;
+      margin-bottom: 2px;
+
+      .head {
+        position: absolute;
+        top: 0;
+        left: 0;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 40px;
+        height: 100%;
+        background: #A3B1CC;
+        font-size: 16px;
+        font-family: SourceHanSansCN-Bold, SourceHanSansCN;
+        font-weight: bold;
+        color: #FFFFFF;
+      }
+
+      .detail {
+        width: 100%;
+        background: #F5F7FA;
+        padding: 9px 18px;
+
+        .textLine {
+          font-size: 12px;
+          font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+          font-weight: 400;
+          color: #5C7099;
+          line-height: 14px;
+          margin-bottom: 5px;
+
+          &:last-child {
+            margin-bottom: 0;
+          }
+        }
+      }
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  .articleSetBtn {
+    height: 50px;
+    text-align: center;
+    line-height: 50px;
+    background: #FFFFFF;
+    border-radius: 25px;
+    border: 1px dashed #DADEE6;
+    margin-top: 40px;
+    margin-bottom: 40px;
+
+    span {
+      font-size: 16px;
+      font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+      font-weight: 400;
+      cursor: pointer;
+      color: @primary-color;
+    }
+  }
+
+  .selfEvaluationWrap {
+    padding: 16px;
+    background: #FFFFFF;
+    border-radius: 2px;
+    margin-bottom: 16px;
+    margin-top: 16px;
+
+    .selfEvaluation {
+      display: flex;
+      height: 28px;
+      flex-direction: row;
+      align-items: center;
+
+      span {
+        font-size: 20px;
+        font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+        font-weight: 500;
+        padding-left: 16px;
+      }
+    }
+
+    .wrap {
+      .tab {
+        width: 20%;
+        height: 28px;
+        cursor: pointer;
+        text-align: center;
+        line-height: 28px;
+        background: #F7F8FA;
+        border-radius: 14px;
+        font-size: 14px;
+        font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+        font-weight: 400;
+        color: #525866;
+        margin-right: 16px;
+
+        &.on {
+          color: #3377FF;
+          background: #EBF1FF;
+        }
+
+        &:last-child {
+          margin-right: 0;
+        }
+      }
+    }
+
+  }
+
+  .cardWrap {
+    // padding-top: 16px;
+    height: calc(100vh - 364px);
+    // border-bottom: 2px solid red;
+    overflow-y: scroll;
+    padding-bottom: 16px;
+
+    .card {
+      padding: 16px;
+      background: #FFFFFF;
+      border-radius: 2px;
+      padding-left: 0;
+      padding-right: 0;
+      margin-bottom: 16px;
+
+      .cardTitle {
+        font-size: 14px;
+        font-family: SourceHanSansCN-Normal, SourceHanSansCN;
+        font-weight: 400;
+        color: #292C33;
+        margin-bottom: 16px;
+      }
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+
+    &.isModeTwo {
+      padding-top: 16px;
+      background-color: #FFFFFF;
+    }
+
+    .ant-form-item {
+      margin-bottom: 0;
+    }
+  }
+}

src/pages/GradeHospitalAccreditation/ledgerUpload/index.less

@@ -1,4 +1,5 @@
 .leafContent {
+  
   .leafContentTitle {
     font-size: 16px;
     font-family: SourceHanSansCN-Bold, SourceHanSansCN;
@@ -59,3 +60,12 @@
     color: #7A8599;
     margin-bottom:16px;
 }
+
+
+.diyFooter {
+  display: flex;
+  width: 100%;
+  flex-direction: row;
+  justify-content: flex-end;
+  align-items: center;
+}

src/pages/GradeHospitalAccreditation/ledgerUpload/index.tsx

@@ -1,16 +1,16 @@
 /*
  * @Author: your name
  * @Date: 2021-09-14 10:22:09
- * @LastEditTime: 2021-12-27 17:44:52
+ * @LastEditTime: 2022-01-01 16:15:18
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/articleManagement/index.tsx
  */
 
 
-import React, { useEffect,useState } from 'react'
-import {useModel} from 'umi';
-import { Form,Tabs,Button } from 'antd'
+import React, { useEffect, useState } from 'react'
+import { useModel } from 'umi';
+import { Form, Tabs, Button } from 'antd'
 import {
     ProFormText,
     ProFormDateRangePicker,
@@ -19,9 +19,8 @@ import {
 import ArticleManagementCopy from '@/pages/GradeHospitalAccreditation/articleManagement/index';
 import MccsDrawerForm from '@/components/MccsDrawerForm/index';
 import './index.less';
-import MccsScoreBanner from '@/components/MccsScoreBanner';
-import MccsRecordList from '@/components/MccsRecordList/index';
-import MccsClickableTabs from '@/components/MccsClickableTabs/index';
+
+import DetailModule from './componets/deitailModule/detail';
 
 import 'moment/locale/zh-cn';
 import locale from 'antd/es/date-picker/locale/zh_CN';
@@ -31,8 +30,6 @@ type LedgerUploadPropsType = {
 
 }
 
-const { TabPane } = Tabs;
-
 //条文管理
 const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
 
@@ -41,12 +38,12 @@ const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
         //     key: 'articleType',
         //     hideInTable: true,
         //     renderFormItem: (item: any, { type }: any, form: any) => {
-    
+
         //         if (type === 'form') {
         //             return null;
         //         }
         //         return (
-                    
+
         //                 <ProFormSelect
         //                     width='sm'
         //                     options={[
@@ -57,21 +54,21 @@ const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
         //                     ]}
         //                     placeholder="台账状态"
         //                 />
-                   
+
         //         )
         //     },
         // },
         {
             hideInTable: true,
             renderFormItem: (item: any, { type }: any, form: any) => {
-    
+
                 if (type === 'form') {
                     return null;
                 }
                 return (
-                   
-                        <ProFormDateRangePicker name='date'  placeholder={['开始时间','结束时间']} fieldProps={{locale:locale}} />
-                  
+
+                    <ProFormDateRangePicker name='date' placeholder={['开始时间', '结束时间']} fieldProps={{ locale: locale }} />
+
                 )
             },
         },
@@ -79,7 +76,7 @@ const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
             key: 'keyword',
             hideInTable: true,
             renderFormItem: (item: any, { type }: any, form: any) => {
-    
+
                 if (type === 'form') {
                     return null;
                 }
@@ -95,7 +92,7 @@ const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
             key: 'numStr',
             dataIndex: 'numStr',
             hideInSearch: true,
-    
+
         },
         {
             title: '条文',
@@ -137,54 +134,58 @@ const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
             title: '操作',
             width: 100,
             valueType: 'option',
-            render: (_:any, record:any) =>{
-                   
-                   return [<a key="1" onClick={()=>openDrawerHandle(record)}>详情</a>, <a key="2" onClick={()=>del(record)}>删除</a>]
+            render: (_: any, record: any) => {
+
+                return [<a key="1" onClick={() => openDrawerHandle(record)}>详情</a>, <a key="2" onClick={() => del(record)}>删除</a>]
             },
         },
     ]
 
-    const { articleManagement,ledgerUpload } = useModel('allModels',model=>{
-            return {articleManagement:model.articleManagement,ledgerUpload:model.ledgerUpload};
+    const { articleManagement, ledgerUpload } = useModel('allModels', model => {
+        return { articleManagement: model.articleManagement, ledgerUpload: model.ledgerUpload };
     });
 
     const {
- 
+
         currentActivedTree,
+        leafData,
+        scoreList,
+        editMode,
         ...restArticleManagementModelData
     } = articleManagement;
-    
-    const {...restLedgerUploadModelData} = ledgerUpload;
 
-    const [tabKey,setTabKey] = useState<string|number>();  //antd Tab切换
+    const { ...restLedgerUploadModelData } = ledgerUpload;
+
+    // const [tabKey, setTabKey] = useState<string | number>();  //antd Tab切换
 
 
-    const openDrawerHandle = (record:any)=>{
+    const openDrawerHandle = (record: any) => {
         // console.log({record});
         restLedgerUploadModelData.setCurrentRecord(record)
         restLedgerUploadModelData.setDrawerVisible(true);
-        restArticleManagementModelData.getTableData({id:record.id});
+        restArticleManagementModelData.getTableData({ id: record.id });
     }
 
-    const del = (record:any)=>{
+    const del = (record: any) => {
 
-        const {id} = record;
+        const { id } = record;
         restLedgerUploadModelData.delRuleHandle(id);
         restArticleManagementModelData.getArticleTreeData();  //刷新树结构
         restArticleManagementModelData.setReloadRightContent(true);  //刷新表格数据
     }
 
     const onVisibleChangeHandle = (visible: boolean) => {
+        console.log(visible)
         restLedgerUploadModelData.setDrawerVisible(visible);
     }
 
-    const upLoadFileHandle = (formInitData?:any) => {
+    const upLoadFileHandle = (formInitData?: any) => {
         //因为modalForm开启了request+params获取表单默认值，
         //所以必须先设置默认值才能开启弹窗
-        if(formInitData){
-            const { fileUrl, recordTypeName, fileName, accountType,cateId } = formInitData;
+        if (formInitData) {
+            const { fileUrl, recordTypeName, fileName, accountType, cateId } = formInitData;
             restArticleManagementModelData.setUploadFormInitValue({
-                tab: { label: accountType, value: { label: recordTypeName, value:cateId } },
+                tab: { label: accountType, value: { label: recordTypeName, value: cateId } },
                 files: [{
                     uid: new Date().getTime(),
                     name: fileName,
@@ -192,14 +193,14 @@ const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
                     url: fileUrl
                 }]
             });
-        }else {
+        } else {
             restArticleManagementModelData.setUploadFormInitValue({})
         }
 
-        restArticleManagementModelData.getUploadLedgerType().then(data=>{
+        restArticleManagementModelData.getUploadLedgerType().then(data => {
             //设置上传台账可选类型
             restArticleManagementModelData.setUploadLedgerTypeList(data);
-          
+
         })
         restArticleManagementModelData.setModalVisible(true);
     }
@@ -208,78 +209,56 @@ const LedgerUpload: React.FC<LedgerUploadPropsType> = (props) => {
         //渲染记录列表操作按钮
         // console.log({ data });
         const reupload = () => {
-            
+
             upLoadFileHandle(data);
         }
 
         return <a onClick={reupload}>重新上传</a>
     }
 
+
     useEffect(()=>{
+        
+        const drawerVisible =  restLedgerUploadModelData.drawerVisible;
+        
+        //关闭抽屉时，取消编辑模式
+        if(!drawerVisible){
+            restArticleManagementModelData.setEditMode(false);
+        }
+      },[restLedgerUploadModelData.drawerVisible]);
+
+    useEffect(() => {
         //监听上传台账弹窗变化，更新本地drawer里台账记录
-        if(!restArticleManagementModelData.modalVisible&&restLedgerUploadModelData.currentRecord){
-            restArticleManagementModelData.getTableData({id:restLedgerUploadModelData.currentRecord.id});
+        if (!restArticleManagementModelData.modalVisible && restLedgerUploadModelData.currentRecord) {
+            restArticleManagementModelData.getTableData({ id: restLedgerUploadModelData.currentRecord.id });
         }
 
-    },[restArticleManagementModelData.modalVisible]);
+    }, [restArticleManagementModelData.modalVisible]);
+
+
 
-    
-    
     return (
         <React.Fragment>
-            <ArticleManagementCopy 
+            <ArticleManagementCopy
                 columnsFromProps={columns}
                 isModeTwo={true}
             />
 
-            
-            <MccsDrawerForm 
-               title={restLedgerUploadModelData.currentRecord?.name}
-               visible = {restLedgerUploadModelData.drawerVisible}
-               onVisibleChange={onVisibleChangeHandle}
+
+            <MccsDrawerForm
+                title={restLedgerUploadModelData.currentRecord?.name}
+                visible={restLedgerUploadModelData.drawerVisible}
+                onVisibleChange={onVisibleChangeHandle}
+                noFormMode={true}
+                width={'60%'}
+                closable={!editMode}
+                footer={editMode?(<div className='diyFooter'>
+                    <Button type='default' style={{marginRight:10}} onClick={()=>restLedgerUploadModelData.setDrawerVisible(false)}>取消</Button>
+                    <Button type='primary' onClick={()=>restArticleManagementModelData.commitTaizhangImplementationHandle()}>保存</Button>
+                </div>):null}
             >
                 <div className='leafContent'>
-                
-                                <div className='peopleGroup'>
-                                    <span>条文组别：</span>
-                                    <span>{restLedgerUploadModelData.currentRecord?.accountType}</span>
-                                    <span>负责单位：</span>
-                                    <span>{restLedgerUploadModelData.currentRecord?.responsibilityDepartmentName}</span>
-                                    <span>负责人：</span>
-                                    <span>{restLedgerUploadModelData.currentRecord?.responsibilityUserName}</span>
-                                </div>
-                                <MccsScoreBanner list={restLedgerUploadModelData.scoreList} />
-                       
-                                <div style={{ marginTop: 5 }}>
-                                            <Tabs defaultActiveKey="1" centered size='large' onChange={(key) => {key == '2'&&restLedgerUploadModelData.getSelectableSelfScoreList();setTabKey(key);}}>
-                                                <TabPane tab="台账记录" key="1">
-                                                    <div className='articleSetBtn'>
-                                                        <span onClick={()=>upLoadFileHandle()}>上传文件</span>
-                                                    </div>
-                                                    <MccsRecordList
-                                                        title='台账记录'
-                                                        list={restArticleManagementModelData.records}
-                                                        actionNode={(data) => actionNodeFunc(data)}
-                                                    />
-                                                </TabPane>
-                                                <TabPane tab="自评结果" key="2">
-                                                    <div className='selfEvolutionTitle'>开始自评</div>
-                                                    <div className='selfEvolutionArea'>
-                                                        <MccsClickableTabs
-                                                            classNames='tabWrap'
-                                                            onChange={(value:{label:string,value:any})=>restLedgerUploadModelData.onSelfEvolutionTabChange(value)}
-                                                            data={restLedgerUploadModelData.targetScores}
-                                                            value={restLedgerUploadModelData.selectedSelfEvolution}
-                                                        />
-                                                        <Button onClick={()=>restLedgerUploadModelData.commitSelfEvolution()}>提交自评</Button>
-                                                    </div>
-                                                    <MccsRecordList
-                                                        title='自评记录'
-                                                        list={restLedgerUploadModelData.selfEvaluationRecords}
-                                                    />
-                                                </TabPane>
-                                            </Tabs>
-                                </div>
+                     <DetailModule />
                 </div>
             </MccsDrawerForm>
         </React.Fragment>

src/pages/GradeHospitalAccreditation/ledgerUpload/model.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-14 10:46:45
- * @LastEditTime: 2021-12-27 16:58:04
+ * @LastEditTime: 2021-12-31 11:33:37
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/GradeHospitalAccreditation/articleManagement/model.ts
@@ -128,6 +128,8 @@ const ledgerUpload = () => {
   }, [currentRecord]);
 
 
+
+
   useEffect(() => {
     if (currentLeafData) {
       const {

src/pages/PlatformMana/generalSetting/index.tsx

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-27 10:41:52
- * @LastEditTime: 2021-10-12 17:04:27
+ * @LastEditTime: 2021-12-30 11:47:30
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/PlatformMana/generalSetting/index.tsx
@@ -208,7 +208,7 @@ const GeneralSetting: React.FC<GeneralSettingType> = () => {
 
     const getTableDataRequest = async () => {
 
-        const respData = await getAccreditationTypeData();
+        const respData:any[] = await getAccreditationTypeData();
         if (respData) {
             setReloadTableOne(false);
             return {
@@ -216,6 +216,9 @@ const GeneralSetting: React.FC<GeneralSettingType> = () => {
                 success: true
             }
         }
+        return {
+            data:[]
+        }
     }
 
     const getLevelScoreTableDataRequest = async () => {
@@ -229,6 +232,9 @@ const GeneralSetting: React.FC<GeneralSettingType> = () => {
                 success: true
             }
         }
+        return {
+            data:[]
+        }
     }
 
     const getLedgerTableDataRequest = async () => {
@@ -242,7 +248,9 @@ const GeneralSetting: React.FC<GeneralSettingType> = () => {
                 success: true
             }
         }
-        return null
+        return {
+            data:[]
+        }
     }
 
 

src/pages/PlatformMana/generalSetting/serve.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-27 11:06:43
- * @LastEditTime: 2021-12-23 09:51:22
+ * @LastEditTime: 2021-12-29 14:43:29
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /MedicalWisdomCheckSys/src/pages/PlatformMana/generalSetting/serve.ts
@@ -51,7 +51,13 @@ export const getScoreLevelData  = async ()=>{
 //获取台账类型数据
 export const getLedgerType  = async ()=>{
     
-    return request('/api/pfm/sysgeneralconfig/getAccountConfig', {
+    return request<{
+        configNote:string,
+        configStatus:number,
+        generalName:string,
+        id:number,
+        levelNumber:string
+    }[]>('/api/pfm/sysgeneralconfig/getAccountConfig', {
         method: 'GET',
     });
 }