@ozdao/martyrs 0.2.477 → 0.2.478

package/dist/martyrs/src/modules/products/components/pages/Leftovers.vue.cjs

@@ -2,88 +2,312 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const vueRouter = require("vue-router");
-const Tab = require("../../../../components/Tab/Tab.vue2.cjs");
+const Table = require("../../../../components/Table/Table.vue.cjs");
 const Feed = require("../../../../components/Feed/Feed.vue.cjs");
-const CardLeftover = require("../blocks/CardLeftover.vue.cjs");
+const PlaceholderImage = require("../../../icons/placeholders/PlaceholderImage.vue.cjs");
+const Dropdown = require("../../../../components/Dropdown/Dropdown.vue2.cjs");
+const Popup = require("../../../../components/Popup/Popup.vue.cjs");
+const IconSettings = require("../../../icons/entities/IconSettings.vue.cjs");
+const IconEllipsis = require("../../../icons/navigation/IconEllipsis.vue.cjs");
+const StockAuditForm = require("../forms/StockAuditForm.vue.cjs");
+const ReorderSettingsForm = require("../forms/ReorderSettingsForm.vue.cjs");
+const StockHistoryView = require("../forms/StockHistoryView.vue.cjs");
+const ColumnSettingsMenu = ;/* empty css                                */
+const products = require("../../store/products.cjs");
 const leftovers = require("../../store/leftovers.cjs");
 ;/* empty css                 */
 const _hoisted_1 = { class: "pd-thin" };
 const _hoisted_2 = { class: "mn-b-medium flex-v-center flex-nowrap flex" };
