import { defineComponent as R, computed as w, ref as E, watch as C, resolveComponent as g, createElementBlock as M, openBlock as V, Fragment as K, renderSlot as j, createVNode as s, unref as n, withCtx as m, createElementVNode as d, createBlock as F, createCommentVNode as U, normalizeClass as J, createSlots as Q, toDisplayString as H } from "vue";
import { Q as W, G as X, I as f, D, M as I, A as S, J as Z } from "./index.vue_vue_type_script_setup_true_lang-BMVa5UfU.js";
import { d as ee } from "./vuedraggable-CK8z7qA8.js";
import { useI18n as te } from "@feedmepos/mf-common";
import { useSnackbar as ae, components as ne } from "@feedmepos/ui-library";
import { _ as oe } from "./FormItem.vue_vue_type_script_setup_true_lang-BmPAVphe.js";
import { _ as le } from "./RuleView.vue_vue_type_script_setup_true_lang-DRUQOy4h.js";
import { u as ie } from "./discardConfirm-BHni0LNu.js";
import { _ as se } from "./ApplyProduct.vue_vue_type_script_setup_true_lang-B8Tcqib_.js";
import { c as re } from "./check-C9mY6LiX.js";
const ue = { class: "fm-typo-en-title-md-600" }, me = { class: "py-16 space-y-32" }, de = ["data-not-allow-sort"], ce = {
  key: 1,
  class: "w-24"
}, pe = { class: "flex-1" }, fe = { class: "flex gap-8 items-center justify-start" }, ve = /* @__PURE__ */ R({
  __name: "Form",
  props: {
    initialValue: {}
  },
  setup(B, { expose: N }) {
    const r = B, b = W(X(ae())), { t: o } = te(), A = w(
      () => r.initialValue ? o("menu.variant.form.title.edit") : o("menu.variant.form.title.add")
    ), L = w(() => r.initialValue ? "Update" : "Add"), k = () => {
      if (r.initialValue) {
        const e = f(r.initialValue);
        return e.options.push({
          _id: (/* @__PURE__ */ new Date()).toISOString(),
          name: ""
        }), e;
      } else
        return { ...D.generator.initMenuV4VariantGroup(), usedBy: [] };
    }, t = E(k()), y = E(!1), i = E(!1), x = (e) => {
      re.isBoolean(e) ? i.value = e : i.value = !i.value;
    };
    function $(e) {
      t.value.options = e;
    }
    function q(e, a) {
      const l = f(t.value.options), c = l.findIndex((v) => v._id == e);
      l[c].name = a, t.value.options = l, c === t.value.options.length - 1 && O();
    }
    function O() {
      const e = f(t.value.options);
      t.value.options = [
        ...e,
        {
          _id: (/* @__PURE__ */ new Date()).toISOString(),
          name: ""
        }
      ];
    }
    function P(e) {
      const a = f(t.value.options);
      t.value.options = a.filter((l) => l._id !== e);
    }
    C(
      () => t.value.options,
      (e) => {
        e.length <= 0 && O();
      },
      {
        immediate: !0
      }
    );
    function T(e) {
      const a = e.draggedContext.futureIndex, l = e.relatedContext.list;
      return a !== l.length - 1;
    }
    const Y = ie(
      () => {
        if (r.initialValue) {
          const e = t.value.options.filter((a) => !!a.name.trim());
          return !Z.isEqual({ ...t.value, options: e }, r.initialValue);
        } else
          return !!(t.value.options.length > 1 || t.value.name.trim());
      },
      () => {
        i.value = !1;
      }
    ), z = async () => {
      try {
        y.value = !0;
        const e = f(t.value);
        e.options = e.options.filter((a) => !!a.name.trim()), r.initialValue ? await b.updateMenu(
          {
            module: S.F_MENU_MODULE_V4_KEY.enum.variant,
            operation: I.F_OPERATION_TYPE.update,
            data: e
          },
          e.name
        ) : await b.updateMenu(
          {
            module: S.F_MENU_MODULE_V4_KEY.enum.variant,
            operation: I.F_OPERATION_TYPE.create,
            data: e
          },
          e.name
        ), x(!1), t.value = { ...D.generator.initMenuV4VariantGroup(), usedBy: [] };
      } finally {
        y.value = !1;
      }
    };
    return C(
      () => i.value,
      (e) => {
        e && (t.value = k());
      }
    ), N({
      show: i,
      trigger: x
    }), (e, a) => {
      const l = g("fm-text-field"), c = g("fm-icon"), v = g("fm-button"), G = g("fm-side-sheet");
      return V(), M(K, null, [
        j(e.$slots, "default", { trigger: x }),
        s(G, {
          id: "variant-form",
          modelValue: i.value,
          "onUpdate:modelValue": a[2] || (a[2] = (_) => i.value = _),
          "is-container": n(ne).FmForm,
          "is-container-props": {
            onValidationSuccess: z,
            blameFormChildOnValidationFailed: !0
          },
          "max-width": 560,
          "onOn:clickedAway": n(Y)
        }, {
          "side-sheet-header": m(() => [
            d("p", ue, H(A.value), 1)
          ]),
          "side-sheet-footer": m(() => [
            d("div", fe, [
              s(v, {
                label: L.value,
                loading: y.value,
                size: "lg",
                type: "submit",
                variant: "primary"
              }, null, 8, ["label", "loading"]),
              s(v, {
                label: n(o)("menu.common.actions.cancel"),
                size: "lg",
                variant: "tertiary",
                onClick: a[1] || (a[1] = () => i.value = !1)
              }, null, 8, ["label"])
            ])
          ]),
          default: m(() => {
            var _;
            return [
              d("div", me, [
                s(le, {
                  title: n(o)("menu.variant.form.detail")
                }, {
                  default: m(() => [
                    s(l, {
                      autofocus: "",
                      label: n(o)("menu.variant.form.name.label"),
                      "helper-text": n(o)("menu.variant.form.name.helper"),
                      modelValue: t.value.name,
                      "onUpdate:modelValue": a[0] || (a[0] = (u) => t.value.name = u),
                      rules: [(u) => !!u || n(o)("menu.variant.form.name.required")],
                      placeholder: n(o)("menu.variant.form.name.placeholder")
                    }, null, 8, ["label", "helper-text", "modelValue", "rules", "placeholder"]),
                    s(oe, {
                      label: n(o)("menu.variant.form.options.title")
                    }, {
                      default: m(() => [
                        d("div", null, [
                          s(n(ee), {
                            "model-value": t.value.options,
                            move: T,
                            class: "space-y-16",
                            group: "categories",
                            handle: ".handle",
                            "item-key": "_id",
                            "onUpdate:modelValue": $
                          }, {
                            item: m(({ element: u, index: p }) => [
                              d("div", {
                                class: J(["flex items-center", "space-x-8"]),
                                "data-not-allow-sort": p === t.value.options.length - 1
                              }, [
                                p !== t.value.options.length - 1 ? (V(), F(c, {
                                  key: 0,
                                  class: "handle",
                                  name: "drag_handle"
                                })) : p > 0 ? (V(), M("div", ce)) : U("", !0),
                                d("div", pe, [
                                  s(l, {
                                    "model-value": u.name,
                                    rules: [
                                      () => !!t.value.options.length || n(o)("menu.variant.form.options.min_required"),
                                      (h) => p === t.value.options.length - 1 || h ? !0 : n(o)("menu.variant.form.options.name_required")
                                    ],
                                    class: "flex-1",
                                    placeholder: n(o)("menu.variant.form.options.placeholder"),
                                    "onUpdate:modelValue": (h) => q(u._id, h)
                                  }, Q({ _: 2 }, [
                                    p !== t.value.options.length - 1 ? {
                                      name: "append",
                                      fn: m(() => [
                                        s(c, {
                                          name: "close",
                                          onClick: (h) => P(u._id)
                                        }, null, 8, ["onClick"])
                                      ]),
                                      key: "0"
                                    } : void 0
                                  ]), 1032, ["model-value", "rules", "placeholder", "onUpdate:modelValue"])
                                ])
                              ], 8, de)
                            ]),
                            _: 1
                          }, 8, ["model-value"])
                        ])
                      ]),
                      _: 1
                    }, 8, ["label"])
                  ]),
                  _: 1
                }, 8, ["title"]),
                (_ = t.value.usedBy) != null && _.length ? (V(), F(se, {
                  key: 0,
                  editable: !1,
                  overrides: t.value.usedBy || [],
                  "select-variant": !1,
                  title: n(o)("menu.variant.form.applied_product")
                }, null, 8, ["overrides", "title"])) : U("", !0)
              ])
            ];
          }),
          _: 1
        }, 8, ["modelValue", "is-container", "is-container-props", "onOn:clickedAway"])
      ], 64);
    };
  }
}), we = ve;
export {
  we as V
};
