vue2-client 1.14.62 → 1.14.64

package/src/base-client/components/common/XTable/CustomFuncCel.vue

@@ -1,51 +1,51 @@
-<script>
-import { Ellipsis } from '@vue2-client/components'
-import { executeStrFunctionByContext } from '@vue2-client/utils/runEvalFunction'
-import { getConfigByNameAsync, runLogic } from '@vue2-client/services/api/common'
-
-export default {
-  name: 'CustomFuncCel',
-  methods: {
-    runLogic,
-    async fetchSlotValue () {
-      try {
-        let func = this.item.slotCustomFunction
-        if (this.item.slotCustomFunction.startsWith('function')) {
-          func = `async ${func}`
-        }
-        this.slotValueResult = await executeStrFunctionByContext(this, func, [this.text, this.record, this.localDataSource, this.index, runLogic, getConfigByNameAsync])
-        this.loading = false
-      } catch (error) {
-        console.error('Error fetching slot value:', error)
-      }
-    }
-  },
-  mounted () {
-    this.fetchSlotValue()
-  },
-  data: () => {
-    return {
-      slotValueResult: '',
-      loading: true
-    }
-  },
-  components: { Ellipsis },
-  // eslint-disable-next-line
-  props: ['item', 'text', 'record', 'index', 'localDataSource'],
-}
-</script>
-
-<template>
-  <span>
-    <template v-if="item.slotValue">
-      <ellipsis :length="item.slotValue" tooltip>{{ loading ? text : slotValueResult }}</ellipsis>
-    </template>
-    <template v-else>
-      {{ loading ? text : slotValueResult }}
-    </template>
-  </span>
-</template>
-
-<style scoped lang="less">
-
-</style>
+<script>
+import { Ellipsis } from '@vue2-client/components'
+import { executeStrFunctionByContext } from '@vue2-client/utils/runEvalFunction'
+import { getConfigByNameAsync, runLogic } from '@vue2-client/services/api/common'
+
+export default {
+  name: 'CustomFuncCel',
+  methods: {
+    runLogic,
+    async fetchSlotValue () {
+      try {
+        let func = this.item.slotCustomFunction
+        if (this.item.slotCustomFunction.startsWith('function')) {
+          func = `async ${func}`
+        }
+        this.slotValueResult = await executeStrFunctionByContext(this, func, [this.text, this.record, this.localDataSource, this.index, runLogic, getConfigByNameAsync])
+        this.loading = false
+      } catch (error) {
+        console.error('Error fetching slot value:', error)
+      }
+    }
+  },
+  mounted () {
+    this.fetchSlotValue()
+  },
+  data: () => {
+    return {
+      slotValueResult: '',
+      loading: true
+    }
+  },
+  components: { Ellipsis },
+  // eslint-disable-next-line
+  props: ['item', 'text', 'record', 'index', 'localDataSource'],
+}
+</script>
+
+<template>
+  <span>
+    <template v-if="item.slotValue">
+      <ellipsis :length="item.slotValue" tooltip>{{ loading ? text : slotValueResult }}</ellipsis>
+    </template>
+    <template v-else>
+      {{ loading ? text : slotValueResult }}
+    </template>
+  </span>
+</template>
+
+<style scoped lang="less">
+
+</style>

package/src/base-client/components/common/XTable/TableCellRenderer.vue

