@ozdao/martyrs 0.2.506 → 0.2.507

package/dist/martyrs/src/modules/spots/components/pages/Spots.vue.cjs

@@ -0,0 +1,345 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const vueRouter = require("vue-router");
+const Feed = require("../../../../components/Feed/Feed.vue.cjs");
+const Filters = require("../../../globals/views/components/sections/Filters.vue2.cjs");
+const Spoiler = require("../../../../components/Spoiler/Spoiler.vue2.cjs");
+const Field = require("../../../../components/Field/Field.vue.cjs");
+const Checkbox = require("../../../../components/Checkbox/Checkbox.vue.cjs");
+const CardSpot = require("../blocks/CardSpot.vue.cjs");
+const IconPlus = require("../../../icons/navigation/IconPlus.vue.cjs");
+const IconChevronBottom = require("../../../icons/navigation/IconChevronBottom.vue.cjs");
+const auth = require("../../../auth/views/store/auth.cjs");
+const globals = require("../../../globals/views/store/globals.cjs");
+const spots = require("../../store/spots.cjs");
+const organizations = require("../../../organizations/store/organizations.cjs");
+const mixins = require("../../../globals/views/mixins/mixins.cjs");
+const _hoisted_1 = { class: "pos-relative" };
+const _hoisted_2 = {
+  key: 0,
+  class: "pd-medium flex-v-center flex-nowrap flex"
+};
+const _hoisted_3 = { class: "cols-2-1_3 br-1px br-solid br-light z-index-3 pos-relative" };
+const _hoisted_4 = { class: "o-y-scroll br-r br-solid br-light pd-medium z-index-2 desktop-only h-100 pos-relative" };
+const _hoisted_5 = { class: "w-100 o-y-scroll h-100" };
+const _hoisted_6 = {
+  key: 0,
+  class: "mn-b-medium"
+};
+const _hoisted_7 = { class: "mn-b-small" };
+const _hoisted_8 = { class: "gap-micro" };
+const _hoisted_9 = ["onClick"];
+const _hoisted_10 = { class: "cursor-pointer w-100 flex-v-center flex-nowrap flex" };
+const _hoisted_11 = { class: "h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra" };
+const _hoisted_12 = { class: "mn-t-small" };
+const _hoisted_13 = { class: "cursor-pointer w-100 flex-v-center flex-nowrap flex" };
+const _hoisted_14 = { class: "h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra" };
+const _hoisted_15 = { class: "mn-t-small" };
+const _hoisted_16 = { class: "cursor-pointer w-100 flex-v-center flex-nowrap flex" };
+const _hoisted_17 = { class: "h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra" };
+const _hoisted_18 = { class: "mn-t-small" };
+const _hoisted_19 = { class: "w-100 rows-1 pd-thin pos-relative o-hidden" };
+const _hoisted_20 = { class: "mn-b-thin w-100 o-y-scroll scroll-hide scroll-snap-type-x-mandatory scroll-pd-regular" };
+const _hoisted_21 = { class: "gap-thin flex-nowrap flex" };
+const _hoisted_22 = ["onClick"];
+const _sfc_main = {
+  __name: "Spots",
+  props: {
+    organization: {
+      type: Object,
+      default: null
+    }
+  },
+  setup(__props) {
+    const route = vueRouter.useRoute();
+    const router = vueRouter.useRouter();
+    const { hasAccess } = mixins.useGlobalMixins();
+    const currentCategories = vue.ref([]);
+    const searchLocation = vue.ref("");
+    const selectedLocation = vue.ref("All");
+    const locationOptions = vue.ref(["All", "Phuket", "Bangkok", "Chiang Mai", "Pattaya"]);
+    const deliveryOptions = vue.ref([
+      { label: "Pickup", value: "pickup" },
+      { label: "Delivery", value: "delivery" },
+      { label: "Dine-in", value: "dinein" }
+    ]);
+    const selectedDeliveryOptions = vue.ref([]);
+    const paymentOptions = vue.ref([
+      { label: "Cash", value: "cash" },
+      { label: "Card", value: "card" },
+      { label: "Crypto", value: "crypto" },
+      { label: "Bank Transfer", value: "transfer" }
+    ]);
+    const selectedPaymentOptions = vue.ref([]);
+    const availableFilters = vue.ref([
+      {
+        title: "Location",
+        value: "location",
+        type: "radio",
+        options: locationOptions.value.map((loc) => ({ label: loc, value: loc }))
+      },
+      {
+        title: "Type",
+        value: "type",
+        type: "checkbox",
+        options: [
+          { label: "Restaurant", value: "restaurant" },
+          { label: "Cafe", value: "cafe" },
+          { label: "Bar", value: "bar" },
+          { label: "Club", value: "club" }
+        ]
+      }
+    ]);
+    const selectedFilters = vue.ref({
+      location: "All",
+      type: []
+    });
+    const selectCategory = (category) => {
+      console.log("Category selected:", category);
+    };
+    const clearFilters = () => {
+      selectedLocation.value = "All";
+      selectedDeliveryOptions.value = [];
+      selectedPaymentOptions.value = [];
+      searchLocation.value = "";
+      selectedFilters.value = {
+        location: "All",
+        type: []
+      };
+    };
+    globals.state.navigation_bar.actions = [{
+      component: IconPlus.default,
+      props: {
+        fill: "rgb(var(--main))"
+      },
+      condition: () => auth.state.user && auth.state.user._id,
+      action: () => route.params._id ? router.push({ name: "Organization_SpotAdd", params: { _id: route.params._id } }) : router.push({ name: "SpotAdd" })
+    }];
+    vue.onMounted(async () => {
+      if (route.params._id) {
+        await organizations.actions.read({ _id: route.params._id });
+      }
+    });
+    vue.onUnmounted(() => {
+      globals.state.navigation_bar.actions = [];
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.unref(route).name !== "Organization" && !_ctx.MOBILE_APP ? (vue.openBlock(), vue.createElementBlock("header", _hoisted_2, [
+          _cache[10] || (_cache[10] = vue.createElementVNode("h2", { class: "mn-r-medium" }, "Spots", -1)),
+          vue.unref(hasAccess)(vue.unref(route).params._id, "spots", "create", auth.state.accesses, auth.state.access.roles) ? (vue.openBlock(), vue.createElementBlock("button", {
+            key: 0,
+            onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$router.push({
+              name: vue.unref(route).params?._id ? "Organization_SpotAdd" : "SpotAdd"
+            })),
+            class: "radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second"
+          }, " + ")) : vue.createCommentVNode("", true)
+        ])) : vue.createCommentVNode("", true),
+        vue.createElementVNode("div", _hoisted_3, [
+          vue.createElementVNode("div", _hoisted_4, [
+            vue.createElementVNode("div", _hoisted_5, [
+              currentCategories.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
+                vue.createElementVNode("h4", _hoisted_7, vue.toDisplayString(vue.unref(route).params.categoryPath ? "Subcategories" : "Categories"), 1),
+                vue.createElementVNode("div", _hoisted_8, [
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(currentCategories.value, (category) => {
+                    return vue.openBlock(), vue.createElementBlock("div", {
+                      key: category._id,
+                      onClick: ($event) => selectCategory(category),
+                      class: "pd-small radius-small cursor-pointer hover-bg-light transition-all"
+                    }, vue.toDisplayString(category.name), 9, _hoisted_9);
+                  }), 128))
+                ])
+              ])) : vue.createCommentVNode("", true),
+              vue.createVNode(Spoiler.default, {
+                class: "o-hidden mn-b-medium",
+                status: true
+              }, {
+                header: vue.withCtx(({ isOpen }) => [
+                  vue.createElementVNode("div", _hoisted_10, [
+                    _cache[11] || (_cache[11] = vue.createElementVNode("h4", { class: "w-100" }, "Location", -1)),
+                    vue.createElementVNode("div", _hoisted_11, [
+                      vue.createVNode(IconChevronBottom.default, {
+                        class: vue.normalizeClass([{ "rotate-180 mn-t-micro-negative": isOpen }, "i-regular"]),
+                        fill: "rgb(var(--black))"
+                      }, null, 8, ["class"])
+                    ])
+                  ])
+                ]),
+                content: vue.withCtx(() => [
+                  vue.createElementVNode("div", _hoisted_12, [
+                    vue.createVNode(Field.default, {
+                      modelValue: searchLocation.value,
+                      "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => searchLocation.value = $event),
+                      placeholder: "Search location...",
+                      type: "text",
+                      class: "w-100 bg-light pd-small radius-small mn-b-small"
+                    }, null, 8, ["modelValue"]),
+                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(locationOptions.value, (location) => {
+                      return vue.openBlock(), vue.createBlock(Checkbox.default, {
+                        key: location,
+                        radio: selectedLocation.value,
+                        "onUpdate:radio": _cache[2] || (_cache[2] = ($event) => selectedLocation.value = $event),
+                        label: location,
+                        value: location,
+                        mode: "radio",
+                        class: "mn-b-micro"
+                      }, null, 8, ["radio", "label", "value"]);
+                    }), 128))
+                  ])
+                ]),
+                _: 1
+              }),
+              vue.createVNode(Spoiler.default, {
+                class: "o-hidden mn-b-medium",
+                status: true
+              }, {
+                header: vue.withCtx(({ isOpen }) => [
+                  vue.createElementVNode("div", _hoisted_13, [
+                    _cache[12] || (_cache[12] = vue.createElementVNode("h4", { class: "w-100" }, "Delivery Options", -1)),
+                    vue.createElementVNode("div", _hoisted_14, [
+                      vue.createVNode(IconChevronBottom.default, {
+                        class: vue.normalizeClass([{ "rotate-180 mn-t-micro-negative": isOpen }, "i-regular"]),
+                        fill: "rgb(var(--black))"
+                      }, null, 8, ["class"])
+                    ])
+                  ])
+                ]),
+                content: vue.withCtx(() => [
+                  vue.createElementVNode("div", _hoisted_15, [
+                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(deliveryOptions.value, (option) => {
+                      return vue.openBlock(), vue.createBlock(Checkbox.default, {
+                        key: option.value,
+                        checkbox: selectedDeliveryOptions.value,
+                        "onUpdate:checkbox": _cache[3] || (_cache[3] = ($event) => selectedDeliveryOptions.value = $event),
+                        label: option.label,
+                        value: option.value,
+                        mode: "checkbox",
+                        class: "mn-b-micro"
+                      }, null, 8, ["checkbox", "label", "value"]);
+                    }), 128))
+                  ])
+                ]),
+                _: 1
+              }),
+              vue.createVNode(Spoiler.default, {
+                class: "o-hidden mn-b-medium",
+                status: true
+              }, {
+                header: vue.withCtx(({ isOpen }) => [
+                  vue.createElementVNode("div", _hoisted_16, [
+                    _cache[13] || (_cache[13] = vue.createElementVNode("h4", { class: "w-100" }, "Payment Options", -1)),
+                    vue.createElementVNode("div", _hoisted_17, [
+                      vue.createVNode(IconChevronBottom.default, {
+                        class: vue.normalizeClass([{ "rotate-180 mn-t-micro-negative": isOpen }, "i-regular"]),
+                        fill: "rgb(var(--black))"
+                      }, null, 8, ["class"])
+                    ])
+                  ])
+                ]),
+                content: vue.withCtx(() => [
+                  vue.createElementVNode("div", _hoisted_18, [
+                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(paymentOptions.value, (option) => {
+                      return vue.openBlock(), vue.createBlock(Checkbox.default, {
+                        key: option.value,
+                        checkbox: selectedPaymentOptions.value,
+                        "onUpdate:checkbox": _cache[4] || (_cache[4] = ($event) => selectedPaymentOptions.value = $event),
+                        label: option.label,
+                        value: option.value,
+                        mode: "checkbox",
+                        class: "mn-b-micro"
+                      }, null, 8, ["checkbox", "label", "value"]);
+                    }), 128))
+                  ])
+                ]),
+                _: 1
+              }),
+              vue.createElementVNode("button", {
+                onClick: clearFilters,
+                class: "bg-main w-100 button mn-t-medium"
+              }, " Clear Filters ")
+            ])
+          ]),
+          vue.createElementVNode("div", _hoisted_19, [
+            vue.createVNode(Filters.default, {
+              filters: availableFilters.value,
+              "onUpdate:filters": _cache[5] || (_cache[5] = ($event) => availableFilters.value = $event),
+              selected: selectedFilters.value,
+              "onUpdate:selected": _cache[6] || (_cache[6] = ($event) => selectedFilters.value = $event)
+            }, null, 8, ["filters", "selected"]),
+            vue.createElementVNode("div", _hoisted_20, [
+              vue.createElementVNode("div", _hoisted_21, [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(currentCategories.value, (category) => {
+                  return vue.openBlock(), vue.createElementBlock("div", {
+                    key: category._id,
+                    onClick: ($event) => selectCategory(category),
+                    class: "flex-child-default bg-light flex t-nowrap pd-medium radius-medium cursor-pointer hover-bg-light transition-all"
+                  }, vue.toDisplayString(category.name), 9, _hoisted_22);
+                }), 128))
+              ])
+            ]),
+            vue.createVNode(Feed.default, {
+              search: true,
+              filter: spots.state.filter,
+              "onUpdate:filter": _cache[7] || (_cache[7] = ($event) => spots.state.filter = $event),
+              sort: spots.state.sort,
+              "onUpdate:sort": _cache[8] || (_cache[8] = ($event) => spots.state.sort = $event),
+              showLoadMore: false,
+              states: {
+                empty: {
+                  title: "No Spots Found",
+                  description: "Currently, there are no spots available."
+                }
+              },
+              store: {
+                read: (options) => spots.actions.read(options),
+                state: spots.state
+              },
+              options: {
+                limit: 12,
+                organization: vue.unref(route).params._id || null,
+                user: auth.state.user._id,
+                location: selectedLocation.value,
+                deliveryOptions: selectedDeliveryOptions.value,
+                paymentOptions: selectedPaymentOptions.value,
+                search: vue.unref(route).query.search
+              },
+              class: "cols-3 pos-relative w-100 rows-1 gap-thin"
+            }, {
+              default: vue.withCtx(({
+                items
+              }) => [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(items, (spot, index) => {
+                  return vue.openBlock(), vue.createBlock(CardSpot.default, {
+                    key: index,
+                    spot,
+                    organization: __props.organization,
+                    editAccess: vue.unref(hasAccess)(vue.unref(route).params._id, "spots", "edit", auth.state.accesses, auth.state.access.roles),
+                    showDeliveryOptions: true,
+                    showPaymentOptions: true,
+                    class: "radius-medium h-min-big bg-light",
+                    onClick: ($event) => _ctx.$router.push({
+                      name: vue.unref(route).params._id ? "Organization_Spot" : "Spot",
+                      params: {
+                        _id: vue.unref(route).params._id,
+                        spot: spot._id
+                      }
+                    })
+                  }, null, 8, ["spot", "organization", "editAccess", "onClick"]);
+                }), 128))
+              ]),
+              _: 1
+            }, 8, ["filter", "sort", "store", "options"]),
+            vue.unref(hasAccess)(vue.unref(route).params._id, "spots", "create", auth.state.accesses, auth.state.access.roles) ? (vue.openBlock(), vue.createElementBlock("button", {
+              key: 0,
+              onClick: _cache[9] || (_cache[9] = ($event) => _ctx.$router.push(`/spots/${vue.unref(route).params._id}/spots/create`)),
+              class: "mn-t-medium bg-main button w-100"
+            }, " Add New Spot ")) : vue.createCommentVNode("", true)
+          ])
+        ])
+      ]);
+    };
+  }
+};
+exports.default = _sfc_main;
+//# sourceMappingURL=Spots.vue.cjs.map

