appco_dist/.output/server/chunks/build/index-BTYgBepI.mjs

import { _ as __nuxt_component_3 } from './CropperModal-DVoUZ6Yp.mjs';
import { defineComponent, ref, watch, unref, withCtx, createTextVNode, toDisplayString, createVNode, useSSRContext } from 'vue';
import { ssrRenderAttr, ssrInterpolate, ssrRenderComponent, ssrRenderList } from 'vue/server-renderer';
import { _ as _imports_0 } from './close_light-DbrEdRZI.mjs';
import { u as useRouter$1, a as useConfigStore } from './server.mjs';
import { m as mediaFilesUrl, p as previewImg, h as handleCropped } from './product-C4ZOggJK.mjs';
import { B as BasicIconOld } from './BasicIconOld-93vAWohq.mjs';
import { _ as __nuxt_component_1, a as __nuxt_component_2 } from './RadioButton-DtosQeeY.mjs';

const maxFiles = 10;
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "index",
  __ssrInlineRender: true,
  setup(__props) {
    const router = useRouter$1();
    const config = useConfigStore();
    ref(null);
    const type = ref("");
    const cropperVisible = ref(false);
    ref();
    watch(mediaFilesUrl, (files) => {
      if (mediaFilesUrl.value.length === 0) previewImg.value = "";
      else if (mediaFilesUrl.value.length === 1) previewImg.value = mediaFilesUrl.value[0];
      else {
        previewImg.value = files[files.length - 1];
      }
    });
    const isVideo = (file) => file.includes(".mp4") || file.includes(".mov") || file.includes("video");
    return (_ctx, _push, _parent, _attrs) => {
      const _component_a_radio_group = __nuxt_component_1;
      const _component_a_radio_button = __nuxt_component_2;
      const _component_CropperModal = __nuxt_component_3;
      _push(`<!--[--><div class="w-full h-screen bg-black text-white"><div class="flex w-full p-4 gap-8 justify-between items-center"><div class="flex gap-8 items-center"><img${ssrRenderAttr("src", _imports_0)}${ssrRenderAttr("alt", unref(config).appName.en)} class="w-4"><div class="font-semibold text-lg">${ssrInterpolate(unref(config).useString("newStory"))}</div></div><div class="text-primary text-sm">${ssrInterpolate(unref(config).useString("next"))}</div></div><div class="w-full flex items-center justify-center relative">`);
      if (unref(previewImg)) {
        _push(`<img${ssrRenderAttr("src", unref(previewImg))}${ssrRenderAttr("alt", unref(config).appName.en)} class="w-full aspect-square object-contain">`);
      } else if (unref(mediaFilesUrl).length === 0) {
        _push(`<p class="empty-state">${ssrInterpolate(unref(config).useString("tapPlusToAdd"))}</p>`);
      } else {
        _push(`<!---->`);
      }
      if (unref(previewImg)) {
        _push(`<div class="flex absolute gap-2 right-5 bottom-5"><div class="flex bg-black/80 items-center rounded gap-2 p-2">`);
        _push(ssrRenderComponent(BasicIconOld, { icon: "vuesax-linear:crop" }, null, _parent));
        _push(`</div></div>`);
      } else {
        _push(`<!---->`);
      }
      _push(`</div><div class="media-picker"><div class="drop-area"><div class="media-grid"><!--[-->`);
      ssrRenderList(unref(mediaFilesUrl), (media, index) => {
        _push(`<div class="media-container">`);
        if (isVideo(media)) {
          _push(`<video${ssrRenderAttr("src", media)} class="media-preview" controls></video>`);
        } else {
          _push(`<img${ssrRenderAttr("src", media)} class="media-preview">`);
        }
        _push(`<button class="remove-btn">✖</button></div>`);
      });
      _push(`<!--]-->`);
      if (unref(mediaFilesUrl).length < maxFiles) {
        _push(`<div class="add-media text-black"><span>+</span></div>`);
      } else {
        _push(`<!---->`);
      }
      _push(`</div></div><input type="file" accept="image/*,video/*" multiple hidden></div></div><div class="absolute bottom-5 right-5 addStyle">`);
      _push(ssrRenderComponent(_component_a_radio_group, {
        value: type.value,
        "onUpdate:value": ($event) => type.value = $event,
        "button-style": "solid"
      }, {
        default: withCtx((_, _push2, _parent2, _scopeId) => {
          if (_push2) {
            _push2(ssrRenderComponent(_component_a_radio_button, {
              onClick: ($event) => unref(router).push({ name: "add-product-excel-inputProductExcel" }),
              value: "productExcel"
            }, {
              default: withCtx((_2, _push3, _parent3, _scopeId2) => {
                if (_push3) {
                  _push3(`${ssrInterpolate(unref(config).useString("productExcel"))}`);
                } else {
                  return [
                    createTextVNode(toDisplayString(unref(config).useString("productExcel")), 1)
                  ];
                }
              }),
              _: 1
            }, _parent2, _scopeId));
            _push2(ssrRenderComponent(_component_a_radio_button, {
              onClick: ($event) => unref(router).push({ name: "add-product-inputProduct" }),
              value: "product"
            }, {
              default: withCtx((_2, _push3, _parent3, _scopeId2) => {
                if (_push3) {
                  _push3(`${ssrInterpolate(unref(config).useString("product2"))}`);
                } else {
                  return [
                    createTextVNode(toDisplayString(unref(config).useString("product2")), 1)
                  ];
                }
              }),
              _: 1
            }, _parent2, _scopeId));
            _push2(ssrRenderComponent(_component_a_radio_button, {
              onClick: ($event) => unref(router).push({ name: "add-story-inputStory" }),
              value: "story"
            }, {
              default: withCtx((_2, _push3, _parent3, _scopeId2) => {
                if (_push3) {
                  _push3(`${ssrInterpolate(unref(config).useString("story2"))}`);
                } else {
                  return [
                    createTextVNode(toDisplayString(unref(config).useString("story2")), 1)
                  ];
                }
              }),
              _: 1
            }, _parent2, _scopeId));
          } else {
            return [
              createVNode(_component_a_radio_button, {
                onClick: ($event) => unref(router).push({ name: "add-product-excel-inputProductExcel" }),
                value: "productExcel"
              }, {
                default: withCtx(() => [
                  createTextVNode(toDisplayString(unref(config).useString("productExcel")), 1)
                ]),
                _: 1
              }, 8, ["onClick"]),
              createVNode(_component_a_radio_button, {
                onClick: ($event) => unref(router).push({ name: "add-product-inputProduct" }),
                value: "product"
              }, {
                default: withCtx(() => [
                  createTextVNode(toDisplayString(unref(config).useString("product2")), 1)
                ]),
                _: 1
              }, 8, ["onClick"]),
              createVNode(_component_a_radio_button, {
                onClick: ($event) => unref(router).push({ name: "add-story-inputStory" }),
                value: "story"
              }, {
                default: withCtx(() => [
                  createTextVNode(toDisplayString(unref(config).useString("story2")), 1)
                ]),
                _: 1
              }, 8, ["onClick"])
            ];
          }
        }),
        _: 1
      }, _parent));
      _push(`</div>`);
      _push(ssrRenderComponent(_component_CropperModal, {
        visible: cropperVisible.value,
        "onUpdate:visible": ($event) => cropperVisible.value = $event,
        img: unref(previewImg),
        mode: "free",
        aspectRatio: 9 / 16,
        resizable: true,
        onCropped: unref(handleCropped)
      }, null, _parent));
      _push(`<!--]-->`);
    };
  }
});
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/add/story/inputMedia/index.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};

export { _sfc_main as _ };