@@ -1,161 +1,161 @@
-<template>
-  <x-form-item
-    v-if="isEditMode && getFromItem(item.dataIndex)"
-    class="innerTable"
-    :form="record"
-    :attr="getFromItem(item.dataIndex)"
-    :service-name="serviceName"
-    mode="新增/修改"
-    :env="env"
-    :showLabel="false"
-  />
-  <!-- 序号列 -->
-  <span v-else-if="item.slotType === 'index'">
-    {{ index + 1 }}
-  </span>
-  <!-- 行链接 -->
-  <span v-else-if="item.slotType === 'link'">
-    <a @click="columnClick(item.dataIndex, text, record)">{{ text }}</a>
-  </span>
-  <!-- 文本溢出省略 -->
-  <span v-else-if="item.slotType === 'ellipsis'">
-    <ellipsis :length="item.slotValue" tooltip>{{ text === '' ? '--' : text }}</ellipsis>
-  </span>
-  <!-- 徽标 -->
-  <span v-else-if="item.slotType === 'badge'">
-    <x-badge
-      :service-name="serviceName"
-      :env="env"
-      v-if="text !== null && text !== undefined"
-      :badge-key="item.slotKeyMap"
-      :value="text"
-    />
-  </span>
-  <!-- 日期 -->
-  <span v-else-if="item.slotType === 'date'">
-    {{ format(text, 'yyyy-MM-dd') }}
-  </span>
-  <!-- 日期时间 -->
-  <span v-else-if="item.slotType === 'dateTime'">
-    {{ format(text, 'yyyy-MM-dd hh:mm:ss') }}
-  </span>
-  <!-- 两位小数 -->
-  <span v-else-if="item.slotType === 'towDecimal'">
-    {{ numberFormat(text, 2) }}
-  </span>
-  <!-- 四位小数 -->
-  <span v-else-if="item.slotType === 'fourDecimal'">
-    {{ numberFormat(text, 4) }}
-  </span>
-  <!-- 整数 -->
-  <span v-else-if="item.slotType === 'int'">
-    {{ numberFormat(text, 0) }}
-  </span>
-  <!-- 操作列 -->
-  <span v-else-if="item.slotType === 'action'">
-    <template v-if="item.actionArr && item.actionArr.length > 0">
-      <a-dropdown>
-        <a class="ant-dropdown-link" @click="e => e.preventDefault()">
-          {{ item.scopedSlots?.customRender || item.slotValue }} <a-icon type="down"/>
-        </a>
-        <a-menu slot="overlay" style="min-width: 60px">
-          <a-menu-item
-            v-for="(action_item, actionIndex) in item.actionArr"
-            :key="actionIndex"
-            v-if="!action_item.customFunction || executeStrFunction(action_item.customFunction, [record, c_index])"
-          >
-            <a style="text-align: center" @click="action(record, item.dataIndex, action_item.func)">
-              {{ action_item.text }}
-            </a>
-          </a-menu-item>
-        </a-menu>
-      </a-dropdown>
-    </template>
-    <template v-if="!item.actionArr || item.actionArr.length === 0">
-      <a @click="action(record, item.dataIndex)">{{ item.slotValue }}</a>
-    </template>
-  </span>
-</template>
-<!--表格列组件抽取失败 暂时没用到这个组件-->
-<script>
-import XFormItem from '@vue2-client/base-client/components/common/XForm/XFormItem.vue'
-import Ellipsis from '@vue2-client/components/Ellipsis/Ellipsis.vue'
-import XBadge from '@vue2-client/base-client/components/common/XBadge/XBadge.vue'
-import { executeStrFunction } from '@vue2-client/utils/runEvalFunction'
-import { formatDate } from '@vue2-client/utils/util'
-
-export default {
-  components: { XBadge, Ellipsis, XFormItem },
-  props: {
-    item: {
-      type: Object,
-      required: true,
-    },
-    record: {
-      type: Object,
-      required: true,
-    },
-    index: {
-      type: Number,
-      required: true,
-    },
-    text: {
-      type: String,
-      required: true,
-    },
-    serviceName: {
-      type: String,
-      default: undefined
-    },
-    env: {
-      type: String,
-      default: undefined
-    },
-    isEditMode: {
-      type: Boolean,
-      default: false
-    },
-    formItems: {
-      type: Array,
-      required: true,
-    },
-  },
-  methods: {
-    executeStrFunction,
-    getFromItem (model) {
-      const aa = this.formItems.find(item => item.model === model && item.editRow)
-      if (aa) {
-        return JSON.parse(JSON.stringify(aa))
-      }
-      return false
-    },
-    columnClick () {
-      this.$emit('columnClick', ...arguments)
-    },
-    action () {
-      this.$emit('action', ...arguments)
-    },
-    /**
-     * 格式化日期
-     * @param date 日期字符串
-     * @param format 格式化方式
-     */
-    format (date, format) {
-      return formatDate(date, format)
-    },
-    /**
-     * 格式化数字
-     * @param number string 或者 number
-     * @param decimalPlaces 小数位数
-     */
-    numberFormat (number, decimalPlaces = 2) {
-      const value = parseFloat(number)
-      if (!isNaN(value)) {
-        return value.toFixed(decimalPlaces)
-      } else {
-        return ''
-      }
-    },
-  },
-}
-</script>
+<template>
+  <x-form-item
+    v-if="isEditMode && getFromItem(item.dataIndex)"
+    class="innerTable"
+    :form="record"
+    :attr="getFromItem(item.dataIndex)"
+    :service-name="serviceName"
+    mode="新增/修改"
+    :env="env"
+    :showLabel="false"
+  />
+  <!-- 序号列 -->
+  <span v-else-if="item.slotType === 'index'">
+    {{ index + 1 }}
+  </span>
+  <!-- 行链接 -->
+  <span v-else-if="item.slotType === 'link'">
+    <a @click="columnClick(item.dataIndex, text, record)">{{ text }}</a>
+  </span>
+  <!-- 文本溢出省略 -->
+  <span v-else-if="item.slotType === 'ellipsis'">
+    <ellipsis :length="item.slotValue" tooltip>{{ text === '' ? '--' : text }}</ellipsis>
+  </span>
+  <!-- 徽标 -->
+  <span v-else-if="item.slotType === 'badge'">
+    <x-badge
+      :service-name="serviceName"
+      :env="env"
+      v-if="text !== null && text !== undefined"
+      :badge-key="item.slotKeyMap"
+      :value="text"
+    />
+  </span>
+  <!-- 日期 -->
+  <span v-else-if="item.slotType === 'date'">
+    {{ format(text, 'yyyy-MM-dd') }}
+  </span>
+  <!-- 日期时间 -->
+  <span v-else-if="item.slotType === 'dateTime'">
+    {{ format(text, 'yyyy-MM-dd hh:mm:ss') }}
+  </span>
+  <!-- 两位小数 -->
+  <span v-else-if="item.slotType === 'towDecimal'">
+    {{ numberFormat(text, 2) }}
+  </span>
+  <!-- 四位小数 -->
+  <span v-else-if="item.slotType === 'fourDecimal'">
+    {{ numberFormat(text, 4) }}
+  </span>
+  <!-- 整数 -->
+  <span v-else-if="item.slotType === 'int'">
+    {{ numberFormat(text, 0) }}
+  </span>
+  <!-- 操作列 -->
+  <span v-else-if="item.slotType === 'action'">
+    <template v-if="item.actionArr && item.actionArr.length > 0">
+      <a-dropdown>
+        <a class="ant-dropdown-link" @click="e => e.preventDefault()">
+          {{ item.scopedSlots?.customRender || item.slotValue }} <a-icon type="down"/>
+        </a>
+        <a-menu slot="overlay" style="min-width: 60px">
+          <a-menu-item
+            v-for="(action_item, actionIndex) in item.actionArr"
+            :key="actionIndex"
+            v-if="!action_item.customFunction || executeStrFunction(action_item.customFunction, [record, c_index])"
+          >
+            <a style="text-align: center" @click="action(record, item.dataIndex, action_item.func)">
+              {{ action_item.text }}
+            </a>
+          </a-menu-item>
+        </a-menu>
+      </a-dropdown>
+    </template>
+    <template v-if="!item.actionArr || item.actionArr.length === 0">
+      <a @click="action(record, item.dataIndex)">{{ item.slotValue }}</a>
+    </template>
+  </span>
+</template>
+<!--表格列组件抽取失败 暂时没用到这个组件-->
+<script>
+import XFormItem from '@vue2-client/base-client/components/common/XForm/XFormItem.vue'
+import Ellipsis from '@vue2-client/components/Ellipsis/Ellipsis.vue'
+import XBadge from '@vue2-client/base-client/components/common/XBadge/XBadge.vue'
+import { executeStrFunction } from '@vue2-client/utils/runEvalFunction'
+import { formatDate } from '@vue2-client/utils/util'
+
+export default {
+  components: { XBadge, Ellipsis, XFormItem },
+  props: {
+    item: {
+      type: Object,
+      required: true,
+    },
+    record: {
+      type: Object,
+      required: true,
+    },
+    index: {
+      type: Number,
+      required: true,
+    },
+    text: {
+      type: String,
+      required: true,
+    },
+    serviceName: {
+      type: String,
+      default: undefined
+    },
+    env: {
+      type: String,
+      default: undefined
+    },
+    isEditMode: {
+      type: Boolean,
+      default: false
+    },
+    formItems: {
+      type: Array,
+      required: true,
+    },
+  },
+  methods: {
+    executeStrFunction,
+    getFromItem (model) {
+      const aa = this.formItems.find(item => item.model === model && item.editRow)
+      if (aa) {
+        return JSON.parse(JSON.stringify(aa))
+      }
+      return false
+    },
+    columnClick () {
+      this.$emit('columnClick', ...arguments)
+    },
+    action () {
+      this.$emit('action', ...arguments)
+    },
+    /**
+     * 格式化日期
+     * @param date 日期字符串
+     * @param format 格式化方式
+     */
+    format (date, format) {
+      return formatDate(date, format)
+    },
+    /**
+     * 格式化数字
+     * @param number string 或者 number
+     * @param decimalPlaces 小数位数
+     */
+    numberFormat (number, decimalPlaces = 2) {
+      const value = parseFloat(number)
+      if (!isNaN(value)) {
+        return value.toFixed(decimalPlaces)
+      } else {
+        return ''
+      }
+    },
+  },
+}
+</script>

