agilebuilder-ui 1.1.33 → 1.1.35-sit1

package/packages/super-grid/src/normal-column-content.vue

@@ -35,9 +35,21 @@
       @open-page="openPageEvent"
     />
     <div v-else class="column-text-main">
-      <div v-if="lineEdit.editable && (options?.configureObj?.props?.base?.columnEditable ?? false) && isEditable && !isHideEdit && !isContentViewText" class="column-text-edit-main" @click="onEditing">
+      <div
+        v-if="
+          lineEdit.editable &&
+          (options?.configureObj?.props?.base?.columnEditable ?? false) &&
+          isEditable &&
+          !isHideEdit &&
+          !isContentViewText
+        "
+        class="column-text-edit-main"
+        @click="onEditing"
+      >
         <el-icon :size="14" color="#409eff"><Edit /></el-icon>
-        <span v-if="[undefined, null, ''].includes(row[column.prop])" table-column-placeholder>{{ $t('superGrid.editablePlaceholder') }}</span>
+        <span v-if="[undefined, null, ''].includes(row[column.prop])" table-column-placeholder>{{
+          $t('superGrid.editablePlaceholder')
+        }}</span>
       </div>
       <span v-if="column.operations" class="grid-operation-buttons" data-v="20250527">
         <span
@@ -64,29 +76,27 @@
                     :command="beforeHandleCommand(buttonChild.props.code, row, rowIndex)"
                     :disabled="preventReclick"
                   >
-                    {{
-                      $escapeHtml(buttonChild.props.label)
-                    }}
+                    {{ $escapeHtml(buttonChild.props.label) }}
                   </el-dropdown-item>
                 </span>
               </el-dropdown-menu>
             </template>
           </el-dropdown>
           <component
-              :is="operation.props.customControl"
-              v-else-if="operation.props.customControl"
-              v-permission="operation.props.permission"
-              :key="column.prop+'_'+rowIndex+'_'+currentPage"
-              :disabled="true"
-              :row="pageGridData[rowIndex]"
-              :entity="pageGridData[rowIndex]"
-              :prop="column.prop"
-              :parent="parentFormData"
-              :row-index="rowIndex"
-              :grid-data="gridData"
-              :page-grid-data="pageGridData"
-              :current-page="currentPage"
-              @refresh-list="refreshList"
+            :is="operation.props.customControl"
+            v-else-if="operation.props.customControl"
+            v-permission="operation.props.permission"
+            :key="column.prop + '_' + rowIndex + '_' + currentPage"
+            :disabled="true"
+            :row="pageGridData[rowIndex]"
+            :entity="pageGridData[rowIndex]"
+            :prop="column.prop"
+            :parent="parentFormData"
+            :row-index="rowIndex"
+            :grid-data="gridData"
+            :page-grid-data="pageGridData"
+            :current-page="currentPage"
+            @refresh-list="refreshList"
           />
           <row-operation
             v-else
@@ -96,6 +106,7 @@
             :is-show="operation.isShow"
             :label="operation.props.label ? operation.props.label : row[column.prop]"
             :on-click="operation.onClick"
+            :operation="operation"
             :operation-index="operationIndex"
             :operation-setting="operation.props"
             :row-index="rowIndex"
@@ -185,9 +196,9 @@
         <span v-if="column.formatter && column.formatter.type === 'files'" type="primary">
           <span
             :id="column.prop + 'DomData' + rowIndex"
-            :style="isShowForm ? {} : { width: cellWidth + 'px' }"
+            :style="textOverflow === 'newline' ? {} : { width: cellWidth + 'px' }"
             :title="isShowOverflowTooltip ? $escapeHtml(getLabel(row)) : ''"
-            :class="isShowForm ? '' : 'ellipsis cell--span'"
+            :class="textOverflow === 'newline' ? 'wrap-text' : 'ellipsis cell--span'"
           >
             <FsPreview
               :entity="row"
@@ -220,9 +231,9 @@
           <span
             v-if="isShowOverflowTooltip"
             :id="column.prop + 'DomData' + rowIndex"
-            :style="isShowForm ? {} : { width: cellWidth + 'px' }"
+            :style="textOverflow === 'newline' ? {} : { width: cellWidth + 'px' }"
             :title="getMyHyperLinkSetting(row, rowIndex).title"
-            :class="isShowForm ? '' : 'ellipsis cell--span'"
+            :class="textOverflow === 'newline' ? 'wrap-text' : 'ellipsis cell--span'"
             >{{ getMyHyperLinkSetting(row, rowIndex).label }}
             <el-icon v-if="getMyHyperLinkSetting(row, rowIndex).icon">
               <component :is="(getMyHyperLinkSetting(row), rowIndex.icon)" />
