@dazhicheng/ui 1.6.55 → 1.6.57

package/dist/components/tt-panel-select/src/components/PanelMiddle.vue.js

@@ -1,14 +1,15 @@
-import { defineComponent as se, useTemplateRef as z, ref as m, computed as h, watch as M, nextTick as K, createElementBlock as f, openBlock as s, normalizeClass as n, createElementVNode as k, createCommentVNode as O, createVNode as p, createBlock as I, unref as i, withCtx as d, createTextVNode as b, normalizeStyle as P, Fragment as H, renderList as V, toDisplayString as E } from "vue";
-import { TtButton as ne } from "../../../tt-button/index.js";
-import { TtText as S } from "../../../tt-text/index.js";
-import { Search as ie } from "@element-plus/icons-vue";
-import { useResizeObserver as ue } from "@vueuse/core";
-import { ElInput as de, ElIcon as ce, ElCheckbox as F, ElScrollbar as fe } from "element-plus";
-import { DEFAULT_PANEL_SELECT_SEPARATORS as pe, splitPanelSelectText as ve } from "../common.js";
-const he = ["data-virtual-index", "data-flash-seed"], Y = 2, be = /* @__PURE__ */ se({
+import { defineComponent as ne, useTemplateRef as q, ref as m, computed as v, watch as M, nextTick as U, createElementBlock as p, openBlock as s, normalizeClass as n, createElementVNode as k, createCommentVNode as z, createVNode as h, createBlock as I, unref as i, withKeys as ie, withCtx as d, createTextVNode as S, normalizeStyle as P, Fragment as H, renderList as V, toDisplayString as E } from "vue";
+import { TtButton as ue } from "../../../tt-button/index.js";
+import { TtText as $ } from "../../../tt-text/index.js";
+import { Search as de } from "@element-plus/icons-vue";
+import { useResizeObserver as ce } from "@vueuse/core";
+import { ElInput as fe, ElIcon as pe, ElCheckbox as F, ElScrollbar as he } from "element-plus";
+import { DEFAULT_PANEL_SELECT_SEPARATORS as ve, splitPanelSelectText as me } from "../common.js";
+const we = ["data-virtual-index", "data-flash-seed"], Y = 2, $e = /* @__PURE__ */ ne({
   name: "PanelMiddle",
   __name: "PanelMiddle",
   props: {
+    allowCreate: { type: Boolean },
     disabled: { type: Boolean, default: !1 },
     prefixCls: {},
     multiple: { type: Boolean },
@@ -25,245 +26,250 @@ const he = ["data-virtual-index", "data-flash-seed"], Y = 2, be = /* @__PURE__ *
     groupIndeterminateMap: {},
     scrollToGroupValue: { default: void 0 },
     pasteSearch: { type: Boolean, default: !1 },
-    separator: { default: () => [...pe] },
+    separator: { default: () => [...ve] },
     showAll: { type: Boolean },
     middlePlaceholder: {}
   },
-  emits: ["update:keyword", "checkAll", "allCheck", "groupCheck", "optionCheck", "optionsCheck"],
-  setup(l, { expose: W, emit: j }) {
-    const t = l, v = j, g = z("scrollbarRef"), T = z("searchInputRef"), J = m(), $ = m(0), D = m(0), w = m(""), x = m(), G = m(0), R = m(!1);
-    let A;
-    const Q = h(() => t.rows.length * t.rowHeight), X = h(() => Math.max(1, Math.ceil(D.value / t.rowHeight))), y = h(() => Math.max(0, Math.floor($.value / t.rowHeight) - Y)), Z = h(() => Math.min(t.rows.length, y.value + X.value + Y * 2)), _ = h(() => y.value * t.rowHeight), ee = h(() => t.rows.slice(y.value, Z.value)), le = h(() => {
+  emits: ["update:keyword", "checkAll", "allCheck", "groupCheck", "optionCheck", "optionsCheck", "selectCreatedOptions"],
+  setup(t, { expose: W, emit: j }) {
+    const l = t, c = j, g = q("scrollbarRef"), x = q("searchInputRef"), J = m(), T = m(0), D = m(0), w = m(""), b = m(), G = m(0), R = m(!1);
+    let B;
+    const Q = v(() => l.rows.length * l.rowHeight), X = v(() => Math.max(1, Math.ceil(D.value / l.rowHeight))), y = v(() => Math.max(0, Math.floor(T.value / l.rowHeight) - Y)), Z = v(() => Math.min(l.rows.length, y.value + X.value + Y * 2)), _ = v(() => y.value * l.rowHeight), ee = v(() => l.rows.slice(y.value, Z.value)), le = v(() => {
       var e;
-      return ((e = t.rows[0]) == null ? void 0 : e.type) === "group";
-    }), te = h(
-      () => t.rows.filter((e) => e.type === "options").flatMap((e) => e.options).filter((e) => !e.disabled)
+      return ((e = l.rows[0]) == null ? void 0 : e.type) === "group";
+    }), te = v(
+      () => l.rows.filter((e) => e.type === "options").flatMap((e) => e.options).filter((e) => !e.disabled)
     );
     M(
-      () => t.keyword,
+      () => l.keyword,
       (e) => {
         w.value = e;
       },
       { immediate: !0 }
     );
-    function B() {
+    function A() {
       var a;
       const e = (a = g.value) == null ? void 0 : a.wrapRef;
-      e && (J.value = e, D.value = e.clientHeight, $.value = e.scrollTop);
+      e && (J.value = e, D.value = e.clientHeight, T.value = e.scrollTop);
     }
-    ue(
+    ce(
       () => {
         var e;
         return (e = g.value) == null ? void 0 : e.wrapRef;
       },
-      () => B()
+      () => A()
     );
-    function L() {
+    function K() {
       var a;
       const e = (a = g.value) == null ? void 0 : a.wrapRef;
-      e && ($.value = e.scrollTop);
+      e && (T.value = e.scrollTop);
     }
     function ae(e) {
-      x.value = void 0, G.value += 1, requestAnimationFrame(() => {
-        x.value = e, A && clearTimeout(A), A = setTimeout(() => {
-          x.value = void 0;
+      b.value = void 0, G.value += 1, requestAnimationFrame(() => {
+        b.value = e, B && clearTimeout(B), B = setTimeout(() => {
+          b.value = void 0;
         }, 1400);
       });
     }
-    async function N(e) {
-      var c;
-      await K(), B();
-      const a = t.rows.findIndex((r) => r.type === "group" && r.group.value === e);
+    async function L(e) {
+      var f;
+      await U(), A();
+      const a = l.rows.findIndex((r) => r.type === "group" && r.group.value === e);
       if (a < 0) return;
-      const o = a * t.rowHeight;
-      (c = g.value) == null || c.setScrollTop(o), requestAnimationFrame(() => {
-        L(), ae(e);
+      const o = a * l.rowHeight;
+      (f = g.value) == null || f.setScrollTop(o), requestAnimationFrame(() => {
+        K(), ae(e);
       });
     }
     function oe(e) {
-      var q;
-      if (t.disabled)
+      var N;
+      if (l.disabled)
         return;
       e.preventDefault();
-      const a = ((q = e.clipboardData) == null ? void 0 : q.getData("text")) || "";
-      w.value = a.trim(), t.pasteSearch ? v("update:keyword", w.value) : (R.value = !0, requestAnimationFrame(() => {
+      const a = ((N = e.clipboardData) == null ? void 0 : N.getData("text")) || "";
+      w.value = a.trim(), l.pasteSearch ? c("update:keyword", w.value) : (R.value = !0, requestAnimationFrame(() => {
         R.value = !1;
       }));
-      const o = ve(a, t.separator), c = () => {
+      const o = me(a, l.separator), f = () => {
         requestAnimationFrame(() => {
-          var U;
-          const u = (U = T.value) == null ? void 0 : U.input;
+          var O;
+          const u = (O = x.value) == null ? void 0 : O.input;
           u == null || u.focus(), u == null || u.select();
         });
       };
       if (!o.length) {
-        c();
+        f();
         return;
       }
       const r = new Set(o), C = te.value.filter((u) => r.has(u.label) || r.has(String(u.value))).map((u) => u.value);
       if (!C.length) {
-        c();
+        f();
         return;
       }
-      if (t.multiple) {
-        v("optionsCheck", C, !0), c();
+      if (l.multiple) {
+        c("optionsCheck", C, !0), f();
         return;
       }
-      v("optionCheck", C.at(-1), !0), c();
+      c("optionCheck", C.at(-1), !0), f();
     }
     function re(e) {
-      w.value = e, !R.value && v("update:keyword", e);
+      w.value = e, !R.value && c("update:keyword", e);
+    }
+    function se(e) {
+      var a;
+      !l.allowCreate || l.disabled || e.isComposing || (a = x.value) != null && a.isComposing || (e.preventDefault(), e.stopPropagation(), c("update:keyword", w.value), c("selectCreatedOptions"));
     }
     return M(
-      () => t.scrollToGroupValue,
+      () => l.scrollToGroupValue,
       async (e) => {
-        e !== void 0 && await N(e);
+        e !== void 0 && await L(e);
       },
       { flush: "post" }
     ), M(
-      () => t.rows.length,
+      () => l.rows.length,
       async () => {
-        await K(), B();
+        await U(), A();
       },
       { immediate: !0 }
     ), W({
-      scrollToGroup: N,
+      scrollToGroup: L,
       inputFocus: () => {
         var e, a;
-        (a = (e = T.value) == null ? void 0 : e.focus) == null || a.call(e);
+        (a = (e = x.value) == null ? void 0 : e.focus) == null || a.call(e);
       }
-    }), (e, a) => (s(), f("div", {
-      class: n(`${l.prefixCls}__list`)
+    }), (e, a) => (s(), p("div", {
+      class: n(`${t.prefixCls}__list`)
     }, [
       k("div", {
-        class: n(`${l.prefixCls}__toolbar`)
+        class: n(`${t.prefixCls}__toolbar`)
       }, [
-        p(i(de), {
+        h(i(fe), {
           ref_key: "searchInputRef",
-          ref: T,
+          ref: x,
           "model-value": w.value,
-          class: n(`${l.prefixCls}__search`),
-          placeholder: t.middlePlaceholder,
+          class: n(`${t.prefixCls}__search`),
+          placeholder: l.allowCreate ? `${l.middlePlaceholder}(可创建)` : l.middlePlaceholder,
           clearable: "",
           "onUpdate:modelValue": re,
-          onPaste: oe
+          onPaste: oe,
+          onKeydown: ie(se, ["enter"])
         }, {
           prefix: d(() => [
-            p(i(ce), null, {
+            h(i(pe), null, {
               default: d(() => [
-                p(i(ie))
+                h(i(de))
               ]),
               _: 1
             })
           ]),
           _: 1
         }, 8, ["model-value", "class", "placeholder"]),
-        l.multiple && l.showMultiple ? (s(), I(i(ne), {
+        t.multiple && t.showMultiple ? (s(), I(i(ue), {
           key: 0,
-          disabled: l.disabled,
+          disabled: t.disabled,
           plain: "",
-          onClick: a[0] || (a[0] = () => v("checkAll", !0))
+          onClick: a[0] || (a[0] = () => c("checkAll", !0))
         }, {
           default: d(() => [...a[2] || (a[2] = [
             k("span", null, "全选", -1)
           ])]),
           _: 1
-        }, 8, ["disabled"])) : O("", !0)
+        }, 8, ["disabled"])) : z("", !0)
       ], 2),
-      t.showAll ? (s(), f("div", {
+      l.showAll ? (s(), p("div", {
         key: 0,
-        class: n([`${l.prefixCls}__panel-head`, le.value ? "is-standalone" : ""])
+        class: n([`${t.prefixCls}__panel-head`, le.value ? "is-standalone" : ""])
       }, [
-        p(i(F), {
-          disabled: l.disabled,
-          "model-value": t.allChecked,
-          onChange: a[1] || (a[1] = (o) => v("allCheck", !!o))
+        h(i(F), {
+          disabled: t.disabled,
+          "model-value": l.allChecked,
+          onChange: a[1] || (a[1] = (o) => c("allCheck", !!o))
         }, {
           default: d(() => [
-            p(i(S), null, {
+            h(i($), null, {
               default: d(() => [...a[3] || (a[3] = [
-                b("全部", -1)
+                S("全部", -1)
               ])]),
               _: 1
             })
           ]),
           _: 1
         }, 8, ["disabled", "model-value"])
-      ], 2)) : O("", !0),
+      ], 2)) : z("", !0),
       k("div", {
-        class: n(`${l.prefixCls}__checkbox-group`)
+        class: n(`${t.prefixCls}__checkbox-group`)
       }, [
-        p(i(fe), {
+        h(i(he), {
           ref_key: "scrollbarRef",
           ref: g,
-          class: n(`${l.prefixCls}__middle-scrollbar`),
-          onScroll: L
+          class: n(`${t.prefixCls}__middle-scrollbar`),
+          onScroll: K
         }, {
           default: d(() => [
             k("div", {
-              class: n(`${l.prefixCls}__middle-virtual-host`),
+              class: n(`${t.prefixCls}__middle-virtual-host`),
               style: P({ height: `${Q.value}px` })
             }, [
               k("div", {
                 style: P({ transform: `translateY(${_.value}px)` })
               }, [
-                (s(!0), f(H, null, V(ee.value, (o, c) => (s(), f("div", {
+                (s(!0), p(H, null, V(ee.value, (o, f) => (s(), p("div", {
                   key: o.key,
-                  style: P({ height: `${l.rowHeight}px` }),
+                  style: P({ height: `${t.rowHeight}px` }),
                   class: n([
-                    `${l.prefixCls}__middle-row`,
-                    o.type === "group" ? `${l.prefixCls}__middle-group` : `${l.prefixCls}__middle-options`,
+                    `${t.prefixCls}__middle-row`,
+                    o.type === "group" ? `${t.prefixCls}__middle-group` : `${t.prefixCls}__middle-options`,
                     o.type === "options" && o.isLast ? "is-last" : "",
-                    o.type === "options" && y.value + c === 0 && !t.showAll ? "is-first" : "",
-                    x.value === o.group.value ? `${l.prefixCls}__group-flash` : ""
+                    o.type === "options" && y.value + f === 0 && !l.showAll ? "is-first" : "",
+                    b.value === o.group.value ? `${t.prefixCls}__group-flash` : ""
                   ]),
-                  "data-virtual-index": y.value + c,
+                  "data-virtual-index": y.value + f,
                   "data-flash-seed": G.value
                 }, [
-                  o.type === "group" ? (s(), f("div", {
+                  o.type === "group" ? (s(), p("div", {
                     key: 0,
-                    class: n(`${l.prefixCls}__panel-head`)
+                    class: n(`${t.prefixCls}__panel-head`)
                   }, [
-                    t.multiple ? (s(), I(i(F), {
+                    l.multiple ? (s(), I(i(F), {
                       key: 0,
-                      "model-value": l.groupCheckedMap[String(o.group.value)],
-                      indeterminate: l.groupIndeterminateMap[String(o.group.value)],
-                      disabled: l.disabled,
-                      onChange: (r) => v("groupCheck", o.group.value, !!r)
+                      "model-value": t.groupCheckedMap[String(o.group.value)],
+                      indeterminate: t.groupIndeterminateMap[String(o.group.value)],
+                      disabled: t.disabled,
+                      onChange: (r) => c("groupCheck", o.group.value, !!r)
                     }, {
                       default: d(() => [
-                        p(i(S), null, {
+                        h(i($), null, {
                           default: d(() => [
-                            b(E(o.group.label), 1)
+                            S(E(o.group.label), 1)
                           ]),
                           _: 2
                         }, 1024)
                       ]),
                       _: 2
-                    }, 1032, ["model-value", "indeterminate", "disabled", "onChange"])) : (s(), I(i(S), { key: 1 }, {
+                    }, 1032, ["model-value", "indeterminate", "disabled", "onChange"])) : (s(), I(i($), { key: 1 }, {
                       default: d(() => [
-                        b(E(o.group.label), 1)
+                        S(E(o.group.label), 1)
                       ]),
                       _: 2
                     }, 1024))
-                  ], 2)) : (s(), f("div", {
+                  ], 2)) : (s(), p("div", {
                     key: 1,
-                    class: n(`${l.prefixCls}__option-row`)
+                    class: n(`${t.prefixCls}__option-row`)
                   }, [
-                    (s(!0), f(H, null, V(o.options, (r) => (s(), f("div", {
+                    (s(!0), p(H, null, V(o.options, (r) => (s(), p("div", {
                       key: r.value,
-                      class: n(`${l.prefixCls}__option-cell`)
+                      class: n(`${t.prefixCls}__option-cell`)
                     }, [
-                      p(i(F), {
-                        "model-value": t.selectedValueSet.has(r.value),
-                        disabled: l.disabled || r.disabled,
-                        class: n(`${l.prefixCls}__option`),
-                        onChange: (C) => v("optionCheck", r.value, !!C)
+                      h(i(F), {
+                        "model-value": l.selectedValueSet.has(r.value),
+                        disabled: t.disabled || r.disabled,
+                        class: n(`${t.prefixCls}__option`),
+                        onChange: (C) => c("optionCheck", r.value, !!C)
                       }, {
                         default: d(() => [
-                          p(i(S), { "tool-tip-line": 2 }, {
+                          h(i($), { "tool-tip-line": 2 }, {
                             default: d(() => [
-                              b(E(r.label), 1)
+                              S(E(r.label), 1)
                             ]),
                             _: 2
                           }, 1024)
@@ -271,12 +277,12 @@ const he = ["data-virtual-index", "data-flash-seed"], Y = 2, be = /* @__PURE__ *
                         _: 2
                       }, 1032, ["model-value", "disabled", "class", "onChange"])
                     ], 2))), 128)),
-                    (s(!0), f(H, null, V(l.optionPerRow - o.options.length, (r) => (s(), f("div", {
+                    (s(!0), p(H, null, V(t.optionPerRow - o.options.length, (r) => (s(), p("div", {
                       key: `empty-${o.key}-${r}`,
-                      class: n(`${l.prefixCls}__option-cell`)
+                      class: n(`${t.prefixCls}__option-cell`)
                     }, null, 2))), 128))
                   ], 2))
-                ], 14, he))), 128))
+                ], 14, we))), 128))
               ], 4)
             ], 6)
           ]),
@@ -287,5 +293,5 @@ const he = ["data-virtual-index", "data-flash-seed"], Y = 2, be = /* @__PURE__ *
   }
 });
 export {
-  be as default
+  $e as default
 };

package/dist/components/tt-panel-select/src/index.vue.d.ts

@@ -26,6 +26,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
     disabled: boolean;
     immediate: boolean;
     params: import('../../../../../utils/src').Recordable;
+    allowCreate: boolean;
     multiple: boolean;
     options: PanelSelectOption[];
     treeConfig: import('./types').PanelSelectTreeConfig;
@@ -53,6 +54,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
         onGroupCheck?: ((groupValue: PanelSelectValue, checked: boolean) => any) | undefined;
         onOptionCheck?: ((value: PanelSelectValue, checked: boolean) => any) | undefined;
         onOptionsCheck?: ((values: PanelSelectValue[], checked: boolean) => any) | undefined;
+        onSelectCreatedOptions?: (() => any) | undefined;
     }>, {
         scrollToGroup: (groupValue: PanelSelectValue) => Promise<void>;
         inputFocus: () => void;
@@ -63,6 +65,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
         groupCheck: (groupValue: PanelSelectValue, checked: boolean) => any;
         optionCheck: (value: PanelSelectValue, checked: boolean) => any;
         optionsCheck: (values: PanelSelectValue[], checked: boolean) => any;
+        selectCreatedOptions: () => any;
     }, import('vue').PublicProps, {
         disabled: boolean;
         showMultiple: boolean;
@@ -91,12 +94,12 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
                 readonly form?: string | undefined;
                 readonly readonly?: boolean | undefined;
                 readonly clearable?: boolean | undefined;
-                readonly clearIcon?: import('element-plus/es/utils/index.mjs').IconPropType | undefined;
+                readonly clearIcon?: import('element-plus/es/utils/vue/icon.mjs').IconPropType | undefined;
                 readonly showPassword?: boolean | undefined;
                 readonly showWordLimit?: boolean | undefined;
                 readonly wordLimitPosition?: "inside" | "outside" | undefined;
-                readonly suffixIcon?: import('element-plus/es/utils/index.mjs').IconPropType | undefined;
-                readonly prefixIcon?: import('element-plus/es/utils/index.mjs').IconPropType | undefined;
+                readonly suffixIcon?: import('element-plus/es/utils/vue/icon.mjs').IconPropType | undefined;
+                readonly prefixIcon?: import('element-plus/es/utils/vue/icon.mjs').IconPropType | undefined;
                 readonly containerRole?: string | undefined;
                 readonly tabindex?: string | number | undefined;
                 readonly validateEvent?: boolean | undefined;
@@ -177,7 +180,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
                 disabled: boolean;
                 modelModifiers: import('element-plus').InputModelModifiers;
                 autocomplete: string;
-                clearIcon: import('element-plus/es/utils/index.mjs').IconPropType;
+                clearIcon: import('element-plus/es/utils/vue/icon.mjs').IconPropType;
                 wordLimitPosition: "inside" | "outside";
                 tabindex: string | number;
                 validateEvent: boolean;
@@ -209,7 +212,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
             disabled: boolean;
             modelModifiers: import('element-plus').InputModelModifiers;
             autocomplete: string;
-            clearIcon: import('element-plus/es/utils/index.mjs').IconPropType;
+            clearIcon: import('element-plus/es/utils/vue/icon.mjs').IconPropType;
             wordLimitPosition: "inside" | "outside";
             tabindex: string | number;
             validateEvent: boolean;
@@ -397,6 +400,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
         onGroupCheck?: ((groupValue: PanelSelectValue, checked: boolean) => any) | undefined;
         onOptionCheck?: ((value: PanelSelectValue, checked: boolean) => any) | undefined;
         onOptionsCheck?: ((values: PanelSelectValue[], checked: boolean) => any) | undefined;
+        onSelectCreatedOptions?: (() => any) | undefined;
     }>, {
         scrollToGroup: (groupValue: PanelSelectValue) => Promise<void>;
         inputFocus: () => void;