HI-VPN/hi-partner
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

接口对接
All checks were successful
site-dist-deploy / build-and-deploy (push) Successful in 1m13s
Details

Browse Source
This commit is contained in:
speakeloudest 2026-01-31 18:48:59 -08:00
parent 2a7e851cda
commit ed2cd443ba
6 changed files with 157 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/pages/UserCenter/components/DownloadStats/index.vue
View File

@ -1,34 +1,56 @@
<script setup lang="ts">
import { ref, onMounted, computed } from 'vue'
import request from '@/utils/request'
const statsList = ref<any[]>([])
const loading = ref(false)
const totalDownloads = computed(() => {
return statsList.value.reduce((acc, item) => acc + (item.visits || 0), 0)
})
async function fetchDownloads() {
loading.value = true
try {
const res: any = await request.get('/api/v1/public/user/agent/downloads')
statsList.value = res.list || []
} catch (error) {
console.error('Fetch downloads error:', error)
} finally {
loading.value = false
}
}
onMounted(() => {
fetchDownloads()
})
</script>
<template>
<div
class="lucid-glass-bar flex w-full flex-col justify-between rounded-4xl! border-1 border-white px-6 py-7"
>
<div class="mb-2 flex items-center justify-between border-b-1 border-dashed pb-3">
<div class="relative ml-1 text-base font-bold text-white">各端下载量</div>
<div class="mr-1 text-2xl font-bold text-white tabular-nums">62</div>
<div class="mr-1 text-2xl font-bold text-white tabular-nums">{{ totalDownloads }}</div>
</div>
<div class="flex flex-col gap-3">
<div class="flex flex-col gap-3 min-h-[100px]">
<div v-if="loading && statsList.length === 0" class="flex h-20 items-center justify-center">
<div class="h-6 w-6 animate-spin rounded-full border-2 border-[#ADFF5B] border-t-transparent"></div>
</div>
<div
v-for="item in stats"
:key="item.label"
v-for="item in statsList"
:key="item.platform"
class="flex items-center justify-between text-white/90"
>
<div class="flex items-center gap-3">
<span class="ml-1 text-xs font-medium">{{ item.label }}</span>
<span class="ml-1 text-xs font-medium">{{ item.platform }}</span>
</div>
<div class="mr-1 text-base font-semibold tabular-nums">{{ item.value }}</div>
<div class="mr-1 text-base font-semibold tabular-nums">{{ item.visits }}</div>
</div>
</div>
<div class="mt-2 text-xs text-white/40">相比前一个月+19%</div>
<div class="mt-2 text-xs text-white/40">实时下载统计数据</div>
</div>
</template>
<script setup lang="ts">
const stats = [
{ label: 'iPhone/iPad', value: 42 },
{ label: 'Windows', value: 7 },
{ label: 'Android', value: 8 },
{ label: 'Mac', value: 15 },
]
</script>

44
src/pages/UserCenter/components/OrderDetails/OrderList.vue
View File

