cloud-web-corejs-haier 1.0.43 → 1.0.44

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

@@ -22,20 +22,33 @@
           </template>
           <template
             v-else-if="
-              field.options.widgetTextFlag === 3 && field.options.widgetTextLinkConfig
+              field.options.widgetTextFlag === 3 &&
+              field.options.widgetTextLinkConfig
             "
           >
             <div class="ellipsis">
-              <a class="a-link" :class="getWidgetClass()" @click.native="handleClick">
+              <a
+                class="a-link"
+                :class="getWidgetClass()"
+                @click.native="handleClick"
+              >
                 <span>
                   <i
-                    :class="field.options.widgetTextLinkConfig.options.prefixIcon"
-                    v-if="!!field.options.widgetTextLinkConfig.options.prefixIcon"
+                    :class="
+                      field.options.widgetTextLinkConfig.options.prefixIcon
+                    "
+                    v-if="
+                      !!field.options.widgetTextLinkConfig.options.prefixIcon
+                    "
                   ></i>
                   <span>{{ getWidgetValue() }}</span>
                   <i
-                    :class="field.options.widgetTextLinkConfig.options.suffixIcon"
-                    v-if="!!field.options.widgetTextLinkConfig.options.suffixIcon"
+                    :class="
+                      field.options.widgetTextLinkConfig.options.suffixIcon
+                    "
+                    v-if="
+                      !!field.options.widgetTextLinkConfig.options.suffixIcon
+                    "
                   ></i>
                 </span>
               </a>
@@ -48,10 +61,12 @@
       </template>
       <template v-else>
         <el-form-item
-          v-if="!!field.formItemFlag && (!field.options.hidden || designState === true)"
+          v-if="
+            !!field.formItemFlag &&
+            (!field.options.hidden || designState === true)
+          "
           :label="label"
           :label-width="labelWidth"
-          :title="field.options.labelTooltip"
           :rules="getRules()"
           :prop="getPropName()"
           :class="[
@@ -66,31 +81,48 @@
             v-if="!!field.options.labelIconClass"
             slot="label"
             class="custom-label"
-            :style="{ color: field.options.labelColor }"
           >
             <template v-if="field.options.labelIconPosition === 'front'">
               <template v-if="!!field.options.labelTooltip">
-                <el-tooltip :content="field.options.labelTooltip" effect="light">
+                <el-tooltip
+                  :content="field.options.labelTooltip"
+                  effect="dark"
+                  popper-class="label-tooltip-pre-line"
+                >
                   <i :class="field.options.labelIconClass"></i></el-tooltip
-                >{{ label }}</template
+                ><span :style="{ color: field.options.labelColor }">{{
+                  label
+                }}</span></template
               >
               <template v-else>
-                <i :class="field.options.labelIconClass"></i>{{ label }}</template
+                <i :class="field.options.labelIconClass"></i
+                ><span :style="{ color: field.options.labelColor }">{{
+                  label
+                }}</span></template
               >
             </template>
             <template v-else-if="field.options.labelIconPosition === 'rear'">
               <template v-if="!!field.options.labelTooltip">
-                {{ label
-                }}<el-tooltip :content="field.options.labelTooltip" effect="light">
+                <span :style="{ color: field.options.labelColor }">{{
+                  label
+                }}</span
+                ><el-tooltip
+                  :content="field.options.labelTooltip"
+                  effect="dark"
+                  popper-class="label-tooltip-pre-line"
+                >
                   <i :class="field.options.labelIconClass"></i></el-tooltip
               ></template>
               <template v-else>
-                {{ label }}<i :class="field.options.labelIconClass"></i
+                <span :style="{ color: field.options.labelColor }">{{
+                  label
+                }}</span
+                ><i :class="field.options.labelIconClass"></i
               ></template>
             </template>
           </span>
           <span
-            v-if="!!field.options.labelColor"
+            v-else-if="!!field.options.labelColor"
             slot="label"
             :style="{ color: field.options.labelColor }"
           >
@@ -101,20 +133,29 @@
           </template>
           <template
             v-else-if="
-              field.options.widgetTextFlag === 3 && field.options.widgetTextLinkConfig
+              field.options.widgetTextFlag === 3 &&
+              field.options.widgetTextLinkConfig
             "
           >
             <div class="ellipsis">
               <a class="a-link" :class="getWidgetClass()" @click="handleClick">
                 <span>
                   <i
