{"version":3,"file":"CkLafQhT.js","sources":["../../../../src/components/block/eventEnumeration/event-enumeration.vue"],"sourcesContent":["<!-- eslint-disable vue/no-v-html -->\n<template>\n  <ContainerBasic container-type=\"CONTENT\">\n    <div\n      class=\"flex flex-col self-center justify-center touch:md:flex-row lg:flex-row\"\n    >\n      <div class=\"flex flex-col items-center\">\n        <img\n          src=\"@/assets/images/TEMP-calendar-day.svg\"\n          class=\"mb-14 touch:md:mb-0 lg:mb-0 h-[150px] w-[150px] touch:md:h-[210px] touch:md:w-[210px] lg:h-[210px] lg:w-[210px]\"\n          loading=\"lazy\"\n        />\n      </div>\n      <ul\n        v-if=\"blockData.events\"\n        class=\"mx-auto touch:md:ml-44 lg:ml-44 xs-w[100%] md:w-[576px]\"\n      >\n        <li\n          v-for=\"(event, index) in blockData.events\"\n          :key=\"index\"\n          class=\"flex flex-col\"\n        >\n          <div\n            class=\"flex justify-between px-md touch:md:justify-between lg:justify-between\"\n          >\n            <div class=\"flex flex-col w-full text-base text-md\">\n              <div class=\"flex flex-row flex-wrap items-baseline\">\n                <FaIcon\n                  classes=\"mr-xs fa-fw shrink-0\"\n                  icon-class=\"fal fa-calendar-days\"\n                />\n                <div\n                  class=\"flex flex-row flex-wrap items-baseline shrink-0 max-w-[calc(100%-50px)]\"\n                >\n                  <div\n                    class=\"w-auto\"\n                    v-html=\"getStyledDateAsHtml(event.date)\"\n                  ></div>\n                  <div\n                    class=\"w-full md:w-auto\"\n                    v-html=\"getAdditionalDates(event)\"\n                  ></div>\n                </div>\n                <div\n                  v-if=\"event.date && event.additionalDates.length === 0\"\n                  class=\"w-full ml-0 md:w-auto md:ml-sm\"\n                >\n                  <FaIcon\n                    icon-class=\"fal fa-clock\"\n                    classes=\"mr-xs fa-fw touch:md:ml-sm lg:ml-sm\"\n                  />\n                  <!-- eslint-disable-next-line vue/no-v-html -->\n                  <span v-html=\"getTime(event)\"></span>\n                </div>\n              </div>\n\n              <div class=\"mt-1 text-base leading-7\">\n                <div class=\"flex flex-col\">\n                  <div\n                    class=\"flex flex-row flex-wrap items-baseline content-center md:flex-nowrap\"\n                  >\n                    <FaIcon\n                      icon-class=\"fal fa-location-dot\"\n                      classes=\"mr-xs fa-fw shrink-0\"\n                    />\n                    <span\n                      v-if=\"event.location.street != undefined\"\n                      :class=\"\n                        event.location.street.length > 20\n                          ? 'max-w-[9rem] md:max-w-full'\n                          : 'whitespace-nowrap'\n                      \"\n                    >\n                      {{ event.location.street }}&nbsp;{{\n                        event.location.streetNumber\n                      }}\n                    </span>\n                    <span v-else>\n                      {{ event.location.zipCode ?? '' }}\n                      {{ event.location.title }}\n                    </span>\n                    <span\n                      v-if=\"event.location.street != undefined\"\n                      class=\"hidden ml-xs mr-xs touch:md:inline-flex lg:inline-flex\"\n                      >|</span\n                    >\n                    <span\n                      v-if=\"event.location.street != undefined\"\n                      class=\"ml-md touch:md:ml-0 lg:ml-0\"\n                      >{{ event.location.zipCode ?? '' }}\n                      {{ event.location.title }}</span\n                    >\n                  </div>\n                  <div\n                    v-if=\"event.courseType === ECourseType.HYBRID\"\n                    class=\"flex flex-row w-full\"\n                  >\n                    <span class=\"ml-md\">\n                      {{ `${t('event.onlineLocationAddition')}&nbsp;` }}\n                    </span>\n                  </div>\n                </div>\n              </div>\n              <LinkBasic\n                :label=\"t('event.showDetails')\"\n                :link=\"event.slug\"\n                target=\"_blank\"\n                icon=\"fal fa-chevron-right\"\n                class=\"mt-md touch:md:mt-sm lg:mt-sm text-vdv-base min-w-[12rem] md:min-w-[9rem]\"\n              />\n            </div>\n            <EventCourseIndicator\n              class=\"!ml-xs touch:md:!ml-md lg:!ml-md\"\n              :course-type=\"event.courseType as ECourseType\"\n              :is-clickable=\"false\"\n            />\n          </div>\n          <hr\n            v-if=\"index != Object.keys(blockData.events).length - 1\"\n            class=\"w-full border-t-1 my-md border-t-vdv-border-light\"\n          />\n        </li>\n      </ul>\n    </div>\n  </ContainerBasic>\n</template>\n\n<script setup lang=\"ts\">\nimport dayjs, {\n  getWeekdayLocale,\n  getMonthLocale,\n  getHoursLocale,\n} from '@/helpers/dayJs';\nimport ContainerBasic from '@/components/components/container-basic.vue';\nimport { ECourseType } from '@/@types/course-type';\nimport LinkBasic from '@/components/components/core/basicLink/basic-link.vue';\nimport EventCourseIndicator from '@/components/event/event-course-indicator.vue';\nimport type { EventEnumerationData } from './blockType';\nimport type { EventData } from '~~/src/server/transformers/EntityTransformers/eventTransformer';\nimport FaIcon from '@/components/fa-icon.vue';\n\nconst { t } = useTrans();\n\ndefineProps({\n  blockData: {\n    type: Object as PropType<EventEnumerationData>,\n    required: true,\n    default: {} as EventEnumerationData,\n  },\n});\n// Language should be a global var (in a store) at some point\n\nfunction getStyledDateAsHtml(date: Date) {\n  if (!date) {\n    return `<span>${t('event.individualAppointment')}</span>`;\n  }\n  const language = 'de';\n  const day = dayjs(date).format('DD');\n  const dayWord = getWeekdayLocale(date, language).slice(0, 2);\n  const month = getMonthLocale(date, language);\n  const year = dayjs(date).format('YYYY');\n  return `${dayWord}. <span class=\"text-lg\"><b> ${day}. </b></span> ${month} ${year}`;\n}\n\nfunction getTime(event: EventData) {\n  const language = 'de';\n  const startTime = getHoursLocale(event.startTime, language);\n  const endTime = getHoursLocale(event.endTime, language);\n  return `${startTime} - ${endTime}`;\n}\n\nfunction getAdditionalDates(event: EventData) {\n  if (event.additionalDates?.length === 0) return '';\n  if (!event.hasConsecutiveDates) {\n    if (event.additionalDates.length === 1) {\n      return `<div>&nbsp;& ${t('event.additionalDate')}</div>`;\n    } else {\n      return `<div>&nbsp;+ ${t('event.additionalDates', {\n        count: event.additionalDates.length,\n      })}</div>`;\n    }\n  } else {\n    return `<span class=\"hidden px-xs md:inline\">-</span>${getStyledDateAsHtml(\n      event.additionalDates[event.additionalDates.length - 1].date,\n    )}`;\n  }\n}\n</script>\n"],"names":["t","useTrans","getStyledDateAsHtml","date","language","day","dayjs","dayWord","getWeekdayLocale","month","getMonthLocale","year","getTime","event","startTime","getHoursLocale","endTime","getAdditionalDates","_a"],"mappings":"+vDA6IM,KAAA,CAAE,EAAAA,GAAMC,IAWd,SAASC,EAAoBC,EAAY,CACvC,GAAI,CAACA,EACI,MAAA,SAASH,EAAE,6BAA6B,CAAC,UAElD,MAAMI,EAAW,KACXC,EAAMC,EAAMH,CAAI,EAAE,OAAO,IAAI,EAC7BI,EAAUC,EAAiBL,EAAMC,CAAQ,EAAE,MAAM,EAAG,CAAC,EACrDK,EAAQC,EAAeP,EAAMC,CAAQ,EACrCO,EAAOL,EAAMH,CAAI,EAAE,OAAO,MAAM,EACtC,MAAO,GAAGI,CAAO,+BAA+BF,CAAG,iBAAiBI,CAAK,IAAIE,CAAI,EACnF,CAEA,SAASC,EAAQC,EAAkB,CACjC,MAAMT,EAAW,KACXU,EAAYC,EAAeF,EAAM,UAAWT,CAAQ,EACpDY,EAAUD,EAAeF,EAAM,QAAST,CAAQ,EAC/C,MAAA,GAAGU,CAAS,MAAME,CAAO,EAClC,CAEA,SAASC,EAAmBJ,EAAkB,OACxC,QAAAK,EAAAL,EAAM,kBAAN,YAAAK,EAAuB,UAAW,EAAU,GAC3CL,EAAM,oBASF,gDAAgDX,EACrDW,EAAM,gBAAgBA,EAAM,gBAAgB,OAAS,CAAC,EAAE,IACzD,CAAA,GAVGA,EAAM,gBAAgB,SAAW,EAC5B,gBAAgBb,EAAE,sBAAsB,CAAC,SAEzC,gBAAgBA,EAAE,wBAAyB,CAChD,MAAOa,EAAM,gBAAgB,MAAA,CAC9B,CAAC,QAOR"}