将原始的登录代码注入进新的接口

src/layout/components/Navbar/components/User.vue

@@ -7,6 +7,9 @@
 		</div>
 		<template #dropdown>
 			<el-dropdown-menu class="user-dropdown">
+				<router-link to="/book/home">
+					<el-dropdown-item> 商城首页</el-dropdown-item>
+				</router-link>
 				<router-link to="/profile">
 					<el-dropdown-item> {{ $t('app.profile') }} </el-dropdown-item>
 				</router-link>
@@ -20,16 +23,22 @@
 import { useUserStore } from '@/store/modules/user'
 import { useRouter } from 'vue-router'
 import { ArrowDown } from '@element-plus/icons-vue'
+import constant from '@/utils/constant'
+import { ElNotification } from 'element-plus'
 
 const userStore = useUserStore()
 const router = useRouter()
 
 const logout = () => {
 	userStore.logoutAction().then(() => {
-		// router.push({ path: '/login' })
+		ElNotification({
+			title: '登出成功！！！',
+			type: 'success'
+		})
+		router.push({ path: constant.loginPage })
 
 		// 刷新页面
-		location.reload()
+		//location.reload()
 	})
 }
 </script>

src/utils/constant.ts

@@ -8,7 +8,7 @@ export default {
 	version: appPackage.version,
 
 	// 登录成功后，跳转页面
-	loginPage: '/dashboard/workbench',
+	loginPage: '/book/index',
 
 	// API地址
 	apiUrl: import.meta.env.VITE_API_URL,

src/utils/request.ts

@@ -22,11 +22,6 @@ service.interceptors.request.use(
 			config.headers.Authorization = userStore.token
 		}
 
-		var token = getCookie('book_user')
-		if (token) {
-			config.headers['cookie'] = token
-		}
-
 		config.headers['Accept-Language'] = cache.getLanguage()
 
 		// 追加时间戳，防止GET请求缓存

src/views/book/component/User.vue

@@ -0,0 +1,68 @@
+<template>
+	<el-dropdown class="avatar-container" trigger="hover">
+		<div class="avatar-wrapper">
+			<el-avatar shape="circle" :size="30" :src="userStore.user.avatar"></el-avatar>
+			<span>{{ userStore.user.realName }}</span>
+			<el-icon class="el-icon--right"><ArrowDown /></el-icon>
+		</div>
+		<template #dropdown>
+			<el-dropdown-menu class="user-dropdown">
+				<router-link to="/dashboard/workbench">
+					<el-dropdown-item> 控制台 </el-dropdown-item>
+				</router-link>
+				<router-link to="/profile">
+					<el-dropdown-item> {{ $t('app.profile') }} </el-dropdown-item>
+				</router-link>
+
+				<el-dropdown-item divided @click="logout"> {{ $t('app.signOut') }} </el-dropdown-item>
+			</el-dropdown-menu>
+		</template>
+	</el-dropdown>
+</template>
+
+<script setup lang="ts">
+import { useUserStore } from '@/store/modules/user'
+import { useRouter } from 'vue-router'
+import { ArrowDown } from '@element-plus/icons-vue'
+import constant from '@/utils/constant'
+import { ElNotification } from 'element-plus'
+
+const userStore = useUserStore()
+const router = useRouter()
+
+const logout = () => {
+	userStore.logoutAction().then(() => {
+		ElNotification({
+			title: '登出成功！！！',
+			type: 'success'
+		})
+		router.push({ path: constant.loginPage })
+
+		// 刷新页面
+		//location.reload()
+	})
+}
+</script>
+
+<style lang="scss" scoped>
+.avatar-container {
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+	height: var(--theme-header-height);
+	.avatar-wrapper {
+		display: flex;
+		align-items: center;
+		white-space: nowrap;
+		cursor: pointer;
+		padding: 0 8px;
+		color: var(--theme-header-text-color);
+		span {
+			margin-left: 6px;
+		}
+	}
+	//&:hover {
+	//	background: var(--theme-header-hover-color);
+	//}
+}
+</style>

src/views/book/index.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
 import { useRouter } from 'vue-router'
+import User from './component/User.vue'
 import { onMounted, ref } from 'vue'
-import { getCookie } from '@/utils/tokenUtil'
-import { getUserInfo } from '@/api/book'
+import { useUserStore } from '@/store/modules/user'
+const userStore = useUserStore()
 const router = useRouter()
 // 记录切换值
 const changeValue = ref('/book/index')
@@ -15,13 +16,6 @@ const changeRouters = () => {
 	}
 	router.push(changeValue.value)
 }
-
-onMounted(() => {
-	console.log(getCookie('book_user'))
-	// getUserInfo().then(res => {
-	// 	console.log(res)
-	// })
-})
 </script>
 
 <template>
@@ -29,10 +23,6 @@ onMounted(() => {
 		<div class="nav-link">
 			<div class="site-nav-bd">
 				<ul>
-					<li @click="router.push('/book/login?returnUrl=/book/index&status=0')">亲，请登录</li>
-					<li @click="router.push('/book/login?returnUrl=/book/index&status=1')">免费注册</li>
-				</ul>
-				<ul>
 					<li @click="changeRouters">{{ changeValue == '/book/my' ? '商城首页' : '我的淘宝' }}</li>
 					<li @click="router.push('/book/trolley')">
 						<el-icon>
@@ -46,9 +36,10 @@ onMounted(() => {
 						</el-icon>
 						收藏夹
 					</li>
-					<li @click="router.push('/login')">
-						<el-icon><Setting /></el-icon>书城管理后台
-					</li>
+				</ul>
+				<ul>
+					<li v-if="userStore?.token"><User></User></li>
+					<li v-else @click="router.push('/login')">登录/注册</li>
 				</ul>
 			</div>
 		</div>

src/views/login/account.vue

@@ -25,6 +25,7 @@ import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import constant from '@/utils/constant'
 import { sm2Encrypt } from '@/utils/smCrypto'
+import { ElNotification } from 'element-plus'
 
 const userStore = useUserStore()
 const router = useRouter()
@@ -88,6 +89,10 @@ const onLogin = () => {
 		userStore
 			.accountLoginAction(loginData)
 			.then(() => {
+				ElNotification({
+					title: '登录成功！！！',
+					type: 'success'
+				})
 				router.push({ path: constant.loginPage })
 			})
 			.catch(() => {

src/views/login/index.vue

@@ -14,7 +14,6 @@
 			</div>
 			<account v-if="loginType === 'account'" />
 			<mobile v-if="loginType === 'mobile'" />
-			<third />
 		</div>
 	</div>
 </template>