cloud-web-corejs 1.1.0-dev.56 → 1.1.0-dev.59

package/src/components/xform/form-designer/setting-panel/form-setting.vue

@@ -9,27 +9,17 @@
       @submit.native.prevent
     >
       <el-collapse v-model="formActiveCollapseNames" class="setting-collapse">
-        <el-collapse-item
-          name="1"
-          :title="i18nt('designer.setting.basicSetting')"
-        >
-          <el-form-item
-            v-if="formConfig.layoutType === 'PC'"
-            class="form-item-label-top"
-            label="业务弹框作用域"
-          >
-            <el-radio-group v-model="dialogScopeValue">
-              <el-radio label="global">全局</el-radio>
-              <el-radio label="page">当前页面</el-radio>
-            </el-radio-group>
-            <div style="line-height: 1.6; color: #909399; font-size: 12px">
-              列表和详情模板需分别设置。当前页面模式只遮挡表单内容，顶部页签和左侧菜单仍可操作。
-            </div>
-          </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('数据库表')">
+        <el-collapse-item
+          name="1"
+          :title="i18nt('designer.setting.basicSetting')"
+        >
+          <el-form-item class="form-item-label-top" :label="i18nt('数据库表')">
             <el-input type="text" v-model="formConfig.entity"></el-input>
           </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('数据保存脚本编码')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('数据保存脚本编码')"
+          >
             <el-input
               type="text"
               v-model="formConfig.saveScriptCode"
@@ -67,12 +57,28 @@
               {{ i18nt("designer.setting.addCss") }}
             </el-button>
           </el-form-item>
+          <el-form-item
+            v-if="formConfig.layoutType === 'PC'"
+            class="form-item-label-top"
+            label="业务弹框作用域"
+          >
+            <el-radio-group v-model="dialogScopeValue">
+              <el-radio label="global">全局</el-radio>
+              <el-radio label="page">当前页面</el-radio>
+            </el-radio-group>
+            <div style="line-height: 1.6; color: #909399; font-size: 12px">
+              列表和详情模板需分别设置。当前页面模式只遮挡表单内容，顶部页签和左侧菜单仍可操作。
+            </div>
+          </el-form-item>
         </el-collapse-item>
         <el-collapse-item name="2" title="详情表单信息">
           <el-form-item :label="i18nt('加载详情数据')">
             <el-switch v-model="formConfig.isLoadEntity"></el-switch>
           </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('详情数据脚本编码')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('详情数据脚本编码')"
+          >
             <el-input
               type="text"
               v-model="formConfig.formScriptCode"
@@ -99,7 +105,10 @@
               <i class="el-icon-edit"></i>
             </a>
           </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('查看页面表单编码')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('查看页面表单编码')"
+          >
             <el-input
               class="search-input"
               max="200"
@@ -121,7 +130,10 @@
           <el-form-item :label="i18nt('查看页面表单名称')">
             {{ formConfig.editFormName }}
           </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('新增页面表单编码')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('新增页面表单编码')"
+          >
             <el-input
               class="search-input"
               max="200"
@@ -215,24 +227,27 @@
               @change="changeWfEnabled"
             ></el-switch>
           </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('默认流程单据类型名称')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('默认流程单据类型名称')"
+          >
             <el-input
               type="text"
               v-model="designer.vueInstance.reportTemplate.objTypeName"
             ></el-input>
-          </el-form-item>
-          <el-form-item v-if="formConfig.wfEnabled" label="隐藏流程信息的角色">
-            <el-input
-              :value="formConfig.wfInfoHiddenRoleCodes"
-              @input="$set(formConfig, 'wfInfoHiddenRoleCodes', $event)"
-              placeholder="角色编码，多个用英文逗号分隔"
-              clearable
-            />
-            <div style="line-height: 1.6; color: #909399; font-size: 12px">
-              当前公司角色命中任意编码时，隐藏流程信息及审批入口，保留启动流程按钮；脚本可调用
-              this.setWfInfoHidden(true/false)。
-            </div>
-          </el-form-item>
+          </el-form-item>
+          <el-form-item v-if="formConfig.wfEnabled" label="隐藏流程信息的角色">
+            <el-input
+              :value="formConfig.wfInfoHiddenRoleCodes"
+              @input="$set(formConfig, 'wfInfoHiddenRoleCodes', $event)"
+              placeholder="角色编码，多个用英文逗号分隔"
+              clearable
+            />
+            <div style="line-height: 1.6; color: #909399; font-size: 12px">
+              当前公司角色命中任意编码时，隐藏流程信息及审批入口，保留启动流程按钮；脚本可调用
+              this.setWfInfoHidden(true/false)。
+            </div>
+          </el-form-item>
           <el-form-item>
             <span slot="label"
               >流程主题
