@ozdao/prometheus-framework 0.2.323 → 0.2.325

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

@@ -80,20 +80,13 @@
 				{{product.description.substring(0, 99)}}...
 			</p>
 
-			<!-- <p v-if="product.localization && product.localization.length > 1" class="mn-b-small t-transp p-small">
-				<span v-if="$i18n.locale === 'en'">{{product.localization[0].text.substring(0, 99)}}...</span>
-				<span v-if="$i18n.locale === 'ru'">{{product.localization[1].text.substring(0, 99)}}...</span>
-			</p> -->
-			
 			<div class="flex-v-center flex-nowrap flex">
 				<Price 
 					:product="product" 
 					size="small" 
 					class="mn-r-auto" 
 				/>
-
-			
-
+				
 				<button
 					v-if="user && product.listing === 'rent'"
 		      class="
@@ -102,9 +95,9 @@
 		        radius-extra pd-thin bg-main
 		      "
 		    >
-		      <svg class="i-medium" xmlns="http://www.w3.org/2000/svg" width="26" height="21" viewBox="0 0 26 21" fill="none">
-						  <path d="M8.19141 15.582C7.49414 15.582 6.95638 15.3861 6.57812 14.9941C6.19987 14.6022 5.95833 14.0622 5.85352 13.374L4.52734 4.30957H1.9502C1.68587 4.30957 1.45801 4.21387 1.2666 4.02246C1.0752 3.8265 0.979492 3.59408 0.979492 3.3252C0.979492 3.05632 1.0752 2.82617 1.2666 2.63477C1.45801 2.4388 1.68587 2.34082 1.9502 2.34082H4.91699C5.43197 2.34082 5.79655 2.44564 6.01074 2.65527C6.22493 2.86035 6.36393 3.16797 6.42773 3.57812L6.55078 4.42578H14.7471C14.7288 4.5625 14.7152 4.69922 14.7061 4.83594C14.6969 4.97266 14.6924 5.10938 14.6924 5.24609C14.6924 6.04362 14.8405 6.79102 15.1367 7.48828C15.4329 8.18555 15.8454 8.80306 16.374 9.34082C16.9072 9.87858 17.5247 10.3024 18.2266 10.6123C18.9284 10.9176 19.6826 11.0771 20.4893 11.0908L20.4209 11.248C20.2432 11.5671 20.0016 11.8132 19.6963 11.9863C19.391 12.1595 19.0127 12.2461 18.5615 12.2461H7.67188L7.80859 13.1963C7.84049 13.3831 7.90885 13.5335 8.01367 13.6475C8.11849 13.7614 8.25977 13.8184 8.4375 13.8184H18.459C18.696 13.8184 18.9056 13.8981 19.0879 14.0576C19.2702 14.2171 19.3613 14.429 19.3613 14.6934C19.3613 14.9622 19.2702 15.1787 19.0879 15.3428C18.9056 15.5023 18.696 15.582 18.459 15.582H8.19141ZM7.34375 18.4873C7.34375 18.1865 7.41667 17.9108 7.5625 17.6602C7.71289 17.4141 7.91113 17.2181 8.15723 17.0723C8.40788 16.9264 8.68359 16.8535 8.98438 16.8535C9.28516 16.8535 9.55859 16.9264 9.80469 17.0723C10.0553 17.2181 10.2536 17.4141 10.3994 17.6602C10.5452 17.9108 10.6182 18.1865 10.6182 18.4873C10.6182 18.7926 10.5452 19.0684 10.3994 19.3145C10.2536 19.5651 10.0553 19.7611 9.80469 19.9023C9.55859 20.0482 9.28516 20.1211 8.98438 20.1211C8.68359 20.1211 8.40788 20.0482 8.15723 19.9023C7.91113 19.7611 7.71289 19.5651 7.5625 19.3145C7.41667 19.0684 7.34375 18.7926 7.34375 18.4873ZM15.3555 18.4873C15.3555 18.1865 15.4284 17.9108 15.5742 17.6602C15.7246 17.4141 15.9229 17.2181 16.1689 17.0723C16.4196 16.9264 16.6953 16.8535 16.9961 16.8535C17.3014 16.8535 17.5771 16.9264 17.8232 17.0723C18.0693 17.2181 18.2653 17.4141 18.4111 17.6602C18.5615 17.9108 18.6367 18.1865 18.6367 18.4873C18.6367 18.7926 18.5615 19.0684 18.4111 19.3145C18.2653 19.5651 18.0693 19.7611 17.8232 19.9023C17.5771 20.0482 17.3014 20.1211 16.9961 20.1211C16.6953 20.1211 16.4196 20.0482 16.1689 19.9023C15.9229 19.7611 15.7246 19.5651 15.5742 19.3145C15.4284 19.0684 15.3555 18.7926 15.3555 18.4873ZM20.5439 9.82617C19.915 9.82617 19.3226 9.70768 18.7666 9.4707C18.2152 9.23372 17.7275 8.90332 17.3037 8.47949C16.8799 8.05566 16.5472 7.56803 16.3057 7.0166C16.0687 6.46061 15.9502 5.86816 15.9502 5.23926C15.9502 4.61035 16.0687 4.02018 16.3057 3.46875C16.5472 2.91732 16.8799 2.42969 17.3037 2.00586C17.7275 1.58203 18.2152 1.25163 18.7666 1.01465C19.3226 0.773112 19.915 0.652344 20.5439 0.652344C21.1729 0.652344 21.763 0.773112 22.3145 1.01465C22.8704 1.25163 23.3581 1.58203 23.7773 2.00586C24.2012 2.42513 24.5316 2.91276 24.7686 3.46875C25.0055 4.02018 25.124 4.61035 25.124 5.23926C25.124 5.86361 25.0033 6.45378 24.7617 7.00977C24.5247 7.5612 24.1943 8.04883 23.7705 8.47266C23.3467 8.89648 22.8568 9.22917 22.3008 9.4707C21.7493 9.70768 21.1637 9.82617 20.5439 9.82617ZM20.5439 8.19922C20.7445 8.19922 20.904 8.13997 21.0225 8.02148C21.141 7.89844 21.2002 7.73893 21.2002 7.54297V5.89551H22.8408C23.0368 5.89551 23.194 5.83626 23.3125 5.71777C23.4355 5.59928 23.4971 5.44206 23.4971 5.24609C23.4971 5.04557 23.4355 4.88607 23.3125 4.76758C23.194 4.64453 23.0368 4.58301 22.8408 4.58301H21.2002V2.95605C21.2002 2.75553 21.141 2.59603 21.0225 2.47754C20.904 2.35905 20.7445 2.2998 20.5439 2.2998C20.3434 2.2998 20.1839 2.36133 20.0654 2.48438C19.9469 2.60286 19.8877 2.76009 19.8877 2.95605V4.58301H18.2539C18.0534 4.58301 17.8916 4.64453 17.7686 4.76758C17.6501 4.88607 17.5908 5.04557 17.5908 5.24609C17.5908 5.44206 17.6523 5.59928 17.7754 5.71777C17.8984 5.83626 18.0579 5.89551 18.2539 5.89551H19.8877V7.54297C19.8877 7.73893 19.9469 7.89844 20.0654 8.02148C20.1839 8.13997 20.3434 8.19922 20.5439 8.19922Z" fill="white"/>
-						</svg>
+		      <IconShopcartAdd
+						class="i-medium"
+					/>
 		    </button>
 		  </div>
 		</div>
