client-base-v5/src/window1/tabGridView/CellTextItem.vue

<template>
  <div class="table-cell-text">
    <div v-if="!fieldUtil.isManyToManySetType(gridFieldItem)
      && !fieldUtil.isImageType(gridFieldItem)
      && !fieldUtil.isImageListType(gridFieldItem)
      && !fieldUtil.isVideoType(gridFieldItem)
      && !fieldUtil.isFileType(gridFieldItem)
      && !fieldUtil.isEnumMultiType(gridFieldItem)
      && !fieldUtil.isEnumListType(gridFieldItem)
      && !fieldUtil.isTextAreaType(gridFieldItem)
      && !fieldUtil.isRichTextAreaEditor(gridFieldItem)
      && !fieldUtil.isCustomerRender(gridFieldItem)">
      {{ displayValue(modelData) }}
    </div>

    <p v-else-if="fieldUtil.isRichTextAreaEditor(gridFieldItem)">
      {{ displayValue(modelData) }}
    </p>

    <div v-else-if="fieldUtil.isTextAreaType(gridFieldItem)" class="table-cell-text-line">
      {{ displayValue(modelData) }}
    </div>

    <div v-else-if="fieldUtil.isEnumListType(gridFieldItem)">
      {{ getEnmuValue() === "编辑中" ? $t("lang.TabFormFieldView.editing") :
        getEnmuValue() === "审批中" ? $t("lang.TabFormFieldView.pendingApproval") :
          getEnmuValue() === "审批通过" ? $t("lang.TabFormFieldView.approved") :
            getEnmuValue() === "审批不通过" ? $t("lang.TabFormFieldView.rejected") :
              getEnmuValue() === "单据已撤回" ? $t("lang.TabFormFieldView.withdraw") :
                getEnmuValue() === "转移" ? $t("lang.TabFormFieldView.transfer") :
                  getEnmuValue() === "报废" ? $t("lang.TabFormFieldView.disposal") :
                    getEnmuValue() === "全盘" ? $t("lang.TabFormFieldView.overall") :
                      getEnmuValue() === "抽盘" ? $t("lang.TabFormFieldView.randomInventory") : getEnmuValue()
      }}
    </div>

    <div v-else-if="fieldUtil.isEnumMultiType(gridFieldItem)">
      {{ getMultiEnmuValue() }}
    </div>

    <div v-else-if="fieldUtil.isManyToManySetType(gridFieldItem)">
      <span v-for="item, index in getManyToManyValues()" :key="index" class="selected-tag">
        {{ item }}
      </span>
    </div>

    <AuthImage v-else-if="fieldUtil.isImageType(gridFieldItem)" :auth-src="imageUrl" class="cell-image" />

    <span v-else-if="fieldUtil.isImageListType(gridFieldItem)">
      <AuthImage v-for="singleImageName in imageUrls" :key="singleImageName" :auth-src="singleImageName"
        class="cell-image-list" />
    </span>

    <VideoListCell v-else-if="fieldUtil.isVideoType(gridFieldItem)" :field="gridFieldItem" :field-value="fieldValue"
      :class-name="className" :readonly="true" />

    <ButtonCell v-else-if="fieldUtil.isButtonType(gridFieldItem)" :field="gridFieldItem" :field-value="fieldValue"
      :readonly="readOnly" @execute-callout="executeCallout" />

    <div v-else-if="fieldUtil.isFileType(gridFieldItem)" style="padding: 0px 10px">
      <FileListWidget :field="gridFieldItem" :field-value="fieldValue" :class-name="className" :readonly="true" />
    </div>


    <component :is="customerComponentName" v-else-if="fieldUtil.isCustomerRender(gridFieldItem)" :field="gridFieldItem"
      :field-value="fieldValue" :class-name="className" />
    <div v-if="fieldUtil.isGridButtonEditor(gridFieldItem)">
      <template v-for="(tabGridButtonItem, index) in gridFieldItem.tabGridButtonDtos" :key="tabGridButtonItem.name">
        <template v-if="visible[index]">
          <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>
      </template>
    </div>
  </div>
  <Modal v-model:show="modal" :full="true">
    <ProcessReportResultPreview v-if="
      processReportResult != null &&
      (processReportResult.reportResults != null ||
        processReportResult.processResult != null)
    " :process-report-result="processReportResult" :pdf-only="false" :excel-only="false" />
    <template #header>
      {{ $t("lang.tabButton.executeResult") }}
    </template>
  </Modal>
  <Modal v-model:show="titleModal" :show-canel-button="false" :show-ok-button="false">
    <template #header>
      {{ tabButtonModel.tipsTitle }}
    </template>
    {{ tabButtonModel.tipsContent }}
    <template #footer>
      <button type="button" class="btn btn-default" @click="titleModalClose">
        {{ $t("lang.tabButton.cancel") }}
      </button>
      <button type="primary" class="btn btn-default" @click="executeProcess">
        确认
      </button>
    </template>
  </Modal>
  <component :is="modal1Component" v-model:open="modal1Open" :model-data="modelData" @refresh-data="refreshDatas" />
