cloud-web-corejs 1.0.258 → 1.0.259

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 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 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>
+          <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 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/dropdownFlag-editor.vue

@@ -107,8 +107,8 @@ export default {
     openEditFormatConfigDialog(fieldWidget, index) {
       this.openWidgetPropertyDialog({
         columnSelectedWidget: deepClone(fieldWidget),
-        callback: (columnOption) => {
-          fieldWidget.options = columnOption;
+        callback: (columnSelectedWidget) => {
+          fieldWidget.options = columnSelectedWidget.options;
         },
       });
     },

package/src/components/xform/form-designer/setting-panel/property-editor/field-area-select/areaDataType-editor.vue

@@ -0,0 +1,25 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.areaDataType')">
+    <el-select v-model="optionModel.areaDataType" style="width: 100%">
+      <el-option :label="i18nt('designer.setting.areaDataType0')" :value="0" />
+      <el-option :label="i18nt('designer.setting.areaDataType1')" :value="1" />
+      <el-option :label="i18nt('designer.setting.areaDataType2')" :value="2" />
+      <el-option :label="i18nt('designer.setting.areaDataType3')" :value="3" />
+    </el-select>
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "@base/components/xform/utils/i18n";
+import propertyMixin from "@base/components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+
+export default {
+  name: "areaDataType-editor",
+  mixins: [i18n, propertyMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
+</script>

package/src/components/xform/form-designer/setting-panel/property-editor/field-area-select/areaMinLevel-editor.vue

@@ -0,0 +1,50 @@
+<template>
+  <el-form-item>
+    <span slot="label"
+      >{{ i18nt("designer.setting.areaMinLevel") }}
+      <el-tooltip
+        effect="light"
+        :content="i18nt('designer.setting.areaMinLevelHint')"
+      >
+        <i class="el-icon-info"></i>
+      </el-tooltip>
+    </span>
+    <el-select v-model="minLevel" style="width: 100%">
+      <el-option
+        :label="i18nt('designer.setting.areaMinLevelNone')"
+        :value="null"
+      />
+      <el-option :label="i18nt('designer.setting.areaMinLevel0')" :value="0" />
+      <el-option :label="i18nt('designer.setting.areaMinLevel1')" :value="1" />
+      <el-option :label="i18nt('designer.setting.areaMinLevel2')" :value="2" />
+      <el-option :label="i18nt('designer.setting.areaMinLevel3')" :value="3" />
+    </el-select>
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "@base/components/xform/utils/i18n";
+import propertyMixin from "@base/components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+
+export default {
+  name: "areaMinLevel-editor",
+  mixins: [i18n, propertyMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  computed: {
+    minLevel: {
+      get() {
+        const val = this.optionModel.areaMinLevel;
+        return val == null || val === "" ? null : val;
+      },
+      set(val) {
+        /* 旧表单的 options 上可能没有该 key，需 $set 保证响应式 */
+        this.$set(this.optionModel, "areaMinLevel", val);
+      },
+    },
+  },
+};
+</script>

package/src/components/xform/form-designer/setting-panel/property-editor/field-area-select/areaName-editor.vue

@@ -0,0 +1,20 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.areaName')">
+    <el-input v-model="optionModel.areaName" :placeholder="i18nt('designer.setting.areaNameHint')" />
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "@base/components/xform/utils/i18n";
+import propertyMixin from "@base/components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+
+export default {
+  name: "areaName-editor",
+  mixins: [i18n, propertyMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
+</script>

package/src/components/xform/form-designer/setting-panel/property-editor/field-autocomplete/autocomplete-vabSearchName-editor.vue

@@ -0,0 +1,199 @@
+<template>
+  <div>
+    <el-form-item label-width="0">
+      <el-divider class="custom-divider-margin-top">自动完成设置</el-divider>
+    </el-form-item>
+
+    <el-form-item label="展示字段">
+      <el-input
+        type="text"
+        v-model="optionModel.vabSearchName"
+        placeholder="表单中存储名称的字段"
+      ></el-input>
+    </el-form-item>
+    <el-form-item label="关联来源字段">
+      <el-input
+        type="text"
+        v-model="optionModel.valueField"
+        placeholder="候选数据中作为值/ID的字段（默认字段本身），值存入字段本身"
+      ></el-input>
+    </el-form-item>
+    <el-form-item label="展示来源字段">
+      <el-input
+        type="text"
+        v-model="optionModel.labelSourceField"
+        placeholder="候选数据中作为名称的字段（默认取展示字段）"
+      ></el-input>
+    </el-form-item>
+    <el-form-item label="查询字段">
+      <el-input
+        type="text"
+        v-model="optionModel.queryField"
+        placeholder="condition格式时为字段名，否则为参数名（默认 keyword）"
+      ></el-input>
+    </el-form-item>
+    <el-form-item label="condition传值格式">
+      <el-switch v-model="optionModel.conditionFormat"></el-switch>
+    </el-form-item>
+    <el-form-item label="查询数据表">
+      <el-input
+        type="text"
+        v-model="optionModel.conditionTaBm"
+        placeholder="condition查询的数据表taBm（留空取字段本身）"
+      ></el-input>
+    </el-form-item>
+    <el-form-item label="查询条数">
+      <el-input-number
+        v-model="optionModel.conditionSize"
+        :min="1"
+        controls-position="right"
+        style="width: 100%"
+      ></el-input-number>
+    </el-form-item>
+
+    <el-form-item label="选中回填">
+      <el-button type="primary" plain round @click="showFillDialog = true">
+        {{ i18nt("designer.setting.editAction") }}
+      </el-button>
+    </el-form-item>
+
+    <el-dialog
+      custom-class="dialog-style list-dialog"
+      title="选中回填配置"
+      :visible.sync="showFillDialog"
+      :modal="false"
+      :show-close="true"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :destroy-on-close="true"
+      top="5vh"
+      width="640px"
+      v-dialog-drag
+    >
+      <div class="cont">
+        <el-table
+          ref="fillTable"
+          width="100%"
+          height="420"
+          :data="fillData"
+          border
+          stripe
+        >
+          <el-table-column
+            label="目标字段(组件名)"
+            width="180"
+            prop="targetField"
+          >
+            <template slot-scope="scope">
+              <el-input v-model="scope.row.targetField"></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="目标数据属性"
+            width="180"
+            prop="targetFormField"
+          >
+            <template slot-scope="scope">
+              <el-input v-model="scope.row.targetFormField"></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column label="来源字段" width="160" prop="sourceField">
+            <template slot-scope="scope">
+              <el-input v-model="scope.row.sourceField"></el-input>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" min-width="60" fixed="right">
+            <template #header>
+              <el-tooltip
+                :hide-after="500"
+                class="item"
+                effect="dark"
+                content="添加"
+                placement="top"
+              >
+                <el-button
+                  size="mini"
+                  type=""
+                  circle
+                  icon="el-icon-plus"
+                  @click="fillData.push({})"
+                />
+              </el-tooltip>
+            </template>
+            <template #default="{ $index }">
+              <el-tooltip effect="dark" content="删除" placement="top">
+                <el-button
+                  size="mini"
+                  type=""
+                  circle
+                  icon="el-icon-delete"
+                  @click="fillData.splice($index, 1)"
+                />
+              </el-tooltip>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <div class="dialog-footer" slot="footer">
+        <span class="fl tips"
+          >注：'目标字段'与'目标数据属性'只需维护一个即可。</span
+        >
+        <el-button
+          @click="showFillDialog = false"
+          class="button-sty"
+          icon="el-icon-close"
+        >
+          {{ i18nt("designer.hint.cancel") }}
+        </el-button>
+        <el-button
+          type="primary"
+          @click="confirmFillDialog"
+          class="button-sty"
+          icon="el-icon-check"
+        >
+          {{ i18nt("designer.hint.confirm") }}
+        </el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import i18n from "../../../../../../components/xform/utils/i18n";
+import propertyMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+
+export default {
+  name: "autocomplete-vabSearchName-editor",
+  mixins: [i18n, propertyMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  data() {
+    return {
+      showFillDialog: false,
+      fillData: [],
+    };
+  },
+  methods: {
+    confirmFillDialog() {
+      this.optionModel.autocompleteFillConfig = this.$baseLodash.cloneDeep(
+        this.fillData
+      );
+      this.showFillDialog = false;
+    },
+  },
+  watch: {
+    showFillDialog(val) {
+      if (val) {
+        this.fillData = this.$baseLodash.cloneDeep(
+          this.optionModel.autocompleteFillConfig || []
+        );
+      }
+    },
+  },
+};
+</script>
+
+<style scoped></style>

package/src/components/xform/form-designer/setting-panel/property-editor/field-baseAttachment/baseAttachment-fileTypes-editor.vue

@@ -0,0 +1,23 @@
+<template>
+  <file-types-select :option-model="optionModel"></file-types-select>
+</template>
+
+<script>
+  import FileTypesSelect from "../fileTypesSelect.vue"
+
+  export default {
+    name: "baseAttachment-fileTypes-editor",
+    components: {
+      FileTypesSelect,
+    },
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>