|
@@ -5,22 +5,13 @@
|
|
</div>
|
|
</div>
|
|
<div class="px-20">
|
|
<div class="px-20">
|
|
<NuxtLink v-if="!token" to="/login" class="flex items-center space-x-15">
|
|
<NuxtLink v-if="!token" to="/login" class="flex items-center space-x-15">
|
|
- <div
|
|
|
|
- class="flex items-center justify-center bg-[#d9d9d9] rounded-full h-60 w-60"
|
|
|
|
- >
|
|
|
|
- <span
|
|
|
|
- class="iconfont icon-profile text-black-6"
|
|
|
|
- style="font-size: 30px"
|
|
|
|
- ></span>
|
|
|
|
|
|
+ <div class="flex items-center justify-center bg-[#d9d9d9] rounded-full h-60 w-60">
|
|
|
|
+ <span class="iconfont icon-profile text-black-6" style="font-size: 30px"></span>
|
|
</div>
|
|
</div>
|
|
<span class="text-black-6 text-base">登录</span>
|
|
<span class="text-black-6 text-base">登录</span>
|
|
</NuxtLink>
|
|
</NuxtLink>
|
|
|
|
|
|
- <div
|
|
|
|
- @click="handleToProfile"
|
|
|
|
- v-else-if="token"
|
|
|
|
- class="flex items-center space-x-15"
|
|
|
|
- >
|
|
|
|
|
|
+ <div @click="handleToProfile" v-else-if="token" class="flex items-center space-x-15">
|
|
<van-image
|
|
<van-image
|
|
:src="userInfo.headImageUrl || defaultAvatar"
|
|
:src="userInfo.headImageUrl || defaultAvatar"
|
|
height="60"
|
|
height="60"
|
|
@@ -34,9 +25,7 @@
|
|
</div>
|
|
</div>
|
|
<div v-if="userInfo.personalSign" class="text-black-6 text-sm">
|
|
<div v-if="userInfo.personalSign" class="text-black-6 text-sm">
|
|
<span class="text-black-6">个性签名:</span>
|
|
<span class="text-black-6">个性签名:</span>
|
|
- <span class="text-black-3 break-all">{{
|
|
|
|
- userInfo.personalSign
|
|
|
|
- }}</span>
|
|
|
|
|
|
+ <span class="text-black-3 break-all">{{ userInfo.personalSign }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -69,147 +58,142 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
- <van-button
|
|
|
|
- v-if="token"
|
|
|
|
- round=""
|
|
|
|
- @click="handleLogout"
|
|
|
|
- plain
|
|
|
|
- style="margin: 20px 20px"
|
|
|
|
- >退出登录</van-button
|
|
|
|
- >
|
|
|
|
|
|
+ <van-button v-if="token" round="" @click="handleLogout" plain style="margin: 20px 20px">
|
|
|
|
+ 退出登录
|
|
|
|
+ </van-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
-import menu_travel_home from "~/assets/img/navbar/menu_home.png";
|
|
|
|
-import menu_car from "@/assets/img/navbar/menu_car.png";
|
|
|
|
-import menu_create_note from "@/assets/img/navbar/menu_create_note.png";
|
|
|
|
-import menu_house from "@/assets/img/navbar/menu_house.png";
|
|
|
|
-import menu_labour from "@/assets/img/navbar/menu_loubar.png";
|
|
|
|
-import menu_tickets from "@/assets/img/navbar/menu_tickets.png";
|
|
|
|
-import menu_travel_note from "@/assets/img/navbar/menu_travel_note.png";
|
|
|
|
-import menu_travel_project from "@/assets/img/navbar/menu_travel_project.png";
|
|
|
|
-import menu_visa from "@/assets/img/navbar/menu_visa.png";
|
|
|
|
-import menu_profile from "@/assets/img/navbar/menu_profile.png";
|
|
|
|
-import defaultAvatar from "~/assets/img/default_avatar.png";
|
|
|
|
-import LeftMenuItem from "./LeftMenuItem.vue";
|
|
|
|
|
|
+import menu_travel_home from '~/assets/img/navbar/menu_home.png'
|
|
|
|
+import menu_car from '@/assets/img/navbar/menu_car.png'
|
|
|
|
+import menu_create_note from '@/assets/img/navbar/menu_create_note.png'
|
|
|
|
+import menu_house from '@/assets/img/navbar/menu_house.png'
|
|
|
|
+import menu_labour from '@/assets/img/navbar/menu_loubar.png'
|
|
|
|
+import menu_tickets from '@/assets/img/navbar/menu_tickets.png'
|
|
|
|
+import menu_travel_note from '@/assets/img/navbar/menu_travel_note.png'
|
|
|
|
+import menu_travel_project from '@/assets/img/navbar/menu_travel_project.png'
|
|
|
|
+import menu_visa from '@/assets/img/navbar/menu_visa.png'
|
|
|
|
+import menu_profile from '@/assets/img/navbar/menu_profile.png'
|
|
|
|
+import defaultAvatar from '~/assets/img/default_avatar.png'
|
|
|
|
+import LeftMenuItem from './LeftMenuItem.vue'
|
|
|
|
|
|
-const visible = defineModel("visible");
|
|
|
|
|
|
+const visible = defineModel('visible')
|
|
|
|
|
|
-const route = useRoute();
|
|
|
|
|
|
+const route = useRoute()
|
|
|
|
|
|
-const authStore = useAuthStore();
|
|
|
|
-const { token } = storeToRefs(authStore);
|
|
|
|
|
|
+const authStore = useAuthStore()
|
|
|
|
+const { token } = storeToRefs(authStore)
|
|
|
|
|
|
-const userInfoStore = useUserInfoStore();
|
|
|
|
-const { userInfo } = storeToRefs(userInfoStore);
|
|
|
|
|
|
+const userInfoStore = useUserInfoStore()
|
|
|
|
+const { userInfo } = storeToRefs(userInfoStore)
|
|
|
|
|
|
-const menuData = ref([]);
|
|
|
|
|
|
+const menuData = ref([])
|
|
|
|
|
|
const writeNoteMenu = {
|
|
const writeNoteMenu = {
|
|
- title: "写游记",
|
|
|
|
|
|
+ title: '写游记',
|
|
icon: menu_create_note,
|
|
icon: menu_create_note,
|
|
- to: "/note-create",
|
|
|
|
-};
|
|
|
|
|
|
+ to: '/note-create'
|
|
|
|
+}
|
|
|
|
|
|
const fixedMenuData = [
|
|
const fixedMenuData = [
|
|
{
|
|
{
|
|
- title: "首页",
|
|
|
|
|
|
+ title: '首页',
|
|
icon: menu_travel_home,
|
|
icon: menu_travel_home,
|
|
- to: "/",
|
|
|
|
|
|
+ to: '/'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "游记",
|
|
|
|
|
|
+ title: '游记',
|
|
icon: menu_travel_note,
|
|
icon: menu_travel_note,
|
|
- to: "/travel-notes",
|
|
|
|
|
|
+ to: '/travel-notes'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "旅游项目",
|
|
|
|
|
|
+ title: '旅游项目',
|
|
icon: menu_travel_project,
|
|
icon: menu_travel_project,
|
|
- to: "/travel-projects",
|
|
|
|
|
|
+ to: '/travel-projects'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "签证居留",
|
|
|
|
|
|
+ title: '签证居留',
|
|
icon: menu_visa,
|
|
icon: menu_visa,
|
|
- to: "/visa",
|
|
|
|
|
|
+ to: '/visa'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "全球包车",
|
|
|
|
|
|
+ title: '全球包车',
|
|
icon: menu_car,
|
|
icon: menu_car,
|
|
- to: "/car",
|
|
|
|
|
|
+ to: '/car'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "买房卖房",
|
|
|
|
|
|
+ title: '买房卖房',
|
|
icon: menu_house,
|
|
icon: menu_house,
|
|
- to: "/house",
|
|
|
|
- },
|
|
|
|
-];
|
|
|
|
|
|
+ to: '/house'
|
|
|
|
+ }
|
|
|
|
+]
|
|
|
|
|
|
const profileMenu = [
|
|
const profileMenu = [
|
|
{
|
|
{
|
|
- title: "旅游订单",
|
|
|
|
- to: "/profile/travel-orders",
|
|
|
|
|
|
+ title: '旅游订单',
|
|
|
|
+ to: '/profile/travel-orders'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "包车订单",
|
|
|
|
- to: "/profile/car-orders",
|
|
|
|
|
|
+ title: '包车订单',
|
|
|
|
+ to: '/profile/car-orders'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "签证订单",
|
|
|
|
- to: "/profile/visa-orders",
|
|
|
|
|
|
+ title: '签证订单',
|
|
|
|
+ to: '/profile/visa-orders'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "我的收藏",
|
|
|
|
- to: "/profile/collection",
|
|
|
|
|
|
+ title: '我的收藏',
|
|
|
|
+ to: '/profile/collection'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "我的游记",
|
|
|
|
- to: "/profile/notes",
|
|
|
|
|
|
+ title: '我的游记',
|
|
|
|
+ to: '/profile/notes'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: "我的评论",
|
|
|
|
- to: "/",
|
|
|
|
- },
|
|
|
|
-];
|
|
|
|
|
|
+ title: '我的评论',
|
|
|
|
+ to: '/profile/my-comment'
|
|
|
|
+ }
|
|
|
|
+]
|
|
|
|
|
|
-const isProfileMenuExpanded = ref(false);
|
|
|
|
|
|
+const isProfileMenuExpanded = ref(false)
|
|
|
|
|
|
watch(
|
|
watch(
|
|
token,
|
|
token,
|
|
(val) => {
|
|
(val) => {
|
|
if (!val) {
|
|
if (!val) {
|
|
- menuData.value = fixedMenuData;
|
|
|
|
|
|
+ menuData.value = fixedMenuData
|
|
} else {
|
|
} else {
|
|
- userInfoStore.getUserInfo();
|
|
|
|
- menuData.value = [...fixedMenuData, writeNoteMenu];
|
|
|
|
|
|
+ userInfoStore.getUserInfo()
|
|
|
|
+ menuData.value = [...fixedMenuData, writeNoteMenu]
|
|
}
|
|
}
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- immediate: true,
|
|
|
|
|
|
+ immediate: true
|
|
}
|
|
}
|
|
-);
|
|
|
|
|
|
+)
|
|
|
|
|
|
function handleClickMenu(item) {
|
|
function handleClickMenu(item) {
|
|
- visible.value = false;
|
|
|
|
|
|
+ visible.value = false
|
|
navigateTo({
|
|
navigateTo({
|
|
- path: item.to,
|
|
|
|
- });
|
|
|
|
|
|
+ path: item.to
|
|
|
|
+ })
|
|
}
|
|
}
|
|
|
|
|
|
function handleToProfile() {
|
|
function handleToProfile() {
|
|
- visible.value = false;
|
|
|
|
|
|
+ visible.value = false
|
|
navigateTo({
|
|
navigateTo({
|
|
- path: "/profile",
|
|
|
|
- });
|
|
|
|
|
|
+ path: '/profile'
|
|
|
|
+ })
|
|
}
|
|
}
|
|
|
|
|
|
function handleLogout() {
|
|
function handleLogout() {
|
|
try {
|
|
try {
|
|
- request("/website/web/doLogout", { method: "post" });
|
|
|
|
|
|
+ request('/website/web/doLogout', { method: 'post' })
|
|
} finally {
|
|
} finally {
|
|
- authStore.cleanToken();
|
|
|
|
- navigateTo("/");
|
|
|
|
- visible.value = false;
|
|
|
|
|
|
+ authStore.cleanToken()
|
|
|
|
+ navigateTo('/')
|
|
|
|
+ visible.value = false
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|