@ -1,8 +1,8 @@
<template>
<div class="flex flex-1 flex-col overflow-hidden">
<!-- List Container -->
<div class="h-[470px]">
<div v-if="loading" class="flex h-40 items-center justify-center">
<div class="h-[470px] overflow-y-auto pr-1">
<div v-if="loading && list.length === 0" class="flex h-40 items-center justify-center">
<div
class="h-8 w-8 animate-spin rounded-full border-4 border-[#ADFF5B] border-t-transparent"
></div>
@ -11,38 +11,34 @@
v-else-if="list.length === 0"
class="flex h-40 items-center justify-center text-gray-500"
>
暂无推荐数据
暂无成交数据
</div>
<div v-else class="space-y-[10px]">
<div
v-for="order in list"
:key="order.id"
v-for="(order, index) in list"
:key="index"
class="rounded-[20px] bg-[#CECECF] py-2 text-[14px] font-normal text-black"
>
<div class="grid grid-cols-2 gap-y-1">
<!-- Order No -->
<!-- User Info -->
<div class="col-span-2 pl-4">
<div class="">用户ID</div>
<div class="break-all">{{ order.order_no }}</div>
<div class="text-xs text-gray-500">用户</div>
<div class="break-all font-medium">{{ order.user_email }}</div>
</div>
<!-- Name and Status -->
<!-- ID and Amount -->
<div class="pl-4">
<div class="text-gray-500">名称</div>
<div class="whitespace-nowrap">{{ order.quantity }}天VPN服务</div>
<div class="text-xs text-gray-500">用户 ID</div>
<div>{{ order.user_id }}</div>
</div>
<div class="">
<div class="text-gray-500">状态</div>
<div>{{ statusText(order.status) }}</div>
<div class="text-xs text-gray-500">成交金额</div>
<div class="font-bold text-[#222]">${{ order.amount }}</div>
</div>
<!-- Amount and Time -->
<div class="pl-4">
<div class="text-gray-500">支付金额</div>
<div>${{ order.amount / 100 }}</div>
</div>
<div class="overflow-hidden">
<div class="text-gray-500">支付时间</div>
<!-- Time -->
<div class="col-span-2 pl-4">
<div class="text-xs text-gray-500">成交时间</div>
<div class="whitespace-nowrap">{{ formatTime(order.created_at) }}</div>
</div>
</div>
@ -56,14 +52,14 @@
<button
@click="changePage(1)"
:disabled="page === 1"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity disabled:opacity-30"
>
<span class="text-lg font-bold text-[#848484]">&lt;&lt;</span>
</button>
<button
@click="changePage(page - 1)"
:disabled="page === 1"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity disabled:opacity-30"
>
<span class="text-lg font-bold text-[#848484]">&lt;</span>
</button>
@ -78,14 +74,14 @@
<button
@click="changePage(page + 1)"
:disabled="page >= totalPages"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity disabled:opacity-30"
>
<span class="text-lg font-bold text-[#848484]">&gt;</span>
</button>
<button
@click="changePage(totalPages)"
:disabled="page >= totalPages"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity"
class="flex h-[30px] min-w-[30px] items-center justify-center rounded-full bg-[#EAEAEA] transition-opacity disabled:opacity-30"
>
<span class="text-lg font-bold text-[#848484]">&gt;&gt;</span>
</button>

40
src/pages/UserCenter/components/ProxyData/index.vue
View File

@ -1,3 +1,33 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import request from '@/utils/request'
const data = ref([
{ label: '点击量', value: 0, key: 'clicks' },
{ label: '浏览量', value: 0, key: 'views' },
{ label: '付费数量', value: 0, key: 'paid_count' },
])
const growthRate = ref('N/A')
async function fetchStats() {
try {
const res: any = await request.get('/api/v1/public/user/agent/realtime')
data.value = data.value.map((item) => ({
...item,
value: res[item.key] || 0,
}))
growthRate.value = res.growth_rate || 'N/A'
} catch (error) {
console.error('Fetch proxy data error:', error)
}
}
onMounted(() => {
fetchStats()
})
</script>
<template>
<div
class="lucid-glass-bar flex w-full flex-col justify-between rounded-4xl! border-1 border-white px-6 py-7"
@ -17,14 +47,6 @@
</div>
</div>
<div class="mt-2 text-xs text-white/40">相比前一个月+32%</div>
<div class="mt-2 text-xs text-white/40">相比前一个月 {{ growthRate }}</div>
</div>
</template>
<script setup lang="ts">
const data = [
{ label: '点击量', value: 782 },
{ label: '浏览量', value: 699 },
{ label: '付费数量', value: 54 },
]
</script>

73
src/pages/UserCenter/components/SalesData/index.vue
View File