@@ -365,7 +380,10 @@
           </el-form-item>
 
           <div class="wf-group-title">高级</div>
-          <el-form-item class="form-item-label-top" :label="i18nt('引用流程的表单编码')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('引用流程的表单编码')"
+          >
             <el-input
               type="text"
               v-model="designer.vueInstance.reportTemplate.fromWfFormCode"
@@ -385,16 +403,24 @@
         <el-collapse-item name="4" title="列表标签页信息（仅列表表单生效）">
           <el-form-item label-width="0">
             <el-tooltip placement="left" popper-class="xform-setting-help">
-            <span slot="content">
-              本组配置只从「查询列表页」所用的表单读取，在详情/编辑表单里设置不会生效
-            </span>
-            <span>适用范围<i class="el-icon-info setting-help-icon" tabindex="0"></i></span>
+              <span slot="content">
+                本组配置只从「查询列表页」所用的表单读取，在详情/编辑表单里设置不会生效
+              </span>
+              <span
+                >适用范围<i
+                  class="el-icon-info setting-help-icon"
+                  tabindex="0"
+                ></i
+              ></span>
             </el-tooltip>
           </el-form-item>
           <el-form-item :label="i18nt('列表启用详情多标签')">
             <el-switch v-model="formConfig.multiTabEnabled"></el-switch>
           </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('标签名称字段')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('标签名称字段')"
+          >
             <el-input
               type="text"
               v-model="formConfig.multiTabLabelField"
@@ -407,15 +433,32 @@
           >
             <el-switch v-model="formConfig.addTabEnabled"></el-switch>
             <span style="margin-left: 8px; color: #999; font-size: 12px">
-              <el-tooltip content="开启后新增打开独立可关闭页签，需配置标签名称字段。" placement="left" popper-class="xform-setting-help">
-                <i class="el-icon-info setting-help-icon" tabindex="0" aria-label="新增页签说明"></i>
+              <el-tooltip
+                content="开启后新增打开独立可关闭页签，需配置标签名称字段。"
+                placement="left"
+                popper-class="xform-setting-help"
+              >
+                <i
+                  class="el-icon-info setting-help-icon"
+                  tabindex="0"
+                  aria-label="新增页签说明"
+                ></i>
               </el-tooltip>
             </span>
           </el-form-item>
           <el-form-item class="stacked-setting submit-behavior-setting">
-            <span slot="label">{{ i18nt('流程启动后行为') }}
-              <el-tooltip content="详情页保存并提交、直接启动流程成功后的行为，不填默认刷新当前页签。" placement="left" popper-class="xform-setting-help">
-                <i class="el-icon-info setting-help-icon" tabindex="0" aria-label="流程启动后行为说明"></i>
+            <span slot="label"
+              >{{ i18nt("流程启动后行为") }}
+              <el-tooltip
+                content="详情页保存并提交、直接启动流程成功后的行为，不填默认刷新当前页签。"
+                placement="left"
+                popper-class="xform-setting-help"
+              >
+                <i
+                  class="el-icon-info setting-help-icon"
+                  tabindex="0"
+                  aria-label="流程启动后行为说明"
+                ></i>
               </el-tooltip>
             </span>
             <el-radio-group v-model="formConfig.submitBehavior">
@@ -425,7 +468,10 @@
           </el-form-item>
         </el-collapse-item>
         <el-collapse-item name="5" title="其他标签页信息">
-          <el-form-item class="form-item-label-top" :label="i18nt('自定义列表标签名称')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('自定义列表标签名称')"
+          >
             <el-input
               type="text"
               v-model="formConfig.customListTabLabel"
@@ -438,7 +484,10 @@
           <el-form-item :label="i18nt('隐藏常规标签')">
             <el-switch v-model="formConfig.hideNormalTab"></el-switch>
           </el-form-item>
-          <el-form-item :label="i18nt('其他标签页配置')" class="stacked-setting other-tabs-setting">
+          <el-form-item
+            :label="i18nt('其他标签页配置')"
+            class="stacked-setting other-tabs-setting"
+          >
             <div>
               <draggable
                 tag="ul"
@@ -491,7 +540,10 @@
             >
             </el-input>
           </el-form-item>