@@ -119,6 +112,7 @@
 	import { useI18n }    from 'vue-i18n'
 
 	import IconEdit from '@pf/src/modules/icons/navigation/IconEdit.vue'
+	import IconShopcartAdd from '@pf/src/modules/icons/actions/IconShopcartAdd.vue'
 
 	import THC from '@pf/src/modules/products/components/elements/THC.vue'
 	import Price from '@pf/src/modules/products/components/elements/Price.vue'

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

@@ -1,6 +1,6 @@
 <template>
-  <div class="o-scroll product-images">
-    <div class="no-responsive flex flex-nowrap gap-thin">
+  <div class="o-scroll w-100 product-images">
+    <div class="no-responsive w-max flex flex-nowrap gap-thin">
       <img loading="lazy" 
         v-for="(image, index) in images"
         :key="index"
@@ -54,8 +54,8 @@ const closePopup = () => {
 
 .thumbnail {
   width: 100%;
-  max-width: 8rem;
-  height: 8rem;
+  max-width: 6rem;
+  height: 6rem;
   object-fit: cover;
   cursor: pointer;
 }

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

@@ -1,72 +1,49 @@
 <template>
 	<div 
-      v-if="product.listing !== 'rent'"
-    class="price-tag radius-small"
-    :class="
-      { 
-        'bg-main': !product.sale, 
-        'bg-third-small': product.sale,
-      }
-    " 
+    class="radius-small"
   >
-    <p 
+    <span 
       :class="
         { 
           'h4': !size, 
-          'h5 t-semi pd-thin': size === 'small',
-          'h3 t-semi pd-small': size === 'big'
+          'h5 t-semi': size === 'small',
+          'h3 t-semi': size === 'big'
+        }
+      " 
+      class="t-second"
+    >
+      {{product.price_currency + product.price}}
+    </span>
+    
+    <span 
+      v-if="product.listing === 'rent'"
+      :class="
+        { 
+          'p-medium': !size, 
+          'p-small': size === 'small',
+          'p-big': size === 'big'
         }
       " 
+      class="p-small t-transp"
+    >
+      {{ product.listing === 'rent' ? '/ per day' : '' }} 
+    </span>
+    
+    <p 
+      v-if="product.sale"  
+      class="pd-r-small t-transp t-transp p-medium line-through price"
     >
-      {{product.price }} {{product.price_currency}} {{ product.listing === 'rent' ? 'per day' : '' }} 
+        {{(product.price / 100) * (100 + product.sale) }} {{product.price_currency}} 
     </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) }} {{product.price_currency}} </p>
