agilebuilder-ui 1.1.13 → 1.1.14

package/packages/super-grid/src/super-grid.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :style="subTableStyle">
+  <div data-v="1.0.0" :style="subTableStyle">
     <search-form
       v-if="!isFormSubTable && hasLoadedColumns && query && query.showType === 'embedded'"
       v-show="!isMobile || (isMobile && isShowMobileSearch)"
@@ -35,10 +35,27 @@
       @close="closeSearchFormDialog"
     />
     <div :class="'grid-area ' + code">
+      <MobileCard
+        v-if="isShowCard"
+        :selection="selectionTableData"
+        :columns="visibleColumns"
+        :listCode="code"
+        :getColumnComponentData="getColumnComponentData"
+        :data="tableDatas"
+        v-model:current-page="currentPage"
+        :page-size="pagination?.pageSizes?.[0]"
+        :page-total="pagination?.total"
+        @select="selectRecord"
+        @selection-change="cardSelectionChangeEvent"
+        @current-change="handleCurrentChange"
+        @row-click="rowClickEvent"
+        @row-dblclick="rowDblclickEvent"
+      />
+      
       <el-table
-        v-if="refreshGrid && hasLoadedColumns"
+        v-if="refreshGrid && hasLoadedColumns && !isShowCard"
         ref="superGrid"
-        :data="hasFilterDataEvent ? filterGridData : gridData"
+        :data="tableDatas"
         :row-key="getRowKeyProp"
         :show-summary="showSummary"
         :summary-method="getSummaries"
@@ -71,70 +88,18 @@
         @cell-dblclick="cellDblClick"
       >
         <row-detail v-if="detailColumn" :column="detailColumn" :list-code="code" @show-detail="openRowForm" />
-        <template v-if="myCustomFormatter">
-          <component
-            :is="getComponentType(column)"
-            v-for="(column, index) in visibleColumns"
-            :ref="column.prop"
-            :key="column.label + index"
-            :column="column"
-            :is-sql="isSql"
-            :list-code="code"
-            :custom-format="
-              getComponentType(column) === 'GroupColumn' ? myCustomFormatter : myCustomFormatter[column.prop]
-            "
-            :new-width="newWidth"
-            :drag-column-prop="dragColumnProp"
-            :right-click-menu-arr="options.rightClickMenuArr"
-            :table-name="tableName"
-            :page-code="pageCode"
-            :list-name="listName"
-            :options="options"
-            :pagination="pagination"
-            :current-page="currentPage"
-            :grid-data="isSubTableShowPage ? subTableData : gridData"
-            :page-grid-data="isSubTableShowPage ? getSubTableGridData(subTableData) : gridData"
-            @refresh-list="refreshList"
-            @open-page="openPageDialog"
-            @refresPortData="refresPortData"
-            @refresPortsData="refresPortsData"
-            @refresMainTableFields="refresMainTableFields"
-            @prohibitToEdit="prohibitToEdit"
-          />
-        </template>
-        <template v-else>
-          <component
-            :is="getComponentType(column)"
-            v-for="(column, index) in visibleColumns"
-            :ref="column.prop"
-            :key="column.label + index"
-            :is-sql="isSql"
-            :column="column"
-            :list-code="code"
-            :is-line-edit="lineEdit !== null && lineEdit.editable"
-            :new-width="newWidth"
-            :drag-column-prop="dragColumnProp"
-            :right-click-menu-arr="options.rightClickMenuArr"
-            :table-name="tableName"
-            :page-code="pageCode"
-            :list-toolbar-form-data="listToolbarFormData"
-            :list-name="listName"
-            :options="options"
-            :current-page="currentPage"
-            :pagination="pagination"
-            :grid-data="isSubTableShowPage ? subTableData : gridData"
-            :page-grid-data="isSubTableShowPage ? getSubTableGridData(subTableData) : gridData"
-            @open-page="openPageDialog"
-            @refresData="refresData"
-            @refresh-list="refreshList"
-            @refresPortData="refresPortData"
-            @refresPortsData="refresPortsData"
-            @refresMainTableFields="refresMainTableFields"
-            @prohibitToEdit="prohibitToEdit"
-          />
-        </template>
+        
+        <component
+          :is="getComponentType(column)"
+          v-for="({column, ...item}, index) in visibleColumnsComponentData"
+          :ref="column.prop"
+          :key="column.label + index"
+          v-bind="item.$bind"
+          v-on="item.$on"
+        />
+
       </el-table>
