修改CURD操作列，增加按钮

src/window1/tabGridView/GridBody.vue

@@ -64,7 +64,21 @@
       :key="'TabGridField_' + gridFieldItem.fieldName + '_' + index"
     >
       <td v-if="!modelData.editMode" v-show="gridFieldItem.visible" @click="clickRecord">
-        <div>
+        <div v-if="gridFieldItem.displayType === 'GridButtonEditor'">
+          <template
+            v-for="tabGridButtonItem in gridFieldItem.tabGridButtonDtos" :key="tabGridButtonItem.name"
+          >
+            <a-button v-if="tabGridButtonItem.action === 'CREATE' || tabGridButtonItem.action === 'SAVE' || tabGridButtonItem.action === 'RUN' || tabGridButtonItem.action === 'EXPORT' || tabGridButtonItem.action === 'NOTICE' || tabGridButtonItem.action === 'REFRESH'" type="link" @click="buttonClick">{{ tabGridButtonItem.name }}</a-button>
+            <a-button v-if="tabGridButtonItem.action === 'DELETE'" type="link" danger @click="deleteRecord">{{ tabGridButtonItem.name }}</a-button>
+            <a-button v-if="tabGridButtonItem.action === 'EDIT'" type="link" @click="editRecord">{{ tabGridButtonItem.name }}</a-button>           
+            <a-button v-if="tabGridButtonItem.action === 'SEE'" type="link" @click="readRecord">{{ tabGridButtonItem.name }}</a-button>
+            <a-button v-if="tabGridButtonItem.action === 'RUN_PROCESS_REPORT'" type="link" @click="execute(tabGridButtonItem)">{{ tabGridButtonItem.name }}</a-button>
+            <a-button v-if="tabGridButtonItem.action === 'OPEN_CUSTOMER_WINDOW'" type="link" @click="execute(tabGridButtonItem)">{{ tabGridButtonItem.name }}</a-button>
+            <a-button v-if="tabGridButtonItem.action === 'OPEN_HTML_WINDOW'" type="link" @click="execute(tabGridButtonItem)">{{ tabGridButtonItem.name }}</a-button>
+            <a-button v-if="tabGridButtonItem.action === 'OPEN_REMOTE_COMPONENT_MODULE_IN_MODAL'" type="link" @click="openRemoteComponentModule(tabGridButtonItem)">{{ tabGridButtonItem.name }}</a-button>
+          </template>          
+        </div>
+        <div v-else>
           <CellTextItem
             :grid-field-item="gridFieldItem" :model-data="modelData" :class-name="className"
             @execute-callout="executeCallout(gridFieldItem)"
@@ -74,7 +88,7 @@
       <td
         v-else v-show="gridFieldItem.visible"
         :class="{ 'table-cell-searchwidget': fieldUtil.isSearchType(gridFieldItem) }" @click="clickRecord"
-      >
+      >        
         <CellItem
           :ref="'cellItem' + index" :scroll-object="scrollObject" :field-item="gridFieldItem"
           :model-data="modelData" :parent-model-data="parentModelData" :class-name="className" :window-no="windowNo"
@@ -84,20 +98,27 @@
       </td>
     </template>
   </tr>
+  <component :is="modal1Component" v-model:open="modal1Open" />
 </template>
 
 <script>
-
+import {
+  ref,
+  defineAsyncComponent,
+} from 'vue';
 import WindowClientUtil from '../../resource/dictionary/WindowClientUtil.js';
 import FieldUtil from '../../resource/dictionary/FieldUtil.js';
 import CellItem from './CellItem.vue';
 import CellTextItem from './CellTextItem.vue';
 import Common from '../../common/Common.js';
-
+import CustomerWindowResource from '../../api/dic/CustomerWindowResource.js';
+import HtmlWindowResource from '../../api/dic/HtmlWindowResource.js';
+import ProcessReportResource from '../../api/dic/ProcessReportResource.js';
 import Context from '../common/Context.js';
 import JsUtil from '../../common/JsUtil.js';
 import Language from '../../common/Language.js';
