diff --git a/src/global.less b/src/global.less index de3e0f1..6b69bce 100644 --- a/src/global.less +++ b/src/global.less @@ -1,64 +1,77 @@ -html, -body, -#root { - height: 100%; - margin: 0; - padding: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, - 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', - 'Noto Color Emoji'; -} - -.colorWeak { - filter: invert(80%); -} - -.ant-layout { - min-height: 100vh !important; -} - -.ant-pro-sider.ant-layout-sider.ant-pro-sider-fixed { - left: unset; -} -.ant-table-row { - &-level-1 .ant-table-cell:first-child { - padding-left: 24px !important; - } - &-level-2 .ant-table-cell:first-child { - padding-left: 48px !important; - } - // 可根据需要添加更多层级 -} -canvas { - display: block; -} - -body { - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -ul, -ol { - list-style: none; -} - -@media (max-width: 768px) { - .ant-table { - width: 100%; - overflow-x: auto; - - &-thead > tr, - &-tbody > tr { - > th, - > td { - white-space: pre; - - > span { - display: block; - } - } - } - } -} +html, +body, +#root { + height: 100%; + margin: 0; + padding: 0; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, + 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', + 'Noto Color Emoji'; +} + +.colorWeak { + filter: invert(80%); +} + +.ant-layout { + min-height: 100vh !important; +} + +.ant-pro-sider.ant-layout-sider.ant-pro-sider-fixed { + left: unset; +} +.ant-table-cell .ant-table-row-expand-icon { + vertical-align: middle; + margin-right: 8px; +} +.ant-table-row { + &-level-0 .ant-table-cell:first-child { + padding-left: 16px !important; + } + &-level-1 .ant-table-cell:first-child { + padding-left: 40px !important; + } + &-level-2 .ant-table-cell:first-child { + padding-left: 64px !important; + } +} +.ant-table-row .ant-table-cell:first-child { + display: flex; + align-items: center; +} +.ant-table-row-level-2 .ant-table-row-expand-icon { + display: none; +} +canvas { + display: block; +} + +body { + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +ul, +ol { + list-style: none; +} + +@media (max-width: 768px) { + .ant-table { + width: 100%; + overflow-x: auto; + + &-thead > tr, + &-tbody > tr { + > th, + > td { + white-space: pre; + + > span { + display: block; + } + } + } + } +} diff --git a/src/pages/Classify/Jobs/index.tsx b/src/pages/Classify/Jobs/index.tsx index eee5f72..979a201 100644 --- a/src/pages/Classify/Jobs/index.tsx +++ b/src/pages/Classify/Jobs/index.tsx @@ -43,13 +43,14 @@ const handleExport = async (values: API.ClassifyJobs.Params) => { } }; const buildTree = (data: API.ClassifyJobs.Jobs[], parentId: number = 0,depth = 0): API.ClassifyJobs.Jobs[] => { - return data + const children = data .filter(item => item.parentId === parentId) .map(item => ({ ...item, depth, children: buildTree(data, item.jobId,depth + 1), })); + return children || []; }; const ManagementList: React.FC = () => { @@ -73,10 +74,10 @@ const ManagementList: React.FC = () => { title: '岗位名称', dataIndex: 'jobName', - align: 'center', + align: 'left', render: (text, record) => ( - + {text} ), @@ -104,67 +105,22 @@ const ManagementList: React.FC = () => { return ; }, }, - { - title: '操作', - hideInSearch: true, - align: 'center', - dataIndex: 'jobId', - width: 300, - render: (_, record) => [ - , - // , - ], - }, ]; return (
- // params 是需要自带的参数 - // 这个参数优先级更高,会覆盖查询表单的参数 actionRef={actionRef} formRef={formTableRef} rowKey="jobId" key="index" columns={columns} + expandable={{ + childrenColumnName: 'children', + defaultExpandAllRows: true, + indentSize:24, + rowExpandable: (record) => Array.isArray(record.children) && record.children.length > 0, + }} search={{ labelWidth: 120, }} @@ -173,7 +129,6 @@ const ManagementList: React.FC = () => { pageSize:1000 }); const treeData = buildTree(res.rows); - console.log('完整树形结构:', JSON.stringify(treeData, null, 2)); return { data: treeData, total: res.total, @@ -181,13 +136,6 @@ const ManagementList: React.FC = () => { }; }} pagination={false} - expandable={{ - childrenColumnName: 'children', - defaultExpandAllRows: true, - indentSize:30, - rowExpandable: (record) => !!record.children?.length - }} - toolBarRender={() => [