@pit-front-end/components/dist/es/components/icon-box/src/icon-box.vue2.js

湖南创智艾泰克科技有限公司

import { defineComponent as A, reactive as D, watch as H, resolveComponent as a, createBlock as _, openBlock as i, unref as U, isRef as q, withCtx as l, createVNode as n, createElementVNode as s, createElementBlock as u, Fragment as y, renderList as h, normalizeClass as w, resolveDynamicComponent as V, toDisplayString as B, createTextVNode as x } from "vue";
import $ from "./cloneElementBasics.js";
import g from "./cloneElementMenu.js";
import { iconBoxEmits as P, iconBoxProps as z } from "./icon-box.js";
import { useIconBox as F } from "./use-icon-box.js";
const L = { class: "icon-list" }, O = ["onClick"], R = { class: "icon-name" }, S = { class: "icon-list" }, j = ["onClick"], G = { class: "icon-name" }, Y = /* @__PURE__ */ A({
  name: "PitIconBox",
  inheritAttrs: !1,
  __name: "icon-box",
  props: z,
  emits: P,
  setup(E, { emit: f }) {
    const d = E, { modelValue: m } = F(d), e = D({
      cloneElementMenu: g,
      cloneElementBasics: $,
      elementMenu: g,
      elementBasics: $,
      active: null,
      keyword: "",
      activeName: "Menu"
    }), t = {
      query() {
        e.keyword === "" && (e.elementMenu = e.cloneElementMenu, e.elementBasics = e.cloneElementBasics), e[`element${e.activeName}`] = e[`cloneElement${e.activeName}`].filter((r) => r.includes(e.keyword));
      },
      onOpen() {
        e.active = e.current, e.keyword = "";
      },
      closeDialog() {
        t.beforeClose();
      },
      choiceIcon() {
        e.active && (f("choiceIcon", e.active), t.beforeClose());
      },
      beforeClose() {
        f("update:modelValue", !1);
      },
      iconActiveHandle(r) {
        e.active = `el-icon-${r}`;
      },
      handleTabsClick() {
        e.keyword = "";
      }
    };
    return H(() => e.keyword, () => {
      t.query();
    }), (r, c) => {
      const N = a("el-input"), v = a("el-icon"), k = a("el-scrollbar"), b = a("el-tab-pane"), M = a("el-tabs"), C = a("el-button"), I = a("pit-dialog");
      return i(), _(I, {
        modelValue: U(m),
        "onUpdate:modelValue": c[3] || (c[3] = (o) => q(m) ? m.value = o : null),
        title: d.title,
        width: d.width,
        "before-close": t.beforeClose
      }, {
        footer: l(() => [
          n(C, {
            onClick: t.closeDialog
          }, {
            default: l(() => [
              x(" 取消 ")
            ]),
            _: 1
          }, 8, ["onClick"]),
          n(C, {
            type: "colour-10",
            onClick: c[2] || (c[2] = (o) => t.choiceIcon())
          }, {
            default: l(() => [
              x(" 确定 ")
            ]),
            _: 1
          })
        ]),
        default: l(() => [
          n(N, {
            modelValue: e.keyword,
            "onUpdate:modelValue": c[0] || (c[0] = (o) => e.keyword = o),
            placeholder: "请输入图标名称(el-icon-后面的为图标名称)"
          }, null, 8, ["modelValue"]),
          n(M, {
            modelValue: e.activeName,
            "onUpdate:modelValue": c[1] || (c[1] = (o) => e.activeName = o),
            class: "pit-el_tabs",
            onTabClick: t.handleTabsClick
          }, {
            default: l(() => [
              n(b, {
                label: "菜单",
                name: "Menu"
              }, {
                default: l(() => [
                  n(k, { style: { height: "500px", "overflow-y": "auto" } }, {
                    default: l(() => [
                      s("ul", L, [
                        (i(!0), u(y, null, h(e.elementMenu, (o, p) => (i(), u("li", {
                          key: p,
                          class: w({ "is-active": `el-icon-${o}` === e.active }),
                          onClick: (T) => t.iconActiveHandle(o)
                        }, [
                          s("span", null, [
                            n(v, null, {
                              default: l(() => [
                                (i(), _(V(o)))
                              ]),
                              _: 2
                            }, 1024),
                            s("span", R, B(`el-icon-${o}`), 1)
                          ])
                        ], 10, O))), 128))
                      ])
                    ]),
                    _: 1
                  })
                ]),
                _: 1
              }),
              n(b, {
                label: "基础",
                name: "Basics"
              }, {
                default: l(() => [
                  n(k, { style: { height: "500px", "overflow-y": "auto" } }, {
                    default: l(() => [
                      s("ul", S, [
                        (i(!0), u(y, null, h(e.elementBasics, (o, p) => (i(), u("li", {
                          key: p,
                          class: w({ "is-active": `el-icon-${o}` === e.active }),
                          onClick: (T) => t.iconActiveHandle(o)
                        }, [
                          s("span", null, [
                            n(v, null, {
                              default: l(() => [
                                (i(), _(V(o)))
                              ]),
                              _: 2
                            }, 1024),
                            s("span", G, B(`el-icon-${o}`), 1)
                          ])
                        ], 10, j))), 128))
                      ])
                    ]),
                    _: 1
                  })
                ]),
                _: 1
              })
            ]),
            _: 1
          }, 8, ["modelValue", "onTabClick"])
        ]),
        _: 1
      }, 8, ["modelValue", "title", "width", "before-close"]);
    };
  }
});
export {
  Y as default
};