-import { Notify, Uuid } from 'pc-component-v3';
+import { Notify, Uuid , CssUtil} from 'pc-component-v3';
+import { Spin as ASpin, Empty as AEmpty } from 'ant-design-vue';
 export default {
 
   components: {
@@ -160,7 +181,7 @@ export default {
     jsUrl: {
       type: String,
       default: null,
-    },
+    },    
   },
   emits: ['deleteRecord', 'editRecord', 'readRecord', 'clickModelData', 'executeCallout', 'valueChanged'],
 
@@ -171,6 +192,8 @@ export default {
       lastClickTime: 0,
       fieldUtil: FieldUtil,
       Language: Language,
+      modal1Open: false,
+      modal1Component: null,
     };
   },
   computed: {
@@ -304,6 +327,15 @@ export default {
       this.$emit('deleteRecord');
     },
 
+    buttonClick: function(){
+      Notify.error('提示', '暂不支持该组件', false);
+    },
+
+    closeModal: function(){
+      var _self = this;
+      _self.modal1Open.value = false;
+    },
+
     // 改变表格行元素的编辑状态
     editRecord: function () {
       this.$emit('editRecord');
@@ -397,6 +429,229 @@ export default {
     executeCallout: function (gridFieldItem) {
       this.$emit('executeCallout', gridFieldItem);
     },
+    //跳转或执行流程
+    execute: function (tabButton) {
+      var _self = this;
+      if (tabButton.customerWindowNo != undefined && tabButton.customerWindowNo != '') {
+        CustomerWindowResource.uniqueByNo(tabButton.customerWindowNo).then(
+          successData => {
+            tabButton.customerWindowRouteUrl = successData.routeUrl;
+            if(tabButton.customerWindowNo == '20221101_151823'){
+              localStorage.setItem('AssetInstance_ComplexFilterParams',JSON.stringify(_self.complexFilterParams));
+              localStorage.setItem('AssetInstance_SimpleFilterParams', _self.simpleFilterParams);
+            }
+            //跳转到tabButton.routeUrl
+            _self.switchFormRoute(tabButton);
+          },
+          errorData => {
+            Common.processException(errorData);
+          },
+        );
+      } else if (
+        tabButton.processReportNo != undefined &&
+        tabButton.processReportNo != ''
+      ) {
+        // 判断流程报表是否有参数
+        // 如果有参数则直接跳转到流程和报表的界面。
+        if (tabButton.routerRedirect == undefined || tabButton.routerRedirect == false) {
+          _self.executeProcess(tabButton);
+        } else {
+          this.$router.push({
+            path: '/desktop/process-report/' + tabButton.processReportNo,
+          });
+        }
+      } else if (tabButton.htmlWindowNo != undefined) {
+        HtmlWindowResource.uniqueByNo(tabButton.htmlWindowNo).then(
+          htmlWindowDto => {
+            if (htmlWindowDto != undefined) {
+              var htmlWindowUrl = htmlWindowDto.htmlFileName;
+              var autoCloseInterval = htmlWindowDto.autoCloseInterval;
+              var regExp = new RegExp('[{].*?[}]', 'g');
+              var result = htmlWindowUrl.match(regExp);
+              if (htmlWindowUrl != undefined && htmlWindowUrl != '') {
+                for (var index = 0, len = result.length; index < len; index++) {
+                  var tempResult = result[index];
+                  console.log('{' + tempResult + '}匹配');
+                  if (tempResult == '{URL}') {
+                    htmlWindowUrl = htmlWindowUrl.replace(
+                      '{URL}',
+                      Common.getHostPageBaseURL(),
+                    );
+                  } else if (tempResult == '{RecordIds}') {
+                    var recordId = _self.modelData.id;
+                    htmlWindowUrl = htmlWindowUrl.replace('{RecordIds}', recordId);
+                  } else if (tempResult == '{Token}') {
+                    htmlWindowUrl = htmlWindowUrl.replace('{Token}', Common.getToken());
+                  } else {
+                    if (_self.selectedModelDatas.length == 0) {
+                      Notify.error(_self.$t('lang.Notify.error'), _self.$t('lang.tabButton.describe3'), true);
+                      return;
+                    } else if (_self.selectedModelDatas.length > 1) {
+                      Notify.error(_self.$t('lang.Notify.error'), _self.$t('lang.tabButton.describe2'), true);
+                      return;
+                    }
+                    var tempResult1 = tempResult.replace('{', '').replace('}', '');
+                    htmlWindowUrl = htmlWindowUrl.replace(
+                      tempResult,
+                      _self.getFirstSelectModelDataFieldValue(tempResult1),
+                    );
+                  }
+                }
+
+                var openWindow = window.open(htmlWindowUrl);
+
+                // 自动关闭
+                if (autoCloseInterval != undefined) {
+                  setTimeout(function () {
+                    openWindow.close();
+                    openWindow = undefined;
+                  }, autoCloseInterval * 1000);
+                }
+              }
+            }
+          },
+          errorData => {
+            Common.processException(errorData);
+          },
+        );
+      }
+    },
+    // 切换到Form表单的路由
+    switchFormRoute: function (tabButton) {
+      const _self = this;
+      var routeDate = {
+        path: tabButton.customerWindowRouteUrl,
+        params: {
+          processReportId: tabButton.processReportId,
+          modelData: this.modelData,
+        },
+      };
+      // 请勿修改，会影响生单的功能
+      var uuid = _self.uuid;
+      if (uuid != undefined) {
+        routeDate.path = routeDate.path + '/' + uuid;
+      }
+
+      const frameUrl = Common.getRedirectUrl(
+        '#' + routeDate.path + '?processReportId=' + tabButton.processReportId,
+      );
+
+      // 供子页面iframe调用，修改modelData，(举例：生单界面修改参数)。
+      window.modelDataChanged = this.modelDataChanged;
+
+      window.getModelData = this.getModelData;
+      let modelData = JSON.stringify(this.modelData);
+      console.log(modelData);
+      localStorage.setItem(_self.uuid + '#GenerateDocumentTool', modelData);
+
+      var iWidth = 1280;//弹出窗口的宽度;
+      var iHeight = 720; //弹出窗口的高度;
+      var iTop = (window.screen.availHeight-30-iHeight)/2;//获得窗口的垂直位置;
+      var iLeft = (window.screen.availWidth-10-iWidth)/2; //获得窗口的水平位置;
+      window.open(frameUrl,'_blank','height='+iHeight+',innerHeight='+iHeight+',width='+iWidth+',innerWidth='+iWidth+',top='+iTop+',left='+iLeft+',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no');
+      // window.open(frameUrl);
+    },
+    // 执行流程
+    executeProcess: function (tabButton) {
+      var _self = this;
+      var ids = [_self.modelData.id];
+      _self.loading=true;
+
+      ProcessReportResource.runProcessByIds(tabButton.processReportNo, ids).then(
+        successData => {
+          _self.modal = true;
+          _self.loading=false;
+          _self.processReportResult = successData;
+
+          if (
+            _self.processReportResult.reportResults != undefined &&
+            _self.processReportResult.reportResults.length > 0
+          ) {
+            _self.processReportResult.reportResults.forEach(function (item, index) {
+              if(item.reportDefinitionType!=='ExcelReport'){
+                item.previewIndex=1;
+              }else{
+                item.previewIndex=2;
+              }
+              if (index == 0) {
+                item.showPreview=true;
+              } else {
+                item.showPreview=false;
+              }
+            });
+          }
+
+          _self.$emit('processExecuteFinish');
+        },
+        errorData => {
+          _self.loading=false;
+          Common.processException(errorData);
+        },
+      );
+      // }
+    },
+    /**
+     * 获取字符串的哈希值
+     * @param input
+     */
+    getHash: function (input) {
+      let hash = 0;
+      if (input.length === 0) {
+        return hash;
+      }
+      for (let i = 0; i < input.length; i++) {
+        const char = input.charCodeAt(i);
+        hash = (hash << 5) - hash + char;
+        hash = hash & hash; // 确保返回值是一个32位有符号整数
+      }
+      return Math.abs(hash).toString();
+    },
+    /**
+     * 远程加载ES VUE组件模块，并在模态框中打开。
+     * @param jsUrl js路径
+     * @param cssUrl css路径
+     */
+    openRemoteComponentModule: function (tabButton) {
+      var _self = this;
+      let jsUrl = tabButton.remoteComponentModuleJsUrl;
+
+      let cssUrl = tabButton.remoteComponentModuleCssUrl;
+
+      // 显示模态框
+      // 异步的加载js组件
+      //let jsUrl = './static/client-eam-module-v3/dist/AssetCheckCreate.js';
+      //let cssUrl = './static/client-eam-module-v3/dist/AssetCheckCreate.css';
+
+      if (cssUrl != null && cssUrl.length > 0) {
+        let cssUrlHash = _self.getHash(cssUrl);
+        CssUtil.dynamicLoadCss(cssUrl, cssUrlHash);
+      }
+      // webpackIgnore：设置为 true 时，禁用动态导入解析。
+      // const testAsyncRemoteComponent  = await import(/* webpackIgnore: true */ jsUrl);
+
+      // console.log(testAsyncRemoteComponent);
+      if (jsUrl != null && jsUrl.length > 0) {
+        const testAsyncRemoteComponent = defineAsyncComponent({
+          // 加载函数
+          loader: () => {
+            return import(/* webpackIgnore: true */ jsUrl);
+          },
+          // 加载异步组件时使用的组件
+          loadingComponent: ASpin,
+          // 展示加载组件前的延迟时间，默认为 200ms
+          delay: 200,
+          // 加载失败后展示的组件
+          errorComponent: AEmpty,
+          // 如果提供了一个 timeout 时间限制，并超时了
+          // 也会显示这里配置的报错组件，默认值是：Infinity
+          timeout: 10000,
+        });
+
+        _self.modal1Component = testAsyncRemoteComponent;
+        _self.modal1Open = true;
+        console.log(_self.modal1Component);
+      }
+    },
   },
 };
 </script>