-                    :class="field.options.widgetTextLinkConfig.options.prefixIcon"
-                    v-if="!!field.options.widgetTextLinkConfig.options.prefixIcon"
+                    :class="
+                      field.options.widgetTextLinkConfig.options.prefixIcon
+                    "
+                    v-if="
+                      !!field.options.widgetTextLinkConfig.options.prefixIcon
+                    "
                   ></i>
                   <span>{{ getWidgetValue() }}</span>
                   <i
-                    :class="field.options.widgetTextLinkConfig.options.suffixIcon"
-                    v-if="!!field.options.widgetTextLinkConfig.options.suffixIcon"
+                    :class="
+                      field.options.widgetTextLinkConfig.options.suffixIcon
+                    "
+                    v-if="
+                      !!field.options.widgetTextLinkConfig.options.suffixIcon
+                    "
                   ></i>
                 </span>
               </a>
@@ -171,7 +212,10 @@
 
 <script>
 import i18n from "../../../../../components/xform/utils/i18n";
-import { getSubFormNameByFieldId } from "../../../../../components/xform/utils/util";
+import {
+  getSubFormNameByFieldId,
+  isVabsearchMultiWidget,
+} from "../../../../../components/xform/utils/util";
 
 export default {
   name: "form-item-wrapper",
@@ -225,7 +269,7 @@ export default {
     },
 
     label() {
-      if (!!this.field.options.labelHidden) {
+      if (this.shouldHideFieldLabel()) {
         return "";
       }
       return this.getI18nLabel(this.field.options.label);
@@ -234,7 +278,7 @@ export default {
     },
 
     labelWidth() {
-      if (!!this.field.options.labelHidden) {
+      if (this.shouldHideFieldLabel()) {
         return (!!this.designState ? 5 : 0) + "px"; //设计期间标签最小宽度5像素，以便于鼠标点击可选中组件！！
       }
 
@@ -286,6 +330,16 @@ export default {
     this.initShowType();
   },
   methods: {
+    shouldHideFieldLabel() {
+      if (!!this.field.options.labelHidden) {
+        return true;
+      }
+      // 仅 VXE 数据表格列内字段隐藏标签（表头已展示列名）；table2/table 等仍显示标签
+      return this.isDataTableColumnItem();
+    },
+    isDataTableColumnItem() {
+      return !!this.tableParam?.$table?.$parent?.$parent;
+    },
     isSubFormItem() {
       return !!this.tableParam;
     },
@@ -330,7 +384,10 @@ export default {
         }
 
         this.$nextTick(() => {
-          const l = getSubFormNameByFieldId(this.designer.widgetList, selectedId);
+          const l = getSubFormNameByFieldId(
+            this.designer.widgetList,
+            selectedId
+          );
           this.parentList.splice(this.indexOfParentList, 1);
           //if (!!nextSelected) {
           this.designer.setSelected(nextSelected);
@@ -341,25 +398,30 @@ export default {
         });
       }
     },
-    getIsFormItemUnabled() {
-      return this.field.type == "vabUpload" || this.field.type == "baseAttachment";
-    },
     getRules() {
-      if (this.getIsFormItemUnabled()) {
-        return null;
-      }
       return this.rules;
     },
     getPropName() {
-      if (this.getIsFormItemUnabled()) {
+      if (this.formItemProp === "false") {
+        return null;
+      }
+      // if (this.formItemProp) {
+      //   return this.formItemProp;
+      // }
+      if (this.tableParam && !this.tableParam.$table?.$parent?.$parent) {
+        if (this.formItemProp) {
+          return this.formItemProp;
+        }
         return null;
       }
-      if (this.formItemProp) {
-        return this.formItemProp;
+      if (this.tableParam && !!this.tableParam.$table?.$parent?.$parent) {
+        return this.getColumnProp(this.field, this.tableParam);
       }
       let o = this.field.options.name;
       let propName =
-        ((o = (this.field.options.keyNameEnabled && this.field.options.keyName) || o),
+        ((o =
+          (this.field.options.keyNameEnabled && this.field.options.keyName) ||
+          o),
         this.subFormItemFlag && !this.designState
           ? this.subFormName + "." + this.subFormRowIndex + "." + o
           : this.getObjectFieldFlag() && !this.designState
@@ -368,6 +430,49 @@ export default {
 
       return propName;
     },
+    getFieldKeyName(widget) {
+      let o = widget.options.name;
+      return (widget.options.keyNameEnabled && widget.options.keyName) || o;
+    },
+    isVabsearchFlagWidget(widget) {
+      let type = widget?.type;
+      return (
+        type === "vabsearch" ||
+        type === "singerSearch" ||
+        type === "multiSearch"
+      );
+    },
+    getColumnProp(rowWidget, obj) {
+      let required = rowWidget.options.required || false;
+
+      let tableRef = obj.$table.$parent.$parent;
+      let tableWidget = tableRef.widget;
+      let fieldKeyName = this.getFieldKeyName(tableWidget);
+      let property = this.getFieldKeyName(rowWidget);
+      if (
+        this.isVabsearchFlagWidget(rowWidget) &&
+        !isVabsearchMultiWidget(rowWidget)
+      ) {
+        property = rowWidget.options.vabSearchName || property;
+      }
+      let rowIndex = Math.max(obj.rowIndex, 0);
+
+      let isTreeTable = tableWidget.options.isTreeTable || false;
+      if (isTreeTable) {
+        rowIndex = tableRef
+          .getValue()
+          .findIndex((item) => item._X_ROW_KEY === obj.row._X_ROW_KEY);
+        if (rowIndex < 0) {
+          return "false";
+        }
+      }
+
+      let propName = fieldKeyName + "." + rowIndex + "." + property;
+      if (!required) {
+        propName = "false";
+      }
+      return propName;
+    },
     getI18nLabel(label, path, param) {
       return !this.designState && label ? this.$t2(label, path, param) : label;
     },
@@ -509,7 +614,8 @@ export default {
               : [];
 
             let flag1 = !item.serveName || item.serveName == bdService;
-            let flag2 = !companyCodes.length || companyCodes.includes(companyCode);
+            let flag2 =
+              !companyCodes.length || companyCodes.includes(companyCode);
             // let flag3 = !loginAccounts.length || loginAccounts.includes(loginAccount)
             // let flag4 = this.compareToList(saleOrgCodes, saleOrgCodeList)
             if (flag1 && flag2) {
@@ -543,13 +649,16 @@ export default {
     isShowWidget() {
       let widgetTextFlag = this.field.options.widgetTextFlag;
       return (
-        widgetTextFlag === undefined || widgetTextFlag === null || widgetTextFlag === 0
+        widgetTextFlag === undefined ||
+        widgetTextFlag === null ||
+        widgetTextFlag === 0
       );
     },
     getShowValue() {
       let widgetTextFlag = this.field.options.widgetTextFlag;
       let fieldModel = this.$parent.fieldModel;
-      if (this.$parent.fieldModelLabel) fieldModel = this.$parent.fieldModelLabel();
+      if (this.$parent.fieldModelLabel)
+        fieldModel = this.$parent.fieldModelLabel();
       let showValue = fieldModel;
       if (widgetTextFlag == 2) {
         showValue = this.getProcessText(showValue, this.encryptFormula);
@@ -568,13 +677,17 @@ export default {
     handleClick(event) {
       if (this.field.options.disabled) return;
       this.$parent.handleButtonWidgetClick(event, true);
-      if (!this.designState && this.field.options.widgetTextLinkConfig?.options.href) {
+      if (
+        !this.designState &&
+        this.field.options.widgetTextLinkConfig?.options.href
+      ) {
         window.open(this.field.options.widgetTextLinkConfig?.options.href);
       }
     },
     getWidgetValue() {
       let fieldModel = this.$parent.fieldModel;
-      if (this.$parent.fieldModelLabel) fieldModel = this.$parent.fieldModelLabel();
+      if (this.$parent.fieldModelLabel)
+        fieldModel = this.$parent.fieldModelLabel();
       return fieldModel;
     },
   },

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

@@ -1,27 +1,43 @@
 <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">
-    <template v-for="(item,index) in field.options.statusParam">
-      <template v-if="fieldModel===item[valueField]">
-        <span v-if="field.options.formScriptEnabled || field.options.commonAttributeEnabled"  :key="index" >{{ getI18nLabel(item[labelField]) }}</span>
-        <span v-else :key="index" class="list-tag" :class="item.type">{{ getI18nLabel(item[labelField]) }}</span>
+  <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"
+  >
+    <template v-for="(item, index) in field.options.statusParam">
+      <template v-if="fieldModel === item[valueField]">
+        <span
+          v-if="
+            field.options.formScriptEnabled ||
+            field.options.commonAttributeEnabled
+          "
+          :key="index"
+          >{{ getI18nLabel(item[labelField]) }}</span
+        >
+        <span v-else :key="index" class="list-tag" :class="item.type">{{
+          getI18nLabel(item[labelField])
+        }}</span>
       </template>
     </template>
   </form-item-wrapper>
 </template>
 
 <script>
-import emitter from '../../../../../components/xform/utils/emitter'
+import emitter from "../../../../../components/xform/utils/emitter";
 import i18n from "../../../../../components/xform/utils/i18n";
 import fieldMixin from "../../../../../components/xform/form-designer/form-widget/field-widget/fieldMixin";
-import FormItemWrapper
-  from "../../../../../components/xform/form-designer/form-widget/field-widget/form-item-wrapper.vue";
+import FormItemWrapper from "../../../../../components/xform/form-designer/form-widget/field-widget/form-item-wrapper.vue";
 
 export default {
   name: "status-widget",
-  componentName: 'FieldWidget',  //必须固定为FieldWidget，用于接收父级组件的broadcast事件
+  componentName: "FieldWidget", //必须固定为FieldWidget，用于接收父级组件的broadcast事件
   mixins: [emitter, fieldMixin, i18n],
   props: {
     field: Object,
@@ -32,28 +48,26 @@ export default {
 
     designState: {
       type: Boolean,
-      default: false
+      default: false,
     },
 
-    subFormRowIndex: { /* 子表单组件行索引，从0开始计数 */
-      type: Number,
-      default: -1
+    subFormRowIndex: {
+      /* 子表单组件行索引，从0开始计数 */ type: Number,
+      default: -1,
     },
-    subFormColIndex: { /* 子表单组件列索引，从0开始计数 */
-      type: Number,
-      default: -1
+    subFormColIndex: {
+      /* 子表单组件列索引，从0开始计数 */ type: Number,
+      default: -1,
     },
-    subFormRowId: { /* 子表单组件行Id，唯一id且不可变 */
-      type: String,
-      default: ''
+    subFormRowId: {
+      /* 子表单组件行Id，唯一id且不可变 */ type: String,
+      default: "",
     },
-
   },
   components: {
-    FormItemWrapper
-
+    FormItemWrapper,
   },
-  inject: ['refList', 'globalOptionData', 'globalModel', 'getFormConfig'],
+  inject: ["refList", "globalOptionData", "globalModel", "getFormConfig"],
   data() {
     return {
       oldFieldValue: [], //field组件change之前的值
@@ -62,55 +76,56 @@ export default {
       isH5: false,
       option: {},
       statusParam: [],
-    }
+    };
   },
   computed: {
-    labelField(){
+    labelField() {
       return this.getOptionItemLabelKey();
     },
-    valueField(){
+    valueField() {
       return this.getOptionItemValueKey();
-    }
+    },
   },
   watch: {
     fieldModel(val) {
       this.handleChangeEvent(val);
-    }
+    },
   },
   beforeCreate() {
     /* 这里不能访问方法和属性！！ */
   },
 
   created() {
-
     /* 注意：子组件mounted在父组件created之后、父组件mounted之前触发，故子组件mounted需要用到的prop
        需要在父组件created中初始化！！ */
     this.initStatusForDesign();
 
-    this.initFieldModel()
-    this.registerToRefList()
-    this.initEventHandler()
-    this.buildFieldRules()
+    this.initFieldModel();
+    this.registerToRefList();
+    this.initEventHandler();
+    this.buildFieldRules();
 
-    this.handleOnCreated()
-    this.initOptionItemsHandle()
+    this.handleOnCreated();
+    this.initOptionItemsHandle();
     // this.initStatusParam();
   },
 
   mounted() {
-    this.handleOnMounted()
+    this.handleOnMounted();
   },
 
   beforeDestroy() {
-    this.unregisterFromRefList()
+    this.unregisterFromRefList();
   },
   methods: {
     initStatusForDesign() {
       if (this.designState) {
         let value = null;
         let statusParam = this.field.options.statusParam;
+        let valueField = this.valueField;
         if (statusParam.length) {
-          value = this.field.options.defaultValue ?? (statusParam[0].value ?? 0)
+          value =
+            this.field.options.defaultValue ?? statusParam[0][valueField] ?? 0;
         } else {
           value = 0;
         }
@@ -124,14 +139,18 @@ export default {
     getFieldModelLabel() {
       let label = null;
       let fieldModel = this.fieldModel;
-      let item = this.field.options.statusParam.find(item => item.value === fieldModel)
+      let valueField = this.valueField;
+      let labelField = this.labelField;
+      let item = this.field.options.statusParam.find(
+        (item) => item[valueField] === fieldModel
+      );
       if (item) {
-        label = this.getI18nLabel(item.label);
+        label = this.getI18nLabel(item[labelField]);
       }
       return label;
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>