-  </div>
 
-  <div
-    v-else
-    class="mn-r-auto"
-  >
-    <span class="t-second h5 "> {{product.price+product.price_currency }}</span> <span class="p-small t-transp">/ per day </span>
   </div>
 </template>
 
 <script setup="props">
-/////////////////////////////
-// COMPONENT DEPENDENCIES
-/////////////////////////////
-import { ref, } from 'vue';
-
-/////////////////////////////
-// HELPERS
-/////////////////////////////
-
-/////////////////////////////
-// CREATED
-/////////////////////////////
-
-const props = defineProps({
-  product: Object,
-  size: String
-});
-
-/////////////////////////////
-// MOUNTED
-/////////////////////////////
-</script>
-
-<style lang="scss">
-.price-tag {
-  background: #058;
-  color: #fff;
-  cursor: pointer;
-  display: inline-block;
-  position: relative;
-  text-align: center;
-  display: flex;
-  align-items: center;
-  width: fit-content;
-  color: black;
-}
+  import { ref, } from 'vue';
 
-</style>
+  const props = defineProps({
+    product: Object,
+    size: String
+  });
+</script>

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

@@ -1,7 +1,169 @@
 <template>
-	<div class="h-100 w-100 bg-white ">
+	<div class="h-100 w-100 mobile:pd-thin pd-big bg-white ">
 		<!-- <Breadcrumbs class="bg-light radius-big pd-small"/> -->