package/dist/martyrs/src/modules/spots/components/pages/Spots.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spots.vue.cjs","sources":["../../../../../../../src/modules/spots/components/pages/Spots.vue"],"sourcesContent":["<template>\n  <div class=\"pos-relative\">\n    <header \n      v-if=\"route.name !== 'Organization' && !MOBILE_APP\"\n      class=\"pd-medium flex-v-center flex-nowrap flex\"\n    >\n      <h2 class=\"mn-r-medium\">Spots</h2>\n      <button \n        v-if=\"hasAccess(route.params._id, 'spots', 'create', auth.state.accesses, auth.state.access.roles)\"\n        @click=\"$router.push({\n          name: route.params?._id ? 'Organization_SpotAdd' : 'SpotAdd'\n        })\" \n        class=\"radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second\">\n          +\n      </button>\n    </header>\n\n    <div class=\"cols-2-1_3 br-1px br-solid br-light z-index-3 pos-relative\">\n\n      <div class=\"o-y-scroll br-r br-solid br-light pd-medium z-index-2 desktop-only h-100 pos-relative\">\n        <div class=\"w-100 o-y-scroll h-100\">\n          <!-- Categories -->\n          <div class=\"mn-b-medium\" v-if=\"currentCategories.length > 0\">\n            <h4 class=\"mn-b-small\">\n              {{ route.params.categoryPath ? 'Subcategories' : 'Categories' }}\n            </h4>\n            <div class=\"gap-micro\">\n              <div\n                v-for=\"category in currentCategories\"\n                :key=\"category._id\"\n                @click=\"selectCategory(category)\"\n                class=\"pd-small radius-small cursor-pointer hover-bg-light transition-all\"\n              >\n                {{ category.name }}\n              </div>\n            </div>\n          </div>\n\n          <!-- Location Filter -->\n          <Spoiler \n            class=\"o-hidden mn-b-medium\"\n            :status=\"true\"\n          >\n            <template #header=\"{ isOpen }\">\n              <div class=\"cursor-pointer w-100 flex-v-center flex-nowrap flex\">\n                <h4 class=\"w-100\">Location</h4>\n                <div class=\"h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra\">\n                  <IconChevronBottom :class=\"{ 'rotate-180 mn-t-micro-negative': isOpen }\" fill=\"rgb(var(--black))\" class=\"i-regular\"/>\n                </div>\n              </div>\n            </template>\n\n            <template #content>\n              <div class=\"mn-t-small\">\n                <Field\n                  v-model=\"searchLocation\"\n                  placeholder=\"Search location...\"\n                  type=\"text\"\n                  class=\"w-100 bg-light pd-small radius-small mn-b-small\"\n                />\n                <Checkbox \n                  v-for=\"location in locationOptions\"\n                  :key=\"location\"\n                  v-model:radio=\"selectedLocation\"\n                  :label=\"location\"\n                  :value=\"location\"\n                  mode=\"radio\"\n                  class=\"mn-b-micro\"\n                />\n              </div>\n            </template>\n          </Spoiler>\n\n          <!-- Delivery Options -->\n          <Spoiler \n            class=\"o-hidden mn-b-medium\"\n            :status=\"true\"\n          >\n            <template #header=\"{ isOpen }\">\n              <div class=\"cursor-pointer w-100 flex-v-center flex-nowrap flex\">\n                <h4 class=\"w-100\">Delivery Options</h4>\n                <div class=\"h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra\">\n                  <IconChevronBottom :class=\"{ 'rotate-180 mn-t-micro-negative': isOpen }\" fill=\"rgb(var(--black))\" class=\"i-regular\"/>\n                </div>\n              </div>\n            </template>\n\n            <template #content>\n              <div class=\"mn-t-small\">\n                <Checkbox \n                  v-for=\"option in deliveryOptions\"\n                  :key=\"option.value\"\n                  v-model:checkbox=\"selectedDeliveryOptions\"\n                  :label=\"option.label\"\n                  :value=\"option.value\"\n                  mode=\"checkbox\"\n                  class=\"mn-b-micro\"\n                />\n              </div>\n            </template>\n          </Spoiler>\n\n          <!-- Payment Options -->\n          <Spoiler \n            class=\"o-hidden mn-b-medium\"\n            :status=\"true\"\n          >\n            <template #header=\"{ isOpen }\">\n              <div class=\"cursor-pointer w-100 flex-v-center flex-nowrap flex\">\n                <h4 class=\"w-100\">Payment Options</h4>\n                <div class=\"h-2r w-2r flex-child-auto aspect-1x1 flex-center flex bg-light radius-extra\">\n                  <IconChevronBottom :class=\"{ 'rotate-180 mn-t-micro-negative': isOpen }\" fill=\"rgb(var(--black))\" class=\"i-regular\"/>\n                </div>\n              </div>\n            </template>\n\n            <template #content>\n              <div class=\"mn-t-small\">\n                <Checkbox \n                  v-for=\"option in paymentOptions\"\n                  :key=\"option.value\"\n                  v-model:checkbox=\"selectedPaymentOptions\"\n                  :label=\"option.label\"\n                  :value=\"option.value\"\n                  mode=\"checkbox\"\n                  class=\"mn-b-micro\"\n                />\n              </div>\n            </template>\n          </Spoiler>\n\n          <!-- Clear Filters Button -->\n          <button \n            @click=\"clearFilters\"\n            class=\"bg-main w-100 button mn-t-medium\"\n          >\n            Clear Filters\n          </button>\n        </div>\n      </div>\n\n      <div class=\"w-100 rows-1 pd-thin pos-relative o-hidden\">\n        <Filters\n          v-model:filters=\"availableFilters\"\n          v-model:selected=\"selectedFilters\"\n        />\n        \n        <div class=\"mn-b-thin w-100 o-y-scroll scroll-hide scroll-snap-type-x-mandatory scroll-pd-regular\">\n          <div class=\"gap-thin flex-nowrap flex\">\n            <div\n              v-for=\"category in currentCategories\"\n              :key=\"category._id\"\n              @click=\"selectCategory(category)\"\n              class=\"flex-child-default bg-light flex t-nowrap pd-medium radius-medium cursor-pointer hover-bg-light transition-all\"\n            >\n              {{ category.name }}\n            </div>\n          </div>\n        </div>\n\n        <Feed\n          :search=\"true\"\n          v-model:filter=\"spots.state.filter\"\n          v-model:sort=\"spots.state.sort\"\n          :showLoadMore=\"false\"\n          :states=\"{\n            empty: {\n              title: 'No Spots Found',\n              description: 'Currently, there are no spots available.'\n            }\n          }\"\n          :store=\"{\n            read: (options) => spots.actions.read(options),\n            state: spots.state\n          }\"\n          :options=\"{\n            limit: 12,\n            organization: route.params._id || null,\n            user: auth.state.user._id,\n            location: selectedLocation,\n            deliveryOptions: selectedDeliveryOptions,\n            paymentOptions: selectedPaymentOptions,\n            search: route.query.search\n          }\"\n          v-slot=\"{ \n            items \n          }\"\n          class=\"cols-3 pos-relative w-100 rows-1 gap-thin\"\n        >\n          <CardSpot\n            v-for=\"(spot, index) in items\"\n            :key=\"index\"\n            :spot=\"spot\"\n            :organization=\"organization\"\n            :editAccess=\"hasAccess(route.params._id, 'spots', 'edit', auth.state.accesses, auth.state.access.roles)\"\n            :showDeliveryOptions=\"true\"\n            :showPaymentOptions=\"true\"\n            class=\"radius-medium h-min-big bg-light\"\n            @click=\"$router.push({ \n              name: route.params._id ? 'Organization_Spot' : 'Spot', \n              params: { \n                _id: route.params._id,\n                spot: spot._id \n              } \n            })\"\n          />\n        </Feed>\n\n        <button\n          v-if=\"hasAccess(route.params._id, 'spots', 'create', auth.state.accesses, auth.state.access.roles)\"\n          @click=\"$router.push(`/spots/${route.params._id}/spots/create`)\"\n          class=\"mn-t-medium bg-main button w-100\"\n        >\n          Add New Spot\n        </button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup=\"props\">\n  // Import libs\n  import { ref, computed, watch, onMounted, onUnmounted } from 'vue'\n  import { useRoute, useRouter } from 'vue-router'\n\n  // Import components\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n  import Filters from '@martyrs/src/modules/globals/views/components/sections/Filters.vue'\n  import Spoiler from \"@martyrs/src/components/Spoiler/Spoiler.vue\"\n  import Field from \"@martyrs/src/components/Field/Field.vue\"\n  import Checkbox from \"@martyrs/src/components/Checkbox/Checkbox.vue\"\n\n  import CardSpot from '@martyrs/src/modules/spots/components/blocks/CardSpot.vue'\n\n  import IconPlus from '@martyrs/src/modules/icons/navigation/IconPlus.vue'\n  import IconChevronBottom from '@martyrs/src/modules/icons/navigation/IconChevronBottom.vue'\n\n  // Accessing router and store\n  import * as auth from '@martyrs/src/modules/auth/views/store/auth.js';\n  import * as globals from '@martyrs/src/modules/globals/views/store/globals.js';\n  import * as spots from '@martyrs/src/modules/spots/store/spots.js';\n  import * as organizations from '@martyrs/src/modules/organizations/store/organizations.js';\n  import { useGlobalMixins } from '@martyrs/src/modules/globals/views/mixins/mixins.js';\n\n  const route = useRoute()\n  const router = useRouter()\n  const { hasAccess } = useGlobalMixins()\n\n  // Props\n  const props = defineProps({\n    organization: {\n      type: Object,\n      default: null\n    }\n  })\n\n  // Categories\n  const currentCategories = ref([]);\n  const searchLocation = ref('');\n  const selectedLocation = ref('All');\n  const locationOptions = ref(['All', 'Phuket', 'Bangkok', 'Chiang Mai', 'Pattaya']);\n\n  // Delivery options\n  const deliveryOptions = ref([\n    { label: 'Pickup', value: 'pickup' },\n    { label: 'Delivery', value: 'delivery' },\n    { label: 'Dine-in', value: 'dinein' }\n  ]);\n  const selectedDeliveryOptions = ref([]);\n\n  // Payment options\n  const paymentOptions = ref([\n    { label: 'Cash', value: 'cash' },\n    { label: 'Card', value: 'card' },\n    { label: 'Crypto', value: 'crypto' },\n    { label: 'Bank Transfer', value: 'transfer' }\n  ]);\n  const selectedPaymentOptions = ref([]);\n\n  const availableFilters = ref([\n    {\n      title: 'Location',\n      value: 'location',\n      type: 'radio',\n      options: locationOptions.value.map(loc => ({ label: loc, value: loc }))\n    },\n    {\n      title: 'Type',\n      value: 'type',\n      type: 'checkbox',\n      options: [\n        { label: 'Restaurant', value: 'restaurant' },\n        { label: 'Cafe', value: 'cafe' },\n        { label: 'Bar', value: 'bar' },\n        { label: 'Club', value: 'club' }\n      ]\n    }\n  ])\n\n  const selectedFilters = ref({\n    location: 'All',\n    type: []\n  })\n\n  const selectCategory = (category) => {\n    // Implementation for category selection\n    console.log('Category selected:', category);\n  };\n\n  const clearFilters = () => {\n    selectedLocation.value = 'All';\n    selectedDeliveryOptions.value = [];\n    selectedPaymentOptions.value = [];\n    searchLocation.value = '';\n    selectedFilters.value = {\n      location: 'All',\n      type: []\n    };\n  };\n\n  globals.state.navigation_bar.actions = [{\n    component: IconPlus,\n    props: {\n      fill: \"rgb(var(--main))\" \n    },\n    condition: () => auth.state.user && auth.state.user._id,\n    action: () => route.params._id ? router.push({ name: 'Organization_SpotAdd', params: { _id: route.params._id} }) : router.push({ name: 'SpotAdd' })\n  }]\n\n  onMounted(async () => {\n    if (route.params._id) {\n      await organizations.actions.read({ _id: route.params._id });\n    }\n  })\n\n  onUnmounted(() => {\n    globals.state.navigation_bar.actions = [];\n  });\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":["useRoute","useRouter","useGlobalMixins","ref","globals.state","IconPlus","auth.state","onMounted","organizations.actions","onUnmounted"],"mappings":"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"}