cloud-web-corejs 1.0.258 → 1.0.259

package/src/components/xform/form-designer/form-widget/field-widget/autocomplete-widget.vue

@@ -0,0 +1,119 @@
+<template>
+  <form-item-wrapper :designer="designer" :field="field" :rules="rules" :design-state="designState"
+                     :parent-widget="parentWidget" :parent-list="parentList" :index-of-parent-list="indexOfParentList"
+                     :sub-form-row-index="subFormRowIndex" :sub-form-col-index="subFormColIndex"
+                     :sub-form-row-id="subFormRowId">
+    <el-autocomplete
+      ref="fieldEditor"
+      v-model="displayValue"
+      v-show="!isReadMode"
+      class="full-width-input"
+      :disabled="field.options.disabled"
+      :readonly="field.options.readonly"
+      :size="field.options.size"
+      :placeholder="getI18nLabel(field.options.placeholder || '请输入关键词搜索')"
+      :clearable="field.options.clearable"
+      :fetch-suggestions="querySearchAsync"
+      :trigger-on-focus="false"
+      :debounce="field.options.debounce || 300"
+      :value-key="valueKey"
+      :prefix-icon="field.options.prefixIcon"
+      :suffix-icon="field.options.suffixIcon || 'el-icon-tickets'"
+      :popper-class="
+        'autocomplete-popper' +
+        (field.options.customClass ? ' ' + field.options.customClass.join(' ') : '')
+      "
+      @select="handleSelect"
+      @clear="handleClear"
+      @focus="handleFocusCustomEvent"
+      @blur="handleBlur"
+      @input="handleInputChange"
+      :style="'width:' + field.options.widgetWidth + ' !important;'"
+      :class="{'custom-width': field.options.widgetWidth != null}">
+      <template slot-scope="{ item }">
+        <template v-if="field.options.autocompleteItemTemplate">
+          <!-- 支持自定义下拉项模板脚本(返回 HTML 字符串) -->
+          <span v-html="renderItemTemplate(item)"></span>
+        </template>
+        <template v-else>
+          <span v-html="highlightKeyword(item[valueKey])"></span>
+        </template>
+      </template>
+    </el-autocomplete>
+    <template v-if="isReadMode">
+      <span class="readonly-mode-field">{{ displayValue }}</span>
+    </template>
+  </form-item-wrapper>
+</template>
+
+<script>
+import mixins from "@base/components/xform/form-designer/form-widget/field-widget/mixins/autocomplete-mixin";
+
+export default {
+  name: "autocomplete-widget",
+  componentName: 'FieldWidget',  //必须固定为FieldWidget，用于接收父级组件的broadcast事件
+  mixins: [mixins],
+  methods: {
+    /**
+     * 渲染自定义下拉项模板(可选)。
+     * autocompleteItemTemplate 为一段返回 HTML 字符串的脚本，入参为 item
+     */
+    renderItemTemplate(item) {
+      if (!this.field.options.autocompleteItemTemplate) return "";
+      try {
+        let fn = new Function("item", this.field.options.autocompleteItemTemplate);
+        return fn.call(this, item) || "";
+      } catch (e) {
+        return "";
+      }
+    },
+    /** HTML 转义，防止下拉项内容注入 */
+    escapeHtml(str) {
+      let map = {
+        "&": "&amp;",
+        "<": "&lt;",
+        ">": "&gt;",
+        '"': "&quot;",
+        "'": "&#39;",
+      };
+      return String(str == null ? "" : str).replace(/[&<>"']/g, (c) => map[c]);
+    },
+    /** 高亮下拉项中与当前搜索关键词匹配的部分 */
+    highlightKeyword(text) {
+      let escaped = this.escapeHtml(text);
+      let keyword = this.lastQueryKeyword;
+      if (!keyword) return escaped;
+      let kw = this.escapeHtml(keyword).replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+      if (!kw) return escaped;
+      let re = new RegExp("(" + kw + ")", "gi");
+      return escaped.replace(
+        re,
+        '<span class="autocomplete-highlight">$1</span>'
+      );
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/styles/global.scss";
+
+.full-width-input {
+  width: 100% !important;
+}
+</style>
+
+<!-- 非 scoped：el-autocomplete 下拉浮层挂在 body 下，scoped 样式无法命中 -->
+<style lang="scss">
+.autocomplete-popper {
+  .el-autocomplete-suggestion__list li {
+    font-size: 13px;
+    line-height: 1.6;
+  }
+}
+
+.autocomplete-highlight {
+  color: #409eff;
+  font-weight: bold;
+}
+</style>

package/src/components/xform/form-designer/form-widget/field-widget/fieldMixin.js

@@ -663,6 +663,20 @@ modules = {
         return;
       }
     },
+    /**
+     * 构造表单脚本请求的 data 参数（通用）。
+     * 勾选"请求去掉data层"(removeDataLevel)时，内层参数平铺到外层，不再包一层 data。
+     */
+    buildFormScriptData: function (reportTemplate, innerData, taBm) {
+      let base = {
+        formCode: reportTemplate.formCode,
+        formVersion: reportTemplate.formVersion,
+        taBm: taBm || this.fieldKeyName,
+      };
+      return this.field.options.removeDataLevel
+        ? { ...base, ...(innerData || {}) }
+        : { ...base, data: innerData || {} };
+    },
     loadGloatOptions: function (e, initFlag) {
       let optionItems = baseRefUtil.translateOptionItems(
         e,

package/src/components/xform/form-designer/form-widget/field-widget/form-item-wrapper.vue

@@ -216,6 +216,10 @@ import {
   getSubFormNameByFieldId,
   isVabsearchMultiWidget,
 } from "../../../../../components/xform/utils/util";
+import {
+  compareToList,
+  resolveTextMaskFlag,
+} from "../../../../../components/xform/utils/textMaskUtil";
 
 export default {
   name: "form-item-wrapper",
@@ -570,81 +574,22 @@ export default {
       let formConfig = fJson.formConfig;
       if (formConfig.isLoadEntity && !formRef.dataId) return;
 
-      let bdService = formRef.bdService;
-      let companyCode = this.$store.getters.companyCode;
-      let loginAccount = this.$store.getters.loginAccount;
-
-      let userSaleOrgDTOs = formRef.userSaleOrgDTOs;
-      let userRoleDTOs = formRef.userRoleDTOs;
-
-      let saleOrgCodeList = userSaleOrgDTOs.map((item) => item.sn);
-      let roleCodeList = userRoleDTOs.map((item) => item.roleCode);
-
-      let optionModel = this.field.options;
-
-      let flag = 0; //0 原本组件，1明文文本，2密文文本
-      /*if (optionModel.showTextEnabled) {
-        flag = 1;
-      } else if (optionModel.showEncryptTextEnabled) {
-        flag = 2;
-      } else if (optionModel.showLinkTextEnabled) {
-        flag = 3;
-      }*/
-      if (optionModel.userTextRuleEnabled) {
-        let userTextRuleConfig = optionModel.userTextRuleConfig || [];
-        userTextRuleConfig.forEach((item) => {
-          let type = item.type ?? null;
-          if (type !== null && type !== "") {
-            let companyCodeStr = item.companyCodes;
-            let companyCodes = companyCodeStr
-              ? companyCodeStr.split(",").filter((item) => !!item)
-              : [];
-            /*
-
-                        let loginAccountStr = item.loginAccounts;
-                        let loginAccounts = loginAccountStr ? loginAccountStr.split(",").filter(item => !!item) : [];
-
-                        let saleOrgCodeStr = item.saleOrgCodes;
-                        let saleOrgCodes = saleOrgCodeStr ? saleOrgCodeStr.split(",").filter(item => !!item) : [];
-            */
-
-            let roleCodeStr = item.roleCodes;
-            let roleCodes = roleCodeStr
-              ? roleCodeStr.split(",").filter((item) => !!item)
-              : [];
-
-            let flag1 = !item.serveName || item.serveName == bdService;
-            let flag2 =
-              !companyCodes.length || companyCodes.includes(companyCode);
-            // let flag3 = !loginAccounts.length || loginAccounts.includes(loginAccount)
-            // let flag4 = this.compareToList(saleOrgCodes, saleOrgCodeList)
-            if (flag1 && flag2) {
-              this.encryptFormula = item.encryptFormula;
-              let flag5 = this.compareToList(roleCodes, roleCodeList);
-              if (flag5) {
-                //匹配角色
-                if (type == 2) flag = 2; //type=2时加密
-              } else {
-                //角色不匹配
-                if (type == 1) flag = 2;
-              }
-            }
-          }
-        });
-      }
-      this.field.options.widgetTextFlag = flag;
-      // this.showType = flag;
+      let userRoleDTOs = formRef.userRoleDTOs || [];
+      // 判定逻辑与导出侧（数据表格按列剔除）共用 textMaskUtil，
+      // 否则会出现界面打码、导出放行两套结论
+      let { masked, encryptFormula } = resolveTextMaskFlag(this.field.options, {
+        bdService: formRef.bdService,
+        companyCode: this.$store.getters.companyCode,
+        roleCodeList: userRoleDTOs.map((item) => item.roleCode),
+      });
+
+      this.encryptFormula = encryptFormula;
+      //0 原本组件，1明文文本，2密文文本
+      this.field.options.widgetTextFlag = masked ? 2 : 0;
     },
+    /* 实现已移入 textMaskUtil，此处保留方法名供下游调用（同名的是导入的模块函数） */
     compareToList(list1, list2) {
-      if (!list1.length) {
-        return true;
-      }
-      if (!list2.length) {
-        return false;
-      }
-      return list1.some((item) => {
-        return list2.some((item2) => item == item2);
-      });
+      return compareToList(list1, list2);
     },
     isShowWidget() {
       let widgetTextFlag = this.field.options.widgetTextFlag;

package/src/components/xform/form-designer/form-widget/field-widget/mixins/autocomplete-mixin.js

@@ -0,0 +1,451 @@
+import FormItemWrapper from "@base/components/xform/form-designer/form-widget/field-widget/form-item-wrapper";
+import emitter from "@base/components/xform/utils/emitter";
+import i18n from "@base/components/xform/utils/i18n";
+import { deepClone, trim } from "@base/components/xform/utils/util";
+import fieldMixin from "@base/components/xform/form-designer/form-widget/field-widget/fieldMixin";
+
+export default {
+  mixins: [emitter, fieldMixin, i18n],
+  props: {
+    field: Object,
+    parentWidget: Object,
+    parentList: Array,
+    indexOfParentList: Number,
+    designer: Object,
+
+    designState: {
+      type: Boolean,
+      default: false,
+    },
+
+    columnConfig: {
+      type: Object,
+      default: null,
+    },
+    subFormRowIndex: {
+      /* 子表单组件行索引，从0开始计数 */
+      type: Number,
+      default: -1,
+    },
+    subFormColIndex: {
+      /* 子表单组件列索引，从0开始计数 */
+      type: Number,
+      default: -1,
+    },
+    subFormRowId: {
+      /* 子表单组件行Id，唯一id且不可变 */
+      type: String,
+      default: "",
+    },
+  },
+  components: {
+    FormItemWrapper,
+  },
+  data() {
+    return {
+      oldFieldValue: null, //field组件change之前的值
+      fieldModel: null, //存储 ID 值（提交字段）
+      displayValue: null, //el-autocomplete 的 v-model，存储展示名称（仅用于输入框显示）
+      rules: [],
+      isSelecting: false, //标记当前是否由"选择某一项"触发的输入变化
+      lastQueryKeyword: null, //最近一次查询关键词，避免重复查询
+    };
+  },
+  watch: {
+    fieldModel(val) {
+      //同步 ID 到当前数据行/表单模型
+      let currentData = this.currentData;
+      let fieldKeyName = this.fieldKeyName;
+      currentData[fieldKeyName] = val;
+    },
+    showValue(val) {
+      //外部回显：当 currentData[displayField] 变化时，同步到输入框
+      this.displayValue = val;
+    },
+  },
+  computed: {
+    /**
+     * 关联来源字段：候选数据中"ID/值"对应的字段名
+     */
+    valueField() {
+      return trim(this.field.options.valueField) || this.fieldKeyName;
+    },
+    /**
+     * 展示来源字段：候选数据中"名称"对应的字段名
+     * （为空时回退展示字段 vabSearchName，再回退字段本身，保证旧表单兼容）
+     */
+    sourceLabelField() {
+      return (
+        trim(this.field.options.labelSourceField) ||
+        trim(this.field.options.vabSearchName) ||
+        this.fieldKeyName
+      );
+    },
+    /**
+     * 展示字段：表单数据中持久化"名称"的字段（用于存储与回显）
+     */
+    displayField() {
+      return trim(this.field.options.vabSearchName) || this.fieldKeyName;
+    },
+    /**
+     * el-autocomplete 下拉项展示用的 value-key（取自候选数据的展示来源字段）
+     */
+    valueKey() {
+      return this.sourceLabelField;
+    },
+    /**
+     * 查询字段：远程搜索时关键词传给后台的参数名（默认 keyword）
+     */
+    queryField() {
+      return trim(this.field.options.queryField) || "keyword";
+    },
+    /**
+     * condition格式下查询的数据表 taBm（留空取字段本身 keyName）
+     */
+    conditionTaBm() {
+      return trim(this.field.options.conditionTaBm) || this.fieldKeyName;
+    },
+    tableRow() {
+      let tableParam = this.tableParam;
+      return tableParam && tableParam.row ? tableParam.row : null;
+    },
+    currentData() {
+      let tableParam = this.tableParam;
+      return tableParam && tableParam.row ? tableParam.row : this.formModel;
+    },
+    /**
+     * 表单数据中持久化的展示名称，用于回显
+     */
+    showValue() {
+      let currentData = this.currentData;
+      let displayField = this.displayField;
+      let value = currentData[displayField] ?? null;
+      this.displayValue = value;
+      return value;
+    },
+  },
+  beforeCreate() {
+    /* 这里不能访问方法和属性！！ */
+  },
+
+  created() {
+    /* 注意：子组件mounted在父组件created之后、父组件mounted之前触发，故子组件mounted需要用到的prop
+       需要在父组件created中初始化！！ */
+    this.initFieldModel();
+    this.registerToRefList();
+    this.initEventHandler();
+    this.buildFieldRules();
+
+    this.handleOnCreated();
+  },
+
+  mounted() {
+    this.handleOnMounted();
+    //编辑态回显：若有 ID 但无名称，且配置了反查脚本，则自动反查
+    this.$nextTick(() => {
+      if (this.designState) return;
+      let id = this.fieldModel;
+      let label = this.currentData[this.displayField];
+      if (this.isNotNullVal(id) && !this.isNotNullVal(label)) {
+        this.fetchLabelById(id);
+      }
+    });
+  },
+
+  beforeDestroy() {
+    this.unregisterFromRefList();
+  },
+
+  methods: {
+    /**
+     * 设置展示名称到当前数据行/表单模型，并同步到输入框
+     */
+    setShowValue(val = null) {
+      let displayField = this.displayField;
+      this.currentData[displayField] = val;
+      this.displayValue = val;
+    },
+    setValue: function (e) {
+      if (this.field.formItemFlag) {
+        let value = e ?? null;
+        let currentData = this.currentData;
+        if (void 0 === currentData[this.fieldKeyName]) {
+          this.$set(currentData, this.fieldKeyName, null);
+        }
+        let t = deepClone(this.fieldModel);
+        this.fieldModel = value;
+        this.initFileList();
+        this.syncUpdateFormModel(value);
+        this.emitFieldDataChange(value, t);
+      }
+    },
+    fieldModelLabel() {
+      return this.displayValue;
+    },
+    // 对比旧值：label 存在原单同行的伴随字段(displayField)，从 oldRow 取
+    resolveCompareOldDisplay(oldRow) {
+      if (!oldRow) return null;
+      return oldRow[this.displayField] ?? null;
+    },
+    /**
+     * 远程搜索：调用后台逻辑脚本，返回建议列表
+     * el-autocomplete 的 fetch-suggestions 回调签名 (queryString, callback)
+     */
+    querySearchAsync(queryString, cb) {
+      if (this.designState) {
+        cb([]);
+        return;
+      }
+      let formScriptEnabled = this.field.options.formScriptEnabled || false;
+      let scriptCode = this.field.options.formScriptCode;
+      if (!formScriptEnabled || !scriptCode) {
+        cb([]);
+        return;
+      }
+      //需要有内容才执行搜索：关键词为空（含聚焦触发的空串）时不查询
+      let keyword = queryString == null ? "" : String(queryString);
+      if (!trim(keyword)) {
+        this.lastQueryKeyword = null;
+        this._lastSuggestions = null;
+        cb([]);
+        return;
+      }
+      //避免对相同关键词重复查询（el-autocomplete focus/input 都会触发）
+      if (
+        keyword === this.lastQueryKeyword
+        && this._lastSuggestions
+        && this._lastSuggestions.length
+      ) {
+        cb(this._lastSuggestions);
+        return;
+      }
+      this.lastQueryKeyword = keyword;
+
+      let reportTemplate = this.getFormRef().reportTemplate;
+      let accessParam = this.handleCustomEvent(
+        this.field.options.formScriptParam
+      );
+      let innerData;
+      if (this.field.options.conditionFormat) {
+        //condition 传值格式：关键词以 { field, value, filter:'like' } 追加到 condition 数组
+        let extra = accessParam || {};
+        let conditions = Array.isArray(extra.condition)
+          ? extra.condition.slice()
+          : [];
+        conditions.push({
+          value: keyword,
+          field: this.queryField,
+          filter: "like",
+        });
+        innerData = {
+          current: 1,
+          size: this.field.options.conditionSize || 100,
+          searchCount: true,
+          ...extra,
+          condition: conditions,
+        };
+      } else {
+        innerData = {
+          ...accessParam,
+          [this.queryField]: keyword,
+        };
+      }
+      let taBm = this.field.options.conditionFormat
+        ? this.conditionTaBm
+        : undefined;
+      let data = this.buildFormScriptData(reportTemplate, innerData, taBm);
+      return this.formHttp({
+        scriptCode: scriptCode,
+        isLoading: false,
+        data: data,
+        callback: (res) => {
+          let rows = res.objx?.records || res.objx || [];
+          //允许通过 formScriptSuccess 对结果进行二次处理
+          let handled = this.handleCustomEvent(
+            this.field.options.formScriptSuccess,
+            ["res", "rows"],
+            [res, rows]
+          );
+          if (Array.isArray(handled)) {
+            rows = handled;
+          }
+          this._lastSuggestions = rows;
+          cb(rows);
+        },
+        fail: () => {
+          cb([]);
+        },
+        error: () => {
+          cb([]);
+        },
+      });
+    },
+    /**
+     * 选中某一项：存储 ID 与名称，并回填配置的其他字段
+     */
+    handleSelect(item) {
+      this.isSelecting = true;
+      try {
+        let valueField = this.valueField;
+        let sourceLabelField = this.sourceLabelField;
+        let id = item[valueField] ?? null;
+        let label = item[sourceLabelField] ?? null;
+
+        //存储 ID（提交字段）
+        this.setValue(id);
+        //存储展示名称（持久化到表单数据 + 输入框）
+        this.setShowValue(label);
+
+        //回填其他字段
+        this.fillBackFields(item);
+
+        //触发 onChange 自定义事件
+        if (this.field.options.onChange) {
+          let fn = new Function(
+            "value",
+            "oldValue",
+            "item",
+            this.field.options.onChange
+          );
+          fn.call(this, id, this.oldFieldValue, item);
+        }
+      } finally {
+        this.$nextTick(() => {
+          this.isSelecting = false;
+        });
+      }
+    },
+    /**
+     * 清空：同时清除 ID 与名称
+     */
+    handleClear() {
+      this.setValue(null);
+      this.setShowValue(null);
+      this.lastQueryKeyword = null;
+      this._lastSuggestions = null;
+      if (this.field.options.onSearchClear) {
+        let tableParam = this.tableParam;
+        let eventParamNames = [];
+        let eventParamValues = [];
+        if (tableParam) {
+          eventParamNames = ["rowData", "rowIndex"];
+          eventParamValues = [tableParam.row, tableParam.rowIndex];
+        }
+        this.handleCustomEvent(
+          this.field.options.onSearchClear,
+          eventParamNames,
+          eventParamValues
+        );
+      }
+    },
+    /**
+     * 输入框内容变化：仅派发校验与自定义 onInput，不清除已存储的 ID/名称。
+     * 用户输入但未选择、直接失焦时，由 handleBlur 还原为已存储的展示名称。
+     */
+    handleInputChange(text) {
+      if (this.isSelecting) return;
+      this.dispatch("VFormRender", "fieldValidation", [this.getPropName()]);
+      if (this.field.options.onInput) {
+        let fn = new Function("value", this.field.options.onInput);
+        fn.call(this, text);
+      }
+    },
+    /**
+     * 失焦：若未通过"选择"确认新值，则把输入框内容还原为已存储的展示名称
+     * （已存储 ID 保持不变；从未选择过则清空输入框）。
+     */
+    handleBlur(e) {
+      if (!this.designState) {
+        //延迟到"选择"事件之后再还原，避免点击下拉项时被误还原
+        setTimeout(() => {
+          if (this.isSelecting) return;
+          let storedLabel = this.currentData[this.displayField] ?? null;
+          if (this.displayValue !== storedLabel) {
+            this.displayValue = storedLabel;
+          }
+        }, 150);
+      }
+      this.handleBlurCustomEvent(e);
+    },
+    /**
+     * 根据回填配置把选中项的其他字段值写入表单
+     */
+    fillBackFields(item) {
+      let fillConfig = this.field.options.autocompleteFillConfig || [];
+      if (!fillConfig.length) return;
+      let formModel = this.formModel;
+      fillConfig.forEach((cfg) => {
+        let targetField = trim(cfg.targetField);
+        let targetFormField = trim(cfg.targetFormField);
+        let sourceField = trim(cfg.sourceField);
+        let value = sourceField ? item[sourceField] ?? null : null;
+        if (targetField) {
+          let ref = this.getWidgetRef(targetField);
+          if (ref && ref.setValue) {
+            ref.setValue(value);
+          }
+        } else if (targetFormField) {
+          formModel[targetFormField] = value;
+        }
+      });
+    },
+    /**
+     * 通过 ID 反查名称（编辑态回显场景）。
+     * 当 fieldModel 有值但 currentData[displayField] 为空时调用。
+     */
+    fetchLabelById(id) {
+      let formScriptEnabled = this.field.options.formScriptEnabled || false;
+      let scriptCode = this.field.options.formScriptCode;
+      let getByIdScriptCode = this.field.options.getByIdScriptCode;
+      if (!formScriptEnabled || !id) return;
+      //优先使用专用的 getById 脚本；否则不自动反查
+      if (!getByIdScriptCode) return;
+      let reportTemplate = this.getFormRef().reportTemplate;
+      let accessParam = this.handleCustomEvent(
+        this.field.options.formScriptParam
+      );
+      let innerData;
+      if (this.field.options.conditionFormat) {
+        //condition 传值格式：按 关联来源字段 eq id 反查
+        let extra = accessParam || {};
+        let conditions = Array.isArray(extra.condition)
+          ? extra.condition.slice()
+          : [];
+        conditions.push({
+          value: id,
+          field: this.valueField,
+          filter: "eq",
+        });
+        innerData = {
+          current: 1,
+          size: this.field.options.conditionSize || 100,
+          searchCount: true,
+          ...extra,
+          condition: conditions,
+        };
+      } else {
+        innerData = {
+          ...accessParam,
+          id: id,
+        };
+      }
+      let taBm = this.field.options.conditionFormat
+        ? this.conditionTaBm
+        : undefined;
+      let data = this.buildFormScriptData(reportTemplate, innerData, taBm);
+      return this.formHttp({
+        scriptCode: getByIdScriptCode,
+        isLoading: false,
+        data: data,
+        callback: (res) => {
+          let rows = res.objx?.records || res.objx || [];
+          let row = Array.isArray(rows) ? rows[0] : rows;
+          if (row) {
+            let label = row[this.sourceLabelField] ?? null;
+            this.setShowValue(label);
+          }
+        },
+      });
+    },
+  },
+};