import { defineComponent as M, ref as k, reactive as C, createVNode as n, resolveComponent as u, createTextVNode as O } from "vue";
import { ElForm as V, ElFormItem as x, ElInput as N, ElButton as L, ElTooltip as F, ElDropdown as H, ElDropdownMenu as U, ElDropdownItem as j, ElIcon as I, ElMessageBox as G } from "element-plus";
import { o as A, T as c, t as _, A as R, p as K, q as S, r as T, s as X, v as q } from "./main-Blxobku2.js";
import { appSchema as b, useResolveVnode as P } from "@klweb/compose-app-engine";
import { e as B } from "./index-BbdVezoQ.js";
function z(s, r, p) {
  const l = {};
  return Object.keys(s).forEach((f) => {
    const h = s[f];
    f === r ? l[p] = h : l[f] = h;
  }), l;
}
const $ = /* @__PURE__ */ M({
  name: "AddOrEditPage",
  components: {
    ElForm: V,
    ElFormItem: x,
    ElInput: N,
    ElButton: L
  },
  props: {
    mode: {
      type: String,
      default: "ADD"
    },
    payload: {
      type: Object,
      default: () => ({})
    },
    currentRoutes: {
      type: Array,
      default: () => []
    }
  },
  setup(s, {
    emit: r
  }) {
    const p = k();
    let l = C({
      path: "",
      name: "",
      meta: {
        title: "",
        useTitle: !1
      }
    });
    s.mode === "EDIT" && s.payload && (l = Object.assign(l, A(s.payload)));
    const f = (o, m, E) => {
      if (m) {
        let e = !0;
        for (let t = 0; t < s.currentRoutes.length; t++) {
          const a = s.currentRoutes[t];
          if (a.path !== s.payload.path && a.path === m) {
            E(new Error(c.PAGE_PATH_HAS_ERROR_TEXT)), e = !1;
            break;
          }
        }
        e && E();
      }
    }, h = (o, m, E) => {
      if (m) {
        let e = !0;
        for (let t = 0; t < s.currentRoutes.length; t++) {
          const a = s.currentRoutes[t];
          if (a.name !== s.payload.name && a.name === m) {
            E(new Error(c.ROUTE_NAME_HAS_ERROR_TEXT)), e = !1;
            break;
          }
        }
        e && E();
      }
    }, w = C({
      "meta.title": [{
        required: !0,
        message: c.PAGE_TITLE_NULL_TEXT,
        trigger: "blur"
      }],
      path: [{
        required: !0,
        message: c.PAGE_PATH_NULL_TEXT,
        trigger: "blur"
      }, {
        pattern: /^\/[^/]*$/,
        message: c.PAGE_PATH_ERROR_TEXT
      }, {
        validator: f
      }],
      name: [{
        required: !0,
        message: c.ROUTE_NAME_NULL_TEXT,
        trigger: "blur"
      }, {
        validator: h
      }]
    }), v = () => {
      p.value && p.value.validate((o) => {
        if (o)
          switch (s.mode) {
            case "ADD":
              r("close", l);
              break;
            case "EDIT":
              K(l, s.payload) ? r("close", "") : r("close", l);
              break;
          }
      });
    };
    return () => n("div", {
      class: "dialog-component"
    }, [n("section", {
      class: "dialog-component__body"
    }, [n(u("el-form"), {
      ref: p,
      model: l,
      "label-width": "auto",
      "hide-required-asterisk": !0,
      rules: w
    }, {
      default: () => [n(u("el-form-item"), {
        label: "页面标题",
        prop: "meta.title"
      }, {
        default: () => [n(u("el-input"), {
          modelValue: l.meta.title,
          "onUpdate:modelValue": (o) => l.meta.title = o,
          placeholder: c.PAGE_TITLE_PLACEHOLDER,
          clearable: !0,
          formatter: (o) => _(o),
          parser: (o) => _(o)
        }, null)]
      }), n(u("el-form-item"), {
        label: "页面路径",
        prop: "path"
      }, {
        default: () => [n(u("el-input"), {
          modelValue: l.path,
          "onUpdate:modelValue": (o) => l.path = o,
          placeholder: c.PAGE_PATH_PLACEHOLDER,
          clearable: !0,
          formatter: (o) => _(o),
          parser: (o) => _(o),
          disabled: l.path === "/" && s.payload.path === "/"
        }, null)]
      }), n(u("el-form-item"), {
        label: "路由名称",
        prop: "name"
      }, {
        default: () => [n(u("el-input"), {
          modelValue: l.name,
          "onUpdate:modelValue": (o) => l.name = o,
          placeholder: c.ROUTE_NAME_PLACEHOLDER,
          clearable: !0,
          formatter: (o) => _(o),
          parser: (o) => _(o)
        }, null)]
      })]
    })]), n("section", {
      class: "dialog-component__footer"
    }, [n(u("el-button"), {
      onClick: () => r("close")
    }, {
      default: () => [R.CANCEL]
    }), n(u("el-button"), {
      type: "primary",
      onClick: v
    }, {
      default: () => [R.COMFIRM]
    })])]);
  }
}), D = {
  "route-list-container": "_route-list-container_cxoux_1",
  "add-page-btn": "_add-page-btn_cxoux_7",
  "route-list__content": "_route-list__content_cxoux_11"
}, {
  IconAddPage: W,
  IconHome: J,
  IconPageSub: Q,
  IconMoreFilled: Y,
  IconRename: Z,
  IconDel: ee
} = B, re = /* @__PURE__ */ M({
  name: "KlEditorPagePanel",
  components: {
    ElButton: L,
    ElTooltip: F,
    ElDropdown: H,
    ElDropdownMenu: U,
    ElDropdownItem: j
  },
  inheritAttrs: !0,
  setup() {
    var m, E;
    const s = new S(), r = k([]), p = (m = b.value) == null ? void 0 : m.pages;
    for (const e in p) {
      const {
        path: t,
        name: a,
        meta: i
      } = p[e], g = {
        path: t,
        name: a,
        meta: i
      };
      r.value.push(g);
    }
    ((E = r.value[0]) == null ? void 0 : E.path) !== "/" && r.value.some((e, t) => {
      var a, i;
      if (e.path === "/")
        return (i = r.value) == null || i.unshift((a = r.value) == null ? void 0 : a.splice(t, 1)[0]), !0;
    });
    const l = (e) => {
      var a;
      (a = r.value) == null || a.push(e);
      const t = {
        eventType: "updateRouters",
        type: "add",
        newData: A(e)
      };
      window.KlComposeAppEngineEditor && window.KlComposeAppEngineEditor.postMessage(t, location.origin), X(e);
    }, f = (e) => {
      G.confirm(c.DELETE_PAGE_WARN_TEXT, "提示", {
        type: "warning",
        draggable: !0,
        autofocus: !1
      }).then(async () => {
        var a;
        (a = r.value) == null || a.some((i, g) => {
          var d;
          if (e.path === i.path)
            return (d = r.value) == null || d.splice(g, 1), !0;
        }), q(e.path), T.value === e.path && (T.value = "/");
        const t = {
          eventType: "updateRouters",
          type: "remove",
          oldData: A(e)
        };
        window.KlComposeAppEngineEditor && window.KlComposeAppEngineEditor.postMessage(t, location.origin);
      }).catch(() => {
        console.log("取消");
      });
    }, h = (e, t) => {
      const a = e.path, i = t.path, g = {
        eventType: "updateRouters",
        type: "edit",
        oldData: A(e),
        newData: A(t)
      };
      window.KlComposeAppEngineEditor && window.KlComposeAppEngineEditor.postMessage(g, location.origin), e = Object.assign(e, t);
      const d = b.value.pages[a];
      for (const y in t)
        Object.hasOwn(d, y) && (d[y] = t[y]);
      a !== i && (b.value.pages = z(b.value.pages, a, i)), T.value === a && setTimeout(() => {
        T.value = i;
      }, 300);
    }, w = (e) => {
      T.value = e;
    }, v = (e, t) => {
      s.service({
        width: 440,
        top: "25vh",
        targetFlag: e,
        title: `${R[e]}页面`,
        contentModule: $,
        contentAttrs: {
          mode: e,
          payload: t,
          currentRoutes: r.value
        }
      }, (a) => {
        const {
          event: i,
          targetFlag: g,
          emitParams: d
        } = a;
        i !== "close" || !d || (g === "ADD" ? l(d) : h(t, d));
      });
    }, o = (e) => {
      const {
        type: t,
        data: a
      } = e;
      switch (t) {
        case "EDIT":
          v(t, a);
          break;
        case "REMOVE":
          f(a);
          break;
      }
    };
    return () => n("section", {
      class: D["route-list-container"]
    }, [n(u("el-button"), {
      size: "large",
      class: D["add-page-btn"],
      type: "primary",
      icon: W,
      onClick: () => v("ADD")
    }, {
      default: () => [R.ADD_PAGE]
    }), n("ul", {
      class: D["route-list__content"]
    }, [r.value && r.value.map((e) => n("li", {
      class: T.value === e.path ? "active" : ""
    }, [n("span", {
      onClick: () => w(e.path)
    }, [P(I, {
      size: 15
    }, {
      default: () => P(e.path === "/" ? J : Q)
    }), e.meta.title, n("font", null, [O("("), e.path, O(")")])]), n(u("el-tooltip"), {
      effect: "dark",
      placement: "top",
      "hide-after": 0,
      content: c.EDIT_ROUTER_TIP_TEXT
    }, {
      default: () => [n(u("el-dropdown"), {
        trigger: "click",
        onCommand: o
      }, {
        default: () => P(I, {}, {
          default: () => P(Y)
        }),
        dropdown: () => n(u("el-dropdown-menu"), null, {
          default: () => [n(u("el-dropdown-item"), {
            icon: Z,
            command: {
              type: "EDIT",
              data: e
            }
          }, {
            default: () => [R.EDIT]
          }), n(u("el-dropdown-item"), {
            icon: ee,
            disabled: e.path === "/",
            command: {
              type: "REMOVE",
              data: e
            }
          }, {
            default: () => [R.REMOVE]
          })]
        })
      })]
    })]))])]);
  }
});
export {
  re as default
};
