@opengis/cms 0.0.48 → 0.0.50

package/dist/contentForm-S5mXr5B7.js

@@ -0,0 +1,553 @@
+import { defineAsyncComponent as be, useModel as we, ref as y, provide as _e, onMounted as Z, nextTick as J, watch as I, computed as f, openBlock as b, createBlock as le, unref as $, createCommentVNode as B, createElementBlock as _, createElementVNode as v, createTextVNode as re, createVNode as C, defineComponent as ke, inject as xe, getCurrentInstance as $e, toRef as Se, toDisplayString as L, Fragment as Te, renderList as Ae, normalizeClass as se, withDirectives as X, vModelCheckbox as Ve, vShow as ae } from "vue";
+import { useRouter as Ce, useRoute as je } from "vue-router";
+import { ExternalLink as Fe, ArrowLeft as ze, HelpCircle as Ne, Settings as Pe, Save as Ee } from "lucide-vue-next";
+import { _ as Ue, a as Be, V as Oe, b as Y, c as De, d as Le, e as Je, g as Me } from "./getField-C7EZs-YQ.js";
+import { useI18n as ie } from "vue-i18n";
+import { inputs as V, VForm as oe } from "@opengis/form";
+import { notify as q } from "@opengis/core";
+import { _ as Re } from "./CollectionsBreadcrumb.vue_vue_type_script_setup_true_lang-B6irHMzL.js";
+const He = [
+  {
+    key: "title",
+    label: "cms.common.title",
+    localization: !0,
+    type: "text"
+  },
+  {
+    key: "description",
+    label: "cms.common.description",
+    localization: !0,
+    type: "text"
+  },
+  {
+    key: "keywords",
+    label: "cms.common.keywords",
+    localization: !0,
+    type: "text"
+  },
+  {
+    key: "meta",
+    label: "cms.common.meta",
+    type: "key-value",
+    ignore: ["title", "description", "keywords"]
+  }
+], Ke = {
+  __name: "VsFormTags",
+  props: {
+    modelValue: { default: () => [] },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(S, { expose: n }) {
+    const j = be(() => import("@opengis/form")), { t: w } = ie(), a = we(S, "modelValue"), g = y({}), u = y(!1);
+    _e("metaParentValue", a);
+    const p = (s) => Array.isArray(s) ? s.map((r) => typeof r == "object" && r !== null && r.id ? r.id : r) : [], F = async (s) => {
+      if (!Array.isArray(s) || s.length === 0)
+        return [];
+      try {
+        const k = await (await fetch("/api/tags")).json(), E = (k == null ? void 0 : k.rows) || [];
+        return s.map((R) => {
+          const z = E.find((H) => H.tag_id === R);
+          return z ? { id: z.tag_id, text: z.value, color: z.color } : { id: R, text: "", color: "#ababab" };
+        });
+      } catch (r) {
+        return console.error("Error fetching tags:", r), s.map((k) => ({ id: k, text: "", color: "#ababab" }));
+      }
+    };
+    Z(async () => {
+      await J(), await J(), setTimeout(() => {
+        var s;
+        if (Array.isArray((s = a.value) == null ? void 0 : s.tag_list)) {
+          const r = p(a.value.tag_list);
+          JSON.stringify(r) !== JSON.stringify(a.value.tag_list) && (a.value.tag_list = r);
+        }
+      }, 100);
+    }), I(
+      () => a.value.tag_list,
+      (s) => {
+        if (Array.isArray(s) && !u.value) {
+          const r = p(s);
+          JSON.stringify(r) !== JSON.stringify(s) && (a.value.tag_list = r);
+        }
+      },
+      { deep: !0 }
+    ), I(
+      () => a.value,
+      (s) => {
+        if (s && Array.isArray(s.tag_list) && !u.value) {
+          const r = p(s.tag_list);
+          JSON.stringify(r) !== JSON.stringify(s.tag_list) && (s.tag_list = r);
+        }
+      },
+      { deep: !0, immediate: !0 }
+    ), I(
+      () => {
+        var s;
+        return (s = a.value) == null ? void 0 : s.tag_list;
+      },
+      (s) => {
+        Array.isArray(s) && g.value && J(() => {
+          g.value && g.value.setValue && g.value.setValue("tag_list", s);
+        });
+      },
+      { deep: !0 }
+    );
+    const O = async (s) => {
+      if (s.tag_list && (s.tag_list = p(s.tag_list), a.value.tag_list = s.tag_list), await g.value.validate()) {
+        q({
+          type: "warning",
+          title: w("cms.common.actions.warning"),
+          message: w("cms.builder.editFieldFailed")
+        });
+        return;
+      }
+    };
+    n({
+      restoreTagsBeforeSubmit: async () => {
+        var s;
+        if (u.value = !0, Array.isArray((s = a.value) == null ? void 0 : s.tag_list)) {
+          const r = await F(a.value.tag_list);
+          a.value.tag_list = r;
+        }
+        setTimeout(() => {
+          u.value = !1;
+        }, 2e3);
+      }
+    });
+    const D = f(() => {
+      var s;
+      return [
+        {
+          key: "tag_list",
+          type: "select",
+          multiple: !0,
+          searchable: !1,
+          placeholder: w("cms.builder.tags"),
+          data: "tag_id",
+          value: ((s = a.value) == null ? void 0 : s.tag_list) || []
+        }
+      ];
+    });
+    return (s, r) => a.value ? (b(), le($(j), {
+      key: 0,
+      schema: D.value,
+      modelValue: a.value,
+      "onUpdate:modelValue": [
+        r[0] || (r[0] = (k) => a.value = k),
+        O
+      ]
+    }, null, 8, ["schema", "modelValue"])) : B("", !0);
+  }
+}, Ie = { class: "flex justify-end mb-4" }, qe = ["href"], Ge = ["src"], Qe = ["src"], We = {
+  key: 2,
+  class: "w-full h-[80vh] flex items-center justify-center text-gray-500"
+}, Xe = {
+  __name: "VsPreview",
+  props: {
+    preview_path: {
+      type: String,
+      default: ""
+    },
+    slug: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(S) {
+    const n = y(""), j = y(""), w = async () => {
+      var g, u;
+      try {
+        const F = await (await fetch("/api/settings")).json();
+        n.value = ((u = (g = F == null ? void 0 : F.settings) == null ? void 0 : g.site_info) == null ? void 0 : u.previewUrl) || "http://ip.local.softpro.ua";
+      } catch (p) {
+        console.error("Failed to fetch settings:", p), n.value = "http://ip.local.softpro.ua";
+      }
+    }, a = async () => {
+      var g;
+      try {
+        const p = await (await fetch("/user")).json();
+        j.value = (g = p == null ? void 0 : p.user) == null ? void 0 : g.draftKey;
+      } catch (u) {
+        console.error("Failed to fetch user:", u);
+      }
+    };
+    return Z(() => {
+      w(), a();
+    }), (g, u) => (b(), _("div", null, [
+      v("div", Ie, [
+        v("a", {
+          href: `${n.value}/uk/${S.preview_path}${S.slug}${j.value ? `?draftKey=${j.value}` : ""}`,
+          target: "_blank",
+          class: "inline-flex items-center gap-2 px-3 py-1.5 text-black-600 bg-white border border-blue-200 rounded hover:border-blue-300 hover:bg-blue-50 transition-colors duration-200 font-normal cursor-pointer"
+        }, [
+          u[0] || (u[0] = re(" Переглянути на сайті ", -1)),
+          C($(Fe), { class: "w-4 h-4" })
+        ], 8, qe)
+      ]),
+      n.value && S.preview_path ? (b(), _("iframe", {
+        key: 0,
+        src: `${n.value}/uk/${S.preview_path}${S.slug}?hideHeader=true&hideFooter=true`,
+        class: "w-full h-[80vh]"
+      }, null, 8, Ge)) : n.value ? (b(), _("iframe", {
+        key: 1,
+        src: `${n.value}/uk/${S.slug}?hideHeader=true&hideFooter=true`,
+        class: "w-full h-[80vh]"
+      }, null, 8, Qe)) : (b(), _("div", We, " Loading preview... "))
+    ]));
+  }
+}, Ye = { class: "space-y-6 mx-auto relativ max-w-[90%]" }, Ze = { class: "" }, et = { class: "flex items-center justify-between" }, tt = { class: "flex items-center gap-4" }, st = { class: "text-2xl font-semibold text-gray-900 dark:text-white line-clamp-1" }, at = ["href", "title"], ot = { class: "flex items-center space-x-3" }, lt = ["title"], rt = { class: "w-full mt-6 flex items-center justify-between" }, it = { class: "flex items-center w-full h-10 max-w-md grid-cols-3 p-1 bg-white border border-gray-200 rounded-md text-muted-foreground" }, nt = ["onClick"], ct = { class: "flex items-center gap-2" }, ut = {
+  for: "is_pin",
+  class: "text-sm font-medium text-gray-700 dark:text-gray-300 cursor-pointer"
+}, dt = { class: "relative" }, mt = {
+  key: 0,
+  class: "w-3 h-3 text-white",
+  fill: "currentColor",
+  viewBox: "0 0 20 20"
+}, vt = { class: "mx-auto bg-white rounded-md p-5" }, pt = { class: "mx-auto bg-white rounded-md p-5" }, ft = {
+  key: 0,
+  class: "mx-auto bg-white rounded-md p-5"
+}, gt = {
+  key: 1,
+  class: "mx-auto bg-white rounded-md p-5"
+}, St = /* @__PURE__ */ ke({
+  __name: "contentForm",
+  setup(S) {
+    V["vs-input-custom-datatable"] = Ue, V["vs-input-reference"] = Be, V["vs-input-texteditor"] = Oe, V["vs-input-mediaselect"] = Y, V["vs-input-file"] = Y, V["vs-input-image"] = Y, V["vs-input-richtext-md"] = De, V["vs-input-integer"] = Le, V["vs-input-relation-link"] = Je;
+    const { t: n, locale: j } = ie(), w = Ce(), a = je(), g = xe("menu", y([])), u = y([]), p = y({}), F = y({}), O = y({}), M = y(""), D = $e(), s = D == null ? void 0 : D.appContext, r = (s == null ? void 0 : s.config.globalProperties) || {}, k = Se(r, "$settings"), E = f(() => {
+      var e;
+      return ((e = k.value) == null ? void 0 : e.cms) || {};
+    }), R = f(() => Array.isArray(E.value.locales) ? E.value.locales : []), z = f(
+      () => R.value.filter(Boolean)
+    ), H = f(
+      () => E.value.locale || z.value[0] || "uk"
+    );
+    I(
+      k,
+      () => {
+        u.value.length && (u.value = u.value.map((e) => ({
+          ...e
+        })));
+      },
+      { deep: !0 }
+    );
+    const ne = (e) => {
+      const t = [], l = z.value.filter(
+        (i) => i !== H.value
+      );
+      return Array.isArray(e) && e.forEach((i) => {
+        t.push(i), !(!i.localization || l.length === 0) && l.forEach((m) => {
+          t.push({
+            ...i,
+            name: `${i.name}:${m}`,
+            label: `${i.label} (${m})`
+          });
+        });
+      }), t;
+    }, ee = f(() => ne(u.value)), ce = f(() => {
+      var e;
+      return (e = ee.value) == null ? void 0 : e.map(Me);
+    }), ue = f(() => {
+      j.value;
+      const e = z.value.filter(
+        (t) => t !== H.value
+      );
+      return He.flatMap((t) => {
+        const l = {
+          ...t,
+          label: n(t.label)
+        };
+        if (!t.localization || e.length === 0)
+          return [l];
+        const i = e.map((m) => ({
+          ...t,
+          key: `${t.key}:${m}`,
+          label: `${n(t.label)} (${m})`,
+          localization: !1
+        }));
+        return [l, ...i];
+      });
+    }), x = y({}), d = y({
+      title: "",
+      status: "draft"
+    }), G = y(null), Q = f(
+      () => {
+        var e;
+        return (((e = d.value) == null ? void 0 : e.type) || G.value) === "single";
+      }
+    ), de = f(() => {
+      const e = [
+        { id: "content", name: n("cms.builder.content") },
+        { id: "seo", name: n("cms.builder.seo") },
+        { id: "tags", name: n("cms.builder.tags") }
+      ];
+      return M.value && e.push({ id: "preview", name: n("cms.builder.preview") }), e;
+    }), U = y("content"), me = f(() => {
+      var t, l, i, m;
+      const e = ((t = a.params) == null ? void 0 : t.collection) || ((l = a.params) == null ? void 0 : l.id);
+      return ((m = (i = g.value) == null ? void 0 : i.find((h) => h.id === e)) == null ? void 0 : m.title) || e;
+    }), ve = f(() => {
+      var t, l;
+      const e = Q.value ? "cms.builder.editPage" : "cms.builder.editCollection";
+      return ((t = d.value) == null ? void 0 : t.title) || ((l = a.params) != null && l.id ? n(e) : n("cms.articles.createArticle"));
+    }), pe = f(() => {
+      var i, m, h;
+      const e = ((i = a.params) == null ? void 0 : i.collection) || ((m = a.params) == null ? void 0 : m.id), t = (h = a.params) == null ? void 0 : h.id, l = [
+        {
+          label: me.value,
+          route: `collections/${e}`
+        }
+      ];
+      return t ? l.push({
+        label: ve.value,
+        route: `collections/${e}/${t}`
+      }) : l.push({
+        label: n("cms.articles.createArticle"),
+        route: `collections/${e}/create`
+      }), l;
+    }), fe = (e) => {
+      e === "collections" ? w.push("/collections") : w.push(`/${e}`);
+    };
+    Z(async () => {
+      var m, h, c;
+      const e = (m = a.params) == null ? void 0 : m.collection, t = (h = a.params) == null ? void 0 : h.id, l = e || t, i = e && t ? t : void 0;
+      if (!i) {
+        if (!l)
+          return;
+        const o = await (await fetch(`/api/cms/${l}/`)).json();
+        u.value = o.columns, G.value = (o == null ? void 0 : o.type) || null;
+      }
+      try {
+        if (!i || !l)
+          return;
+        const T = await fetch(`/api/cms/${l}/${i}`);
+        if (!T.ok)
+          throw new Error("Failed to fetch article");
+        const o = await T.json();
+        if (u.value = (o == null ? void 0 : o.columns) || [], o != null && o.preview_path && (M.value = o == null ? void 0 : o.preview_path), G.value = (o == null ? void 0 : o.type) || null, o.rows) {
+          let A = o.rows;
+          Array.isArray(A) || (A = [A]), d.value = A[0], await J(), (c = A[0]) != null && c.meta ? x.value = {
+            ...A[0].meta
+          } : x.value = {
+            title: "",
+            description: "",
+            keywords: "",
+            meta: {}
+          };
+        } else
+          d.value = o, await J(), o != null && o.meta ? (x.value = {
+            title: o.meta.title || "",
+            description: o.meta.description || "",
+            keywords: o.meta.keywords || "",
+            meta: { ...o.meta }
+          }, delete x.value.meta.title, delete x.value.meta.description, delete x.value.meta.keywords) : x.value = {
+            title: "",
+            description: "",
+            keywords: "",
+            meta: {}
+          };
+      } catch (T) {
+        console.error("Error fetching article:", T);
+      }
+    });
+    const te = f({
+      get: () => {
+        var e;
+        return ((e = d.value) == null ? void 0 : e.is_pin) || !1;
+      },
+      set: (e) => {
+        d.value && (d.value.is_pin = e);
+      }
+    }), ge = () => {
+      d.value && (d.value.is_pin = !d.value.is_pin);
+    }, W = f(() => {
+      var t;
+      const e = (t = d.value) == null ? void 0 : t.content_type_id;
+      return e ? `/collections/${e}/edit` : null;
+    }), ye = () => {
+      W.value && w.push(W.value);
+    }, he = async (e) => {
+      var c, T, o, A;
+      const t = (c = a.params) == null ? void 0 : c.collection, l = (T = a.params) == null ? void 0 : T.id, i = await p.value.validate();
+      if (i) {
+        q({ title: n("cms.validation"), message: JSON.stringify(i), type: "warning" });
+        return;
+      }
+      (o = O.value) != null && o.restoreTagsBeforeSubmit && await O.value.restoreTagsBeforeSubmit();
+      const m = x.value || {}, h = {
+        ...d.value,
+        meta: {
+          ...m,
+          ...m.meta || {}
+        }
+      };
+      console.log("Payload before submit:", h);
+      try {
+        const P = await fetch(`/api/cms/${t}/${l || ""}`, {
+          method: l ? "PUT" : "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify(h)
+        });
+        if (!P.ok) {
+          let N;
+          try {
+            const K = await P.json();
+            N = JSON.stringify(K, null, 2);
+          } catch {
+            N = await P.text();
+          }
+          throw new Error(`HTTP ${P.status}: ${N}`);
+        }
+        if (!l)
+          try {
+            const N = await P.json(), K = N.id || ((A = N.data) == null ? void 0 : A.id);
+            K && a.name === "createArticle" && await w.push(`/collections/${t}/${K}`);
+          } catch (N) {
+            console.warn("Could not parse response to get ID:", N);
+          }
+        q({
+          title: n("cms.common.success"),
+          message: n("cms.common.successMessage"),
+          type: "success"
+        });
+      } catch (P) {
+        console.error("Submit error:", P), q({
+          title: n("cms.common.error"),
+          message: "Помилка збереження",
+          type: "error"
+        });
+      }
+    };
+    return (e, t) => {
+      var l, i, m, h;
+      return b(), _("div", Ye, [
+        v("div", Ze, [
+          C(Re, {
+            items: pe.value,
+            onNavigate: fe
+          }, null, 8, ["items"]),
+          v("div", et, [
+            v("div", tt, [
+              v("button", {
+                onClick: t[0] || (t[0] = (c) => $(w).back()),
+                class: "p-2 text-gray-500 rounded-full hover:text-gray-900 dark:text-gray-400 dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-700"
+              }, [
+                C($(ze), { class: "w-5 h-5" })
+              ]),
+              v("h1", st, L(e.$t(
+                Q.value ? "cms.builder.editPage" : "cms.builder.editCollection"
+              )) + ' "' + L(d.value.title) + '" ', 1),
+              v("a", {
+                href: `https://cms.opengis.info/${$(j)}/guides/content/`,
+                target: "_blank",
+                title: e.$t("cms.guide.content")
+              }, [
+                C($(Ne), { class: "w-5 h-5" })
+              ], 8, at)
+            ]),
+            v("div", ot, [
+              W.value && Q.value ? (b(), _("button", {
+                key: 0,
+                onClick: ye,
+                type: "button",
+                title: e.$t("cms.builder.editContentType"),
+                class: "inline-flex items-center justify-center rounded-md h-9 w-9 border border-gray-200 bg-white text-gray-700 shadow-sm transition-all duration-200 transform hover:text-gray-900 hover:shadow-md focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+                "aria-label": "$t('cms.builder.editContentType')"
+              }, [
+                C($(Pe), { class: "w-4 h-4" })
+              ], 8, lt)) : B("", !0),
+              v("button", {
+                onClick: he,
+                type: "submit",
+                class: "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium h-9 px-4 py-2 bg-blue-600 text-white shadow-md transition-all duration-200 transform hover:bg-blue-700 hover:shadow-lg hover:scale-105 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50"
+              }, [
+                C($(Ee), { class: "w-4 h-4 mr-2" }),
+                re(" " + L(e.$t("cms.builder.save")), 1)
+              ])
+            ])
+          ]),
+          v("div", rt, [
+            v("div", it, [
+              (b(!0), _(Te, null, Ae(de.value, (c) => (b(), _("button", {
+                key: c.id,
+                onClick: (T) => {
+                  U.value = c.id, console.log("cmsSettings:", E.value.value);
+                },
+                class: se([
+                  "inline-flex flex-1 items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm data-[state=active]:bg-blue-50 data-[state=active]:text-blue-700 data-[state=active]:border-blue-200",
+                  c.id === U.value ? "bg-blue-50 text-blue-700 border-blue-200" : ""
+                ])
+              }, L(c.name), 11, nt))), 128))
+            ]),
+            v("div", ct, [
+              v("label", ut, L(e.$t("cms.collections.pinPublication")), 1),
+              v("div", dt, [
+                X(v("input", {
+                  type: "checkbox",
+                  id: "is_pin",
+                  "onUpdate:modelValue": t[1] || (t[1] = (c) => te.value = c),
+                  class: "sr-only"
+                }, null, 512), [
+                  [Ve, te.value]
+                ]),
+                v("div", {
+                  class: se(["w-5 h-5 border-2 rounded transition-all duration-200 cursor-pointer flex items-center justify-center", (l = d.value) != null && l.is_pin ? "bg-sky-600 border-sky-600" : "bg-white border-gray-300 hover:border-sky-400 dark:bg-gray-700 dark:border-gray-600 dark:hover:border-sky-400"]),
+                  onClick: ge
+                }, [
+                  (i = d.value) != null && i.is_pin ? (b(), _("svg", mt, [...t[7] || (t[7] = [
+                    v("path", {
+                      "fill-rule": "evenodd",
+                      d: "M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",
+                      "clip-rule": "evenodd"
+                    }, null, -1)
+                  ])])) : B("", !0)
+                ], 2)
+              ])
+            ])
+          ])
+        ]),
+        X(v("div", vt, [
+          (m = ee.value) != null && m.length ? (b(), le($(oe), {
+            key: 0,
+            modelValue: d.value,
+            "onUpdate:modelValue": t[2] || (t[2] = (c) => d.value = c),
+            schema: ce.value,
+            form: p.value,
+            "onUpdate:form": t[3] || (t[3] = (c) => p.value = c)
+          }, null, 8, ["modelValue", "schema", "form"])) : B("", !0)
+        ], 512), [
+          [ae, U.value === "content"]
+        ]),
+        X(v("div", pt, [
+          C($(oe), {
+            schema: ue.value,
+            values: x.value,
+            "onUpdate:values": t[4] || (t[4] = (c) => x.value = c),
+            form: F.value,
+            "onUpdate:form": t[5] || (t[5] = (c) => F.value = c)
+          }, null, 8, ["schema", "values", "form"])
+        ], 512), [
+          [ae, U.value === "seo"]
+        ]),
+        U.value === "tags" ? (b(), _("div", ft, [
+          C(Ke, {
+            ref_key: "tagsForm",
+            ref: O,
+            modelValue: d.value,
+            "onUpdate:modelValue": t[6] || (t[6] = (c) => d.value = c)
+          }, null, 8, ["modelValue"])
+        ])) : B("", !0),
+        U.value === "preview" ? (b(), _("div", gt, [
+          C(Xe, {
+            slug: (h = d.value) == null ? void 0 : h.slug,
+            preview_path: M.value
+          }, null, 8, ["slug", "preview_path"])
+        ])) : B("", !0)
+      ]);
+    };
+  }
+});
+export {
+  St as default
+};