@@ -238,9 +249,9 @@
         <span
           v-else-if="isShowOverflowTooltip"
           :id="column.prop + 'DomData' + rowIndex"
-          :style="isShowForm ? {} : { width: cellWidth + 'px' }"
+          :style="textOverflow === 'newline' ? {} : { width: cellWidth + 'px' }"
           :title="$escapeHtml(getLabel(row))"
-          :class="isShowForm ? '' : 'ellipsis cell--span'"
+          :class="textOverflow === 'newline' ? 'wrap-text' : 'ellipsis cell--span'"
           >{{ $escapeHtml(getLabel(row, rowIndex)) }}</span
         >
         <span v-else :id="column.prop + 'DomData' + rowIndex" :class="isShowForm ? '' : 'cell--span'">{{
@@ -252,9 +263,9 @@
           <span
             v-if="isShowOverflowTooltip"
             :id="column.prop + 'DomData' + rowIndex"
-            :style="isShowForm ? {} : { width: cellWidth + 'px' }"
+            :style="textOverflow === 'newline' ? {} : { width: cellWidth + 'px' }"
             :title="$escapeHtml(getLabel(row))"
-            :class="isShowForm ? '' : 'ellipsis cell--span'"
+            :class="textOverflow === 'newline' ? 'wrap-text' : 'ellipsis cell--span'"
           >
             <FsPreview
               :entity="row"
@@ -275,9 +286,9 @@
         <span v-else-if="column.formatter && column.formatter.type === 'files'">
           <span
             :id="column.prop + 'DomData' + rowIndex"
-            :style="isShowForm ? {} : { width: cellWidth + 'px' }"
+            :style="textOverflow === 'newline' ? {} : { width: cellWidth + 'px' }"
             :title="isShowOverflowTooltip ? $escapeHtml(getLabel(row)) : ''"
-            :class="isShowForm ? '' : 'ellipsis cell--span'"
+            :class="textOverflow === 'newline' ? 'wrap-text' : 'ellipsis cell--span'"
           >
             <FsPreview
               :entity="row"
@@ -301,9 +312,9 @@
           <span
             v-if="isShowOverflowTooltip"
             :id="column.prop + 'DomData' + rowIndex"
-            :style="isShowForm ? {} : { width: cellWidth + 'px' }"
+            :style="textOverflow === 'newline' ? {} : { width: cellWidth + 'px' }"
             :title="$escapeHtml(getMyHyperLinkSetting(row, rowIndex).title)"
-            :class="isShowForm ? '' : 'ellipsis cell--span'"
+            :class="textOverflow === 'newline' ? 'wrap-text' : 'ellipsis cell--span'"
             >{{ $escapeHtml(getMyHyperLinkSetting(row, rowIndex).label) }}
             <el-icon v-if="getMyHyperLinkSetting(row, rowIndex).icon">
               <component :is="getMyHyperLinkSetting(row, rowIndex).icon" />
@@ -334,10 +345,9 @@
         <span
           v-else-if="isShowOverflowTooltip"
           :id="column.prop + 'DomData' + rowIndex"
-          :style="isShowForm ? {} : { width: cellWidth + 'px' }"
+          :style="textOverflow === 'newline' ? {} : { width: cellWidth + 'px' }"
           :title="getLabel(row)"
-          :class="isShowForm ? '' : 'ellipsis cell--span'"
-          style="white-space: pre"
+          :class="textOverflow === 'newline' ? 'wrap-text' : 'ellipsis cell--span'"
           v-html="$escapeHtml(getLabel(row, rowIndex))"
         />
         <span v-else :id="column.prop + 'DomData' + rowIndex" :class="isShowForm ? '' : 'cell--span'">{{
@@ -367,7 +377,8 @@ import {
   isRequiredEdit,
   getAdditionalParamMap,
   getContentAlign,
-  getHeaderAlign
+  getHeaderAlign,
+  isEditOptionFunction
 } from './utils'
 import DynamicInput from './dynamic-input.vue'
 import store from './store'
@@ -383,7 +394,9 @@ import FsPreview from '../../fs-preview'
 import RichEditorViewer from '../../rich-editor/viewer.vue'
 import GridIcon from './components/grid-icon.vue'
 import { formatScanRuleSets } from './scan-util.ts'
-import storeVuex from '../../../src/store';
+import storeVuex from '../../../src/store'
+import { isPromise } from '../../../src/utils/common-util'
+import { ElMessage } from 'element-plus'
 
 export default {
   components: {
@@ -493,6 +506,13 @@ export default {
     if (gridParams.lineEdit !== null && gridParams.lineEdit !== undefined) {
       lineEdit = gridParams.lineEdit
     }
+    let textOverflow = 'hidden'
+    if (gridParams.basicInfo && gridParams.basicInfo.textOverflow) {
+      textOverflow = gridParams.basicInfo.textOverflow
+    }
+    if (this.isShowForm) {
+      textOverflow = 'newline'
+    }
     return {
       selectRow: null,
       that: this,
@@ -524,7 +544,8 @@ export default {
       rowLinkConfigMapping: {},
       requiredClass: '',
       lineEdit,
-      options
+      options,
+      textOverflow
     }
   },
   computed: {
@@ -544,6 +565,10 @@ export default {
     // 手动触发编辑状态
     isEditing() {
       try {
+        // 是否符合编辑条件
+        if (!this.validateEditConditions()) {
+          return false
+        }
         // 没权限
         if (!this.hasEditPermission) return
         // 检测到单选修改模式
@@ -556,7 +581,7 @@ export default {
             return true
           }
         }
-        return this.row.$editing;
+        return this.row.$editing
       } catch (error) {
         return false
       }
@@ -585,7 +610,7 @@ export default {
     'row.$editing': {
       deep: true,
       handler(newValue) {
-        if([false].includes(newValue)) {
+        if ([false].includes(newValue)) {
           this.clearAllEditing()
         }
       }
@@ -779,8 +804,14 @@ export default {
       }
     },
     // 手动编辑触发
-    onEditing(event) {
+    async onEditing(event) {
       if (this.hasEditPermission && !this.isEditing) {
+        let canEdit = true
+        // 触发编辑前事件
+        if (isEditOptionFunction('beforeEdit', this.listCode)) {
+          canEdit = await this.triggerCustomEvent('beforeEdit')
+        }
+        if (!canEdit) return
         event.stopPropagation()
 
         const onEditing = () => {
@@ -792,13 +823,13 @@ export default {
           setTimeout(this.focusBottomInput, 400)
         }
 
-        if(!this.isFormSubTable) {
+        if (!this.isFormSubTable) {
           // 非子表
           if (storeVuex.getters.isConfigEditing) {
             if (storeVuex.getters.isRowEditing(this.$rowGuId)) {
               onEditing()
             } else {
-              const isNext =  this.isLastEditRowSaveMessage(this.listCode)
+              const isNext = this.isLastEditRowSaveMessage(this.listCode)
               if (!isNext) return
             }
             // else {
@@ -806,10 +837,10 @@ export default {
             //   // this.confirmBeforeSwitchingRow(this.listCode, () => { })
             // }
           } else {
-            const isNext =  this.isLastEditRowSaveMessage(this.listCode)
+            const isNext = this.isLastEditRowSaveMessage(this.listCode)
             if (!isNext) return
             // 如果不是子表 则 开启 编辑模式
-            this.editRow(this.rowIndex, this.listCode, true)
+            this.editRow(this.rowIndex, this.listCode, true, true)
             onEditing()
           }
         } else {
@@ -825,26 +856,27 @@ export default {
       this.$nextTick(() => {
         try {
           const getOffsetParent = (selectorAll) => {
-            return selectorAll ? Array.from(this.$refs.dynamicRef.$el.querySelectorAll(selectorAll)).filter(control => !!control.offsetParent) : [];
+            return selectorAll
+              ? Array.from(this.$refs.dynamicRef.$el.querySelectorAll(selectorAll)).filter(
+                  (control) => !!control.offsetParent
+                )
+              : []
           }
 
-          let visibleFormControls = getOffsetParent('.el-select, .el-date-picker, .el-upload');
+          let visibleFormControls = getOffsetParent('.el-select, .el-date-picker, .el-upload')
           if (visibleFormControls.length) {
             visibleFormControls[0].click()
           } else {
-            visibleFormControls = getOffsetParent('input, textarea');
+            visibleFormControls = getOffsetParent('input, textarea')
             if (visibleFormControls.length > 0) {
               const bottomControl = visibleFormControls.reduce((prev, current) => {
-                return current.getBoundingClientRect().bottom > prev.getBoundingClientRect().bottom
-                  ? current
-                  : prev;
-              });
+                return current.getBoundingClientRect().bottom > prev.getBoundingClientRect().bottom ? current : prev
+              })
               if (['INPUT', 'TEXTAREA'].includes(bottomControl.tagName)) {
-                bottomControl.focus();
-                bottomControl.select();
+                bottomControl.focus()
+                bottomControl.select()
               }
             }
-
           }
         } catch (error) {
           console.error(error)
@@ -1115,7 +1147,14 @@ export default {
       }
     },
     isRequired(editing) {
-      if (!this.isFormSubTable && this.lineEdit && this.lineEdit.editable && this.isEditable && editing && this.column.validations) {
+      if (
+        !this.isFormSubTable &&
+        this.lineEdit &&
+        this.lineEdit.editable &&
+        this.isEditable &&
+        editing &&
+        this.column.validations
+      ) {
         if (this.column.validations.indexOf('"required":true') > 0) {
           return true
         }
@@ -1170,11 +1209,65 @@ export default {
       }
     },
     changeRequired(required) {
-      this.requiredClass = required? 'm-requried' : ''
+      this.requiredClass = required ? 'm-requried' : ''
     },
     openPageEvent(openPageParams) {
       console.log('normalColumnContent----openPageEvent----', openPageParams)
       this.$emit('open-page', openPageParams)
+    },
+    triggerCustomEvent(type) {
+      return new Promise((resolve) => {
+        const gridParams = store.get(this.listCode)
+        const isSubTableShowPage = gridParams.isSubTableShowPage
+        // 每页显示多少条
+        const pageSize = gridParams.pagination && gridParams.pagination.pageSize
+        let canEdit = gridParams.options.lineEditOptions[type].call(this, {
+          gridData: isSubTableShowPage ? gridParams.subTableData : gridParams.gridData,
+          listCode: this.listCode,
+          entity: gridParams.gridData[this.rowIndex],
+          row: gridParams.gridData[this.rowIndex],
+          rowIndex: this.rowIndex,
+          columns: gridParams.columns,
+          isMobile: false,
+          pageGridData: isSubTableShowPage ? gridParams.gridData : null,
+          pageSize,
+          additionalParamMap: getAdditionalParamMap(gridParams),
+          pageContext: gridParams.pageContext,
+          configureObj: gridParams.configureObj
+        })
+        if (isPromise(canEdit)) {
+          canEdit.then((result) => {
+            if (result === undefined || result === true) {
+              resolve(true)
+            } else {
+              resolve(false)
+            }
+          })
+        } else {
+          if (canEdit === undefined || canEdit === true) {
+            resolve(true)
+          }
+          resolve(false)
+        }
+      })
+    },
+    validateEditConditions() {
+      if (this.controlConfig && this.controlConfig.editConditions?.length > 0) {
+        const gridParams = store.get(this.listCode)
+        const options = gridParams.options
+        // 非流程表单时才验证编辑条件
+        if (!options.isWorkflowEntity && options.validateEitConditions) {
+          const canEdit = options.validateEitConditions({
+            row: this.row,
+            editConditions: this.controlConfig.editConditions,
+            listCode: this.listCode
+          })
+          if (!canEdit) {
+            return false
+          }
+        }
+      }
+      return true
     }
   },
   emits: ['refresData', 'refresPortData', 'refresPortsData', 'refresMainTableFields', 'prohibitToEdit']

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

@@ -1,10 +1,10 @@
 <template>
   <!--将@click改为@mousedown.native是因为操作列保存按钮时事件和input等组件的@blur冲突，导致保存需要保存两次，因为
       @blur先于@click执行的，所以只会执行@blur，@click就失效了，@mousedown是先于@blur执行的-->
-  <span :style="myStyle">
+  <span class="table-operation-row-btn" :style="myStyle">
     <template v-if="isShowButton()">
       <el-tooltip :disabled="tooltipDisabled" :content="label" placement="top">
-        <template v-if="operationSettingData.permission">
+        <template v-if="operationSettingData?.permission">
           <component
             v-bind="operationSettingData"
             :is="isElementType"
@@ -77,9 +77,13 @@ export default {
       type: String,
       default: null,
     },
+    operation: {
+      type: Object,
+      default: () => ({}),
+    },
     operationSetting: {
       type: Object,
-      default: null,
+      default: () => ({}),
     },
     operationIndex: {
       type: Number,
@@ -104,45 +108,58 @@ export default {
     ...mapGetters(['preventReclick']),
     // 是否是保存按钮
     isSaveRow() {
-      return /^\s*function\s+saveRow*\s*\(/.test((this.onClick ?? ''))
+      return ['lineEditSave', 'saveRow'].includes(this.operation?.eventName)
+      // return /^\s*function\s+saveRow*\s*\(/.test((this.onClick ?? ''))
     },
     // 是否是删除按钮
     isDeleteRow() {
-      return /^\s*function\s+deleteRow*\s*\(/.test((this.onClick ?? ''))
+      return ['lineEditDelete', 'deleteRow'].includes(this.operation?.eventName)
+      // return /^\s*function\s+deleteRow*\s*\(/.test((this.onClick ?? ''))
     },
     // 是否是修改按钮
     isEditRow() {
-      return /^\s*function\s+editRow*\s*\(/.test((this.onClick ?? ''))
+      return ['lineEditUpdate', 'editRow'].includes(this.operation?.eventName)
+      // return /^\s*function\s+editRow*\s*\(/.test((this.onClick ?? ''))
     },
     // 是否是取消按钮
     isRestoreRow() {
-      return /^\s*function\s+restoreRow*\s*\(/.test((this.onClick ?? ''))
+      return ['restoreEdit', 'restoreRow'].includes(this.operation?.eventName)
+      // return /^\s*function\s+restoreRow*\s*\(/.test((this.onClick ?? ''))
     },
     // 前置图标
     prefixIcon() {
       if (this.suffixIcon) return undefined
-      if(['left', true].includes(this.operationSettingData.iconPosition) || this.operationSetting.iconValue) return this.operationSetting.iconValue
+      if(['left', true, ''].includes(this.operationSettingData.iconPosition) || this.operationSetting.iconValue) {
+        if(this.operationSetting.iconValue){
+          // 兼容非彩色图标默认按钮样式
+          if(this.isSaveRow && this.operationSetting.iconValue === 'amb-icon-save') return 'amb-color-icon-save'
+          if(this.isDeleteRow && this.operationSetting.iconValue === 'amb-icon-del') return 'amb-color-icon-del'
+          if(this.isEditRow && this.operationSetting.iconValue === 'amb-icon-edit') return 'amb-color-icon-edit'
+          if(this.isRestoreRow && this.operationSetting.iconValue === 'amb-icon-no-edit') return 'amb-color-icon-no-edit'
+        }
+        return this.operationSetting.iconValue
+      } 
       if (this.isTextIcon) {
         // 当没有初始图标，根据事件类型 绑定图标
-        if(this.isSaveRow) return 'amb-icon-save'
-        if(this.isDeleteRow) return 'amb-icon-del'
-        if(this.isEditRow) return 'amb-icon-edit'
-        if(this.isRestoreRow) return 'amb-icon-no-edit'
+        if(this.isSaveRow) return 'amb-color-icon-save'
+        if(this.isDeleteRow) return 'amb-color-icon-del'
+        if(this.isEditRow) return 'amb-color-icon-edit'
+        if(this.isRestoreRow) return 'amb-color-icon-no-edit'
       }
       return undefined
     },
     // 后置图标
     suffixIcon() {
-      if(['right'].includes(this.operationSettingData.iconPosition)) return this.operationSetting.iconValue
+      if(['right'].includes(this.operationSetting.iconPosition)) return this.operationSetting.iconValue
       return undefined
     },
     // 是否显示文字按钮 > 图标模式
     isTextIcon() {
       if (this.isTableBtnLinkShow) {
-        if (this.operationSettingData.isTextIcon === undefined) {
+        if (this.operationSetting.isTextIcon === undefined) {
           return this.isSaveRow || this.isDeleteRow || this.isEditRow || this.isRestoreRow
         }
-        return this.operationSettingData.isTextIcon
+        return this.operationSetting.isTextIcon
       } else {
         return false
       }
@@ -157,14 +174,14 @@ export default {
     },
     // 是否自动开启表格 按钮 转 文字按钮
     isTableBtnLinkShow() {
-      if (this.operationSetting.text) return true
+      if (this.operationSetting?.text) return true
       if (this.isTableBtnLink && this.elementType === 'el-button') {
-        return [this.operationSetting.text, this.operationSetting.plain, this.operationSetting.round].every(v => v === undefined)
+        return [this.operationSetting?.text, this.operationSetting?.plain, this.operationSetting?.round].every(v => v === undefined)
       }
       return false
     },
     operationSettingData() {
-      const dataList = { ...this.operationSetting }
+      const dataList = { ...(this.operationSetting ?? {}) }
       if (this.isTableBtnLinkShow) {
         dataList.underline = false
         delete dataList.text