A 表格展示列编辑后自动保存

pull/410/head
vapao 2021-11-05 23:14:57 +08:00
parent 0395eb5ab5
commit 4ed59b0664
16 changed files with 39 additions and 4 deletions

View File

@ -8,6 +8,9 @@ import { Table, Space, Divider, Popover, Checkbox, Button, Input, Select } from
import { ReloadOutlined, SettingOutlined, FullscreenOutlined, SearchOutlined } from '@ant-design/icons';
import styles from './index.module.less';
let TableFields = localStorage.getItem('TableFields')
TableFields = TableFields ? JSON.parse(TableFields) : {}
function Search(props) {
let keys = props.keys || [''];
keys = keys.map(x => x.split('/'));
@ -135,13 +138,31 @@ function TableCard(props) {
_columns = [props.children.props]
}
}
let hideFields = _columns.filter(x => x.hide).map(x => x.title)
if (props.tKey) {
if (TableFields[props.tKey]) {
hideFields = TableFields[props.tKey]
} else {
TableFields[props.tKey] = hideFields
localStorage.setItem('TableFields', JSON.stringify(TableFields))
}
}
for (let [index, item] of _columns.entries()) {
if (!item.hide) _fields.push(index)
if (!hideFields.includes(item.title)) _fields.push(index)
}
setFields(_fields);
setColumns(_columns);
setDefaultFields(_fields);
}, [props.columns, props.children])
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [])
function handleFieldsChange(fields) {
setFields(fields)
if (props.tKey) {
TableFields[props.tKey] = columns.filter((_, index) => !fields.includes(index)).map(x => x.title)
localStorage.setItem('TableFields', JSON.stringify(TableFields))
}
}
return (
<div ref={rootRef} className={styles.tableCard}>
@ -152,7 +173,7 @@ function TableCard(props) {
fields={fields}
rootRef={rootRef}
defaultFields={defaultFields}
onFieldsChange={setFields}
onFieldsChange={handleFieldsChange}
onReload={props.onReload}/>
<Table
rowKey={props.rowKey}

View File

@ -67,6 +67,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
tKey="aa"
rowKey="id"
title="报警历史记录"
loading={store.isFetching}

View File

@ -34,6 +34,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
tKey="ac"
rowKey="id"
title="报警联系人"
loading={store.isFetching}

View File

@ -56,6 +56,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
tKey="ag"
rowKey="id"
title="报警联系组"
loading={store.isFetching}

View File

@ -43,6 +43,7 @@ class ComTable extends React.Component {
}
return (
<TableCard
tKey="ca"
rowKey="id"
title="应用列表"
loading={store.isFetching}

View File

@ -38,6 +38,7 @@ function ComTable() {
return (
<TableCard
tKey="ce"
rowKey="id"
title="环境列表"
loading={store.isFetching}

View File

@ -39,6 +39,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
tKey="cs"
rowKey="id"
title="服务列表"
loading={store.isFetching}

View File

@ -118,6 +118,7 @@ function ComTable() {
return (
<TableCard
tKey="da"
title="应用列表"
rowKey="id"
loading={store.isFetching}

View File

@ -64,6 +64,7 @@ function ComTable() {
const statusColorMap = {'0': 'cyan', '1': 'blue', '2': 'red', '5': 'green'};
return (
<TableCard
tKey="dre"
rowKey="id"
title="构建版本列表"
loading={store.isFetching}

View File

@ -154,6 +154,7 @@ function ComTable() {
return (
<TableCard
tKey="dr"
rowKey="id"
title="申请列表"
columns={columns}

View File

@ -41,6 +41,7 @@ class ComTable extends React.Component {
}
return (
<TableCard
tKey="et"
title="模板列表"
rowKey="id"
loading={store.isFetching}

View File

@ -49,6 +49,7 @@ function ComTable() {
return (
<TableCard
tKey="hi"
rowKey="id"
title={<Input placeholder="输入检索" style={{maxWidth: 250}} onChange={e => store.f_word = e.target.value}/>}
loading={store.isFetching}

View File

@ -71,6 +71,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
tKey="mi"
rowKey="id"
title="监控任务"
loading={store.isFetching}

View File

@ -124,6 +124,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
tKey="si"
rowKey="id"
title="任务列表"
loading={store.isFetching}

View File

@ -95,6 +95,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
tKey="sa"
rowKey="id"
title="账户列表"
loading={store.isFetching}

View File

@ -58,7 +58,7 @@ class ComTable extends React.Component {
render() {
return (
<TableCard
rowKey="id"
rowKey="sr"
title="角色列表"
loading={store.isFetching}
dataSource={store.dataSource}