package/src/base-client/components/common/XTable/XTable.vue

@@ -916,16 +916,18 @@ export default {
         result = query(Object.assign(requestParameters, { userId: this.currUser?.id }), this.serviceName, this.env === 'dev')
         result.then(res => {
           this.totalCount = res.totalCount || 0
+
           // 在数据加载完成后，立即检查并更新选中状态
           if (this.selectRowMode !== 'disabled' && !this.clearSelectRowAfterQuery) {
+            const primaryKeyName = this.primaryKey || this.rowKey
             // 找出当前页中应该被选中的行
             const currentPageSelectedRows = res.data.filter(row =>
-              this.selectedRowKeys.includes(row[this.primaryKey || this.rowKey])
+              this.selectedRowKeys.includes(row[primaryKeyName])
             )
             // 更新表格的选中状态
             this.$nextTick(() => {
               // 更新内部选中状态
-              this.innerSelectedRowKeys = currentPageSelectedRows.map(row => row[this.primaryKey || this.rowKey])
+              this.innerSelectedRowKeys = currentPageSelectedRows.map(row => row[primaryKeyName])
               this.innerSelectedRows = currentPageSelectedRows
               // 更新表格显示
               this.$refs.table.updateSelect(this.innerSelectedRowKeys, this.innerSelectedRows)
@@ -934,23 +936,28 @@ export default {
                 // 保留不在当前页面的已选中行
                 const otherPageSelectedRows = this.selectedRows.filter(row =>
                   !currentPageSelectedRows.some(currentRow =>
-                    currentRow[this.primaryKey || this.rowKey] === row[this.primaryKey || this.rowKey]
+                    currentRow[primaryKeyName] === row[primaryKeyName]
                   )
                 )
                 // 合并当前页面和其他页面的选中行
-                this.selectedRows = [...otherPageSelectedRows, ...currentPageSelectedRows]
+                const rowsMap = new Map()
+                // 先添加其他页面的行
+                otherPageSelectedRows.forEach(row => {
+                  rowsMap.set(row[primaryKeyName], row)
+                })
+                // 再添加当前页面的行（会覆盖重复的）
+                currentPageSelectedRows.forEach(row => {
+                  rowsMap.set(row[primaryKeyName], row)
+                })
+                this.selectedRows = Array.from(rowsMap.values())
               }
+              // 触发选择事件
               this.$emit('selectRow', this.selectedRowKeys, this.selectedRows)
             })
           }
         })
       }
 
