@ozdao/prometheus-framework 0.2.30 → 0.2.32

package/src/modules/products/components/blocks/ImagesThumbnails.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="product-images">
-    <div class="no-responsive cols-4 thumbnails">
+    <div class="no-responsive cols-4 gap-thin">
       <img
         v-for="(image, index) in images"
         :key="index"
@@ -11,7 +11,7 @@
     </div>
     <Popup @close-popup="closePopup" :isPopupOpen="isPopupVisible" class="radius-medium o-hidden">
       <Magnifier 
-        :imageSrc="path + images[selectedimageIndex]"
+        :imageSrc="(FILE_SERVER_URL || '') + images[selectedimageIndex]"
         class="magnifier z-index-4"
       />
     </Popup>
@@ -53,11 +53,6 @@ const closePopup = () => {
   flex-direction: column;
 }
 
-.thumbnails {
-  display: flex;
-  gap: 10px;
-}
-
 .thumbnail {
   width: 100%;
   max-width: 8rem;

package/src/modules/products/components/blocks/ListPositions.vue

@@ -0,0 +1,74 @@
+<template>
+  <div>
+    <ul 
+      class="flex-column flex-wrap"
+    >
+      <span 
+        v-if="order.positions.length === 0" 
+        class="w-100"
+      >
+        No positions added yet
+      </span> 
+
+      <li 
+        v-for="(product, index) in order.positions" 
+        :key="product._id" 
+        class="w-100 gap-small flex-stretch flex-center flex-nowrap flex"
+      >
+        <span 
+          class="flex-v-center flex radius-medium pd-small bg-white w-100"
+        >
+          {{ product.name }}
+        </span>
+
+        <CardPosition
+          :products='[]'
+          :product='product'
+          @add="deleteProduct(index)"
+        />
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue';
+import { useRouter, useRoute } from 'vue-router';
+
+import Field from '@pf/src/components/Field/Field.vue';
+ import CardPosition from '@pf/src/modules/products/components/blocks/CardPosition.vue';
+
+import * as leftovers from '@pf/src/modules/products/store/leftovers';
+
+const router = useRouter();
+const route = useRoute();
+
+const props = defineProps({
+  order: Object
+});
+
+function deleteProduct(index) {
+  leftovers.actions.deleteItemFromLeftover(props.order.positions[index]);
+}
+</script>
+  
+
+<style lang="scss" >
+.vue-select {
+  background: #f7f7f7;
+  border-radius: 0.5rem;
+  border: 0;
+  height: 3rem;
+    padding-left: 1rem;
+   
+    z-index: 4;
+  .vue-input {
+    input { 
+       font-size: 1.125rem;
+    font-weight: 300;
+      background: #f7f7f7; }
+  }
+}
+</style>
+
+

package/src/modules/products/components/elements/Price.vue

@@ -1,9 +1,16 @@
 <template>
-	<div class="price-tag radius-small">
+	<div 
+    class="price-tag radius-small"
+    :class="
+      { 
+        'bg-main': !product.sale, 
+        'bg-third-small': product.sale,
+      }
+    " 
+  >
     <p 
       :class="
-        {
-          't-main': product.sale, 
+        { 
           'h4': !size, 
           'h5 t-semi pd-thin': size === 'small',
           'h3 t-semi pd-small': size === 'big'
@@ -12,7 +19,7 @@
     >
       {{product.price }} {{returnCurrency()}} 
     </p>
-    <p v-if="product.sale"  class="t-transp t-main p-medium line-through price">{{(product.price / 100) * (100 + product.sale) }} {{returnCurrency()}} </p>
+    <p v-if="product.sale"  class="pd-r-small t-transp t-transp p-medium line-through price">{{(product.price / 100) * (100 + product.sale) }} {{returnCurrency()}} </p>
   </div>
 </template>
 
@@ -51,7 +58,6 @@ const props = defineProps({
   display: flex;
   align-items: center;
   width: fit-content;
-  background: #00ff88;
   color: black;
 }
 

package/src/modules/products/components/elements/THC.vue

@@ -4,16 +4,16 @@
     <p class="t-white h6">THC</p>
     <!-- Polygon bg -->
     <svg v-if="Number(product.information[1].value) >= 18" width="60" height="66" viewBox="0 0 60 66" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path fill="#FF0000" stroke="white" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
+      <path fill="#FF0000" stroke="rgb(var(--white))" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
     </svg>
     <svg v-if="Number(product.information[1].value) <= 18 && Number(product.information[1].value) >= 14" width="60" height="66" viewBox="0 0 60 66" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path fill="#FF0099" stroke="white" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
+      <path fill="#FF0099" stroke="rgb(var(--white))" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
     </svg>
     <svg v-if="Number(product.information[1].value) <= 14 && Number(product.information[1].value) >= 10" width="60" height="66" viewBox="0 0 60 66" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path fill="#EB00FF" stroke="white" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
+      <path fill="#EB00FF" stroke="rgb(var(--white))" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
     </svg>
     <svg v-if="Number(product.information[1].value) <= 10" width="60" height="66" viewBox="0 0 60 66" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path fill="#00FF29" stroke="white" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
+      <path fill="#00FF29" stroke="rgb(var(--white))" stroke-width="3" d="M26 3.3094C28.4752 1.88034 31.5248 1.88034 34 3.3094L53.7128 14.6906C56.188 16.1197 57.7128 18.7607 57.7128 21.6188V44.3812C57.7128 47.2393 56.188 49.8803 53.7128 51.3094L34 62.6906C31.5248 64.1197 28.4752 64.1197 26 62.6906L6.28719 51.3094C3.81198 49.8803 2.28719 47.2393 2.28719 44.3812V21.6188C2.28719 18.7607 3.81198 16.1197 6.28719 14.6906L26 3.3094Z" />
     </svg>
   </div>
 </template>
@@ -49,8 +49,8 @@ const props = defineProps({
 .thc {
   position: absolute;
 
-  right: 0%;
-  top: 0%;
+  right: 1rem;
+  top: 1rem;
 
   display: flex;
   flex-direction: column;

package/src/modules/products/components/pages/{LeftoverAdd.vue → EditLeftover.vue}

@@ -1,90 +1,106 @@
 <template>
-   <header class="mn-b-medium flex-v-center flex-nowrap flex">
-    <h2 class="mn-r-medium">Inventory</h2>
-    <!-- <button 
-      @click="$router.push({
-        name: 'LeftoverAdd'
-      })" 
-      class="radius-100p i-big hover-scale-1 cursor-pointer t-white bg-second">
-        +
-    </button> -->
+  <header class="mn-b-medium gap-small flex-v-center flex-nowrap flex">
+    <h2 class="">{{route.params.leftover ? 'Edit ' : 'Add ' }} Inventory</h2>
+
+    <Select 
+      v-model:select="leftovers.state.current.type" 
+      :options="[
+        'stock-in',
+        'stock-out',
+        'write-off'
+      ]"
+      :placeholder="'Select type'"
+      class="bg-main t-black w-max pd-small t-semi p-big uppercase radius-small"
+    />
   </header>
-  
-  <h5 class="mn-b-small">Select Type</h5>
-
-  <Select 
-    v-model:select="leftovers.state.current.type" 
-    :options="[
-      'stock-in',
-      'stock-out',
-      'write-off'
-    ]"
-    :placeholder="'Select type'"
-    class="mn-b-semi bg-grey pd-medium radius-small"
-  />
 
-
-  <h5 class="mn-b-small">Add Position</h5>
-
-  <div class="mn-b-semi gap-thin flex-nowrap flex">
+  <Block
+    title="Add Position"
+    class="mn-b-semi"
+  >
     <CardPosition 
-      @add="addProduct"
+      @add="(item) => globals.actions.add(
+        leftovers.state.current.positions,
+        item 
+      )"
       :products="Products"
     />
-  </div>
-
-
-  <h5 
-    class="mn-b-small"
-  >
-    Invetory Sheet
-    <a 
-      class="mn-l-thin t-main" 
-      @click="resetOrderList"
-    >
-      Reset
-    </a>
-  </h5>
-
+  </Block>
 
-
-  <LeftoverPositions 
-    :order="leftovers.state.current" 
-    :products="Products" 
+  <Block
+    title="Invetory Sheet"
+    placeholder="No positions added yet"
     class="mn-b-semi"
-  />
-
-  <section class="gap-thin flex-v-center flex-nojustify flex">
-    <h3 class="mn-r-auto">
-      In total: {{formatPrice(totalPrice)}}
-    </h3>
-    <a 
-      @click="onSubmit()" 
-      class="bg-main button"
-    >
-      Save
-    </a> 
-    <a 
-      v-if="route.params._id" 
-      @click="onDelete()" 
-      class="t-white bg-red button"
-    >
-      Delete
-    </a>
-  </section>
+  >
+    <CardPosition 
+      v-for="(product, index) in leftovers.state.current.positions" 
+      :key="product._id" 
+      :product="product"
+      :array="leftovers.state.current.positions"
+      :products="Products"
+      @add="(item) => globals.actions.add(
+        leftovers.state.current.positions,
+        item 
+      )"
+      @update="(item) => globals.actions.update(
+        leftovers.state.current.positions,
+        item,
+        index
+      )"
+      @delete="(item) => globals.actions.delete(
+        leftovers.state.current.positions,
+        item,
+        index
+      )"
+    />
+  </Block>
+ 
+  <Block class="">
+    <section class="gap-thin flex-v-center flex-nojustify flex">
+      
+      <h3 class="mn-r-auto">
+        In total: {{formatPrice(totalPrice)}}
+      </h3>
+
+      <a 
+        @click="onSubmit()" 
+        class="bg-main button"
+      >
+        Save
+      </a> 
+
+      <a 
+        class="t-white bg-second button"
+        @click="onReset()"
+      >
+        Reset
+      </a>
+
+      <a 
+        v-if="route.params.leftover" 
+        @click="onDelete()" 
+        class="t-white bg-red button"
+      >
+        Delete
+      </a>
+    </section>
+  </Block>
 </template>
 
 
 <script setup>
