{"version":3,"file":"useInitE1TaxCalculate-Cz559V_2.js","sources":["../../../../Coloplast.UI/src/shared/components/basket/discountCode.vue","../../../../Coloplast.UI/src/shared/composables/useInitE1TaxCalculate.ts"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { useStore } from \"vuex\";\r\nimport { DsIconButton, DsButton } from \"@coloplast/design-system\";\r\nimport { FormKit } from '@formkit/vue';\r\nimport { computed, ref, watch } from \"vue\";\r\nimport { type AxiosError } from \"axios\";\r\n\r\nexport interface Props {\r\n\tlabels: {\r\n\t\tcouponAppliedHeaderLabel: string;\r\n\t\tcouponHeaderLabel: string;\r\n\t\tcouponValidationErrorMessage: string;\r\n\t\tapplyCouponButtonLabel: string;\r\n\t\taccessibility: {\r\n\t\t\tapplyCouponCode: string;\r\n\t\t\tremoveCouponCode: string;\r\n\t\t}\r\n\t}\r\n}\r\n\r\nconst props = defineProps<Props>();\r\n\r\nconst store = useStore();\r\n\r\nconst errorMessage = ref('');\r\nconst couponName = computed<string>({\r\n\tget: () => store.getters.getDiscountCode.couponName,\r\n\tset: (val) => {\r\n\t\tstore.commit('setDiscountCode', {\r\n\t\t\tcouponName: val,\r\n\t\t});\r\n\t}\r\n});\r\n\r\nconst culture = computed(() => store.getters.getCulture);\r\nconst basket = computed(() => store.getters.getBasket);\r\n/**\r\n * `isCouponApplied` in basket response is currently true only for order discount.\r\n * That's why need to use `appliedCouponCode` to determine if user applied code in this component.\r\n * It ensures that item level discount coupon can be removed and user cannot use multiple codes.\r\n */\r\nconst isCouponApplied = computed<boolean>(() => !!basket.value.appliedCouponCode);\r\nconst inputLabel = computed<string>(() => {\r\n\treturn isCouponApplied.value\r\n\t\t? props.labels.couponAppliedHeaderLabel\r\n\t\t: props.labels.couponHeaderLabel;\r\n});\r\n\r\nconst inputErrors = computed<string[]>(() => {\r\n\treturn errorMessage.value ? [errorMessage.value] : [];\r\n});\r\n\r\nconst isApplyButtonDisabled = computed<boolean>(() => couponName.value === '');\r\n\r\nfunction handleInput(val: string) {\r\n\tcouponName.value = val;\r\n\terrorMessage.value = '';\r\n}\r\n\r\nasync function handleSubmit() {\r\n\terrorMessage.value = '';\r\n\r\n\tconst payload = {\r\n\t\tlanguage: culture.value,\r\n\t\tCouponCode: couponName.value.toUpperCase(),\r\n\t};\r\n\ttry {\r\n\t\tconst response = await store.dispatch('applyCouponBasket', payload);\r\n\t\tif(!response.data && response.status !== 200) {\r\n\t\t\tthrow new Error();\r\n\t\t}\r\n\t}\r\n\tcatch (error) {\r\n\t\terrorMessage.value = (error as AxiosError)?.response?.data || props.labels.couponValidationErrorMessage;\r\n\t}\r\n}\r\n\r\nasync function removeCouponCode() {\r\n\terrorMessage.value = '';\r\n\r\n\tconst payload = {\r\n\t\tlanguage: culture.value,\r\n\t\tCouponCode: couponName.value,\r\n\t};\r\n\ttry {\r\n\t\tawait store.dispatch('removeCouponBasket', payload);\r\n\t}\r\n\tcatch(error) {\r\n\t\tconst message = (error as AxiosError)?.response?.data;\r\n\t\tif (message) {\r\n\t\t\terrorMessage.value = message;\r\n\t\t}\r\n\t}\r\n}\r\n\r\nwatch(() => basket.value.appliedCouponCode, () => {\r\n\tcouponName.value = basket.value.appliedCouponCode || '';\r\n\terrorMessage.value = '';\r\n}, {\r\n\timmediate: true,\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<FormKit\r\n\t\ttype=\"form\"\r\n\t\t:actions=\"false\"\r\n\t\t:classes=\"{\r\n\t\t\tform: {\r\n\t\t\t\t'c-discount-code': true,\r\n\t\t\t\t'c-discount-code--applied': isCouponApplied,\r\n\t\t\t}\r\n\t\t}\"\r\n\t\t@submit=\"handleSubmit\"\r\n\t>\r\n\t\t<FormKit\r\n\t\t\t:model-value=\"couponName\"\r\n\t\t\ttype=\"text\"\r\n\t\t\t:label=\"inputLabel\"\r\n\t\t\tautocomplete=\"off\"\r\n\t\t\t:readonly=\"isCouponApplied\"\r\n\t\t\t:classes=\"{\r\n\t\t\t\touter: 'c-discount-code__textfield',\r\n\t\t\t}\"\r\n\t\t\t:errors=\"inputErrors\"\r\n\t\t\tdata-testid=\"discount-code-input\"\r\n\t\t\t@input=\"handleInput\"\r\n\t\t/>\r\n\t\t<div class=\"c-discount-code__actions\">\r\n\t\t\t<DsIconButton\r\n\t\t\t\tv-if=\"isCouponApplied\"\r\n\t\t\t\tvariant=\"ghost-neutral\"\r\n\t\t\t\ticon-name=\"delete\"\r\n\t\t\t\t:ariaLabel=\"labels.accessibility.removeCouponCode\"\r\n\t\t\t\t@click.prevent=\"removeCouponCode\"\r\n\t\t\t\tdata-testid=\"discount-code-remove\"\r\n\t\t\t/>\r\n\t\t\t<template v-else>\r\n\t\t\t\t<DsButton\r\n\t\t\t\t\tv-if=\"labels.applyCouponButtonLabel\"\r\n\t\t\t\t\ttype=\"submit\"\r\n\t\t\t\t\tvariant=\"tertiary\"\r\n\t\t\t\t\t:disabled=\"isApplyButtonDisabled\"\r\n\t\t\t\t\tdata-testid=\"discount-code-check-discount\"\r\n\t\t\t\t>\r\n\t\t\t\t\t{{ labels.applyCouponButtonLabel }}\r\n\t\t\t\t</DsButton>\r\n\t\t\t\t<DsIconButton\r\n\t\t\t\t\tv-else\r\n\t\t\t\t\ttype=\"submit\"\r\n\t\t\t\t\tvariant=\"primary\"\r\n\t\t\t\t\ticon-name=\"navigate-forward\"\r\n\t\t\t\t\t:ariaLabel=\"labels.accessibility.applyCouponCode\"\r\n\t\t\t\t\t:disabled=\"isApplyButtonDisabled\"\r\n\t\t\t\t\tdata-testid=\"discount-code-check-discount\"\r\n\t\t\t\t/>\r\n\t\t\t</template>\r\n\t\t</div>\r\n\t</FormKit>\r\n</template>\r\n","import { computed, watch } from \"vue\";\r\nimport { useStore } from \"vuex\"\r\n\r\nexport const useInitE1TaxCalculate = () => {\r\n\tconst store = useStore();\r\n\tconst basket = computed(() => store.getters.getBasket);\r\n\tconst isBasketSet = computed(() => store.getters.getIsBasketSet);\r\n\tconst e1TaxCalculate = computed(() => store.getters.getE1TaxCalculate);\r\n\r\n\t/**\r\n\t * Is supposed to be called in the root of the app that is always mounted on page\r\n\t * so that watcher remains active. It can be called in multiple apps - only one watcher will be set.\r\n\t */\r\n\tconst setE1TaxCalculateWatcher = () => {\r\n\t\t// we only need one global watcher set\r\n\t\tif (e1TaxCalculate.value.isCalculateWatcherInited) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\twatch(basket, () => {\r\n\t\t\tif (isBasketSet.value) {\r\n\t\t\t\tstore.dispatch('updateE1Tax');\r\n\t\t\t}\r\n\t\t}, {\r\n\t\t\timmediate: true,\r\n\t\t});\r\n\r\n\t\tstore.commit('setE1TaxCalculate', {\r\n\t\t\tisCalculateWatcherInited: true,\r\n\t\t});\r\n\t}\r\n\treturn {\r\n\t\tsetE1TaxCalculateWatcher\r\n\t};\r\n}"],"names":["props","__props","store","useStore","errorMessage","ref","couponName","computed","val","culture","basket","isCouponApplied","inputLabel","inputErrors","isApplyButtonDisabled","handleInput","handleSubmit","payload","response","error","_a","removeCouponCode","message","watch","useInitE1TaxCalculate","isBasketSet","e1TaxCalculate"],"mappings":"sXAoBA,MAAMA,EAAQC,EAERC,EAAQC,IAERC,EAAeC,EAAI,EAAE,EACrBC,EAAaC,EAAiB,CACnC,IAAK,IAAML,EAAM,QAAQ,gBAAgB,WACzC,IAAMM,GAAQ,CACbN,EAAM,OAAO,kBAAmB,CAC/B,WAAYM,CAAA,CACZ,CACF,CAAA,CACA,EAEKC,EAAUF,EAAS,IAAML,EAAM,QAAQ,UAAU,EACjDQ,EAASH,EAAS,IAAML,EAAM,QAAQ,SAAS,EAM/CS,EAAkBJ,EAAkB,IAAM,CAAC,CAACG,EAAO,MAAM,iBAAiB,EAC1EE,EAAaL,EAAiB,IAC5BI,EAAgB,MACpBX,EAAM,OAAO,yBACbA,EAAM,OAAO,iBAChB,EAEKa,EAAcN,EAAmB,IAC/BH,EAAa,MAAQ,CAACA,EAAa,KAAK,EAAI,CAAA,CACnD,EAEKU,EAAwBP,EAAkB,IAAMD,EAAW,QAAU,EAAE,EAE7E,SAASS,EAAYP,EAAa,CACjCF,EAAW,MAAQE,EACnBJ,EAAa,MAAQ,EACtB,CAEA,eAAeY,GAAe,OAC7BZ,EAAa,MAAQ,GAErB,MAAMa,EAAU,CACf,SAAUR,EAAQ,MAClB,WAAYH,EAAW,MAAM,YAAY,CAAA,EAEtC,GAAA,CACH,MAAMY,EAAW,MAAMhB,EAAM,SAAS,oBAAqBe,CAAO,EAClE,GAAG,CAACC,EAAS,MAAQA,EAAS,SAAW,IACxC,MAAM,IAAI,YAGLC,EAAO,CACbf,EAAa,QAASgB,EAAAD,GAAA,YAAAA,EAAsB,WAAtB,YAAAC,EAAgC,OAAQpB,EAAM,OAAO,4BAC5E,CACD,CAEA,eAAeqB,GAAmB,OACjCjB,EAAa,MAAQ,GAErB,MAAMa,EAAU,CACf,SAAUR,EAAQ,MAClB,WAAYH,EAAW,KAAA,EAEpB,GAAA,CACG,MAAAJ,EAAM,SAAS,qBAAsBe,CAAO,QAE7CE,EAAO,CACN,MAAAG,GAAWF,EAAAD,GAAA,YAAAA,EAAsB,WAAtB,YAAAC,EAAgC,KAC7CE,IACHlB,EAAa,MAAQkB,EAEvB,CACD,CAEA,OAAAC,EAAM,IAAMb,EAAO,MAAM,kBAAmB,IAAM,CACtCJ,EAAA,MAAQI,EAAO,MAAM,mBAAqB,GACrDN,EAAa,MAAQ,EAAA,EACnB,CACF,UAAW,EAAA,CACX,mmCCjGYoB,EAAwB,IAAM,CAC1C,MAAMtB,EAAQC,IACRO,EAASH,EAAS,IAAML,EAAM,QAAQ,SAAS,EAC/CuB,EAAclB,EAAS,IAAML,EAAM,QAAQ,cAAc,EACzDwB,EAAiBnB,EAAS,IAAML,EAAM,QAAQ,iBAAiB,EAwB9D,MAAA,CACN,yBAnBgC,IAAM,CAElCwB,EAAe,MAAM,2BAIzBH,EAAMb,EAAQ,IAAM,CACfe,EAAY,OACfvB,EAAM,SAAS,aAAa,CAC7B,EACE,CACF,UAAW,EAAA,CACX,EAEDA,EAAM,OAAO,oBAAqB,CACjC,yBAA0B,EAAA,CAC1B,EAAA,CAGD,CAEF"}