cloud-web-corejs 1.0.54-dev.80 → 1.0.54-dev.800

package/src/components/xform/form-designer/setting-panel/property-editor/container-table/table-dynamicField-editor.vue

@@ -0,0 +1,344 @@
+<template>
+  <div class="table-dynamic-field-editor">
+    <el-form-item label-width="0">
+      <el-divider class="custom-divider-margin-top">
+        动态字段
+        <el-tooltip effect="light" placement="top">
+          <div slot="content" class="field-tip-content">
+            字段「显隐/必填/只读/禁用/取值」等动态规则请到「表单设置 -
+            动态字段规则」统一配置
+          </div>
+          <i class="el-icon-info label-tip-icon"></i>
+        </el-tooltip>
+      </el-divider>
+    </el-form-item>
+    <el-form-item label="动态字段来源">
+      <el-radio-group v-model="optionModel.dynamicSchemaSourceType">
+        <el-radio label="none">无</el-radio>
+        <el-radio label="script">前端字段脚本</el-radio>
+        <el-radio label="api">接口动态字段</el-radio>
+      </el-radio-group>
+    </el-form-item>
+    <div
+      v-if="optionModel.dynamicSchemaSourceType === 'script'"
+      class="dynamic-column-block"
+    >
+      <div class="form-section-label">
+        前端字段脚本
+        <el-tooltip effect="light" placement="top">
+          <div slot="content" class="field-tip-content">
+            不调接口，脚本直接 return 字段定义数组或 { fields: [...] }
+          </div>
+          <i class="el-icon-info label-tip-icon"></i>
+        </el-tooltip>
+      </div>
+      <div class="data-table-editor-subsection">
+        <el-form-item label="字段脚本">
+          <a
+            href="javascript:void(0);"
+            class="a-link link-oneLind"
+            @click="editEventHandler('dynamicSchemaScript', defaultEventParams)"
+          >
+            <span>{{ optionModel.dynamicSchemaScript }}</span>
+            <i class="el-icon-edit"></i>
+          </a>
+        </el-form-item>
+      </div>
+    </div>
+    <div
+      v-if="optionModel.dynamicSchemaSourceType === 'api'"
+      class="dynamic-column-block"
+    >
+      <div class="form-section-label">
+        接口动态字段
+        <el-tooltip effect="light" placement="top">
+          <div slot="content" class="field-tip-content">
+            打开表单时请求后台脚本，返回字段定义（格式与数据表格动态列一致，详见
+            docs/后台字段（动态生成）JSON 说明.md）
+          </div>
+          <i class="el-icon-info label-tip-icon"></i>
+        </el-tooltip>
+      </div>
+      <div class="data-table-editor-subsection">
+        <el-form-item class="form-item-label-top" label="脚本编码">
+          <el-input
+            v-model="optionModel.dynamicSchemaScriptCode"
+            clearable
+            placeholder="scriptCode 或 formCode/scriptCode"
+          ></el-input>
+        </el-form-item>
+        <el-form-item>
+          <span slot="label">
+            额外参数
+            <el-tooltip effect="light" placement="top">
+              <div slot="content" class="field-tip-content">
+                格式： return { bizType: this.formModel.type }
+              </div>
+              <i class="el-icon-info label-tip-icon"></i>
+            </el-tooltip>
+          </span>
+          <a
+            href="javascript:void(0);"
+            class="a-link link-oneLind"
+            @click="
+              editEventHandler('dynamicSchemaScriptParam', tableConfigParams)
+            "
+          >
+            <span>{{ optionModel.dynamicSchemaScriptParam }}</span>
+            <i class="el-icon-edit"></i>
+          </a>
+        </el-form-item>
+        <el-form-item>
+          <span slot="label">
+            转换脚本
+            <el-tooltip effect="light" placement="top">
+              <div slot="content" class="field-tip-content">
+                可选。入参 res，返回标准定义数组；不填时默认取
+                res.objx（数组）或 res.objx.fields / res.objx.columns
+              </div>
+              <i class="el-icon-info label-tip-icon"></i>
+            </el-tooltip>
+          </span>
+          <a
+            href="javascript:void(0);"
+            class="a-link link-oneLind"
+            @click="editDynamicSchemaConvert"
+          >
+            <span>{{ dynamicSchemaConvertDisplay }}</span>
+            <i class="el-icon-edit"></i>
+          </a>
+        </el-form-item>
+      </div>
+    </div>
+    <div
+      v-if="optionModel.dynamicSchemaSourceType !== 'none'"
+      class="dynamic-column-block"
+    >
+      <div class="data-table-editor-subsection">
+        <el-form-item>
+          <span slot="label">
+            加载条件
+            <el-tooltip effect="light" placement="top">
+              <div slot="content" class="field-tip-content">
+                表单初始化加载动态字段前执行。<br />
+                <code>return false</code> 时不加载；不配置则默认加载。
+              </div>
+              <i class="el-icon-info label-tip-icon"></i>
+            </el-tooltip>
+          </span>
+          <a
+            href="javascript:void(0);"
+            class="a-link link-oneLind"
+            @click="
+              editEventHandler('dynamicSchemaLoadScript', tableConfigParams)
+            "
+          >
+            <span>{{ optionModel.dynamicSchemaLoadScript }}</span>
+            <i class="el-icon-edit"></i>
+          </a>
+        </el-form-item>
+      </div>
+    </div>
+    <el-form-item class="form-item-label-top" v-if="optionModel.dynamicSchemaSourceType !== 'none'">
+      <span slot="label">
+        生成模式
+        <el-tooltip effect="light" placement="top">
+          <div slot="content" class="field-tip-content">
+            对<strong>生效的动态字段</strong>与静态字段的合并方式：<br />
+            追加 — 静态字段 + 动态字段；替换 — 仅动态字段；锚点插入 —
+            插到占位行位置。
+          </div>
+          <i class="el-icon-info label-tip-icon"></i>
+        </el-tooltip>
+      </span>
+      <el-select v-model="optionModel.dynamicSchemaMode" style="width: 100%">
+        <el-option label="追加到静态字段" value="append"></el-option>
+        <el-option label="替换静态字段" value="replace"></el-option>
+        <el-option label="锚点插入" value="anchor"></el-option>
+      </el-select>
+    </el-form-item>
+    <template v-if="optionModel.dynamicSchemaSourceType !== 'none'">
+      <template v-if="optionModel.dynamicSchemaMode === 'anchor'">
+        <el-form-item class="form-item-label-top">
+          <span slot="label">
+            占位锚点行
+            <el-tooltip effect="light" placement="top">
+              <div slot="content" class="field-tip-content">
+                建议预留一个空行作为占位锚点
+              </div>
+              <i class="el-icon-info label-tip-icon"></i>
+            </el-tooltip>
+          </span>
+          <el-select
+            v-model="optionModel.dynamicSchemaAnchorRowId"
+            style="width: 100%"
+            placeholder="选择设计期的占位行"
+          >
+            <el-option
+              v-for="r in rowOptions"
+              :key="r.value"
+              :label="r.label"
+              :value="r.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item class="form-item-label-top" label="插入位置">
+          <el-select
+            v-model="optionModel.dynamicSchemaAnchorPosition"
+            style="width: 100%"
+          >
+            <el-option label="替换占位行" value="replace"></el-option>
+            <el-option label="之前" value="before"></el-option>
+            <el-option label="之后" value="after"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <span slot="label">
+            继承行布局
+            <el-tooltip effect="light" placement="top">
+              <div slot="content" class="field-tip-content">
+                开启后生成行沿用占位行的单元格数量/宽度/跨列，否则按「每行列数」平铺
+              </div>
+              <i class="el-icon-info label-tip-icon"></i>
+            </el-tooltip>
+          </span>
+          <el-switch
+            v-model="optionModel.dynamicSchemaInheritLayout"
+          ></el-switch>
+        </el-form-item>
+      </template>
+      <el-form-item
+        v-if="
+          optionModel.dynamicSchemaMode !== 'anchor' ||
+          !optionModel.dynamicSchemaInheritLayout
+        "
+        label="每行列数"
+      >
+        <el-input-number
+          v-model="optionModel.dynamicSchemaColumns"
+          :min="1"
+          :max="12"
+          controls-position="right"
+          style="width: 100%"
+        ></el-input-number>
+      </el-form-item>
+    </template>
+  </div>
+</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: "table-dynamicField-editor",
+  mixins: [i18n, eventMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  data() {
+    return {
+      tableConfigParams: ["dataId", "formCode"],
+      defaultEventParams: ["dataId", "formCode"],
+    };
+  },
+  created() {
+    if (this.optionModel.dynamicSchemaSourceType === undefined) {
+      const legacyEnabled = this.optionModel.dynamicSchemaEnabled;
+      this.$set(
+        this.optionModel,
+        "dynamicSchemaSourceType",
+        legacyEnabled ? "api" : "none"
+      );
+    }
+    if (this.optionModel.dynamicSchemaScript === undefined) {
+      this.$set(this.optionModel, "dynamicSchemaScript", null);
+    }
+    if (this.optionModel.dynamicSchemaLoadScript === undefined) {
+      this.$set(this.optionModel, "dynamicSchemaLoadScript", null);
+    }
+  },
+  computed: {
+    dynamicSchemaConvertDisplay() {
+      return this.optionModel.dynamicSchemaConvert || "";
+    },
+    rowOptions() {
+      const rows = (this.selectedWidget && this.selectedWidget.rows) || [];
+      return rows.map((row, idx) => {
+        const fields = [];
+        (row.cols || []).forEach((cell) => {
+          this.collectFields(cell.widgetList || [], fields);
+        });
+        const names = fields
+          .map((w) => w.options.label || w.options.name)
+          .filter((n) => !!n);
+        const preview = names.length ? names.join("、") : "空行";
+        return { label: "第" + (idx + 1) + "行：" + preview, value: row.id };
+      });
+    },
+  },
+  methods: {
+    editDynamicSchemaConvert() {
+      this.editEventHandler("dynamicSchemaConvert", ["res"]);
+    },
+    collectFields(list, out) {
+      (list || []).forEach((w) => {
+        if (!w) return;
+        if (w.category === "container") {
+          if (Array.isArray(w.rows)) {
+            w.rows.forEach((row) =>
+              this.collectFields((row && row.cols) || [], out)
+            );
+          }
+          ["cols", "tabs", "widgetList", "panes", "buttonWidgetList"].forEach(
+            (k) => {
+              if (Array.isArray(w[k])) this.collectFields(w[k], out);
+            }
+          );
+        } else if (w.formItemFlag) {
+          out.push(w);
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.data-table-editor-subsection {
+  margin: 0 0 4px 8px;
+  padding-left: 12px;
+  border-left: 2px solid #ebeef5;
+}
+
+.form-section-label {
+  font-size: 13px;
+  font-weight: 500;
+  color: #303133;
+  line-height: 22px;
+  margin-bottom: 8px;
+}
+
+.label-tip-icon {
+  margin-left: 4px;
+  color: #909399;
+  cursor: pointer;
+  font-size: 14px;
+  vertical-align: middle;
+}
+
+.field-tip-content {
+  line-height: 1.4;
+  max-width: 320px;
+}
+
+.dynamic-column-block {
+  margin-bottom: 12px;
+}
+
+.dynamic-column-block .data-table-editor-subsection {
+  margin-top: 0;
+}
+</style>

package/src/components/xform/form-designer/setting-panel/property-editor/container-table-cell/cellHeight-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.cellHeight')">
+  <el-form-item :label="i18nt('designer.setting.cellHeight')" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.cellHeight"></el-input>
   </el-form-item>
 </template>

package/src/components/xform/form-designer/setting-panel/property-editor/container-table-cell/cellWidth-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.cellWidth')">
+  <el-form-item :label="i18nt('designer.setting.cellWidth')" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.cellWidth"></el-input>
   </el-form-item>
 </template>

package/src/components/xform/form-designer/setting-panel/property-editor/container-tree/tree-customClass-editor.vue

@@ -1,22 +1,51 @@
 <template>
   <div>
-    <el-form-item :label="i18nt('designer.setting.customClass')">
+    <el-form-item :label="i18nt('designer.setting.customClass')" class="form-item-label-top">
       <el-select v-model="optionModel.customClass" multiple filterable allow-create
                  default-first-option>
         <el-option v-for="(item, idx) in cssClassList" :key="idx" :label="item" :value="item"></el-option>
       </el-select>
     </el-form-item>
+    <el-form-item label="禁用本地筛选">
+      <el-switch v-model="optionModel.disLocalFilter"></el-switch>
+    </el-form-item>
+    <el-form-item label="筛选类型" class="form-item-label-top">
+      <el-select v-model="optionModel.treeFilterType">
+        <el-option :value="0" label="文本"></el-option>
+        <el-option :value="1" label="日期"></el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="筛选图标点击事件">
+      <a
+        href="javascript:void(0);"
+        class="a-link link-oneLind"
+        @click="editEventHandler('onFilterIconClick', ['dataId', 'formCode','keyword'])"
+      >
+        <span>{{ optionModel.onFilterIconClick }}</span>
+        <i class="el-icon-edit"></i>
+      </a>
+    </el-form-item>
+    <el-form-item label="筛选内容值变化事件">
+      <a
+        href="javascript:void(0);"
+        class="a-link link-oneLind"
+        @click="editEventHandler('onFilterTextChange', ['dataId', 'formCode','keyword'])"
+      >
+        <span>{{ optionModel.onFilterTextChange }}</span>
+        <i class="el-icon-edit"></i>
+      </a>
+    </el-form-item>
   </div>
 </template>
 <script>
 import i18n from "../../../../../../components/xform/utils/i18n"
 import {deepClone} from "../../../../../../components/xform/utils/util";
-
+import eventMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/event-handler/eventMixin";
 
 export default {
   name: "tree-customClass-editor",
   componentName: "PropertyEditor",
-  mixins: [i18n],
+  mixins: [i18n,eventMixin],
   props: {
     designer: Object,
     selectedWidget: Object,

package/src/components/xform/form-designer/setting-panel/property-editor/container-tree-pane/tree-pane-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item label="树标签">
+  <el-form-item label="树标签" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.treeLabel"></el-input>
   </el-form-item>
 </template>

package/src/components/xform/form-designer/setting-panel/property-editor/container-vf-dialog/cancelButtonLabel-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.cancelButtonLabel')">
+  <el-form-item :label="i18nt('designer.setting.cancelButtonLabel')" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.cancelButtonLabel"></el-input>
   </el-form-item>
 </template>

package/src/components/xform/form-designer/setting-panel/property-editor/container-vf-dialog/okButtonLabel-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.okButtonLabel')">
+  <el-form-item :label="i18nt('designer.setting.okButtonLabel')" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.okButtonLabel"></el-input>
   </el-form-item>
 </template>

package/src/components/xform/form-designer/setting-panel/property-editor/container-vf-dialog/title-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.title')">
+  <el-form-item :label="i18nt('designer.setting.title')" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.title"></el-input>
   </el-form-item>
 </template>

package/src/components/xform/form-designer/setting-panel/property-editor/container-vf-dialog/width-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.dialogWidth')">
+  <el-form-item :label="i18nt('designer.setting.dialogWidth')" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.width"></el-input>
   </el-form-item>
 </template>

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

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.containerClass')">
+  <el-form-item :label="i18nt('designer.setting.containerClass')" class="form-item-label-top">
     <el-select v-model="optionModel.containerClass">
       <el-option v-for="(item, idx) in classList" :key="idx" :label="item.name" :value="item.value"></el-option>
     </el-select>

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

@@ -0,0 +1,36 @@
+<template>
+  <div>
+    <el-form-item label="复制数据处理" label-width="150px">
+      <a href="javascript:void(0);" class="a-link link-oneLind"
+         @click="editEventHandler('copyDataHandle', copyDataHandleParams)">
+        <span>{{ optionModel.copyDataHandle }}</span>
+        <i class="el-icon-edit"></i>
+      </a>
+    </el-form-item>
+  </div>
+</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: "copyButton-editor",
+    mixins: [i18n,eventMixin],
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+    data(){
+      return {
+        copyDataHandleParams: ["dataId", "formCode", "copyData", "done"]
+      }
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>

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

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.customClass')">
+  <el-form-item :label="i18nt('designer.setting.customClass')" class="form-item-label-top">
     <el-select v-model="optionModel.customClass" multiple filterable allow-create
                default-first-option>
       <el-option v-for="(item, idx) in cssClassList" :key="idx" :label="item" :value="item"></el-option>

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

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item v-if="!hasConfig('optionItems')" :label="i18nt('designer.setting.defaultValue')">
+  <el-form-item v-if="!hasConfig('optionItems')" :label="i18nt('designer.setting.defaultValue')" class="form-item-label-top">
     <el-input type="text" v-model="optionModel.defaultValue"
               @change="emitDefaultValueChange"></el-input>
   </el-form-item>

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

@@ -1,14 +1,14 @@
 <template>
   <div>
-    <el-form-item :label="'操作区文本'"><el-input v-model="optionModel.extra" /></el-form-item>
-    <el-form-item :label="'一行列数'"><base-input-number v-model="optionModel.column" /></el-form-item>
-    <el-form-item :label="'排列方向'">
+    <el-form-item :label="'操作区文本'" class="form-item-label-top"><el-input v-model="optionModel.extra" /></el-form-item>
+    <el-form-item :label="'一行列数'" class="form-item-label-top"><base-input-number v-model="optionModel.column" /></el-form-item>
+    <el-form-item :label="'排列方向'" class="form-item-label-top">
       <el-select v-model="optionModel.direction" filterable="" clearable="" placeholder="排列方向" size="mini">
         <el-option value="vertical" label="vertical"></el-option>
         <el-option value="horizontal" label="horizontal"></el-option>
       </el-select>
     </el-form-item>
-    <el-form-item :label="'列表尺寸'">
+    <el-form-item :label="'列表尺寸'" class="form-item-label-top">
       <el-select v-model="optionModel.descriptionsSize" filterable="" clearable="" placeholder="列表尺寸" size="mini">
         <el-option value="medium " label="medium "></el-option>
         <el-option value="small " label="small "></el-option>

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

@@ -0,0 +1,32 @@
+<template>
+  <div>
+    <el-form-item label-width="0">
+      <el-divider class="custom-divider-margin-top">下载设置</el-divider>
+    </el-form-item>
+    <el-form-item label="表格唯一名称" class="form-item-label-top">
+      <el-input v-model="optionModel.dataTableName" clearable></el-input>
+    </el-form-item>
+    <el-form-item label="类型" class="form-item-label-top">
+      <el-input v-model="optionModel.attachmentType" clearable></el-input>
+    </el-form-item>
+    <el-form-item label="文件名" class="form-item-label-top">
+      <el-input v-model="optionModel.fileName" clearable></el-input>
+    </el-form-item>
+  </div>
+</template>
+
+<script>
+import i18n from "../../../../../components/xform/utils/i18n";
+
+export default {
+  name: "downloadButtonFlag-editor",
+  mixins: [i18n],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
+</script>
+
+<style scoped></style>