@bytenew/bn-bus-ui 1.1.463 → 1.1.464

package/dist/setOption-CXOifQcx.js

@@ -0,0 +1,329 @@
+import { cloneDeep as _ } from "lodash";
+import { resolveComponent as p, openBlock as u, createElementBlock as c, createElementVNode as s, toDisplayString as V, createVNode as d, withCtx as r, createTextVNode as h, createCommentVNode as w, withKeys as k, normalizeClass as g } from "vue";
+import { _ as I } from "./install-CNjs0u5x.js";
+const F = {
+  name: "setOption",
+  props: {
+    columnData: {
+      type: Object,
+      default: () => ({})
+    },
+    openDataField: Boolean,
+    // 是否支持数据字典配置
+    postFunc: Function,
+    // API请求函数
+    extendPost: Object
+    // 额外的请求参数
+  },
+  data() {
+    return {
+      addOptionText: "",
+      // 批量添加输入框内容
+      showBatchAdd: !1,
+      // 是否显示批量添加区域
+      newOptions: [],
+      // 新增选项名称数组（用于橘黄色高亮）
+      oldTitle: "",
+      // 记录修改前的标题（用于更新newOptions）
+      componentWidth: 0,
+      // 组件宽度
+      filedType: ""
+      //是否选择数据字典 option选项  DataFields数据字典
+    };
+  },
+  mounted() {
+    var e;
+    this.filedType = ((e = this.columnData.insideDataSourceInfo) == null ? void 0 : e.type) || "", this.calculateWidth();
+  },
+  methods: {
+    /**
+     * 计算组件宽度
+     */
+    calculateWidth() {
+      this.$nextTick(() => {
+        const e = this.$el;
+        e && (this.componentWidth = e.offsetWidth);
+      });
+    },
+    /**
+     * 切换字典还是选项
+     */
+    changeFiledType() {
+      this.columnData.moduleDefinition = [], this.columnData.defaultInfo = {}, this.columnData.insideDataSourceInfo = {}, this.filedType == "DataFields" && (this.columnData.insideDataSourceInfo = { type: "DataFields", table: "", field: "" });
+    },
+    /**
+     * 判断是否为新增选项（用于橘黄色高亮）
+     */
+    isNewOption(e) {
+      return this.newOptions.includes(e);
+    },
+    /**
+     * 更新选项标题
+     * 当用户修改输入框内容时，同步更新newOptions数组
+     */
+    updateOptionTitle(e) {
+      if (this.oldTitle === e) return;
+      const t = this.newOptions.indexOf(this.oldTitle);
+      t > -1 && this.newOptions.splice(t, 1, e), this.oldTitle = "";
+    },
+    /**
+     * 解析批量输入文本
+     * 支持换行、中英文逗号、空格分隔，自动去重，最多100个
+     */
+    parseBatchText(e) {
+      return e.split(/[\n,，\s]+/).map((t) => t.trim()).filter(Boolean).slice(0, 100);
+    },
+    /**
+     * 过滤已存在的选项
+     * 返回需要真正新增的选项列表
+     */
+    filterExistingOptions(e) {
+      const t = this.columnData.moduleDefinition.map((i) => i.title);
+      return e.filter((i) => !t.includes(i));
+    },
+    /**
+     * 构造选项对象
+     */
+    buildOptions(e, t) {
+      const i = this.columnData.moduleDefinition.length + 1;
+      return e.map((f, n) => ({
+        sequence: i + n,
+        code: t[n],
+        columnStatus: 1,
+        id: t[n],
+        title: f
+      }));
+    },
+    /**
+     * 滚动到列表底部
+     */
+    scrollToBottom() {
+      this.$nextTick(() => {
+        const e = this.$refs.optionList;
+        if (e && e.$el) {
+          const t = e.$el.querySelector(".el-scrollbar__wrap");
+          t && (t.scrollTop = t.scrollHeight);
+        }
+      });
+    },
+    /**
+     * 添加选项
+     * @param {String} type - 操作类型：'add'追加、'cover'覆盖、undefined单个添加
+     */
+    async addOption(e) {
+      var n;
+      let t = [];
+      if (e) {
+        if (t = [...new Set(this.parseBatchText(this.addOptionText))], this.newOptions.push(...t), t = this.filterExistingOptions(t), t.length === 0) return;
+      } else {
+        const a = `选项${this.newOptions.length + 1}`;
+        t = [a], this.newOptions.push(a);
+      }
+      const i = ((n = this.extendPost) == null ? void 0 : n.appId) || "noApp", f = await this.postFunc(
+        `/v2/projects/customId/${t.length}/${i}`,
+        null,
+        "get"
+      );
+      if (!f.code) {
+        const l = this.buildOptions(t, f.data);
+        this.columnData.moduleDefinition = e === "cover" ? _(l) : [...this.columnData.moduleDefinition, ...l], this.scrollToBottom();
+      }
+    },
+    /**
+     * 删除选项
+     */
+    deleteOption(e, t) {
+      this.columnData.moduleDefinition.splice(e, 1);
+      const i = this.newOptions.indexOf(t);
+      i > -1 && this.newOptions.splice(i, 1);
+    }
+  }
+}, B = { class: "setOpt" }, U = { class: "setOpt-top w-flex-center w-flex-between" }, S = { class: "w-flex-center" }, C = { class: "w-color-orange" }, A = {
+  key: 0,
+  class: "w-margin-left8"
+}, N = {
+  key: 0,
+  class: "w-flex-center"
+}, W = { class: "setOpt-filedType" }, E = {
+  key: 0,
+  class: "setOpt-batch"
+}, j = { class: "w-flex-right w-margin-top8" }, q = { key: 1 }, z = ["onClick"], L = {
+  key: 0,
+  class: "w-empty"
+}, K = {
+  key: 2,
+  class: "w-margin-top8"
+};
+function P(e, t, i, f, n, l) {
+  const a = p("el-button"), D = p("el-segmented"), O = p("el-input"), v = p("el-switch"), y = p("draggable"), T = p("el-scrollbar"), b = p("BnSelect");
+  return u(), c("div", B, [
+    s("div", U, [
+      s("div", S, [
+        t[12] || (t[12] = s("div", { class: "setOpt-top-title" }, "选项配置", -1)),
+        s("div", C, " （共" + V(i.columnData.moduleDefinition.length) + "个选项） ", 1),
+        n.filedType != "DataFields" ? (u(), c("div", A, [
+          d(a, {
+            link: "",
+            type: "primary",
+            onClick: t[0] || (t[0] = (o) => {
+              n.showBatchAdd = !n.showBatchAdd, n.addOptionText = "";
+            }),
+            class: "w-padding0"
+          }, {
+            default: r(() => [...t[10] || (t[10] = [
+              s("span", { class: "bnUIcon bnUIcon-batchAdd w-padding-right2 w-font14" }, null, -1),
+              h(" 批量 ", -1)
+            ])]),
+            _: 1
+          }),
+          d(a, {
+            link: "",
+            type: "primary",
+            onClick: t[1] || (t[1] = (o) => l.addOption()),
+            class: "w-padding0"
+          }, {
+            default: r(() => [...t[11] || (t[11] = [
+              s("span", { class: "bnUIcon bnUIcon-addFile w-padding-right2 w-font14" }, null, -1),
+              h("添加 ", -1)
+            ])]),
+            _: 1
+          })
+        ])) : w("", !0)
+      ]),
+      i.openDataField ? (u(), c("div", N, [
+        s("div", W, [
+          d(D, {
+            modelValue: n.filedType,
+            "onUpdate:modelValue": t[2] || (t[2] = (o) => n.filedType = o),
+            props: { value: "id", label: "title" },
+            onChange: l.changeFiledType,
+            options: [{ id: "", title: "选项" }, { id: "DataFields", title: "数据字典" }]
+          }, null, 8, ["modelValue", "onChange"])
+        ])
+      ])) : w("", !0)
+    ]),
+    n.showBatchAdd && n.filedType != "DataFields" ? (u(), c("div", E, [
+      d(O, {
+        modelValue: n.addOptionText,
+        "onUpdate:modelValue": t[3] || (t[3] = (o) => n.addOptionText = o),
+        type: "textarea",
+        clearable: "",
+        rows: 4,
+        resize: "none",
+        onKeydown: t[4] || (t[4] = k((o) => l.addOption("add"), ["enter"])),
+        placeholder: "支持换行、逗号、空格分隔，自动去重，最多添加100个，手动按回车键自动进行追加操作"
+      }, null, 8, ["modelValue"]),
+      s("div", j, [
+        d(a, {
+          link: "",
+          type: "warning",
+          onClick: t[5] || (t[5] = (o) => {
+            n.showBatchAdd = !1, n.addOptionText = "";
+          })
+        }, {
+          default: r(() => [...t[13] || (t[13] = [
+            h("收起", -1)
+          ])]),
+          _: 1
+        }),
+        d(a, {
+          link: "",
+          type: "primary",
+          onClick: t[6] || (t[6] = (o) => l.addOption("add"))
+        }, {
+          default: r(() => [...t[14] || (t[14] = [
+            h("追加", -1)
+          ])]),
+          _: 1
+        }),
+        d(a, {
+          link: "",
+          type: "primary",
+          onClick: t[7] || (t[7] = (o) => l.addOption("cover"))
+        }, {
+          default: r(() => [...t[15] || (t[15] = [
+            h("覆盖", -1)
+          ])]),
+          _: 1
+        })
+      ])
+    ])) : w("", !0),
+    n.filedType != "DataFields" ? (u(), c("div", q, [
+      d(T, {
+        "max-height": "260px",
+        class: "setOpt-list",
+        ref: "optionList"
+      }, {
+        default: r(() => [
+          d(y, {
+            modelValue: i.columnData.moduleDefinition,
+            "onUpdate:modelValue": t[8] || (t[8] = (o) => i.columnData.moduleDefinition = o),
+            "item-key": "id",
+            handle: ".setOpt-list-item-drag",
+            "ghost-class": "ghost-item",
+            "chosen-class": "chosen-item",
+            animation: "300",
+            tag: "div"
+          }, {
+            item: r(({ element: o, index: x }) => [
+              s("div", {
+                class: g(["setOpt-list-item", [n.componentWidth > 400 ? "two" : "one"]])
+              }, [
+                t[16] || (t[16] = s("div", { class: "setOpt-list-item-drag w-default-hover" }, [
+                  s("span", { class: "bnUIcon bnUIcon-move" })
+                ], -1)),
+                d(O, {
+                  modelValue: o.title,
+                  "onUpdate:modelValue": (m) => o.title = m,
+                  modelModifiers: { trim: !0 },
+                  clearable: "",
+                  class: g({ "is-new-option": l.isNewOption(o.title) }),
+                  onFocus: (m) => n.oldTitle = o.title,
+                  maxlength: "100",
+                  "show-word-limit": "",
+                  onBlur: (m) => l.updateOptionTitle(o.title)
+                }, null, 8, ["modelValue", "onUpdate:modelValue", "class", "onFocus", "onBlur"]),
+                d(v, {
+                  modelValue: o.columnStatus,
+                  "onUpdate:modelValue": (m) => o.columnStatus = m,
+                  "active-value": 1,
+                  "inactive-value": 0,
+                  class: "w-padding-lr6"
+                }, null, 8, ["modelValue", "onUpdate:modelValue"]),
+                s("span", {
+                  class: "bnUIcon bnUIcon-delete",
+                  onClick: (m) => l.deleteOption(x, o.title)
+                }, null, 8, z)
+              ], 2)
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        _: 1
+      }, 512),
+      !i.columnData.moduleDefinition || i.columnData.moduleDefinition.length == 0 ? (u(), c("div", L, "暂无选项数据")) : w("", !0)
+    ])) : (u(), c("div", K, [
+      d(b, {
+        modelValue: i.columnData.insideDataSourceInfo.field,
+        "onUpdate:modelValue": t[9] || (t[9] = (o) => i.columnData.insideDataSourceInfo.field = o),
+        clearable: "",
+        filterable: "",
+        labelInValue: !1,
+        placeholder: "请选择你的数据字典",
+        pathUrl: "/ipaas/web/enum/userList",
+        "post-data": {
+          pageSize: 1e3,
+          pageNum: 1,
+          data: {
+            type: 1
+          }
+        },
+        postFunc: i.postFunc
+      }, null, 8, ["modelValue", "postFunc"])
+    ]))
+  ]);
+}
+const J = /* @__PURE__ */ I(F, [["render", P], ["__scopeId", "data-v-39464814"]]);
+export {
+  J as default
+};

package/dist/setOption.css

@@ -0,0 +1 @@
+.setOpt-top[data-v-39464814]{height:32px;font-size:14px}.setOpt-top-title[data-v-39464814]{font-weight:500}.setOpt-batch[data-v-39464814]{margin-top:10px}.setOpt-filedType .el-segmented[data-v-39464814]{--el-segmented-item-selected-color: #fff;--el-segmented-item-selected-bg-color: #409EFF;--el-border-radius-base: 16px}.setOpt-list[data-v-39464814]{margin-top:10px;padding-right:10px}.setOpt-list .el-scrollbar__view>div[data-v-39464814]{display:flex;flex-wrap:wrap;gap:10px}.setOpt-list-item[data-v-39464814]{display:flex;align-items:center;cursor:pointer}.setOpt-list-item.two[data-v-39464814]{width:calc(50% - 5px)}.setOpt-list-item.one[data-v-39464814]{width:100%}.setOpt-list-item-drag[data-v-39464814]{padding-right:8px}.setOpt-list-item[data-v-39464814] .is-new-option .el-input__wrapper{box-shadow:0 0 0 1px #ff9800 inset}.setOpt-list-item[data-v-39464814] .is-new-option .el-input__wrapper:hover,.setOpt-list-item[data-v-39464814] .is-new-option .el-input__wrapper.is-focus{box-shadow:0 0 0 1px #ff9800 inset!important}