-      <div v-if="showPagination" style="position: relative; margin-top: 5px">
+      <div v-if="showPagination && !isShowCard" style="position: relative; margin-top: 5px">
         <el-row>
           <!-- <el-col
                   v-if="
@@ -230,7 +195,7 @@
       :page-grid-data="isSubTableShowPage ? getSubTableGridData(subTableData) : gridData"
       :line-edit="lineEdit"
       :show-page="pagination && isShowPage"
-      :page-size="pagination ? pagination.pageSize : null"
+      :page-size="pagination?pagination.pageSize: null"
       @close="closeRowForm"
       @refresData="refresData"
       @refresPortData="refresPortData"
@@ -254,6 +219,7 @@ import ColumnsConfig from './columns-config.vue'
 import SearchForm from './search-form.vue'
 import searchFormDialog from './search-form-dialog.vue'
 import RowDetail from './row-detail.vue'
+import MobileCard from './components/mobile-table-card.jsx'
 import { getEntityFieldValueWithOutCase, setEntityFieldValue } from '../../../src/utils/util'
 import eventBus from './eventBus'
 import {
@@ -282,6 +248,9 @@ import apis from './apis'
 import headerContextMenu from './header-context-menu.vue'
 import { isMobileBrowser, isPromise } from '../../../src/utils/common-util'
 import { checkPermission } from '../../../src/utils/permission'
+import { getGuId } from '../../../src/utils/guid.js';
+// import resizeMixin from '../../../src/mixins/resizeMixin.js';
+import storeVuex from '../../../src/store';
 
 export default {
   components: {
@@ -295,10 +264,17 @@ export default {
     searchFormDialog,
     ElIconSetting,
     ElIconRefresh,
-    RowDetail
+    RowDetail,
+    MobileCard
   },
   name: 'SuperGrid',
+  // mixins: [resizeMixin],
   props: {
+    // 是否自适应卡片
+    isShowAutoCard: {
+      type: Boolean,
+      default: true
+    },
     code: {
       type: String,
       default: ''
@@ -462,7 +438,6 @@ export default {
       isShowPageDialog: false, // 是否显示弹框
       jumpPageSetting: null,
       pageCode,
-      tableHeight: null,
       maxHeight: null,
       pageHeight, // 页面高度
       currentSelectCell: null,
@@ -491,14 +466,24 @@ export default {
       showRowForm: false, // 是否显示行记录详情
       baseURL: null,
       hasFilterDataEvent: false, // 是否是表格过滤
-      restoreCurrentRowTimer: null // 恢复当前行的定时器
+      selectionTableData: [], // 勾选数据
     }
   },
   computed: {
+    isMobileResize() {
+      return storeVuex.getters.isMobileResize
+    },
+    // 是否显示卡片
+    isShowCard() {
+      return this.isShowAutoCard && this.isMobileResize
+    },
     visibleColumns() {
       const gridParams = store.get(this.code)
       const operations = this.getOptionOperations()
       gridParams.canntEdit = false
+
+      const setAttrs = data => data.map(item => ({ property: item.prop, ...item}))
+      
       if (operations && operations.operation && operations.operation.length > 0) {
         operations.operation.forEach((buttonInfo) => {
           if (buttonInfo.props.code === 'lineEditUpdate') {
@@ -513,50 +498,61 @@ export default {
         this.options.isAdministerListView != null &&
         this.options.isAdministerListView === true
       ) {
-        return this.columns
+        return setAttrs(this.columns)
       } else {
-        return this.columns.filter((column) => {
-          if (
-            typeof this.options.multiple !== 'undefined' &&
-            this.options.multiple === false &&
-            column.prop === '$selection'
-          ) {
-            // 表示不显示“多选”列
-            return false
-          }
-          if (
-            typeof this.options.showIndex !== 'undefined' &&
-            this.options.showIndex === false &&
-            column.prop === '$index'
-          ) {
-            // 表示不显示“序号”列
-            return false
-          }
-          let isVisible
-          if (column.show === undefined || column.show) {
-            isVisible = true
-            const hiddenColumns = this.options.hiddenColumns
-            if (hiddenColumns && hiddenColumns.length > 0 && column.prop && hiddenColumns.indexOf(column.prop) !== -1) {
-              // 如果当前字段包含在隐藏字段集合中，则不显示该字段
-              isVisible = false
-              return isVisible
+        return setAttrs(
+          this.columns.filter((column) => {
+            if (
+              typeof this.options.multiple !== 'undefined' &&
+              this.options.multiple === false &&
+              column.prop === '$selection'
+            ) {
+              // 表示不显示“多选”列
+              return false
             }
-            // 给列配置操作属性
-            this.initColumnOperation(column, operations)
-            if (!gridParams.$dataTypeMap) {
-              gridParams.$dataTypeMap = {}
+            if (
+              typeof this.options.showIndex !== 'undefined' &&
+              this.options.showIndex === false &&
+              column.prop === '$index'
+            ) {
+              // 表示不显示“序号”列
+              return false
             }
-            // sql时行编辑保存后台代码需要
-            gridParams.$dataTypeMap[column.prop] = column.dataType
-          } else {
-            isVisible = false
-          }
-          // 存储有默认值的字段集合
-          this.storeHasDefaultValueColumns(column, gridParams)
-          return isVisible
-        })
+            let isVisible
+            if (column.show === undefined || column.show) {
+              isVisible = true
+              const hiddenColumns = this.options.hiddenColumns
+              if (hiddenColumns && hiddenColumns.length > 0 && column.prop && hiddenColumns.indexOf(column.prop) !== -1) {
+                // 如果当前字段包含在隐藏字段集合中，则不显示该字段
+                isVisible = false
+                return isVisible
+              }
+              // 给列配置操作属性
+              this.initColumnOperation(column, operations)
+              if (!gridParams.$dataTypeMap) {
+                gridParams.$dataTypeMap = {}
+              }
+              // sql时行编辑保存后台代码需要
+              gridParams.$dataTypeMap[column.prop] = column.dataType
+            } else {
+              isVisible = false
+            }
+            // 存储有默认值的字段集合
+            this.storeHasDefaultValueColumns(column, gridParams)
+            return isVisible
+          })
+        )
       }
     },
+    visibleColumnsComponentData() {
+      return this.visibleColumns.map(data => this.getColumnComponentData(data, this.myCustomFormatter))
+    },
+    mobileColumns() {
+      return 'Layout' 
+    },
+    tableDatas() {
+      return this.hasFilterDataEvent ? this.filterGridData : this.gridData
+    },
     spanArr() {
       const spanArr = []
       for (const column of this.columns) {
@@ -599,11 +595,33 @@ export default {
     // }
   },
   watch: {
-    mergeFields: {
+    // 切换表格 与 卡片是否
+    'isShowCard': {
       deep: true,
-      handler: function (value) {
-        // debugger
-        console.log('mergeFields', value)
+      handler(is) {
+        // 是否开启卡片，如果开启则平台切换时候重新回到第一页
+        if(this.isShowAutoCard) {
+          if (this.currentPage > 1) {
+            this.currentPage = 1
+            this.handleCurrentChange()
+          } else {
+            this.$nextTick()
+          }
+        }
+        if(!is) {
+          // 显示表格后重新格式化展示
+          this.$nextTick(() => {
+            this.resizeTableHeight()
+            this.$refs.superGrid?.doLayout()
+          })
+        }
+      }
+    },
+    'tableDatas': {
+      deep: true,
+      immediate: true,
+      handler(a, b) {
+        console.log('SGQ --- 表格监听数据修改============================》', a, b)
       }
     },
     'options.SuperGrid': {
@@ -727,6 +745,7 @@ export default {
     return {}
   },
   created() {
+    storeVuex?.dispatch?.('startListeningToResize');
     store.set(this.code, getGridParams())
     store.set('_list_code', this.code)
     this.initSetting()
@@ -882,11 +901,6 @@ export default {
       )
     })
   },
-  beforeDestroy() {
-    if (this.restoreCurrentRowTimer) {
-      clearTimeout(this.restoreCurrentRowTimer)
-    }
-  },
   methods: {
     ...events,
     ...publicMethods,
@@ -1751,11 +1765,24 @@ export default {
           .post(requestUrl, param)
           .then((data) => {
             if (typeof parentRowIds === 'undefined' || parentRowIds === null) {
+              // 当开启卡片的时候，则开启滚动分页
+              const getChildren = (data) => {
+                return data?.map(item => {
+                  return {
+                    $rowDataGuId: getGuId(),
+                    ...item,
+                    ...(item?.children?.length ? {
+                      children: getChildren(item.children)
+                    } : {})
+                  }
+                }) ?? []
+              }
+              const dataList = [...(this.isShowCard && this.currentPage > 1 ? this.gridData : []), ...getChildren(data?.data ?? [])]
               let tableData = []
               // 对数据做序列化，比如：处理xss攻击
               if (isHasOptionFunction('gridDataLoaded', this.code)) {
                 const gridDataLoadedParam = {
-                  gridData: data.data,
+                  gridData: dataList,
                   columns: gridParams.columns,
                   additionalParamMap: gridParams.additionalParamMap,
                   pageContext: this.pageContext,
@@ -1769,10 +1796,10 @@ export default {
                 if (gridData) {
                   tableData = gridData
                 } else {
-                  tableData = data.data
+                  tableData = dataList
                 }
               } else {
-                tableData = data.data
+                tableData = dataList
               }
               if (!tableData) {
                 tableData = []
@@ -1867,18 +1894,20 @@ export default {
               if (typeof resove !== 'undefined' && resove !== null) {
                 // 首次加载或点击三角展开父节点时走该分支
                 // 刷新数据后，移除该父节点下的所有已选中的子节点记录。
-                // 必须调用该方法，否则在删除记录时，数据即使刷新了，已选中集合this.$refs.superGrid.store.states.selection中仍会有该已删除记录，导致再次执行删除报id不存在
+                // 必须调用该方法，否则在删除记录时，数据即使刷新了，已选中集合this.$refs.superGrid?.store.states.selection中仍会有该已删除记录，导致再次执行删除报id不存在
                 this.removeGridStoreSelection(parentRowIds)
                 resove(data[parentRowIds[0]])
               } else {
                 // 刷新父记录对应的子记录集合时需要，例如：删除时
                 parentRowIds.forEach((parentRowId) => {
                   // 单行父记录id
-                  this.$refs.superGrid.store.states.lazyTreeNodeMap[parentRowId] = data[parentRowId]
-                  this.$refs.superGrid.store.states.treeData[parentRowId].children = data[parentRowId]
+                  if (this.$refs.superGrid) {
+                    this.$refs.superGrid.store.states.lazyTreeNodeMap[parentRowId] = data[parentRowId]
+                    this.$refs.superGrid.store.states.treeData[parentRowId].children = data[parentRowId]
+                  }
                 })
                 // 刷新数据后，移除该父节点下的所有已选中的子节点记录
-                // 必须调用该方法，否则在删除记录时，数据即使刷新了，已选中集合this.$refs.superGrid.store.states.selection中仍会有该已删除记录，导致再次执行删除报id不存在
+                // 必须调用该方法，否则在删除记录时，数据即使刷新了，已选中集合this.$refs.superGrid?.store.states.selection中仍会有该已删除记录，导致再次执行删除报id不存在
                 this.removeGridStoreSelection(parentRowIds)
               }
               this.hasLoadData = true
@@ -2178,8 +2207,7 @@ export default {
     },
     getSearchParam() {
       const searchParam = {
-        code: this.code,
-        tableName: this.tableName
+        code: this.code
       }
       const gridParams = store.get(this.code)
       const pagination = this.getPaginationInfo()
@@ -2285,8 +2313,9 @@ export default {
       }
     },
     changePage() {
+      console.log('点击了分页')
       // 翻页操作会导致筛选项发生变化，所以需要清空已有的
-      this.$refs.superGrid.clearFilter()
+      this.$refs.superGrid?.clearFilter()
       // TODO: 把当前页数、每页条数、查询条件、排序信息传回后台
       if (this.isSubTableShowPage) {
         this.gridData = this.getSubTableGridData(this.subTableData)
@@ -2311,7 +2340,7 @@ export default {
           // 如果最后编辑行没有保存或撤销编辑，则给出提示
           const gridParams = store.get(this.code)
           console.log('请先保存或撤销编辑第' + gridParams.$rowIndex + 1 + '行记录，再排序')
-          this.$refs.superGrid.clearSort()
+          this.$refs.superGrid?.clearSort()
         } else {
           // TODO: 应该调用fetchData来获取信息，把当前页数、查询条件、排序信息传回后台
           if (prop !== null && columnSetting && columnSetting !== null) {
@@ -2517,30 +2546,30 @@ export default {
     },
     expandChange(row, expanded) {
       if (this.isLazy) {
-        // console.log('expandChange==row, expanded', row, expanded, this.$refs.superGrid.store.states)
+        // console.log('expandChange==row, expanded', row, expanded, this.$refs.superGrid?.store.states)
         if (expanded === false) {
           // 折叠时清空表格缓存的已加载的标识位，使其能够动态更新子集合
           // 必须添加这句，否则不会重新走load
-          if (this.$refs.superGrid.store.states.treeData) {
+          if (this.$refs.superGrid?.store.states.treeData) {
             this.$refs.superGrid.store.states.treeData[row.id ? row.id : row.ID].loaded = false
           }
         } else {
-          // console.log('expandChange=this.$refs.superGrid.store.states.lazyTreeNodeMap', this.$refs.superGrid.store.states.lazyTreeNodeMap)
-          // console.log('expandChange=this.$refs.superGrid.store.states.treeData', this.$refs.superGrid.store.states.treeData)
-          // console.log('expandChange=this.$refs.superGrid.store.states.selection', this.$refs.superGrid.store.states.selection)
+          // console.log('expandChange=this.$refs.superGrid?.store.states.lazyTreeNodeMap', this.$refs.superGrid?.store.states.lazyTreeNodeMap)
+          // console.log('expandChange=this.$refs.superGrid?.store.states.treeData', this.$refs.superGrid?.store.states.treeData)
+          // console.log('expandChange=this.$refs.superGrid?.store.states.selection', this.$refs.superGrid?.store.states.selection)
         }
       }
     },
     removeGridStoreSelection(parentRowIds) {
       let selection = []
-      if (this.$refs.superGrid.store.states.selection) {
-        selection = [].concat(JSON.parse(JSON.stringify(this.$refs.superGrid.store.states.selection)))
+      if (this.$refs.superGrid?.store.states.selection) {
+        selection = [].concat(JSON.parse(JSON.stringify(this.$refs.superGrid?.store.states.selection)))
       }
       for (let i = 0; i < selection.length; i++) {
         if (parentRowIds && parentRowIds.indexOf(selection[i][this.parentProp]) >= 0) {
           // 移除第i个元素
-          this.$refs.superGrid.store.states.selection.splice(i, 1)
-          if (this.$refs.superGrid.store.states.selection.length > 0) {
+          this.$refs.superGrid?.store.states.selection.splice(i, 1)
+          if (this.$refs.superGrid?.store.states.selection.length > 0) {
             this.removeGridStoreSelection(parentRowIds)
           }
           break
@@ -2623,7 +2652,7 @@ export default {
         this.createBackgroundColorMap()
         this.backgroundColorMap[item.prop] = '#409EFF'
         if (this.$refs && this.$refs.superGrid) {
-          this.$refs.superGrid.doLayout()
+          this.$refs.superGrid?.doLayout()
         }
       }
     },
@@ -2647,7 +2676,7 @@ export default {
       this.backgroundColorMap = backgroundColorMap
       this.externalClickFlag = false
       if (this.$refs && this.$refs.superGrid) {
-        this.$refs.superGrid.doLayout()
+        this.$refs.superGrid?.doLayout()
       }
     },
     // 根据element事件传递的column来获取自定义封装的column
@@ -2753,6 +2782,7 @@ export default {
       return this.isSubTableShowPage ? this.subTableData : this.gridData
     },
     rowDblclickEvent(row, column, event) {
+      debugger;
       const gridParams = store.get(this.code)
       if (gridParams.options && gridParams.options.isFormSubTable && gridParams.options.isPdfEditor) {
         // 如果是子表并且是pdf模式
@@ -2762,6 +2792,7 @@ export default {
           let canEdit = true
           const gridParams = store.get(this.code)
           if (isEditOptionFunction('beforeEdit', this.code)) {
+            debugger;
             const isSubTableShowPage = gridParams.isSubTableShowPage
             // 每页显示多少条
             const pageSize = gridParams.pagination && gridParams.pagination.pageSize
@@ -2792,6 +2823,7 @@ export default {
         }
       } else {
         if (row) {
+          debugger;
           if (gridParams && gridParams.lineEdit && gridParams.lineEdit.editable && gridParams.canntEdit) {
             let index = this.gridData.findIndex(function (item) {
               return (item.id && item.id === row.id) || (item.ID && item.ID === row.ID)
@@ -2806,6 +2838,7 @@ export default {
       this.rowDblClick(row, column, event)
     },
     rowDbClickEditRow(gridParams, row) {
+      console.log('rowDbClickEditRow+++++++++++++++++++', gridParams, row)
       // 取消上一行的编辑状态
       let editRows
       if (this.isSubTableShowPage) {
@@ -2987,6 +3020,7 @@ export default {
      * @param entity 格式如：{'NAME':false,"DYM_COLUMN":true}。表示NAME字段不可编辑，DYM_COLUMN可以被编辑
      */
     prohibitToEdit(entity) {
+      console.log('我执行了 prohibitToEdit=================================》', entity)
       this.fnProhibitToEdit(entity)
     },
     // 树形结构时数据展示
@@ -3027,6 +3061,7 @@ export default {
     },
     // 选择记录
     selectRecord(selection, row) {
+      this.selectionTableData = row
       let selectRecordEventResult = true
       const gridParams = store.get(this.code)
       if (isHasOptionFunction('selectRecord', this.code)) {
@@ -3044,7 +3079,7 @@ export default {
         })
         if (selectRecordEventResult !== undefined && selectRecordEventResult === false) {
           // 最后选中的记录取消选中状态
-          this.$refs.superGrid.toggleRowSelection(row, false)
+          this.$refs.superGrid?.toggleRowSelection(row, false)
         }
       }
       this.select(selection, row)
@@ -3067,13 +3102,26 @@ export default {
         })
         if (selectAllRecordsEventResult !== undefined && selectAllRecordsEventResult === false) {
           // 取消所有记录选中状态
-          this.$refs.superGrid.toggleAllSelection()
+          this.$refs.superGrid?.toggleAllSelection()
         }
       }
       this.selectAll(selection)
     },
+    cardSelectionChangeEvent(newSelection) {
+      try {
+        this.$refs.superGrid?.clearSelection()
+        for(const i in newSelection) {
+          const row = newSelection[i]
+          this.$refs.superGrid?.toggleRowSelection(row, true)
+        }
+      } catch (error) {
+        console.error(error)
+      }
+      this.selectionChangeEvent(newSelection)
+    },
     // 选择记录发生改变时
     selectionChangeEvent(newSelection) {
+      this.selectionTableData = newSelection
       const gridParams = store.get(this.code)
       if (isHasOptionFunction('selectionChange', this.code)) {
         gridParams.options.selectionChange.call(this, {
@@ -3089,7 +3137,7 @@ export default {
         })
         // if(selectionChangeEventResult !== undefined &&  selectionChangeEventResult=== false){
         //   // 最后选中的记录取消选中状态
-        //   this.$refs.superGrid.toggleRowSelection(newSelection[newSelection.length - 1], false)
+        //   this.$refs.superGrid?.toggleRowSelection(newSelection[newSelection.length - 1], false)
         // }
       }
       this.selectionChange(newSelection)
@@ -3189,6 +3237,57 @@ export default {
       } else {
         return prop
       }
+    },
+    getColumnComponentData(column, myCustomFormatter) {
+      try {
+        // if (!['[object Object]'].includes(Object.prototype.toString.call(column))) throw new Error('no column');
+        const componentType = this.getComponentType(column)
+        return {
+          column,
+          getComponentType: this.getComponentType,
+          customFormat: myCustomFormatter,
+          // props + attrs 参数
+          $bind: {
+            column,
+            'ref': column.prop,
+            // 'is': componentType,
+            'is-sql': this.isSql,
+            'list-code': this.code,
+            'new-width': this.newWidth,
+            'drag-column-prop': this.dragColumnProp,
+            'right-click-menu-arr': this.options?.rightClickMenuArr,
+            'table-name': this.tableName,
+            'page-code': this.pageCode,
+            'list-name': this.listName,
+            'options': this.options,
+            'current-page': this.currentPage,
+            'pagination': this.pagination,
+            'grid-data': this.isSubTableShowPage ? this.subTableData : this.gridData,
+            'page-grid-data': this.isSubTableShowPage ? this.getSubTableGridData(this.subTableData) : this.gridData,
+            ...(myCustomFormatter ? {
+              'custom-format': ['GroupColumn'].includes(componentType) ? myCustomFormatter : myCustomFormatter[column.prop],
+            } : {
+              'is-line-edit': this.lineEdit?.editable ?? false,
+              'list-toolbar-form-data': this.listToolbarFormData,
+            }),
+          },
+          // 事件绑定
+          $on: {
+            'open-page': this.openPageDialog,
+            'refresData': this.refresData,
+            'refresh-list': this.refreshList,
+            'refresPortData': this.refresPortData,
+            'refresPortsData': this.refresPortsData,
+            'refresMainTableFields': this.refresMainTableFields,
+            'prohibitToEdit': this.prohibitToEdit,
+          }
+        }
+      } catch (error) {
+        console.error(error)
+        return {
+          column
+        }
+      }
     }
   },
   emits: [
@@ -3216,4 +3315,9 @@ export default {
     padding: 2px 0 !important;
   }
 }
+.el-table ::v-deep {
+  & > .el-table__inner-wrapper {
+    height: 100% !important;
+  }
+}
 </style>

package/packages/super-grid/src/utils.js

@@ -564,7 +564,7 @@ export function getTableHeight(superGrid, listCode, pageHeight) {
   if (superGrid) {
     rect = superGrid.$el.getBoundingClientRect()
   }
-  const totalHeight = window.innerHeight - rect.y - 110
+  const totalHeight = window.innerHeight - (rect?.y ?? 0) - 110
   console.log('rect=', rect, 'window.innerHeight=', window.innerHeight, 'totalHeight=', totalHeight)
   return totalHeight