{"version":3,"mappings":"qXAIA,MAAMA,EAAeC,EAAqB,IAAMC,EAAA,WAAO,4BAAuC,2FAAC,EAWzFC,EAAQC,EAKRC,EAAYC,EAA+BH,EAAM,SAAS,EAC1DI,EAAcD,EAAI,EAAK,EAEvBE,EAAuB,IAAM,aAClC,GAAI,CAACD,EAAa,OAElB,MAAME,EAAoB,IAAI,MAAKC,GAAAC,EAAAN,EAAU,QAAV,YAAAM,EAAiB,WAAjB,YAAAD,EAA2B,SAAS,EACjEE,EAAkB,IAAI,MAAKC,GAAAC,EAAAT,EAAU,QAAV,YAAAS,EAAiB,WAAjB,YAAAD,EAA2B,OAAO,EAE7DE,EAAqB,CAC1B,IAAK,UACL,MAAO,QAGFC,EAAYP,EAAkB,eAAe,QAASM,CAAU,EAChEE,EAAUL,EAAgB,eAAe,QAASG,CAAU,EAE5DG,EAAkBC,EAAe,0BAA0B,EAC3DC,EAAiBD,EAAe,2BAA2B,EAEjE,MAAO,GAAGD,CAAe,IAAIF,CAAS,IAAII,CAAc,IAAIH,CAAO,IAGpE,OAAAI,EAAc,IAAM,eACnBhB,EAAU,MAAQF,EAAM,WAEpBQ,EAAAN,EAAU,QAAV,MAAAM,EAAiB,oBAChBG,GAAAJ,EAAAL,EAAU,QAAV,YAAAK,EAAiB,WAAjB,MAAAI,EAA2B,YAAaQ,GAAAT,EAAAR,EAAU,QAAV,YAAAQ,EAAiB,WAAjB,MAAAS,EAA2B,UACtEf,EAAY,MAAQ,IAGDC,GAAA,CACrB,EAEDe,EAAM,IAAMpB,EAAM,UAAYqB,GAAU,CACpCA,IACFnB,EAAU,MAAQmB,EAClBjB,EAAY,MAAQiB,EAAM,kBAC3B,CACA","names":["RenderAction","defineAsyncComponent","__vitePreload","props","__props","priceData","ref","hasCampaign","setCampaignDateRange","campaignStartDate","_b","_a","campaignEndDate","_d","_c","dateFormat","startDate","endDate","prependDateText","getTranslation","splitDateRange","onBeforeMount","_e","watch","value"],"sources":["../../src/components/Files/Templates/Designs/Mobler/src/components/PriceElement.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { defineAsyncComponent, onBeforeMount, ref, watch} from \"vue\";\r\nimport { getTranslation } from \"@/ts/utilities.ts\";\r\nimport { PriceAndCampaign } from '@/interfaces/PriceAndCampaignInterface.ts'\r\nconst RenderAction = defineAsyncComponent(() => import('@/components/helpers/RenderAction.vue'))\r\n\r\ninterface Props {\r\n\tpriceData: PriceAndCampaign,\r\n\tlink?: string,\r\n\thasVariants?: boolean,\r\n\ttheme: string,\r\n\tdirection?: string,\r\n\tsize?: string\r\n}\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\ttheme: 'card',\r\n\tdirection: 'vertical'\r\n})\r\n\r\nconst priceData = ref<Props['priceData'] | null>(props.priceData)\r\nconst hasCampaign = ref(false)\r\n\r\nconst setCampaignDateRange = () => {\r\n\tif (!hasCampaign) return\r\n\r\n\tconst campaignStartDate = new Date(priceData.value?.campaign?.startDate)\r\n\tconst campaignEndDate = new Date(priceData.value?.campaign?.endDate)\r\n\r\n\tconst dateFormat: object = {\r\n\t\tday: 'numeric',\r\n\t\tmonth: 'long',\r\n\t}\r\n\r\n\tconst startDate = campaignStartDate.toLocaleString('da-DK', dateFormat)\r\n\tconst endDate = campaignEndDate.toLocaleString('da-DK', dateFormat)\r\n\r\n\tconst prependDateText = getTranslation('Campaign.BeforeDate.Text')\r\n\tconst splitDateRange = getTranslation('Campaign.BeforeDate.Text2')\r\n\r\n\treturn `${prependDateText} ${startDate} ${splitDateRange} ${endDate}`\r\n}\r\n\r\nonBeforeMount(() => {\r\n\tpriceData.value = props.priceData\r\n\r\n\tif (priceData.value?.hasActiveCampaign) {\r\n\t\tif (priceData.value?.campaign?.startDate && priceData.value?.campaign?.endDate) {\r\n\t\t\thasCampaign.value = true;\r\n\t\t}\r\n\t}\r\n\tsetCampaignDateRange()\r\n})\r\n\r\nwatch(() => props.priceData, (value) => {\r\n\tif(value) {\r\n\t\tpriceData.value = value;\r\n\t\thasCampaign.value = value.hasActiveCampaign;\r\n\t}\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n\t<div class=\"flex flex-col\" v-if=\"priceData\">\r\n\t\t<div v-if=\"hasCampaign\"\r\n\t\t class=\"flex items-center gap-2 text-xs text-grey-dark\"\r\n\t\t:class=\"props.theme == 'page' || props.theme == 'line' ? 'order-2' : 'mb-2'\">\r\n\t\t\t<span class=\"relative flex h-3 w-3\">\r\n\t\t\t\t<span class=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-yellow opacity-50\"></span>\r\n\t\t\t\t<span class=\"inline-flex rounded-full h-3 w-3 bg-yellow\"></span>\r\n\t\t\t</span>\r\n\t\t\t{{ setCampaignDateRange() }}\r\n\t\t</div>\r\n\t\t<div class=\"py-2 w-full\"\r\n\t\t\t:class=\"props.theme == 'card' ? 'border-t border-grey border-b' : ''\">\r\n\t\t\t<div class=\"flex items-center\"\r\n\t\t\t\t:class=\"props.theme == 'line' ? 'justify-end' : 'justify-between'\">\r\n\t\t\t\t<div :class=\"props.direction == 'vertical' ?\r\n\t\t\t\t\t'flex flex-col' :\r\n\t\t\t\t\t'grid grid-cols-2 items-center gap-x-3'\r\n\t\t\t\t\t\">\r\n\t\t\t\t\t<span v-if=\"priceData?.priceSavings || priceData?.totalSaving\"\r\n\t\t\t\t\t\t  class=\"bg-yellow inline uppercase w-fit px-1 text-sm font-bold mb-1\"\r\n\t\t\t\t\t\t  :class=\"props.direction == 'horizontal' ? 'col-start-2 row-start-1' : ''\">\r\n\t\t\t\t\t\t{{ getTranslation('PriceSaving') }}\r\n\t\t\t\t\t\t<template v-if=\"priceData?.priceSavings\">{{ priceData.priceSavings.formatted }}</template>\r\n\t\t\t\t\t\t<template v-else-if=\"priceData?.totalSaving\">{{ priceData.totalSaving.formatted }}</template>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<span class=\"font-bold\"\r\n\t\t\t\t\t\t:class=\"props.theme == 'page' && props.size != 'sm' ? 'text-5xl' : props.theme == 'line' ? 'text-2xl' : 'text-3xl'\">\r\n\t\t\t\t\t\t<small class=\"mr-1\" v-if=\"props?.hasVariants\">{{ getTranslation('ProductPrice.From') }}</small>\r\n\t\t\t\t\t\t<template v-if=\"priceData?.price\">\r\n\t\t\t\t\t\t\t{{ priceData?.price?.formatted }}\r\n\t\t\t\t\t\t</template>\r\n\t\t\t\t\t\t<template v-else-if=\"priceData?.totalPrice\">\r\n\t\t\t\t\t\t\t{{ priceData?.totalPrice?.formatted }}\r\n\t\t\t\t\t\t</template>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<span class=\"text-sm line-through text-grey-dark\"\r\n\t\t\t\t\t\t:class=\"props.direction == 'horizontal' ? 'col-span-2' : ''\">\r\n\t\t\t\t\t\t<template v-if=\"priceData?.productSplash?.typeName == 'combo'\">\r\n\t\t\t\t\t\t\t{{ getTranslation('PriceBeforeCombo') }}\r\n\t\t\t\t\t\t</template>\r\n\t\t\t\t\t\t<template v-else-if=\"priceData?.priceSavings || priceData.totalSaving\">\r\n\t\t\t\t\t\t\t{{ getTranslation('PriceBefore') }}\r\n\t\t\t\t\t\t</template>\r\n\t\t\t\t\t\t<template v-if=\"priceData?.priceNormal\">&nbsp;{{ priceData?.priceNormal?.formatted }}</template>\r\n\t\t\t\t\t\t<template v-else-if=\"priceData?.totalNormalPrice\">&nbsp;{{ priceData?.totalNormalPrice?.formatted }}</template>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</div>\r\n\t\t\t\t<!-- TODO: Tilføj translation -->\r\n\t\t\t\t<RenderAction\r\n\t\t\t\t\tv-if=\"props.theme == 'card'\"\r\n\t\t\t\t\t:data=\"props.link\"\r\n\t\t\t\t\taction=\"link\"\r\n\t\t\t\t\ttheme=\"faded\"\r\n\t\t\t\t\tsize=\"sm\"\r\n\t\t\t\t>\r\n\t\t\t\t\tVis\r\n\t\t\t\t</RenderAction>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n</template>\r\n"],"file":"assets/PriceElement-78d99659.js"}