-		<SectionProduct v-if="product" :product="product" :user="auth.state.user" class="pos-relative"/>
+		<div class="cols-2-1_2 w-100 gap-medium">
+		
+			<div class="w-100 o-hidden  bg-light radius-big flex-nowrap flex-column flex pos-relative">
+				<div class="pd-semi w-100 bg-light radius-semi o-hidden">
+					<!-- PRODUCT IMAGE -->
+					<Images360
+						v-if="product && product.image3d"
+						class="h-100 w-100"
+						:imagePath="`/assets/images/products/${product.image3d}`"
+						:imageCount="36"
+					/>
+
+					<img loading="lazy" 
+						v-if="images[0] && !product.image3d"
+						class="h-max h-max-15r bg-white radius-semi w-100"
+						style="object-fit: contain;"
+						:src="(FILE_SERVER_URL || '') + images[0]"
+					/>
+
+					<PlaceholderImage
+						v-if="!images[0] && !product.image3d"
+						class="h-max-20r h-100 w-100"
+						style="object-fit: cover;"
+					/>
+
+				</div>
+
+				<ImagesThumbnails
+					v-if="images.length > 1"
+					:images="images"
+					class="pd-semi pd-t-zero"
+				/>
+			</div>
+
+			<div class="pos-relative w-100 h-100 flex-column flex-h-center flex">
+
+				<IconEdit
+					v-if="accesses && hasAccess(route.params._id, 'products', 'edit', accesses)"
+					@click="$router.push({
+						name: 'ProductEdit', 
+						params: {
+							_id: product.owner.target,
+							product: product._id
+						}
+					})" 
+					class="pos-absolute pos-t-regular pos-r-regular i-regular t-transp"
+				/>
+
+				<!-- Name -->
+				<h2 class="w-100 h1-product mn-b-small">{{ product.name }}</h2>
+
+				<Price :product="product" size="big" class="flex gap-thin flex-center pd-thin br-solid br-1px br-black-transp-10 w-max mn-b-medium" />
+
+				<!-- Price -->
+				<div v-if="product.description || product.specification" class="h-min-5r o-hidden radius-small bg-light mn-b-medium pos-relative">
+					<Tab 
+						v-model:selected="tabProduct"
+						:tabs="[
+							{name: 'Description', value: 'description'},
+							{name: 'Specifications', value: 'specifications'}
+						]"
+						tabClass="pd-thin bg-white radius-thin p-small uppercase t-medium"
+						class="gap-micro bg-light pos-relative z-index-2 pd-thin br-solid br-b br-black-transp-10"
+					/>
+					<transition name="slide-fade">
+						<div v-if="tabProduct === 'description'"  class=" pd-medium">
+							<p v-if="product.description && !product.localization < 1 && !recommendation" class="w-100 t-transp">
+								{{ product.description }}
+							</p>
+
+							<p v-if="product.localization && product.localization.length > 1 && !recommendation" class="w-100 t-transp">
+								{{ t('description') }}
+							</p>
+						</div>
+
+						<div 
+							v-else
+							class="cols-2  pd-medium w-100 gap-small"
+						>
+							<div 
+								v-if="product.information.length > 0" 
+								v-for="information in product.information" 
+								class="w-100 pd-small radius-small bg-white product-information"
+							>
+								<p class="t-demi">{{ information.name }}</p>
+								<p>{{ information.value }}</p>
+							</div>
+						</div>
+					</transition>
+				</div>
+
+							<!-- Modifications -->
+				<!-- <div v-if="product.modifications.length > 0" class="flex-nojustify  flex">
+					<SelectElement v-if="sizes2.length > 0" :elements="sizes2" :selected="product.selectedSize" class="mn-r-medium" />
+				</div> -->
+
+				<!-- Actions -->
+				<div class="w-max-33r">
+				  <button
+				    v-if="product.quantity > 0 || product.listing === 'rent'"
+				    @click="product.listing === 'rent' ? openPopup() : addToCart(product)" 
+				    class="cursor-pointer pd-small radius-big w-max mobile:w-100 bg-main button"
+				  > 
+				    <div class="gap-thin flex flex-center flex-nowrap">
+				      <IconShopcartAdd v-if="product.listing === 'rent'" class="i-semi" />
+				      <span>{{ t('addtoorder') }}</span>
+				    </div>
+				  </button>
+
+				  <div 
+				    v-else 
+				    class="flex-center flex uppercase radius-big t-black w-max pd-small t-medium bg-grey h-3r w-100 mn-r-smallbutton"
+				  >
+				    Out of Stock
+				  </div>
+				</div>
+				<!-- Shopcart Adding Popup -->
+				<Popup @close-popup="closePopup" :isPopupOpen="isPopupVisible" class="radius-medium pd-medium bg-white o-hidden">
+		      <h5 class="w-100 t-center mn-b-small">Select Rent Period</h5>
+		       <Calendar
+		      	:date="rentDate"
+		      	:allowRange="true"
+		      	class="bg-light radius-small"
+		      />
+
+		      <p class="flex flex-nowrap pd-t-small">
+		      	<span class="w-100 t-transp">$ 400 x 4 days</span>
+		      	<span class="w-100 t-right">$2000</span>
+		      </p>
+		      <p class="flex flex-nowrap pd-t-small">
+		      	<span class="w-100 t-transp">Insurance Fee</span>
+		      	<span class="w-100 t-right">$200</span>
+		      </p>
+		      <p class="flex flex-nowrap br-black-transp-10 br-solid br-b pd-b-small pd-t-small">
+		      	<span class="w-100 t-transp">VAT (20%)</span>
+		      	<span class="w-100 t-right">$300</span>
+		      </p>
+		     
+		     	<p class="p-big flex flex-nowrap pd-b-small pd-t-small">
+		      	<span class="w-100 t-medium ">In Total</span>
+		      	<span class="w-100 t-main t-medium t-right">$2500</span>
+	      	</p>
+
+	      	<Button
+				    v-if="product.quantity > 0 || product.listing === 'rent'"
+				    :submit="() => addToCart(product)" 
+				    :callback="() => closePopup()"
+				    :disabled="product.listing !== 'rent' && validateToCard(product)"
+				    :text="{
+				      success: 'Added',
+				      error: 'Error'
+				    }"
+				    class="h-3r w-100 bg-main button"
+				  > 
+				    <div class="gap-thin flex flex-center flex-nowrap">
+				      <IconShopcartAdd v-if="product.listing === 'rent'" class="i-semi" />
+				      <span>{{ t('addtoorder') }}</span>
+				    </div>
+				  </Button>
+		    </Popup>
+
+			</div>
+		</div>
 
 		<div class="h-max pos-relative">
 		  <h3 class="pd-medium pd-b-small">Most Popular</h3>
