diff --git a/packages/table/src/components/EditableTable/demos/fuza.tsx b/packages/table/src/components/EditableTable/demos/fuza.tsx new file mode 100644 index 000000000000..dc6d394741e6 --- /dev/null +++ b/packages/table/src/components/EditableTable/demos/fuza.tsx @@ -0,0 +1,273 @@ +import { + ProCard, + ProForm, + ProFormDependency, + ProFormField, + ProTable, +} from '@ant-design/pro-components'; +import { FormInstance, Input, Tabs } from 'antd'; +import { useRef } from 'react'; + +const defaultData = [ + { + name: 'company_total', + value: { + schemaName: 'namespace_e0d8926c7cd51a4ce3ca3675ee370478', + tableName: 'company_total', + }, + columnsInfo: [ + { + name: 'auto_id_by_system', + dataType: 'bigint', + description: '系统自动生成-自增主键', + supplementComment: '系统自动生成-自增主键', + }, + { + name: 'project_name', + dataType: 'text', + description: + 'project; 保险项目名称，包括赔款支出、保险金额、总资产、责任险、农业保险、原保险保费收入、健康险、意外险等。', + supplementComment: + 'project; 保险项目名称，包括赔款支出、保险金额、总资产、责任险、农业保险、原保险保费收入、健康险、意外险等。', + }, + { + name: 'amount', + dataType: 'numeric(24,5)', + description: 'amount; 数值金额，代表各种保险项目的金额。', + supplementComment: 'amount; 数值金额，代表各种保险项目的金额。', + }, + ], + description: '7月财产险公司经营情况表', + }, + { + name: 'part_compay_info', + value: { + schemaName: 'namespace_e0d8926c7cd51a4ce3ca3675ee370478', + tableName: 'part_compay_info', + }, + columnsInfo: [ + { + name: 'auto_id_by_system', + dataType: 'bigint', + description: '系统自动生成-自增主键', + supplementComment: '系统自动生成-自增主键', + }, + { + name: 'mct_one_id', + dataType: 'text', + description: 'mct_one_id; 唯一标识符', + supplementComment: 'mct_one_id; 唯一标识符', + }, + { + name: 'list_type', + dataType: 'text', + description: 'list_type; 上市板块类型', + supplementComment: 'list_type; 上市板块类型', + }, + { + name: 'report_year', + dataType: 'numeric(24,5)', + description: 'report_year; 报告年份', + supplementComment: 'report_year; 报告年份', + }, + { + name: 'org_name', + dataType: 'text', + description: 'org_name; 公司名称', + supplementComment: 'org_name; 公司名称', + }, + { + name: 'total_assets', + dataType: 'numeric(24,5)', + description: 'total_assets; 总资产', + supplementComment: 'total_assets; 总资产', + }, + { + name: 'total_liability', + dataType: 'numeric(24,5)', + description: 'total_liability; 总负债', + supplementComment: 'total_liability; 总负债', + }, + { + name: 'equity', + dataType: 'numeric(24,5)', + description: 'equity; 股东权益', + supplementComment: 'equity; 股东权益', + }, + { + name: 'total_profit', + dataType: 'numeric(24,5)', + description: 'total_profit; 总利润', + supplementComment: 'total_profit; 总利润', + }, + { + name: 'net_profit', + dataType: 'numeric(24,5)', + description: 'net_profit; 净利润', + supplementComment: 'net_profit; 净利润', + }, + { + name: 'tax', + dataType: 'numeric(24,5)', + description: 'tax; 税额', + supplementComment: 'tax; 税额', + }, + ], + description: '企业年报', + }, +]; + +export default () => { + const formRef = useRef(); + return ( + { + console.log(e); + }} + initialValues={{ columnsInfo: defaultData, table: defaultData }} + > + + {({ columnsInfo }) => { + const list = (columnsInfo || []) as any[]; + return ( + { + return { + key: item.name || '', + tab: ( +
+ {item.name} +
+ ), + label: ( +
+ {item.name} +
+ ), + children: ( +
+
+ row.name || '', + ), + }} + rowKey="name" + name={['table', index, 'columnsInfo']} + columns={[ + { + title: '字段名称', + dataIndex: 'name', + editable: false, + }, + { + title: '字段类型', + dataIndex: 'dataType', + editable: false, + }, + { + title: '字段别名', + dataIndex: 'description', + editable: false, + width: 140, + render: (text, record) => { + return ( +
+ {record.description + ? record.description + : '-'} +
+ ); + }, + }, + { + title: '补充说明', + dataIndex: 'supplementComment', + renderFormItem: () => { + return ( + + ); + }, + }, + ]} + toolBarRender={false} + request={async () => { + return { + data: item.columnsInfo, + }; + }} + /> +
+
+ ), + }; + })} + /> + ); + }} + + + + + {({ table }) => { + return ( + + ); + }} + + + + ); +}; diff --git a/packages/table/src/components/EditableTable/index.md b/packages/table/src/components/EditableTable/index.md index 2c32399c844c..ab8ffca141cc 100644 --- a/packages/table/src/components/EditableTable/index.md +++ b/packages/table/src/components/EditableTable/index.md @@ -41,6 +41,10 @@ atomId: EditableProTable +### 复杂的编辑表格 + + + ## EditableProTable | 属性 | 描述 | 类型 | 默认值 | diff --git a/tests/table/__snapshots__/demo.test.ts.snap b/tests/table/__snapshots__/demo.test.ts.snap index 9e9f4a6342b1..f71934ff46ac 100644 --- a/tests/table/__snapshots__/demo.test.ts.snap +++ b/tests/table/__snapshots__/demo.test.ts.snap @@ -4572,6 +4572,603 @@ exports[`table demos > 📸 renders ./packages/table/src/components/EditableTabl `; +exports[`table demos > 📸 renders ./packages/table/src/components/EditableTable/demos/fuza.tsx correctly 1`] = ` + +
+
+ test +
+
+ +
+
+
+
+
+ +
+
+ +
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ 字段名称 + + 字段类型 + + 字段别名 + + 补充说明 +
+ auto_id_by_system + + bigint + +
+ 系统自动生成-自增主键 +
+ 		+
+
+
+
+
+ +
+
+
+
+
+
+ project_name + + text + +
+ project; 保险项目名称，包括赔款支出、保险金额、总资产、责任险、农业保险、原保险保费收入、健康险、意外险等。 +
+ 		+
+
+
+
+
+ +
+
+
+
+
+
+ amount + + numeric(24,5) + +
+ amount; 数值金额，代表各种保险项目的金额。 +
+ 		+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + 表格数据 +
+
+
+ 
+            
+              [
+  {
+    "name": "company_total",
+    "value": {
+      "schemaName": "namespace_e0d8926c7cd51a4ce3ca3675ee370478",
+      "tableName": "company_total"
+    },
+    "columnsInfo": [
+      {
+        "name": "auto_id_by_system",
+        "dataType": "bigint",
+        "description": "系统自动生成-自增主键",
+        "supplementComment": "系统自动生成-自增主键"
+      },
+      {
+        "name": "project_name",
+        "dataType": "text",
+        "description": "project; 保险项目名称，包括赔款支出、保险金额、总资产、责任险、农业保险、原保险保费收入、健康险、意外险等。",
+        "supplementComment": "project; 保险项目名称，包括赔款支出、保险金额、总资产、责任险、农业保险、原保险保费收入、健康险、意外险等。"
+      },
+      {
+        "name": "amount",
+        "dataType": "numeric(24,5)",
+        "description": "amount; 数值金额，代表各种保险项目的金额。",
+        "supplementComment": "amount; 数值金额，代表各种保险项目的金额。"
+      }
+    ],
+    "description": "7月财产险公司经营情况表"
+  },
+  {
+    "name": "part_compay_info",
+    "value": {
+      "schemaName": "namespace_e0d8926c7cd51a4ce3ca3675ee370478",
+      "tableName": "part_compay_info"
+    },
+    "columnsInfo": [
+      {
+        "name": "auto_id_by_system",
+        "dataType": "bigint",
+        "description": "系统自动生成-自增主键",
+        "supplementComment": "系统自动生成-自增主键"
+      },
+      {
+        "name": "mct_one_id",
+        "dataType": "text",
+        "description": "mct_one_id; 唯一标识符",
+        "supplementComment": "mct_one_id; 唯一标识符"
+      },
+      {
+        "name": "list_type",
+        "dataType": "text",
+        "description": "list_type; 上市板块类型",
+        "supplementComment": "list_type; 上市板块类型"
+      },
+      {
+        "name": "report_year",
+        "dataType": "numeric(24,5)",
+        "description": "report_year; 报告年份",
+        "supplementComment": "report_year; 报告年份"
+      },
+      {
+        "name": "org_name",
+        "dataType": "text",
+        "description": "org_name; 公司名称",
+        "supplementComment": "org_name; 公司名称"
+      },
+      {
+        "name": "total_assets",
+        "dataType": "numeric(24,5)",
+        "description": "total_assets; 总资产",
+        "supplementComment": "total_assets; 总资产"
+      },
+      {
+        "name": "total_liability",
+        "dataType": "numeric(24,5)",
+        "description": "total_liability; 总负债",
+        "supplementComment": "total_liability; 总负债"
+      },
+      {
+        "name": "equity",
+        "dataType": "numeric(24,5)",
+        "description": "equity; 股东权益",
+        "supplementComment": "equity; 股东权益"
+      },
+      {
+        "name": "total_profit",
+        "dataType": "numeric(24,5)",
+        "description": "total_profit; 总利润",
+        "supplementComment": "total_profit; 总利润"
+      },
+      {
+        "name": "net_profit",
+        "dataType": "numeric(24,5)",
+        "description": "net_profit; 净利润",
+        "supplementComment": "net_profit; 净利润"
+      },
+      {
+        "name": "tax",
+        "dataType": "numeric(24,5)",
+        "description": "tax; 税额",
+        "supplementComment": "tax; 税额"
+      }
+    ],
+    "description": "企业年报"
+  }
+]
+            
+
+
+
+
+ + +
+ +
+ +`; + exports[`table demos > 📸 renders ./packages/table/src/components/EditableTable/demos/real-time-editing.tsx correctly 1`] = `