</template>

<script>
import {
  ref,
  defineAsyncComponent,
} from 'vue';
import { Notify, Uuid, CssUtil } from 'pc-component-v3';
import { Spin as ASpin, Empty as AEmpty } from 'ant-design-vue';
import FieldUtil from '../../resource/dictionary/FieldUtil.js';
import Common from '../../common/Common.js';

import VideoListCell from '../tabGridWidget/VideoListCell.vue';
import FileListWidget from '../tabFormWidget/FileListWidget.vue';
import ButtonCell from '../tabGridWidget/ButtonCell.vue';
import AuthImage from '../../widget/AuthImage.vue';
import { Spin as ASpin, Empty as AEmpty } from 'ant-design-vue';
import { CssUtil } from 'pc-component-v3';
import { defineAsyncComponent } from 'vue';
import CustomerWindowResource from '../../api/dic/CustomerWindowResource.js';
import HtmlWindowResource from '../../api/dic/HtmlWindowResource.js';
import ProcessReportResource from '../../api/dic/ProcessReportResource.js';
import JsUtil from '../../common/JsUtil.js';
import Context from '../common/Context.js';


export default {

  components: {
    VideoListCell, FileListWidget, ButtonCell, AuthImage,
  },


  props: {
    gridFieldItem: {
      type: Object,
      default: function () {
        return null;
      },
    },
    modelData: {
      type: Object,
      default: function () {
        return {};
      },
    },
    className: {
      type: String,
      default: null,
    },
    simpleFilterParams: {
      type: String,
      default: null,
    },
    complexFilterParams: {
      type: Array,
      default: () => {
        return [];
      },
    },
    modelDatas: {
      type: Array,
      default: () => {
        return [];
      },
    },
    jsUrl: {
      type: String,
      default: null,
    },
  },
  emits: ['executeCallout', 'deleteRecord', 'refreshDatas', 'editRecord', 'readRecord'],


  data: function () {
    this.Common = Common;
    return {
      fieldUtil: FieldUtil,
      customerComponentName: null,
      modal1Open: false,
      modal1Component: null,
      processReportResult: {},
      modal: false,
      titleModal: false,
      tabButtonModel: {},
      tabGridButtonDtos: [],
      visible: [],
    };
  },

  computed: {
    imageUrl: function () {
      var _self = this;
      var value = this.displayValue(this.modelData);
      if (value != undefined) {
        var tempImageUrl = _self.getImageUrl(value);
        return tempImageUrl;
      }
      return '';
    },

    imageUrls: function () {
      var _self = this;
      var value = this.displayValue(this.modelData);
      var images = [];
      if (value != undefined && value.length > 0) {
        var values = value.split(',');
        values.forEach(function (tempValue) {
          var tempImageUrl = _self.getImageUrl(tempValue);
          images.push(tempImageUrl);
        });
      }
      return images;
    },

    fieldValue: function () {
      var _self = this;
      var modelData = _self.modelData;

      var fieldValue = {};

      if (modelData.data[_self.gridFieldItem.fieldName] != undefined) {
        fieldValue = modelData.data[_self.gridFieldItem.fieldName];
      } else {
        fieldValue = {
          displayValue: [],
          fieldType: 'String',
        };
      }
      return fieldValue;
    },

    /**
         * 字段是否只读
         */
    readOnly: function () {
      if (this.gridFieldItem == undefined) {
        return true;
      }

      if (this.gridFieldItem != undefined && this.gridFieldItem.readOnly == true) {
        return true;
      }

      if (this.gridFieldItem != undefined && this.gridFieldItem.entityFieldIndex > 0) {
        return true;
      }

      if (this.modelData != undefined && this.modelData.id > 0 && (this.gridFieldItem.updatable == undefined || this.gridFieldItem.updatable == false)) {
        return true;
      }

      return this.gridFieldItem.readOnly;
    },
  },
  watch: {
    modelData: {
      deep: true,
      immediate: true,
      handler(curVal, oldVal) {
        console.log('cellTextItem监听');
        // this.cellTextItemTabGridButtonShowLogical();
      },
    },

    'gridFieldItem.tabGridButtonDtos': {

      immediate: true,
      handler(curVal, oldVal) {
        const _self = this;
        this.visible.splice(0, this.visible.length);
        if (curVal != null) {
          curVal.forEach(item => {
            _self.visible.push(false);
          });
        }
      },
    },
  },
  mounted: function () {
    this.cellTextItemTabGridButtonShowLogical();
  },
  methods: {
    /**
         * 获取Context
         */
    getContext: Context,

    /**
     * 操作列设置显示逻辑
     */
    cellTextItemTabGridButtonShowLogical: function () {
      var _self = this;
      console.log('cellTextItemTabGridButtonShowLogical');
      if (_self.gridFieldItem.tabGridButtonDtos != null &&
        _self.gridFieldItem.tabGridButtonDtos != undefined && _self.gridFieldItem.tabGridButtonDtos.length > 0
      ) {
        for (let index = 0; index < _self.gridFieldItem.tabGridButtonDtos.length; index++) {
          const tabGridButtonItem = _self.gridFieldItem.tabGridButtonDtos[index];
          let oldTabGridButtonString = JSON.stringify(tabGridButtonItem);
          const showLogical = tabGridButtonItem.showLogical;
          if (showLogical != null && showLogical.length > 0) {
            let functionName = tabGridButtonItem.showLogical.replace('.', '_') + '_showLogical';

            let executeFunction = function () {
              let ctx = new _self.getContext(_self.modelData);
              try {
                _self.visible[index] = _self[functionName](ctx);
              } catch (e) {
                console.error('js代码 %s 执行异常 %o', showLogical, e);
                _self.visible[index] = true;
              }
            };

            if (_self[functionName] == null) {
              // 执行服务端的脚本
              const jsUrl = _self.jsUrl;
              if (jsUrl == null || jsUrl == undefined) {
                Notify.error('数据字典定义异常', '【' + tabGridButtonItem.name + '】列显示逻辑的JS文件不存在,请联系管理员检查数据字典是否JS文件。', false);
                return;
              }
              let promise = JsUtil.dynamicLoadJsFunction(jsUrl, showLogical);
              promise.then(dynamicFunction => {
                let targetFunction = dynamicFunction;

                if (targetFunction == null) {
                  Notify.error('数据字典定义异常', '【' + tabGridButtonItem.name + '】列显示逻辑定义异常,请联系管理员检查数据字典的定义。', false);
                  return;
                }

                _self[functionName] = targetFunction;

                executeFunction();
              }, errorData => {
                console.error(errorData);
              });
            } else {
              executeFunction();
            }
          } else {
            _self.visible[index] = true;
          }

          let newTabGridButtonString = JSON.stringify(tabGridButtonItem);

          // bug fixed by jack 2022-01-17
          // 只有当数据发生改变以后，才重新设置数据，解决当子表数据量很打的时候，输入卡顿的问题。
          if (oldTabGridButtonString != newTabGridButtonString) {
            _self.gridFieldItem.tabGridButtonDtos[index] = tabGridButtonItem;
          }
        }
      }
    },

    /**
         * 执行Callout
         */
    executeCallout: function (field) {
      this.$emit('executeCallout', field);
    },

    displayValue: function (modelData) {
      if (modelData == undefined) {
        return '';
      } else if (modelData.data == undefined) {
        return '';
      } else if (modelData.data[this.gridFieldItem.fieldName] == undefined) {
        return '';
      } else if (modelData.data[this.gridFieldItem.fieldName].displayValue == undefined) {
        return '';
      } else {
        var value = modelData.data[this.gridFieldItem.fieldName].displayValue[this.gridFieldItem.entityFieldIndex];
        if (FieldUtil.isCheckBoxType(this.gridFieldItem)) {
          if (value == 'true' || value == true) {
            return this.$t('lang.TabFormFieldView.yes');
          } else if (value == 'false' || value == false) {
            return this.$t('lang.TabFormFieldView.no');
          }
        } else if (FieldUtil.isRedGreenEditorType(this.gridFieldItem)) {
          if (value == 'true' || value == true) {
            return '红单';
          } else if (value == 'false' || value == false) {
            return '蓝单';
          }
        }
        return value;
      }
    },

    // 获取
    getImageUrl: function (name) {
      return Common.getThumbnailImageSrc(this.className, name);
    },

    /**
         * 获取枚举单选框的值
         */
    getEnmuValue: function () {
      var _self = this;
      var result;
      if (_self.fieldValue != undefined && _self.fieldValue.displayValue != undefined) {
        var value0 = _self.fieldValue.displayValue[0];
        if (_self.gridFieldItem != null && _self.gridFieldItem.keyValues != null) {
          _self.gridFieldItem.keyValues.forEach(function (item1) {
            if (value0 == item1.keyStr) {
              result = item1.value;
            }
          });
        }
      }
      return result;
    },


    /**
         * 获取枚举多选框的值
         */
    getMultiEnmuValue: function () {
      var _self = this;
      var fieldValue = (_self.modelData.data == undefined) ? [] : _self.modelData.data[_self.gridFieldItem.fieldName];
      var result = [];
      if (fieldValue != undefined && _self.fieldValue.displayValue != undefined) {
        var arr = fieldValue.displayValue[0].split(',');
        arr.forEach(function (item) {
          _self.gridFieldItem.keyValues.forEach(function (item1) {
            if (item == item1.keyStr) {
              result.push(item1.value + ' ');
            }
          });
        });
      }
      return result.join(',');
    },

    // 获取枚举多选框的值
    getManyToManyValues: function () {
      var modelData = this.modelData;
      if (modelData == undefined) {
        return [];
      } else if (modelData.data == undefined) {
        return [];
      } else if (modelData.data[this.gridFieldItem.fieldName] == undefined) {
        return [];
      } else if (modelData.data[this.gridFieldItem.fieldName].displayValue == undefined) {
        return [];
      } else {
        return modelData.data[this.gridFieldItem.fieldName].displayValue;
      }
    },


    buttonClick: function () {
      Notify.error('提示', '暂不支持该组件', false);
    },
    deleteRecord: function () {
      this.$emit('deleteRecord');
    },
    refreshDatas: function () {
      this.$emit('refreshDatas');
    },
    // 改变表格行元素的编辑状态
    editRecord: function () {
      this.$emit('editRecord');
    },
    readRecord: function () {
      this.$emit('readRecord');
    },
    /**
     * 远程加载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.customerComponentName = testAsyncRemoteComponent;
        console.log(_self.customerComponentName);
      }
    },

    /**
     * 远程加载ES VUE组件模块。
     * @param jsUrl js路径
     * @param cssUrl css路径
     */
    renderRemoteComponentModule: async function () {
      const _self = this;
      let jsUrl = this.gridFieldItem.remoteComponentModuleJsUrl;
      let cssUrl = this.gridFieldItem.remoteComponentModuleCssUrl;
      _self.modal1Component = testAsyncRemoteComponent;
      _self.modal1Open = true;
      console.log(_self.modal1Component);
    }
  },
  //跳转或执行流程
  execute: function (tabButton) {
    var _self = this;
    _self.tabButtonModel = tabButton;
    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) {
        if (tabButton.tipsTitle == undefined || tabButton.tipsTitle.length == 0) {
          _self.executeProcess();
        } else {
          _self.titleModal = true;
        }
      } 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: {
        modelData: this.modelData,
      },
    };
    // 请勿修改，会影响生单的功能
    var uuid = _self.uuid;
    if (uuid != undefined) {
      routeDate.path = routeDate.path + '/' + uuid;
    }

    const frameUrl = Common.getRedirectUrl(
      '#' + routeDate.path,
    );

    // 供子页面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 () {
    var _self = this;
    var ids = [_self.modelData.id];
    ProcessReportResource.runProcessByIds(_self.tabButtonModel.processReportNo, ids).then(
      successData => {
        _self.modal = true;
        _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.titleModal = false;
      },
      errorData => {
        _self.titleModal = false;
        Common.processException(errorData);
      },
    );
    _self.refreshDatas();
    // }
  },
  //关闭表头按钮提示框
  titleModalClose: function () {
    var _self = this;
    _self.titleModal = false;
  },
}


</script>
<style scoped>
.table-cell-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
}

.table-cell-text-line {
  word-break: break-all;
  white-space: pre-line;
  max-height: 4em;
}

.required-mark {
  color: red;
}

.cell-image {
  width: 80px;
  height: 80px;
}

.cell-image-list {
  width: 40px;
  height: 40px;
  margin-right: 5px;
}

.selected-tag {
  color: #333;
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  border-radius: 4px;
  height: 26px;
  margin: 4px 4px 0px 0px;
  padding: 6px 0.25em;
}
</style>