first commit

2026-01-29 04:16:00 -08:00
commit e233c87fe6
81 changed files with 11399 additions and 0 deletions
@@ -0,0 +1,4 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.14678 6.25189H11.9369C12.5063 6.25189 13.0523 6.47268 13.4549 6.86569C13.8575 7.2587 14.0837 7.79174 14.0837 8.34754V17.9046C14.0837 18.4604 13.8575 18.9934 13.4549 19.3864C13.0523 19.7794 12.5063 20.0002 11.9369 20.0003H2.14682C1.57745 20.0003 1.03139 19.7795 0.628788 19.3864C0.226182 18.9934 4.67869e-10 18.4604 4.67869e-10 17.9046V8.34758C-5.88518e-06 8.07237 0.055518 7.79986 0.163401 7.5456C0.271285 7.29133 0.429415 7.06031 0.628762 6.8657C0.82811 6.6711 1.06477 6.51673 1.32523 6.41141C1.58569 6.30609 1.86486 6.25189 2.14678 6.25189Z" fill="black"/>
+<path d="M18.3412 0H8.55111C7.98218 0.00138285 7.43695 0.222623 7.03465 0.615344C6.63235 1.00807 6.40571 1.54031 6.4043 2.0957V5.00011H11.9369C12.8457 5.00221 13.7166 5.35556 14.3592 5.98286C15.0018 6.61016 15.3638 7.46036 15.366 8.3475V13.7484H18.3412C18.9101 13.747 19.4553 13.5257 19.8576 13.133C20.2599 12.7403 20.4866 12.2081 20.488 11.6527V2.09572C20.4866 1.54033 20.2599 1.00808 19.8576 0.615355C19.4553 0.222629 18.9101 0.00138455 18.3412 0Z" fill="black"/>
+</svg>
@@ -0,0 +1,117 @@
+<template>
+  <div
+    class="flex h-full w-full flex-col justify-between rounded-4xl border-1 border-white py-[32px] pb-[22px]"
+  >
+    <div>
+      <div class="mb-3 flex min-h-[88px] flex-col items-center">
+        <Transition name="fade" mode="out-in">
+          <UserCenterSkeleton v-if="isUserLoading" type="header" layout="desktop" />
+          <div v-else>
+            <div class="flex items-center">
+              <img src="./avatar.png" class="size-[60px]" alt="" />
+              <div class="ml-2 flex flex-col justify-center text-white">
+                <div class="text-base font-semibold">{{ userInfo.email }}</div>
+                <div class="flex items-center text-base font-semibold">
+                  <span class="mr-0.5 text-3xl">🌞</span> 恒星合伙人
+                </div>
+              </div>
+            </div>
+            <div class="mt-7 mb-1 font-semibold text-[#ADFF5B]">专属代理链接</div>
+            <div
+              class="mb-[10px] flex h-[50px] w-full items-center justify-between rounded-[32px] bg-[#ADFF5B] px-4 font-medium text-black"
+            >
+              {{ userInfo.share_link }}
+              <CopyIcon />
+            </div>
+            <div
+              class="flex min-h-[90px] w-full items-center justify-between rounded-[25px] bg-[#ADFF5B] px-4 font-medium text-black"
+            >
+              <div>
+                <div class="text-xl font-semibold">佣金账户余额</div>
+                <div class="text-3xl font-black">$12344</div>
+              </div>
+              <Button variant="ghost" class="hover:bg-transparent">点击提现</Button>
+            </div>
+          </div>
+        </Transition>
+      </div>
+    </div>
+    <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
+        </div>
+        <div class="h-[50px] w-full rounded-[32px] bg-[#222222] px-4 leading-[50px] font-medium">
+          历史推荐人数：123人
+        </div>
+        <Button
+          variant="outline"
+          @click="logout"
+          class="h-[50px] w-full rounded-[32px] border-2 border-white bg-transparent text-xl font-bold text-white transition-all hover:bg-white/90 active:scale-[0.98]"
+        >
+          退出登录
+        </Button>
+      </div>
+
+      <div class="text-center text-xs text-white tabular-nums">注册时间：{{ formattedDate }}</div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import UserCenterSkeleton from '@/components/user-center/UserCenterSkeleton.vue'
+import { Button } from '@/components/ui/button'
+import CopyIcon from './copy.svg?component'
+import { computed, onMounted, ref } from 'vue'
+import request from '@/utils/request'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+const userInfo = ref({
+  email: '',
+  created_at: '',
+})
+const isUserLoading = ref(true)
+async function init() {
+  // 1. 用户信息 & 设备列表
+  isUserLoading.value = true
+  request
+    .get('/api/v1/public/user/info')
+    .then((res: any) => {
+      userInfo.value = res
+      const emailInfo = res.auth_methods?.find((item: any) => item.auth_type === 'email')
+      if (emailInfo) {
+        userInfo.value.email = emailInfo.auth_identifier
+        localStorage.setItem('UserEmail', emailInfo.auth_identifier)
+      }
+    })
+    .finally(() => {
+      isUserLoading.value = false
+    })
+}
+
+onMounted(() => {
+  init()
+})
+
+const formattedDate = computed(() => {
+  const dateStr = userInfo?.value.created_at
+  if (!dateStr) return '加载中...'
+
+  const date = new Date(dateStr)
+
+  // 使用 Intl 格式化，输出类似：2026/01/29 17:00
+  return new Intl.DateTimeFormat('zh-CN', {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+    hour12: false,
+  }).format(date)
+})
+
+function logout() {
+  router.push('/')
+  localStorage.removeItem('Authorization')
+}
+</script>