-const _hoisted_3 = { class: "mn-b-semi pd-medium bg-light radius-big" };
+const _hoisted_3 = { class: "flex gap-small flex-nowrap flex-v-center" };
+const _hoisted_4 = ["src"];
+const _hoisted_5 = { class: "t-nowrap" };
+const _hoisted_6 = { key: 1 };
+const _hoisted_7 = { class: "flex-column flex" };
+const _hoisted_8 = { class: "d-block mn-b-thin" };
+const _hoisted_9 = { class: "w-100 h-micro radius-thin bg-light" };
+const _hoisted_10 = { class: "bg-white radius-small" };
+const _hoisted_11 = ["onClick"];
+const _hoisted_12 = ["onClick"];
+const _hoisted_13 = ["onClick"];
 const _sfc_main = {
   __name: "Leftovers",
   setup(__props) {
     const route = vueRouter.useRoute();
-    vueRouter.useRouter();
-    const tab = vue.ref(route.query.tab ? route.query.tab : "all");
-    const totalPrice = vue.computed(() => {
-      return leftovers.state.all.reduce((totalSum, item) => {
-        const itemTotal = item.positions.reduce((sum, position) => {
-          return sum + position.price;
-        }, 0);
-        if (item.type === "stock-in") {
-          return totalSum - itemTotal;
-        } else if (item.type === "stock-out") {
-          return totalSum + itemTotal;
-        } else {
-          return totalSum;
+    const router = vueRouter.useRouter();
+    const sort = vue.ref({
+      param: "available",
+      order: "asc",
+      options: [
+        { label: "Available", value: "available" },
+        { label: "Name", value: "name" },
+        { label: "Price", value: "price" },
+        { label: "Created", value: "createdAt" }
+      ]
+    });
+    const filter = vue.reactive({
+      active: false,
+      class: "",
+      selected: { category: [], stockLevel: [] },
+      options: [
+        { title: "Categories", value: "category", options: [] },
+        {
+          title: "Stock Level",
+          value: "stockLevel",
+          options: [
+            { label: "Low", value: "low" },
+            { label: "Medium", value: "medium" },
+            { label: "High", value: "high" }
+          ]
         }
-      }, 0);
+      ]
     });
+    const columns = vue.reactive([
+      { key: "name", label: "Product Name", component: true, visible: true },
+      { key: "category", label: "Categories", component: true, visible: true },
+      { key: "supplier", label: "Supplier", visible: true },
+      { key: "available", label: "Available", component: true, visible: true },
+      { key: "price", label: "Unit Price", component: true, visible: true },
+      { key: "actions", label: "", component: true, visible: true }
+    ]);
+    const showAuditModal = vue.ref(false);
+    const showReorderModal = vue.ref(false);
+    const showHistoryModal = vue.ref(false);
+    const showSettingsModal = vue.ref(false);
+    const selectedProduct = vue.ref(null);
+    function openStockAudit(row) {
+      selectedProduct.value = row;
+      showAuditModal.value = true;
+    }
+    function openReorderSettings(row = null) {
+      selectedProduct.value = row;
+      showReorderModal.value = true;
+    }
+    function openStockHistory(row) {
+      selectedProduct.value = row;
+      showHistoryModal.value = true;
+    }
+    function openViewSettings() {
+      showSettingsModal.value = true;
+    }
+    async function handleAuditSave(audit) {
+      var _a, _b, _c;
+      try {
+        await leftovers.actions.create({
+          organization: route.params._id,
+          type: audit.discrepancy > 0 ? "stock-in" : "stock-out",
+          comment: audit.note,
+          positions: [{
+            _id: selectedProduct.value._id,
+            name: selectedProduct.value.name,
+            quantity: Math.abs(audit.discrepancy),
+            price: selectedProduct.value.price || 0,
+            type: "pcs"
+          }],
+          creator: {
+            type: "user",
+            target: (_c = (_b = (_a = window.auth) == null ? void 0 : _a.state) == null ? void 0 : _b.user) == null ? void 0 : _c._id
+          },
+          owner: {
+            type: "organization",
+            target: route.params._id
+          }
+        });
+        showAuditModal.value = false;
+      } catch (err) {
+        console.error(err);
+      }
+    }
+    async function handleReorderSave(settings) {
+      var _a;
+      alert(`Reorder threshold set to ${settings.threshold} for ${((_a = selectedProduct.value) == null ? void 0 : _a.name) || "all products"}`);
+      showReorderModal.value = false;
+    }
+    function handleColumnsUpdate(updated) {
+      leftovers.mutations.updateColumnSettings(updated);
+      showSettingsModal.value = false;
+    }
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         vue.createElementVNode("header", _hoisted_2, [
-          _cache[2] || (_cache[2] = vue.createElementVNode("h2", { class: "mn-r-medium" }, "Inventory", -1)),
+          _cache[11] || (_cache[11] = vue.createElementVNode("h2", null, "Leftovers", -1)),
           vue.createElementVNode("button", {
-            onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$router.push({
-              name: "LeftoverAdd"
-            })),
-            class: "radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second"
-          }, " + ")
+            onClick: _cache[0] || (_cache[0] = ($event) => vue.unref(router).push({ name: "LeftoverAdd" })),
+            class: "mn-l-small radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second",
+            innerHTML: "+"
+          })
         ]),
-        vue.createElementVNode("section", _hoisted_3, [
-          _cache[3] || (_cache[3] = vue.createElementVNode("p", { class: "mn-b-thin" }, "Balance:", -1)),
-          vue.createElementVNode("h3", null, vue.toDisplayString(_ctx.formatPrice(totalPrice.value)), 1)
-        ]),
-        vue.createVNode(Tab.default, {
-          selected: tab.value,
-          "onUpdate:selected": _cache[1] || (_cache[1] = ($event) => tab.value = $event),
-          tabs: [
-            { name: "All", value: "all" },
-            { name: "Stock-In", value: "stock-in" },
-            { name: "Stock-Out", value: "stock-out" }
-          ],
-          class: "mn-b-small o-hidden h5 radius-big bg-light"
-        }, null, 8, ["selected"]),
         vue.createVNode(Feed.default, {
           search: true,
-          states: {
-            empty: {
-              title: "No Leftovers Found",
-              description: "Currently, there are no leftovers available."
-            }
-          },
+          filter,
+          "onUpdate:filter": _cache[1] || (_cache[1] = ($event) => filter = $event),
+          sort: sort.value,
+          "onUpdate:sort": _cache[2] || (_cache[2] = ($event) => sort.value = $event),
           store: {
-            read: (options) => leftovers.actions.read(options)
+            read: (options) => products.actions.read(options),
+            state: products.state
           },
+          actions: [{
+            key: "settings",
+            component: IconSettings.default,
+            props: {
+              class: "h-3r pd-r-small pd-l-small flex-center flex bg-light t-black radius-small hover-scale-1 cursor-pointer"
+            },
+            handler: openViewSettings
+          }],
           options: {
             limit: 15,
+            lookup: ["leftovers", "categories"],
             owner: vue.unref(route).params._id,
-            ...tab.value !== "all" && { type: tab.value }
+            sortParam: sort.value.param,
+            sortOrder: sort.value.order
           }
         }, {
-          default: vue.withCtx(({
-            items
-          }) => [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(items, (leftover) => {
-              return vue.openBlock(), vue.createBlock(CardLeftover.default, {
-                leftover,
-                class: "bg-light pd-small mn-b-thin radius-small"
-              }, null, 8, ["leftover"]);
-            }), 256))
+          default: vue.withCtx(({ items }) => [
+            vue.createVNode(Table.default, {
+              columns: columns.filter((col) => col.visible),
+              items,
+              class: "bg-white z-index-1 br-solid br-1px br-light radius-medium"
+            }, {
+              "cell-name": vue.withCtx(({ row }) => {
+                var _a;
+                return [
+                  vue.createElementVNode("div", _hoisted_3, [
+                    ((_a = row.images) == null ? void 0 : _a.length) ? (vue.openBlock(), vue.createElementBlock("img", {
+                      key: 0,
+                      src: (_ctx.FILE_SERVER_URL || "") + row.images[0],
+                      alt: "Product",
+                      class: "w-3r h-3r radius-small bg-light object-fit-cover"
+                    }, null, 8, _hoisted_4)) : (vue.openBlock(), vue.createBlock(PlaceholderImage.default, {
+                      key: 1,
+                      class: "w-3r h-3r radius-small"
+                    })),
+                    vue.createElementVNode("span", _hoisted_5, vue.toDisplayString(row.name), 1)
+                  ])
+                ];
+              }),
+              "cell-category": vue.withCtx(({ row }) => [
+                row.category ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(row.category, (cat) => {
+                  return vue.openBlock(), vue.createElementBlock("span", {
+                    key: cat._id,
+                    class: "pd-nano mn-r-micro pd-r-small pd-l-small radius-small bg-light t-small"
+                  }, vue.toDisplayString(cat.name), 1);
+                }), 128)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_6, "="))
+              ]),
+              "cell-supplier": vue.withCtx(({ row }) => {
+                var _a, _b, _c;
+                return [
+                  vue.createTextVNode(vue.toDisplayString(((_c = (_b = (_a = row.owner) == null ? void 0 : _a.target) == null ? void 0 : _b.profile) == null ? void 0 : _c.name) || "-"), 1)
+                ];
+              }),
+              "cell-available": vue.withCtx(({ row }) => [
+                vue.createElementVNode("div", _hoisted_7, [
+                  vue.createElementVNode("span", _hoisted_8, vue.toDisplayString(row.available) + " · " + vue.toDisplayString(row.available <= 5 ? "Low" : row.available <= 10 ? "Medium" : "High"), 1),
+                  vue.createElementVNode("div", _hoisted_9, [
+                    vue.createElementVNode("div", {
+                      class: vue.normalizeClass([
+                        "h-100 radius-thin",
+                        row.available <= 1 ? "bg-red t-white" : row.available <= 2 ? "bg-orange t-white" : "bg-green t-white"
+                      ]),
+                      style: vue.normalizeStyle(`width: ${Math.min(
+                        row.available / (row.alert !== void 0 ? row.alert : 50) * 100,
+                        100
+                      )}%`)
+                    }, null, 6)
+                  ])
+                ])
+              ]),
+              "cell-price": vue.withCtx(({ row }) => [
+                vue.createTextVNode(vue.toDisplayString(_ctx.formatPrice(row.price)), 1)
+              ]),
+              "cell-actions": vue.withCtx(({ row }) => [
+                vue.createVNode(Dropdown.default, {
+                  label: { component: IconEllipsis.default, class: "t-transp i-medium" },
+                  class: "cursor-pointer aspect-1x1 pd-nano radius-small hover-bg-light",
+                  align: "right"
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createElementVNode("div", _hoisted_10, [
+                      vue.createElementVNode("button", {
+                        onClick: ($event) => openStockAudit(row),
+                        class: "cursor-pointer t-left t-nowrap w-100 pd-small"
+                      }, " Audit Stock ", 8, _hoisted_11),
+                      vue.createElementVNode("button", {
+                        onClick: ($event) => openStockHistory(row),
+                        class: "cursor-pointer t-left t-nowrap w-100 pd-small"
+                      }, " Stock History ", 8, _hoisted_12),
+                      vue.createElementVNode("button", {
+                        onClick: ($event) => openReorderSettings(row),
+                        class: "cursor-pointer t-left t-nowrap w-100 pd-small"
+                      }, " Set Alerts ", 8, _hoisted_13)
+                    ])
+                  ]),
+                  _: 2
+                }, 1032, ["label"])
+              ]),
+              _: 2
+            }, 1032, ["columns", "items"])
+          ]),
+          _: 1
+        }, 8, ["filter", "sort", "store", "actions", "options"]),
+        vue.createVNode(Popup.default, {
+          isPopupOpen: showAuditModal.value,
+          onClosePopup: _cache[4] || (_cache[4] = ($event) => showAuditModal.value = false),
+          title: "Audit Stock",
+          class: "bg-white radius-medium pd-medium w-min-40r"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(StockAuditForm.default, {
+              product: selectedProduct.value,
+              onClose: _cache[3] || (_cache[3] = ($event) => showAuditModal.value = false),
+              onSave: handleAuditSave
+            }, null, 8, ["product"])
+          ]),
+          _: 1
+        }, 8, ["isPopupOpen"]),
+        vue.createVNode(Popup.default, {
+          isPopupOpen: showReorderModal.value,
+          onClosePopup: _cache[6] || (_cache[6] = ($event) => showReorderModal.value = false),
+          title: "Set Automatic Reorder",
+          class: "bg-white radius-medium pd-medium w-min-30r"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(ReorderSettingsForm.default, {
+              product: selectedProduct.value,
+              onClose: _cache[5] || (_cache[5] = ($event) => showReorderModal.value = false),
+              onSave: handleReorderSave
+            }, null, 8, ["product"])
+          ]),
+          _: 1
+        }, 8, ["isPopupOpen"]),
+        vue.createVNode(Popup.default, {
+          isPopupOpen: showHistoryModal.value,
+          onClosePopup: _cache[8] || (_cache[8] = ($event) => showHistoryModal.value = false),
+          title: "Stock History",
+          class: "bg-white radius-medium pd-medium w-min-50r"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(StockHistoryView.default, {
+              product: selectedProduct.value,
+              onClose: _cache[7] || (_cache[7] = ($event) => showHistoryModal.value = false)
+            }, null, 8, ["product"])
+          ]),
+          _: 1
+        }, 8, ["isPopupOpen"]),
+        vue.createVNode(Popup.default, {
+          isPopupOpen: showSettingsModal.value,
+          onClosePopup: _cache[10] || (_cache[10] = ($event) => showSettingsModal.value = false),
+          title: "View Settings",
+          class: "bg-white radius-medium pd-medium w-min-30r"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(ColumnSettingsMenu.default, {
+              columns,
+              onSave: handleColumnsUpdate,
+              onClose: _cache[9] || (_cache[9] = ($event) => showSettingsModal.value = false)
+            }, null, 8, ["columns"])
           ]),
           _: 1
