修复bug
This commit is contained in:
parent
4cb00e2ca6
commit
2cda8ceaad
@ -13,9 +13,9 @@
|
||||
</button>
|
||||
<div class="flex md:order-2 md:space-x-0 rtl:space-x-reverse">
|
||||
|
||||
<div v-if="isLoggedIn" class="flex items-center space-x-3 right-2 fixed top-3">
|
||||
<div v-if="user.isLoggedIn" class="flex items-center space-x-3 right-2 fixed top-3">
|
||||
<div class="flex items-center">
|
||||
<span class="text-gray-900 mr-6 ">{{ username }}</span>
|
||||
<span class="text-gray-900 mr-6 ">{{ user.username }}</span>
|
||||
<img :src="avatar" alt="User Avatar" class="w-10 h-10 rounded-full " @click="showDrawer">
|
||||
</div>
|
||||
<a-drawer
|
||||
@ -28,13 +28,11 @@
|
||||
@after-open-change="afterOpenChange"
|
||||
title="个人信息"
|
||||
:closable="false"
|
||||
|
||||
|
||||
>
|
||||
<template #extra>
|
||||
<div class="flex items-center space-x-2">
|
||||
<img :src="avatar" alt="User Avatar" class="w-10 h-10 rounded-full">
|
||||
<span class="text-gray-900">{{ username }}</span>
|
||||
<img :src="user.avatar" alt="User Avatar" class="w-10 h-10 rounded-full">
|
||||
<span class="text-gray-900">{{ user.username }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="flex flex-col space-y-4 mb-4 ">
|
||||
@ -47,7 +45,7 @@
|
||||
<hr class="mb-2">
|
||||
<span class="lg:hover:text-blue-700" @click="JumpPersonalProject"><UserOutlined class="mr-1.5"/>我的项目</span>
|
||||
<span class="lg:hover:text-blue-700" @click="JumpMyManage"><ToolOutlined class="mr-1.5"/>我管理的</span>
|
||||
<span v-if="role === true" class=" lg:hover:text-blue-700" @click="JumpMyResponsible" ><UserOutlined class="mr-1.5" />我负责的</span>
|
||||
<span v-if="user.role === true" class=" lg:hover:text-blue-700" @click="JumpMyResponsible" ><UserOutlined class="mr-1.5" />我负责的</span>
|
||||
<hr>
|
||||
<span class=" lg:hover:text-blue-700" @click="JumpPersonalInformation"><MessageOutlined class="mr-1.5" />个人信息管理</span>
|
||||
|
||||
@ -80,12 +78,13 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {h, onMounted, ref} from "vue";
|
||||
import {h, ref} from "vue";
|
||||
import requests from "../../js/request.js";
|
||||
import {message} from "ant-design-vue";
|
||||
import {useRouter} from "vue-router";
|
||||
import {BellOutlined, MailOutlined, MessageOutlined, ToolOutlined, UserOutlined} from '@ant-design/icons-vue';
|
||||
|
||||
const user = defineProps(['username','role', 'isLoggedIn', 'avatar'])
|
||||
|
||||
const items = ref([
|
||||
{
|
||||
@ -155,18 +154,9 @@ const current = ref(['mail']);
|
||||
function updateCurrent(key) {
|
||||
console.log("key",key)
|
||||
current.value = [key];
|
||||
console.log('6666',current)
|
||||
|
||||
}
|
||||
const router = useRouter()
|
||||
const closable = ref(false)
|
||||
const isDropdownOpen = ref(false);
|
||||
const textColor = ref("black");
|
||||
const isLoggedIn = ref(false);
|
||||
const username =ref('') ;
|
||||
const avatar =ref('')
|
||||
const token = window.localStorage.getItem('token')
|
||||
const role =ref(false)
|
||||
// 侧边栏
|
||||
const open = ref(false);
|
||||
const afterOpenChange = bool => {
|
||||
@ -175,84 +165,19 @@ const afterOpenChange = bool => {
|
||||
const showDrawer = () => {
|
||||
open.value = true;
|
||||
};
|
||||
function toggleDropdown(){
|
||||
isDropdownOpen.value = !isDropdownOpen.value;
|
||||
|
||||
}
|
||||
// function changeColor(item){
|
||||
// const homeLink = document.getElementById('homeLink');
|
||||
// const projectsLink = document.getElementById('projectsLink');
|
||||
//
|
||||
// homeLink.classList.remove('text-blue-500');
|
||||
// projectsLink.classList.remove('text-blue-500');
|
||||
//
|
||||
// if (item === 'home') {
|
||||
// homeLink.classList.add('text-blue-500');
|
||||
// } else if (item === 'projects') {
|
||||
// projectsLink.classList.add('text-blue-500');
|
||||
// }
|
||||
// // textColor.value = 'blue';
|
||||
// }
|
||||
|
||||
function changeColor(id) {
|
||||
const links = document.getElementsByClassName('nav-link');
|
||||
for (let i = 0; i < links.length; i++) {
|
||||
if (links[i].id === id + '-link') {
|
||||
links[i].classList.add('text-blue-500');
|
||||
} else {
|
||||
links[i].classList.remove('text-blue-500');
|
||||
}
|
||||
}
|
||||
}
|
||||
// function backMain() {
|
||||
// // 当按钮被点击时,将文字颜色改为蓝色
|
||||
// // textColor.value = 'blue';
|
||||
// router.push("/")
|
||||
// }
|
||||
|
||||
function exitLogin(){
|
||||
requests.logout(token).then((res) => {
|
||||
if(res.data.code === 200){
|
||||
router.push("/login")
|
||||
router.push("/")
|
||||
console.log(res)
|
||||
isLoggedIn.value = false; //头像展示
|
||||
user.isLoggedIn = false; //头像展示
|
||||
message.success("退出成功!")
|
||||
}else{
|
||||
message.error("退出失败!")
|
||||
}
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
requests.userGetProfile(token).then((res)=>{
|
||||
console.log(res)
|
||||
// if(token ===null){
|
||||
// router.push('/')
|
||||
// }
|
||||
// else{
|
||||
if (res.data.code === 200) {
|
||||
//登录成功
|
||||
isLoggedIn.value = true; //头像展示
|
||||
username.value = res.data.data.username
|
||||
// avatar.value = res.data.data.avatar 数据库无头像,暂时用下面的头像
|
||||
avatar.value = 'https://img1.baidu.com/it/u=2005056479,139681251&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1710176400&t=4f32b862465c709f79c8fb80d3c0444b';
|
||||
console.log(username.value, avatar.value)
|
||||
if (res.data.data.role === '老师') {
|
||||
console.log('这是老师');
|
||||
// 执行老师相关的逻辑
|
||||
role.value =true
|
||||
} else {
|
||||
console.log('这不是老师');
|
||||
// 执行非老师相关的逻辑
|
||||
role.value= false
|
||||
}
|
||||
}else {
|
||||
//用户过期,重新登录
|
||||
// message.error("用户过期,请重新登录!")
|
||||
// router.push("/login")
|
||||
}
|
||||
// }
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// 跳转
|
||||
function JumpPersonalProject (){
|
||||
|
@ -157,29 +157,20 @@
|
||||
color: #4299e1 !important; /* 鼠标悬浮时的SVG颜色 */
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import NavBar from "@/components/HomeComponents/NavBar.vue";
|
||||
<script setup>
|
||||
import colors from "tailwindcss/colors.js";
|
||||
import {ref} from "vue";
|
||||
|
||||
export default {
|
||||
components: {NavBar},
|
||||
data() {
|
||||
return {
|
||||
isDropdownOpen: false,
|
||||
textColor: 'black',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
colors() {
|
||||
return colors
|
||||
},
|
||||
toggleDropdown() {
|
||||
this.isDropdownOpen = !this.isDropdownOpen;
|
||||
},
|
||||
changeColor() {
|
||||
// 当按钮被点击时,将文字颜色改为蓝色
|
||||
this.textColor = 'blue';
|
||||
},
|
||||
},
|
||||
};
|
||||
const isDropdownOpen = ref(false)
|
||||
const textColor = ref('black')
|
||||
// function colors() {
|
||||
// return colors
|
||||
// }
|
||||
// function toggleDropdown() {
|
||||
// this.isDropdownOpen = !this.isDropdownOpen;
|
||||
// }
|
||||
// function changeColor() {
|
||||
// // 当按钮被点击时,将文字颜色改为蓝色
|
||||
// textColor.value = 'blue';
|
||||
// }
|
||||
</script>
|
||||
|
@ -7,10 +7,11 @@ const router = createRouter({
|
||||
path:'/',
|
||||
name:'app',
|
||||
component:()=>import('../views/HomePage/IndexView.vue'),
|
||||
children:[{
|
||||
children:[
|
||||
{
|
||||
path: "/",
|
||||
component:() => import ('../views/HomePage/Main.vue')
|
||||
},{
|
||||
},{
|
||||
path:'/Project',
|
||||
name:'Project',
|
||||
component:()=>import('@/views/ProjectPage/ProjectCard.vue')
|
||||
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="w-[100%] h-auto">
|
||||
<div class="flex flex-col">
|
||||
<NavBar/>
|
||||
<NavBar v-bind="user" />
|
||||
<router-view></router-view>
|
||||
<More/>
|
||||
<Icp/>
|
||||
@ -10,11 +10,49 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {onMounted} from 'vue'
|
||||
import {onMounted, reactive, ref} from 'vue'
|
||||
import {initFlowbite} from 'flowbite'
|
||||
import requests from "@/js/request.js";
|
||||
|
||||
const token = window.localStorage.getItem('token')
|
||||
|
||||
const user = reactive({
|
||||
role:false,
|
||||
avatar:'',
|
||||
username:'',
|
||||
isLoggedIn:false
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
initFlowbite();
|
||||
initFlowbite();
|
||||
requests.userGetProfile(token).then((res)=>{
|
||||
console.log(res)
|
||||
// if(token ===null){
|
||||
// router.push('/')
|
||||
// }
|
||||
// else{
|
||||
if (res.data.code === 200) {
|
||||
//登录成功
|
||||
user.isLoggedIn = true; //头像展示
|
||||
user.username = res.data.data.username
|
||||
// avatar.value = res.data.data.avatar 数据库无头像,暂时用下面的头像
|
||||
user.avatar = 'https://img1.baidu.com/it/u=2005056479,139681251&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1710176400&t=4f32b862465c709f79c8fb80d3c0444b';
|
||||
// console.log(username.value, avatar.value)
|
||||
if (res.data.data.role === '老师') {
|
||||
// 执行老师相关的逻辑
|
||||
user.role =true
|
||||
} else {
|
||||
console.log('这不是老师');
|
||||
// 执行非老师相关的逻辑
|
||||
user.role= false
|
||||
}
|
||||
}else {
|
||||
//用户过期,重新登录
|
||||
// message.error("用户过期,请重新登录!")
|
||||
// router.push("/login")
|
||||
}
|
||||
// }
|
||||
})
|
||||
})
|
||||
import NavBar from "@/components/HomeComponents/NavBar.vue";
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="flex flex-col h-screen">
|
||||
<Header></Header>
|
||||
<MainSection></MainSection>
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
Loading…
x
Reference in New Issue
Block a user