Explorar o código

修复可编辑表格删除bug

code4eat %!s(int64=2) %!d(string=hai) anos
pai
achega
566711b4a9

+ 1 - 1
src/components/KCIMTable/style.less

@@ -114,7 +114,7 @@
                     
                         font-size: 14px;
                         font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-                        
+                        justify-content: flex-start !important;
                         color: #17181A;
                         padding: 8px 8px !important; 
                         border-bottom: none !important;

+ 78 - 61
src/pages/setting/fenyeTemplate/index.tsx

@@ -2,7 +2,7 @@
  * @Author: code4eat awesomedema@gmail.com
  * @Date: 2023-03-03 11:30:33
  * @LastEditors: code4eat awesomedema@gmail.com
- * @LastEditTime: 2023-09-27 14:46:46
+ * @LastEditTime: 2023-09-27 17:52:05
  * @FilePath: /KC-MiddlePlatform/src/pages/platform/setting/pubDicTypeMana/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -14,7 +14,7 @@
 
 import { createFromIconfontCN } from '@ant-design/icons';
 
-import { ActionType, DrawerForm, EditableFormInstance, EditableProTable, ProFormSelect } from '@ant-design/pro-components';
+import { ActionType, DrawerForm, EditableFormInstance, EditableProTable, ProFormInstance, ProFormSelect } from '@ant-design/pro-components';
 import { ModalForm, ProFormDigit, ProFormText, ProFormTextArea } from '@ant-design/pro-form'
 import { ProColumns } from '@ant-design/pro-table';
 import { Input, message, Popconfirm } from 'antd';