-        }, 8, ["store", "options"])
+        }, 8, ["isPopupOpen"])
       ]);
     };
   }

package/dist/martyrs/src/modules/products/components/pages/Leftovers.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Leftovers.vue.cjs","sources":["../../../../../../../src/modules/products/components/pages/Leftovers.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin\">\n    <header class=\"mn-b-medium flex-v-center flex-nowrap flex\">\n      <h2 class=\"mn-r-medium\">Inventory</h2>\n      <button \n        @click=\"$router.push({\n          name: 'LeftoverAdd'\n        })\" \n        class=\"radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second\">\n          +\n      </button>\n    </header>\n    \n    <section class=\"mn-b-semi pd-medium bg-light radius-big\">\n      <p class=\"mn-b-thin\">Balance:</p>\n      <h3>{{formatPrice(totalPrice)}}</h3>\n    </section>\n\n    <!-- <h3>Low Stock</h3>\n\n    <section class=\"mn-b-semi pd-medium bg-light radius-big\">\n      <div>\n        Name: Code Red\n        Left: 3\n        <button>add</button>\n      </div>\n      <div>\n        Name: Code Red\n        Left: 3\n        <button>add</button>\n      </div>\n      <div>\n        Name: Code Red\n        Left: 3\n        <button>add</button>\n      </div>\n    </section> -->\n\n    <Tab \n      v-model:selected=\"tab\"\n      :tabs=\"[\n        { name: 'All',        value: 'all' },\n        { name: 'Stock-In',   value: 'stock-in' },\n        { name: 'Stock-Out',  value: 'stock-out' }\n      ]\"\n      class=\"mn-b-small o-hidden h5 radius-big bg-light\"\n    />\n\n    <Feed\n      :search=\"true\"\n      :states=\"{\n        empty: {\n          title: 'No Leftovers Found',\n          description: 'Currently, there are no leftovers available.'\n        }\n      }\"\n      :store=\"{\n        read: (options) => leftovers.actions.read(options)\n      }\"\n      :options=\"{\n        limit: 15,\n        owner: route.params._id,\n        ...(tab !== 'all' && { type: tab })\n      }\"\n      v-slot=\"{ \n        items \n      }\"\n    >\n      <CardLeftover \n        v-for=\"leftover in items\" \n        :leftover=\"leftover\"\n        class=\"bg-light pd-small mn-b-thin radius-small\"\n      />\n    </Feed>\n  </div>\n</template>\n\n\n<script setup>\n  import { computed, onMounted, reactive, ref } from 'vue'\n  import { useRoute, useRouter } from 'vue-router'\n\n  import Tab      from '@martyrs/src/components/Tab/Tab.vue'\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n  import CardLeftover from '../blocks/CardLeftover.vue'\n\n  import * as leftovers from '@martyrs/src/modules/products/store/leftovers' // Убедитесь, что путь к вашему файлу стора верный\n\n  const route = useRoute()\n  const router = useRouter()\n\n  // Tab logic\n  const tab = ref(route.query.tab ? route.query.tab : 'all')\n  // await leftovers.actions.read()\n  const totalPrice = computed(() => {\n    return leftovers.state.all.reduce((totalSum, item) => {\n      const itemTotal = item.positions.reduce((sum, position) => {\n        return sum + position.price;\n      }, 0);\n\n      // Adjust the sum based on the type of transaction\n      if (item.type === 'stock-in') {\n        // If it's a stock-in, subtract the itemTotal from the totalSum\n        return totalSum - itemTotal;\n      } else if (item.type === 'stock-out') {\n        // If it's a stock-out, add the itemTotal to the totalSum\n        return totalSum + itemTotal;\n      } else {\n        // If the item type is not specified or is different, do not adjust the totalSum\n        return totalSum;\n      }\n    }, 0);\n  });\n\n</script>\n\n<style lang=\"scss\">\n\n.round-stat {\n  padding: 1rem;\n  border-radius: 5rem;\n  width: 3rem;\n  height: 3rem;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 1px solid rgba(0,0,0,0.1);\n\n  &-tab {\n    width: 2rem;\n    height: 2rem;\n  }\n}\n\n\n\n.order-card {\n  border-radius: 0.25rem;\n  overflow: hidden;\n  box-shadow: 0 8px 8px -8px rgb(36 36 36 / 10%);\n  .order-status {\n    color: black;\n    background: #EEF2F6; \n    width: 100%;\n    padding: 0.75rem 1.5rem;\n    margin: 0;\n  }\n\n  .new {\n    color: white;\n    background: #00ff88;\n  }\n\n  .block {\n    border-radius: 0;\n    border: 0;\n  }\n}\n\n  \n</style>\n"],"names":["useRoute","useRouter","ref","computed","leftovers.state"],"mappings":";;;;;;;;;;;;;;;AAwFE,UAAM,QAAQA,UAAQ,SAAA;AACPC,cAAS,UAAA;AAGxB,UAAM,MAAMC,IAAG,IAAC,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,KAAK;AAEzD,UAAM,aAAaC,IAAAA,SAAS,MAAM;AAChC,aAAOC,UAAe,MAAC,IAAI,OAAO,CAAC,UAAU,SAAS;AACpD,cAAM,YAAY,KAAK,UAAU,OAAO,CAAC,KAAK,aAAa;AACzD,iBAAO,MAAM,SAAS;AAAA,QACvB,GAAE,CAAC;AAGJ,YAAI,KAAK,SAAS,YAAY;AAE5B,iBAAO,WAAW;AAAA,QAC1B,WAAiB,KAAK,SAAS,aAAa;AAEpC,iBAAO,WAAW;AAAA,QAC1B,OAAa;AAEL,iBAAO;AAAA,QACf;AAAA,MACK,GAAE,CAAC;AAAA,IACR,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Leftovers.vue.cjs","sources":["../../../../../../../src/modules/products/components/pages/Leftovers.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin\">\n    <!-- Header -->\n    <header class=\"mn-b-medium flex-v-center flex-nowrap flex\">\n      <h2>Leftovers</h2>\n      <button\n        @click=\"router.push({ name: 'LeftoverAdd' })\"\n        class=\"mn-l-small radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second\"\n        v-html=\"'+'\"\n      />\n    </header>\n\n    <!-- Products Feed -->\n    <Feed\n      :search=\"true\"\n      v-model:filter=\"filter\"\n      v-model:sort=\"sort\"\n      :store=\"{\n        read: (options) => products.actions.read(options),\n        state: products.state\n      }\"\n      :actions=\"[{\n        key: 'settings',\n        component: IconSettings,\n        props: {\n          class: 'h-3r pd-r-small pd-l-small flex-center flex bg-light t-black radius-small hover-scale-1 cursor-pointer'\n        },\n        handler: openViewSettings\n      }]\"\n      :options=\"{\n        limit: 15,\n        lookup: ['leftovers','categories'],\n        owner: route.params._id,\n        sortParam: sort.param,\n        sortOrder: sort.order\n      }\"\n      v-slot=\"{ items }\"\n    >\n      <Table\n        :columns=\"columns.filter(col => col.visible)\"\n        :items=\"items\"\n        class=\"bg-white z-index-1 br-solid br-1px br-light radius-medium\"\n      >\n        <!-- Name column (was \"product\") -->\n        <template #cell-name=\"{ row }\">\n          <div class=\"flex gap-small flex-nowrap flex-v-center\">\n            <img\n              v-if=\"row.images?.length\"\n              :src=\"(FILE_SERVER_URL || '') + row.images[0]\"\n              alt=\"Product\"\n              class=\"w-3r h-3r radius-small bg-light object-fit-cover\"\n            />\n            <PlaceholderImage v-else class=\"w-3r h-3r radius-small\" />\n            <span class=\"t-nowrap\">{{ row.name }}</span>\n          </div>\n        </template>\n\n        <!-- Categories -->\n        <template #cell-category=\"{ row }\">\n          <span\n            v-if=\"row.category\"\n            v-for=\"cat in row.category\"\n            :key=\"cat._id\"\n            class=\"pd-nano mn-r-micro pd-r-small pd-l-small radius-small bg-light t-small\"\n          >\n            {{ cat.name }}\n          </span>\n          <span v-else>=</span>\n        </template>\n\n        <!-- Supplier -->\n        <template #cell-supplier=\"{ row }\">\n          {{ row.owner?.target?.profile?.name || '-' }}\n        </template>\n\n        <!-- Available (replaces stock) -->\n        <template #cell-available=\"{ row }\">\n          <div class=\"flex-column flex\">\n            <span class=\"d-block mn-b-thin\">\n              {{ row.available }} ·\n              {{ row.available <= 5 ? 'Low' : row.available <= 10 ? 'Medium' : 'High' }}\n            </span>\n            <div class=\"w-100 h-micro radius-thin bg-light\">\n              <div\n                class=\"h-100 radius-thin\"\n                :class=\"\n                  row.available <= 1\n                    ? 'bg-red t-white'\n                    : row.available <= 2\n                    ? 'bg-orange t-white'\n                    : 'bg-green t-white'\n                \"\n                :style=\"`width: ${\n                  Math.min(\n                    (row.available / (row.alert !== undefined ? row.alert : 50)) * 100,\n                    100\n                  )\n                }%`\"\n              />\n            </div>\n          </div>\n        </template>\n        <!-- Price -->\n        <template #cell-price=\"{ row }\">\n          {{ formatPrice(row.price) }}\n        </template>\n\n        <!-- Actions -->\n        <template #cell-actions=\"{ row }\">\n          <Dropdown\n            :label=\"{ component: IconEllipsis, class: 't-transp i-medium' }\"\n            class=\"cursor-pointer aspect-1x1 pd-nano radius-small hover-bg-light\"\n            align=\"right\"\n          >\n            <div class=\"bg-white radius-small\">\n              <button @click=\"openStockAudit(row)\" class=\"cursor-pointer t-left t-nowrap w-100 pd-small\">\n                Audit Stock\n              </button>\n              <button @click=\"openStockHistory(row)\" class=\"cursor-pointer t-left t-nowrap w-100 pd-small\">\n                Stock History\n              </button>\n              <button @click=\"openReorderSettings(row)\" class=\"cursor-pointer t-left t-nowrap w-100 pd-small\">\n                Set Alerts\n              </button>\n            </div>\n          </Dropdown>\n        </template>\n      </Table>\n    </Feed>\n\n    <!-- Modals -->\n    <Popup\n      :isPopupOpen=\"showAuditModal\"\n      @close-popup=\"showAuditModal = false\"\n      title=\"Audit Stock\"\n      class=\"bg-white radius-medium pd-medium w-min-40r\"\n    >\n      <StockAuditForm\n        :product=\"selectedProduct\"\n        @close=\"showAuditModal = false\"\n        @save=\"handleAuditSave\"\n      />\n    </Popup>\n\n    <Popup\n      :isPopupOpen=\"showReorderModal\"\n      @close-popup=\"showReorderModal = false\"\n      title=\"Set Automatic Reorder\"\n      class=\"bg-white radius-medium pd-medium w-min-30r\"\n    >\n      <ReorderSettingsForm\n        :product=\"selectedProduct\"\n        @close=\"showReorderModal = false\"\n        @save=\"handleReorderSave\"\n      />\n    </Popup>\n\n    <Popup\n      :isPopupOpen=\"showHistoryModal\"\n      @close-popup=\"showHistoryModal = false\"\n      title=\"Stock History\"\n      class=\"bg-white radius-medium pd-medium w-min-50r\"\n    >\n      <StockHistoryView\n        :product=\"selectedProduct\"\n        @close=\"showHistoryModal = false\"\n      />\n    </Popup>\n\n    <Popup\n      :isPopupOpen=\"showSettingsModal\"\n      @close-popup=\"showSettingsModal = false\"\n      title=\"View Settings\"\n      class=\"bg-white radius-medium pd-medium w-min-30r\"\n    >\n      <ColumnSettingsMenu\n        :columns=\"columns\"\n        @save=\"handleColumnsUpdate\"\n        @close=\"showSettingsModal = false\"\n      />\n    </Popup>\n  </div>\n</template>\n\n<script setup>\nimport { ref, reactive } from 'vue'\nimport { useRoute, useRouter } from 'vue-router'\n\n// Components\nimport Table from '@martyrs/src/components/Table/Table.vue'\nimport Feed from '@martyrs/src/components/Feed/Feed.vue'\nimport PlaceholderImage from '@martyrs/src/modules/icons/placeholders/PlaceholderImage.vue'\nimport Dropdown from '@martyrs/src/components/Dropdown/Dropdown.vue'\nimport Popup from '@martyrs/src/components/Popup/Popup.vue'\n\n// Icons\nimport IconSettings from '@martyrs/src/modules/icons/entities/IconSettings.vue'\nimport IconEllipsis from '@martyrs/src/modules/icons/navigation/IconEllipsis.vue'\n\n// Forms\nimport StockAuditForm from '../forms/StockAuditForm.vue'\nimport ReorderSettingsForm from '../forms/ReorderSettingsForm.vue'\nimport StockHistoryView from '../forms/StockHistoryView.vue'\nimport ColumnSettingsMenu from '../forms/ColumnSettingsMenu.vue'\n\n// Stores\nimport * as products from '@martyrs/src/modules/products/store/products.js'\nimport * as leftovers from '@martyrs/src/modules/products/store/leftovers.js'\n\n// Router\nconst route = useRoute()\nconst router = useRouter()\n\n// Feed controls\nconst sort = ref({\n  param: 'available',\n  order: 'asc',\n  options: [\n    { label: 'Available', value: 'available' },\n    { label: 'Name', value: 'name' },\n    { label: 'Price', value: 'price' },\n    { label: 'Created', value: 'createdAt' }\n  ]\n})\n\nconst filter = reactive({\n  active: false,\n  class: '',\n  selected: { category: [], stockLevel: [] },\n  options: [\n    { title: 'Categories', value: 'category', options: [] },\n    {\n      title: 'Stock Level',\n      value: 'stockLevel',\n      options: [\n        { label: 'Low', value: 'low' },\n        { label: 'Medium', value: 'medium' },\n        { label: 'High', value: 'high' }\n      ]\n    }\n  ]\n})\n\n// Column definitions + visibility, combined into one\nconst columns = reactive([\n  { key: 'name',     label: 'Product Name', component: true, visible: true },\n  { key: 'category', label: 'Categories',   component: true, visible: true },\n  { key: 'supplier', label: 'Supplier',     visible: true },\n  { key: 'available',label: 'Available',    component: true, visible: true },\n  { key: 'price',    label: 'Unit Price',   component: true, visible: true },\n  { key: 'actions',  label: '',             component: true, visible: true }\n])\n\n// Modal & selection state\nconst showAuditModal    = ref(false)\nconst showReorderModal  = ref(false)\nconst showHistoryModal  = ref(false)\nconst showSettingsModal = ref(false)\nconst selectedProduct   = ref(null)\n\n// Handlers\nfunction openStockAudit(row) {\n  selectedProduct.value = row\n  showAuditModal.value = true\n}\nfunction openReorderSettings(row = null) {\n  selectedProduct.value = row\n  showReorderModal.value = true\n}\nfunction openStockHistory(row) {\n  selectedProduct.value = row\n  showHistoryModal.value = true\n}\nfunction openViewSettings() {\n  showSettingsModal.value = true\n}\nasync function handleAuditSave(audit) {\n  try {\n    await leftovers.actions.create({\n      organization: route.params._id,\n      type: audit.discrepancy > 0 ? 'stock-in' : 'stock-out',\n      comment: audit.note,\n      positions: [{\n        _id: selectedProduct.value._id,\n        name: selectedProduct.value.name,\n        quantity: Math.abs(audit.discrepancy),\n        price: selectedProduct.value.price || 0,\n        type: 'pcs'\n      }],\n      creator: {\n        type: 'user',\n        target: window.auth?.state?.user?._id\n      },\n      owner: {\n        type: 'organization',\n        target: route.params._id\n      }\n    })\n    showAuditModal.value = false\n  } catch (err) {\n    console.error(err)\n  }\n}\nasync function handleReorderSave(settings) {\n  alert(`Reorder threshold set to ${settings.threshold} for ${selectedProduct.value?.name || 'all products'}`)\n  showReorderModal.value = false\n}\nfunction handleColumnsUpdate(updated) {\n  leftovers.mutations.updateColumnSettings(updated)\n  showSettingsModal.value = false\n}\n</script>\n\n<style>\n.bg-orange {\n  background-color: rgb(var(--orange));\n}\n</style>\n"],"names":["useRoute","useRouter","ref","reactive","leftovers.actions","leftovers.mutations"],"mappings":"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"}