@feedmepos/mf-menu 0.0.3 → 0.0.54

package/dist/GroupMarkupPriceDialog.vue_vue_type_script_setup_true_lang-DsoLGvHp.js

@@ -0,0 +1,211 @@
+import { defineComponent as P, useModel as j, computed as V, resolveComponent as m, createBlock as C, openBlock as d, unref as l, ref as I, watch as H, onMounted as J, createElementBlock as S, Fragment as h, renderSlot as K, createVNode as i, withCtx as c, createElementVNode as x, renderList as O, createCommentVNode as w, toDisplayString as F, createTextVNode as Q } from "vue";
+import { useI18n as T } from "@feedmepos/mf-common";
+import { u as R } from "./priceTier-xXhsXzsB.js";
+import { useDialog as W, components as X, FmButtonVariant as Y, FmButtonColorThemeVariant as M } from "@feedmepos/ui-library";
+import { L as Z } from "./LinkProductSideSheet-u1jj74-0.js";
+import { c as z } from "./check-C9mY6LiX.js";
+import { u as ee, I as B, N as le } from "./menu-NS-_m-8z.js";
+import { c as oe } from "./string-DpfFixWH.js";
+const fe = /* @__PURE__ */ P({
+  __name: "LinkPriceTier",
+  props: {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(b) {
+    const { t: p } = T(), n = j(b, "modelValue"), _ = R(), a = V(() => [
+      {
+        label: p("menu.price_tier.not_linked"),
+        value: null
+      },
+      ..._.priceTiers.value.map((f) => ({
+        label: f.key,
+        value: f.key
+      }))
+    ]);
+    return (f, k) => {
+      var s;
+      const u = m("FmSelect");
+      return d(), C(u, {
+        label: l(p)("menu.price_tier.link_price_group"),
+        "helper-text": l(p)("menu.price_tier.link_price_group_description"),
+        items: a.value,
+        "model-value": ((s = n.value) == null ? void 0 : s[0]) || null,
+        "onUpdate:modelValue": k[0] || (k[0] = (e) => n.value = e ? [e] : null)
+      }, null, 8, ["label", "helper-text", "items", "model-value"]);
+    };
+  }
+}), te = { class: "space-y-16" }, ae = { class: "ml-32 mt-16 space-y-8" }, ne = {
+  key: 0,
+  class: "fm-typo-en-body-lg-400 text-fm-color-typo-secondary"
+}, ve = /* @__PURE__ */ P({
+  __name: "GroupMarkupPriceDialog",
+  props: {
+    modelValue: {},
+    items: {},
+    categories: {},
+    action: {}
+  },
+  emits: ["update:model-value"],
+  setup(b, { emit: p }) {
+    const n = b, _ = ee();
+    W();
+    const { t: a } = T(), f = p, k = V(() => n.action === "add" ? a("menu.markup.dialog.title.add") : a("menu.markup.dialog.title.update")), u = I(!1), s = (o) => {
+      z.isBoolean(o) ? u.value = o : u.value = !u.value;
+    }, e = I(
+      n.modelValue ? B(n.modelValue) : {
+        percentage: 0,
+        includeItems: null
+      }
+    );
+    H(
+      () => u.value,
+      (o) => {
+        o && (e.value = n.modelValue ? B(n.modelValue) : {
+          percentage: 0,
+          includeItems: null
+        });
+      }
+    ), V(
+      () => le(_.variants, n.categories, n.items)
+    );
+    function L(o) {
+      e.value = {
+        ...e.value,
+        includeItems: o
+      };
+    }
+    const v = I(
+      0
+      /* ALL */
+    );
+    function N(o) {
+      v.value = o, e.value = {
+        ...e.value,
+        includeItems: o === 0 ? null : []
+      };
+    }
+    const U = V(() => [
+      {
+        label: a("menu.markup.dialog.options.all"),
+        value: 0
+        /* ALL */
+      },
+      {
+        label: a("menu.markup.dialog.options.custom"),
+        value: 1
+        /* CUSTOM */
+      }
+    ]);
+    async function D() {
+      f("update:model-value", e.value), s(!1);
+    }
+    return J(() => {
+      v.value = e.value && e.value.includeItems === null ? 0 : 1;
+    }), (o, r) => {
+      const q = m("fm-icon"), E = m("fm-stepper-field"), $ = m("fm-radio"), A = m("fm-radio-group"), y = m("fm-button"), G = m("fm-dialog");
+      return d(), S(h, null, [
+        K(o.$slots, "default", { trigger: s }),
+        i(G, {
+          modelValue: u.value,
+          "onUpdate:modelValue": r[3] || (r[3] = (g) => u.value = g),
+          "is-component": l(X).FmForm,
+          "is-component-props": {
+            onValidationSuccess: D
+          }
+        }, {
+          "dialog-header": c(() => [
+            Q(F(k.value), 1)
+          ]),
+          "dialog-footer": c(() => [
+            i(y, {
+              class: "sm:w-full xs:w-full ml-auto",
+              label: "Cancel",
+              variant: "tertiary",
+              onClick: r[2] || (r[2] = (g) => s(!1))
+            }),
+            i(y, {
+              label: l(oe)(o.action),
+              class: "sm:w-full xs:w-full",
+              size: "md",
+              type: "submit",
+              variant: "primary"
+            }, null, 8, ["label"])
+          ]),
+          default: c(() => {
+            var g;
+            return [
+              x("div", te, [
+                i(E, {
+                  modelValue: e.value.percentage,
+                  "onUpdate:modelValue": r[0] || (r[0] = (t) => e.value.percentage = t),
+                  decimal: 0,
+                  max: 100,
+                  min: 0,
+                  rules: [
+                    (t) => l(z).isSet(t) && t >= 0 || l(a)("menu.markup.dialog.fields.percentage.required")
+                  ],
+                  label: l(a)("menu.markup.dialog.fields.percentage.label"),
+                  placeholder: l(a)("menu.markup.dialog.fields.percentage.placeholder")
+                }, {
+                  prepend: c(() => [
+                    i(q, { name: "percent" })
+                  ]),
+                  _: 1
+                }, 8, ["modelValue", "rules", "label", "placeholder"]),
+                x("div", null, [
+                  i(A, {
+                    modelValue: v.value,
+                    "onUpdate:modelValue": [
+                      r[1] || (r[1] = (t) => v.value = t),
+                      N
+                    ],
+                    class: "space-y-8"
+                  }, {
+                    default: c(() => [
+                      (d(!0), S(h, null, O(U.value, (t) => (d(), C($, {
+                        key: t.value,
+                        label: t.label,
+                        value: t.value
+                      }, null, 8, ["label", "value"]))), 128))
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue"]),
+                  x("div", ae, [
+                    i(Z, {
+                      title: "Link products",
+                      "categorized-items": l(_).categorizedItems,
+                      "initial-value": e.value.includeItems || [],
+                      "show-variant": !1,
+                      onSubmit: L
+                    }, {
+                      default: c(({ trigger: t }) => [
+                        v.value === 1 ? (d(), C(y, {
+                          key: 0,
+                          "text-color": l(M).ColorPrimary,
+                          "border-color": l(M).ColorPrimary,
+                          variant: l(Y).Secondary,
+                          label: l(a)("menu.markup.dialog.products.link"),
+                          "prepend-icon": "link",
+                          onClick: t
+                        }, null, 8, ["text-color", "border-color", "variant", "label", "onClick"])) : w("", !0)
+                      ]),
+                      _: 1
+                    }, 8, ["categorized-items", "initial-value"]),
+                    (g = e.value.includeItems) != null && g.length ? (d(), S("p", ne, F(l(a)("menu.markup.dialog.products.count", { count: e.value.includeItems.length })), 1)) : w("", !0)
+                  ])
+                ])
+              ])
+            ];
+          }),
+          _: 1
+        }, 8, ["modelValue", "is-component", "is-component-props"])
+      ], 64);
+    };
+  }
+});
+export {
+  ve as _,
+  fe as a
+};