Fixed some bugs.

src/components/events.ts

@@ -2,7 +2,7 @@ import type { InjectionKey, Ref } from 'vue'
 import { toRaw } from 'vue'
 import type { TableBasicConf, TableColumnConf, TableLayoutColumnConf, TableLayoutConf, TableStyleConf } from './conf'
 import { getDefaultValueByDataKind } from './conf'
-import { sortByTree } from './function/RowTree.vue'
+import { filterTreeDataPks, sortByTree } from './function/RowTree'
 import type { TableCellDictItem, TableCellDictItemResp, TableDataResp, TableDataSliceReq, TableEventProps, TableLayoutModifyReq } from './props'
 import { DATA_DICT_POSTFIX, OperatorKind } from './props'
 
@@ -153,7 +153,7 @@ export async function addData(newRecords: { [key: string]: any }[], afterPk: any
   else if (layout.data && !Array.isArray(layout.data)) {
     const idx = layout.data.records.findIndex(r => r[tableBasicConf.pkColumnName] === afterPk)
     layout.data.records.splice(idx + 1, 0, ...savedRecords)
-    layout.data.records = sortByTree(layout.data, tableBasicConf.pkColumnName, tableBasicConf.parentPkColumnName)
+    layout.data.records = sortByTree(layout.data.records, tableBasicConf.pkColumnName, tableBasicConf.parentPkColumnName)
   }
   else {
     // Empty,unreachable
@@ -211,12 +211,12 @@ export async function deleteData(deletedPks: any[], reFilter?: boolean, reSort?:
   }
   if (Array.isArray(layout.data)) {
     layout.data.forEach((d) => {
-      deletedPks = filterTreeDataPks(deletedPks, d.records)
+      deletedPks = filterTreeDataPks(deletedPks, d.records, tableBasicConf.pkColumnName, tableBasicConf.parentPkColumnName)
       d.records = d.records.filter(item => !deletedPks.includes(item[tableBasicConf.pkColumnName]))
     })
   }
   else if (layout.data && !Array.isArray(layout.data)) {
-    deletedPks = filterTreeDataPks(deletedPks, layout.data.records)
+    deletedPks = filterTreeDataPks(deletedPks, layout.data.records, tableBasicConf.pkColumnName, tableBasicConf.parentPkColumnName)
     layout.data.records = layout.data.records.filter(item => !deletedPks.includes(item[tableBasicConf.pkColumnName]))
   }
   else {
@@ -226,22 +226,6 @@ export async function deleteData(deletedPks: any[], reFilter?: boolean, reSort?:
   // TODO agg清空，重新计算
 }
 
-function filterTreeDataPks(filterPks: any[], records: { [key: string]: any }[]): any[] {
-  if (tableBasicConf.parentPkColumnName === undefined)
-    return filterPks
-
-  const pksWithChildren: any[] = filterPks.slice()
-
-  pksWithChildren.forEach((pk) => {
-    const childrenPks = records.filter(record => record[tableBasicConf.parentPkColumnName!] === pk).map(record => record[tableBasicConf.pkColumnName])
-    if (childrenPks.length > 0) {
-      pksWithChildren.push(...childrenPks)
-      pksWithChildren.push(...filterTreeDataPks(childrenPks, records))
-    }
-  })
-  return pksWithChildren
-}
-
 export const FUN_LOAD_CELL_DICT_ITEMS_TYPE = Symbol('FUN_LOAD_CELL_DICT_ITEMS_TYPE') as InjectionKey<(columnName: string, filterValue?: any, slice?: TableDataSliceReq) => Promise<TableCellDictItemResp>>
 export async function loadCellDictItems(columnName: string, filterValue?: any, slice?: TableDataSliceReq): Promise<TableCellDictItemResp> {
   if (events.loadCellDictItems) { return await events.loadCellDictItems(columnName, filterValue, slice) }
@@ -516,11 +500,11 @@ export async function modifyLayout(changedLayoutReq: TableLayoutModifyReq, reFil
     let deleteExpandDataPks = []
     if (Array.isArray(layout.data)) {
       layout.data.forEach((groupData) => {
-        deleteExpandDataPks.push(...filterTreeDataPks([changedLayoutReq.deleteExpandDataPk], groupData.records))
+        deleteExpandDataPks.push(...filterTreeDataPks([changedLayoutReq.deleteExpandDataPk], groupData.records, tableBasicConf.pkColumnName, tableBasicConf.parentPkColumnName))
       })
     }
     else {
-      deleteExpandDataPks = filterTreeDataPks([changedLayoutReq.deleteExpandDataPk], (layout.data as TableDataResp).records)
+      deleteExpandDataPks = filterTreeDataPks([changedLayoutReq.deleteExpandDataPk], (layout.data as TableDataResp).records, tableBasicConf.pkColumnName, tableBasicConf.parentPkColumnName)
     }
     deleteExpandDataPks.forEach((deleteExpandDataPk) => {
       const idx = layout.expandDataPks.indexOf(deleteExpandDataPk)

src/components/function/RowTree.ts

@@ -0,0 +1,37 @@
+export const NODE_DEPTH_FLAG = '__node_depth'
+
+export function sortByTree(data: any[], pkColumnName: string, parentPkColumnName?: string) {
+  if (parentPkColumnName === undefined)
+    return data
+
+  return getTreeData(data, undefined, pkColumnName, parentPkColumnName, 0)
+}
+
+function getTreeData(data: any[], parentPk: any, pkColumnName: string, parentPkColumnName: string, depth: number): any[] {
+  const treeData = []
+  const nodeData = data.filter(item => item[parentPkColumnName] === parentPk)
+  for (const node of nodeData) {
+    node[NODE_DEPTH_FLAG] = depth
+    treeData.push(node)
+    const children = getTreeData(data, node[pkColumnName], pkColumnName, parentPkColumnName, depth + 1)
+    if (children.length > 0)
+      treeData.push(...children)
+  }
+  return treeData
+}
+
+export function filterTreeDataPks(filterPks: any[], records: { [key: string]: any }[], pkColumnName: string, parentPkColumnName?: string): any[] {
+  if (parentPkColumnName === undefined)
+    return filterPks
+
+  const pksWithChildren: any[] = filterPks.slice()
+
+  pksWithChildren.forEach((pk) => {
+    const childrenPks = records.filter(record => record[parentPkColumnName!] === pk).map(record => record[pkColumnName])
+    if (childrenPks.length > 0) {
+      pksWithChildren.push(...childrenPks)
+      pksWithChildren.push(...filterTreeDataPks(childrenPks, records, pkColumnName, parentPkColumnName))
+    }
+  })
+  return pksWithChildren
+}

src/components/function/RowTree.vue

@@ -3,6 +3,7 @@ import { inject } from 'vue'
 import * as iconSvg from '../../assets/icon'
 import { getParentWithClass } from '../../utils/basic'
 import { FUN_MODIFY_LAYOUT_TYPE } from '../events'
+import { NODE_DEPTH_FLAG } from './RowTree'
 
 const props = defineProps<{
   curData: { [key: string]: any }
@@ -12,6 +13,9 @@ const props = defineProps<{
   pkKindIsNumber: boolean
   expandDataPks: any[]
 }>()
+
+let IS_INIT = false
+
 const modifyLayoutFun = inject(FUN_MODIFY_LAYOUT_TYPE)!
 
 async function expandNode(dataPk: any) {
@@ -45,38 +49,12 @@ function init() {
   })
 }
 
-// eslint-disable-next-line ts/no-use-before-define
 if (!IS_INIT) {
   IS_INIT = true
   init()
 }
 </script>
 
-<script lang="ts">
-const NODE_DEPTH_FLAG = '__node_depth'
-
-let IS_INIT = false
-export function sortByTree(data: any[], PkColumnName: string, parentPkColumnName?: string) {
-  if (parentPkColumnName === undefined)
-    return data
-
-  return getTreeData(data, undefined, PkColumnName, parentPkColumnName, 0)
-}
-
-function getTreeData(data: any[], parentPk: any, pkColumnName: string, parentPkColumnName: string, depth: number): any[] {
-  const treeData = []
-  const nodeData = data.filter(item => item[parentPkColumnName] === parentPk)
-  for (const node of nodeData) {
-    node[NODE_DEPTH_FLAG] = depth
-    treeData.push(node)
-    const children = getTreeData(data, node[pkColumnName], pkColumnName, parentPkColumnName, depth + 1)
-    if (children.length > 0)
-      treeData.push(...children)
-  }
-  return treeData
-}
-</script>
-
 <template>
   <div class="flex justify-end iw-list-data-cell__container" :style="{ width: `${20 * (props.curData[NODE_DEPTH_FLAG] + 1)}px` }">
     <template v-if="props.nextData && props.nextData[props.parentPkColumnName] === props.curData[props.pkColumnName]">

src/components/layout/list/CellWrap.vue

@@ -1,22 +1,30 @@
 <script setup lang="ts">
-import { inject } from 'vue'
+import { computed, inject } from 'vue'
+import * as iconSvg from '../../../assets/icon'
 import { FUN_CLOSE_CONTEXT_MENU_TYPE } from '../../common/Menu.vue'
 import type { CachedColumnConf } from '../../conf'
 import { FUN_MODIFY_COLUMN_TYPE } from '../../events'
-import * as iconSvg from '../../../assets/icon'
 
 const props = defineProps<{
   curColumnConf: CachedColumnConf | undefined
   columnsConf: CachedColumnConf[]
   pkColumnName: string
 }>()
+
 const modifyColumnFun = inject(FUN_MODIFY_COLUMN_TYPE)!
 const closeContextMenuFun = inject(FUN_CLOSE_CONTEXT_MENU_TYPE)!
 
 async function setWrapColumn() {
   if (props.curColumnConf) {
-    props.curColumnConf.wrap = !props.curColumnConf.wrap
-    await modifyColumnFun(undefined, props.curColumnConf)
+    await modifyColumnFun(undefined, {
+      name: props.curColumnConf.name,
+      wrap: !props.curColumnConf.wrap,
+      fixed: props.curColumnConf.fixed,
+      width: props.curColumnConf.width,
+      hide: props.curColumnConf.hide,
+      dateStart: props.curColumnConf.dateStart,
+      dateEnd: props.curColumnConf.dateEnd,
+    })
   }
   closeContextMenuFun()
 }

src/components/layout/list/ColumnFixed.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import { inject } from 'vue'
+import * as iconSvg from '../../../assets/icon'
 import { FUN_CLOSE_CONTEXT_MENU_TYPE } from '../../common/Menu.vue'
 import type { CachedColumnConf } from '../../conf'
 import { FUN_MODIFY_COLUMN_TYPE } from '../../events'
-import * as iconSvg from '../../../assets/icon'
 
 const props = defineProps<{
   curColumnConf: CachedColumnConf | undefined
@@ -19,8 +19,15 @@ async function setFixedColumn() {
     await modifyColumnFun(undefined, oldFixedColumnConf)
   }
   if (props.curColumnConf) {
-    props.curColumnConf.fixed = !props.curColumnConf.fixed
-    await modifyColumnFun(undefined, props.curColumnConf)
+    await modifyColumnFun(undefined, {
+      name: props.curColumnConf.name,
+      wrap: props.curColumnConf.wrap,
+      fixed: !props.curColumnConf.fixed,
+      width: props.curColumnConf.width,
+      hide: props.curColumnConf.hide,
+      dateStart: props.curColumnConf.dateStart,
+      dateEnd: props.curColumnConf.dateEnd,
+    })
   }
   closeContextMenuFun()
 }

src/components/layout/list/ColumnHide.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import { inject } from 'vue'
+import * as iconSvg from '../../../assets/icon'
 import { FUN_CLOSE_CONTEXT_MENU_TYPE } from '../../common/Menu.vue'
 import type { CachedColumnConf } from '../../conf'
 import { FUN_MODIFY_COLUMN_TYPE } from '../../events'
-import * as iconSvg from '../../../assets/icon'
 
 const props = defineProps<{
   curColumnConf: CachedColumnConf | undefined
@@ -15,8 +15,15 @@ const closeContextMenuFun = inject(FUN_CLOSE_CONTEXT_MENU_TYPE)!
 
 async function setHidedColumn() {
   if (props.curColumnConf) {
-    props.curColumnConf.hide = !props.curColumnConf.fixed
-    await modifyColumnFun(undefined, props.curColumnConf)
+    await modifyColumnFun(undefined, {
+      name: props.curColumnConf.name,
+      wrap: props.curColumnConf.wrap,
+      fixed: props.curColumnConf.fixed,
+      width: props.curColumnConf.width,
+      hide: !props.curColumnConf.hide,
+      dateStart: props.curColumnConf.dateStart,
+      dateEnd: props.curColumnConf.dateEnd,
+    })
   }
   closeContextMenuFun()
 }

src/components/layout/list/ColumnKindDateTime.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import { inject } from 'vue'
-import type { CachedColumnConf } from '../../conf'
-import { FUN_MODIFY_COLUMN_TYPE } from '../../events'
-import { DataKind } from '../../props'
+import { inject } from 'vue';
+import type { CachedColumnConf } from '../../conf';
+import { FUN_MODIFY_COLUMN_TYPE } from '../../events';
+import { DataKind } from '../../props';
 
 const props = defineProps<{
   curColumnConf: CachedColumnConf | undefined
@@ -12,8 +12,17 @@ const modifyColumnFun = inject(FUN_MODIFY_COLUMN_TYPE)!
 
 async function setDateTimeFormat(newFormat: string) {
   if (props.curColumnConf) {
-    props.curColumnConf.kindDateTimeFormat = newFormat
-    await modifyColumnFun(props.curColumnConf)
+    await modifyColumnFun({
+      name: props.curColumnConf.name,
+      title: props.curColumnConf.title,
+      icon: props.curColumnConf.icon,
+      dataKind: props.curColumnConf.dataKind,
+      dataEditable: props.curColumnConf.dataEditable,
+      useDict: props.curColumnConf.useDict,
+      dictEditable: props.curColumnConf.dictEditable,
+      multiValue: props.curColumnConf.multiValue,
+      kindDateTimeFormat: newFormat,
+    })
   }
 }
 </script>

src/components/layout/list/ColumnMore.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { inject, ref } from 'vue'
+import * as iconSvg from '../../../assets/icon'
 import { getRandomString } from '../../../utils/basic'
 import IconPickerComp from '../../common/IconPicker.vue'
 import MenuComp, { MenuOffsetKind } from '../../common/Menu.vue'
@@ -8,7 +9,6 @@ import { dictEnableByDataKind, getDefaultIconByDataKind, getDefaultLayoutColumnC
 import { FUN_MODIFY_COLUMN_TYPE, FUN_MODIFY_LAYOUT_TYPE, FUN_NEW_COLUMN_TYPE } from '../../events'
 import type { TableLayoutModifyReq } from '../../props'
 import { DataKind, translateDataKind } from '../../props'
-import * as iconSvg from '../../../assets/icon'
 
 const props = defineProps<{
   basicColumnsConf: TableColumnConf[]
@@ -72,8 +72,15 @@ async function submitNewColumn() {
 async function setShowToggleColumn(columnConf: TableColumnConf) {
   const layoutColumnsConf = props.layoutColumnsConf.find(col => col.name === columnConf.name)
   if (layoutColumnsConf) {
-    layoutColumnsConf.hide = !layoutColumnsConf.hide
-    await modifyColumnFun(undefined, layoutColumnsConf)
+    await modifyColumnFun(undefined, {
+      name: layoutColumnsConf.name,
+      wrap: layoutColumnsConf.wrap,
+      fixed: layoutColumnsConf.fixed,
+      width: layoutColumnsConf.width,
+      hide: !layoutColumnsConf.hide,
+      dateStart: layoutColumnsConf.dateStart,
+      dateEnd: layoutColumnsConf.dateEnd,
+    })
   }
   else {
     const changedLayoutReq: TableLayoutModifyReq = {

src/components/layout/list/ColumnRename.vue

@@ -17,8 +17,17 @@ const iconPickerCompRef = ref()
 async function renameColumn(event: Event) {
   const target = event.target as HTMLInputElement
   if (props.curColumnConf) {
-    props.curColumnConf.title = target.value
-    await modifyColumnFun(props.curColumnConf)
+    await modifyColumnFun({
+      name: props.curColumnConf.name,
+      title: target.value,
+      icon: props.curColumnConf.icon,
+      dataKind: props.curColumnConf.dataKind,
+      dataEditable: props.curColumnConf.dataEditable,
+      useDict: props.curColumnConf.useDict,
+      dictEditable: props.curColumnConf.dictEditable,
+      multiValue: props.curColumnConf.multiValue,
+      kindDateTimeFormat: props.curColumnConf.kindDateTimeFormat,
+    })
   }
   closeContextMenuFun()
 }

src/components/layout/list/ColumnResize.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { inject, onMounted } from 'vue'
-import type { CachedColumnConf } from '../../conf'
-import { FUN_MODIFY_COLUMN_TYPE } from '../../events'
+import { inject, onMounted } from 'vue';
+import type { CachedColumnConf } from '../../conf';
+import { FUN_MODIFY_COLUMN_TYPE } from '../../events';
 
 const props = defineProps<{
   columnsConf: CachedColumnConf[]
@@ -40,8 +40,17 @@ onMounted(() => {
     targetEle.releasePointerCapture(event.pointerId)
 
     const curColumnConf = props.columnsConf.find(item => item.name === currColumnName)
-    if (curColumnConf)
-      await modifyColumnFun(undefined, curColumnConf)
+    if (curColumnConf) {
+      await modifyColumnFun(undefined, {
+        name: curColumnConf.name,
+        wrap: curColumnConf.wrap,
+        fixed: curColumnConf.fixed,
+        width: curColumnConf.width,
+        hide: curColumnConf.hide,
+        dateStart: curColumnConf.dateStart,
+        dateEnd: curColumnConf.dateEnd,
+      })
+    }
   })
 
   dragDiv.addEventListener('pointermove', (event) => {

src/components/layout/list/Rows.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed } from 'vue'
-import * as dayjs from 'dayjs'
+import dayjs from 'dayjs'
 import type { CachedColumnConf, TableStyleConf } from '../../conf'
 import RowTreeComp from '../../function/RowTree.vue'
 import { DATA_DICT_POSTFIX, DataKind } from '../../props'