agilebuilder-ui 1.1.34 → 1.1.35-sit2

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

@@ -35,7 +35,7 @@
       @reset="resetSearch"
       @close="closeSearchFormDialog"
     />
-    <div ref="superGridMain" :class="'grid-area ' + code"  class="super-grid-main-body">
+    <div ref="superGridMain" :class="'grid-area ' + code" class="super-grid-main-body">
       <MobileCard
         v-if="isShowCard"
         :selection="selectionTableData"
@@ -53,7 +53,7 @@
         @row-click="rowClickEvent"
         @row-dblclick="rowDblclickEvent"
       />
-      
+
       <el-table
         v-else-if="refreshGrid && hasLoadedColumns && !isShowCard"
         ref="superGrid"
@@ -91,38 +91,30 @@
         @cell-dblclick="cellDblClick"
       >
         <row-detail v-if="detailColumn" :column="detailColumn" :list-code="code" @show-detail="openRowForm" />
-        
+
         <component
           :is="getComponentType(column)"
-          v-for="({column, ...item}, index) in visibleColumnsComponentData"
+          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 && !isShowCard" class="super-grid-main-table-footer-view">
-        <div class="yx-flex-wrap" style="gap: 10px;">
-
+        <div class="yx-flex-wrap" style="gap: 10px">
           <div
             v-if="basicInfo.customConfig && !isFormSubTable"
             class="el-icon-setting"
             :title="$t('superGrid.columnConfig')"
             @click="configColumns"
           >
-            <el-icon-setting style="width: 16px; height: 16px; color: #777; cursor: pointer;" />
+            <el-icon-setting style="width: 16px; height: 16px; color: #777; cursor: pointer" />
           </div>
 
-          <div
-            v-if="!isFormSubTable"
-            class="el-icon-refresh"
-            :title="$t('superGrid.refresh')"
-            @click="refreshGridData"
-          >
-            <el-icon-refresh style="width: 16px; height: 16px; color: #777; cursor: pointer;" />
+          <div v-if="!isFormSubTable" class="el-icon-refresh" :title="$t('superGrid.refresh')" @click="refreshGridData">
+            <el-icon-refresh style="width: 16px; height: 16px; color: #777; cursor: pointer" />
           </div>
-
         </div>
         <el-pagination
           v-if="pagination && isShowPage"
@@ -178,7 +170,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"
@@ -231,9 +223,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 { getGuId } from '../../../src/utils/guid.js'
 // import resizeMixin from '../../../src/mixins/resizeMixin.js';
