diff --git a/docs/form-render/index.md b/docs/form-render/index.md index 710c466c2..d6dfca4d9 100644 --- a/docs/form-render/index.md +++ b/docs/form-render/index.md @@ -42,7 +42,92 @@ npm i form-render --save */ import React from 'react'; import FormRender, { useForm } from 'form-render'; -import schema from './schema/simple'; +// import schema from './schema/simple'; + + +const schema = { +"type":"object", +"title":"质检报告配置类目维度", +"properties":{ +"zzConfigList":{ +"type":"array", +"title":"配置信息", +"required":true, +"rules":[ +{ +"required":true, +"message":"必填" +} +], +"widget":"drawerList", +"items":{ +"type":"object", +"widget":"lineTitle", +"properties":{ +"cateId":{ +"type":"string", + + "title":"末级类目ID", + "required":true, + "width":"50%", + "rules":[ + { + "message":"长度超限,请确认", + "max":11 + }, + { + "message":"只允许填写数字", + "pattern":"^[0-9]+$" + }, + { + "required":true, + "message":"[末级类目ID]必填" + } + ], + "default":"" + }, + "configs":{ + "type":"array", + "title":"二级项", + "required":false, + "columnHidden": true, + "widget":"drawerList", + "items":{ + "widget":"lineTitle", + "type":"object", + "properties":{ + "firstId":{ + "type":"string", + + "title":"一级质检项ID", + "required":true, + "width":"50%", + "rules":[ + { + "message":"长度超限,请确认", + "max":11 + }, + { + "message":"只允许填写数字", + "pattern":"^[0-9]+$" + }, + { + "required":true, + "message":"[一级质检项ID]必填" + } + ], + "default":"" + }, + + } + } + } + } + } + } + }, + "displayType":"row" +} export default () => { const form = useForm(); @@ -63,7 +148,7 @@ export default () => { } ``` -**类组件** + \ No newline at end of file diff --git a/packages/form-render/src/widgets/listDrawer/index.tsx b/packages/form-render/src/widgets/listDrawer/index.tsx index 4ef739543..cf79b3cfd 100644 --- a/packages/form-render/src/widgets/listDrawer/index.tsx +++ b/packages/form-render/src/widgets/listDrawer/index.tsx @@ -6,6 +6,7 @@ import React, { useState, useRef } from 'react'; import { Space, Table, Form, Button, Popconfirm, Tooltip, Divider } from 'antd'; import { ArrowDownOutlined, ArrowUpOutlined, PlusOutlined, InfoCircleOutlined, CloseOutlined, CopyOutlined } from '@ant-design/icons'; import type { FormListFieldData, FormListOperation, TableColumnsType } from 'antd'; +import sortProperties from '../../models/sortProperties'; import FormDrawer from './drawerForm'; import FButton from '../components/FButton'; import './index.less'; @@ -54,6 +55,7 @@ const TableList: React.FC = (props: any) => { actionColumnProps, editorBtnProps, + hideOperate, hideDelete, hideCopy, hideMove, @@ -105,15 +107,19 @@ const TableList: React.FC = (props: any) => { indexRef.current = null; }; - const columns: TableColumnsType = Object.keys(columnSchema).map(dataIndex => { - const { title, tooltip, width } = columnSchema[dataIndex]; - const tooltipProps = getTooltip(tooltip); + const columns: any = sortProperties(Object.entries(columnSchema)).map(([dataIndex, item]) => { + const { required, title, tooltip, width, columnHidden } = item; + if (columnHidden) { + return null; + } + const tooltipProps = getTooltip(tooltip); return { dataIndex, width, title: ( <> + {required && *} {title} {tooltipProps && ( @@ -136,9 +142,9 @@ const TableList: React.FC = (props: any) => { return renderCore({ schema: fieldSchema, parentPath: [field.name], rootPath: [...rootPath, field.name] }); } } - }); + }).filter(item => item); - if (!readOnly) { + if (!readOnly && !hideOperate) { columns.push({ title: colHeaderText, width: '190px', diff --git a/packages/form-render/src/widgets/listTable/index.tsx b/packages/form-render/src/widgets/listTable/index.tsx index dc4a9a606..09a2342f3 100644 --- a/packages/form-render/src/widgets/listTable/index.tsx +++ b/packages/form-render/src/widgets/listTable/index.tsx @@ -88,8 +88,12 @@ const TableList: React.FC = (props) => { copyItem(value); }; - const columns: TableColumnsType = sortProperties(Object.entries(itemSchema)).map(([dataIndex, item]) => { - const { required, title, width, tooltip } = item; + const columns: any = sortProperties(Object.entries(itemSchema)).map(([dataIndex, item]) => { + const { required, title, width, tooltip, columnHidden } = item; + if (columnHidden) { + return null; + } + const tooltipProps = getTooltip(tooltip); return { dataIndex, @@ -135,7 +139,7 @@ const TableList: React.FC = (props) => { ); } }; - }); + }).filter(item => item); if (!readOnly && !hideOperate) { columns.push({