ameliabooking
/
v3
/
src
/
views
/
admin
/
customize
/
steps
/
Events
/
common
/
Congratulations
/
EventCongratulations.vue
ameliabooking
/
v3
/
src
/
views
/
admin
/
customize
/
steps
/
Events
/
common
/
Congratulations
Last commit date
EventCongratulations.vue
5 days ago
EventCongratulations.vue
78 lines
| 1 | <template> |
| 2 | <div class="am-elf__main-content am-elf__congrats" :class="props.globalClass"> |
| 3 | <Congratulations type="event" :selected-item="selectedItem" :customer="customer"> |
| 4 | <template #positionBottom> |
| 5 | <AddToCalendar |
| 6 | class="am-congrats__main-atc" |
| 7 | :calendar-string="labelsDisplay('add_to_calendar')" |
| 8 | ></AddToCalendar> |
| 9 | </template> |
| 10 | </Congratulations> |
| 11 | </div> |
| 12 | </template> |
| 13 | |
| 14 | <script setup> |
| 15 | // * Common Component |
| 16 | import Congratulations from '../../../common/Congratulations.vue' |
| 17 | |
| 18 | // * Parts |
| 19 | import AddToCalendar from '../../../parts/AddToCalendar.vue' |
| 20 | |
| 21 | // * Import from Vue |
| 22 | import { ref, computed, inject } from 'vue' |
| 23 | |
| 24 | // * Composables |
| 25 | import { useReactiveCustomize } from '../../../../../../../assets/js/admin/useReactiveCustomize.js' |
| 26 | |
| 27 | // * Component Poroperties |
| 28 | let props = defineProps({ |
| 29 | globalClass: { |
| 30 | type: String, |
| 31 | default: '', |
| 32 | }, |
| 33 | }) |
| 34 | |
| 35 | let selectedItem = ref({ |
| 36 | id: 348, |
| 37 | title: 'Amelia Event', |
| 38 | }) |
| 39 | |
| 40 | let customer = ref({}) |
| 41 | |
| 42 | // * Customize Object |
| 43 | const { amCustomize } = useReactiveCustomize() |
| 44 | |
| 45 | // * Form string recognition |
| 46 | let pageRenderKey = inject('pageRenderKey') |
| 47 | |
| 48 | // * Form step string recognition |
| 49 | let stepName = inject('stepName') |
| 50 | |
| 51 | // * Language string recognition |
| 52 | let langKey = inject('langKey') |
| 53 | |
| 54 | // * Labels |
| 55 | let amLabels = inject('labels') |
| 56 | |
| 57 | function labelsDisplay(label) { |
| 58 | let computedLabel = computed(() => { |
| 59 | let translations = amCustomize.value[pageRenderKey.value][stepName.value].translations |
| 60 | return translations && translations[label] && translations[label][langKey.value] |
| 61 | ? translations[label][langKey.value] |
| 62 | : amLabels[label] |
| 63 | }) |
| 64 | |
| 65 | return computedLabel.value |
| 66 | } |
| 67 | </script> |
| 68 | |
| 69 | <script> |
| 70 | export default { |
| 71 | name: 'CongratulationsStep', |
| 72 | label: 'event_congrats', |
| 73 | key: 'congrats', |
| 74 | } |
| 75 | </script> |
| 76 | |
| 77 | <style lang="scss"></style> |
| 78 |