import { defineComponent as A, mergeModels as G, useModel as K, ref as R, computed as N, resolveComponent as v, createBlock as k, openBlock as u, withCtx as m, createElementVNode as h, createVNode as a, unref as l, normalizeClass as de, createTextVNode as xe, toDisplayString as E, createElementBlock as O, Fragment as H, renderSlot as Me, createCommentVNode as P, watch as fe, renderList as Z, resolveDynamicComponent as qe, isRef as Ue, normalizeStyle as ke, onMounted as Ee } from "vue";
import { W as Pe, g as ze, _ as Je, i as Le, S as Se, d as $e, T as He, a as je } from "./TransitionFade-12cVfWgY.js";
import { D as L, c as ve, C as he, a as De, b as Ge, v as ue } from "./BaseDialog.vue_vue_type_script_setup_true_lang-Dmpc24i4.js";
import { storeToRefs as ge } from "pinia";
import { useRouter as Be, useRoute as Ie } from "vue-router";
import { useBreakpoints as be, useSnackbar as Re, FmButtonColorThemeVariant as ne } from "@feedmepos/ui-library";
import { u as We } from "./message-dialog-UoMWOnil.js";
import { u as ce, b as Ke, h as we, e as Ae } from "./vue-i18n-C1hP_yGq.js";
import { r as me } from "./i18n-CI_sQ5d_.js";
import { a as Te, _ as _e } from "./FilterSelector.vue_vue_type_script_setup_true_lang-CIh5MO0J.js";
import { _ as Fe } from "./NoData.vue_vue_type_script_setup_true_lang-BwIUTmvY.js";
import { a as Oe } from "./SelectComponent.vue_vue_type_script_setup_true_lang-BEm9iVWM.js";
const Qe = /* @__PURE__ */ A({
  __name: "WidgetDialog",
  props: /* @__PURE__ */ G({
    isOpen: { type: Boolean }
  }, {
    modelValue: {},
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ G(["update:isOpen"], ["update:modelValue"]),
  setup(C, { emit: s }) {
    const { t: n } = ce(), { breakpoints: r } = be(), w = K(C, "modelValue"), c = C, x = s;
    function D() {
      x("update:isOpen", !1);
    }
    function g() {
      d.value && (w.value = d.value, d.value = void 0, x("update:isOpen", !1));
    }
    const d = R(), W = N(() => !d.value);
    return (q, $) => {
      const B = v("FmButton"), f = v("FmDialog");
      return u(), k(f, {
        "model-value": c.isOpen
      }, {
        "dialog-header": m(() => [
          xe(E(l(n)("report.widget.type")), 1)
        ]),
        default: m(() => [
          a(Pe, {
            modelValue: d.value,
            "onUpdate:modelValue": $[0] || ($[0] = (M) => d.value = M),
            class: de(`grid ${l(r).lg || l(r).md ? "grid-cols-3 gap-3" : "grid-cols-2 gap-3"}`),
            "child-class": "p-[8px] flex flex-col"
          }, null, 8, ["modelValue", "class"])
        ]),
        "dialog-footer": m(() => [
          $[1] || ($[1] = h("div", { class: "grow" }, null, -1)),
          a(B, {
            label: l(n)("report.common.cancel"),
            variant: "tertiary",
            onClick: D
          }, null, 8, ["label"]),
          a(B, {
            label: l(n)("report.common.confirm"),
            disabled: W.value,
            onClick: g
          }, null, 8, ["label", "disabled"])
        ]),
        _: 1
      }, 8, ["model-value"]);
    };
  }
}), Xe = { class: "fm-typo-en-body-lg-600" }, Ve = /* @__PURE__ */ A({
  __name: "ReportEditorTabHeader",
  props: /* @__PURE__ */ G({
    icon: {
      type: String,
      required: !0
    }
  }, {
    modelValue: { type: Boolean, required: !0, default: !1 },
    modelModifiers: {}
  }),
  emits: ["update:modelValue"],
  setup(C) {
    const { t: s } = ce(), n = K(C, "modelValue"), r = C;
    return (w, c) => {
      const x = v("FmIcon");
      return u(), O("div", {
        class: "px-6 py-16 flex items-center gap-2 bg-fm-color-neutral-white border cursor-pointer",
        onClick: c[0] || (c[0] = (D) => n.value = !n.value)
      }, [
        h("p", Xe, E(l(s)("report.editor.customizeReport")), 1),
        c[1] || (c[1] = h("div", { class: "grow" }, null, -1)),
        a(x, {
          name: r.icon
        }, null, 8, ["name"])
      ]);
    };
  }
}), Ye = /* @__PURE__ */ A({
  __name: "ReportEditorTabDesktop",
  props: {
    modelValue: { required: !0, default: !1 },
    modelModifiers: {}
  },
  emits: ["update:modelValue"],
  setup(C) {
    const s = K(C, "modelValue");
    return (n, r) => (u(), O(H, null, [
      a(Ve, {
        modelValue: s.value,
        "onUpdate:modelValue": r[0] || (r[0] = (w) => s.value = w),
        icon: "keyboard_double_arrow_left"
      }, null, 8, ["modelValue"]),
      Me(n.$slots, "default")
    ], 64));
  }
}), Ze = /* @__PURE__ */ A({
  __name: "ReportEditorTabMobile",
  props: {
    modelValue: { required: !0, default: !1 },
    modelModifiers: {}
  },
  emits: ["update:modelValue"],
  setup(C) {
    const s = K(C, "modelValue");
    return (n, r) => {
      const w = v("FmTopSheet"), c = v("FmCard");
      return u(), k(c, { class: "fixed bottom-0 w-full" }, {
        default: m(() => [
          a(Ve, {
            modelValue: s.value,
            "onUpdate:modelValue": r[0] || (r[0] = (x) => s.value = x),
            icon: "keyboard_double_arrow_up"
          }, null, 8, ["modelValue"]),
          a(w, {
            modelValue: s.value,
            "onUpdate:modelValue": r[2] || (r[2] = (x) => s.value = x),
            "fullscreen-size": "sm"
          }, {
            default: m(() => [
              a(Ve, {
                modelValue: s.value,
                "onUpdate:modelValue": r[1] || (r[1] = (x) => s.value = x),
                icon: "keyboard_double_arrow_down"
              }, null, 8, ["modelValue"]),
              s.value ? Me(n.$slots, "default", { key: 0 }) : P("", !0)
            ]),
            _: 3
          }, 8, ["modelValue"])
        ]),
        _: 3
      });
    };
  }
}), el = {
  key: 2,
  class: "flex flex-col gap-2"
}, ll = /* @__PURE__ */ A({
  __name: "GlobalFilterDialog",
  props: /* @__PURE__ */ G({
    schemas: {
      type: Array,
      default: () => []
    },
    tiles: {
      type: Array,
      required: !0
    }
  }, {
    globalFilter: {
      default: () => null
    },
    globalFilterModifiers: {},
    isOpen: { type: Boolean, default: () => !1, required: !0 },
    isOpenModifiers: {}
  }),
  emits: ["update:globalFilter", "update:isOpen"],
  setup(C) {
    const { t: s, te: n } = ce(), r = K(C, "globalFilter"), w = K(C, "isOpen"), c = Re(), x = C, D = R(), g = R(), d = R(), W = R(), q = R([]), $ = R([]), B = R(""), f = R(!1);
    fe(w, (o) => {
      var e, V, i, t, p, _, F;
      o && (D.value = ((e = r.value) == null ? void 0 : e.label) || "", g.value = x.schemas.find(
        (U) => {
          var T;
          return U.name === ((T = r.value) == null ? void 0 : T.schemaName);
        }
      ), d.value = (V = ee.value.find(
        (U) => {
          var T;
          return U.value.name === ((T = r.value) == null ? void 0 : T.name);
        }
      )) == null ? void 0 : V.value, W.value = (i = r.value) == null ? void 0 : i.option, q.value = ((t = r.value) == null ? void 0 : t.tileIds) || [], $.value = ((p = r.value) == null ? void 0 : p.filters) || [], f.value = !!((_ = r.value) != null && _.dataFormula), B.value = ((F = r.value) == null ? void 0 : F.dataFormula) || "");
    });
    const M = N(
      () => x.schemas.map((o) => ({
        label: o.label || o.name,
        value: o
      }))
    ), ee = N(() => {
      var o;
      return (((o = g.value) == null ? void 0 : o.fields) || []).map((e) => ({
        label: e.label || e.name,
        value: e
      }));
    }), le = N(() => {
      var o;
      return ((o = d.value) == null ? void 0 : o.type) !== L.Timestamp ? [] : ze(s);
    }), z = N(() => x.tiles.reduce((o, e, V) => {
      var p, _;
      const i = e.widget.config.schemaNames ?? [], t = (e.widget.config.joinDatasources ?? []).flatMap(
        (F) => F.schemaNames ?? []
      );
      return [...i, ...t].includes(((p = g.value) == null ? void 0 : p.name) || "") && o.push({
        label: (_ = e == null ? void 0 : e.widget.title) != null && _.trim() ? e.widget.title : `Widget ${V + 1}`,
        value: e.id
      }), o;
    }, [])), I = N(
      () => x.schemas.flatMap(
        (o) => (o.fields ?? []).map((e) => ({
          ...e,
          labels: [
            me(s, n, o.label, "schema"),
            me(s, n, e.label || e.name, "other")
          ]
        }))
      )
    );
    function b(o) {
      var e;
      o.name !== ((e = g.value) == null ? void 0 : e.name) && (g.value = o, d.value = void 0);
    }
    function J(o) {
      d.value = o, W.value = o.type === L.Timestamp ? ve.DateTime : void 0;
    }
    function j(o, e) {
      switch (o) {
        case L.Timestamp:
          return e === ve.DateTime || e === ve.TimeOfDay ? he.Between : he.Equal;
        case L.Bool:
        case L.String:
        case L.Numeric:
          return he.Equal;
        default:
          throw new Error(`Unsupported data type: ${o}`);
      }
    }
    function Q() {
      if (!g.value) {
        c.open({ message: "Invalid schema", type: "error" });
        return;
      }
      if (!d.value) {
        c.open({ message: "Invalid dimension", type: "error" });
        return;
      }
      const o = $.value.filter((e) => e ? !M.value.some((i) => i.value.name === e.schemaName) : !0);
      if (o.length > 0) {
        c.open({
          message: `Invalid filter(s): ${o.filter((e) => !!e).map((e) => e.schemaName).join(
            ", "
          )}${o.some((e) => !e) ? ", unknown filter(s)" : ""} - schema not found`,
          type: "error"
        });
        return;
      }
      r.value = {
        schemaName: g.value.name,
        name: d.value.name,
        label: D.value,
        operator: j(
          d.value.type,
          d.value.type === L.Timestamp ? W.value ?? ve.DateTime : null
        ),
        option: d.value.type === L.Timestamp ? W.value : null,
        values: [],
        tileIds: [...q.value],
        filters: JSON.parse(JSON.stringify($.value)),
        dataFormula: f.value ? B.value : void 0
      }, w.value = !1;
    }
    function te() {
      w.value = !1;
    }
    const oe = N(() => {
      var o;
      return [
        (o = g.value) == null ? void 0 : o.name,
        ...$.value.map((e) => e.schemaName)
      ];
    });
    function re(o) {
      var p, _, F, U;
      const e = x.tiles.find((T) => T.id === o.value), V = ((_ = (p = e == null ? void 0 : e.widget) == null ? void 0 : p.config) == null ? void 0 : _.schemaNames) ?? [], i = (((U = (F = e == null ? void 0 : e.widget) == null ? void 0 : F.config) == null ? void 0 : U.joinDatasources) ?? []).flatMap(
        (T) => T.schemaNames ?? []
      ), t = [...V, ...i];
      return oe.value.filter((T) => !!T).some((T) => !t.includes(T));
    }
    return (o, e) => {
      const V = v("FmTextField"), i = v("FmSelect"), t = v("FmCheckbox"), p = v("FmTextarea"), _ = v("FmLabel"), F = v("FmIcon"), U = v("FmTooltip"), T = v("FmForm"), ie = v("FmButton"), pe = v("FmDialog");
      return u(), k(pe, {
        modelValue: w.value,
        "onUpdate:modelValue": e[8] || (e[8] = (X) => w.value = X),
        overlay: !0,
        "z-index": 10
      }, {
        "dialog-header": m(() => [
          xe(E(l(s)("report.section.filter.globalFilter")), 1)
        ]),
        default: m(() => [
          a(T, {
            ref: "form",
            class: "flex flex-col gap-2 w-[490px]"
          }, {
            default: m(() => {
              var X;
              return [
                a(V, {
                  modelValue: D.value,
                  "onUpdate:modelValue": e[0] || (e[0] = (S) => D.value = S),
                  placeholder: l(s)("report.section.filter.displayName"),
                  label: l(s)("report.section.filter.displayName"),
                  class: "mb-2"
                }, null, 8, ["modelValue", "placeholder", "label"]),
                a(Oe, {
                  "model-value": g.value,
                  items: M.value,
                  placeholder: l(s)("report.section.schema.title"),
                  label: l(s)("report.section.schema.title"),
                  "onUpdate:modelValue": e[1] || (e[1] = (S) => b(S))
                }, null, 8, ["model-value", "items", "placeholder", "label"]),
                a(Oe, {
                  "model-value": d.value,
                  items: ee.value,
                  placeholder: l(s)("report.section.dimension.title"),
                  label: l(s)("report.section.dimension.title"),
                  "onUpdate:modelValue": e[2] || (e[2] = (S) => J(S))
                }, null, 8, ["model-value", "items", "placeholder", "label"]),
                ((X = d.value) == null ? void 0 : X.type) === l(L).Timestamp ? (u(), k(i, {
                  key: 0,
                  modelValue: W.value,
                  "onUpdate:modelValue": e[3] || (e[3] = (S) => W.value = S),
                  items: le.value,
                  placeholder: l(s)("report.section.filter.timeFormatter"),
                  label: l(s)("report.section.filter.timeFormatter")
                }, null, 8, ["modelValue", "items", "placeholder", "label"])) : P("", !0),
                a(t, {
                  modelValue: f.value,
                  "onUpdate:modelValue": e[4] || (e[4] = (S) => f.value = S),
                  label: l(s)("report.section.filter.advance"),
                  value: !0
                }, null, 8, ["modelValue", "label"]),
                f.value ? (u(), k(p, {
                  key: 1,
                  modelValue: B.value,
                  "onUpdate:modelValue": e[5] || (e[5] = (S) => B.value = S),
                  placeholder: l(s)("report.section.filter.dataFormula")
                }, null, 8, ["modelValue", "placeholder"])) : P("", !0),
                a(Je, {
                  modelValue: $.value,
                  "onUpdate:modelValue": e[6] || (e[6] = (S) => $.value = S),
                  options: I.value
                }, null, 8, ["modelValue", "options"]),
                a(_, { class: "mt-2 fm-typo-en-body-lg-600" }, {
                  default: m(() => [
                    xe(E(l(s)("report.section.filter.applyWidget")), 1)
                  ]),
                  _: 1
                }),
                C.tiles.length > 0 ? (u(), O("div", el, [
                  (u(!0), O(H, null, Z(z.value, (S) => (u(), O("div", {
                    key: S.value,
                    class: "flex items-center"
                  }, [
                    a(t, {
                      modelValue: q.value,
                      "onUpdate:modelValue": e[7] || (e[7] = (ye) => q.value = ye),
                      label: S.label,
                      value: S.value
                    }, null, 8, ["modelValue", "label", "value"]),
                    re(S) ? (u(), k(U, {
                      key: 0,
                      content: l(s)("report.section.filter.missingFilterSchema"),
                      "z-index": 99,
                      class: "ml-2"
                    }, {
                      default: m(() => [
                        a(F, {
                          name: "warning",
                          class: "text-fm-color-system-error-300"
                        })
                      ]),
                      _: 1
                    }, 8, ["content"])) : P("", !0)
                  ]))), 128))
                ])) : (u(), k(_, {
                  key: 3,
                  class: "fm-typo-en-body-lg-400",
                  label: l(s)("report.section.filter.noWidget")
                }, null, 8, ["label"]))
              ];
            }),
            _: 1
          }, 512)
        ]),
        "dialog-footer": m(() => [
          e[9] || (e[9] = h("div", { class: "grow" }, null, -1)),
          a(ie, {
            label: l(s)("report.common.cancel"),
            variant: "tertiary",
            onClick: te
          }, null, 8, ["label"]),
          a(ie, {
            label: l(s)("report.common.confirm"),
            onClick: Q
          }, null, 8, ["label"])
        ]),
        _: 1
      }, 8, ["modelValue"]);
    };
  }
}), tl = { class: "flex flex-col gap-24 top-0 bg-fm-color-neutral-white z-10" }, ol = { class: "flex flex-col gap-24 top-0 bg-fm-color-neutral-white z-10" }, al = { class: "flex items-center gap-1 max-w-[195px] w-[195px]" }, nl = { class: "line-clamp-2 overflow-hidden max-w-[195px] w-[195px]" }, rl = { class: "flex flex-col gap-24" }, il = { class: "line-clamp-2 overflow-hidden max-w-[195px] w-[195px]" }, Ne = /* @__PURE__ */ A({
  __name: "ReportEditorTab",
  props: /* @__PURE__ */ G({
    hideConfiguration: {
      type: Boolean,
      default: !1
    }
  }, {
    modelValue: { required: !0 },
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ G(["hideConfiguration"], ["update:modelValue"]),
  setup(C, { emit: s }) {
    const n = K(C, "modelValue"), { breakpoints: r } = be(), w = C, c = s, x = Be(), D = Ie(), g = R(), {
      currentSelectWidgetType: d,
      categories: W,
      editingTile: q,
      editingTileIndex: $,
      editingGlobalFilter: B,
      editingGlobalFilterIndex: f
    } = ge(De()), { schemas: M } = ge(Ge()), { globalFilters: ee } = ge(Ke()), { promptMessage: le } = We(), z = R(!1), I = R(!1), { t: b, te: J, locale: j } = ce(), Q = R(void 0), te = N(() => {
      const i = n.value.tiles.flatMap((t) => {
        var F;
        const p = t.widget.config.schemaNames ?? [], _ = ((F = t.widget.config.joinDatasources) == null ? void 0 : F.flatMap((U) => U.schemaNames ?? [])) ?? [];
        return [...p, ..._];
      });
      return [...new Set(i)].reduce((t, p) => {
        const _ = M.value.find((F) => F.name === p);
        return _ && t.push(_), t;
      }, []);
    });
    function oe(i) {
      if (!i) return "";
      const t = `report.widget.types.${i.toLowerCase()}`;
      return J(t) ? b(t) : me(b, J, i, "other");
    }
    fe(
      () => d.value,
      () => {
        d.value !== void 0 && (Q.value = Le(d.value), q.value = Q.value, $.value = -1, x.push({
          name: "tileEditor",
          query: D.query
        }));
      },
      { immediate: !0 }
    ), fe(
      () => n.value.tiles,
      (i) => {
        i.forEach((t) => {
          t.id || (t.id = ue());
        });
      },
      { immediate: !0, deep: !0 }
    );
    const re = [
      {
        label: "report.common.edit",
        selected: !1,
        variant: "tertiary",
        onClick: (i) => {
          $.value = i, q.value = JSON.parse(JSON.stringify(n.value.tiles[i])), x.push({
            name: "tileEditor",
            query: D.query
          });
        }
      },
      {
        label: "report.common.duplicate",
        selected: !1,
        variant: "tertiary",
        onClick: (i) => {
          const t = {
            ...JSON.parse(JSON.stringify(n.value.tiles[i])),
            id: ue()
          };
          n.value.tiles.push(t);
        }
      },
      {
        label: "report.common.remove",
        selected: !1,
        variant: "destructive",
        onClick: async (i) => {
          if (await le({
            title: b("report.editor.deleteWidget"),
            message: b("report.editor.deleteWidgetConfirm", {
              title: n.value.tiles[i].widget.title
            })
          })) {
            const p = n.value.tiles[i].id;
            n.value.tiles.splice(i, 1), n.value.globalFilters && n.value.globalFilters.forEach((_) => {
              var F;
              _.tileIds = (F = _.tileIds) == null ? void 0 : F.filter((U) => U !== p);
            });
          }
        }
      }
    ], o = [
      {
        label: "report.common.edit",
        selected: !1,
        variant: "tertiary",
        onClick: (i) => {
          var t;
          f.value = i, B.value = JSON.parse(JSON.stringify((t = n.value.globalFilters) == null ? void 0 : t[i])), z.value = !0;
        }
      },
      {
        label: "report.common.remove",
        selected: !1,
        variant: "destructive",
        onClick: async (i) => {
          var _, F;
          const t = (_ = n.value.globalFilters) == null ? void 0 : _[i];
          if (!t) return;
          await le({
            title: b("report.editor.deleteWidget"),
            message: b("report.editor.deleteWidgetConfirm", {
              title: we(t)
            })
          }) && ((F = n.value.globalFilters) == null || F.splice(i, 1));
        }
      }
    ], e = N(() => W.value.map((i) => ({
      label: b(`report.category.${i.name}`),
      value: i.id
    }))), V = N({
      get: () => me(b, J, n.value.name, "other"),
      set: (i) => {
        n.value.name = i;
      }
    });
    return fe(
      () => n.value.globalFilters,
      (i) => {
        ee.value = JSON.parse(JSON.stringify(i || []));
      },
      { deep: !0, immediate: !0 }
    ), (i, t) => {
      const p = v("FmTextField"), _ = v("FmSelect"), F = v("FmButton"), U = v("FmIcon"), T = v("FmTooltip"), ie = v("FmMenuItem"), pe = v("FmMenu"), X = v("FmListItem"), S = v("FmList"), ye = v("FmForm");
      return u(), k(qe(l(r).lg || l(r).md ? Ye : Ze), {
        "model-value": w.hideConfiguration,
        "onUpdate:modelValue": t[9] || (t[9] = (y) => c("hideConfiguration", y))
      }, {
        default: m(() => [
          a(ll, {
            "is-open": z.value,
            "onUpdate:isOpen": t[0] || (t[0] = (y) => z.value = y),
            "global-filter": l(B),
            tiles: n.value.tiles,
            schemas: te.value,
            "onUpdate:globalFilter": t[1] || (t[1] = (y) => {
              y && (n.value.globalFilters || (n.value.globalFilters = []), typeof l(f) == "number" && l(f) >= 0 ? n.value.globalFilters[l(f)] = y : n.value.globalFilters.push(y));
            })
          }, null, 8, ["is-open", "global-filter", "tiles", "schemas"]),
          a(Qe, {
            modelValue: l(d),
            "onUpdate:modelValue": t[2] || (t[2] = (y) => Ue(d) ? d.value = y : null),
            "is-open": I.value,
            "onUpdate:isOpen": t[3] || (t[3] = (y) => I.value = y)
          }, null, 8, ["modelValue", "is-open"]),
          a(ye, {
            ref_key: "form",
            ref: g,
            class: "px-6 py-16 flex flex-col gap-24 overflow-y-auto overflow-x-hidden"
          }, {
            default: m(() => [
              a(Se, { class: "border-solid" }, {
                header: m(() => [
                  h("p", null, E(l(b)("report.editor.reportInfo")), 1),
                  t[10] || (t[10] = h("div", { class: "grow" }, null, -1))
                ]),
                content: m(() => [
                  h("div", tl, [
                    a(p, {
                      modelValue: V.value,
                      "onUpdate:modelValue": t[4] || (t[4] = (y) => V.value = y),
                      label: l(b)("report.common.name"),
                      placeholder: l(b)("report.common.name")
                    }, null, 8, ["modelValue", "label", "placeholder"]),
                    (u(), k(_, {
                      modelValue: n.value.category,
                      "onUpdate:modelValue": t[5] || (t[5] = (y) => n.value.category = y),
                      label: l(b)("report.common.category"),
                      items: e.value,
                      key: `category-${l(j)}`
                    }, null, 8, ["modelValue", "label", "items"])),
                    a(p, {
                      modelValue: n.value.description,
                      "onUpdate:modelValue": t[6] || (t[6] = (y) => n.value.description = y),
                      label: l(b)("report.common.description"),
                      placeholder: l(b)("report.common.description")
                    }, null, 8, ["modelValue", "label", "placeholder"])
                  ])
                ]),
                _: 1
              }),
              a(Se, {
                class: "border-solid",
                "is-open": !1
              }, {
                header: m(() => [
                  h("p", null, E(l(b)("report.section.filter.globalFilter")), 1),
                  t[11] || (t[11] = h("div", { class: "grow" }, null, -1))
                ]),
                content: m(() => [
                  h("div", ol, [
                    a(F, {
                      label: l(b)("report.section.filter.addGlobalFilter"),
                      variant: "secondary",
                      icon: "add",
                      "icon-position": "prepend",
                      "border-color": l(ne).ColorPrimary,
                      "text-color": l(ne).ColorPrimary,
                      onClick: t[7] || (t[7] = () => {
                        f.value = null, B.value = null, z.value = !0;
                      })
                    }, null, 8, ["label", "border-color", "text-color"]),
                    a(S, null, {
                      default: m(() => [
                        a(l($e), {
                          list: n.value.globalFilters,
                          "item-key": "`${element.schemaName}-${element.name}`",
                          class: "flex flex-col gap-2 cursor-grab",
                          handle: ".handle"
                        }, {
                          item: m(({ element: y, index: se }) => [
                            a(X, { class: "!cursor-grab border rounded-md border-neutral-300" }, {
                              default: m(() => {
                                var ae;
                                return [
                                  a(U, {
                                    name: "drag_handle",
                                    class: "handle"
                                  }),
                                  h("div", al, [
                                    a(T, {
                                      "z-index": 99,
                                      content: l(we)(y),
                                      class: "handle"
                                    }, {
                                      default: m(() => [
                                        h("p", nl, E(l(we)(y)), 1)
                                      ]),
                                      _: 2
                                    }, 1032, ["content"]),
                                    te.value.find(
                                      (Y) => Y.name === y.schemaName
                                    ) ? P("", !0) : (u(), k(T, {
                                      key: 0,
                                      content: l(b)("report.section.filter.missingSchema"),
                                      "z-index": 99
                                    }, {
                                      default: m(() => [
                                        a(U, {
                                          name: "warning",
                                          class: "text-fm-color-system-error-300"
                                        })
                                      ]),
                                      _: 1
                                    }, 8, ["content"])),
                                    (ae = y.tileIds) != null && ae.length ? P("", !0) : (u(), k(T, {
                                      key: 1,
                                      content: l(b)("report.section.filter.missingTileIds"),
                                      "z-index": 99
                                    }, {
                                      default: m(() => [
                                        a(U, {
                                          name: "warning",
                                          class: "text-fm-color-system-warning-300"
                                        })
                                      ]),
                                      _: 1
                                    }, 8, ["content"]))
                                  ]),
                                  t[12] || (t[12] = h("div", { class: "grow" }, null, -1)),
                                  a(pe, {
                                    trigger: "click",
                                    shift: !0,
                                    "stop-click-propagation": !0
                                  }, {
                                    "menu-button": m(() => [
                                      a(F, {
                                        "append-icon": "more_vert",
                                        variant: "tertiary"
                                      })
                                    ]),
                                    default: m(() => [
                                      (u(), O(H, null, Z(o, (Y, Ce) => a(ie, {
                                        key: Ce,
                                        onClick: (xl) => Y.onClick(se)
                                      }, {
                                        label: m(() => [
                                          h("p", {
                                            class: de(
                                              Y.variant === "destructive" ? " text-fm-color-system-error-300" : ""
                                            )
                                          }, E(l(b)(Y.label)), 3)
                                        ]),
                                        _: 2
                                      }, 1032, ["onClick"])), 64))
                                    ]),
                                    _: 2
                                  }, 1024)
                                ];
                              }),
                              _: 2
                            }, 1024)
                          ]),
                          _: 1
                        }, 8, ["list"])
                      ]),
                      _: 1
                    })
                  ])
                ]),
                _: 1
              }),
              h("div", rl, [
                a(F, {
                  label: l(b)("report.editor.addWidget"),
                  variant: "secondary",
                  icon: "add",
                  "icon-position": "prepend",
                  "border-color": l(ne).ColorPrimary,
                  "text-color": l(ne).ColorPrimary,
                  onClick: t[8] || (t[8] = (y) => I.value = !0)
                }, null, 8, ["label", "border-color", "text-color"]),
                a(S, null, {
                  default: m(() => [
                    a(l($e), {
                      list: n.value.tiles,
                      "item-key": "id",
                      class: "flex flex-col gap-2 cursor-grab",
                      handle: ".handle"
                    }, {
                      item: m(({ element: y, index: se }) => [
                        a(X, { class: "!cursor-grab border rounded-md border-neutral-300" }, {
                          default: m(() => [
                            a(U, {
                              name: "drag_handle",
                              class: "handle"
                            }),
                            a(T, {
                              content: y.widget.title ? oe(y.widget.title) : l(b)("report.editor.widget", { index: se + 1 }),
                              class: "handle"
                            }, {
                              default: m(() => [
                                h("p", il, E(y.widget.title ? oe(y.widget.title) : l(b)("report.editor.widget", { index: se + 1 })), 1)
                              ]),
                              _: 2
                            }, 1032, ["content"]),
                            t[13] || (t[13] = h("div", { class: "grow" }, null, -1)),
                            a(pe, {
                              trigger: "click",
                              shift: !0,
                              "stop-click-propagation": !0
                            }, {
                              "menu-button": m(() => [
                                a(F, {
                                  "append-icon": "more_vert",
                                  variant: "tertiary"
                                })
                              ]),
                              default: m(() => [
                                (u(), O(H, null, Z(re, (ae, Y) => a(ie, {
                                  key: Y,
                                  onClick: (Ce) => ae.onClick(se)
                                }, {
                                  label: m(() => [
                                    h("p", {
                                      class: de(
                                        ae.variant === "destructive" ? " text-fm-color-system-error-300" : ""
                                      )
                                    }, E(l(b)(ae.label)), 3)
                                  ]),
                                  _: 2
                                }, 1032, ["onClick"])), 64))
                              ]),
                              _: 2
                            }, 1024)
                          ]),
                          _: 2
                        }, 1024)
                      ]),
                      _: 1
                    }, 8, ["list"])
                  ]),
                  _: 1
                })
              ])
            ]),
            _: 1
          }, 512)
        ]),
        _: 1
      }, 8, ["model-value"]);
    };
  }
}), sl = { class: "h-full w-full overflow-x-hidden" }, ul = { class: "flex flex-col bg-fm-color-neutral-white w-[400px]" }, dl = { class: "flex bg-fm-color-neutral-white w-[88px]" }, ml = {
  key: 1,
  class: "w-full overflow-y-auto"
}, cl = {
  key: 0,
  class: "w-full grid grid-cols-12 gap-[24px] p-24"
}, pl = { class: "col-span-12 mb-4 flex flex-wrap gap-2 pb-2" }, vl = { key: 2 }, fl = {
  key: 0,
  class: "grid grid-cols-12 gap-[16px]"
}, gl = { class: "col-span-12 mb-4 flex flex-wrap gap-2 pb-2" }, bl = {
  key: 3,
  class: "h-full w-full flex items-start justify-center bg-fm-color-neutral-white py-24",
  style: { backgroundColor: "#F6F8FC" }
}, yl = {
  key: 0,
  class: "w-full grid grid-cols-12 gap-[24px] p-24"
}, hl = /* @__PURE__ */ A({
  __name: "ReportEditorViewport",
  props: /* @__PURE__ */ G({
    hideConfiguration: { type: Boolean, required: !1, default: !1 },
    previewWidth: { type: Number, required: !0 },
    previewHeight: { type: Number, required: !0 },
    previewScale: { type: Number, required: !0 }
  }, {
    modelValue: { required: !0, default: () => {
    } },
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ G(["hideConfiguration"], ["update:modelValue"]),
  setup(C, { emit: s }) {
    const { breakpoints: n } = be(), r = K(C, "modelValue"), w = C, c = N(() => w.previewWidth > 0 && w.previewHeight > 0), x = N(() => n.value.sm || n.value.xs), D = s;
    return (g, d) => {
      const W = v("FmCircularProgress"), q = v("FmButton"), $ = v("FmMenuDivider"), B = v("FmCard");
      return u(), O("div", sl, [
        r.value ? (u(), O(H, { key: 1 }, [
          c.value ? P("", !0) : (u(), k(He, {
            key: 0,
            "model-value": !w.hideConfiguration
          }, {
            right: m(() => [
              h("div", ul, [
                r.value ? (u(), k(Ne, {
                  key: 0,
                  modelValue: r.value,
                  "onUpdate:modelValue": d[0] || (d[0] = (f) => r.value = f),
                  "hide-configuration": w.hideConfiguration,
                  onHideConfiguration: d[1] || (d[1] = (f) => D("hideConfiguration", f))
                }, null, 8, ["modelValue", "hide-configuration"])) : P("", !0)
              ])
            ]),
            left: m(() => [
              h("div", dl, [
                a(q, {
                  variant: "secondary",
                  icon: "keyboard_double_arrow_right",
                  "border-color": l(ne).ColorPrimary,
                  "text-color": l(ne).ColorPrimary,
                  class: "m-24 my-16",
                  size: "md",
                  onClick: d[2] || (d[2] = (f) => D("hideConfiguration", !w.hideConfiguration))
                }, null, 8, ["border-color", "text-color"])
              ])
            ]),
            _: 1
          }, 8, ["model-value"])),
          a($, {
            vertical: "",
            style: { margin: "0px" }
          }),
          !x.value && !c.value ? (u(), O("div", ml, [
            r.value.tiles.length > 0 ? (u(), O("div", cl, [
              h("div", pl, [
                a(Te)
              ]),
              (u(!0), O(H, null, Z(r.value.tiles, (f, M) => (u(), k(_e, {
                key: `${l(ue)()}_${M}`,
                "model-value": f,
                index: M,
                "hide-export": !0
              }, null, 8, ["model-value", "index"]))), 128))
            ])) : (u(), k(Fe, { key: 1 }))
          ])) : x.value && !c.value ? (u(), O("div", vl, [
            a(B, { class: "px-5 pb-28" }, {
              default: m(() => [
                r.value.tiles.length > 0 ? (u(), O("div", fl, [
                  h("div", gl, [
                    a(Te)
                  ]),
                  (u(!0), O(H, null, Z(r.value.tiles, (f, M) => (u(), k(_e, {
                    key: `${l(ue)()}_${M}`,
                    "model-value": f,
                    index: M,
                    "hide-export": !0
                  }, null, 8, ["model-value", "index"]))), 128))
                ])) : (u(), k(Fe, { key: 1 }))
              ]),
              _: 1
            }),
            r.value ? (u(), k(Ne, {
              key: 0,
              modelValue: r.value,
              "onUpdate:modelValue": d[3] || (d[3] = (f) => r.value = f),
              "hide-configuration": w.hideConfiguration,
              onHideConfiguration: d[4] || (d[4] = (f) => {
                D("hideConfiguration", f);
              })
            }, null, 8, ["modelValue", "hide-configuration"])) : P("", !0)
          ])) : (u(), O("div", bl, [
            h("div", {
              style: ke({
                transformOrigin: "top center",
                transform: `scale(${w.previewScale})`
              })
            }, [
              h("div", {
                class: "overflow-y-auto bg-white rounded-lg",
                style: ke({
                  width: w.previewWidth + "px",
                  height: w.previewHeight + "px"
                })
              }, [
                r.value.tiles.length > 0 ? (u(), O("div", yl, [
                  (u(!0), O(H, null, Z(r.value.tiles, (f, M) => (u(), k(_e, {
                    key: `${l(ue)()}_${M}`,
                    "model-value": f,
                    index: M,
                    "hide-export": !0,
                    "custom-screen-width": w.previewWidth
                  }, null, 8, ["model-value", "index", "custom-screen-width"]))), 128))
                ])) : (u(), k(Fe, { key: 1 }))
              ], 4)
            ], 4)
          ]))
        ], 64)) : (u(), k(W, { key: 0 }))
      ]);
    };
  }
}), wl = { class: "flex items-center gap-4" }, _l = { class: "flex justify-center items-center gap-2 w-full" }, Fl = { class: "flex gap-4" }, Il = /* @__PURE__ */ A({
  __name: "ReportEditor",
  setup(C) {
    const s = Be(), n = Ie(), r = De(), { promptLoader: w } = Ae(), { t: c, te: x } = ce(), { currentReport: D, editingReport: g } = ge(r), { breakpoints: d } = be(), W = N(() => {
      var o;
      return !((o = g.value) != null && o.editable);
    }), q = N(() => {
      var o;
      return ((o = g.value) == null ? void 0 : o.name) ?? c("report.editor.newReport");
    }), $ = N(() => me(c, x, q.value, "other")), B = Re(), { promptMessage: f } = We(), M = R(!1);
    async function ee() {
      if (!g.value || g.value.tiles.length === 0) {
        B.open({ message: c("report.messages.noWidget"), type: "error" });
        return;
      }
      const o = W.value ? c("report.common.clone") : c("report.common.save");
      if (await f({
        title: `${c("report.messages.saveReport")}`,
        message: c("report.messages.confirmAction", { action: o, name: $.value })
      }))
        try {
          await w(async () => {
            if (W.value) {
              const V = JSON.parse(JSON.stringify(g.value));
              V.editable = !0, V.id = "", V.name = `${V.name} ${c("report.common.duplicate")}`, await r.createOrUpdateReport(V);
            } else
              g.value && await r.createOrUpdateReport(g.value);
            s.push({
              name: "reportView",
              query: n.query
            });
          });
        } catch (V) {
          console.log(V), B.open({
            message: c("report.messages.failedToAction", { action: o }),
            type: "error"
          });
        }
    }
    async function le() {
      var e;
      if (!g.value) return;
      await f({
        title: c("report.common.report", 1),
        message: c("report.editor.notSaved", { name: (e = g.value) == null ? void 0 : e.name })
      }) && (g.value = JSON.parse(JSON.stringify(D.value)), s.back());
    }
    Ee(() => {
      g.value || s.push({ name: "reports" });
    });
    const z = [
      {
        labelKey: "report.common.default",
        width: void 0,
        height: void 0
      },
      {
        labelKey: "report.editor.devices.desktop",
        width: 1920,
        height: 1080
      },
      {
        labelKey: "report.editor.devices.tablet",
        width: 820,
        height: 1180
      },
      {
        labelKey: "report.editor.devices.phone",
        width: 390,
        height: 859
      }
    ], I = R(z[0]), b = R(!1), J = N(() => b.value ? Math.max(I.value.width || 0, I.value.height || 0) : Math.min(I.value.width || 0, I.value.height || 0)), j = N(() => b.value ? Math.min(I.value.width || 0, I.value.height || 0) : Math.max(I.value.width || 0, I.value.height || 0)), Q = N(() => window.innerHeight - 72 - 56), te = N(() => {
      if (!J.value) return 1;
      let o = (Q.value - 48) / J.value, e = j.value * o;
      return e > window.innerWidth && (o = window.innerWidth / j.value, e = j.value * o), o > 1 ? 1 : o;
    });
    function oe(o) {
      I.value = o;
    }
    function re() {
      b.value = !b.value;
    }
    return (o, e) => {
      const V = v("FmTooltip"), i = v("FmButton"), t = v("FmPageHead");
      return u(), k(je, null, {
        default: m(() => [
          a(t, {
            actions: [
              { label: l(c)("report.common.cancel"), value: "cancel", isPrimary: !1 },
              { label: l(c)("report.common.saveReport"), value: "save", isPrimary: !0, prependIcon: "download" }
            ],
            "onClick:action": e[0] || (e[0] = (p) => {
              p === "cancel" && le(), p === "save" && ee();
            })
          }, {
            title: m(() => [
              h("div", wl, [
                a(V, {
                  content: $.value,
                  placement: "bottom"
                }, {
                  default: m(() => [
                    h("p", {
                      class: de(`${l(d).sm || l(d).xs ? "hidden" : ""} text-ellipsis overflow-hidden text-nowrap fm-typo-en-title-md-600 w-[250px]`)
                    }, E($.value), 3)
                  ]),
                  _: 1
                }, 8, ["content"]),
                h("div", _l, [
                  h("div", Fl, [
                    (u(), O(H, null, Z(z, (p) => {
                      var _;
                      return a(i, {
                        key: p.labelKey,
                        label: l(c)(p.labelKey),
                        variant: ((_ = I.value) == null ? void 0 : _.labelKey) === p.labelKey ? "primary" : "secondary",
                        size: "md",
                        onClick: (F) => oe(p)
                      }, null, 8, ["label", "variant", "onClick"]);
                    }), 64))
                  ]),
                  a(i, {
                    icon: "screen_rotation",
                    variant: "tertiary",
                    size: "md",
                    class: "text-fm-color-typo-primary",
                    onClick: re
                  })
                ])
              ])
            ]),
            _: 1
          }, 8, ["actions"]),
          l(g) ? (u(), k(hl, {
            key: 0,
            modelValue: l(g),
            "onUpdate:modelValue": e[1] || (e[1] = (p) => Ue(g) ? g.value = p : null),
            style: ke({ height: Q.value + "px" }),
            class: de(l(d).lg || l(d).md ? "flex" : ""),
            "hide-configuration": M.value,
            "preview-width": j.value,
            "preview-height": J.value,
            "preview-scale": te.value,
            onHideConfiguration: e[2] || (e[2] = (p) => M.value = p)
          }, null, 8, ["modelValue", "style", "class", "hide-configuration", "preview-width", "preview-height", "preview-scale"])) : P("", !0)
        ]),
        _: 1
      });
    };
  }
});
export {
  Il as default
};
