mirror of https://github.com/openspug/spug
A 表格展示列编辑后自动保存
parent
0395eb5ab5
commit
4ed59b0664
|
@ -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}
|
||||
|
|
|
@ -67,6 +67,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
tKey="aa"
|
||||
rowKey="id"
|
||||
title="报警历史记录"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -34,6 +34,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
tKey="ac"
|
||||
rowKey="id"
|
||||
title="报警联系人"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -56,6 +56,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
tKey="ag"
|
||||
rowKey="id"
|
||||
title="报警联系组"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -43,6 +43,7 @@ class ComTable extends React.Component {
|
|||
}
|
||||
return (
|
||||
<TableCard
|
||||
tKey="ca"
|
||||
rowKey="id"
|
||||
title="应用列表"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -38,6 +38,7 @@ function ComTable() {
|
|||
|
||||
return (
|
||||
<TableCard
|
||||
tKey="ce"
|
||||
rowKey="id"
|
||||
title="环境列表"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -39,6 +39,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
tKey="cs"
|
||||
rowKey="id"
|
||||
title="服务列表"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -118,6 +118,7 @@ function ComTable() {
|
|||
|
||||
return (
|
||||
<TableCard
|
||||
tKey="da"
|
||||
title="应用列表"
|
||||
rowKey="id"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -154,6 +154,7 @@ function ComTable() {
|
|||
|
||||
return (
|
||||
<TableCard
|
||||
tKey="dr"
|
||||
rowKey="id"
|
||||
title="申请列表"
|
||||
columns={columns}
|
||||
|
|
|
@ -41,6 +41,7 @@ class ComTable extends React.Component {
|
|||
}
|
||||
return (
|
||||
<TableCard
|
||||
tKey="et"
|
||||
title="模板列表"
|
||||
rowKey="id"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -71,6 +71,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
tKey="mi"
|
||||
rowKey="id"
|
||||
title="监控任务"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -124,6 +124,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
tKey="si"
|
||||
rowKey="id"
|
||||
title="任务列表"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -95,6 +95,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
tKey="sa"
|
||||
rowKey="id"
|
||||
title="账户列表"
|
||||
loading={store.isFetching}
|
||||
|
|
|
@ -58,7 +58,7 @@ class ComTable extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<TableCard
|
||||
rowKey="id"
|
||||
rowKey="sr"
|
||||
title="角色列表"
|
||||
loading={store.isFetching}
|
||||
dataSource={store.dataSource}
|
||||
|
|
Loading…
Reference in New Issue