@@ -124,29 +124,29 @@ export default function FenyeTemplate() {
 
     const updateTable = async (formVal: any, type: 'EDIT' | "ADD") => {
 
-        const content = formVal.table.map((a:any)=>({
-               
+        const content = formVal.table.map((a: any) => ({
+
         }))
 
         if (type == 'ADD') {
             const result = {
-                name:formVal.name,
-                content:JSON.stringify(formVal.table),
-                remark:formVal.remark
+                name: formVal.name,
+                content: JSON.stringify(formVal.table),
+                remark: formVal.remark
             }
             const resp = await addData({ ...result });
             if (resp) {
                 tableRef.current?.reload();
                 message.success('操作成功!');
             }
-            
+
         }
         if (type == 'EDIT') {
             const result = {
-                id:formVal.id,
-                name:formVal.name,
-                content:JSON.stringify(formVal.table),
-                remark:formVal.remark
+                id: formVal.id,
+                name: formVal.name,
+                content: JSON.stringify(formVal.table),
+                remark: formVal.remark
             }
             const resp = await editData({ ...result });
             if (resp) {
@@ -161,107 +161,118 @@ export default function FenyeTemplate() {
     const UpDataActBtn = ({ record, type }: { record: any, type: 'EDIT' | 'ADD' }) => {
 
         const editableFormRef = useRef<EditableFormInstance>();
+        const formRef = useRef<ProFormInstance<any>>();
+        const editorFormRef = useRef<EditableFormInstance<any>>();
+        
 
-        const editableColumns:ProColumns[] = [
+        const editableColumns: ProColumns[] = [
             {
-                title:'标题',
+                title: '标题',
                 dataIndex: 'title',
-                editable:()=>true
+                editable: () => true
             },
             {
-                title:'类型',
-                dataIndex: 'filedType', 
-                editable:()=>false
+                title: '类型',
+                dataIndex: 'filedType',
+                editable: () => false
             },
             {
-                title:'是否必填',
+                title: '是否必填',
                 dataIndex: 'required',
                 request: async () => [
                     {
-                      value: 1,
-                      label: '是',
+                        value: 1,
+                        label: '是',
                     },
                     {
-                      value: 0,
-                      label: '否',
+                        value: 0,
+                        label: '否',
                     },
                 ],
                 fieldProps: (_, { rowIndex }) => {
                     return {
-                      onSelect: () => {
-                        // 每次选中重置参数
-                        editableFormRef.current?.setRowData?.(rowIndex, { fraction: [] });
-                      },
+                        onSelect: () => {
+                            // 每次选中重置参数
+                            editableFormRef.current?.setRowData?.(rowIndex, { fraction: [] });
+                        },
                     };
                 },
                 renderText(text) {
-                      return text?'是':'否'
+                    return text ? '是' : '否'
                 },
             },
             {
-                title:'是否展示信息',
+                title: '是否展示信息',
                 dataIndex: 'showFiled',
                 request: async () => [
                     {
-                      value: 1,
-                      label: '是',
+                        value: 1,
+                        label: '是',
                     },
                     {
-                      value: 0,
-                      label: '否',
+                        value: 0,
+                        label: '否',
                     },
                 ],
                 fieldProps: (_, { rowIndex }) => {
                     return {
-                      onSelect: () => {
-                        // 每次选中重置参数
-                        editableFormRef.current?.setRowData?.(rowIndex, { fraction: [] });
-                      },
+                        onSelect: () => {
+                            // 每次选中重置参数
+                            editableFormRef.current?.setRowData?.(rowIndex, { fraction: [] });
+                        },
                     };
                 },
                 renderText(text) {
-                    return text?'是':'否'
+                    return text ? '是' : '否'
                 },
             },
             {
                 title: '操作',
                 valueType: 'option',
                 render: (text, record, _, action) => [
-                  <a
-                    key="editable"
-                    onClick={() => {
-                      action?.startEditable?.(record.tempId);
-                    }}
-                  >
-                    编辑
-                  </a>,
-                  <a
-                    key="delete"
-                    onClick={() => {
-                      //setDataSource(dataSource.filter((item) => item.id !== record.id));
-                    }}
-                  >
-                    删除
-                  </a>,
+                    <a
+                        key="editable"
+                        onClick={() => {
+                            action?.startEditable?.(record.tempId);
+                        }}
+                    >
+                        编辑
+                    </a>,
+                    <a
+                        key="delete"
+                        onClick={() => {
+                            const tableDataSource = formRef.current?.getFieldValue(
+                                'table',
+                            ) as any[];
+                            formRef.current?.setFieldsValue({
+                                table: tableDataSource.filter((item) => item.tempId !== record.tempId),
+                            });
+                        }}
+                    >
+                        删除
+                    </a>,
                 ],
-              },
+            },
         ];
 
-        let defaultTableData = JSON.parse(record.content?record.content:'[]');
-        defaultTableData = defaultTableData.map((a:any)=>({...a,tempId:Math.random()}))
+        let defaultTableData = JSON.parse(record.content ? record.content : '[]');
+        defaultTableData = defaultTableData.map((a: any) => ({ ...a, tempId: (Math.random() * 1000000).toFixed(0) }));
+
+        const [tempData, setTempData] = useState<any[]>(defaultTableData);
         // console.log({defaultTableData});
 
         return (
             <DrawerForm
                 title={`${type == 'EDIT' ? '编辑' : '新增'}模板数据`}
                 width={800}
-                initialValues={type == 'EDIT' ? { ...record,table:defaultTableData,filedType:'Text'} : {filedType:'Text'}}
+                initialValues={type == 'EDIT' ? { ...record, table: defaultTableData, filedType: 'Text' } : { filedType: 'Text' }}
                 trigger={
                     type == 'EDIT' ? <a key="edit" >编辑</a> : <span className='add'>新增</span>
                 }
                 onFinish={(val) => {
                     return updateTable(type == 'EDIT' ? { ...record, ...val } : { ...val }, type);
                 }}
+                formRef={formRef}
                 drawerProps={{ destroyOnClose: true }}
                 colProps={{ span: 24 }}
                 grid
@@ -279,13 +290,19 @@ export default function FenyeTemplate() {
                     placeholder="请输入"
                 />
 
-                <EditableProTable 
+                <EditableProTable
                     name='table'
                     rowKey={'tempId'}
-                    tableStyle={{padding:0}}
+                    editableFormRef={editorFormRef}
+                    tableStyle={{ padding: 0 }}
                     columns={editableColumns}
+                    controlled
+                    editable={{
+                       
+                    }}
                     recordCreatorProps={{
-                        record: () => ({ tempId: (Math.random() * 1000000).toFixed(0),filedType:'Text' }),
+                        record: () => ({ tempId: (Math.random() * 1000000).toFixed(0), filedType: 'Text' }),
+                        
                     }}
                 />
             </DrawerForm>

+ 3 - 9
src/pages/setting/qualitativeOptionsMana/index.tsx

@@ -2,7 +2,7 @@
  * @Author: code4eat awesomedema@gmail.com
  * @Date: 2023-03-03 11:30:33
  * @LastEditors: code4eat awesomedema@gmail.com
- * @LastEditTime: 2023-09-27 11:00:08
+ * @LastEditTime: 2023-09-27 17:04:16
  * @FilePath: /KC-MiddlePlatform/src/pages/platform/setting/pubDicTypeMana/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -32,20 +32,14 @@ const IconFont = createFromIconfontCN({
 });
 
 const resultTypeList = [
-    {
-        label: '不适用', value: 1
-    },
-    {
-        label: '无缺失', value: 1
-    },
     {
         label: '无需操作', value: 1
     },
     {
-        label: '需使用改善工具', value: 3
+        label: '需改善回复', value: 2
     },
     {
-        label: '需改善回复', value: 2
+        label: '需使用改善工具', value: 3
     }
 ]