@ -1,3 +1,50 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { Button } from '@/components/ui/button'
import request from '@/utils/request'
defineEmits(['show-history'])
const salesPage = ref({
total: 0,
list: [] as any[],
})
const loading = ref(false)
async function fetchSales() {
loading.value = true
try {
const res: any = await request.get('/api/v1/public/user/invite/sales', {
page: 1,
size: 8,
})
salesPage.value = res
} catch (error) {
console.error('Fetch sales error:', error)
} finally {
loading.value = false
}
}
function formatTime(timestamp: number) {
if (!timestamp) return '-'
const date = new Date(timestamp)
return new Intl.DateTimeFormat('zh-CN', {
year: 'numeric',
month: 'numeric',
day: 'numeric',
hour: '2-digit',
minute: '2-digit',
hour12: false,
}).format(date)
}
onMounted(() => {
fetchSales()
})
</script>
<template>
<div
class="lucid-glass-bar flex h-full w-full flex-col rounded-4xl! border-1 border-white px-6 py-7"
@ -5,7 +52,7 @@
<div class="mb-[20px] flex justify-between border-b-1 border-dashed pb-4">
<div>
<div class="mb-1 text-xl font-bold text-white">最近销售数据</div>
<div class="text-sm text-white/40">本月已成交订单54人/次</div>
<div class="text-sm text-white/40">累计成交订单{{ salesPage.total }}人/次</div>
</div>
<Button
variant="link"
@ -17,15 +64,18 @@
</div>
<div class="flex-1 overflow-y-auto pr-1">
<div class="border-t border-dashed border-white/20 pt-4">
<div v-if="loading && salesPage.list.length === 0" class="flex h-20 items-center justify-center">
<div class="h-6 w-6 animate-spin rounded-full border-2 border-[#ADFF5B] border-t-transparent"></div>
</div>
<div v-else class="border-t border-dashed border-white/20 pt-4">
<div
v-for="(item, index) in sales"
v-for="(item, index) in salesPage.list"
:key="index"
class="mb-5 flex items-center justify-between last:mb-0"
>
<div class="flex flex-col">
<span class="text-sm font-semibold text-white">{{ item.email }}</span>
<span class="text-[10px] text-white/40">{{ item.time }}</span>
<span class="text-sm font-semibold text-white">{{ item.user_email }}</span>
<span class="text-[10px] text-white/40">{{ formatTime(item.created_at) }}</span>
</div>
<div class="text-lg font-bold text-white tabular-nums">$ {{ item.amount }}</div>
</div>
@ -33,16 +83,3 @@
</div>
</div>
</template>
<script setup lang="ts">
import { Button } from '@/components/ui/button'
defineEmits(['show-history'])
const sales = [
{ email: '321x***.com', time: '2026/1/10 22:32', amount: '2.99' },
{ email: 'fafax***.com', time: '2026/1/10 22:32', amount: '44.99' },
{ email: 'kjkljl***.com', time: '2026/1/10 22:32', amount: '19.79' },
{ email: '098f***.com', time: '2026/1/10 22:32', amount: '2.99' },
]
</script>

13
src/pages/UserCenter/components/UserInfo/index.vue
View File

@ -48,10 +48,10 @@
<div>
<div class="flex flex-col gap-[10px] px-6 pt-8 pb-9">
<div class="h-[50px] w-full rounded-[32px] bg-[#222222] px-4 leading-[50px] font-medium">
历史佣金总计：$ 1,326.99
历史佣金总计：$ {{ (inviteStats.friendly_count / 100).toFixed(2) }}
</div>
<div class="h-[50px] w-full rounded-[32px] bg-[#222222] px-4 leading-[50px] font-medium">
历史推荐人数：123人
历史推荐人数：{{ inviteStats.history_count }}人
</div>
<Button
variant="outline"
@ -84,6 +84,10 @@ const userInfo = ref({
share_link: '',
commission: 0,
})
const inviteStats = ref({
friendly_count: 0,
history_count: 0,
})
const isUserLoading = ref(true)
async function init() {
// 1. 用户信息 & 设备列表
@ -101,6 +105,11 @@ async function init() {
.finally(() => {
isUserLoading.value = false
})
// 2. 邀请统计
request.get('/api/v1/public/user/invite/stats').then((res: any) => {
inviteStats.value = res
})
}
onMounted(() => {

4
vite.config.ts
View File

@ -19,9 +19,9 @@ export default defineConfig({
// 将所有以 /api 开头的请求转发到目标服务器
// 1. 匹配所有以 /public 开头的请求
'/api/v1': {
target: 'https://hifastvpn.com',
target: 'https://tapi.hifast.biz/',
changeOrigin: true,
// rewrite: (path) => path.replace(/^\/api/, ''),
rewrite: (path) => path.replace(/^\/api/, ''),
autoRewrite: true,
},
},