-          <el-form-item class="form-item-label-top" :label="i18nt('数据唯一标识')">
+          <el-form-item
+            class="form-item-label-top"
+            :label="i18nt('数据唯一标识')"
+          >
             <el-input
               class="search-input"
               max="200"
@@ -1286,16 +1338,16 @@ $\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_pr
       this.designer.emitEvent("form-css-updated", deepClone(this.cssClassList));
     });
   },
-  computed: {
-    dialogScopeValue: {
-      get() {
-        return this.formConfig.dialogScope === "page" ? "page" : "global";
-      },
-      set(value) {
-        this.$set(this.formConfig, "dialogScope", value);
-      },
-    },
-    // formDialog/formDrawer 底部操作按钮配置（存 formConfig，随模板保存）
+  computed: {
+    dialogScopeValue: {
+      get() {
+        return this.formConfig.dialogScope === "page" ? "page" : "global";
+      },
+      set(value) {
+        this.$set(this.formConfig, "dialogScope", value);
+      },
+    },
+    // formDialog/formDrawer 底部操作按钮配置（存 formConfig，随模板保存）
     actionButtons() {
       return this.formConfig.actionButtons || [];
     },
@@ -1754,7 +1806,7 @@ $\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_pr
 
 <style lang="scss" scoped>
 .setting-form {
-  ::v-deep .el-form-item{
+  ::v-deep .el-form-item {
     .el-form-item__label {
       font-size: 13px;
       //text-overflow: ellipsis;
@@ -1764,11 +1816,20 @@ $\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_pr
     &.el-form-item--mini.el-form-item {
       margin-bottom: 6px;
     }
-    &.el-form-item-second{
-      .el-form-item__label{
-        padding-left:4px;
-        &:before{content:"";width:5px;height:2px;background:#FF4D4F;display:inline-block;margin-right:4px;}
-        span{flex:1}
+    &.el-form-item-second {
+      .el-form-item__label {
+        padding-left: 4px;
+        &:before {
+          content: "";
+          width: 5px;
+          height: 2px;
+          background: #ff4d4f;
+          display: inline-block;
+          margin-right: 4px;
+        }
+        span {
+          flex: 1;
+        }
       }
     }
   }
@@ -1800,24 +1861,33 @@ $\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_pr
   margin: 16px 0 8px;
   padding-left: 8px;
   //border-left: 3px solid #0073E5;
-  color: rgba(0,0,0,.65);
+  color: rgba(0, 0, 0, 0.65);
   font-size: 13px;
   font-weight: 600;
   line-height: 1.3;
-  background: rgba(0,0,0,0.04);
+  background: rgba(0, 0, 0, 0.04);
   padding: 4px 0 4px 8px;
   &:first-child {
     margin-top: 0;
   }
-  ~ .el-form-item{
-    .el-form-item__label{
-      padding-left:4px;
-      &:before{content:"";width:5px;height:2px;background:#0073e5;display:inline-block;margin-right:4px;}
-      span{flex:1}
+  ~ .el-form-item {
+    .el-form-item__label {
+      padding-left: 4px;
+      &:before {
+        content: "";
+        width: 5px;
+        height: 2px;
+        background: #0073e5;
+        display: inline-block;
+        margin-right: 4px;
+      }
+      span {
+        flex: 1;
+      }
     }
-    &.form-item-label-red{
-      .el-form-item__label:before{
-        background:#FF4D4F
+    &.form-item-label-red {
+      .el-form-item__label:before {
+        background: #ff4d4f;
       }
     }
   }
@@ -1851,12 +1921,32 @@ $\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_pr
   }
   .el-form-item__content > .el-input,
   .el-form-item__content > .el-select,
-  .el-form-item__content > .el-textarea { width: 100% !important; min-width: 0; }
-  .el-form-item__content > .el-select { width: calc(100% - 28px) !important; }
-  .el-form-item__content > a { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
-  .el-radio { margin: 0 12px 4px 0; white-space: normal; line-height: 22px; }
-  .el-collapse-item__header { height: auto; min-height: 42px; line-height: 22px; padding: 8px 0; }
-  .el-collapse-item__arrow { flex-shrink: 0; }
+  .el-form-item__content > .el-textarea {
+    width: 100% !important;
+    min-width: 0;
+  }
+  .el-form-item__content > .el-select {
+    width: calc(100% - 28px) !important;
+  }
+  .el-form-item__content > a {
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  .el-radio {
+    margin: 0 12px 4px 0;
+    white-space: normal;
+    line-height: 22px;
+  }
+  .el-collapse-item__header {
+    height: auto;
+    min-height: 42px;
+    line-height: 22px;
+    padding: 8px 0;
+  }
+  .el-collapse-item__arrow {
+    flex-shrink: 0;
+  }
   .el-form-item.stacked-setting {
     display: block !important;
     > .el-form-item__label {
@@ -1865,11 +1955,26 @@ $\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_pr
       width: 100% !important;
       padding: 0 0 8px;
     }
-    > .el-form-item__content { margin-left: 0 !important; width: 100%; }
+    > .el-form-item__content {
+      margin-left: 0 !important;
+      width: 100%;
+    }
+  }
+  .submit-behavior-setting .el-radio-group {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+  .submit-behavior-setting .el-radio {
+    display: flex;
+    align-items: baseline;
+    margin: 0;
+  }
+  .other-tabs-list {
+    padding: 0;
+    margin: 0;
+    width: 100%;
   }
-  .submit-behavior-setting .el-radio-group { display: flex; flex-direction: column; gap: 8px; }
-  .submit-behavior-setting .el-radio { display: flex; align-items: baseline; margin: 0; }
-  .other-tabs-list { padding: 0; margin: 0; width: 100%; }
   .other-tabs-list > li {
     display: grid;
     grid-template-columns: 18px minmax(0, 1fr) 28px;
@@ -1881,12 +1986,42 @@ $\{wf.starterName\}提交的$\{pm_product_project.product_code\}$\{pm_product_pr
     background: #f5f7fa;
     border-radius: 4px;
   }
-  .other-tabs-list > li > .el-input { grid-column: 2; width: 100% !important; min-width: 0; margin: 0; }
-  .other-tabs-list .drag-option { grid-column: 1; grid-row: 1 / 3; cursor: move; color: #909399; }
-  .other-tabs-list .col-delete-button { grid-column: 3; grid-row: 1 / 3; margin: 0; padding: 6px; }
-  .tree-options-error { overflow-wrap: anywhere; margin-bottom: 8px; }
+  .other-tabs-list > li > .el-input {
+    grid-column: 2;
+    width: 100% !important;
+    min-width: 0;
+    margin: 0;
+  }
+  .other-tabs-list .drag-option {
+    grid-column: 1;
+    grid-row: 1 / 3;
+    cursor: move;
+    color: #909399;
+  }
+  .other-tabs-list .col-delete-button {
+    grid-column: 3;
+    grid-row: 1 / 3;
+    margin: 0;
+    padding: 6px;
+  }
+  .tree-options-error {
+    overflow-wrap: anywhere;
+    margin-bottom: 8px;
+  }
+}
+.setting-help-icon {
+  margin-left: 8px;
+  color: #909399;
+  cursor: help;
+  font-size: 14px;
+}
+.setting-help-icon:hover,
+.setting-help-icon:focus {
+  color: #409eff;
+}
+.el-tooltip__popper.xform-setting-help {
+  max-width: 300px;
+  line-height: 1.7;
+  overflow-wrap: anywhere;
 }
-.setting-help-icon { margin-left: 8px; color: #909399; cursor: help; font-size: 14px; }
-.setting-help-icon:hover, .setting-help-icon:focus { color: #409eff; }
-.el-tooltip__popper.xform-setting-help { max-width: 300px; line-height: 1.7; overflow-wrap: anywhere; }
 </style>

package/src/components/xform/form-designer/setting-panel/property-editor/container-tab/tab-lazyRender-editor.vue

@@ -0,0 +1,27 @@
+<template>
+  <el-form-item class="form-item-label-top" :label="i18nt('designer.setting.lazyRender')">
+    <el-switch v-model="optionModel.lazyRender"></el-switch>
+    <el-tooltip placement="bottom" effect="light" :content="i18nt('designer.setting.lazyRenderHint')">
+      <i class="el-icon-info" style="margin-left: 4px"></i>
+    </el-tooltip>
+  </el-form-item>
+</template>
+
+<script>
+  import i18n from "../../../../../../components/xform/utils/i18n";
+
+  export default {
+    name: "tab-lazyRender-editor",
+    componentName: 'PropertyEditor',
+    mixins: [i18n],
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>

package/src/components/xform/form-designer/setting-panel/property-editor/event-handler/onTabChange-editor.vue

@@ -0,0 +1,28 @@
+<template>
+  <el-form-item label="onTabChange" label-width="150px">
+    <a href="javascript:void(0);" class="a-link link-oneLind" @click="editEventHandler('onTabChange', eventParams)">
+      <span>{{ optionModel.onTabChange }}</span>
+      <i class="el-icon-edit"></i>
+    </a>
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "../../../../../../components/xform/utils/i18n";
+import eventMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/event-handler/eventMixin";
+
+export default {
+  name: "onTabChange-editor",
+  mixins: [i18n, eventMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  data() {
+    return { eventParams: ["name", "oldName"] };
+  },
+};
+</script>
+
+<style scoped></style>

package/src/components/xform/form-designer/setting-panel/property-editor/event-handler/onTabClick-editor.vue

@@ -0,0 +1,28 @@
+<template>
+  <el-form-item label="onTabClick" label-width="150px">
+    <a href="javascript:void(0);" class="a-link link-oneLind" @click="editEventHandler('onTabClick', eventParams)">
+      <span>{{ optionModel.onTabClick }}</span>
+      <i class="el-icon-edit"></i>
+    </a>
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "../../../../../../components/xform/utils/i18n";
+import eventMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/event-handler/eventMixin";
+
+export default {
+  name: "onTabClick-editor",
+  mixins: [i18n, eventMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  data() {
+    return { eventParams: ["name", "index", "label"] };
+  },
+};
+</script>
+
+<style scoped></style>

package/src/components/xform/form-designer/setting-panel/property-editor/project-tag-editor.vue

@@ -312,7 +312,7 @@ export default {
       return this.selectedWidget.type !== "data-table";
     },
     openDialog() {
-      this.tableData = this.$baseLodash.cloneDeep(this.optionModel.tagFillConfig);
+      this.tableData = this.$baseLodash.cloneDeep(this.optionModel.tagFillConfig || []);
       this.showDialog = true;
     },
     confirmDialog() {
@@ -320,9 +320,7 @@ export default {
       this.showDialog = false;
     },
 
-    openDialog() {
-      let reportTemplate = this.getReportTemplate();
-      let objTypeCode = reportTemplate.objTypeCode;
+    openWorkflowDialog() {
       let wfConfigData = this.optionModel.wfConfigData || [];
       this.dialogVisible = true;
       this.tableData = this.$baseLodash.cloneDeep(wfConfigData);

package/src/components/xform/form-designer/setting-panel/propertyRegister.js

@@ -87,6 +87,7 @@ const COMMON_PROPERTIES = {
   descriptionsItems: "descriptionsItems-editor",
   isFullscreen: "isFullscreen-editor",
   tabClass: "tabClass-editor",
+  lazyRender: "tab-lazyRender-editor",
   censusClass: "censusClass-editor",
   // 'scriptUuid': 'script-editor',
   entityTableCode: "entityTableCode-editor",
@@ -290,6 +291,10 @@ const EVENT_PROPERTIES = {
   onLoadNode: "onLoadNode-editor",
   //tree-pane事件
   onTreeLabelClick: "onTreeLabelClick-editor",
+
+  //tab事件
+  onTabClick: "onTabClick-editor",
+  onTabChange: "onTabChange-editor",
 };
 
 /**
@@ -328,9 +333,9 @@ export function registerEventProperty(uniquePropName, propEditorName) {
  */
 export function propertyRegistered(uniquePropName) {
   return (
-    !!COMMON_PROPERTIES[uniquePropName] ||
-    !!ADVANCED_PROPERTIES[uniquePropName] ||
-    !!EVENT_PROPERTIES[uniquePropName]
+    !!COMMON_PROPERTIES[uniquePropName]
+    || !!ADVANCED_PROPERTIES[uniquePropName]
+    || !!EVENT_PROPERTIES[uniquePropName]
   );
 }
 

package/src/components/xform/form-designer/widget-panel/widgetsConfig.js

@@ -98,6 +98,15 @@ export const containers = [
       height: "",
       // isFullscreen: false,
       tabClass: "tab-boxCard tabCard-sty1",
+      // 懒渲染：页签内容首次激活才挂载(element lazy)。默认关闭——开启前需确认表单
+      // 无跨页签 getWidgetRef 脚本、未访问页签字段无需参与提交校验(详情类模板适用)。
+      lazyRender: !1,
+      // 页签事件脚本：点击/切换页签时的联动入口(懒渲染后"切到页签再刷新数据"的挂钩)
+      onTabClick: "",
+      onTabChange: "",
+      // 容器生命周期脚本(与 detail 等容器同口径,由 containerItemMixin 的 handleOnCreated/Mounted 执行)
+      onCreated: "",
+      onMounted: "",
       customClass: "",
       ...defaultWfConfig,
     },