{"version":3,"file":"BranchDetails.vue_vue_type_script_setup_true_lang-fbd2306b.js","sources":["../../src/components/ui/ThAccordion.vue","../../src/components/ui/ThTransitionHeight.vue","../../src/views/appointments/api/useBranchQuery.ts","../../src/views/appointments/api/useStaffsQuery.ts","../../src/composables/useQueryBatch.ts","../../src/views/appointments/components/BranchDetails.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useModel } from 'vue'\nimport { ThTransitionHeight, ThIcon } from '@/components/ui'\n\nexport interface ThAccordionProps {\n  label?: string\n  isExpanded: boolean\n  borderless?: boolean\n  autoWidth?: boolean\n}\n\nconst props = defineProps<ThAccordionProps>()\n\ndefineEmits<{\n  'update:isExpanded': [payload: boolean]\n}>()\n\nconst isExpanded = useModel(props, 'isExpanded')\n</script>\n\n<template>\n  <div>\n    <button\n      data-testid=\"accordion-button\"\n      @click=\"isExpanded = !isExpanded\"\n      :class=\"[\n        'flex items-center justify-between transition duration-300',\n        {\n          'w-full': !props.autoWidth,\n          'py-3': !props.borderless,\n          'border-b': !props.borderless,\n          'border-gray-400': !isExpanded,\n          'border-transparent': isExpanded\n        }\n      ]\"\n    >\n      <span class=\"text-sm font-semibold text-dark\" data-testid=\"accordion-label\">\n        <slot name=\"label\">{{ label }}</slot>\n      </span>\n\n      <span class=\"ml-2\">\n        <ThIcon\n          is=\"ChevronDown\"\n          class=\"text-gray-600 w-3 transition duration-300\"\n          :class=\"{\n            'transform rotate-180': isExpanded\n          }\"\n        />\n      </span>\n    </button>\n\n    <ThTransitionHeight :show=\"isExpanded\">\n      <slot />\n    </ThTransitionHeight>\n  </div>\n</template>\n","<script lang=\"ts\" setup>\nimport { ref } from 'vue'\n/**\n * @docs Transitions the element's height\n * This component renders a div that you should not add styles to, as some\n * css properties will cause the transition to appear as lagging (eg padding/margin)\n * Apply these styles to your own div if you need to\n */\n\nexport interface ThTransitionHeight {\n  show: boolean\n}\n\ndefineProps<ThTransitionHeight>()\n\nconst heightStyle = ref<string>()\n\nasync function onEnter(element: Element) {\n  // CSS Transition for height does not work from auto to px\n  // So we must grab the initial height, set the height to 0,\n  // wait for the browser to repaint and set it back to the original\n  const initialHeight = (element as HTMLElement).offsetHeight + 'px'\n\n  heightStyle.value = '0px'\n\n  requestAnimationFrame(() => {\n    heightStyle.value = initialHeight\n  })\n}\n\nfunction onLeave(element: Element) {\n  // CSS Transition will not work from auto -> 0, so we must set the height\n  // explicitly, wait for the browser to repaint and set it to 0\n  const initialHeight = (element as HTMLElement).offsetHeight + 'px'\n\n  heightStyle.value = initialHeight\n\n  requestAnimationFrame(() => {\n    heightStyle.value = '0px'\n  })\n}\n\n/**\n * Clean up the styles after the transition is completed\n */\nfunction onAfterTransition() {\n  heightStyle.value = ''\n}\n</script>\n\n<template>\n  <Transition\n    enter-active-class=\"transition-[height] duration-300 overflow-hidden\"\n    leave-active-class=\"transition-[height] duration-300 overflow-hidden\"\n    @enter-cancelled=\"onAfterTransition\"\n    @leave-cancelled=\"onAfterTransition\"\n    @enter=\"onEnter\"\n    @after-enter=\"onAfterTransition\"\n    @leave=\"onLeave\"\n    @after-leave=\"onAfterTransition\"\n  >\n    <div v-show=\"show\" :style=\"{ height: heightStyle }\">\n      <slot />\n    </div>\n  </Transition>\n</template>\n","import { useThFetch } from '@/composables/useThFetch'\nimport { useConfigurationStore } from '@/stores/useConfigurationStore'\nimport type { Branch } from '@/types'\nimport type { UseFetchOptions } from '@vueuse/core'\nimport { toValue, type MaybeRefOrGetter } from 'vue'\n\nexport function useBranchQuery(id: MaybeRefOrGetter<string>, options: UseFetchOptions = {}) {\n  const store = useConfigurationStore()\n\n  const getURL = () => `/v0/branches/public/${store.organization}/${toValue(id)}`\n\n  return useThFetch(getURL, {\n    afterFetch(ctx) {\n      ctx.data = ctx.data.results[0]\n\n      return options.afterFetch?.(ctx) ?? ctx\n    },\n    ...options\n  }).json<Branch>()\n}\n","import { useThFetch } from '@/composables/useThFetch'\nimport { useConfigurationStore } from '@/stores/useConfigurationStore'\nimport type { Staff } from '@/types'\nimport type { UseFetchOptions } from '@vueuse/core'\n\nexport function useStaffsQuery(options?: UseFetchOptions) {\n  const store = useConfigurationStore()\n\n  return useThFetch(`/v0/staff/public/${store.organization}?deleted=false&active=true`, {\n    afterFetch(ctx) {\n      return {\n        ...ctx,\n        data: ctx.data.results\n      }\n    },\n    ...options\n  }).json<Staff[]>()\n}\n","import type { UseFetchReturn } from '@vueuse/core'\nimport { computed } from 'vue'\n\n/**\n * Accepts an array of queries and allows you to monitor them in bulk\n * isError - at least one of the queries has failed\n * isFetching - at least one of the queries is fetching\n */\nexport function useQueryBatch(queries: UseFetchReturn<any>[]) {\n  const isFetching = computed(() => queries.some((query) => query.isFetching.value))\n  const isError = computed(() => queries.some((query) => !!query.error.value))\n\n  async function execute(throwOnFailed?: boolean) {\n    await Promise.all(queries.map((query) => query.execute(throwOnFailed)))\n  }\n\n  return { isFetching, isError, execute }\n}\n","<script lang=\"ts\" setup>\nimport { ThContainer } from '@/components/ui'\nimport { useLocalizedDayjs } from '@/composables/useLocalizedDayjs'\nimport { useI18n } from '@/plugins/i18n'\nimport { useConfigurationStore } from '@/stores/useConfigurationStore'\nimport type { Branch } from '@/types'\nimport { getBranchAddress } from '@/views/appointments/components/choose-branch/utils'\nimport { computed, ref } from 'vue'\nimport { getTodaysOpenStatus, getOpeningHours } from '../utils'\nimport { ThAccordion } from '@/components/ui'\n\nexport interface BranchDetailsProps {\n  branch: Branch\n}\n\nconst props = defineProps<{ branch: Branch }>()\nconst dayjs = useLocalizedDayjs()\nconst store = useConfigurationStore()\nconst { t } = useI18n()\n\nconst isExpanded = ref(false)\n\nconst openStatus = computed(() => getTodaysOpenStatus(\n  store.reservations,\n  props.branch.configurations?.reservations!,\n  dayjs\n))\n\nconst hours = computed(() => getOpeningHours(\n  store.reservations,\n  props.branch.configurations?.reservations!,\n  dayjs))\n\nconst address = computed(() => getBranchAddress(props.branch))\n</script>\n\n<template>\n  <div class=\"py-4 bg-white text-sm\">\n    <ThContainer>\n      <h3 class=\"font-semibold text-dark\">{{ branch.name }}</h3>\n      <p v-if=\"address\">{{ address }}</p>\n\n      <ThAccordion v-if=\"branch.shift_plan_enabled === false\" v-model:is-expanded=\"isExpanded\" borderless auto-width>\n        <template #label>\n          <div class=\"font-normal text-gray-800\">\n            <span\n              :class=\"`${openStatus.isOpen ? 'text-success' : 'text-warning'}`\"\n            >\n              {{ openStatus.isOpen ? t('appointments.form.branch.open') : t('appointments.form.branch.closed') }}\n            </span>\n            <template v-if=\"openStatus.until\">\n              &#x00B7;\n              {{ openStatus.isOpen ? t('appointments.form.branch.closes') : t('appointments.form.branch.opens') }}\n              {{ openStatus.until }}\n            </template>\n          </div>\n        </template>\n\n        <template #default>\n          <div class=\"space-y-2 pt-1\">\n            <table>\n              <tbody>\n                <template v-for=\"day in hours\" :key=\"day.day\">\n                  <tr :class=\"{ 'font-semibold': day.isToday }\">\n                    <td class=\"pr-4\">{{ day.day }}</td>\n                    <td>{{ day.hours ?? t('appointments.form.branch.closed')}}</td>\n                  </tr>\n                  <tr v-if=\"day.hours && day.isClosedDay\" class=\"text-warning\">\n                    <td></td>\n                    <td>\n                      {{ t('appointments.form.branch.holiday_closure') }}\n                    </td>\n                  </tr>\n                </template>\n              </tbody>\n            </table>\n          </div>\n        </template>\n      </ThAccordion>\n    </ThContainer>\n  </div>\n</template>\n"],"names":["isExpanded","useModel","props","heightStyle","ref","onEnter","element","initialHeight","onLeave","onAfterTransition","useBranchQuery","id","options","store","useConfigurationStore","useThFetch","toValue","ctx","_a","useStaffsQuery","useQueryBatch","queries","isFetching","computed","query","isError","execute","throwOnFailed","dayjs","useLocalizedDayjs","useI18n","openStatus","getTodaysOpenStatus","hours","getOpeningHours","address","getBranchAddress"],"mappings":"k7BAiBMA,EAAaC,EAASC,EAAO,YAAY,4pBCF/C,MAAMC,EAAcC,IAEpB,eAAeC,EAAQC,EAAkB,CAIjC,MAAAC,EAAiBD,EAAwB,aAAe,KAE9DH,EAAY,MAAQ,MAEpB,sBAAsB,IAAM,CAC1BA,EAAY,MAAQI,CAAA,CACrB,CACH,CAEA,SAASC,EAAQF,EAAkB,CAG3B,MAAAC,EAAiBD,EAAwB,aAAe,KAE9DH,EAAY,MAAQI,EAEpB,sBAAsB,IAAM,CAC1BJ,EAAY,MAAQ,KAAA,CACrB,CACH,CAKA,SAASM,GAAoB,CAC3BN,EAAY,MAAQ,EACtB,4WCzCO,SAASO,GAAeC,EAA8BC,EAA2B,GAAI,CAC1F,MAAMC,EAAQC,IAId,OAAOC,EAFQ,IAAM,uBAAuBF,EAAM,YAAY,IAAIG,EAAQL,CAAE,CAAC,GAEnD,CACxB,WAAWM,EAAK,OACd,OAAAA,EAAI,KAAOA,EAAI,KAAK,QAAQ,CAAC,IAEtBC,EAAAN,EAAQ,aAAR,YAAAM,EAAA,KAAAN,EAAqBK,KAAQA,CACtC,EACA,GAAGL,CAAA,CACJ,EAAE,KAAa,CAClB,CCdO,SAASO,GAAeP,EAA2B,CACxD,MAAMC,EAAQC,IAEd,OAAOC,EAAW,oBAAoBF,EAAM,YAAY,6BAA8B,CACpF,WAAWI,EAAK,CACP,MAAA,CACL,GAAGA,EACH,KAAMA,EAAI,KAAK,OAAA,CAEnB,EACA,GAAGL,CAAA,CACJ,EAAE,KAAc,CACnB,CCTO,SAASQ,GAAcC,EAAgC,CACtD,MAAAC,EAAaC,EAAS,IAAMF,EAAQ,KAAMG,GAAUA,EAAM,WAAW,KAAK,CAAC,EAC3EC,EAAUF,EAAS,IAAMF,EAAQ,KAAMG,GAAU,CAAC,CAACA,EAAM,MAAM,KAAK,CAAC,EAE3E,eAAeE,EAAQC,EAAyB,CACxC,MAAA,QAAQ,IAAIN,EAAQ,IAAKG,GAAUA,EAAM,QAAQG,CAAa,CAAC,CAAC,CACxE,CAEO,MAAA,CAAE,WAAAL,EAAY,QAAAG,EAAS,QAAAC,EAChC,mSCDME,EAAQC,IACRhB,EAAQC,IACR,CAAE,GAAMgB,IAER9B,EAAaI,EAAI,EAAK,EAEtB2B,EAAaR,EAAS,WAAM,OAAAS,EAChCnB,EAAM,cACNK,EAAAhB,EAAM,OAAO,iBAAb,YAAAgB,EAA6B,aAC7BU,CAAA,EACD,EAEKK,EAAQV,EAAS,WAAM,OAAAW,EAC3BrB,EAAM,cACNK,EAAAhB,EAAM,OAAO,iBAAb,YAAAgB,EAA6B,aAC7BU,CAAA,EAAM,EAEFO,EAAUZ,EAAS,IAAMa,EAAiBlC,EAAM,MAAM,CAAC"}