@@ -13,10 +175,25 @@
 <script setup="props">
 	// Import components
 	// import Breadcrumbs from '@pf/src/components/Breadcrumbs/Breadcrumbs.vue'
+	import Button from '@pf/src/components/Button/Button.vue'
+	import Popup from '@pf/src/components/Popup/Popup.vue'
+	import Tab from '@pf/src/components/Tab/Tab.vue'
+	import Calendar from '@pf/src/components/DatePicker/Calendar.vue'
+
+	import IconEdit from '@pf/src/modules/icons/navigation/IconEdit.vue'
+	import IconShopcartAdd from '@pf/src/modules/icons/actions/IconShopcartAdd.vue'
+
+	import PlaceholderImage from '@pf/src/modules/icons/placeholders/PlaceholderImage.vue'
+
+	import Images360 	from '@pf/src/modules/products/components/blocks/Images360.vue'
+	import ImagesThumbnails from "@pf/src/modules/products/components/blocks/ImagesThumbnails.vue";
+
+	import Price from '@pf/src/modules/products/components/elements/Price.vue'
+
 	import PopularProducts 	from '@pf/src/modules/products/components/sections/PopularProducts.vue'
 	import SectionProduct from '@pf/src/modules/products/components/sections/SectionProduct.vue'
 	// Import libs
-	import { computed, onMounted } from 'vue'
+	import { computed, ref, onMounted } from 'vue'
 	import { useRoute,useRouter } from 'vue-router'
 	import { useI18n }    from 'vue-i18n'
 	
@@ -24,32 +201,77 @@
  	import * as products from '@pf/src/modules/products/store/products';
   import * as categories from '@pf/src/modules/products/store/categories';
 
+	import * as shopcart from '@pf/src/modules/orders/store/shopcart';
+
 	// Accessing router and store
 	const route = useRoute()
 	const router = useRouter()
-
 	
 	route.meta.title.en = products.state.current.name
 	route.meta.title.ru = products.state.current.name
 
 	// Accessing state
 	const product = computed(() => products.state.current)
