diff --git a/frontend/src/components/pure/ms-table/base-table.vue b/frontend/src/components/pure/ms-table/base-table.vue index 7a69992c28..b278db1190 100644 --- a/frontend/src/components/pure/ms-table/base-table.vue +++ b/frontend/src/components/pure/ms-table/base-table.vue @@ -58,14 +58,17 @@ {{ t(item.title as string) }} - + - + - + {{ t((element.title || element.columnTitle) as string) }} - + @@ -151,10 +151,6 @@ hasChange.value = true; }; - const handleDragChange = () => { - hasChange.value = true; - }; - onBeforeMount(() => { if (props.tableKey) { tableStore.getMode(props.tableKey).then((res) => { diff --git a/frontend/src/components/pure/ms-table/columnSelectorIcon.vue b/frontend/src/components/pure/ms-table/columnSelectorIcon.vue new file mode 100644 index 0000000000..ed8e5efcba --- /dev/null +++ b/frontend/src/components/pure/ms-table/columnSelectorIcon.vue @@ -0,0 +1,146 @@ + + + + + + {{ t('msTable.columnSetting.display') }} + {{ t('msTable.columnSetting.resetDefault') }} + + + + {{ t((item.title || item.columnTitle) as string) }} + + + + {{ + t('msTable.columnSetting.nonSort') + }} + + + + + {{ t((element.title || element.columnTitle) as string) }} + + + + + + + + + + + + diff --git a/frontend/src/components/pure/ms-table/locale/zh-CN.ts b/frontend/src/components/pure/ms-table/locale/zh-CN.ts index 72fcb97e21..7ae25104b1 100644 --- a/frontend/src/components/pure/ms-table/locale/zh-CN.ts +++ b/frontend/src/components/pure/ms-table/locale/zh-CN.ts @@ -18,7 +18,7 @@ export default { clear: '清空', }, columnSetting: { - display: '表格显示设置', + display: '表头显示设置', mode: '模式设置', drawer: '抽屉', newWindow: '新窗口', diff --git a/frontend/src/components/pure/ms-table/type.ts b/frontend/src/components/pure/ms-table/type.ts index dadc2ea468..6d89feb5df 100644 --- a/frontend/src/components/pure/ms-table/type.ts +++ b/frontend/src/components/pure/ms-table/type.ts @@ -101,6 +101,7 @@ export interface MsTableProps { expandedKeys?: string[]; // 显示的展开行、子树(受控模式) emptyDataShowLine?: boolean; // 空数据是否显示 "-" showJumpMethod?: boolean; // 是否展示跳转方法 + isSimpleSetting?: boolean; // 是否是简单的设置 [key: string]: any; } diff --git a/frontend/src/components/pure/ms-table/useTable.ts b/frontend/src/components/pure/ms-table/useTable.ts index 793e849ab0..c1a0ab0b26 100644 --- a/frontend/src/components/pure/ms-table/useTable.ts +++ b/frontend/src/components/pure/ms-table/useTable.ts @@ -78,6 +78,7 @@ export default function useTableProps( /** Column Selector */ showJumpMethod: false, // 是否显示跳转方法 showFooterActionWrap: false, // 是否显示底部操作区域 + isSimpleSetting: false, // 是否是简易column设置 ...props, }; diff --git a/frontend/src/hooks/useTableStore.ts b/frontend/src/hooks/useTableStore.ts index 41711d202a..f115180e84 100644 --- a/frontend/src/hooks/useTableStore.ts +++ b/frontend/src/hooks/useTableStore.ts @@ -1,6 +1,7 @@ import { filter, orderBy, sortBy } from 'lodash-es'; import localforage from 'localforage'; +import { is } from '@/components/pure/minder-editor/script/tool/key'; import { MsTableColumn, MsTableColumnData } from '@/components/pure/ms-table/type'; import { useAppStore } from '@/store'; @@ -58,15 +59,12 @@ export default function useTableStore() { } if (item.dataIndex === SpecialColumnEnum.ID) { // dataIndex 为 id 的列默认不排序,且展示在列的最前面 - item.showDrag = false; item.sortIndex = 0; } else if (item.dataIndex === SpecialColumnEnum.NAME) { // dataIndex 为 name 的列默认不排序,且展示在列的第二位 - item.showDrag = false; item.sortIndex = 1; } else if (item.dataIndex === SpecialColumnEnum.OPERATION || item.dataIndex === SpecialColumnEnum.ACTION) { // dataIndex 为 operation 或 action 的列默认不排序,且展示在列的最后面 - item.showDrag = false; item.sortIndex = state.operationBaseIndex; } }); @@ -112,7 +110,7 @@ export default function useTableStore() { console.log(e); } } - async function setColumns(key: string, columns: MsTableColumn, mode?: TableOpenDetailMode) { + async function setColumns(key: string, columns: MsTableColumn, mode?: TableOpenDetailMode, isSimple?: boolean) { try { columns.forEach((item, idx) => { if (item.showDrag) { @@ -123,6 +121,12 @@ export default function useTableStore() { if (!selectorColumnMap) { return; } + if (isSimple) { + const oldColumns = selectorColumnMap[key].column; + const operationColumn = oldColumns.find((i) => i.dataIndex === SpecialColumnEnum.OPERATION); + if (operationColumn) columns.push(operationColumn); + } + selectorColumnMap[key] = { mode, column: JSON.parse(JSON.stringify(columns)), @@ -147,12 +151,15 @@ export default function useTableStore() { } return 'drawer'; } - async function getColumns(key: string) { + async function getColumns(key: string, isSimple?: boolean) { const selectorColumnMap = await getSelectorColumnMap(); if (selectorColumnMap[key]) { const tmpArr = selectorColumnMap[key].column; const { nonSortableColumns, couldSortableColumns } = tmpArr.reduce( (result: { nonSortableColumns: MsTableColumnData[]; couldSortableColumns: MsTableColumnData[] }, item) => { + if (isSimple && item.dataIndex === SpecialColumnEnum.OPERATION) { + return result; + } if (item.showDrag) { result.couldSortableColumns.push(item); } else { diff --git a/frontend/src/views/api-test/components/paramTable.vue b/frontend/src/views/api-test/components/paramTable.vue index f0e52625ee..875fb22552 100644 --- a/frontend/src/views/api-test/components/paramTable.vue +++ b/frontend/src/views/api-test/components/paramTable.vue @@ -246,7 +246,7 @@ - +