flowrix 1.0.1-beta.147 → 1.0.1-beta.149

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (192) hide show
  1. package/dist/module.json +1 -1
  2. package/dist/runtime/components/SampleProductCard.d.vue.ts +13 -0
  3. package/dist/runtime/components/SampleProductCard.vue +362 -0
  4. package/dist/runtime/components/SampleProductCard.vue.d.ts +13 -0
  5. package/dist/runtime/components/WishList/dropdown.d.vue.ts +9 -0
  6. package/dist/runtime/components/WishList/dropdown.vue +417 -0
  7. package/dist/runtime/components/WishList/dropdown.vue.d.ts +9 -0
  8. package/dist/runtime/components/WishList/modal.d.vue.ts +13 -0
  9. package/dist/runtime/components/WishList/modal.vue +229 -0
  10. package/dist/runtime/components/WishList/modal.vue.d.ts +13 -0
  11. package/dist/runtime/components/product/AddToCart.d.vue.ts +15 -0
  12. package/dist/runtime/components/product/AddToCart.vue +176 -0
  13. package/dist/runtime/components/product/AddToCart.vue.d.ts +15 -0
  14. package/dist/runtime/components/product/AddtoCartSample.d.vue.ts +6 -0
  15. package/dist/runtime/components/product/AddtoCartSample.vue +110 -0
  16. package/dist/runtime/components/product/AddtoCartSample.vue.d.ts +6 -0
  17. package/dist/runtime/components/product/Badges.d.vue.ts +13 -0
  18. package/dist/runtime/components/product/Badges.vue +84 -0
  19. package/dist/runtime/components/product/Badges.vue.d.ts +13 -0
  20. package/dist/runtime/components/product/Description.d.vue.ts +9 -0
  21. package/dist/runtime/components/product/Description.vue +96 -0
  22. package/dist/runtime/components/product/Description.vue.d.ts +9 -0
  23. package/dist/runtime/components/product/Dynamic.d.vue.ts +9 -0
  24. package/dist/runtime/components/product/Dynamic.vue +136 -0
  25. package/dist/runtime/components/product/Dynamic.vue.d.ts +9 -0
  26. package/dist/runtime/components/product/Gallery.d.vue.ts +11 -0
  27. package/dist/runtime/components/product/Gallery.vue +133 -0
  28. package/dist/runtime/components/product/Gallery.vue.d.ts +11 -0
  29. package/dist/runtime/components/product/PopUpCart.d.vue.ts +11 -0
  30. package/dist/runtime/components/product/PopUpCart.vue +155 -0
  31. package/dist/runtime/components/product/PopUpCart.vue.d.ts +11 -0
  32. package/dist/runtime/components/product/ProductInfo.d.vue.ts +7 -0
  33. package/dist/runtime/components/product/ProductInfo.vue +105 -0
  34. package/dist/runtime/components/product/ProductInfo.vue.d.ts +7 -0
  35. package/dist/runtime/components/product/RequiredPopUp.d.vue.ts +9 -0
  36. package/dist/runtime/components/product/RequiredPopUp.vue +57 -0
  37. package/dist/runtime/components/product/RequiredPopUp.vue.d.ts +9 -0
  38. package/dist/runtime/components/product/bundleProduct/Bundle.d.vue.ts +13 -0
  39. package/dist/runtime/components/product/bundleProduct/Bundle.vue +35 -0
  40. package/dist/runtime/components/product/bundleProduct/Bundle.vue.d.ts +13 -0
  41. package/dist/runtime/components/product/bundleProduct/index.d.vue.ts +8 -0
  42. package/dist/runtime/components/product/bundleProduct/index.vue +32 -0
  43. package/dist/runtime/components/product/bundleProduct/index.vue.d.ts +8 -0
  44. package/dist/runtime/components/product/customProduct/AddtoCartSample.d.vue.ts +6 -0
  45. package/dist/runtime/components/product/customProduct/AddtoCartSample.vue +101 -0
  46. package/dist/runtime/components/product/customProduct/AddtoCartSample.vue.d.ts +6 -0
  47. package/dist/runtime/components/product/customProduct/Attributes.d.vue.ts +9 -0
  48. package/dist/runtime/components/product/customProduct/Attributes.vue +12 -0
  49. package/dist/runtime/components/product/customProduct/Attributes.vue.d.ts +9 -0
  50. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/drop-down.d.vue.ts +13 -0
  51. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/drop-down.vue +11 -0
  52. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/drop-down.vue.d.ts +13 -0
  53. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-collection.d.vue.ts +3 -0
  54. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-collection.vue +253 -0
  55. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-collection.vue.d.ts +3 -0
  56. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-colors.d.vue.ts +3 -0
  57. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-colors.vue +253 -0
  58. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-colors.vue.d.ts +3 -0
  59. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-values.d.vue.ts +3 -0
  60. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-values.vue +214 -0
  61. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/multi-values.vue.d.ts +3 -0
  62. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/style.d.vue.ts +13 -0
  63. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/style.vue +9 -0
  64. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/style.vue.d.ts +13 -0
  65. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/swatch.d.vue.ts +13 -0
  66. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/swatch.vue +9 -0
  67. package/dist/runtime/components/product/customProduct/AttributesComponents/AttributeType/swatch.vue.d.ts +13 -0
  68. package/dist/runtime/components/product/customProduct/AttributesComponents/PopupContent/Popup.d.vue.ts +9 -0
  69. package/dist/runtime/components/product/customProduct/AttributesComponents/PopupContent/Popup.vue +133 -0
  70. package/dist/runtime/components/product/customProduct/AttributesComponents/PopupContent/Popup.vue.d.ts +9 -0
  71. package/dist/runtime/components/product/customProduct/AttributesComponents/SingleAttribute.d.vue.ts +11 -0
  72. package/dist/runtime/components/product/customProduct/AttributesComponents/SingleAttribute.vue +35 -0
  73. package/dist/runtime/components/product/customProduct/AttributesComponents/SingleAttribute.vue.d.ts +11 -0
  74. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/SingleSlide.d.vue.ts +13 -0
  75. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/SingleSlide.vue +134 -0
  76. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/SingleSlide.vue.d.ts +13 -0
  77. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/SingleSlidemagnifier.d.vue.ts +15 -0
  78. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/SingleSlidemagnifier.vue +138 -0
  79. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/SingleSlidemagnifier.vue.d.ts +15 -0
  80. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/button.d.vue.ts +11 -0
  81. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/button.vue +149 -0
  82. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/button.vue.d.ts +11 -0
  83. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/dropdown.d.vue.ts +11 -0
  84. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/dropdown.vue +82 -0
  85. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/dropdown.vue.d.ts +11 -0
  86. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/dropdownWithIcon.d.vue.ts +11 -0
  87. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/dropdownWithIcon.vue +108 -0
  88. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/dropdownWithIcon.vue.d.ts +11 -0
  89. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/height.d.vue.ts +11 -0
  90. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/height.vue +104 -0
  91. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/height.vue.d.ts +11 -0
  92. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/imageBox.d.vue.ts +11 -0
  93. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/imageBox.vue +87 -0
  94. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/imageBox.vue.d.ts +11 -0
  95. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/imageBoxWithMagnifier.d.vue.ts +11 -0
  96. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/imageBoxWithMagnifier.vue +219 -0
  97. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/imageBoxWithMagnifier.vue.d.ts +11 -0
  98. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/message.d.vue.ts +11 -0
  99. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/message.vue +36 -0
  100. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/message.vue.d.ts +11 -0
  101. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/number.d.vue.ts +11 -0
  102. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/number.vue +45 -0
  103. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/number.vue.d.ts +11 -0
  104. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/orderSample/button.d.vue.ts +13 -0
  105. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/orderSample/button.vue +48 -0
  106. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/orderSample/button.vue.d.ts +13 -0
  107. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/radio.d.vue.ts +11 -0
  108. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/radio.vue +154 -0
  109. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/radio.vue.d.ts +11 -0
  110. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/slider.d.vue.ts +11 -0
  111. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/slider.vue +111 -0
  112. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/slider.vue.d.ts +11 -0
  113. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/sliderWithMagnifier.d.vue.ts +11 -0
  114. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/sliderWithMagnifier.vue +269 -0
  115. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/sliderWithMagnifier.vue.d.ts +11 -0
  116. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/subheight.d.vue.ts +11 -0
  117. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/subheight.vue +63 -0
  118. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/subheight.vue.d.ts +11 -0
  119. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/subwidth.d.vue.ts +11 -0
  120. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/subwidth.vue +63 -0
  121. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/subwidth.vue.d.ts +11 -0
  122. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/swatch.d.vue.ts +11 -0
  123. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/swatch.vue +220 -0
  124. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/swatch.vue.d.ts +11 -0
  125. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/text.d.vue.ts +11 -0
  126. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/text.vue +47 -0
  127. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/text.vue.d.ts +11 -0
  128. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/width.d.vue.ts +11 -0
  129. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/width.vue +91 -0
  130. package/dist/runtime/components/product/customProduct/AttributesComponents/Styles/width.vue.d.ts +11 -0
  131. package/dist/runtime/components/product/customProduct/ConfirmPopup.d.vue.ts +9 -0
  132. package/dist/runtime/components/product/customProduct/ConfirmPopup.vue +25 -0
  133. package/dist/runtime/components/product/customProduct/ConfirmPopup.vue.d.ts +9 -0
  134. package/dist/runtime/components/product/customProduct/RequiredPopUp.d.vue.ts +9 -0
  135. package/dist/runtime/components/product/customProduct/RequiredPopUp.vue +49 -0
  136. package/dist/runtime/components/product/customProduct/RequiredPopUp.vue.d.ts +9 -0
  137. package/dist/runtime/components/product/customProduct/Reviews.d.vue.ts +7 -0
  138. package/dist/runtime/components/product/customProduct/Reviews.vue +25 -0
  139. package/dist/runtime/components/product/customProduct/Reviews.vue.d.ts +7 -0
  140. package/dist/runtime/components/product/customProduct/SingleStep.d.vue.ts +11 -0
  141. package/dist/runtime/components/product/customProduct/SingleStep.vue +11 -0
  142. package/dist/runtime/components/product/customProduct/SingleStep.vue.d.ts +11 -0
  143. package/dist/runtime/components/product/customProduct/Steps.d.vue.ts +9 -0
  144. package/dist/runtime/components/product/customProduct/Steps.vue +221 -0
  145. package/dist/runtime/components/product/customProduct/Steps.vue.d.ts +9 -0
  146. package/dist/runtime/components/product/customProduct/index.d.vue.ts +9 -0
  147. package/dist/runtime/components/product/customProduct/index.vue +272 -0
  148. package/dist/runtime/components/product/customProduct/index.vue.d.ts +9 -0
  149. package/dist/runtime/components/product/index.d.vue.ts +8 -0
  150. package/dist/runtime/components/product/index.vue +90 -0
  151. package/dist/runtime/components/product/index.vue.d.ts +8 -0
  152. package/dist/runtime/components/product/sampleProduct/ProductVariation.d.vue.ts +11 -0
  153. package/dist/runtime/components/product/sampleProduct/ProductVariation.vue +61 -0
  154. package/dist/runtime/components/product/sampleProduct/ProductVariation.vue.d.ts +11 -0
  155. package/dist/runtime/components/product/sampleProduct/SampleDetails.d.vue.ts +7 -0
  156. package/dist/runtime/components/product/sampleProduct/SampleDetails.vue +74 -0
  157. package/dist/runtime/components/product/sampleProduct/SampleDetails.vue.d.ts +7 -0
  158. package/dist/runtime/components/product/sampleProduct/SampleFeatures.d.vue.ts +9 -0
  159. package/dist/runtime/components/product/sampleProduct/SampleFeatures.vue +63 -0
  160. package/dist/runtime/components/product/sampleProduct/SampleFeatures.vue.d.ts +9 -0
  161. package/dist/runtime/components/product/sampleProduct/index.d.vue.ts +8 -0
  162. package/dist/runtime/components/product/sampleProduct/index.vue +64 -0
  163. package/dist/runtime/components/product/sampleProduct/index.vue.d.ts +8 -0
  164. package/dist/runtime/components/product/simpleProduct/ProductVariation.d.vue.ts +11 -0
  165. package/dist/runtime/components/product/simpleProduct/ProductVariation.vue +61 -0
  166. package/dist/runtime/components/product/simpleProduct/ProductVariation.vue.d.ts +11 -0
  167. package/dist/runtime/components/product/simpleProduct/index.d.vue.ts +8 -0
  168. package/dist/runtime/components/product/simpleProduct/index.vue +34 -0
  169. package/dist/runtime/components/product/simpleProduct/index.vue.d.ts +8 -0
  170. package/dist/runtime/composables/Product/CustomProductDynamic/useAttributeTypeDynamic.d.ts +3 -0
  171. package/dist/runtime/composables/Product/CustomProductDynamic/useAttributeTypeDynamic.js +20 -0
  172. package/dist/runtime/composables/Product/CustomProductDynamic/useAttributesDynamic.d.ts +70 -0
  173. package/dist/runtime/composables/Product/CustomProductDynamic/useAttributesDynamic.js +63 -0
  174. package/dist/runtime/composables/Product/CustomProductDynamic/useCustomProductDynamic.d.ts +74 -0
  175. package/dist/runtime/composables/Product/CustomProductDynamic/useCustomProductDynamic.js +107 -0
  176. package/dist/runtime/composables/Product/CustomProductDynamic/useCustomeScriptDynamic.d.ts +159 -0
  177. package/dist/runtime/composables/Product/CustomProductDynamic/useCustomeScriptDynamic.js +2079 -0
  178. package/dist/runtime/composables/Product/CustomProductDynamic/useSingleAttributeDynamic.d.ts +4 -0
  179. package/dist/runtime/composables/Product/CustomProductDynamic/useSingleAttributeDynamic.js +27 -0
  180. package/dist/runtime/composables/Product/CustomProductDynamic/useSingleStepDynamic.d.ts +68 -0
  181. package/dist/runtime/composables/Product/CustomProductDynamic/useSingleStepDynamic.js +21 -0
  182. package/dist/runtime/composables/Product/CustomProductDynamic/useSingleValueDynamic.d.ts +67 -0
  183. package/dist/runtime/composables/Product/CustomProductDynamic/useSingleValueDynamic.js +15 -0
  184. package/dist/runtime/composables/Product/CustomProductDynamic/useStepsDynamic.d.ts +88 -0
  185. package/dist/runtime/composables/Product/CustomProductDynamic/useStepsDynamic.js +72 -0
  186. package/dist/runtime/composables/index.d.ts +8 -0
  187. package/dist/runtime/composables/index.js +8 -0
  188. package/dist/runtime/pages/flowrix-default.vue +15 -6
  189. package/dist/runtime/plugins/bootstrap.client.d.ts +2 -0
  190. package/dist/runtime/plugins/bootstrap.client.js +9 -0
  191. package/dist/runtime/server/api/cart/related.js +15 -2
  192. package/package.json +1 -1