+	const images = computed(() => products.state.current.images)
+
+	let rentDate = ref({
+		start: null,
+		end: null
+	})
+
+
+	const tabProduct = ref('description')
 
 	const text = {
-		messages: {
-		}
-	};
+	  en: {
+	  	addtoorder: 'Add to Cart',
+	    fastorder: 'Fast Order'
+	  },
+	  ru: {
+	  	addtoorder: 'Добавить в корзину',
+	    fastorder: 'Быстрый заказ'
+	  }
+	}
+
+  const { t } = useI18n({messages: text})
 
 	onMounted(async ()=> {
 		await products.actions.read({_id: route.params.product});
-
 	})
-	
-	// products.state.current.localization.forEach(localization => {
-  	// if (localization) text.messages[localization.locale].description = localization.text
-	// })
 
-  const { t } = useI18n(text)
+	// Methods
+	function validateToCard(product) {
+	  if (product.quantity > 0) {
+	    return false
+	  }
+	  return true
+	}
+
+	const isPopupVisible = ref(false);
+
+	const openPopup = () => {
+	  isPopupVisible.value = true;
+	};
+
+	const closePopup = () => {
+	  isPopupVisible.value = false;
+	};
+
+	async function addToCart(product) {
+    try {
+      if (shopcart.state.organization !== product.owner.target) {
+        shopcart.state.organization = product.owner.target
+        shopcart.state.positions = []
+      }
+      
+      await shopcart.actions.addProductToCart(product, product.owner.target, rentDate)
+
+      return true
+    } catch (error) {
+      console.error('Ошибка при добавлении товара в корзину:', error)
+      throw error
+    }
+	}
 </script>
 
 <style lang="scss">

package/src/modules/products/components/sections/SectionProduct.vue

@@ -35,16 +35,17 @@
 
 		<div class="radius-big pos-relative w-100 h-100 flex-column flex-justify flex col">
 
-		<!-- <IconEdit
-			@click="$router.push({
-				name: 'ProductEdit', 
-				params: {
-					_id: product.organization,
-					product: product._id
-				}
-			})" 
-			class="pos-absolute pos-t-regular pos-r-regular i-regular t-transp"
-		/> -->
+			<IconEdit
+				v-if="accesses && hasAccess(route.params._id, 'products', 'edit', accesses)"
+				@click="$router.push({
+					name: 'ProductEdit', 
+					params: {
+						_id: product.owner.target,
+						product: product._id
+					}
+				})" 
+				class="pos-absolute pos-t-regular pos-r-regular i-regular t-transp"
+			/>
 
 			<h2 v-if="recommendation" class="t-main t-semi p-big">{{t('airecommend')}}</h2>
 			<!-- Name -->
@@ -99,8 +100,21 @@
 				</transition>
 			</div>
 
+			<div v-if="product.listing === 'rent'" class="mn-t-small max-w-33rem mobile-w-100 t-white gap-small cols-2">
+				<Button
+					:submit="() => { addToCart(product) } " 
+					:text="{
+						success: ' ✔ Added',
+						error: 'error'
+					}"
+					class="h-3r w-100 mn-r-small bg-main button"
+				> 
+					{{ t('addtoorder') }}
+				</Button>
+			</div>
+
 			<!-- Actions -->
-			<div v-if="product.listing !== 'rent'" class="max-w-33rem mobile-w-100 t-white gap-small cols-2">
+			<div v-else class="mn-t-small max-w-33rem mobile-w-100 t-white gap-small cols-2">
 				<Button
 					v-if="product.quantity > 0"
 					:submit="a => addToCart(product)" 
@@ -135,6 +149,8 @@ import Price from '@pf/src/modules/products/components/elements/Price.vue'
 // import SelectElement 	from '@/components/elements/SelectElement.vue'
 
 import { computed, ref } from 'vue'
+
+	import { useRoute,useRouter } from 'vue-router'
 import { useI18n }    from 'vue-i18n'
 
 import * as shopcart from '@pf/src/modules/orders/store/shopcart';
@@ -148,20 +164,27 @@ const props = defineProps({
   user: {
     type: String,
   },
+  accesses: {
+    type: Object,
+	  default: null
+  },
   recommendation: {
   	type: String
   }
 })
 
+
+
+	const route = useRoute()
+	const router = useRouter()
+
 // Computed properties
 const images = computed(() => {
   return props.product.images
 })
 