-import storeVuex from '../../../src/store';
+import storeVuex from '../../../src/store'
 
 export default {
   components: {
@@ -310,7 +302,7 @@ export default {
     manualHeightOffset: {
       type: [undefined, Number],
       default: undefined
-    },
+    }
   },
   data() {
     let parentProp
@@ -426,7 +418,8 @@ export default {
       isShowPageDialog: false, // 是否显示弹框
       jumpPageSetting: null,
       pageCode,
-      maxHeight: null,
+      maxHeight: undefined,
+      tableHeight: undefined,
       pageHeight, // 页面高度
       currentSelectCell: null,
       isLazy, // 树形结构时是否懒加载，默认是懒加载的
@@ -454,7 +447,7 @@ export default {
       showRowForm: false, // 是否显示行记录详情
       baseURL: null,
       hasFilterDataEvent: false, // 是否是表格过滤
-      selectionTableData: [], // 勾选数据
+      selectionTableData: [] // 勾选数据
     }
   },
   computed: {
@@ -465,7 +458,7 @@ export default {
     // 限制高度最低值
     hasMaxHeight() {
       if (this.maxHeight) {
-        return this.maxHeight <= 100 ? 100 : this.maxHeight + this.heightOffset ?? undefined
+        return this.maxHeight <= 100 ? 100 : this.maxHeight + this.heightOffset
       }
       return undefined
     },
@@ -473,7 +466,7 @@ export default {
     // 是指固定高度最低值
     hasTableHeight() {
       if (this.tableHeight) {
-        return this.tableHeight <= 100 ? 100 : this.tableHeight ?? undefined
+        return this.tableHeight <= 100 ? 100 : this.tableHeight + this.heightOffset
       }
       return undefined
     },
@@ -482,15 +475,20 @@ export default {
     },
     // 是否显示卡片
     isShowCard() {
-      return this.isShowAutoCard && this.isMobileListCard && !this.options.isAdministerListView && (this.options?.configureObj?.props?.base?.isMobileCard ?? true)
+      return (
+        this.isShowAutoCard &&
+        this.isMobileListCard &&
+        !this.options.isAdministerListView &&
+        (this.options?.configureObj?.props?.base?.isMobileCard ?? true)
+      )
     },
     visibleColumns() {
       const gridParams = store.get(this.code)
       const operations = this.getOptionOperations()
       gridParams.canntEdit = false
 
-      const setAttrs = data => data.map(item => ({ property: item.prop, ...item}))
-      
+      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') {
@@ -529,7 +527,12 @@ export default {
             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) {
+              if (
+                hiddenColumns &&
+                hiddenColumns.length > 0 &&
+                column.prop &&
+                hiddenColumns.indexOf(column.prop) !== -1
+              ) {
                 // 如果当前字段包含在隐藏字段集合中，则不显示该字段
                 isVisible = false
                 return isVisible
@@ -552,10 +555,10 @@ export default {
       }
     },
     visibleColumnsComponentData() {
-      return this.visibleColumns.map(data => this.getColumnComponentData(data, this.myCustomFormatter))
+      return this.visibleColumns.map((data) => this.getColumnComponentData(data, this.myCustomFormatter))
     },
     mobileColumns() {
-      return 'Layout' 
+      return 'Layout'
     },
     tableDatas() {
       return this.hasFilterDataEvent ? this.filterGridData : this.gridData
@@ -603,11 +606,11 @@ export default {
   },
   watch: {
     // 切换表格 与 卡片是否
-    'isShowCard': {
+    isShowCard: {
       deep: true,
       handler(is) {
         // 是否开启卡片，如果开启则平台切换时候重新回到第一页
-        if(this.isShowAutoCard) {
+        if (this.isShowAutoCard) {
           if (this.currentPage > 1) {
             this.currentPage = 1
             this.handleCurrentChange()
@@ -615,7 +618,7 @@ export default {
             this.$nextTick()
           }
         }
-        if(!is) {
+        if (!is) {
           // 显示表格后重新格式化展示
           this.$nextTick(() => {
             this.resizeTableHeight()
@@ -624,7 +627,7 @@ export default {
         }
       }
     },
-    'tableDatas': {
+    tableDatas: {
       deep: true,
       immediate: true,
       handler(a, b) {
@@ -697,7 +700,8 @@ export default {
         this.$nextTick(() => {
           if (newVal) {
             // 手动触发新单元格的点击事件
-             newVal.click()
+            // 2025年5月28日 注释newVal.click()，这里会导致行点击事件触发两次，
+            //  newVal.click()
           }
           if (oldVal) {
             // 清空上一个单元格的选中样式
@@ -752,7 +756,7 @@ export default {
     return {}
   },
   created() {
-    storeVuex?.dispatch?.('startListeningToResize');
+    storeVuex?.dispatch?.('startListeningToResize')
     store.set(this.code, getGridParams())
     store.set('_list_code', this.code)
     this.initSetting()
@@ -781,6 +785,7 @@ export default {
       if (gridParams && gridParams.basicInfo && gridParams.basicInfo.name) {
         this.listName = gridParams.basicInfo.name
       }
+      $emit(this, 'grid-onmounted')
       this.$nextTick(() => {
         // 将子表选项组值传递super-pages中，解决到处报告时子表选项组赋值问题
         this.columns.forEach((column) => {
@@ -809,7 +814,7 @@ export default {
             }
           )
         }
-        window.addEventListener('resize', this.resizeTableHeight);
+        window.addEventListener('resize', this.resizeTableHeight)
         this.$watch(
           'hasLoadData',
           function (newVal, oldVal) {
@@ -909,16 +914,16 @@ export default {
     })
   },
   beforeDestroy() {
-    window.removeEventListener('resize', this.resizeTableHeight);
+    window.removeEventListener('resize', this.resizeTableHeight)
   },
   methods: {
     ...events,
     ...publicMethods,
     ...superGridService,
     ...apis,
-		onResize(entry) {
+    onResize(entry) {
       this.resizeTableHeight()
-		},
+    },
     onClickMain() {
       // 清理编辑选中
       storeVuex?.dispatch?.('clearAllEditing')
@@ -950,7 +955,7 @@ export default {
       this.$nextTick(() => {
         let tableHeight = getTableHeight(this.$refs.superGrid, this.code, this.pageHeight)
 
-        let tempMaxHeight = null
+        let tempMaxHeight = undefined
         const gridParams = store.get(this.code)
         if (isHasOptionFunction('resizeHeight', this.code)) {
           let searchHeight = 0
@@ -972,43 +977,65 @@ export default {
         }
         // 设置列表最大高度
         if (gridParams.options && gridParams.options.isFormSubTable && gridParams.options.isPdfEditor) {
-          tempMaxHeight = null
+          tempMaxHeight = undefined
         } else if (gridParams.options && gridParams.options.isFormSubTable && gridParams.options.formSetMaxHeight) {
           tempMaxHeight = gridParams.options.formSetMaxHeight
         }
 
         // 设置列表高度
         if (tempMaxHeight === undefined || tempMaxHeight === null) {
-          tempMaxHeight = tableHeight
           if (this.optionTableHeight) {
             tempMaxHeight = this.optionTableHeight
           } else if (gridParams.options && gridParams.options.isFormSubTable && gridParams.options.isPdfEditor) {
-            tempMaxHeight = null
+            tempMaxHeight = undefined
           } else if (gridParams.options && gridParams.options.isFormSubTable && gridParams.options.formSetHeight) {
             tempMaxHeight = gridParams.options.formSetHeight
+          } else {
+            tempMaxHeight = tableHeight
+          }
+        }
+        if(tempMaxHeight === null){
+          // 高度是null会导致页面卡死
+          tempMaxHeight = undefined
+        }
+        if(tempMaxHeight !== null && tempMaxHeight !== undefined && parseFloat(tempMaxHeight+'') < 100){
+          // 如果小于100时，高度给100
+          tempMaxHeight = 100
+        }
+        if(tempMaxHeight !== null && tempMaxHeight !== undefined){
+          // 用parseFloat是因为tempMaxHeight的值有时是数字字符串
+          tempMaxHeight = parseFloat(tempMaxHeight+'')
+        }        
+        if(gridParams.options && gridParams.options.isFormSubTable){
+          // 表示表单页面子表时,不解析 显示效果了，直接使用高度就行了
+          if (
+            !this.basicInfo.displayEffect ||
+            this.basicInfo.displayEffect === '' ||
+            this.basicInfo.displayEffect === 'default'
+          ) {
+            // default默认不铺满
+            this.maxHeight = tempMaxHeight
+            this.tableHeight = undefined
+          } else {
+            // 表示需要cover铺满
+            this.tableHeight = tempMaxHeight
+            this.maxHeight = undefined
           }
-          //  else if (
-          //   !this.basicInfo.displayEffect ||
-          //   this.basicInfo.displayEffect === '' ||
-          //   this.basicInfo.displayEffect === 'default'
-          // ) {
-          //   tempMaxHeight = null
-          // }
-          // if(tempHeight !== undefined && tempHeight !== null){
-          //   // el-table的height和maxHeight不能同时设值，会导致列表渲染失败，报脚本错.设置height不起作用,都使用maxHeight控制列表高度吧,暂时不知道原因
-          // this.tableHeight = tempHeight
-          // }
-        }
-        if (
-          !this.basicInfo.displayEffect ||
-          this.basicInfo.displayEffect === '' ||
-          this.basicInfo.displayEffect === 'default'
-        ) {
-          // default默认不铺满
-          this.maxHeight = tempMaxHeight
         } else {
-          // 表示需要cover铺满
-          this.tableHeight = tempMaxHeight
+          // 不是表单页面子表，默认铺满
+          if (
+            !this.basicInfo.displayEffect ||
+            this.basicInfo.displayEffect === '' ||
+            this.basicInfo.displayEffect === 'cover'
+          ) {
+            // 表示需要cover铺满
+            this.tableHeight = tempMaxHeight
+            this.maxHeight = undefined
+          } else {
+            // default默认不铺满
+            this.maxHeight = tempMaxHeight
+            this.tableHeight = undefined
+          }
         }
         console.log(
           'resizeTableHeight-----tempMaxHeight=',
@@ -1789,17 +1816,24 @@ export default {
             if (typeof parentRowIds === 'undefined' || parentRowIds === null) {
               // 当开启卡片的时候，则开启滚动分页
               const getChildren = (data) => {
-                return data?.map(item => {
-                  return {
-                    $rowDataGuId: getGuId(),
-                    ...item,
-                    ...(item?.children?.length ? {
-                      children: getChildren(item.children)
-                    } : {})
-                  }
-                }) ?? []
+                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 ?? [])]
+              const dataList = [
+                ...(this.isShowCard && this.currentPage > 1 ? this.gridData : []),
+                ...getChildren(data?.data ?? [])
+              ]
               let tableData = []
               // 对数据做序列化，比如：处理xss攻击
               if (isHasOptionFunction('gridDataLoaded', this.code)) {
@@ -2805,7 +2839,7 @@ export default {
       return this.isSubTableShowPage ? this.subTableData : this.gridData
     },
     rowDblclickEvent(row, column, event) {
-      debugger;
+      debugger
       const gridParams = store.get(this.code)
       if (gridParams.options && gridParams.options.isFormSubTable && gridParams.options.isPdfEditor) {
         // 如果是子表并且是pdf模式
@@ -2846,7 +2880,7 @@ export default {
         }
       } else {
         if (row) {
-          debugger;
+          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)
@@ -3133,7 +3167,7 @@ export default {
     cardSelectionChangeEvent(newSelection) {
       try {
         this.$refs.superGrid?.clearSelection()
-        for(const i in newSelection) {
+        for (const i in newSelection) {
           const row = newSelection[i]
           this.$refs.superGrid?.toggleRowSelection(row, true)
         }
@@ -3272,7 +3306,7 @@ export default {
           // props + attrs 参数
           $bind: {
             column,
-            'ref': column.prop,
+            ref: column.prop,
             // 'is': componentType,
             'is-sql': this.isSql,
             'list-code': this.code,
@@ -3282,28 +3316,32 @@ export default {
             'table-name': this.tableName,
             'page-code': this.pageCode,
             'list-name': this.listName,
-            'options': this.options,
+            options: this.options,
             'current-page': this.currentPage,
-            'pagination': this.pagination,
-            'is-data-children': this.tableDatas.some(d => Array.isArray(d?.children)),
+            pagination: this.pagination,
+            'is-data-children': this.tableDatas.some((d) => Array.isArray(d?.children)),
             '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,
-            }),
+            ...(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,
+            refresData: this.refresData,
             'refresh-list': this.refreshList,
-            'refresPortData': this.refresPortData,
-            'refresPortsData': this.refresPortsData,
-            'refresMainTableFields': this.refresMainTableFields,
-            'prohibitToEdit': this.prohibitToEdit,
+            refresPortData: this.refresPortData,
+            refresPortsData: this.refresPortsData,
+            refresMainTableFields: this.refresMainTableFields,
+            prohibitToEdit: this.prohibitToEdit
           }
         }
       } catch (error) {
@@ -3313,7 +3351,7 @@ export default {
         }
       }
     },
-    changeOperationAddState(state){
+    changeOperationAddState(state) {
       eventBus.$emit('change-add-state', state)
     }
   },
@@ -3349,7 +3387,6 @@ export default {
   }
 }
 
-
 .flex-gap-15 {
   display: flex;
   gap: var(--layout-form-flex-gap, 15px);
@@ -3428,7 +3465,9 @@ export default {
           }
 
           & > .el-form-item__content {
-            & > .el-select,& > .el-input, & > .el-textarea {
+            & > .el-select,
+            & > .el-input,
+            & > .el-textarea {
               width: calc(100% - 1px);
             }
           }
@@ -3482,7 +3521,6 @@ export default {
       flex-grow: 1;
       flex-shrink: 1;
       flex-basis: auto;
-      height: auto !important;
     }
 
     .super-grid-main-card-view {

package/packages/super-icon/src/index.vue

@@ -1,31 +1,48 @@
 <template>
   <i v-if="iconValue.indexOf('amb-icon-') === 0" class="amb-iconfont" :class="iconValue" />
-  <i v-else-if="iconValue.indexOf('fa-') === 0" :class="'fa '+iconValue" />
-  <img v-else-if="iconValue.indexOf('svg-') === 0" :src="defaultShowImageAction+iconValue.substring(iconValue.indexOf('-')+1)" style="width: 1em; height: 1em;"/>
-  <img v-else-if="iconValue.indexOf('http') === 0 || iconValue.indexOf('//') === 0 || iconValue.indexOf('data:') === 0" :src="iconValue" style="width: 1em; height: 1em;"/>
-  <el-icon v-else><component :is="iconValue" /></el-icon> 
+  <i v-else-if="iconValue.indexOf('amb-color-icon-') === 0" class="amb-color-iconfont super-icon" :class="iconValue" />
+  <i v-else-if="iconValue.indexOf('fa-') === 0" :class="'fa ' + iconValue" />
+  <img
+    v-else-if="iconValue.indexOf('svg-img-') === 0"
+    :src="defaultShowImageAction + iconValue.substring('svg-img-'.length)"
+    style="width: 1em; height: 1em"
+  />
+  <SvgIcon v-else-if="iconValue.indexOf('svg-') === 0" :icon-class="iconValue.substring('svg-'.length)" />
+  <img
+    v-else-if="iconValue.indexOf('http') === 0 || iconValue.indexOf('//') === 0 || iconValue.indexOf('data:') === 0"
+    :src="iconValue"
+    style="width: 1em; height: 1em"
+  />
+  <el-icon v-else><component :is="iconValue" /></el-icon>
 </template>
-<script  lang="ts">
+<script lang="ts">
 export default {
   name: 'SuperIcon'
 }
 </script>
 
-<script  setup lang="ts">
+<script setup lang="ts">
 import { ref } from 'vue'
+import SvgIcon from '../../svg-icon/src/svg-icon.vue'
 const props = defineProps({
   // 值为：ElementUI、custom
-    iconType: {
-      type: String,
-      default: 'custom'
-    },
-    iconValue: {
-      type: String,
-      required: true,
-      default: '',
-    }
+  iconType: {
+    type: String,
+    default: 'custom'
+  },
+  iconValue: {
+    type: String,
+    required: true,
+    default: ''
+  }
 })
-const defaultShowImageAction = ref(window.$vueApp.config.globalProperties.baseAPI + '/component/super-form/show-image?serverPath=')
-
+const defaultShowImageAction = ref(
+  window.$vueApp.config.globalProperties.baseAPI + '/component/super-form/show-image?serverPath='
+)
 </script>
-
+<style lang="scss" scoped>
+.super-icon {
+ width: 14px;
+ height: 14px;
+}
+</style>