adata-ui 2.1.22 → 2.1.24

package/components/modals/ContactsMobileModel.vue

@@ -1,182 +1,182 @@
-<script setup lang="ts">
-import { ref } from 'vue'
-import IconLocation from '#adata-ui/icons/location.vue'
-import IconMail from '#adata-ui/icons/mail.vue'
-import IconClock from '#adata-ui/icons/clock.vue'
-import IconPhone from '#adata-ui/icons/phone.vue'
-import IconWhatsapp from '#adata-ui/icons/whatsapp.vue'
-import ExpandWindow from '#adata-ui/icons/expand-window.vue'
-
-type Emits = {
-  (e: 'pushMain'): void
-}
-const { t } = useI18n()
-const isOpen = ref(false)
-const tab = ref('allData')
-const emits = defineEmits<Emits>()
-
-const tabOptions = [
-  {
-    name: t('mobile_navigation.contacts.first_type'),
-    key: 'allData'
-  },
-  {
-    name: t('mobile_navigation.contacts.second_type'),
-    key: 'allDataConsulting'
-  }
-]
-const sideLinks = <any>{
-  allData: [
-    {
-      title: t('mobile_navigation.contacts.allData.address'),
-      info: [
-        {
-          label: t('mobile_navigation.contacts.allData.address_info'),
-          icon: IconLocation
-        }
-      ]
-    },
-    {
-      title: t('mobile_navigation.contacts.allData.email'),
-      info: [
-        {
-          label: 'info@adata.kz',
-          icon: IconMail,
-          to: 'mailto:info@adata.kz'
-        }
-      ]
-    },
-    {
-      title: t('mobile_navigation.contacts.allData.mode'),
-      info: [
-        {
-          label: t('mobile_navigation.contacts.allData.mode_info'),
-          icon: IconClock
-        }
-      ]
-    },
-    {
-      title: t('mobile_navigation.contacts.allData.sales_department'),
-      info: [
-        {
-          label: '+7 (771) 779 49 60',
-          icon: IconWhatsapp,
-          to: 'https://api.whatsapp.com/send/?phone=77717794960'
-        },
-        {
-          label: '+7 (747) 225 07 84',
-          icon: IconWhatsapp,
-          to: 'https://api.whatsapp.com/send/?phone=77472250784'
-        },
-        {
-          label: '+7 (771) 709 32 84',
-          icon: IconWhatsapp,
-          to: 'https://api.whatsapp.com/send/?phone=77717093284'
-        }
-      ]
-    },
-    {
-      title: t('mobile_navigation.contacts.allData.technical_support'),
-      info: [
-        {
-          label: t('mobile_navigation.contacts.allData.support_link_title'),
-          icon: ExpandWindow,
-          to: 'https://api.whatsapp.com/send/?phone=77712289041'
-        }
-      ]
-    }
-  ],
-  allDataConsulting: [
-    {
-      title: t('mobile_navigation.contacts.allData.address'),
-      info: [
-        {
-          label: t('header.contacts.astana.adress.subtitle'),
-          icon: IconLocation
-        }
-      ]
-    },
-    {
-      title: t('mobile_navigation.contacts.allData.email'),
-      info: [
-        {
-          label: 'info@adata-c.kz',
-          icon: IconMail,
-          to: 'mailto:info@adata-c.kz'
-        }
-      ]
-    },
-    {
-      title: t('mobile_navigation.contacts.allData.mode'),
-      info: [
-        {
-          label: t('header.contacts.astana.schedule.subtitle'),
-          icon: IconClock
-        }
-      ]
-    },
-    {
-      title: t('mobile_navigation.contacts.allData.sales_department'),
-      info: [
-        {
-          label: '+7 700 744 00 10',
-          icon: IconWhatsapp,
-          to: 'https://api.whatsapp.com/send/?phone=77007440010'
-        }
-      ]
-    }
-  ]
-}
-const currentInfo = ref(sideLinks.allData)
-
-watch(tab, (e) => {
-  if (e) {
-    currentInfo.value = sideLinks[e]
-  }
-})
-</script>
-
-<template>
-  <a-modal v-model="isOpen" :title="t('modals.mobile_navigation.type_contacts')">
-    <div class="flex flex-col gap-4">
-      <div class="h-[1px] w-full bg-deepblue-900/5" />
-      <div>
-        <a-pill-tabs v-model="tab" :options="tabOptions" view="gray" />
-      </div>
-      <div class="flex h-[40vh] flex-col gap-2 overflow-auto sm:h-[300px]">
-        <div v-for="items in currentInfo" :key="items.title" class="flex flex-col gap-2">
-          <p class="font-semibold">{{ items.title }}</p>
-          <div class="flex flex-wrap gap-4 text-sm">
-            <template v-for="item in items.info">
-              <a
-                v-if="item.to"
-                :href="item.to"
-                class="flex items-center gap-1 text-blue-700 dark:text-blue-500"
-              >
-                <component :is="item.icon" class="h-[16px] w-[16px] min-w-[16px]" />
-                {{ item.label }}
-              </a>
-              <div v-else class="flex items-center gap-1">
-                <component :is="item.icon" class="h-[16px] w-[16px] min-w-[16px]" />
-                {{ item.label }}
-              </div>
-            </template>
-          </div>
-        </div>
-      </div>
-      <div class="h-[1px] w-full bg-deepblue-900/5" />
-    </div>
-    <template #footer>
-      <nuxt-link
-        to="/"
-        @click="emits('pushMain')"
-        class="flex items-center gap-4 rounded-md bg-gray-50 px-4 py-3 dark:bg-gray-800"
-      >
-        <a-icon-menu />
-        {{ t('modals.mobile_navigation.return_button') }}
-      </nuxt-link>
-    </template>
-  </a-modal>
-</template>
-
-<style scoped></style>
+<script setup lang="ts">
+import { ref } from 'vue'
+import IconLocation from '#adata-ui/icons/location.vue'
+import IconMail from '#adata-ui/icons/mail.vue'
+import IconClock from '#adata-ui/icons/clock.vue'
+import IconPhone from '#adata-ui/icons/phone.vue'
+import IconWhatsapp from '#adata-ui/icons/whatsapp.vue'
+import ExpandWindow from '#adata-ui/icons/expand-window.vue'
+
+type Emits = {
+  (e: 'pushMain'): void
+}
+const { t } = useI18n()
+const isOpen = ref(false)
+const tab = ref('allData')
+const emits = defineEmits<Emits>()
+
+const tabOptions = [
+  {
+    name: t('mobile_navigation.contacts.first_type'),
+    key: 'allData'
+  },
+  {
+    name: t('mobile_navigation.contacts.second_type'),
+    key: 'allDataConsulting'
+  }
+]
+const sideLinks = <any>{
+  allData: [
+    {
+      title: t('mobile_navigation.contacts.allData.address'),
+      info: [
+        {
+          label: t('mobile_navigation.contacts.allData.address_info'),
+          icon: IconLocation
+        }
+      ]
+    },
+    {
+      title: t('mobile_navigation.contacts.allData.email'),
+      info: [
+        {
+          label: 'info@adata.kz',
+          icon: IconMail,
+          to: 'mailto:info@adata.kz'
+        }
+      ]
+    },
+    {
+      title: t('mobile_navigation.contacts.allData.mode'),
+      info: [
+        {
+          label: t('mobile_navigation.contacts.allData.mode_info'),
+          icon: IconClock
+        }
+      ]
+    },
+    {
+      title: t('mobile_navigation.contacts.allData.sales_department'),
+      info: [
+        {
+          label: '+7 (771) 779 49 60',
+          icon: IconWhatsapp,
+          to: 'https://api.whatsapp.com/send/?phone=77717794960'
+        },
+        {
+          label: '+7 (747) 225 07 84',
+          icon: IconWhatsapp,
+          to: 'https://api.whatsapp.com/send/?phone=77472250784'
+        },
+        {
+          label: '+7 (771) 709 32 84',
+          icon: IconWhatsapp,
+          to: 'https://api.whatsapp.com/send/?phone=77717093284'
+        }
+      ]
+    },
+    {
+      title: t('mobile_navigation.contacts.allData.technical_support'),
+      info: [
+        {
+          label: t('mobile_navigation.contacts.allData.support_link_title'),
+          icon: ExpandWindow,
+          to: 'https://api.whatsapp.com/send/?phone=77712289041'
+        }
+      ]
+    }
+  ],
+  allDataConsulting: [
+    {
+      title: t('mobile_navigation.contacts.allData.address'),
+      info: [
+        {
+          label: t('header.contacts.astana.adress.subtitle'),
+          icon: IconLocation
+        }
+      ]
+    },
+    {
+      title: t('mobile_navigation.contacts.allData.email'),
+      info: [
+        {
+          label: 'info@adata-c.kz',
+          icon: IconMail,
+          to: 'mailto:info@adata-c.kz'
+        }
+      ]
+    },
+    {
+      title: t('mobile_navigation.contacts.allData.mode'),
+      info: [
+        {
+          label: t('header.contacts.astana.schedule.subtitle'),
+          icon: IconClock
+        }
+      ]
+    },
+    {
+      title: t('mobile_navigation.contacts.allData.sales_department'),
+      info: [
+        {
+          label: '+7 700 744 00 10',
+          icon: IconWhatsapp,
+          to: 'https://api.whatsapp.com/send/?phone=77007440010'
+        }
+      ]
+    }
+  ]
+}
+const currentInfo = ref(sideLinks.allData)
+
+watch(tab, (e) => {
+  if (e) {
+    currentInfo.value = sideLinks[e]
+  }
+})
+</script>
+
+<template>
+  <a-modal v-model="isOpen" :title="t('modals.mobile_navigation.type_contacts')">
+    <div class="flex flex-col gap-4">
+      <div class="h-[1px] w-full bg-deepblue-900/5" />
+      <div>
+        <a-pill-tabs v-model="tab" :options="tabOptions" view="gray" />
+      </div>
+      <div class="flex h-[40vh] flex-col gap-2 overflow-auto sm:h-[300px]">
+        <div v-for="items in currentInfo" :key="items.title" class="flex flex-col gap-2">
+          <p class="font-semibold">{{ items.title }}</p>
+          <div class="flex flex-wrap gap-4 text-sm">
+            <template v-for="item in items.info">
+              <a
+                v-if="item.to"
+                :href="item.to"
+                class="flex items-center gap-1 text-blue-700 dark:text-blue-500"
+              >
+                <component :is="item.icon" class="h-[16px] w-[16px] min-w-[16px]" />
+                {{ item.label }}
+              </a>
+              <div v-else class="flex items-center gap-1">
+                <component :is="item.icon" class="h-[16px] w-[16px] min-w-[16px]" />
+                {{ item.label }}
+              </div>
+            </template>
+          </div>
+        </div>
+      </div>
+      <div class="h-[1px] w-full bg-deepblue-900/5" />
+    </div>
+    <template #footer>
+      <nuxt-link
+        to="/"
+        @click="emits('pushMain')"
+        class="flex items-center gap-4 rounded-md bg-gray-50 px-4 py-3 dark:bg-gray-800"
+      >
+        <a-icon-menu />
+        {{ t('modals.mobile_navigation.return_button') }}
+      </nuxt-link>
+    </template>
+  </a-modal>
+</template>
+
+<style scoped></style>