@@ -0,0 +1,134 @@
1
+ <script setup>
2
+ const { attribute, slide, group } = defineProps({ "attribute": Object, "slide": Object, "group": Object });
3
+ const SelecteValue = ref(0);
4
+ const CustomScript = useCustomeScriptDynamic();
5
+ const SelectedItem = attribute.values.find((i) => i.selected === true);
6
+ if (SelectedItem) {
7
+ SelecteValue.value = SelectedItem.id;
8
+ }
9
+ const ChangeValue = ((value) => {
10
+ const aid = attribute.id;
11
+ const gid = group.id;
12
+ const vid = value;
13
+ CustomScript.SelectedOptions = { aid, gid, vid };
14
+ CustomScript.initprocess();
15
+ if (attribute.typeLabel == "swatch") {
16
+ }
17
+ if (attribute.typeLabel == "style") {
18
+ }
19
+ });
20
+ const checkInCart = ((sample) => {
21
+ let cartItems = useCartStore().cart.items;
22
+ if (cartItems) {
23
+ for (const key in cartItems) {
24
+ if (cartItems[key].slug === sample) {
25
+ return true;
26
+ }
27
+ }
28
+ }
29
+ return false;
30
+ });
31
+ const addToCartSample = (async (sample) => {
32
+ await useCartStore().addToCart(sample, 1);
33
+ });
34
+ const removeFromCart = async (sample) => {
35
+ let productId = "";
36
+ let cartItems = useCartStore().cart.items;
37
+ if (cartItems) {
38
+ for (const key in cartItems) {
39
+ if (cartItems[key].slug === sample.slug) {
40
+ productId = cartItems[key].rowId;
41
+ }
42
+ }
43
+ }
44
+ await useCartStore().removeFromCart(productId, sample);
45
+ };
46
+ const swatchimagesSrcset = ((swatchImage) => {
47
+ let swatchImage64 = swatchImage.replace(/.webp/gi, "64.webp");
48
+ let swatchImage150 = swatchImage.replace(/.webp/gi, "150.webp");
49
+ let swatchImage320 = swatchImage.replace(/.webp/gi, "320.webp");
50
+ let swatchImage640 = swatchImage.replace(/.webp/gi, "640.webp");
51
+ let swatchImage1024 = swatchImage.replace(/.webp/gi, "1024.webp");
52
+ return swatchImage150;
53
+ });
54
+ </script>
55
+
56
+ <template>
57
+ <div class="value-item position-relative">
58
+ <input :data-label="attribute.title" class="position-absolute top-0 left-0 w-100 h-100" v-model="SelecteValue"
59
+ :required="attribute.required" @change="ChangeValue(slide.id)" :data-attributevalue="attribute.parent"
60
+ :data-child="slide.parent" :value="slide.id" :data-value="slide.id" type="radio"
61
+ :name="`attribute_id[${attribute.id}]`" :id="`attribute_${attribute.id}_value${slide.id}`" />
62
+ <label class="value-label border h-100" :for="`attribute_${attribute.id}_value${slide.id}`">
63
+ <div class="image-container">
64
+ <img loading="lazy" :src="swatchimagesSrcset(slide.swatch)" width="100%" />
65
+ </div>
66
+ <span class="slide-title">{{ slide.title }}</span>
67
+ <span v-if="attribute.offer_sample == true && slide.sampleproduct != ''" class="sample-button">
68
+ <div v-if="checkInCart(slide.sampleproduct) == false"
69
+ @click="addToCartSample({ slug: slide.sampleproduct })" class="btn btn-sm">Add Sample</div>
70
+ <div v-else @click="removeFromCart({ slug: slide.sampleproduct })" class="btn btn-sm btn-primary">Remove
71
+ Sample</div>
72
+ </span>
73
+ </label>
74
+ </div>
75
+ </template>
76
+
77
+ <style scoped>
78
+ .value-item {
79
+ width: 100%;
80
+ height: 100%;
81
+ }
82
+ .value-item input {
83
+ opacity: 0;
84
+ z-index: -1;
85
+ }
86
+ .value-item input:checked ~ label {
87
+ border-color: var(--bs-secondary) !important;
88
+ border-width: 2px !important;
89
+ }
90
+ .value-item input:checked ~ label .slide-title {
91
+ font-weight: bold;
92
+ }
93
+ .value-item label {
94
+ border-width: 2px !important;
95
+ display: flex;
96
+ cursor: pointer;
97
+ text-align: center;
98
+ align-items: center;
99
+ flex-direction: column;
100
+ justify-content: flex-start;
101
+ background-color: #f5f7fb;
102
+ border-radius: 8px;
103
+ padding: 5px;
104
+ }
105
+ .value-item label .image-container {
106
+ position: relative;
107
+ min-height: 68px;
108
+ width: 100%;
109
+ overflow: hidden;
110
+ background: #fff;
111
+ border: 1px solid #C8C8C8;
112
+ border-radius: 5px;
113
+ }
114
+ .value-item label .image-container img {
115
+ top: 0;
116
+ left: 0;
117
+ width: 100%;
118
+ height: 100%;
119
+ object-fit: fill;
120
+ object-position: top left;
121
+ position: relative;
122
+ }
123
+ .value-item label .slide-title {
124
+ padding: 5px 0;
125
+ font-weight: 500;
126
+ font-size: 14px;
127
+ }
128
+ .value-item label .sample-button {
129
+ padding: 5px 0;
130
+ }
131
+ .value-item label:hover {
132
+ box-shadow: rgb(238, 238, 238) 0px 0px 3px 3px;
133
+ }
134
+ </style>
@@ -0,0 +1,13 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $props: Partial<typeof __VLS_props>;
5
+ attribute?: Record<string, any> | undefined;
6
+ group?: Record<string, any> | undefined;
7
+ slide?: Record<string, any> | undefined;
8
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
9
+ declare const __VLS_props: {
10
+ readonly attribute?: Record<string, any> | undefined;
11
+ readonly group?: Record<string, any> | undefined;
12
+ readonly slide?: Record<string, any> | undefined;
13
+ };
@@ -0,0 +1,15 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $emit: typeof emit;
5
+ $props: Partial<typeof __VLS_props>;
6
+ attribute?: Record<string, any> | undefined;
7
+ group?: Record<string, any> | undefined;
8
+ slide?: Record<string, any> | undefined;
9
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
10
+ declare const emit: (event: "popupOpen", ...args: any[]) => void;
11
+ declare const __VLS_props: {
12
+ readonly attribute?: Record<string, any> | undefined;
13
+ readonly group?: Record<string, any> | undefined;
14
+ readonly slide?: Record<string, any> | undefined;
15
+ };
@@ -0,0 +1,138 @@
1
+ <script setup>
2
+ import orderSample from "./orderSample/button.vue";
3
+ const { attribute, slide, group } = defineProps({ "attribute": Object, "slide": Object, "group": Object });
4
+ const CustomScript = useCustomeScriptDynamic();
5
+ const emit = defineEmits(["popupOpen"]);
6
+ const SelecteValue = ref(0);
7
+ const SelectedItem = attribute.values.find((i) => i.selected === true);
8
+ if (SelectedItem) {
9
+ SelecteValue.value = SelectedItem.id;
10
+ }
11
+ const ChangeValue = ((value) => {
12
+ const aid = attribute.id;
13
+ const gid = group.id;
14
+ const vid = value;
15
+ CustomScript.SelectedOptions = { aid, gid, vid };
16
+ CustomScript.initprocess();
17
+ if (attribute.typeLabel == "swatch") {
18
+ }
19
+ if (attribute.typeLabel == "style") {
20
+ }
21
+ });
22
+ const showColorLargeImage = ((index) => {
23
+ emit("popupOpen", index, slide.parent);
24
+ });
25
+ const swatchimagesSrcset = ((swatchImage) => {
26
+ let swatchImage64 = swatchImage.replace(/.webp/gi, "64.webp");
27
+ let swatchImage150 = swatchImage.replace(/.webp/gi, "150.webp");
28
+ let swatchImage320 = swatchImage.replace(/.webp/gi, "320.webp");
29
+ let swatchImage640 = swatchImage.replace(/.webp/gi, "640.webp");
30
+ let swatchImage1024 = swatchImage.replace(/.webp/gi, "1024.webp");
31
+ return swatchImage150;
32
+ });
33
+ </script>
34
+
35
+ <template>
36
+ <div class="value-item position-relative">
37
+ <input
38
+ class="position-absolute top-0 left-0 w-100 h-100"
39
+ :data-label="attribute.title" v-model="SelecteValue"
40
+ @change="ChangeValue(slide.id)"
41
+ :data-attributevalue="attribute.parent"
42
+ :data-child="slide.parent"
43
+ :required="attribute.required"
44
+ :data-validation="attribute.validation_message"
45
+ :value="slide.id"
46
+ :data-value="slide.id"
47
+ type="radio"
48
+ :name="`attribute_id[${attribute.id}]`"
49
+ :id="`attribute_${attribute.id}_value${slide.id}`"/>
50
+ <label class="value-label border h-100" :for="`attribute_${attribute.id}_value${slide.id}`">
51
+ <div class="image-container">
52
+ <svg xmlns="http://www.w3.org/2000/svg" @click="showColorLargeImage(item.id, item.parent)" class="p-1 icon-for-large d-none d-md-block" width="25" height="25" viewBox="0 0 512 512"><path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7l126.6 126.7c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0s208 93.1 208 208M208 352a144 144 0 1 0 0-288a144 144 0 1 0 0 288"/></svg>
53
+ <img loading="lazy" v-if="swatchimagesSrcset(slide.swatch)" :src="slide.swatch" width="100%"/>
54
+ <div class="slide-iconcolor" v-else-if="slide.iconcolor" :style="`background-color:${slide.iconcolor}`"></div>
55
+ </div>
56
+ <span>{{ slide.title }}</span>
57
+ <orderSample :attribute="attribute" :item="slide" :group="group"/>
58
+ </label>
59
+ </div>
60
+ </template>
61
+
62
+ <style scoped>
63
+ .slide-iconcolor {
64
+ height: 100%;
65
+ }
66
+
67
+ .modal-dialog {
68
+ opacity: 0;
69
+ transition-duration: 20000ms;
70
+ }
71
+ .modal-dialog .modal-content {
72
+ position: relative;
73
+ }
74
+ .modal-dialog .modal-content .btn-close {
75
+ background-color: var(--bs-white);
76
+ position: absolute;
77
+ right: -20px;
78
+ top: -20px;
79
+ z-index: 2;
80
+ }
81
+
82
+ .colorspopup {
83
+ position: fixed;
84
+ width: 100%;
85
+ height: 100%;
86
+ top: 0;
87
+ left: 0;
88
+ z-index: 99999;
89
+ display: flex;
90
+ background-color: rgba(0, 0, 0, 0.5019607843);
91
+ }
92
+ .colorspopup.active .modal-dialog {
93
+ opacity: 1;
94
+ }
95
+
96
+ .colors-images {
97
+ position: relative;
98
+ padding: 10px;
99
+ background: #fff;
100
+ border-radius: 20px;
101
+ }
102
+ .colors-images .colors-image {
103
+ display: none;
104
+ border-radius: 20px;
105
+ overflow: hidden;
106
+ }
107
+ .colors-images .colors-image img {
108
+ border: 1px solid #ccc;
109
+ width: 450px;
110
+ height: 450px;
111
+ }
112
+ .colors-images .colors-image:first-child {
113
+ display: block;
114
+ }
115
+
116
+ .colorImagesNav {
117
+ position: absolute;
118
+ width: 100%;
119
+ display: flex;
120
+ justify-content: space-between;
121
+ height: 50px;
122
+ font-size: 38px;
123
+ line-height: 1;
124
+ top: calc(50% - 25px);
125
+ }
126
+ .colorImagesNav button {
127
+ background-color: #fff;
128
+ border: 0;
129
+ color: var(--iseek-primary);
130
+ }
131
+ .colorImagesNav button:hover {
132
+ background-color: var(--iseek-secondary);
133
+ }
134
+ </style>
135
+
136
+ <style scoped>
137
+ .value-item{height:100%;width:100%}.value-item input{opacity:0;z-index:-1}.value-item input:checked~label{border-color:var(--iseek-primary)!important;border-width:2px!important}.value-item label{align-items:center;border-width:2px!important;cursor:pointer;display:flex;flex-direction:column;font-size:12px;font-weight:700;justify-content:flex-start;padding:5px;text-align:center}.value-item label .image-container{height:90px;overflow:hidden;position:relative;width:100%}.value-item label .image-container img{height:100%;left:0;-o-object-fit:fill;object-fit:fill;-o-object-position:top left;object-position:top left;position:relative;top:0;width:100%}.value-item label span{padding:5px 0}.value-item label:hover{box-shadow:0 0 3px 3px #eee}.value-item label .icon-for-large{align-items:center;background-color:#fff;display:flex;height:20px;justify-content:center;line-height:1;position:absolute;right:0;top:0;width:20px;z-index:1}
138
+ </style>
@@ -0,0 +1,15 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $emit: typeof emit;
5
+ $props: Partial<typeof __VLS_props>;
6
+ attribute?: Record<string, any> | undefined;
7
+ group?: Record<string, any> | undefined;
8
+ slide?: Record<string, any> | undefined;
9
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
10
+ declare const emit: (event: "popupOpen", ...args: any[]) => void;
11
+ declare const __VLS_props: {
12
+ readonly attribute?: Record<string, any> | undefined;
13
+ readonly group?: Record<string, any> | undefined;
14
+ readonly slide?: Record<string, any> | undefined;
15
+ };
@@ -0,0 +1,11 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $props: Partial<typeof props>;
5
+ attribute?: Record<string, any> | undefined;
6
+ group?: Record<string, any> | undefined;
7
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
8
+ declare const props: {
9
+ readonly attribute?: Record<string, any> | undefined;
10
+ readonly group?: Record<string, any> | undefined;
11
+ };
@@ -0,0 +1,149 @@
1
+ <script setup>
2
+ import { defineProps, ref, onMounted, nextTick, watch } from "vue";
3
+ import contentPopup from "../PopupContent/Popup.vue";
4
+ const CustomScript = useCustomeScriptDynamic();
5
+ const props = defineProps({ "attribute": Object, "group": Object });
6
+ const { script } = useSingleValue(props.attribute);
7
+ const selectedOption = ref(null);
8
+ const containerRef = ref(null);
9
+ const getselectedOption = props.attribute.values.find((item) => item.selected === true);
10
+ if (getselectedOption) {
11
+ selectedOption.value = getselectedOption.id;
12
+ }
13
+ const ChangeValue = ((value) => {
14
+ const aid = props.attribute.id;
15
+ const gid = props.group.id;
16
+ const vid = value;
17
+ CustomScript.SelectedOptions = { aid, gid, vid };
18
+ CustomScript.initprocess();
19
+ nextTick(() => {
20
+ hideDisabledColumns();
21
+ });
22
+ });
23
+ const hideDisabledColumns = () => {
24
+ if (!containerRef.value) return;
25
+ const cols = containerRef.value.querySelectorAll(".col-6");
26
+ cols.forEach((col) => {
27
+ const valueItem = col.querySelector(".value-item");
28
+ if (valueItem) {
29
+ const displayStyle = window.getComputedStyle(valueItem).display;
30
+ if (displayStyle === "none") {
31
+ col.classList.add("d-none");
32
+ } else {
33
+ col.classList.remove("d-none");
34
+ }
35
+ }
36
+ });
37
+ };
38
+ onMounted(() => {
39
+ nextTick(() => {
40
+ hideDisabledColumns();
41
+ const observer = new MutationObserver(() => {
42
+ hideDisabledColumns();
43
+ });
44
+ if (containerRef.value) {
45
+ observer.observe(containerRef.value, {
46
+ attributes: true,
47
+ childList: true,
48
+ subtree: true,
49
+ attributeFilter: ["style", "disabled"]
50
+ });
51
+ }
52
+ });
53
+ });
54
+ </script>
55
+
56
+ <template>
57
+ <div class="button-attribute-wrapper button-style-1 row">
58
+ <div class="col-md-4 px-0">
59
+ <label class="attribute-label">
60
+ {{ attribute.title }}
61
+ <span v-if="attribute.required" class="text-danger">*</span>
62
+ <contentPopup :attribute="attribute" />
63
+ </label>
64
+ </div>
65
+ <div class="col-md-8" ref="containerRef">
66
+ <div class="row g-2">
67
+ <div class="col-6" v-for="item in attribute.values" :key="item.id">
68
+ <div class="value-item position-relative h-100">
69
+ <input
70
+ class="buttonInput position-absolute w-100 h-100"
71
+ :data-label="attribute.title"
72
+ :required="attribute.required"
73
+ v-model="selectedOption"
74
+ @change="ChangeValue(item.id)"
75
+ :data-attributevalue="attribute.parent"
76
+ :data-child="item.parent"
77
+ :value="item.id"
78
+ :data-value="item.id"
79
+ type="radio"
80
+ :name="`button_attribute_${attribute.id}`"
81
+ :id="`button_attr_${attribute.id}_${item.id}`"
82
+ :checked="selectedOption === item.id"
83
+ />
84
+ <label
85
+ class="value-label d-flex align-items-center justify-content-start gap-1 px-3 py-2 rounded border"
86
+ :for="`button_attr_${attribute.id}_${item.id}`">
87
+ <div class="d-flex align-items-center justify-content-center">
88
+ <img v-if="item.swatch && item.swatch != ''"
89
+ :src="item.swatch"
90
+ width="28"
91
+ height="28"
92
+ class="button-img object-fit-contain" />
93
+ <div v-else-if="item.iconcolor && item.iconcolor != '#ffffff'"
94
+ :style="{ backgroundColor: item.iconcolor }"
95
+ class="valueIcon">
96
+ </div>
97
+ </div>
98
+ <span class="value-title text-center text-truncate">{{ item.title }}</span>
99
+ </label>
100
+ </div>
101
+ </div>
102
+ </div>
103
+ </div>
104
+ </div>
105
+ </template>
106
+
107
+ <style scoped>
108
+ input {
109
+ z-index: -1;
110
+ }
111
+
112
+ .valueIcon {
113
+ width: 24px;
114
+ height: 24px;
115
+ border-radius: 50%;
116
+ overflow: hidden;
117
+ }
118
+
119
+ .buttonInput {
120
+ z-index: -1;
121
+ }
122
+ .buttonInput:checked ~ .value-label {
123
+ border: 1px solid var(--bs-secondary) !important;
124
+ background-color: #F5F7FB;
125
+ }
126
+ .buttonInput:checked ~ .value-label img {
127
+ background-color: #fff !important;
128
+ }
129
+ .buttonInput:checked ~ .value-label .value-title {
130
+ font-weight: bold;
131
+ }
132
+
133
+ .value-label {
134
+ cursor: pointer;
135
+ white-space: nowrap;
136
+ font-size: 14px !important;
137
+ border: 1px solid #C8C8C8;
138
+ background-color: #F5F7FB;
139
+ }
140
+ .value-label .value-title {
141
+ font-weight: normal;
142
+ }
143
+ .value-label:hover {
144
+ border: 1px solid var(--bs-secondary) !important;
145
+ }
146
+ .value-label:hover img {
147
+ background-color: #fff;
148
+ }
149
+ </style>
@@ -0,0 +1,11 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $props: Partial<typeof props>;
5
+ attribute?: Record<string, any> | undefined;
6
+ group?: Record<string, any> | undefined;
7
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
8
+ declare const props: {
9
+ readonly attribute?: Record<string, any> | undefined;
10
+ readonly group?: Record<string, any> | undefined;
11
+ };
@@ -0,0 +1,11 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $props: Partial<typeof props>;
5
+ attribute?: Record<string, any> | undefined;
6
+ group?: Record<string, any> | undefined;
7
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
8
+ declare const props: {
9
+ readonly attribute?: Record<string, any> | undefined;
10
+ readonly group?: Record<string, any> | undefined;
11
+ };
@@ -0,0 +1,82 @@
1
+ <script setup>
2
+ import { defineProps, ref, defineAsyncComponent } from "vue";
3
+ import contentPopup from "../PopupContent/Popup.vue";
4
+ const CustomScript = useCustomeScriptDynamic();
5
+ const props = defineProps({ "attribute": Object, "group": Object });
6
+ const { script } = useSingleValue(props.attribute);
7
+ const options = ref(props.attribute.values);
8
+ const selectedOption = ref(options.value[0]);
9
+ const isOpen = ref(false);
10
+ const toggleDropdown = () => {
11
+ isOpen.value = !isOpen.value;
12
+ };
13
+ const selectOption = (option) => {
14
+ selectedOption.value = option;
15
+ isOpen.value = false;
16
+ };
17
+ const closeDropDown = () => {
18
+ isOpen.value = false;
19
+ };
20
+ const ChangeValue = ((value) => {
21
+ const aid = props.attribute.id;
22
+ const gid = props.group.id;
23
+ const vid = value;
24
+ CustomScript.SelectedOptions = { aid, gid, vid };
25
+ CustomScript.initprocess();
26
+ });
27
+ </script>
28
+
29
+ <template>
30
+ <div class="dropdown-attribute-wrapper dropdown-style-1 row">
31
+ <div class="col-md-4">
32
+ <label class="attribute-label mt-lg-2">
33
+ {{ attribute.title }}
34
+ <span v-if="attribute.required" class="text-danger">*</span>
35
+ <contentPopup :attribute="attribute" />
36
+ </label>
37
+ </div>
38
+ <div class="col-md-8">
39
+ <div class="dropdown-select position-relative" @mouseleave="closeDropDown()">
40
+ <!-- Selected value display -->
41
+ <div class="selected position-relative rounded-2 ps-2" @click="toggleDropdown">
42
+ <input
43
+ class="dropdownInput position-absolute w-100 h-100"
44
+ :value="selectedOption.id"
45
+ :required="attribute.required"
46
+ type="radio"
47
+ :name="`dropdown_attribute_${attribute.id}`"
48
+ :id="`dropdown_selected_${attribute.id}`"
49
+ :checked="selectedOption.id === selectedOption.id"
50
+ />
51
+ <span class="selected-title">{{ selectedOption.title || 'Select Option' }}</span>
52
+ </div>
53
+
54
+ <!-- Dropdown options -->
55
+ <ul v-show="isOpen" class="dropdown-options position-absolute list-unstyled">
56
+ <li
57
+ v-for="option in options"
58
+ :key="option.id"
59
+ @click="selectOption(option), ChangeValue(option.id)"
60
+ class="option-item position-relative"
61
+ :class="{ 'is-selected': option.id === selectedOption.id }"
62
+ >
63
+ <input
64
+ :data-label="attribute.title"
65
+ :required="attribute.required"
66
+ class="dropdownOptionInput position-absolute w-100 h-100"
67
+ :data-attributevalue="attribute.parent"
68
+ :data-child="option.parent"
69
+ :value="option.id"
70
+ :data-value="option.id"
71
+ type="radio"
72
+ :name="`dropdown_attribute_option_${attribute.id}`"
73
+ :id="`dropdown_option_${attribute.id}_${option.id}`"
74
+ :checked="option.id === selectedOption.id"
75
+ />
76
+ <span class="option-title">{{ option.title }}</span>
77
+ </li>
78
+ </ul>
79
+ </div>
80
+ </div>
81
+ </div>
82
+ </template>
@@ -0,0 +1,11 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $props: Partial<typeof props>;
5
+ attribute?: Record<string, any> | undefined;
6
+ group?: Record<string, any> | undefined;
7
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
8
+ declare const props: {
9
+ readonly attribute?: Record<string, any> | undefined;
10
+ readonly group?: Record<string, any> | undefined;
11
+ };
@@ -0,0 +1,11 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: import("vue").DefineComponent<{}, {
4
+ $props: Partial<typeof props>;
5
+ attribute?: Record<string, any> | undefined;
6
+ group?: Record<string, any> | undefined;
7
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
8
+ declare const props: {
9
+ readonly attribute?: Record<string, any> | undefined;
10
+ readonly group?: Record<string, any> | undefined;
11
+ };