登录注册

2026-05-18 15:22:08 +08:00
parent 4af58134fd
commit d327797236
16 changed files with 734 additions and 14 deletions
--- a/src/pages/my-account/index.vue
+++ b/src/pages/my-account/index.vue
@@ -0,0 +1,61 @@
+<template>
+	<div class="my-account">
+		<div class="header">
+			<h1 class="title">
+				<span class="iconfont icon-tubiao-"></span>
+				<span>My Account</span>
+			</h1>
+		</div>
+		<div class="content" v-if="!token">
+			<Login />
+			<Register />
+		</div>
+		<div class="content" v-else>
+			<AccountInfo />
+		</div>
+	</div>
+</template>
+<script setup lang="ts">
+	import { computed } from 'vue'
+	import Login from './login.vue'
+	import Register from './register.vue'
+	import AccountInfo from './account-info.vue'
+	import { useUserInfoStore } from '@/stores/userInfo'
+	const userInfoStore = useUserInfoStore()
+	const token = computed(() => userInfoStore.state.token)
+</script>
+
+<style scoped lang="less">
+	.my-account {
+		background-color: #f9f9f9;
+		> .header {
+			border-top: var(--main-header-height, 85px) solid #000;
+			background-color: #666;
+			padding: 32px 0;
+			color: #fff;
+			margin-bottom: 32px;
+			> h1 {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				height: 80px;
+				> span {
+					font-size: 40px;
+					font-weight: 400;
+				}
+			}
+		}
+		> .content {
+			max-width: 1200px;
+			margin: 0 auto;
+			padding-bottom: 80px;
+			display: flex;
+			align-items: flex-start;
+			gap: 60px;
+			> * {
+				flex: 1;
+			}
+			animation: opacity-in 0.3s linear both;
+		}
+	}
+</style>