+  import Block from '@pf/src/components/Block/Block.vue';
+
   import Field from '@pf/src/components/Field/Field.vue';
   import Select from '@pf/src/components/Select/Select.vue';
   import SelectMulti from '@pf/src/components/SelectMulti/SelectMulti.vue';
 
-  import LeftoverPositions from '@pf/src/modules/products/components/blocks/LeftoverPositions.vue'
   import CardPosition from '@pf/src/modules/products/components/blocks/CardPosition.vue';
+
   import { computed, onMounted, ref, reactive } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
  
+  import * as globals from '@pf/src/modules/globals/store/globals';
   import * as leftovers from '@pf/src/modules/products/store/leftovers';
   import * as products from '@pf/src/modules/products/store/products';
 
@@ -92,6 +108,7 @@
   const router = useRouter();
   
   const Products = ref(products.state.all); // Обновите это значение соответствующим образом
+  const productNew = ref(null);
 
   const totalPrice = computed(() => {
     return leftovers.state.current.positions.reduce((sum, position) => {
@@ -100,9 +117,9 @@
   });
 
   onMounted(async () => {
-    if (route.params._id) {
+    if (route.params.leftover) {
       try {
-        await leftovers.actions.fetch(route.params._id);
+        await leftovers.actions.fetch(route.params.leftover);
       } catch (error) {
         console.error('error');
       }
@@ -112,7 +129,8 @@
 
     try {
       const productsResponse = await products.actions.read({
-        organization: '65141c476cf9860013b49f6d'
+        organization: route.params._id,
+        limit: 100
       });
       Products.value = productsResponse;
     } catch (error) {
@@ -120,20 +138,16 @@
     }
   });
 
-  function resetOrderList() {
-    if (route.params._id) {
-      leftovers.actions.fetch(route.params._id);
+  function onReset() {
+    if (route.params.leftover) {
+      leftovers.actions.fetch(route.params.leftover);
     } else {
       leftovers.state.current = { type: "", order: "", positions: [] };
     }
   }
 
-  function addProduct(product) {
-    leftovers.actions.addProductToLeftover(product);
-  }
-
   function onSubmit() {
-    if (route.params._id) {
+    if (route.params.leftover) {
       leftovers.actions.update(leftovers.state.current).then(
         () => router.push({ name: 'Backoffice Leftovers' }),
         (error) => console.error('error')
@@ -147,7 +161,7 @@
   }
 
   function onDelete() {
-    leftovers.actions.delete(route.params._id).then(
+    leftovers.actions.delete(route.params.leftover).then(
       () => router.push({ name: 'Backoffice Leftovers' }),
       (error) => console.error('error')
     );

package/src/modules/products/components/pages/Leftovers.vue

@@ -1,74 +1,78 @@
 <template>
-  <header class="mn-b-medium flex-v-center flex-nowrap flex">
-    <h2 class="mn-r-medium">Inventory</h2>
-    <button 
-      @click="$router.push({
-        name: 'LeftoverAdd'
-      })" 
-      class="radius-100p i-big hover-scale-1 cursor-pointer t-white bg-second">
-        +
-    </button>
-  </header>
-  
-  <section class="mn-b-semi pd-medium bg-grey radius-big">
-    <p class="mn-b-thin">Spended:</p>
-    <h3>{{formatPrice(totalPrice)}}</h3>
-  </section>
-
-  <!-- <h3>Low Stock</h3>
-
-  <section class="mn-b-semi pd-medium bg-grey radius-big">
-    <div>
-      Name: Code Red
-      Left: 3
-      <button>add</button>
-    </div>
-    <div>
-      Name: Code Red
-      Left: 3
-      <button>add</button>
-    </div>
-    <div>
-      Name: Code Red
-      Left: 3
-      <button>add</button>
-    </div>
-  </section> -->
-
-  <Tab 
-    v-model:selected="tab"
-    :tabs="[
-      { name: 'All',        value: 'all' },
-      { name: 'Stock-In',   value: 'stock-in' },
-      { name: 'Stock-Out',  value: 'stock-out' }, 
-      { name: 'Write-Off',  value: 'write-off' }, 
-    ]"
-    class="mn-b-small o-hidden h5 radius-big bg-grey"
-  />
-
-  <Feed
-    :states="{
-      empty: {
-        title: 'No Leftovers Found',
-        description: 'Currently, there are no leftovers available.'
-      }
-    }"
-    :store="{
-      read: (options) => leftovers.actions.read(options)
-    }"
-    :options="{
-      limit: 15,
-      // user: user
-    }"
-    v-slot="{ 
-      items 
-    }"
-  >
-    <CardLeftover 
-      v-for="leftover in items" 
-      :leftover="leftover"
+  <div class="pd-thin">
+    <header class="mn-b-medium flex-v-center flex-nowrap flex">
+      <h2 class="mn-r-medium">Inventory</h2>
+      <button 
+        @click="$router.push({
+          name: 'LeftoverAdd'
+        })" 
+        class="radius-100 i-big hover-scale-1 cursor-pointer t-white bg-second">
+          +
+      </button>
+    </header>
+    
+    <section class="mn-b-semi pd-medium bg-grey radius-big">
+      <p class="mn-b-thin">Spended:</p>
+      <h3>{{formatPrice(totalPrice)}}</h3>
+    </section>
+
+    <!-- <h3>Low Stock</h3>
+
+    <section class="mn-b-semi pd-medium bg-grey radius-big">
+      <div>
+        Name: Code Red
+        Left: 3
+        <button>add</button>
+      </div>
+      <div>
+        Name: Code Red
+        Left: 3
+        <button>add</button>
+      </div>
+      <div>
+        Name: Code Red
+        Left: 3
+        <button>add</button>
+      </div>
+    </section> -->
+
+    <Tab 
+      v-model:selected="tab"
+      :tabs="[
+        { name: 'All',        value: 'all' },
+        { name: 'Stock-In',   value: 'stock-in' },
+        { name: 'Stock-Out',  value: 'stock-out' }, 
+        { name: 'Write-Off',  value: 'write-off' }, 
+      ]"
+      class="mn-b-small o-hidden h5 radius-big bg-grey"
     />
-  </Feed>
+
+    <Feed
+      :states="{
+        empty: {
+          title: 'No Leftovers Found',
+          description: 'Currently, there are no leftovers available.'
+        }
+      }"
+      :store="{
+        read: (options) => leftovers.actions.read(options)
+      }"
+      :options="{
+        limit: 15,
+        organization: route.params._id
+        // user: user
+      }"
+      v-slot="{ 
+        items 
+      }"
+    >
+      <CardLeftover 
+        v-for="leftover in items" 
+        :leftover="leftover"
+        class="bg-grey pd-small radius-big"
+      />
+    </Feed>
+  </div>
 </template>
 
 