-
 const tabProduct = ref('description')
 
-
 const text = {
 	messages: {
 	  en: {
@@ -179,11 +202,7 @@ const text = {
 	}
 }
 
-// props.product.localization.forEach(localization => {
-	// if (localization) text.messages[localization.locale].description = localization.text
-// })
-
- const { t } = useI18n(text)
+const { t } = useI18n(text)
 
 // Methods
 function validateToCard(product) {
@@ -192,12 +211,18 @@ function validateToCard(product) {
   }
   return true
 }
-
-function addToCart(product) {
-	if (shopcart.state.organization !== product.organization) {
-		shopcart.state.positions = []
-		shopcart.state.organization = product.organization
-	}
-  shopcart.actions.addProductToCart(product, product.organization)
+async function addToCart(product) {
+	console.log(product)
+    try {
+        if (shopcart.state.organization !== product.owner.target) {
+            shopcart.state.organization = product.owner.target
+            shopcart.state.positions = []
+        }
+        await shopcart.actions.addProductToCart(product, product.owner.target)
+        return true // Make sure we return something
+    } catch (error) {
+        console.error('Ошибка при добавлении товара в корзину:', error)
+        throw error
+    }
 }
 </script>

package/src/modules/products/products.client.js

@@ -28,8 +28,6 @@ import EditProductInfo from './components/sections/EditProductInfo.vue';
 
 // Elements
 import Price from './components/elements/Price.vue';
-import THC from './components/elements/THC.vue';
-
 // Pages
 import Product from './components/pages/Product.vue';
 import ProductEdit from './components/pages/ProductEdit.vue';
@@ -65,7 +63,6 @@ const ModuleProducts = {
     components: {
       // Elements
       Price,
-      THC,
       // Blocks
       ImagesThumbnails,
       LeftoverPositions,
@@ -113,7 +110,6 @@ export {
   EditProductInfo,
   // Elements
   Price,
-  THC,
   // Pages
   Product,
   ProductEdit,

package/src/styles/base/all.scss

@@ -3,16 +3,12 @@
 @import './scrolling';
 @import './shadow_transitions_hover_refactor';
 
-// *[disabled] {
-// 	opacity: 0.75;
-// 	pointer-events: none;
-// 	cursor: default;
-// }
 
 .disabled {
-	opacity: 0.75;
-	pointer-events: none;
-	cursor: default;
+	opacity: 0.75  !important;
+ 	pointer-events: none  !important;
+ 	cursor: default  !important;
+ 	color: rgba(var(--black), 0.5)  !important;
 }
 
 .unactive { opacity: 0.0; }
@@ -36,15 +32,17 @@
 
 
 body { 
-	.w-auto { width: auto  !important; }
-	.w-min 	{ width: min-content  !important; }
-	.w-fit 	{ width: fit-content  !important; }
-	.w-max 	{ width: max-content  !important; }
+	.bs-black-small { box-shadow: 0px 0px 17px -3px rgba(var(--black), 0.1);  }
 	
-	.h-auto { height: auto  !important; }
-	.h-min 	{ height: min-content  !important; }
-	.h-fit 	{ height: fit-content  !important; }
-	.h-max 	{ height: max-content  !important; }
+	.w-auto { width: auto; }
+	.w-min 	{ width: min-content; }
+	.w-fit 	{ width: fit-content; }
+	.w-max 	{ width: max-content; }
+	
+	.h-auto { height: auto; }
+	.h-min 	{ height: min-content; }
+	.h-fit 	{ height: fit-content; }
+	.h-max 	{ height: max-content; }
 
 	.w-m-66r { width: min(100%, 66rem); }
 	.w-m-60r { width: min(100%, 60rem); }
@@ -111,6 +109,7 @@ body {
 	.t-transp { opacity: 0.5					}
 	.t-violet { color: violet					}
 	.t-blue { color: #0057FF; 			}
+	.t-green   { color: rgb(var(--green));;		}
 	.t-red 	{ color: rgba(var(--red), 1);; 			}
 	// WhiteSpace
 	.t-nowrap { white-space: nowrap; }