-      if (this.selectRowMode === 'listView' && !this.clearSelectRowAfterQuery) {
-        this.$refs.table.updateSelect(this.selectedRowKeys, this.selectedRows)
-      } else if (this.isTableMode && !this.simpleMode) {
-        this.clearRowKeys()
-      }
       this.$emit('afterQuery', result, requestParameters.conditionParams)
       return result
     },
@@ -976,13 +983,15 @@ export default {
      * @param nativeEvent 原生事件
      */
     onSelect (record, selected, selectedRows, nativeEvent) {
+      console.log('onSelect', record, selected, selectedRows)
       if (this.selectRowMode === 'listView') {
+        const primaryKeyName = this.primaryKey || this.rowKey
         // 获取主键数据
-        const primaryData = record[this.primaryKey]
+        const primaryData = record[primaryKeyName]
         // 取消勾选时
         if (!selected) {
           this.selectedRowKeys = this.selectedRowKeys.filter(item => item !== primaryData)
-          this.selectedRows = this.selectedRows.filter(item => item[this.primaryKey] !== primaryData)
+          this.selectedRows = this.selectedRows.filter(item => item[primaryKeyName] !== primaryData)
         }
       }
     },
@@ -996,10 +1005,11 @@ export default {
       console.log('onSelectAll', selected, selectedRows, changeRows)
       if (this.selectRowMode === 'listView') {
         if (!selected) {
+          const primaryKeyName = this.primaryKey || this.rowKey
           // 获取所有改变的key
-          const changeKeys = changeRows.map(item => item[this.primaryKey])
+          const changeKeys = changeRows.map(item => item[primaryKeyName])
           this.selectedRowKeys = this.selectedRowKeys.filter(item => !changeKeys.includes(item))
-          this.selectedRows = this.selectedRows.filter(item => !changeKeys.includes(item[this.primaryKey]))
+          this.selectedRows = this.selectedRows.filter(item => !changeKeys.includes(item[primaryKeyName]))
         }
       }
     },
@@ -1009,42 +1019,34 @@ export default {
      * @param currentPageSelectedRows 被选择的列集合
      */
     onSelectChange (currentPageSelectedKeys, currentPageSelectedRows) {
-      console.log('currentPageSelectedKeys', currentPageSelectedKeys)
-      // 这里的 currentPageSelectedKeys 和 currentPageSelectedRows 是当前页选中状态改变后的数据
       if (this.selectRowMode === 'listView' && !this.clearSelectRowAfterQuery) {
-        if (this.primaryKey) {
-          const primaryKeyName = this.primaryKey || this.rowKey
+        const primaryKeyName = this.primaryKey || this.rowKey
+        if (primaryKeyName) {
           // 获取当前页面所有行的key
           const currentPageAllKeys = this.$refs.table.localDataSource.map(row => row[primaryKeyName])
-          // 找出当前页新选中的 keys (之前未选中但现在选中了)
-          const newlySelectedKeysOnPage = currentPageSelectedKeys.filter(key => !this.selectedRowKeys.includes(key))
-          // 找出当前页被取消选中的 keys (之前选中但现在未选中了)
-          const deselectedKeysOnPage = this.selectedRowKeys.filter(key => currentPageAllKeys.includes(key) && !currentPageSelectedKeys.includes(key))
-          // 更新总的 selectedRowKeys: 移除被取消选中的，添加新选中的
-          this.selectedRowKeys = this.selectedRowKeys.filter(key => !deselectedKeysOnPage.includes(key))
-          this.selectedRowKeys = [...this.selectedRowKeys, ...newlySelectedKeysOnPage]
-          // 更新总的 selectedRows: 移除被取消选中的行对象，添加新选中的行对象
-          // 从当前页数据源中找到被取消选中的行对象
-          const deselectedRowsOnPage = this.$refs.table.localDataSource.filter(row => deselectedKeysOnPage.includes(row[primaryKeyName]))
-          // 移除被取消选中的行对象
-          const selectedRowsWithoutDeselected = this.selectedRows.filter(row => !deselectedRowsOnPage.some(deselectedRow => deselectedRow[primaryKeyName] === row[primaryKeyName]))
-          // 从当前页数据源中找到新选中的行对象
-          const newlySelectedRowsOnPage = this.$refs.table.localDataSource.filter(row => newlySelectedKeysOnPage.includes(row[primaryKeyName]))
-          // 添加新选中的行对象 (需要去重，以防其他页面已包含此行)
-          const finalSelectedRows = [...selectedRowsWithoutDeselected]
-           const finalSelectedRowKeysMap = new Map()
-           for (const row of finalSelectedRows) {
-               finalSelectedRowKeysMap.set(row[primaryKeyName], true)
-           }
-
-          for (const row of newlySelectedRowsOnPage) {
-            const key = row[primaryKeyName]
-            if (!finalSelectedRowKeysMap.has(key)) {
-               finalSelectedRowKeysMap.set(key, true)
-               finalSelectedRows.push(row)
-            }
-          }
-          this.selectedRows = finalSelectedRows
+          // 1. 保留不在当前页的已选中keys，并去重
+          const otherPageSelectedKeys = [...new Set(this.selectedRowKeys.filter(key => !currentPageAllKeys.includes(key)))]
+          console.log('其他页的keys', otherPageSelectedKeys)
+          // 2. 添加当前页新选中的keys，并去重
+          this.selectedRowKeys = [...new Set([...otherPageSelectedKeys, ...currentPageSelectedKeys])]
+          console.log('onSelectChange - updated selectedRowKeys:', this.selectedRowKeys)
+          // 更新总的 selectedRows
+          // 1. 保留不在当前页的已选中行，并去重
+          const otherPageSelectedRows = this.selectedRows.filter(row =>
+            !currentPageAllKeys.includes(row[primaryKeyName])
+          )
+          // 2. 合并结果，使用 Map 去重
+          const rowsMap = new Map()
+          // 先添加其他页面的行
+          otherPageSelectedRows.forEach(row => {
+            rowsMap.set(row[primaryKeyName], row)
+          })
+          // 再添加当前页面的行（会覆盖重复的）
+          currentPageSelectedRows.forEach(row => {
+            rowsMap.set(row[primaryKeyName], row)
+          })
+          this.selectedRows = Array.from(rowsMap.values())
+          console.log('onSelectChange - updated selectedRows:', this.selectedRows)
         } else {
           // 如果没有主键，则直接使用当前选中的行（此情况可能无法跨页选中，但为了兼容保留）
           this.selectedRowKeys = currentPageSelectedKeys
@@ -1056,9 +1058,10 @@ export default {
         this.selectedRows = currentPageSelectedRows
       }
 
-      // 更新内部状态和表格显示 (即使在 listView 模式下，内部状态也需要同步以更新表格显示)
+      // 更新内部状态和表格显示
       this.innerSelectedRowKeys = currentPageSelectedKeys
       this.innerSelectedRows = currentPageSelectedRows
+
       // 确保在DOM更新后调用 updateSelect，以正确反映当前页的选中状态
       this.$nextTick(() => {
         this.$refs.table.updateSelect(this.innerSelectedRowKeys, this.innerSelectedRows)
@@ -1476,23 +1479,29 @@ export default {
 
     // 实际执行更新选中状态的方法
     doUpdateTableSelection (selectedKeys) {
+      const primaryKeyName = this.primaryKey || this.rowKey
+
       // 更新内部选中状态
       this.selectedRowKeys = [...selectedKeys]
-      this.innerSelectedRowKeys = [...selectedKeys]
-      // 根据 selectedRowKeys 找到对应的行数据
+      this.innerSelectedRowKeys = this.$refs.table.localDataSource
+        .filter(row => selectedKeys.includes(row[primaryKeyName]))
+        .map(row => row[primaryKeyName])
+
+      // 更新选中行数据
       this.selectedRows = this.$refs.table.localDataSource.filter(row =>
-        selectedKeys.includes(row[this.primaryKey || this.rowKey])
+        selectedKeys.includes(row[primaryKeyName])
       )
+      this.innerSelectedRows = this.selectedRows
+
       // 更新表格选中状态
       if (this.selectRowMode !== 'disabled' && !this.clearSelectRowAfterQuery) {
-        this.$refs.table.updateSelect(this.selectedRowKeys, this.selectedRows)
-      } else if (this.isTableMode && !this.simpleMode) {
-        this.clearRowKeys()
+        this.$refs.table.updateSelect(this.innerSelectedRowKeys, this.innerSelectedRows)
       }
+
       // 更新按钮状态
-      this.isModify = this.innerSelectedRowKeys.length === 1
-      this.isDelete = this.innerSelectedRowKeys.length > 0
-      this.isChoose = this.allowSelectRowNum === 0 ? this.innerSelectedRowKeys.length > 0 : this.innerSelectedRowKeys.length === this.allowSelectRowNum
+      this.isModify = this.selectedRowKeys.length === 1
+      this.isDelete = this.selectedRowKeys.length > 0
+      this.isChoose = this.allowSelectRowNum === 0 ? this.selectedRowKeys.length > 0 : this.selectedRowKeys.length === this.allowSelectRowNum
 
       // 触发选择事件
       this.$emit('selectRow', this.selectedRowKeys, this.selectedRows)