@@ -77,7 +81,7 @@
   import { useRoute, useRouter } from 'vue-router'
 
   import Tab      from '@pf/src/components/Tab/Tab.vue'
-  import Feed from '@pf/src/modules/globals/components/sections/Feed.vue'
+  import Feed from '@pf/src/components/Feed/Feed.vue'
   import CardLeftover from '../blocks/CardLeftover.vue'
 
   import * as leftovers from '@pf/src/modules/products/store/leftovers' // Убедитесь, что путь к вашему файлу стора верный

package/src/modules/products/components/pages/Product.vue

@@ -1,12 +1,9 @@
 <template>
-	<div>
-		<Breadcrumbs class="section"/>
-
-		<SectionProduct :product="product" class="section"/>
+	<div class="flex flex-column w-100 o-hidden gap-thin pd-thin">
+		<!-- <Breadcrumbs class="bg-grey radius-big pd-small"/> -->
+		<SectionProduct v-if="product" :product="product" class="pos-relative"/>
 
 		<PopularProducts />
-		<!-- Partials (need to remove) -->
-    <Footer/>
 	</div>
 </template>
 
@@ -32,7 +29,7 @@
 	const route = useRoute()
 	const router = useRouter()
 
-	await products.actions.read({ _id: route.params.product });
+	await products.actions.fetchProduct(route.params.product);
 
 	route.meta.title.en = products.state.current.name
 	route.meta.title.ru = products.state.current.name