speakeloudest
c4f967affa
All checks were successful
site-dist-deploy / build-and-deploy (push) Successful in 1m37s
78 lines
2.5 KiB
Vue
78 lines
2.5 KiB
Vue
<template>
|
|
<div class="mx-auto grid grid-cols-2 gap-[10px] md:flex md:flex-wrap">
|
|
<template v-for="(item, index) in downloadLinks" :key="index">
|
|
<router-link
|
|
v-if="item.isInternal"
|
|
:to="item.link"
|
|
:aria-label="item.label"
|
|
class="lucid-glass-bar flex h-[40px] w-[140px] shrink-0 items-center space-x-2 rounded-full border border-white/20 transition-transform hover:brightness-110 active:scale-95 md:h-[50px] md:w-[180px]"
|
|
>
|
|
<div class="flex items-center justify-center">
|
|
<component :is="item.icon" class="h-[40px] w-[140px] md:h-[50px] md:w-[180px]" />
|
|
</div>
|
|
</router-link>
|
|
<a
|
|
v-else
|
|
:href="item.link"
|
|
target="_blank"
|
|
:aria-label="item.label"
|
|
class="lucid-glass-bar flex h-[40px] w-[140px] shrink-0 items-center space-x-2 rounded-full transition-transform hover:brightness-110 active:scale-95 md:h-[50px] md:w-[180px]"
|
|
>
|
|
<div class="flex items-center justify-center">
|
|
<component :is="item.icon" class="h-[40px] w-[140px] md:h-[50px] md:w-[180px]" />
|
|
</div>
|
|
</a>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Icon1 from './Group 105.svg?component'
|
|
import Icon2 from './Group 106.svg?component'
|
|
import Icon3 from './Group 107.svg?component'
|
|
import Icon4 from './Group 108.svg?component'
|
|
import { ref, computed } from 'vue'
|
|
import request from '@/utils/request'
|
|
import { getAllQueryString } from '@/utils/url-utils.ts'
|
|
const downLoadWin = ref('')
|
|
const downLoadMac = ref('')
|
|
const downLoadAndroid = ref('')
|
|
request
|
|
.get('/api/v1/common/client/download', {
|
|
invite_code: getAllQueryString('ic'),
|
|
platform: 'mac',
|
|
})
|
|
.then((res) => {
|
|
downLoadMac.value = res.url
|
|
})
|
|
|
|
request
|
|
.get('/api/v1/common/client/download', {
|
|
invite_code: getAllQueryString('ic'),
|
|
platform: 'windows',
|
|
})
|
|
.then((res) => {
|
|
downLoadWin.value = res.url
|
|
console.log(downLoadWin.value)
|
|
})
|
|
|
|
request
|
|
.get('/api/v1/common/client/download', {
|
|
invite_code: getAllQueryString('ic'),
|
|
platform: 'android',
|
|
})
|
|
.then((res) => {
|
|
downLoadWin.value = res.url
|
|
})
|
|
|
|
// 定义下载链接数据
|
|
const downloadLinks = computed(() => {
|
|
return [
|
|
{ icon: Icon2, link: '/help', isInternal: true, label: '查看帮助中心' },
|
|
{ icon: Icon1, link: downLoadWin.value, label: '下载 Windows 版客户端' },
|
|
{ icon: Icon4, link: downLoadAndroid.value, label: '下载 Android 版客户端' },
|
|
{ icon: Icon3, link: downLoadMac.value, label: '下载 macOS 版客户端' },
|
|
]
|
|
})
|
|
</script>
|