-
-
-
-
-
+
@@ -31,49 +59,99 @@ 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(
- 'https://api.hifast.biz/v1/common/client/download/file/Hi快VPN-windows-1.0.0.exe',
-)
-const downLoadMac = ref('https://apps.apple.com/us/app/hi%E5%BF%ABvpn/id6755683167')
-const downLoadAndroid = ref('https://hifastvpn.go.link/?adj_t=1xf6e7ru')
-// 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
-// })
-//
-// request
-// .get('/api/v1/common/client/download', {
-// // invite_code: getAllQueryString('ic'),
-// platform: 'android',
-// })
-// .then((res) => {
-// downLoadAndroid.value = res.url
-// // console.log(downLoadAndroid.value)
-// })
+import WinIcon from './WinIcon.svg?component'
+import MacIcon from './MacIcon.svg?component'
+import AppleIcon from './AppleIcon.svg?component'
+import AndroidIcon from './AndroidIcon.svg?component'
-// 定义下载链接数据
-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 版客户端' },
- ]
+import request from '@/utils/request'
+import { computed, ref, onMounted } from 'vue'
+import { getAllQueryString } from '@/utils/url-utils.ts'
+
+const downLoadWin = ref('')
+const downLoadMac = ref('')
+const currentPlatform = ref('win')
+
+onMounted(() => {
+ const ua = navigator.userAgent
+ const platform = navigator.platform || '' // 辅助判断
+
+ // 1. 先判断 Android (通常比较稳定)
+ if (/Android/i.test(ua)) {
+ currentPlatform.value = 'android'
+ }
+ // 2. 判断 iOS 设备 (iPhone, iPod)
+ else if (/iPhone|iPod/i.test(ua)) {
+ currentPlatform.value = 'ios'
+ }
+ // 3. 核心改进：区分 Mac 和 iPad
+ else if (/Macintosh|Mac OS X/i.test(ua)) {
+ // iPadOS 桌面模式下，支持多点触控（通常 > 1）
+ // 而真正的 Mac 电脑通常 maxTouchPoints 为 0 或 undefined
+ if (navigator.maxTouchPoints > 1) {
+ currentPlatform.value = 'ios' // 归类为 iOS 端（iPad）
+ } else {
+ currentPlatform.value = 'mac'
+ }
+ }
+ // 4. 其他情况默认为 Windows
+ else {
+ currentPlatform.value = 'win'
+ }
+
+ console.log('Detected Platform:', currentPlatform.value)
+})
+
+// request.get('/api/v1/common/client/download', {
+// invite_code: getAllQueryString('ic'),
+// platform: 'mac',
+// }).then((res: any) => {
+// downLoadMac.value = res.url
+// })
+
+request
+ .get('/api/v1/common/client/download', {
+ invite_code: getAllQueryString('ic'),
+ platform: 'windows',
+ })
+ .then((res: any) => {
+ downLoadWin.value = res.url
+ })
+
+const allDownloadOptions = computed(() => [
+ {
+ key: 'win',
+ mainIcon: Icon1,
+ secondaryIcon: WinIcon,
+ link: downLoadWin.value,
+ label: 'Windows',
+ id: 'downloadButton_win',
+ },
+ { key: 'mac', mainIcon: Icon3, secondaryIcon: MacIcon, label: 'macOS', id: 'downloadButton_mac' },
+ {
+ key: 'ios',
+ mainIcon: Icon2,
+ secondaryIcon: AppleIcon,
+ label: 'iOS',
+ id: 'downloadButton_apple',
+ },
+ {
+ key: 'android',
+ mainIcon: Icon4,
+ secondaryIcon: AndroidIcon,
+ label: 'Android',
+ id: 'downloadButton_android',
+ },
+])
+
+const mainButton = computed(() => {
+ return (
+ allDownloadOptions.value.find((opt) => opt.key === currentPlatform.value) ||
+ allDownloadOptions.value[0]
+ )
+})
+
+const otherButtons = computed(() => {
+ return allDownloadOptions.value.filter((opt) => opt.key !== currentPlatform.value)
})
diff --git a/src/pages/Home/components/Group 105.svg b/src/pages/Home/components/Group 105.svg
index e2c1136..53d4cce 100644
--- a/src/pages/Home/components/Group 105.svg
+++ b/src/pages/Home/components/Group 105.svg
@@ -1,7 +1,7 @@
-
diff --git a/src/pages/Home/components/Group 106.svg b/src/pages/Home/components/Group 106.svg
index 42552bf..a1948b4 100644
--- a/src/pages/Home/components/Group 106.svg
+++ b/src/pages/Home/components/Group 106.svg
@@ -1,5 +1,5 @@
-
diff --git a/src/pages/Home/components/Group 107.svg b/src/pages/Home/components/Group 107.svg
index 26e3f17..43b7bf0 100644
--- a/src/pages/Home/components/Group 107.svg
+++ b/src/pages/Home/components/Group 107.svg
@@ -1,6 +1,6 @@
-
diff --git a/src/pages/Home/components/Group 108.svg b/src/pages/Home/components/Group 108.svg
index ea8d296..42994d9 100644
--- a/src/pages/Home/components/Group 108.svg
+++ b/src/pages/Home/components/Group 108.svg
@@ -1,14 +1,14 @@
-
-
-
diff --git a/src/pages/Home/components/MacIcon.svg b/src/pages/Home/components/MacIcon.svg
new file mode 100644
index 0000000..faf33f0
--- /dev/null
+++ b/src/pages/Home/components/MacIcon.svg
@@ -0,0 +1,5 @@
+
+
diff --git a/src/pages/Home/components/ReviewCarousel/avatars/avatar1.png b/src/pages/Home/components/ReviewCarousel/avatars/avatar1.png
new file mode 100644
index 0000000..5254bf8
Binary files /dev/null and b/src/pages/Home/components/ReviewCarousel/avatars/avatar1.png differ
diff --git a/src/pages/Home/components/ReviewCarousel/avatars/avatar2.png b/src/pages/Home/components/ReviewCarousel/avatars/avatar2.png
new file mode 100644
index 0000000..e61fcdc
Binary files /dev/null and b/src/pages/Home/components/ReviewCarousel/avatars/avatar2.png differ
diff --git a/src/pages/Home/components/ReviewCarousel/avatars/avatar3.png b/src/pages/Home/components/ReviewCarousel/avatars/avatar3.png
new file mode 100644
index 0000000..6d24d84
Binary files /dev/null and b/src/pages/Home/components/ReviewCarousel/avatars/avatar3.png differ
diff --git a/src/pages/Home/components/ReviewCarousel/avatars/avatar4.png b/src/pages/Home/components/ReviewCarousel/avatars/avatar4.png
new file mode 100644
index 0000000..f528fc9
Binary files /dev/null and b/src/pages/Home/components/ReviewCarousel/avatars/avatar4.png differ
diff --git a/src/pages/Home/components/ReviewCarousel/avatars/avatar5.png b/src/pages/Home/components/ReviewCarousel/avatars/avatar5.png
new file mode 100644
index 0000000..81a6401
Binary files /dev/null and b/src/pages/Home/components/ReviewCarousel/avatars/avatar5.png differ
diff --git a/src/pages/Home/components/ReviewCarousel/avatars/avatar6.png b/src/pages/Home/components/ReviewCarousel/avatars/avatar6.png
new file mode 100644
index 0000000..c215139
Binary files /dev/null and b/src/pages/Home/components/ReviewCarousel/avatars/avatar6.png differ
diff --git a/src/pages/Home/components/ReviewCarousel/index.vue b/src/pages/Home/components/ReviewCarousel/index.vue
new file mode 100644
index 0000000..5903a63
--- /dev/null
+++ b/src/pages/Home/components/ReviewCarousel/index.vue
@@ -0,0 +1,181 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
4.9
+
{{ currentReview.reviewCount }}k reviews
+
+
+
+
+ “{{ currentReview.comment }}”
+
+
+
+
+
+
+
+
diff --git a/src/pages/Home/components/WinIcon.svg b/src/pages/Home/components/WinIcon.svg
new file mode 100644
index 0000000..fbaaf75
--- /dev/null
+++ b/src/pages/Home/components/WinIcon.svg
@@ -0,0 +1,6 @@
+
+
diff --git a/src/pages/Home/index.vue b/src/pages/Home/index.vue
index 666ed22..8ec6878 100644
--- a/src/pages/Home/index.vue
+++ b/src/pages/Home/index.vue
@@ -35,14 +35,19 @@
-
+
-
+
@@ -69,10 +74,14 @@
+
+
+
-
+
+
+
+
@@ -126,7 +139,7 @@
class="absolute inset-0 bottom-[36px] z-100 bg-[url('@/pages/Home/connected-bg.png')] bg-cover bg-center bg-no-repeat"
>
-
@@ -145,6 +158,8 @@ import CompanyNameIcon from './company-name.svg?component'
import LoginFormModal from './components/LoginFormModal.vue'
import DownloadButton from './components/DownloadButton.vue'
import Logo from './logo.svg?component'
+import UserCount from './user-count.svg?component'
+import ReviewCarousel from './components/ReviewCarousel/index.vue'
import MobileLogo from './mobile-logo.svg?component'
import ScreenshotMobile from './screenshot-mobile.png'
import ScreenshotDesktop from './screenshot-desktop.webp'
diff --git a/src/pages/Home/user-count.svg b/src/pages/Home/user-count.svg
new file mode 100644
index 0000000..3a3f483
--- /dev/null
+++ b/src/pages/Home/user-count.svg
@@ -0,0 +1,3 @@
+
+