feat: refs #6818 fetch url & default channel

src/components/ui/VnLinkPhone.vue

@@ -1,18 +1,38 @@
 <script setup>
-import { useAttrs } from 'vue';
+import { reactive, useAttrs, onBeforeMount, capitalize } from 'vue';
+import axios from 'axios';
 const props = defineProps({
     phoneNumber: { type: [String, Number], default: null },
-    channel: { type: Number, default: 1320 },
+    channel: { type: Number, default: null },
 });
 
-const config = {
+const config = reactive({
     sip: { icon: 'phone', href: `sip:${props.phoneNumber}` },
     'say-simple': {
         icon: 'help', // 'whatsapp',
-        href: `https://verdnatura.saysimple.io/start-conversation?customerIdentity=%2B${props.phoneNumber}&channelId=${props.channel}`,
+        href: null,
     },
-};
+});
 const type = Object.keys(config).find((key) => key in useAttrs()) || 'sip';
+
+onBeforeMount(async () => {
+    let url;
+    let channel = props.channel;
+    if (type === 'say-simple')
+        url = (await axios.get('SaySimpleConfigs/findOne')).data.url;
+    if (!props.channel)
+        channel = (
+            await axios.get('SaySimpleCountries/findOne', {
+                params: {
+                    filter: { fields: ['channel'], where: { countryFk: 0 } },
+                },
+            })
+        ).data?.channel;
+
+    config[
+        'say-simple'
+    ].href = `${url}?customerIdentity=%2B${props.phoneNumber}&channelId=${channel}`;
+});
 </script>
 <template>
     <QBtn
@@ -25,5 +45,9 @@ const type = Object.keys(config).find((key) => key in useAttrs()) || 'sip';
         padding="none"
         :href="config[type].href"
         @click.stop
-    />
+    >
+        <QTooltip>
+            {{ capitalize(type).replace('-', '') }}
+        </QTooltip>
+    </QBtn>
 </template>