{"version":3,"mappings":"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","names":["getPrefillData","isLoggedIn","userFormData","useShopEnabled","userAddresses","useUserAddress","allUserData","useUserContext","_a","useFormData","useSessionStore","formData","useState","uuidv4","useRepairshopData","submit","formHandle","state","site","mutationOptions","response","useSubmitForm","result","dataError","_b","data","_c","_d","useElasticApm","e","RepairshopStepEnum","loadForm","fetchData","useLoadForm","isFormValidForStep","step","isBasicDataValid","isCheckoutDataValid","isValid","tool","props","__props","handleValueChanged","event","t","useTrans","form","__temp","__restore","_withAsyncContext","multiselect","createInput","customMultiselect","index","resetFormData","options","ref","watch","newManufacturer","oldManufacturer","onMounted","languageCode","useNuxtApp","costs","usePriceData","n","setPriceData","subtotalCosts","computed","shippingCosts","totalCosts","MAX_INSTRUMENTS","pageData","usePageData","isLoading","tools","showMaxInstrumentsHint","handleAddEntry","validateData","handleRemoveEntry","checkValidity","invalidElements","field","firstInvalidFieldNode","useRedirectData","useRoute","useRouter","repairshopData","toggleVisibility","id","el","m","accordionCloseHandler","accordionOpenHandler","accordionId","scrollToElement","accordionOpen","accordionClose","accordion","x","deviceMinPrice","devicePrices","device","textNode","isTextExpandable","isTextExpanded","expandableLinkText","expandText","isDesktop","useIsDesktopView","routeToAddress","Phone","useSiteIdent","SiteIdent","defineAsyncComponent","__vitePreload","addressData","street","houseNumber","zipCode","city","streetDelivery","houseNumberDelivery","zipCodeDelivery","cityDelivery","onBeforeMount","showStreetError","streetState","houseNumberState","showStreetErrorDelivery","showZipCodeError","zipCodeState","cityState","showZipCodeErrorDelivery","zipCodeValidationRules","test","getInvalidElements","fields","invalidChildElements","getPlaceholderZipCode","progressBar","addressIcon","overviewIcon","progressWidth","isOverviewStep","stepEnum","setProgressBarWidth","newHash","useResizeObserver","compositionKey","iframeSrc","animFrame","useIntersectionObserver","isIntersecting","iframeWindow","stage","animStep2","seekAnim","animStep3","animStep4","animStep5","animStep6","animStep7","playAnim","frameNumber","ctaBlock","BlockTypeHandle","ECallToActionBtnType","pageDataInject","config","useRuntimeConfig","reactive","isBasicStep","redirectOnInvalidData","loadManufacturers","loadDevices","load","element","hash","redirectUri","useCachedGet","handleLoadingError","d","shouldRenderHoneypotField","f","onSubmit","getParsedMutationVariables","tags","useReservation","_e","resetPriceData","toolsObj"],"ignoreList":[],"sources":["../../../../src/components/form/repairshop/composables/useFormData.ts","../../../../src/components/form/repairshop/composables/useRepairshopData.ts","../../../../src/components/form/repairshop/utils/mutation.ts","../../../../src/components/form/repairshop/utils/formStepEnum.ts","../../../../src/components/form/repairshop/utils/form.ts","../../../../src/components/form/select/customMultiselect.vue","../../../../src/components/form/repairshop/components/form-fields/manufacturer-select.vue","../../../../src/components/form/repairshop/components/form-fields/device-select.vue","../../../../src/components/form/repairshop/components/price/form-overview.vue","../../../../src/components/form/repairshop/components/price/info-text.vue","../../../../src/components/form/repairshop/components/form-steps/basic.vue","../../../../src/components/form/repairshop/components/price/list.vue","../../../../src/components/form/repairshop/components/price/tile-view.vue","../../../../src/components/form/repairshop/components/truncated-collapsed-text.vue","../../../../src/components/form/repairshop/components/form-steps/overview.vue","../../../../src/components/form/repairshop/components/form-steps/address.vue","../../../../src/components/form/repairshop/checkout.vue","../../../../src/components/form/repairshop/js-animation.vue","../../../../src/components/form/repairshop/repairshop-request.vue"],"sourcesContent":["import { v4 as uuidv4 } from 'uuid';\nimport type { RepairshopFormType } from '~/components/form/repairshop/utils/formTypes';\nimport { useUserAddress } from '@/stores/useUserAddress';\nimport { useUserContext } from '@/stores/useUserContext';\nimport { useSessionStore } from '~/stores/useSessionStore';\n\nasync function getPrefillData(isLoggedIn: boolean) {\n  const userFormData = {\n    zip: '',\n    city: '',\n    street: '',\n    houseNumber: '',\n    phoneNumber: '',\n    phoneCountry: '',\n    companyName: '',\n    fullphoneNumber: '',\n    customerNumber: '',\n    email: '',\n  };\n\n  if (useShopEnabled() && isLoggedIn) {\n    const userAddresses = useUserAddress();\n    await userAddresses.loadAddresses();\n\n    const allUserData = useUserContext();\n    await allUserData.loadAccountData();\n    if (userAddresses.contactAddress) {\n      userFormData.zip = userAddresses.contactAddress.zip;\n      userFormData.street = userAddresses.contactAddress.street;\n      userFormData.houseNumber = userAddresses.contactAddress.number;\n      userFormData.city = userAddresses.contactAddress.city;\n    }\n    if (allUserData.accountData) {\n      userFormData.fullphoneNumber = allUserData.accountData.phoneNumber;\n      if (allUserData.accountData.phoneNumber?.startsWith('+')) {\n        userFormData.phoneCountry = allUserData.accountData.phoneNumber.slice(\n          0,\n          3,\n        );\n        userFormData.phoneNumber = allUserData.accountData.phoneNumber.slice(3);\n      } else {\n        userFormData.phoneCountry = undefined;\n        userFormData.phoneNumber = allUserData.accountData.phoneNumber;\n      }\n\n      userFormData.customerNumber = allUserData.accountData.customerNumber;\n    }\n    if (allUserData.userData) {\n      userFormData.email = allUserData.userData.email;\n      userFormData.companyName = `${allUserData.userData.name1} ${allUserData.userData.name2}`;\n    }\n  }\n  return userFormData;\n}\n\nexport const useFormData = async () => {\n  const userFormData = await getPrefillData(useSessionStore().isLoggedIn);\n\n  const formData = useState<RepairshopFormType>('formData', () => ({\n    isFormSubmitting: false,\n    tools: [\n      {\n        id: uuidv4() as string,\n        manufacturer: null,\n        device: null,\n        serialNumber: '',\n        infoText: '',\n      },\n    ],\n    companyName: userFormData.companyName ?? '',\n    addressData: {\n      street: userFormData.street ?? '',\n      houseNumber: userFormData.houseNumber ?? '',\n      zipCode: userFormData.zip ?? '',\n      city: userFormData.city ?? '',\n    },\n    contactData: {\n      customerNumber: userFormData.customerNumber ?? '',\n      customerEmail: userFormData.email ?? '',\n      customerPhone: userFormData.fullphoneNumber ?? '',\n      phoneCountry: userFormData.phoneCountry ?? '',\n      phoneNumber: userFormData.phoneNumber ?? '',\n      contactPhone: userFormData.phoneNumber ?? '',\n    },\n    differentDeliveryAddress: false,\n    deliveryData: {\n      companyName: '',\n      addressData: {\n        street: '',\n        houseNumber: '',\n        zipCode: '',\n        city: '',\n      },\n    },\n  }));\n\n  const resetFormData = () => {\n    formData.value.isFormSubmitting = false;\n    formData.value.tools = [\n      {\n        id: uuidv4() as string,\n        manufacturer: null,\n        device: null,\n        serialNumber: '',\n        infoText: '',\n      },\n    ];\n    formData.value.companyName = '';\n    formData.value.addressData.street = '';\n    formData.value.addressData.houseNumber = '';\n    formData.value.addressData.zipCode = '';\n    formData.value.addressData.city = '';\n    formData.value.contactData.customerNumber = '';\n    formData.value.contactData.customerEmail = '';\n    formData.value.contactData.customerPhone = '';\n    formData.value.contactData.phoneNumber = '';\n    formData.value.differentDeliveryAddress = false;\n    formData.value.deliveryData.companyName = '';\n    formData.value.deliveryData.addressData.street = '';\n    formData.value.deliveryData.addressData.houseNumber = '';\n    formData.value.deliveryData.addressData.zipCode = '';\n    formData.value.deliveryData.addressData.city = '';\n  };\n\n  return {\n    formData,\n    resetFormData,\n  };\n};\n","import type {\n  OptionType,\n  OptionDataType,\n} from '~/components/form/repairshop/utils/formTypes';\n\nexport const useRepairshopData = () =>\n  useState<Record<string, any>>('repairshopData', () => ({\n    manufacturers: {\n      data: {} as Record<string, OptionType[]>,\n      isLoading: false,\n      isInitialized: false,\n      error: false,\n    } as OptionDataType,\n    devices: {\n      data: {} as Record<string, OptionType[]>,\n      isLoading: false,\n      isInitialized: false,\n      error: false,\n    } as OptionDataType,\n  }));\n","import type { TFormMutationOptions } from '~~/src/server/utils/cms/formMutation';\n\nexport async function submit(\n  formHandle: string,\n  state: any,\n  formData: any,\n  site: string,\n): Promise<any> {\n  const mutationOptions = {} as TFormMutationOptions;\n  if (state.captchas && state.captchas.googleCaptcha) {\n    mutationOptions.googleCaptchaV3Token =\n      await state.captchas.googleCaptcha.execute('submit');\n  }\n\n  let response = null;\n\n  await useSubmitForm(\n    formHandle,\n    formData,\n    mutationOptions.googleCaptchaV3Token,\n    site,\n  )\n    .then(async (result) => {\n      //@HACK: Captcha Errors just return and empty form object like {\"formHandleHere\":null} so that's the only thing to check at the moment\n      const dataError = (<any>result?.data?.value)?.error;\n      const data = result.data.value;\n      if (\n        result?.error?.value == undefined &&\n        data[Object.keys(data)[0]] !== null\n      ) {\n        response = data;\n      } else if (result?.error || dataError) {\n        //@todo trigger some error handling + user feedback\n        // eslint-disable-next-line no-console\n        console.error('Form: General Error ', result.error ?? dataError);\n        useElasticApm()?.captureError({\n          name: 'Form: General Error',\n          message: 'Form: General Error',\n          cause: JSON.stringify(result?.error ?? dataError ?? {}),\n        });\n        window.alert(\n          'Formular Absende-Fehler - bitte Formular erneut abschicken',\n        );\n      } else {\n        // eslint-disable-next-line no-console\n        console.error('Form: Captcha Error ', result.data);\n        window.alert('Formular Absende-Fehler - Captcha ungültig');\n      }\n    })\n    .catch((e) => {\n      // eslint-disable-next-line no-console\n      console.log(e);\n      useElasticApm()?.captureError(e);\n      window.alert(\n        'Formular Absende-Fehler - bitte Formular erneut abschicken',\n      );\n    });\n\n  return response;\n}\n","export enum RepairshopStepEnum {\n  BASIC = 'basic',\n  ADDRESS = 'address',\n  OVERVIEW = 'overview',\n}\n","import { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport type { RepairshopFormType } from '~/components/form/repairshop/utils/formTypes';\nimport { RepairshopStepEnum } from '~/components/form/repairshop/utils/formStepEnum';\nimport { useLoadForm } from '~~/src/composables/dataFetching/cms/form';\n\nexport async function loadForm(formHandle: string) {\n  const { data: fetchData } = await useLoadForm(formHandle);\n\n  return fetchData.value;\n}\n\nexport async function isFormValidForStep(\n  step: RepairshopStepEnum,\n): Promise<boolean> {\n  const { formData } = await useFormData();\n\n  switch (step) {\n    case RepairshopStepEnum.BASIC:\n      return isBasicDataValid(formData.value);\n    case RepairshopStepEnum.ADDRESS:\n      return (\n        isBasicDataValid(formData.value) && isCheckoutDataValid(formData.value)\n      );\n  }\n}\n\nfunction isBasicDataValid(formData: RepairshopFormType): boolean {\n  const isValid = [] as boolean[];\n  formData.tools.forEach((tool) => {\n    isValid.push(\n      !!(tool.manufacturer && tool.device && tool.infoText.length !== 0),\n    );\n  });\n\n  return !isValid.includes(false);\n}\n\nfunction isCheckoutDataValid(formData: RepairshopFormType): boolean {\n  const isValid = [] as boolean[];\n  isValid.push(\n    formData.companyName.length > 0 &&\n      formData.addressData.street.length > 0 &&\n      formData.addressData.houseNumber.length > 0 &&\n      formData.addressData.zipCode.length > 0 &&\n      formData.addressData.city.length > 0,\n  );\n\n  if (formData.differentDeliveryAddress) {\n    isValid.push(\n      formData.deliveryData.companyName.length > 0 &&\n        formData.deliveryData.addressData.street.length > 0 &&\n        formData.deliveryData.addressData.houseNumber.length > 0 &&\n        formData.deliveryData.addressData.zipCode.length > 0 &&\n        formData.deliveryData.addressData.city.length > 0,\n    );\n  }\n  return !isValid.includes(false);\n}\n","<template>\n  <FormSelectMultiselect\n    :id=\"context.id\"\n    :placeholder=\"context.placeholder\"\n    :value=\"context.value\"\n    :disabled=\"context.disabled\"\n    :initial-options=\"context.initialOptions\"\n    :is-loading=\"context.isLoading\"\n    :sublabel=\"context.sublabel\"\n    :searchable=\"false\"\n    @on-value-changed=\"handleValueChanged\"\n  ></FormSelectMultiselect>\n</template>\n\n<script setup lang=\"ts\">\nimport FormSelectMultiselect from '@/components/form/select/multiselect.vue';\n\nconst props = defineProps({\n  // eslint-disable-next-line vue/require-default-prop\n  context: Object,\n});\n\nfunction handleValueChanged(event: any) {\n  props.context.node.input(event);\n}\n</script>\n","<template>\n  <div class=\"multiselect-custom-wrapper\">\n    <FormKit\n      :id=\"`manufacturer-select-${index}`\"\n      :type=\"multiselect\"\n      :label=\"t('repairshopForm.toolFields.manufacturer.label')\"\n      :placeholder=\"t('repairshopForm.toolFields.genericPlaceholder')\"\n      :value=\"form.tools[index].manufacturer\"\n      name=\"manufacturer\"\n      :initial-options=\"data.manufacturers.data\"\n      :disabled=\"data.manufacturers.isLoading\"\n      :is-loading=\"data.manufacturers.isLoading\"\n      :validation-messages=\"{\n        required: t('repairshopForm.toolFields.manufacturer.errorLabel'),\n        validation: t('repairshopForm.toolFields.manufacturer.errorLabel'),\n      }\"\n      input-class=\"input rounded-corners\"\n      inner-class=\"relative pt-[5px]\"\n      validation-visibility=\"blur\"\n      validation=\"required\"\n      label-class=\"text-md !leading-[19px] font-bold\"\n      @input=\"handleValueChanged($event, index)\"\n    />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport { useRepairshopData } from '~/components/form/repairshop/composables/useRepairshopData';\nimport { createInput, FormKit } from '@formkit/vue';\nimport customMultiselect from '~/components/form/select/customMultiselect.vue';\n\nconst { t } = useTrans();\nconst { formData: form } = await useFormData();\nconst data = useRepairshopData();\n\nconst props = defineProps({\n  index: {\n    type: Number,\n    required: true,\n    default: 0,\n  },\n});\n\nconst multiselect = createInput(customMultiselect, {\n  props: ['initialOptions', 'label', 'placeholder', 'value', 'id', 'disabled'],\n});\n\nfunction handleValueChanged(event: any, index: number) {\n  form.value.tools[index].manufacturer = event;\n  resetFormData();\n}\n\nfunction resetFormData() {\n  form.value.tools[props.index].device = null;\n}\n</script>\n<style lang=\"postcss\" scoped>\n.multiselect-custom-wrapper :deep(.multiselect__tags) {\n  @apply rounded-alt-sm;\n}\n\n.multiselect-custom-wrapper\n  :deep(.formkit-outer:has(> .formkit-messages) .multiselect__tags) {\n  @apply rounded-b-none;\n}\n\n.multiselect-custom-wrapper\n  :deep(\n    .multiselect-custom:has(> .multiselect--active:not(.multiselect--above))\n      .multiselect__tags\n  ) {\n  @apply rounded-b-none !important;\n}\n\n.multiselect-custom-wrapper\n  :deep(\n    .multiselect-custom:has(> .multiselect--active.multiselect--above)\n      .multiselect__tags\n  ) {\n  @apply rounded-t-none !important;\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__option--highlight) {\n  color: var(--thm-text-base);\n  background: var(--thm-primary-lighter);\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__option--highlight:after) {\n  color: var(--thm-text-base);\n  background: var(--thm-primary-lighter);\n}\n.multiselect-custom-wrapper\n  :deep(.multiselect__option--highlight.multiselect__option--selected) {\n  color: var(--thm-white-base);\n  background: var(--thm-primary-base);\n}\n\n.multiselect-custom-wrapper\n  :deep(.multiselect__option--highlight.multiselect__option--selected:after) {\n  color: var(--thm-white-base);\n  background: var(--thm-primary-base);\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__spinner:before) {\n  border-color: var(--thm-primary-base) transparent transparent !important;\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__spinner:after) {\n  border-color: var(--thm-primary-base) transparent transparent !important;\n}\n</style>\n","<template>\n  <div class=\"multiselect-custom-wrapper\">\n    <FormKit\n      :id=\"`device-select-${index}`\"\n      :type=\"multiselect\"\n      :label=\"t('repairshopForm.toolFields.device.label')\"\n      :placeholder=\"t('repairshopForm.toolFields.genericPlaceholder')\"\n      :value=\"form.tools[index].device\"\n      name=\"manufacturer\"\n      :initial-options=\"options\"\n      :is-loading=\"data.devices.isLoading\"\n      :disabled=\"\n        !form.tools[index].manufacturer ||\n        form.tools[index].manufacturer.value.length === 0\n      \"\n      :validation-messages=\"{\n        required: t('repairshopForm.toolFields.device.errorLabel'),\n        validation: t('repairshopForm.toolFields.device.errorLabel'),\n      }\"\n      input-class=\"input rounded-corners\"\n      :inner-class=\"`relative pt-[5px] ${innerClass}`\"\n      validation-visibility=\"blur\"\n      validation=\"required\"\n      label-class=\"text-md !leading-[19px] font-bold\"\n      @input=\"handleValueChanged($event, index)\"\n    />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport type { OptionType } from '~/components/form/repairshop/utils/formTypes';\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport { useRepairshopData } from '~/components/form/repairshop/composables/useRepairshopData';\nimport { createInput, FormKit } from '@formkit/vue';\nimport customMultiselect from '~/components/form/select/customMultiselect.vue';\n\nconst { t } = useTrans();\nconst { formData: form } = await useFormData();\nconst data = useRepairshopData();\nconst options = ref<OptionType[]>([]);\n\nconst props = defineProps({\n  index: {\n    type: Number,\n    required: true,\n  },\n  innerClass: {\n    type: String,\n    required: false,\n    default: '',\n  },\n});\n\nconst multiselect = createInput(customMultiselect, {\n  props: [\n    'initialOptions',\n    'label',\n    'placeholder',\n    'value',\n    'id',\n    'disabled',\n    'sublabel',\n  ],\n});\n\nwatch(\n  () => form.value.tools[props.index]?.manufacturer,\n  (newManufacturer, oldManufacturer) => {\n    if (newManufacturer !== oldManufacturer) {\n      if (!newManufacturer) {\n        options.value = [];\n        return;\n      }\n\n      options.value = data.value.devices.data[\n        form.value.tools[props.index].manufacturer.value\n      ] as OptionType[];\n    }\n  },\n);\n\nonMounted(() => {\n  if (form.value.tools[props.index]?.manufacturer) {\n    options.value = data.value.devices.data[\n      form.value.tools[props.index].manufacturer.value\n    ] as OptionType[];\n  }\n});\n\nfunction handleValueChanged(event: any, index: number) {\n  form.value.tools[index].device = event;\n}\n</script>\n<style lang=\"postcss\" scoped>\n.multiselect-custom-wrapper :deep(.multiselect__tags) {\n  @apply rounded-alt-sm;\n}\n\n.multiselect-custom-wrapper :deep(.multiselect--disabled) {\n  @apply rounded-alt-sm;\n}\n\n.multiselect-custom-wrapper\n  :deep(.formkit-outer:has(> .formkit-messages) .multiselect__tags) {\n  @apply rounded-b-none;\n}\n\n.multiselect-custom-wrapper\n  :deep(\n    .multiselect-custom:has(> .multiselect--active:not(.multiselect--above))\n      .multiselect__tags\n  ) {\n  @apply rounded-b-none !important;\n}\n\n.multiselect-custom-wrapper\n  :deep(\n    .multiselect-custom:has(> .multiselect--active.multiselect--above)\n      .multiselect__tags\n  ) {\n  @apply rounded-t-none !important;\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__option--highlight) {\n  color: var(--thm-text-base);\n  background: var(--thm-primary-lighter);\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__option--highlight:after) {\n  color: var(--thm-text-base);\n  background: var(--thm-primary-lighter);\n}\n.multiselect-custom-wrapper\n  :deep(.multiselect__option--highlight.multiselect__option--selected) {\n  color: var(--thm-white-base);\n  background: var(--thm-primary-base);\n}\n\n.multiselect-custom-wrapper\n  :deep(.multiselect__option--highlight.multiselect__option--selected:after) {\n  color: var(--thm-white-base);\n  background: var(--thm-primary-base);\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__spinner:before) {\n  border-color: var(--thm-primary-base) transparent transparent !important;\n}\n\n.multiselect-custom-wrapper :deep(.multiselect__spinner:after) {\n  border-color: var(--thm-primary-base) transparent transparent !important;\n}\n\n.formkit-outer:has(> .formkit-messages) .rounded-corners {\n  @apply rounded-b-none;\n}\n</style>\n","<template>\n  <div class=\"mt-xl mb-md\">\n    <div\n      id=\"form-price\"\n      class=\"py-md bg-[#FFFFFFBF] basis-full h-full relative text-text-base flex justify-center ml-[-30px] mr-[-30px] md:ml-[-240px] md:mr-[-240px]\"\n    >\n      <div\n        class=\"mx-[20px] sm:px-0 sm:w-[450px] sm:max-w-[450px] sm:min-w-[450px]\"\n      >\n        <div class=\"w-full\">\n          <div class=\"flex flex-row\">\n            <div class=\"basis-2/3 shrink-0\">\n              {{ t('repairshopForm.pricebox.subSum') }}\n            </div>\n            <div\n              class=\"flex justify-end font-bold basis-1/3 shrink-0\"\n              :class=\"classes\"\n            >\n              {{ n(subtotalCosts, 'currency') }}\n            </div>\n          </div>\n\n          <div class=\"flex flex-row pt-sm\">\n            <div class=\"basis-2/3 shrink-0\">\n              {{ t('repairshopForm.pricebox.shippingCosts') }}\n            </div>\n            <div class=\"flex justify-end basis-1/3 shrink-0\" :class=\"classes\">\n              {{ n(shippingCosts, 'currency') }}\n            </div>\n          </div>\n\n          <div class=\"py-md\">\n            <hr class=\"w-full border-t-[1px] border-black\" />\n          </div>\n\n          <div class=\"flex flex-row\">\n            <div class=\"basis-2/3 shrink-0\">\n              <p class=\"font-bold\">\n                {{ t('repairshopForm.pricebox.totalSum') }}\n              </p>\n              <p>{{ t('repairshopForm.pricebox.totalSumInfo') }}</p>\n            </div>\n            <div\n              class=\"basis-1/3 shrink-0 flex justify-end font-bold text-[32px]\"\n              :class=\"classes\"\n            >\n              {{ n(totalCosts, 'currency') }}\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport {\n  usePriceData,\n  setPriceData,\n} from '~/components/form/repairshop/composables/usePriceData';\n\ndefineProps({\n  classes: {\n    type: String,\n    required: false,\n    default: '',\n  },\n});\n\nconst languageCode = useNuxtApp().$languageCode;\nconst { formData } = await useFormData();\nconst costs = usePriceData(languageCode);\nconst { n, t } = useTrans();\n\nsetPriceData(formData.value.tools, languageCode);\nconst subtotalCosts = computed<number>(() => {\n  return costs.value.subtotal;\n});\n\nconst shippingCosts = computed<number>(() => {\n  return costs.value.shipping;\n});\n\nconst totalCosts = computed<number>(() => {\n  return costs.value.total;\n});\n\nwatch(formData.value.tools, () => {\n  setPriceData(formData.value.tools, languageCode);\n});\n</script>\n","<template>\n  <div class=\"w-full text-border-dark px-sm md:px-0\" :class=\"classes\">\n    <p><sup class=\"pr-[5px]\">*</sup>{{ t('repairshopForm.footNoteText1') }}</p>\n    <br />\n    <p>\n      {{ t('repairshopForm.footNoteText2') }}\n    </p>\n    <br />\n    <p>\n      <strong>{{ t('repairshopForm.priceGuarantee') }}:</strong>\n      <br />{{ t('repairshopForm.footNoteText3') }}\n    </p>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nconst { t } = useTrans();\n\ndefineProps({\n  classes: {\n    type: String,\n    required: false,\n    default: '',\n  },\n});\n</script>\n","<template>\n  <div class=\"flex flex-col max-w-[930px] mx-auto py-xl bg-activesection-base\">\n    <div class=\"px-[30px] md:px-[240px]\">\n      <div class=\"mb-xl\">\n        <Headline\n          :headline=\"t('repairshopForm.headline')\"\n          :has-decoration=\"true\"\n          level=\"h2\"\n          logo-color-main=\"#FFFFFF\"\n          logo-color-second=\"#FFFFFF\"\n          text-color=\"!text-white\"\n          stroke-color=\"#FFFFFF\"\n          class=\"fill-white stroke-white\"\n        />\n\n        <WYSIWYGContentRaw\n          v-if=\"useSiteIdent() === SiteIdent.default\"\n          class=\"pt-sm\"\n          :content=\"t('repairshopForm.introText')\"\n          :no-container-padding=\"true\"\n        />\n      </div>\n\n      <div class=\"w-full\">\n        <div>\n          <div class=\"relative flex items-center mb-md\">\n            <HeadlineDashed\n              class=\"whitespace-nowrap\"\n              headline=\"repairshopForm.toolFields.headline\"\n            />\n          </div>\n\n          <div>\n            <FormKit id=\"repairshop-tools\" type=\"group\">\n              <FormKit ref=\"tools\" type=\"list\">\n                <div class=\"flex flex-col px-0\">\n                  <div\n                    v-for=\"(row, index) in form.tools\"\n                    :key=\"row.id\"\n                    class=\"flex flex-col md:flex-row bg-[#ffffff19] mb-5 py-sm px-sm md:items-center rounded-alt-lg\"\n                  >\n                    <div class=\"flex flex-col w-full\">\n                      <FormRepairshopFieldsManufacturerSelect\n                        class=\"mb-sm\"\n                        :index=\"index\"\n                      />\n\n                      <FormRepairshopFieldsDeviceSelect\n                        class=\"mb-sm\"\n                        inner-class=\"!text-white\"\n                        :index=\"index\"\n                      />\n\n                      <div class=\"mb-sm\">\n                        <FormKit\n                          id=\"customer-number\"\n                          v-model=\"form.tools[index].serialNumber\"\n                          type=\"text\"\n                          :label=\"\n                            t('repairshopForm.toolFields.serialNumber.label')\n                          \"\n                          placeholder=\"123456789\"\n                          input-class=\"w-full input\"\n                          inner-class=\"relative pt-[5px]\"\n                          label-class=\"text-md !leading-[19px] font-bold\"\n                        />\n                      </div>\n\n                      <div>\n                        <FormKit\n                          id=\"issue-description\"\n                          v-model=\"form.tools[index].infoText\"\n                          type=\"textarea\"\n                          :label=\"t('repairshopForm.toolFields.infoText.label')\"\n                          input-class=\"w-full input !h-44 focus:!h-44\"\n                          inner-class=\"relative pt-[5px]\"\n                          validation=\"required\"\n                          validation-visibility=\"blur\"\n                          :validation-messages=\"{\n                            required: t(\n                              'repairshopForm.toolFields.infoText.errorLabel',\n                            ),\n                            validation: t(\n                              'repairshopForm.toolFields.infoText.errorLabel',\n                            ),\n                          }\"\n                          label-class=\"text-md !leading-[19px] font-bold\"\n                          :outer-class=\"'multiline-input-text'\"\n                        />\n                      </div>\n                    </div>\n\n                    <div\n                      class=\"flex items-center justify-center h-full pl-0 pt-sm md:pb-0 md:pl-sm md:justify-end\"\n                    >\n                      <BasicButtonIcon\n                        icon=\"fal fa-circle-minus\"\n                        button-classes=\"bg-transparent\"\n                        :btn-style=\"EButtonStyle.CTA\"\n                        icon-classes=\"text-[1.5rem]\"\n                        classes=\"bg-transparent\"\n                        @click=\"handleRemoveEntry(index)\"\n                      />\n                    </div>\n                  </div>\n                </div>\n              </FormKit>\n            </FormKit>\n            <div class=\"w-full\">\n              <BasicButton\n                label=\"Weiteres Instrument hinzufügen\"\n                classes=\"w-full mt-3 px-0\"\n                icon=\"far fa-plus\"\n                :btn-style=\"EButtonStyle.FORMREPEATER\"\n                :icon-position=\"EPosition.LEFT\"\n                :full-width=\"true\"\n                @click=\"handleAddEntry()\"\n              />\n\n              <div\n                v-if=\"showMaxInstrumentsHint\"\n                class=\"w-full text-center formkit-outer\"\n              >\n                <ul class=\"formkit-messages\">\n                  <li class=\"formkit-message\" data-message-type=\"validation\">\n                    {{ t('repairshopForm.maxInstrumentsHint') }}\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </div>\n\n          <FormRepairshopFieldsPrice classes=\"font-deco-alt\" />\n\n          <div class=\"pt-sm mb-xl\">\n            <BasicButton\n              classes=\"w-full px-sm md:px-0\"\n              :label=\"t('repairshopForm.submitLabel')\"\n              :type=\"EButtonType.BUTTON\"\n              :btn-style=\"EButtonStyle.CTA\"\n              btn-class=\"!mx-0\"\n              :loading-animation=\"isLoading\"\n              :disabled=\"isLoading\"\n              :full-width=\"true\"\n              @click=\"checkValidity\"\n            />\n          </div>\n\n          <div class=\"text-sm mb-xl\">\n            {{ t('forms.captcha.google.intro') }}\n            <a\n              class=\"underline\"\n              href=\"https://policies.google.com/privacy\"\n              target=\"_blank\"\n            >\n              {{ t('forms.captcha.google.privacy') }}\n            </a>\n            &\n            <a\n              class=\"underline\"\n              href=\"https://policies.google.com/terms\"\n              target=\"_blank\"\n            >\n              {{ t('forms.captcha.google.terms') }}.\n            </a>\n          </div>\n\n          <RepairshopPriceInfo class=\"!text-white\" classes=\"text-border-dark\" />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { v4 as uuidv4 } from 'uuid';\nimport { EButtonStyle, EButtonType, EPosition } from '@/@types/basic-button';\n\nimport FormRepairshopFieldsManufacturerSelect from '@/components/form/repairshop/components/form-fields/manufacturer-select.vue';\nimport FormRepairshopFieldsDeviceSelect from '@/components/form/repairshop/components/form-fields/device-select.vue';\nimport FormRepairshopFieldsPrice from '~/components/form/repairshop/components/price/form-overview.vue';\nimport RepairshopPriceInfo from '@/components/form/repairshop/components/price/info-text.vue';\nimport { Headline, HeadlineDashed, WYSIWYGContentRaw } from '@/complib';\nimport BasicButton from '~~/src/components/components/core/basic-button/basic-button.vue';\nimport BasicButtonIcon from '@/components/components/core/basicButtonIcon/basic-button-icon.vue';\n\nimport type { ToolType } from '~/components/form/repairshop/utils/formTypes';\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport { useRedirectData } from '~/stores/useRedirectData';\nimport { FormKit } from '@formkit/vue';\nimport type { FormBlockData } from '~/components/components/cms/form/blockType';\nimport { SiteIdent } from '~/utils/types';\n\nconst props = defineProps({\n  blockData: {\n    type: Object as PropType<FormBlockData>,\n    required: true,\n    default: {} as FormBlockData,\n  },\n});\n\nconst pageData = usePageData();\nconst MAX_INSTRUMENTS = 10;\nconst { formData: form } = await useFormData();\nconst isLoading = ref(false);\nconst { t } = useTrans();\nconst tools = ref(null);\nconst showMaxInstrumentsHint = ref(false);\n\nfunction handleAddEntry() {\n  // We need to set submitted state to true for all repeater fields\n  // Otherwise field will not be validated\n  validateData();\n\n  if (form.value?.tools?.length >= MAX_INSTRUMENTS) {\n    showMaxInstrumentsHint.value = true;\n    return;\n  }\n\n  form.value.tools.push({\n    id: uuidv4() as string,\n    manufacturer: null,\n    device: null,\n    serialNumber: '',\n    infoText: '',\n  } as ToolType);\n}\n\nfunction handleRemoveEntry(index: number) {\n  if (form.value.tools.length > 1) {\n    form.value.tools.splice(index, 1);\n    showMaxInstrumentsHint.value = false;\n  } else {\n    form.value.tools[index].manufacturer = null;\n    form.value.tools[index].device = null;\n    form.value.tools[index].serialNumber = '';\n    form.value.tools[index].infoText = '';\n  }\n}\n\nasync function checkValidity() {\n  isLoading.value = true;\n  const invalidElements: any[] = [];\n\n  // We need to set submitted state to true for all repeater fields\n  // Otherwise field will not be validated\n  tools.value.node.children.forEach((field: any) => {\n    field.context.state.submitted = true;\n    if (!field.context.state.valid) {\n      invalidElements.push(field);\n    }\n  });\n\n  if (!tools.value.node.context.state.valid) {\n    const firstInvalidFieldNode = document\n      .getElementById(invalidElements[0].context.id)\n      .closest('.formkit-outer');\n\n    if (firstInvalidFieldNode) {\n      firstInvalidFieldNode.scrollIntoView({\n        behavior: 'smooth',\n      });\n    }\n    isLoading.value = false;\n    return;\n  }\n\n  isLoading.value = false;\n\n  useRedirectData().setData<any>({\n    key: useRoute().path,\n    value: {\n      source: useRoute().path,\n      target: '/repairshop/checkout',\n      data: { blockData: props.blockData, pageData: pageData.value },\n    },\n  });\n  useRouter().push({\n    path: '/repairshop/checkout',\n    hash: '#repairshop-address',\n    query: { sourceUrl: useRoute().path },\n  });\n}\n\nfunction validateData() {\n  tools.value.node.children.forEach((field: any) => {\n    field.context.state.submitted = true;\n  });\n}\n</script>\n","<template>\n  <div class=\"thm-container-basic__content\">\n    <Headline\n      :headline=\"t('repairshopForm.pricelist')\"\n      :has-decoration=\"true\"\n      :logo-color=\"'#ffffff'\"\n      level=\"h2\"\n      :container-classes=\"'mb-md'\"\n    />\n\n    <p class=\"text-center\">\n      {{ t('repairshopForm.repair-festpreis', { price: deviceMinPrice }) }}\n    </p>\n\n    <div class=\"my-lg px-sm md:px-0\">\n      <div\n        v-if=\"\n          !repairshopData.manufacturers.isLoading &&\n          repairshopData.manufacturers.isInitialized &&\n          !repairshopData.devices.isLoading &&\n          repairshopData.devices.isInitialized\n        \"\n      >\n        <div\n          v-for=\"manufacturer in repairshopData.manufacturers.data\"\n          :key=\"manufacturer.value\"\n        >\n          <div\n            v-if=\"repairshopData.devices.data[manufacturer.value]?.length >= 1\"\n            class=\"grid items-center grid-cols-12 border-white cursor-pointer py-2xs border-t-1 border-r-1 border-l-1 my-sm px-md\"\n            :class=\"[\n              manufacturer.isOpen\n                ? '!bg-activesection-base !text-white !font-bold'\n                : '!bg-grey-lighter !text-text-base',\n              {\n                'rounded-md': useSiteIdent() === SiteIdent.default,\n                'rounded-sm': useSiteIdent() !== SiteIdent.default,\n              },\n            ]\"\n            @click=\"toggleVisibility(manufacturer.value, $el)\"\n          >\n            <p class=\"col-span-10\">{{ manufacturer.label }}</p>\n            <div v-show=\"manufacturer.isOpen\" class=\"col-span-2 ml-auto\">\n              <Icon icon-class=\"fal fa-angle-up\" classes=\"mx-auto\" />\n            </div>\n            <div v-show=\"!manufacturer.isOpen\" class=\"col-span-2 ml-auto\">\n              <Icon icon-class=\"fal fa-angle-down\" classes=\"mx-auto\" />\n            </div>\n          </div>\n          <div\n            v-if=\"manufacturer.isOpen\"\n            class=\"overflow-hidden bg-white text-text-base max-h-[100vh] pb-lg\"\n          >\n            <div\n              class=\"grid grid-cols-6 font-bold border-b-2 md:grid-cols-12 py-xs\"\n            >\n              <div class=\"col-span-4 text-left md:col-span-9 pl-md\">\n                {{ t('repairshopForm.listTableHeaderDescription') }}\n              </div>\n              <div class=\"col-span-2 text-right md:col-span-3 pr-md\">\n                {{ t('repairshopForm.listTableHeaderPrice') }}\n              </div>\n            </div>\n\n            <div\n              v-for=\"(device, index) in repairshopData.devices.data[\n                manufacturer.value\n              ]\"\n              :key=\"index\"\n              :class=\"{\n                'border-none':\n                  index ===\n                  repairshopData.devices.data[manufacturer.value].length - 1,\n              }\"\n              class=\"grid grid-cols-6 border-b-2 md:grid-cols-12 py-xs\"\n            >\n              <div class=\"col-span-4 text-left md:col-span-9 pl-md\">\n                {{ device.label }}\n              </div>\n              <div\n                class=\"flex justify-end col-span-2 text-right md:col-span-3 md:text-center md:pl-md md:pr-20 pr-md\"\n              >\n                {{ n(device.price, 'currency') }}\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div\n        v-else\n        class=\"bg-white border border-gray-300 border-solid p-sm animate-pulse\"\n      >\n        <div class=\"h-[36px] bg-gray-300 mb-sm\"></div>\n        <div class=\"h-[36px] bg-gray-300 mb-sm\"></div>\n        <div class=\"h-[36px] bg-gray-300 mb-sm\"></div>\n        <div class=\"h-[36px] bg-gray-300\"></div>\n      </div>\n    </div>\n\n    <RepairshopPriceInfo class=\"text-sm\" classes=\"text-border-dark\" />\n  </div>\n</template>\n<script setup lang=\"ts\">\nimport { scrollToElement } from '@/helpers/scroll';\nimport { useRepairshopData } from '~/components/form/repairshop/composables/useRepairshopData';\nimport type { OptionType } from '@/components/form/repairshop/utils/formTypes';\n\nimport { Headline, Icon } from '@/complib';\nimport RepairshopPriceInfo from '~/components/form/repairshop/components/price/info-text.vue';\nimport { SiteIdent } from '~/utils/types';\n\nconst { t, n } = useTrans();\nconst repairshopData = useRepairshopData();\n\nfunction toggleVisibility(id: number, el: Element): void {\n  const manu = repairshopData.value.manufacturers.data.find(\n    (m: any) => m.value === id,\n  );\n  if (!manu.isOpen) {\n    accordionOpenHandler(id, el);\n  } else {\n    accordionCloseHandler(id);\n  }\n}\n\nfunction accordionOpenHandler(accordionId: number, el: Element): void {\n  scrollToElement(el, 200);\n  accordionOpen(accordionId);\n}\n\nfunction accordionCloseHandler(accordionId: number): void {\n  accordionClose(accordionId);\n}\n// Extend these functions and introduce a settings-prop if you need more control over when accordions auto-close\nfunction accordionOpen(accordionId: number): void {\n  repairshopData.value.manufacturers.data.map((accordion: any) => {\n    accordion.isOpen = accordion.value === accordionId;\n    return accordion;\n  });\n}\n\nfunction accordionClose(accordionId: number): void {\n  repairshopData.value.manufacturers.data.find(\n    (x: any) => x.value === accordionId,\n  ).isOpen = false;\n}\n\nconst deviceMinPrice = computed(() => {\n  if (\n    !repairshopData.value.devices.isInitialized ||\n    repairshopData.value.devices.isLoading\n  ) {\n    return 0;\n  }\n\n  if (Object.keys(repairshopData.value.devices.data).length === 0) {\n    return 0;\n  }\n\n  // Get min price from repairshopData.value.devices.data\n  const devicePrices = Object.values(repairshopData.value.devices.data)\n    .flat()\n    .map((device) => Number((device as OptionType).price));\n\n  return Math.min(...devicePrices);\n});\n</script>\n\n<style>\n.thm-container-basic__content {\n  @apply h-full w-full desktop:md:max-w-screen-md desktop:lg:max-w-screen-lg touch:md:max-w-screen-lg mx-auto;\n}\n</style>\n","<template>\n  <div\n    class=\"flex-initial max-w-[451px] shrink-0 w-full mx-auto text-text-base\"\n    :class=\"{\n      'bg-[#346E7314]': useSiteIdent() === SiteIdent.default,\n      'bg-[#fce5f0]': useSiteIdent() !== SiteIdent.default,\n    }\"\n  >\n    <div\n      class=\"px-md pt-md lg:pt-[155px] touch:md:pt-[155px] pb-md lg:pb-0 touch:md:pb-0\"\n    >\n      <div>\n        <h4\n          class=\"mb-md\"\n          :class=\"{\n            'text-[20px]': useSiteIdent() === SiteIdent.default,\n            'font-pero font-bold text-[22px]':\n              useSiteIdent() !== SiteIdent.default,\n          }\"\n        >\n          {{ t('repairshopForm.pricebox.summaryHeadline') }}\n        </h4>\n        <div class=\"grid grid-cols-2 mb-sm\">\n          <div>\n            <p>\n              {{ formData.tools.length }}\n              {{\n                formData.tools.length !== 1\n                  ? t('repairshopForm.pricebox.repairOrderMulti')\n                  : t('repairshopForm.pricebox.repairOrder')\n              }}\n            </p>\n          </div>\n          <div class=\"font-bold text-right font-deco-alt\">\n            {{ n(costs.subtotal, 'currency') }}\n          </div>\n        </div>\n\n        <div class=\"grid grid-cols-2\">\n          <div>\n            <p>\n              {{ formData.tools.length > 0 ? 1 : 0 }}\n              {{ t('repairshopForm.pricebox.shippingCosts') }}\n            </p>\n          </div>\n          <div class=\"text-right font-deco-alt\">\n            {{ n(costs.shipping, 'currency') }}\n          </div>\n        </div>\n\n        <hr\n          class=\"my-sm w-full h-[1px] border-t-0\"\n          :class=\"[\n            $siteIdent.startsWith('minilu')\n              ? 'bg-border-dark'\n              : 'bg-border-light',\n          ]\"\n        />\n\n        <div class=\"grid grid-cols-2 mb-sm lg:mb-md touch:md:mb-md\">\n          <div>\n            <div class=\"font-bold\">\n              {{ t('repairshopForm.pricebox.totalSum') }}\n            </div>\n            <div class=\"text-sm text-[#707070]\">\n              {{ t('repairshopForm.pricebox.totalSumInfo') }}\n            </div>\n          </div>\n          <div class=\"font-bold text-right font-deco-alt\">\n            {{ n(costs.total, 'currency') }}\n          </div>\n        </div>\n\n        <div class=\"grid grid-cols-2 mb-sm lg:mb-md touch:md:mb-md\">\n          <div>\n            <p>\n              {{ t('repairshopForm.pricebox.vatInfo', { tax: costs.tax }) }}\n            </p>\n          </div>\n          <div class=\"text-right font-deco-alt\">\n            {{ n(costs.total * (costs.tax / 100), 'currency') }}\n          </div>\n        </div>\n\n        <div class=\"grid grid-cols-2 mb-sm lg:mb-md touch:md:mb-md\">\n          <div>\n            <div class=\"font-bold\">\n              {{ t('repairshopForm.pricebox.totalSumGross') }}\n            </div>\n            <div class=\"text-sm text-[#707070]\">\n              {{ t('repairshopForm.pricebox.totalSumGrossInfo') }}\n            </div>\n          </div>\n          <div class=\"text-3xl font-bold text-right font-deco-alt\">\n            {{ n(costs.total * (1 + costs.tax / 100), 'currency') }}\n          </div>\n        </div>\n      </div>\n\n      <slot />\n\n      <div v-if=\"!lastStep\" class=\"py-md\">\n        <h4 class=\"font-deco-alt\">\n          {{ t('repairshopForm.pricebox.repairServicesHeadline') }}\n        </h4>\n\n        <hr\n          class=\"lg:hidden touch:md:hidden w-full mt-sm border-t-[1px] border-dashed border-border-light\"\n        />\n\n        <template v-for=\"tool of formData.tools\" :key=\"tool.id\">\n          <div class=\"flex mt-md mb-md last:mb-0\">\n            <img\n              :src=\"getIconByHandle(tool.device.handle)\"\n              class=\"w-[60px]\"\n              loading=\"lazy\"\n              alt=\"\"\n            />\n            <div class=\"w-full px-sm lg:px-md touch:md:px-md\">\n              <span class=\"block font-bold\">{{ tool.device.label }}</span>\n              <span class=\"block\">{{ tool.manufacturer.label }}</span>\n              <span v-if=\"tool.serialNumber.length > 0\" class=\"block\">\n                {{ t('repairshopForm.pricebox.serialNumber') }}:\n                {{ tool.serialNumber }}\n              </span>\n            </div>\n            <div\n              class=\"text-right font-deco-alt\"\n              :class=\"{\n                'text-[18px] font-bold': useSiteIdent() !== SiteIdent.default,\n              }\"\n            >\n              {{ n(parseFloat(tool.device.price), 'currency') }}\n            </div>\n          </div>\n        </template>\n      </div>\n    </div>\n    <div\n      v-if=\"lastStep\"\n      class=\"text-[14px] bg-white lg:bg-transparent touch:md:bg-transparent px-md pt-md lg:py-0 touch:md:my-0 pb-xl\"\n    >\n      <Trans keypath=\"forms.termsDescriptionRepairshop\" tag=\"span\">\n        <a href=\"/agb\" target=\"_blank\" class=\"font-bold text-primary-base\">\n          {{ t('forms.agb') }}\n        </a>\n        <a\n          href=\"/datenschutz\"\n          target=\"_blank\"\n          class=\"font-bold text-primary-base\"\n        >\n          {{ t('forms.privacy') }}\n        </a>\n      </Trans>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { getIconByHandle } from '~/components/form/repairshop/utils/iconMapper';\nimport { usePriceData } from '~/components/form/repairshop/composables/usePriceData';\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport Trans from '@/components/Trans.vue';\nimport { SiteIdent } from '~/utils/types';\n\nconst { t, n } = useTrans();\nconst languageCode = useNuxtApp().$languageCode;\nconst costs = usePriceData(languageCode);\nconst { formData } = await useFormData();\n\ndefineProps({\n  lastStep: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n});\n</script>\n","<template>\n  <div>\n    <p :id=\"id\" ref=\"textNode\" class=\"line-clamp-2 break-all italic\">\n      {{ text }}\n    </p>\n    <a\n      v-if=\"isTextExpandable\"\n      class=\"cursor-pointer pt-3\"\n      :class=\"textColor\"\n      @click=\"expandText()\"\n    >\n      <span>{{ expandableLinkText }}</span>\n      <FaIcon\n        :classes=\"`pl-2 ${isTextExpanded ? 'rotate-180' : 'transform-none'}`\"\n        icon-class=\"fal fa-angle-down\"\n      />\n    </a>\n  </div>\n</template>\n<script setup lang=\"ts\">\nimport FaIcon from '@/components/fa-icon.vue';\ndefineProps({\n  id: {\n    type: String,\n    required: true,\n  },\n  text: {\n    type: String,\n    required: true,\n  },\n  textColor: {\n    type: String,\n    required: false,\n    default: 'text-text-base',\n  },\n});\n\nconst textNode = ref(null);\nconst isTextExpandable = ref(false);\nconst isTextExpanded = ref(false);\n\nonMounted(() => {\n  if (!textNode.value) {\n    return;\n  }\n\n  isTextExpandable.value =\n    textNode.value.offsetHeight < textNode.value.scrollHeight ||\n    textNode.value.offsetWidth < textNode.value.scrollWidth;\n});\n\nconst expandableLinkText = computed(() => {\n  return isTextExpanded.value ? 'Weniger anzeigen' : 'Mehr anzeigen';\n});\n\nfunction expandText() {\n  if (textNode.value.classList.contains('line-clamp-2')) {\n    textNode.value.classList.remove('line-clamp-2');\n  } else {\n    textNode.value.classList.add('line-clamp-2');\n  }\n\n  isTextExpanded.value = !isTextExpanded.value;\n}\n</script>\n\n<style lang=\"postcss\" scoped>\n.line-clamp-2 {\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n}\n</style>\n","<template>\n  <div\n    class=\"flex flex-col w-full gap-x-md lg:flex-row touch:md:flex-row lg:px-sm touch:md:px-sm shrink-0\"\n  >\n    <!-- Left col -->\n    <div\n      class=\"flex-initial max-w-[930px] w-full px-sm pt-lg lg:pt-2xl touch:md:pt-2xl\"\n    >\n      <div>\n        <div class=\"mt-xl mb-md lg:mb-lg touch:md:mt-lg\">\n          <Headline\n            :has-decoration=\"true\"\n            :headline=\"t('repairshopForm.overview.headline')\"\n            level=\"h1\"\n          />\n        </div>\n\n        <!-- Address overview -->\n        <div\n          class=\"grid grid-cols-1 lg:grid-cols-2 touch:md:grid-cols-2 gap-md mb-xl\"\n        >\n          <div\n            class=\"relative border-[#CBCBCB] border-1 border-solid p-sm cursor-pointer rounded-alt-lg\"\n            @click=\"routeToAddress()\"\n          >\n            <div class=\"absolute right-0\">\n              <BasicLink\n                :label=\"t('repairshopForm.overview.edit')\"\n                :link=\"$router.currentRoute.value.path\"\n                hash=\"#repairshop-address\"\n                target=\"_self\"\n                icon=\"fas fa-chevron-right\"\n                :icon-position=\"EPosition.RIGHT\"\n                class=\"font-text text-primary-base pr-sm\"\n              />\n            </div>\n            <h4 class=\"mb-md font-deco-alt\">\n              {{ t('repairshopForm.overview.invoiceAddress') }}\n            </h4>\n            <div class=\"mb-md\">\n              <p>{{ formData.companyName }}</p>\n              <p>\n                {{ formData.addressData.street }}\n                {{ formData.addressData.houseNumber }}\n              </p>\n              <p>\n                {{ formData.addressData.zipCode }}\n                {{ formData.addressData.city }}\n              </p>\n            </div>\n\n            <div>\n              <p v-if=\"formData.contactData.customerNumber\">\n                {{ formData.contactData.customerNumber }}\n              </p>\n              <p>{{ formData.contactData.customerEmail }}</p>\n              <p>{{ formData.contactData.customerPhone }}</p>\n            </div>\n          </div>\n\n          <div\n            class=\"relative border-[#CBCBCB] border-1 border-solid p-sm cursor-pointer rounded-alt-lg\"\n            @click=\"routeToAddress()\"\n          >\n            <div class=\"absolute right-0\">\n              <BasicLink\n                :label=\"t('repairshopForm.overview.edit')\"\n                :link=\"$router.currentRoute.value.path\"\n                hash=\"#repairshop-address\"\n                target=\"_self\"\n                icon=\"fas fa-chevron-right\"\n                :icon-position=\"EPosition.RIGHT\"\n                class=\"font-text text-primary-base pr-sm\"\n              />\n            </div>\n            <h4 class=\"mb-md font-deco-alt\">\n              {{ t('repairshopForm.overview.deliveryAddress') }}\n            </h4>\n            <div>\n              <p>\n                {{\n                  formData.differentDeliveryAddress\n                    ? formData.deliveryData.companyName\n                    : formData.companyName\n                }}\n              </p>\n              <p>\n                {{\n                  formData.differentDeliveryAddress\n                    ? formData.deliveryData.addressData.street +\n                      ' ' +\n                      formData.deliveryData.addressData.houseNumber\n                    : formData.addressData.street +\n                      ' ' +\n                      formData.addressData.houseNumber\n                }}\n              </p>\n              <p>\n                {{\n                  formData.differentDeliveryAddress\n                    ? formData.deliveryData.addressData.zipCode +\n                      ' ' +\n                      formData.deliveryData.addressData.city\n                    : formData.addressData.zipCode +\n                      ' ' +\n                      formData.addressData.city\n                }}\n              </p>\n            </div>\n          </div>\n        </div>\n\n        <!-- Item list -->\n        <div class=\"mb-xl lg:mb-2xl touch:md:mb-2xl\">\n          <div class=\"grid grid-cols-12 gap-x-xs px-sm\">\n            <div class=\"col-span-6 font-bold lg:col-span-5 touch:md:col-span-5\">\n              {{ t('repairshopForm.overview.tool') }}\n            </div>\n            <div\n              class=\"hidden font-bold lg:block touch:md:block lg:col-span-5 touch:md:col-span-5\"\n            >\n              {{ t('repairshopForm.overview.issueDescription') }}\n            </div>\n            <div\n              class=\"col-span-6 font-bold text-right lg:col-span-2 touch:md:col-span-2 lg:text-center touch:md:text-center\"\n            >\n              {{ t('repairshopForm.overview.repairCosts') }}*\n            </div>\n          </div>\n\n          <hr class=\"w-full h-[1px] bg-border-dark border-t-0 mt-sm\" />\n\n          <template v-for=\"tool of formData.tools\" :key=\"tool.id\">\n            <div\n              v-if=\"tool.device && tool.manufacturer\"\n              class=\"grid grid-cols-12 gap-x-xs px-sm mt-md\"\n            >\n              <div class=\"col-span-9 lg:col-span-5 touch:md:col-span-5\">\n                <div class=\"flex items-start\">\n                  <img\n                    :src=\"getIconByHandle(tool.device.handle)\"\n                    class=\"w-[60px] lg:w-[88px] touch:md:w-[88px] h-auto\"\n                    loading=\"lazy\"\n                    alt=\"Icon\"\n                  />\n                  <div class=\"ml-sm lg:ml-md touch:md:ml-md\">\n                    <p class=\"font-bold break-all\">{{ tool.device.label }}</p>\n                    <p class=\"break-all\">{{ tool.manufacturer.label }}</p>\n                    <p v-if=\"tool.serialNumber.length > 0\" class=\"break-all\">\n                      {{ t('repairshopForm.pricebox.serialNumber') }}:\n                      {{ tool.serialNumber }}\n                    </p>\n                  </div>\n                </div>\n              </div>\n              <div\n                class=\"order-last col-span-12 lg:order-none touch:md:order-none lg:col-span-5 touch:md:col-span-5 pt-sm lg:pt-0 touch:md:pt-0\"\n              >\n                <TruncatedCollapsedText\n                  :id=\"`info-${tool.id}`\"\n                  :text=\"tool.infoText\"\n                  text-color=\"text-text-base\"\n                />\n              </div>\n              <div\n                class=\"col-span-3 font-bold text-right font-deco-alt lg:col-span-2 touch:md:col-span-2 lg:text-center touch:md:text-center\"\n              >\n                {{ n(parseFloat(tool.device.price), 'currency') }}\n              </div>\n            </div>\n          </template>\n        </div>\n\n        <!-- Price info text -->\n        <RepairshopPriceInfo\n          class=\"!text-[14px] mb-xl\"\n          classes=\"text-border-dark\"\n        />\n      </div>\n    </div>\n\n    <!-- Pricebox -->\n    <RepairshopFieldPriceBox last-step>\n      <div class=\"mb-0 lg:mb-md touch:md:mb-md\">\n        <BasicButton\n          classes=\"w-full bottom-0 z-10 lg:z-auto touch:md:z-auto fixed bottom-0 left-0 right-0 lg:relative touch:md:relative font-deco-alt\"\n          :label=\"t('repairshopForm.orderSubmitLabel')\"\n          :type=\"EButtonType.SUBMIT\"\n          :btn-style=\"EButtonStyle.CTA\"\n          :no-border-radius=\"!isDesktop\"\n          :btn-height=\"isDesktop ? '' : 'var(--sticky-btn-height)'\"\n          :disabled=\"formData.isFormSubmitting\"\n          :loading-animation=\"formData.isFormSubmitting\"\n          full-width\n        />\n      </div>\n    </RepairshopFieldPriceBox>\n  </div>\n</template>\n<script setup lang=\"ts\">\nimport { getIconByHandle } from '~/components/form/repairshop/utils/iconMapper';\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport { EButtonType, EButtonStyle } from '@/@types/basic-button';\nimport { EPosition } from '@/@types/basic-link';\n\nimport BasicButton from '~~/src/components/components/core/basic-button/basic-button.vue';\nimport { Headline } from '@/complib';\nimport BasicLink from '@/components/components/core/basicLink/basic-link.vue';\nimport RepairshopPriceInfo from '~/components/form/repairshop/components/price/info-text.vue';\nimport RepairshopFieldPriceBox from '~/components/form/repairshop/components/price/tile-view.vue';\nimport TruncatedCollapsedText from '~/components/form/repairshop/components/truncated-collapsed-text.vue';\n\nconst { t, n } = useTrans();\nconst { formData } = await useFormData();\nconst isDesktop = useIsDesktopView();\n\nfunction routeToAddress() {\n  useRouter().replace({\n    path: useRouter().currentRoute.value.path,\n    hash: '#repairshop-address',\n  });\n}\n</script>\n","<template>\n  <div\n    class=\"flex flex-col w-full touch:md:flex-row lg:flex-row touch:md:px-sm lg:px-sm shrink-0\"\n  >\n    <!-- Left col -->\n    <div\n      class=\"flex-initial max-w-[930px] w-full mx-auto pt-lg lg:pt-2xl touch:md:pt-2xl\"\n    >\n      <div class=\"w-[315px] md:w-[455px] mx-auto\">\n        <div class=\"mt-xl mb-sm\">\n          <Headline\n            :has-decoration=\"true\"\n            :headline=\"t('repairshopForm.addressForm.headline')\"\n            level=\"h1\"\n          />\n        </div>\n\n        <FormKit ref=\"addressData\" type=\"group\">\n          <div class=\"mb-md lg:mb-xl touch:md:mb-xl\">\n            <FormKit\n              id=\"company-name\"\n              v-model=\"formData.companyName\"\n              type=\"text\"\n              :label=\"t('repairshopForm.addressForm.companyLabel')\"\n              placeholder=\"Praxis Mustermann\"\n              input-class=\"input\"\n              inner-class=\"relative pt-[5px]\"\n              :validation-messages=\"{\n                required: t('repairshopForm.addressForm.companyErrorMessage'),\n              }\"\n              validation-visibility=\"blur\"\n              validation=\"required:trim\"\n              label-class=\"text-md !leading-[19px] font-bold\"\n            />\n          </div>\n\n          <!-- Address -->\n          <FormCustomHeadline\n            class=\"mb-sm\"\n            :headline=\"t('repairshopForm.addressForm.addressHeadline')\"\n            text-color=\"text-text-base font-deco-alt\"\n            border-color=\"border-text-base\"\n          />\n\n          <div class=\"flex w-full px-0 mb-md lg:mb-xl touch:md:mb-xl\">\n            <div\n              class=\"flex flex-wrap w-full pb-sm\"\n              :class=\"'hide-default-message'\"\n            >\n              <FormKit\n                id=\"address-street\"\n                ref=\"street\"\n                v-model=\"formData.addressData.street\"\n                type=\"text\"\n                :label=\"t('repairshopForm.addressForm.streetLabel')\"\n                placeholder=\"Hauptstr.\"\n                input-class=\"input\"\n                outer-class=\"pr-2 md:pr-4 basis-9/12\"\n                validation=\"required:trim\"\n                validation-visibility=\"blur\"\n                label-class=\"text-md !leading-[19px] font-bold\"\n                inner-class=\"pt-[5px]\"\n              />\n\n              <FormKit\n                id=\"address-housenumber\"\n                ref=\"houseNumber\"\n                v-model=\"formData.addressData.houseNumber\"\n                type=\"text\"\n                :label=\"t('repairshopForm.addressForm.houseNrLabel')\"\n                placeholder=\"123\"\n                input-class=\"input\"\n                outer-class=\"basis-3/12\"\n                validation=\"required:trim\"\n                validation-visibility=\"blur\"\n                label-class=\"text-md !leading-[19px] font-bold\"\n                inner-class=\"pt-[5px]\"\n              />\n\n              <template v-if=\"showStreetError\">\n                <FormCustomMessage\n                  :message=\"t('repairshopForm.addressForm.streetErrorMessage')\"\n                />\n              </template>\n\n              <FormKit\n                id=\"address-zip-code\"\n                ref=\"zipCode\"\n                v-model=\"formData.addressData.zipCode\"\n                type=\"text\"\n                :label=\"t('repairshopForm.addressForm.zipLabel')\"\n                :placeholder=\"getPlaceholderZipCode()\"\n                :validation=\"zipCodeValidationRules\"\n                validation-visibility=\"blur\"\n                input-class=\"input\"\n                :outer-class=\"'basis-3/12 mt-2'\"\n                inner-class=\"pt-[5px]\"\n                label-class=\"text-md !leading-[19px] font-bold\"\n              />\n\n              <FormKit\n                id=\"address-city\"\n                ref=\"city\"\n                v-model=\"formData.addressData.city\"\n                type=\"text\"\n                :label=\"t('repairshopForm.addressForm.cityLabel')\"\n                placeholder=\"Musterstadt\"\n                input-class=\"input\"\n                :outer-class=\"'basis-9/12 pl-2 md:pl-4 mt-2'\"\n                validation=\"required:trim\"\n                validation-visibility=\"blur\"\n                label-class=\"text-md !leading-[19px] font-bold\"\n                inner-class=\"pt-[5px]\"\n              />\n\n              <template v-if=\"showZipCodeError\">\n                <FormCustomMessage\n                  :message=\"t('repairshopForm.addressForm.zipErrorMessage')\"\n                />\n              </template>\n            </div>\n          </div>\n\n          <!-- Contact data -->\n          <FormCustomHeadline\n            class=\"mb-sm\"\n            :headline=\"t('repairshopForm.addressForm.contactDataHeadline')\"\n            text-color=\"font-deco-alt text-text-base\"\n            border-color=\"border-text-base\"\n          />\n\n          <div class=\"mb-sm\">\n            <FormKit\n              id=\"customer-number\"\n              v-model=\"formData.contactData.customerNumber\"\n              type=\"text\"\n              :label=\"t('repairshopForm.addressForm.customerNumber')\"\n              placeholder=\"123-456-789\"\n              input-class=\"input\"\n              inner-class=\"relative pt-[5px]\"\n              label-class=\"text-md !leading-[19px] font-bold\"\n            />\n          </div>\n\n          <div class=\"mb-sm\">\n            <FormKit\n              id=\"contact-mail\"\n              v-model=\"formData.contactData.customerEmail\"\n              type=\"email\"\n              :label=\"t('repairshopForm.addressForm.emailLabel')\"\n              placeholder=\"max@mustermann.de\"\n              :validation-messages=\"{\n                required: t('repairshopForm.addressForm.emailErrorMessage'),\n                validation: t('repairshopForm.addressForm.emailErrorMessage'),\n              }\"\n              validation-visibility=\"blur\"\n              validation=\"required|email\"\n              label-class=\"text-md !leading-[19px] font-bold\"\n              inner-class=\"relative pt-[5px]\"\n            />\n          </div>\n\n          <div class=\"mb-md lg:mb-xl touch:md:mb-xl\">\n            <Phone\n              id=\"contact-phone\"\n              v-model=\"formData.contactData.customerPhone\"\n              name=\"phone\"\n              :label=\"t('repairshopForm.addressForm.phoneLabel')\"\n              placeholder=\"+49 123 456789\"\n              :validation=\"'required:trim'\"\n              :required-message=\"\n                t('repairshopForm.addressForm.phoneErrorMessage')\n              \"\n              :matches-message=\"\n                t('repairshopForm.addressForm.phoneErrorMessage')\n              \"\n              :required=\"true\"\n              input-class=\"input\"\n              label-class=\"text-md !leading-[19px] font-bold\"\n              inner-class=\"relative pt-[5px]\"\n            />\n          </div>\n\n          <div class=\"pt-md lg:pt-xl touch:md:pt-xl mb-sm\">\n            <Headline\n              :has-decoration=\"true\"\n              :headline=\"t('repairshopForm.addressForm.deliveryHeadline')\"\n              level=\"h2\"\n            />\n          </div>\n\n          <div class=\"mb-md lg:mb-xl touch:md:mb-xl\">\n            <div class=\"mb-xs\">\n              <input\n                id=\"differentDeliveryAddress-no\"\n                v-model=\"formData.differentDeliveryAddress\"\n                class=\"custom-radio\"\n                type=\"radio\"\n                :value=\"false\"\n              />\n              <label for=\"differentDeliveryAddress-no\">\n                {{ t('repairshopForm.addressForm.differentDeliveryAddressNo') }}\n              </label>\n            </div>\n\n            <div>\n              <input\n                id=\"differentDeliveryAddress-yes\"\n                v-model=\"formData.differentDeliveryAddress\"\n                class=\"custom-radio\"\n                type=\"radio\"\n                :value=\"true\"\n              />\n              <label for=\"differentDeliveryAddress-yes\">\n                {{\n                  t('repairshopForm.addressForm.differentDeliveryAddressYes')\n                }}\n              </label>\n            </div>\n          </div>\n\n          <div v-if=\"formData.differentDeliveryAddress\">\n            <div class=\"mb-md lg:mb-lg touch:md:mb-lg\">\n              <FormKit\n                id=\"company-name\"\n                v-model=\"formData.deliveryData.companyName\"\n                type=\"text\"\n                :label=\"t('repairshopForm.addressForm.companyLabel')\"\n                placeholder=\"Praxis Mustermann\"\n                input-class=\"input\"\n                inner-class=\"relative pt-[5px]\"\n                :validation-messages=\"{\n                  required: t('repairshopForm.addressForm.companyErrorMessage'),\n                }\"\n                validation-visibility=\"blur\"\n                validation=\"required:trim\"\n                label-class=\"text-md !leading-[19px] font-bold\"\n              />\n            </div>\n\n            <!-- Address -->\n            <form-custom-headline\n              class=\"mb-sm\"\n              :headline=\"t('repairshopForm.addressForm.addressHeadline')\"\n              text-color=\"text-text-base\"\n              border-color=\"border-text-base\"\n            />\n\n            <div class=\"flex w-full px-0\">\n              <div\n                class=\"flex flex-wrap w-full pb-xl\"\n                :class=\"'hide-default-message'\"\n              >\n                <FormKit\n                  id=\"address-street\"\n                  ref=\"streetDelivery\"\n                  v-model=\"formData.deliveryData.addressData.street\"\n                  type=\"text\"\n                  :label=\"t('repairshopForm.addressForm.streetLabel')\"\n                  placeholder=\"Hauptstr.\"\n                  input-class=\"input\"\n                  outer-class=\"pr-2 mt-2 md:pr-4 basis-9/12\"\n                  validation=\"required:trim\"\n                  validation-visibility=\"blur\"\n                  label-class=\"text-md !leading-[19px] font-bold\"\n                  inner-class=\"pt-[5px]\"\n                />\n\n                <FormKit\n                  id=\"address-housenumber\"\n                  ref=\"houseNumberDelivery\"\n                  v-model=\"formData.deliveryData.addressData.houseNumber\"\n                  type=\"text\"\n                  :label=\"t('repairshopForm.addressForm.houseNrLabel')\"\n                  placeholder=\"123\"\n                  input-class=\"input\"\n                  outer-class=\"mt-2 basis-3/12\"\n                  validation=\"required:trim\"\n                  validation-visibility=\"blur\"\n                  label-class=\"text-md !leading-[19px] font-bold\"\n                  inner-class=\"pt-[5px]\"\n                />\n\n                <template v-if=\"showStreetErrorDelivery\">\n                  <FormCustomMessage\n                    :message=\"\n                      t('repairshopForm.addressForm.streetErrorMessage')\n                    \"\n                  />\n                </template>\n\n                <FormKit\n                  id=\"address-zip-code\"\n                  ref=\"zipCodeDelivery\"\n                  v-model=\"formData.deliveryData.addressData.zipCode\"\n                  type=\"text\"\n                  :label=\"t('repairshopForm.addressForm.zipLabel')\"\n                  :placeholder=\"t('repairshopForm.addressForm.zipPlaceholder')\"\n                  :validation=\"zipCodeValidationRules\"\n                  validation-visibility=\"blur\"\n                  input-class=\"input\"\n                  :outer-class=\"'basis-3/12 mt-2'\"\n                  inner-class=\"pt-[5px]\"\n                  label-class=\"text-md !leading-[19px] font-bold\"\n                />\n\n                <FormKit\n                  id=\"address-city\"\n                  ref=\"cityDelivery\"\n                  v-model=\"formData.deliveryData.addressData.city\"\n                  type=\"text\"\n                  :label=\"t('repairshopForm.addressForm.cityLabel')\"\n                  placeholder=\"Musterstadt\"\n                  input-class=\"input\"\n                  :outer-class=\"'basis-9/12 pl-2 md:pl-4 mt-2'\"\n                  validation=\"required:trim\"\n                  validation-visibility=\"blur\"\n                  label-class=\"text-md !leading-[19px] font-bold\"\n                  inner-class=\"pt-[5px]\"\n                />\n\n                <template v-if=\"showZipCodeErrorDelivery\">\n                  <FormCustomMessage\n                    :message=\"t('repairshopForm.addressForm.zipErrorMessage')\"\n                  />\n                </template>\n              </div>\n            </div>\n          </div>\n        </FormKit>\n      </div>\n    </div>\n\n    <!-- Pricebox -->\n    <RepairshopFieldPriceBox class=\"mb-xl touch:md:mb-0 lg:mb-0\">\n      <div class=\"md:mb-[130px]\">\n        <BasicButton\n          classes=\"w-full bottom-0 z-10 lg:z-auto touch:md:z-auto fixed bottom-0 left-0 right-0 lg:relative touch:md:relative font-deco-alt\"\n          :label=\"t('repairshopForm.continue')\"\n          :type=\"EButtonType.BUTTON\"\n          :btn-style=\"EButtonStyle.CTA\"\n          :loading-animation=\"isLoading\"\n          :disabled=\"isLoading\"\n          :no-border-radius=\"!isDesktop\"\n          :btn-height=\"isDesktop ? '' : 'var(--sticky-btn-height)'\"\n          full-width\n          @click=\"checkValidity\"\n        />\n      </div>\n    </RepairshopFieldPriceBox>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport { EButtonStyle, EButtonType } from '@/@types/basic-button';\nimport { Headline } from '@/complib';\nimport FormCustomMessage from '@/components/form/custom-message.vue';\nimport FormCustomHeadline from '@/components/form/custom-headline.vue';\nimport RepairshopFieldPriceBox from '~/components/form/repairshop/components/price/tile-view.vue';\nimport BasicButton from '~~/src/components/components/core/basic-button/basic-button.vue';\nimport { FormKit } from '@formkit/vue';\nimport { SiteIdent } from '~/utils/types';\n\nconst Phone =\n  useSiteIdent() === SiteIdent.default\n    ? defineAsyncComponent(() => import('@/complib/formFields/phone/phone.vue'))\n    : defineAsyncComponent(\n        () =>\n          import(\n            '@/components/form/repairshop/components/form-fields/minilu/custom-phone.vue'\n          ),\n      );\n\nconst languageCode = useNuxtApp().$languageCode;\nconst { t } = useTrans();\nconst isDesktop = useIsDesktopView();\nconst isLoading = ref(false);\nconst { formData } = await useFormData();\nconst addressData = ref(null);\nconst street = ref(null);\nconst houseNumber = ref(null);\nconst zipCode = ref(null);\nconst city = ref(null);\nconst streetDelivery = ref(null);\nconst houseNumberDelivery = ref(null);\nconst zipCodeDelivery = ref(null);\nconst cityDelivery = ref(null);\n\nonBeforeMount(() => {\n  if (import.meta.client) {\n    window.scrollTo(0, 0);\n  }\n});\n\nconst showStreetError = computed(() => {\n  if (!street.value || !houseNumber.value) {\n    return false;\n  }\n\n  const streetState = street.value.node.context.state;\n  const houseNumberState = houseNumber.value.node.context.state;\n\n  return (\n    (!streetState.valid || !houseNumberState.valid) &&\n    (streetState.blurred ||\n      streetState.submitted ||\n      houseNumberState.blurred ||\n      houseNumberState.submitted)\n  );\n});\n\nconst showStreetErrorDelivery = computed(() => {\n  if (!streetDelivery.value || !houseNumberDelivery.value) {\n    return false;\n  }\n\n  const streetState = streetDelivery.value.node.context.state;\n  const houseNumberState = houseNumberDelivery.value.node.context.state;\n\n  return (\n    (!streetState.valid || !houseNumberState.valid) &&\n    (streetState.blurred ||\n      streetState.submitted ||\n      houseNumberState.blurred ||\n      houseNumberState.submitted)\n  );\n});\n\nconst showZipCodeError = computed(() => {\n  if (!zipCode.value || !city.value) {\n    return false;\n  }\n\n  const zipCodeState = zipCode.value.node.context.state;\n  const cityState = city.value.node.context.state;\n\n  return (\n    (!zipCodeState.valid || !cityState.valid) &&\n    (zipCodeState.blurred ||\n      zipCodeState.submitted ||\n      cityState.blurred ||\n      cityState.submitted)\n  );\n});\n\nconst showZipCodeErrorDelivery = computed(() => {\n  if (!zipCodeDelivery.value || !cityDelivery.value) {\n    return false;\n  }\n\n  const zipCodeState = zipCodeDelivery.value.node.context.state;\n  const cityState = cityDelivery.value.node.context.state;\n\n  return (\n    (!zipCodeState.valid || !cityState.valid) &&\n    (zipCodeState.blurred ||\n      zipCodeState.submitted ||\n      cityState.blurred ||\n      cityState.submitted)\n  );\n});\n\nconst zipCodeValidationRules = computed(() => {\n  if (languageCode === 'de' || useSiteIdent() === SiteIdent.default) {\n    return 'required|matches:/^[0-9]{5}$/';\n  } else if (languageCode === 'at') {\n    return 'required|matches:/^[0-9]{4}$/';\n  } else if (languageCode === 'nl') {\n    return 'required|matches:/^[1-9][0-9]{3}\\\\s?([a-zA-Z]{2})?$/';\n  } else {\n    return '';\n  }\n});\n\nfunction checkValidity() {\n  isLoading.value = true;\n\n  let invalidElements: any[] = [];\n\n  // We need to set submitted state to true for all repeater fields\n  // Otherwise field will not be validated\n  const test = getInvalidElements(addressData.value.node.children);\n  invalidElements = invalidElements.concat(test);\n\n  if (!addressData.value.node.context.state.valid) {\n    const firstInvalidFieldNode = document\n      .getElementById(invalidElements[0].context.id)\n      .closest('.formkit-outer');\n\n    if (firstInvalidFieldNode) {\n      firstInvalidFieldNode.scrollIntoView({\n        behavior: 'smooth',\n      });\n    }\n    isLoading.value = false;\n    return;\n  }\n\n  isLoading.value = false;\n\n  useRouter().push({\n    path: useRouter().currentRoute.value.path,\n    hash: '#repairshop-overview',\n    query: { sourceUrl: useRouter().currentRoute.value.query['sourceUrl'] },\n  });\n}\n\nfunction getInvalidElements(fields: any[], invalidElements: any[] = []) {\n  fields.forEach((field: any) => {\n    field.context.state.submitted = true;\n\n    // If field is field group, we need to check all children\n    if (field.context.type === 'group') {\n      const invalidChildElements = getInvalidElements(\n        field.children,\n        invalidElements,\n      );\n      invalidElements.push(invalidChildElements);\n      return invalidElements;\n    }\n\n    if (!field.context.state.valid) {\n      invalidElements.push(field);\n    }\n\n    return invalidElements;\n  });\n\n  return invalidElements;\n}\n\nfunction getPlaceholderZipCode(): string {\n  switch (languageCode) {\n    case 'de':\n      return '12345';\n    case 'nl':\n      return '1234AA';\n    case 'at':\n      return '1234';\n    default:\n      return '12345';\n  }\n}\n</script>\n\n<style lang=\"postcss\">\n/* remove standard-styles */\n.custom-radio {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  border: none;\n  border-radius: 0;\n  font-size: 1em;\n  width: 100%;\n}\n\n/* graceful degradation for ie8 */\n.custom-radio {\n  width: auto;\n  float: left;\n  margin-right: 0.75em;\n  background: transparent;\n  border: none;\n}\n\n.custom-radio:checked,\n.custom-radio:not(:checked) {\n  background: transparent;\n  position: relative;\n  visibility: hidden;\n  margin: 0;\n  padding: 0;\n}\n\n.custom-radio + label {\n  cursor: pointer;\n}\n\n.custom-radio:checked + label::before,\n.custom-radio:not(:checked) + label::before {\n  content: ' ';\n  display: inline-block;\n  width: 17px;\n  height: 17px;\n  position: relative;\n  top: 4px;\n  border: 1px solid #cbcbcb;\n  background: #fff;\n  margin-right: 1em;\n  box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.1);\n}\n\n.custom-radio:checked + label::before,\n.custom-radio:not(:checked) + label::before {\n  border-radius: 3px;\n}\n\n.custom-radio:hover + label::before {\n  background: #ddd;\n  box-shadow: inset 0 0 0 2px white;\n}\n\n.custom-radio:checked + label::before {\n  box-shadow: inset 0 0 0 3px white;\n}\n\n.custom-radio:checked + label::after {\n  content: ' ';\n  display: block;\n  width: 11px;\n  height: 11px;\n  position: relative;\n  top: -19px;\n  background: var(--thm-primary-base);\n  left: 3px;\n  box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.1);\n  border-radius: 2px;\n}\n</style>\n\n<style lang=\"postcss\" scoped>\n:deep(.hide-default-message .formkit-outer .formkit-messages) {\n  @apply !hidden;\n}\n\n:deep([data-invalid] .formkit-input) {\n  @apply border-b-sign-red !border-b-[3px] z-500;\n}\n</style>\n","<template>\n  <div id=\"repairshop-checkout\">\n    <div\n      :class=\"[\n        'h-[32px] md:h-[46px]',\n        {\n          'bg-[#635652]': useSiteIdent() === SiteIdent.default,\n          'bg-[#AA5A9F]': useSiteIdent() !== SiteIdent.default,\n        },\n      ]\"\n    />\n    <div class=\"relative\">\n      <div\n        ref=\"progressBar\"\n        :class=\"[\n          'w-full h-[8px] absolute',\n          {\n            'bg-[#D0CCCA]': useSiteIdent() === SiteIdent.default,\n            'bg-[#E5CDE2]': useSiteIdent() !== SiteIdent.default,\n          },\n        ]\"\n      />\n      <div\n        class=\"h-[8px] bg-primary-base absolute\"\n        :style=\"`width: ${progressWidth}px`\"\n      />\n    </div>\n\n    <ContainerBasic container-type=\"PAGE\">\n      <div\n        class=\"flex flex-col lg:flex-row touch:md:flex-row lg:px-sm touch:md:px-sm shrink-0 w-full t-[8px]\"\n      >\n        <div class=\"flex-initial max-w-[930px] w-full mx-auto absolute\">\n          <!-- Progressbar -->\n          <div class=\"w-[315px] md:w-[455px] mx-auto\">\n            <div class=\"px-xs flex justify-between -translate-y-[28%]\">\n              <!-- Icon 1 -->\n              <div ref=\"addressIcon\" class=\"text-center\">\n                <div\n                  class=\"flex justify-center items-center w-[50px] h-[50px] md:w-[70px] md:h-[70px] rounded-full bg-white mb-sm\"\n                >\n                  <div\n                    class=\"flex justify-center items-center w-[46px] h-[46px] md:w-[66px] md:h-[66px] rounded-full bg-primary-base\"\n                  >\n                    <Icon\n                      classes=\"text-white !w-[26px] !h-[26px]\"\n                      icon-class=\"fa-solid fa-location-dot\"\n                    />\n                  </div>\n                </div>\n                <span\n                  class=\"pt-sm text-text-base\"\n                  :class=\"{ 'font-bold !text-text-base': !isOverviewStep }\"\n                >\n                  Adresse\n                </span>\n              </div>\n              <!-- Icon 2 -->\n              <div ref=\"overviewIcon\" class=\"text-center\">\n                <div\n                  class=\"flex justify-center items-center w-[50px] h-[50px] md:w-[70px] md:h-[70px] rounded-full bg-white mb-sm\"\n                  :class=\"{\n                    'border-2 border-solid': !isOverviewStep,\n                    'border-[#D0CCCA]':\n                      !isOverviewStep && useSiteIdent() === SiteIdent.default,\n                    'border-[#E5CDE2]':\n                      !isOverviewStep && useSiteIdent() !== SiteIdent.default,\n                  }\"\n                >\n                  <div\n                    class=\"flex justify-center items-center w-[46px] h-[46px] md:w-[66px] md:h-[66px] rounded-full\"\n                    :class=\"{\n                      'bg-primary-base': isOverviewStep,\n                    }\"\n                  >\n                    <template v-if=\"isOverviewStep\">\n                      <Icon\n                        classes=\"text-white !w-[26px] !h-[26px]\"\n                        icon-class=\"fa-solid fa-magnifying-glass-arrow-right\"\n                      />\n                    </template>\n                    <template v-else>\n                      <Icon\n                        :classes=\"`${\n                          useSiteIdent() === SiteIdent.default\n                            ? 'text-[#635652]'\n                            : 'text-[#AA5A9F]'\n                        } !w-[26px] !h-[26px]`\"\n                        icon-class=\"fa-light fa-magnifying-glass-arrow-right\"\n                      />\n                    </template>\n                  </div>\n                </div>\n                <span class=\"pt-sm\" :class=\"{ 'font-bold': isOverviewStep }\">\n                  {{ t('repairshopForm.check') }}\n                </span>\n              </div>\n              <!-- Icon 3 -->\n              <div class=\"text-center\">\n                <div\n                  class=\"flex justify-center items-center w-[50px] h-[50px] md:w-[70px] md:h-[70px] rounded-full bg-white border-2 border-solid mb-sm\"\n                  :class=\"{\n                    'border-[#D0CCCA]': useSiteIdent() === SiteIdent.default,\n                    'border-[#E5CDE2]': useSiteIdent() !== SiteIdent.default,\n                  }\"\n                >\n                  <Icon\n                    :classes=\"`${\n                      useSiteIdent() === SiteIdent.default\n                        ? 'text-[#635652]'\n                        : 'text-[#AA5A9F]'\n                    } !w-[26px] !h-[26px]`\"\n                    icon-class=\"fa-light fa-badge-check\"\n                  />\n                </div>\n                <span class=\"mt-sm\">{{ t('repairshopForm.finish') }}!</span>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        <!-- Placeholder for pricebox col -->\n        <div\n          class=\"flex-initial max-w-[451px] shrink-0 w-full mx-auto px-md\"\n        ></div>\n      </div>\n\n      <!-- Form -->\n      <div>\n        <RepairshopStepAddressForm v-if=\"!isOverviewStep\" />\n        <RepairshopStepOverview v-else />\n      </div>\n    </ContainerBasic>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { isFormValidForStep } from '~/components/form/repairshop/utils/form';\nimport { RepairshopStepEnum } from '~/components/form/repairshop/utils/formStepEnum';\nimport { useResizeObserver } from '@vueuse/core';\nimport RepairshopStepOverview from '~/components/form/repairshop/components/form-steps/overview.vue';\nimport RepairshopStepAddressForm from '~/components/form/repairshop/components/form-steps/address.vue';\nimport ContainerBasic from '@/components/components/container-basic.vue';\nimport { Icon } from '@/complib';\nimport { SiteIdent } from '~/utils/types';\n\nconst { t } = useTrans();\nconst pageData = usePageData();\nconst progressBar = ref(null);\nconst addressIcon = ref(null);\nconst overviewIcon = ref(null);\nconst progressWidth = ref(0);\nconst props = defineProps({\n  submittedSuccessfully: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n});\nconst isOverviewStep = computed(() => {\n  return (\n    useRouter().currentRoute.value.hash === '#repairshop-overview' ||\n    props.submittedSuccessfully\n  );\n});\nconst stepEnum = computed(() => {\n  return isOverviewStep.value\n    ? RepairshopStepEnum.ADDRESS\n    : RepairshopStepEnum.BASIC;\n});\n\nonMounted(() => {\n  if (!isFormValidForStep(stepEnum.value)) {\n    useRouter().replace({\n      path: '/' + pageData.value.temp_raw.parent.uri,\n      hash: '',\n    });\n  }\n\n  setProgressBarWidth();\n});\n\nwatch(\n  () => useRouter().currentRoute.value.hash,\n  (newHash) => {\n    if (newHash.length > 0 && !isFormValidForStep(stepEnum.value)) {\n      useRouter().replace({\n        path: '/' + pageData.value.temp_raw.parent.uri,\n        hash: '',\n      });\n    }\n\n    setProgressBarWidth();\n    if (import.meta.client) {\n      window.scrollTo({ top: 0 });\n    }\n  },\n);\n\nuseResizeObserver(progressBar, () => {\n  setProgressBarWidth();\n});\n\nfunction setProgressBarWidth() {\n  if (isOverviewStep.value) {\n    progressWidth.value = overviewIcon.value.getBoundingClientRect().left + 25;\n  } else {\n    progressWidth.value = addressIcon.value.getBoundingClientRect().left + 25;\n  }\n}\n</script>\n","<template>\n  <div class=\"px-sm py-md md:px-md md:pt-xl md:pb-lg xl:px-0\">\n    <Headline\n      :headline=\"t('repairshopForm.fastHelpSuitcaseHeadline')\"\n      :has-decoration=\"true\"\n      :logo-color=\"'#ffffff'\"\n      level=\"h2\"\n      :container-classes=\"'mb-lg stroke-border-border-dark'\"\n    />\n\n    <ContainerBasic container-type=\"PAGE\">\n      <div class=\"grid xl:grid-cols-12 gap-md\">\n        <div\n          class=\"xl:col-span-8 bg-background-base p-sm w-full sm:h-fit rounded-alt-lg desktop:md:h-[340px] touch:md:h-full desktop:lg:h-[500px] desktop:xl:h-full\"\n        >\n          <div class=\"w-full h-full\">\n            <iframe\n              id=\"animFrame\"\n              ref=\"animFrame\"\n              :src=\"iframeSrc\"\n              scrolling=\"no\"\n              class=\"w-full h-full\"\n            >\n            </iframe>\n          </div>\n        </div>\n        <div class=\"xl:col-span-4 bg-background-base rounded-alt-lg\">\n          <div>\n            <ul\n              id=\"animNavigation\"\n              class=\"p-sm columns-1 md:columns-2 xl:columns-1\"\n            >\n              <li id=\"step_1\" class=\"steps stepActive\" @click=\"seekAnim(1)\">\n                <Icon icon-class=\"far fa-chevron-right\" class=\"mr-xs\" />\n                <strong class=\"pr-xs md:pr-0\"\n                  >1.\n                  <span class=\"hidden md:inline-block\">{{\n                    t('repairshopForm.step')\n                  }}</span></strong\n                >\n                <span class=\"hidden md:inline-block mx-xs\">-</span>\n                {{ t('repairshopForm.animationStep1') }}\n              </li>\n              <li id=\"step_2\" class=\"steps\" @click=\"animStep2\">\n                <Icon icon-class=\"far fa-chevron-right\" class=\"mr-xs\" />\n                <strong class=\"pr-xs md:pr-0\"\n                  >2.\n                  <span class=\"hidden md:inline-block\">{{\n                    t('repairshopForm.step')\n                  }}</span></strong\n                >\n                <span class=\"hidden md:inline-block mx-xs\">-</span>\n                {{ t('repairshopForm.animationStep2') }}\n              </li>\n              <li id=\"step_3\" class=\"steps\" @click=\"animStep3\">\n                <Icon icon-class=\"far fa-chevron-right\" class=\"mr-xs\" />\n                <strong class=\"pr-xs md:pr-0\"\n                  >3.\n                  <span class=\"hidden md:inline-block\">{{\n                    t('repairshopForm.step')\n                  }}</span></strong\n                >\n                <span class=\"hidden md:inline-block mx-xs\">-</span>\n                {{ t('repairshopForm.animationStep3') }}\n              </li>\n              <li\n                id=\"step_4\"\n                class=\"border-b-0 steps md:border-b md:border-border-light xl:border-b-0\"\n                @click=\"animStep4\"\n              >\n                <Icon icon-class=\"far fa-chevron-right\" class=\"mr-xs\" />\n                <strong class=\"pr-xs md:pr-0\"\n                  >4.\n                  <span class=\"hidden md:inline-block\">{{\n                    t('repairshopForm.step')\n                  }}</span></strong\n                >\n                <span class=\"hidden md:inline-block mx-xs\">-</span>\n                {{ t('repairshopForm.animationStep4') }}\n              </li>\n              <li id=\"step_5\" class=\"steps\" @click=\"animStep5\">\n                <Icon icon-class=\"far fa-chevron-right\" class=\"mr-xs\" />\n                <strong class=\"pr-xs md:pr-0\"\n                  >5.\n                  <span class=\"hidden md:inline-block\">{{\n                    t('repairshopForm.step')\n                  }}</span></strong\n                >\n                <span class=\"hidden md:inline-block mx-xs\">-</span>\n                {{ t('repairshopForm.animationStep5') }}\n              </li>\n              <li id=\"step_6\" class=\"steps\" @click=\"animStep6\">\n                <Icon icon-class=\"far fa-chevron-right\" class=\"mr-xs\" />\n                <strong class=\"pr-xs md:pr-0\"\n                  >6.\n                  <span class=\"hidden md:inline-block\">{{\n                    t('repairshopForm.step')\n                  }}</span></strong\n                >\n                <span class=\"hidden md:inline-block mx-xs\">-</span>\n                {{ t('repairshopForm.animationStep6') }}\n              </li>\n              <li id=\"step_7\" class=\"border-b steps\" @click=\"animStep7\">\n                <Icon icon-class=\"far fa-chevron-right\" class=\"mr-xs\" />\n                <strong class=\"pr-xs md:pr-0\"\n                  >7.\n                  <span class=\"hidden md:inline-block\">{{\n                    t('repairshopForm.step')\n                  }}</span></strong\n                >\n                <span class=\"hidden md:inline-block mx-xs\">-</span>\n                {{ t('repairshopForm.animationStep7') }}\n              </li>\n              <li>\n                <CallToAction\n                  :block-data=\"ctaBlock\"\n                  class=\"pt-sm !my-0 mt-sm\"\n                  :button-class=\"`mt-[5px] !w-full cursor-pointer ${\n                    useSiteIdent() !== SiteIdent.default\n                      ? 'font-pero text-lg !rounded-alt-2xl'\n                      : '!rounded-sm'\n                  }`\"\n                ></CallToAction>\n              </li>\n            </ul>\n          </div>\n        </div>\n      </div>\n    </ContainerBasic>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { Headline, Icon } from '~/complib';\nimport ContainerBasic from '@/components/components/container-basic.vue';\nimport CallToAction from '@/components/block/cta/CallToAction.vue';\nimport type { CTAData } from '@/components/block/cta/blockTypes';\nimport { BlockTypeHandle } from '@/components/block/types';\nimport { ECallToActionBtnType } from '~~/src/@types/call-to-action-btn-type';\nimport { SiteIdent } from '~/utils/types';\n\nconst iframeSrc =\n  useSiteIdent() === SiteIdent.default\n    ? '/animVDV/vdv_anim.html'\n    : useNuxtApp().$languageCode !== 'nl'\n      ? '/animMiniluDE/minilu_anim.html'\n      : '/animMiniluNL/minilu_anim.html';\n\nconst animFrame = ref(null);\nconst compositionKey = '3DAA48EE68734E318F5FE5CF06042E91';\n\nuseIntersectionObserver(animFrame, ([{ isIntersecting }]) => {\n  const iframeWindow = animFrame.value.contentWindow;\n  if (!iframeWindow || (iframeWindow && !('AdobeAn' in iframeWindow))) {\n    return;\n  }\n  const stage = iframeWindow['AdobeAn']\n    .getComposition(compositionKey)\n    .getStage();\n  if (stage && isIntersecting) {\n    stage.seek(1);\n    stage.play();\n  }\n});\n\nconst animStep2 = () =>\n  useSiteIdent() === SiteIdent.default ? seekAnim(133) : seekAnim(58);\n\nconst animStep3 = () =>\n  useSiteIdent() === SiteIdent.default ? seekAnim(193) : seekAnim(118);\n\nconst animStep4 = () =>\n  useSiteIdent() === SiteIdent.default ? seekAnim(274) : seekAnim(179);\n\nconst animStep5 = () =>\n  useSiteIdent() === SiteIdent.default ? seekAnim(343) : seekAnim(331);\n\nconst animStep6 = () =>\n  useSiteIdent() === SiteIdent.default ? seekAnim(410) : seekAnim(392);\n\nconst animStep7 = () =>\n  useSiteIdent() === SiteIdent.default ? seekAnim(489) : seekAnim(452);\n\nfunction playAnim() {\n  animFrame.value.contentWindow['AdobeAn']\n    .getComposition(compositionKey)\n    .getStage()\n    .play();\n}\n\nfunction seekAnim(frameNumber: number) {\n  animFrame.value.contentWindow['AdobeAn']\n    .getComposition(compositionKey)\n    .getStage()\n    .seek(frameNumber);\n  playAnim();\n}\n\nconst { t } = useTrans();\n\nconst ctaBlock: CTAData = {\n  id: '0',\n  typeHandle: BlockTypeHandle.CTA,\n  type: ECallToActionBtnType.MAIN_PATH,\n  btnOrientation: 'center',\n  label: t('repairshopForm.animationCTA'),\n  textInverted: false,\n  scrollToForm: true,\n  uri: '',\n  target: '_blank',\n};\n</script>\n\n<style scoped lang=\"postcss\">\n.steps {\n  @apply p-xs md:p-[21px] border-x border-t border-border-light text-sm cursor-pointer flex items-baseline;\n}\n.stepActive {\n  @apply bg-primary-base text-white;\n}\n</style>\n","<template>\n  <div>\n    <!-- JS - Animation - eigene Component -->\n    <ContainerBasic v-if=\"isBasicStep\" container-type=\"FULL_WIDTH\">\n      <div class=\"!bg-activesection-alpha text-text-base h-fit w-full mx-auto\">\n        <FormRepairshopJsAnimation></FormRepairshopJsAnimation>\n      </div>\n    </ContainerBasic>\n\n    <!-- Preisliste - eigene Component -->\n    <ContainerBasic\n      v-if=\"isBasicStep\"\n      class=\"mt-xl md:mt-3xl\"\n      container-type=\"PAGE\"\n    >\n      <div class=\"!bg-white text-text-base pb-xl\">\n        <FormRepairshopPricelist></FormRepairshopPricelist>\n      </div>\n    </ContainerBasic>\n\n    <!-- Formular -->\n    <div v-if=\"state.isLoading\">\n      <ContainerBasic container-type=\"PAGE\">\n        <LoaderForm></LoaderForm>\n      </ContainerBasic>\n    </div>\n    <div v-else>\n      <ClientOnly>\n        <ContainerBasic\n          v-if=\"\n            state.submittedSuccessfully ||\n            (!state.isLoading &&\n              state.data &&\n              !data.manufacturers.error &&\n              !data.devices.error)\n          \"\n          container-type=\"FULL_WIDTH\"\n          class=\"scroll-to-form\"\n        >\n          <FormKit\n            v-if=\"state.data?.formieForm\"\n            id=\"repairshop-form\"\n            type=\"form\"\n            class=\"max-w-md\"\n            :actions=\"false\"\n            :incomplete-message=\"false\"\n            spellcheck=\"false\"\n            :config=\"{\n              validationVisibility: 'blur',\n              classes: {\n                input: `${\n                  useSiteIdent() !== SiteIdent.default ? 'rounded-corners' : ''\n                }`,\n              },\n            }\"\n            @submit=\"onSubmit\"\n          >\n            <ContainerBasic v-if=\"isBasicStep\" container-type=\"PAGE\">\n              <div\n                class=\"text-white rounded-alt-lg print:hidden bg-activesection-beta\"\n              >\n                <form-repairshop-steps-basic :block-data=\"blockData\" />\n              </div>\n            </ContainerBasic>\n\n            <ContainerBasic\n              v-else\n              container-type=\"FULL_WIDTH\"\n              class=\"bg-white text-text-base\"\n            >\n              <form-repairshop-checkout\n                :submitted-successfully=\"state.submittedSuccessfully\"\n              />\n            </ContainerBasic>\n\n            <template v-if=\"shouldRenderHoneypotField\">\n              <input id=\"beesknees\" type=\"hidden\" value=\"\" />\n            </template>\n          </FormKit>\n        </ContainerBasic>\n        <div v-else>\n          <LoadingError />\n        </div>\n      </ClientOnly>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { reactive } from 'vue';\nimport { useRuntimeConfig } from '#app';\nimport {\n  resetPriceData,\n  usePriceData,\n} from '~/components/form/repairshop/composables/usePriceData';\nimport { useFormData } from '~/components/form/repairshop/composables/useFormData';\nimport { useRepairshopData } from '~/components/form/repairshop/composables/useRepairshopData';\nimport { load } from 'recaptcha-v3';\nimport { useReservation } from '~/stores/useReserevation';\nimport { submit } from '~/components/form/repairshop/utils/mutation';\nimport {\n  isFormValidForStep,\n  loadForm,\n} from '~/components/form/repairshop/utils/form';\nimport { RepairshopStepEnum } from '@/components/form/repairshop/utils/formStepEnum';\nimport ContainerBasic from '@/components/components/container-basic.vue';\n\nimport FormRepairshopStepsBasic from '~/components/form/repairshop/components/form-steps/basic.vue';\nimport FormRepairshopPricelist from '~/components/form/repairshop/components/price/list.vue';\nimport FormRepairshopCheckout from '~/components/form/repairshop/checkout.vue';\nimport FormRepairshopJsAnimation from '~/components/form/repairshop/js-animation.vue';\nimport LoaderForm from '~/components/loader/form.vue';\nimport { useCachedGet } from '~~/src/composables/dataFetching/genericFetchers.js';\nimport type { EventPage } from '~~/src/server/transformers/page/eventPage';\nimport type { Result as ManufacturersResult } from '~~/src/server/api/[site]/content/form/repairshop/manufacturers.get';\nimport type { Result as DeviceResult } from '~~/src/server/api/[site]/content/form/repairshop/devices.get';\nimport type { Result as FormResult } from '~~/src/server/api/[site]/content/form/[handle].get';\nimport type { Result as TagsResult } from '~~/src/server/api/[site]/content/form/repairshop/tags.get';\nimport { FormKit } from '@formkit/vue';\nimport type { FormBlockData } from '~/components/components/cms/form/blockType';\nimport { SiteIdent } from '~/utils/types';\nimport { handleLoadingError } from '~/utils/handleLoadingError';\nimport { LoadingError } from '@/complib';\n\nconst props = defineProps({\n  blockData: {\n    type: Object as PropType<FormBlockData>,\n    required: true,\n    default: {} as FormBlockData,\n  },\n  pageData: {\n    type: Object as PropType<Record<string, any>>,\n    required: false,\n    default: null,\n  },\n});\n\nconst languageCode = useNuxtApp().$languageCode as string;\nconst pageDataInject = usePageData();\nconst config = useRuntimeConfig();\nconst data = useRepairshopData();\nconst { formData: form, resetFormData } = await useFormData();\nconst costs = usePriceData(languageCode);\nconst state = reactive<{\n  data: FormResult | null;\n  isLoading: boolean;\n  isWaiting: boolean;\n  submittedSuccessfully: boolean;\n  captchas: { googleCaptcha: any };\n}>({\n  data: null,\n  isLoading: true,\n  isWaiting: false,\n  submittedSuccessfully: false,\n  captchas: { googleCaptcha: null },\n});\nconst isBasicStep = computed(() => {\n  return (\n    useRouter().currentRoute.value.hash !== '#repairshop-address' &&\n    useRouter().currentRoute.value.hash !== '#repairshop-overview' &&\n    !state.submittedSuccessfully\n  );\n});\nconst site = useSiteIdent();\n\nonBeforeMount(async () => {\n  await redirectOnInvalidData(useRouter().currentRoute.value.hash);\n  await Promise.all([loadManufacturers(), loadDevices()]);\n\n  state.data = await loadForm(props.blockData.formHandle);\n  state.isLoading = false;\n\n  if (\n    (\n      state.data?.formieForm?.settings?.integrations as Array<{\n        handle: string;\n      }>\n    )?.some((x) => x.handle === 'recaptcha')\n  ) {\n    state.captchas.googleCaptcha = await load(\n      config.public.RECAPTCHA_SITE_KEY,\n      { autoHideBadge: true },\n    );\n  }\n\n  if (\n    useRouter().currentRoute.value.hash === '#repairshop-basic' &&\n    !state.submittedSuccessfully\n  ) {\n    setTimeout(() => {\n      const element = document.querySelector('#repairshop-form');\n      if (!element) {\n        return;\n      }\n      element.scrollIntoView({ behavior: 'smooth', block: 'start' });\n    }, 500);\n  }\n});\n\nwatch(\n  () => useRouter().currentRoute.value.hash,\n  async (newHash) => {\n    await redirectOnInvalidData(newHash);\n  },\n);\n\nasync function redirectOnInvalidData(hash: string) {\n  const redirectUri = pageDataInject?.value?.uri ?? props.pageData.uri;\n  switch (hash) {\n    case '#repairshop-address':\n      if (!(await isFormValidForStep(RepairshopStepEnum.BASIC))) {\n        useRouter().replace({\n          path: '/' + redirectUri,\n          hash: '',\n        });\n        return;\n      }\n      break;\n    case '#repairshop-overview':\n      if (!(await isFormValidForStep(RepairshopStepEnum.ADDRESS))) {\n        useRouter().replace({\n          path: '/' + redirectUri,\n          hash: '',\n        });\n        return;\n      }\n      break;\n    default:\n      break;\n  }\n}\n\nasync function loadManufacturers() {\n  data.value.manufacturers.isLoading = true;\n  try {\n    const { data: fetchData } = await useCachedGet<ManufacturersResult>(\n      `/api/${site}/content/form/repairshop/manufacturers`,\n    );\n\n    if (!fetchData?.value?.repairshopManufacturers?.length) return;\n\n    data.value.manufacturers.data = fetchData.value.repairshopManufacturers.map(\n      (m) => {\n        return { label: m.name, value: m.id, isOpen: false };\n      },\n    );\n\n    data.value.manufacturers.isInitialized = true;\n  } catch (e) {\n    data.value.manufacturers.error = true;\n    handleLoadingError(e);\n  } finally {\n    data.value.manufacturers.isLoading = false;\n  }\n}\n\nasync function loadDevices() {\n  data.value.devices.isLoading = true;\n  try {\n    const { data: fetchData } = await useCachedGet<DeviceResult>(\n      `/api/${site}/content/form/repairshop/devices`,\n    );\n    if (!fetchData?.value?.repairshopDevices?.length) {\n      return;\n    }\n\n    fetchData.value.repairshopDevices.forEach((d) => {\n      if (!(d.manufacturerId in data.value.devices.data)) {\n        data.value.devices.data[d.manufacturerId] = [];\n      }\n      if (\n        !data.value.devices.data[d.manufacturerId].find(\n          (x: any) => x.handle === d.handle,\n        )\n      ) {\n        data.value.devices.data[d.manufacturerId].push({\n          label: d.label,\n          value: d.id,\n          price: d.price,\n          handle: d.handle,\n        });\n      }\n    });\n\n    data.value.devices.isInitialized = true;\n  } catch (e) {\n    data.value.devices.error = true;\n    handleLoadingError(e);\n  } finally {\n    data.value.devices.isLoading = false;\n  }\n}\n\nconst shouldRenderHoneypotField = computed<boolean>(() => {\n  if (!state.data) {\n    return false;\n  }\n\n  return state.data?.formieForm?.formFields.some((f) => {\n    return f.handle === 'honeypot';\n  });\n});\n\nasync function onSubmit() {\n  (document.activeElement as HTMLElement)?.blur();\n  form.value.isFormSubmitting = true;\n  const result = await submit(\n    props.blockData.formHandle,\n    state,\n    getParsedMutationVariables(),\n    site,\n  );\n\n  if (!result) {\n    form.value.isFormSubmitting = false;\n    return;\n  }\n\n  try {\n    const { data: fetchData } = await useCachedGet<TagsResult>(\n      `/api/${site}/content/form/repairshop/tags`,\n    );\n    const tags = fetchData.value?.tags ?? [];\n\n    form.value.isFormSubmitting = false;\n\n    const reservationStore = useReservation();\n    await reservationStore.addReservation({\n      formSubmissionResult: result,\n      formDataRaw: Object.assign({}, form.value),\n      pageDataRaw: pageDataInject?.value ?? props.pageData,\n      entryDate:\n        (pageDataInject?.value as EventPage)?.event?.date ??\n        (props.pageData.value as EventPage)?.event.date,\n      price: costs.value.subtotal,\n      shippingCosts: costs.value.shipping,\n      grossPrice: (costs.value.subtotal + costs.value.shipping) * 1.19,\n      typeHandle: props.blockData.formHandle,\n      tags:\n        tags.map((x) => {\n          return x.id;\n        }) ?? [],\n    });\n\n    state.submittedSuccessfully = true;\n    resetFormData();\n    resetPriceData(languageCode);\n    state.data = null;\n    useRouter().push(useRouter().currentRoute.value.path + '/thank-you');\n  } catch (e) {\n    handleLoadingError(e);\n  }\n}\n\nfunction getParsedMutationVariables() {\n  const toolsObj: { rows: Record<string, any>[] } = { rows: [] };\n  form.value.tools.forEach((tool) => {\n    toolsObj.rows.push({\n      manufacturerId: tool.manufacturer.value,\n      deviceId: tool.device.value,\n      serialNumber: tool.serialNumber,\n      issueDescription: tool.infoText,\n    });\n  });\n\n  return {\n    tools: toolsObj,\n    companyName: form.value.companyName,\n    addressData: {\n      street: form.value.addressData.street,\n      houseNumber: form.value.addressData.houseNumber,\n      zipCode: form.value.addressData.zipCode,\n      city: form.value.addressData.city,\n    },\n    contactData: {\n      customerNumber: form.value.contactData.customerNumber,\n      customerEmail: form.value.contactData.customerEmail,\n      customerPhone: form.value.contactData.customerPhone,\n    },\n    deliveryAddress: {\n      deliveryCompanyName: form.value.differentDeliveryAddress\n        ? form.value.deliveryData.companyName\n        : form.value.companyName,\n      deliveryStreet: form.value.differentDeliveryAddress\n        ? form.value.deliveryData.addressData.street\n        : form.value.addressData.street,\n      deliveryHouseNumber: form.value.differentDeliveryAddress\n        ? form.value.deliveryData.addressData.houseNumber\n        : form.value.addressData.houseNumber,\n      deliveryZipCode: form.value.differentDeliveryAddress\n        ? form.value.deliveryData.addressData.zipCode\n        : form.value.addressData.zipCode,\n      deliveryCity: form.value.differentDeliveryAddress\n        ? form.value.deliveryData.addressData.city\n        : form.value.addressData.city,\n    },\n    honeypot: document.getElementById('beesknees')\n      ? (<HTMLInputElement>document.getElementById('beesknees')).value\n      : '',\n  };\n}\n</script>\n\n<style lang=\"postcss\">\n#repairshop-form {\n  .custom-button {\n    @apply w-full justify-center !mx-0 !px-4;\n  }\n  :deep(.hide-default-message .formkit-outer .formkit-messages) {\n    @apply !hidden;\n  }\n\n  :deep(.country-zipcode-default-message .formkit-messages) {\n    @apply !ml-4;\n  }\n\n  :deep(.custom-number-message .formkit-outer .formkit-messages) {\n    @apply !max-w-[180px] !w-[180px] bg-[#ffffff99] rounded-b pl-[9px] py-[2px];\n  }\n\n  :deep([data-invalid] .custom-number-step) {\n    @apply border-b-sign-red !border-b-[3px] rounded-bl-[0px] rounded-br-[0px];\n  }\n\n  :deep([data-invalid] .formkit-input) {\n    @apply border-b-sign-red !border-b-[3px] z-500;\n  }\n  :deep([data-invalid] .v-select) {\n    @apply border-b-sign-red border-b-[3px] z-500;\n  }\n\n  [checkbox] .formkit-input {\n    @apply h-6 w-6 mr-4 border-border-light border-1 rounded-[3px];\n  }\n\n  :deep(.formkit-wrapper) {\n    @apply !leading-[19px];\n  }\n\n  #myForm-incomplete {\n    @apply hidden;\n  }\n\n  .formkit-inner > input,\n  .formkit-inner > div,\n  .formkit-input {\n    @apply w-full;\n  }\n\n  .formkit-outer .formkit-messages {\n    @apply bg-[#ffffff99] rounded-b pl-[9px] py-[2px];\n  }\n  .formkit-outer .formkit-message {\n    @apply text-sign-red text-sm leading-xs;\n  }\n\n  .form-popup {\n    @apply absolute flex justify-end h-0 top-[10px] right-4;\n  }\n\n  .multiline-input-text .formkit-messages {\n    @apply !mt-[-9px];\n  }\n\n  .form-custom-popper {\n    --popper-theme-background-color: #5c8a8e !important;\n    --popper-theme-background-color-hover: #5c8a8e !important;\n  }\n}\n</style>\n"],"file":"_nuxt/m2-vp3VD.js"}