Some checks failed
Build and deploy updated apps / Build & deploy (push) Failing after 50s
55 lines
1.1 KiB
Vue
55 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
class?: string
|
|
ux?: any
|
|
name: string
|
|
}>()
|
|
|
|
if (!['location', 'phone', 'email'].includes(props.name)) {
|
|
throw new Error(`${props.name} is not a valid name`)
|
|
}
|
|
|
|
const { g } = useContentInjected()
|
|
|
|
const data = computed(() => {
|
|
let link
|
|
if (props.name === 'location') {
|
|
link = g.value?.business?.location?.link
|
|
} else {
|
|
const prefix = props.name === 'phone' ? 'tel:' : 'mailto:'
|
|
link = prefix + g.value?.business?.[props.name].split(' ').join('')
|
|
}
|
|
|
|
return {
|
|
icons: g.value?.contact?.icons?.[props.name],
|
|
text:
|
|
props.name === 'location'
|
|
? g.value?.business?.location?.address
|
|
: g.value?.business?.[props.name],
|
|
link: link,
|
|
}
|
|
})
|
|
|
|
const classes = useStyling(
|
|
'contactDetail',
|
|
{
|
|
slots: {
|
|
base: '',
|
|
},
|
|
},
|
|
props
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<XTextIcons
|
|
:class="classes.base"
|
|
:icons="data.icons"
|
|
:text-props="{
|
|
as: 'link',
|
|
text: data.text,
|
|
linkProps: { to: data.link, noRel: true, external: true },
|
|
}"
|
|
/>
|
|
</template>
|