头部展示学科

This commit is contained in:
lyc 2024-09-11 15:39:54 +08:00
parent db6ebbdbaf
commit 40c6e1303b
3 changed files with 109 additions and 76 deletions

View File

@ -233,7 +233,7 @@ onMounted(() => {
width: 300px; width: 300px;
height: calc(100% - 110px); height: calc(100% - 110px);
border-radius: 10px; border-radius: 10px;
z-index: 10;
:deep(.el-card__header) { :deep(.el-card__header) {
padding: 10px; padding: 10px;
} }

View File

@ -51,6 +51,8 @@ const closeWindow = () => {
<style lang="scss" scoped> <style lang="scss" scoped>
.header-tool { .header-tool {
width: 100%;
justify-content: flex-end;
-webkit-app-region: no-drag; -webkit-app-region: no-drag;
span { span {

View File

@ -2,28 +2,16 @@
<div class="title-bar flex"> <div class="title-bar flex">
<div class="left-section"> <div class="left-section">
<div class="flex title-box"> <div class="flex title-box">
<el-image style="width: 23px; height: 23px" :src="logoIco" /> <el-image style="width: 23px; height: 23px" :src="logoIco" />
<span class="title" @click="changeTab">AIX智慧课堂</span> <span class="title" @click="changeTab">AIX智慧课堂</span>
</div> </div>
<div class="change-tab"> <div class="change-tab">
<ul class="flex"> <ul class="flex">
<li class="flex" :class="[activeId == menu.path ? 'active-li' : '', menu.disabled ? 'disabled' : '']" <li class="flex" :class="[activeId == menu.path ? 'active-li' : '', menu.disabled ? 'disabled' : '']"
v-for="menu in headerMenus" :key="menu.id" @click="clickMenu(menu)"> v-for="menu in headerMenus" :key="menu.id" @click="clickMenu(menu)">
<i class="iconfont" :class="menu.icon"></i> <i class="iconfont" :class="menu.icon"></i>
<span class="text">{{ menu.name }}</span> <span class="text">{{ menu.name }}</span>
</li> </li>
<!-- <li
v-for="(item, index) in routeHeader.nowRouter"
:key="index"
class="flex"
:style="{'color' : item.color}"
:class="currentRoute === item.url ? 'active-li' : ''"
@click="handleOutLink(item.url,item.type, item.name)"
>
<i :class="item.img"></i>
<span class="text">{{ item.name }}</span>
</li> -->
</ul> </ul>
</div> </div>
</div> </div>
@ -32,26 +20,41 @@
<WindowTools /> <WindowTools />
<div class="user flex"> <div class="user flex">
<div class="avatar-container"> <div class="avatar-container">
<el-dropdown <div class="avatar-wrapper flex">
class="right-menu-item hover-effect" <el-dropdown class="right-menu-item hover-effect" @command="handleCommand">
trigger="click"
@command="handleCommand"
>
<div class="avatar-wrapper">
<img :src="dev_api + userStore.user.avatar" class="user-avatar" style="float: left" /> <img :src="dev_api + userStore.user.avatar" class="user-avatar" style="float: left" />
<div style="margin-top: 18px; font-size: 0.8em">{{ userStore.user.nickName }}</div> <template #dropdown>
<el-dropdown-menu>
<el-dropdown-item @click="changePage('/profile')">个人中心</el-dropdown-item>
<el-dropdown-item @click="changePage('/classReserv')">课程预约</el-dropdown-item>
<el-dropdown-item @click="changePage('/class')">班级中心</el-dropdown-item>
<el-dropdown-item divided command="logout">
<span>退出登录</span>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<div class="user-info flex">
<span class="user-name">{{ userStore.user.nickName }}</span>
<div class="flex">
<div class="user-depname">{{ userStore.user.deptName }}</div>
<el-dropdown @command="changeSubject">
<div class="user-subject">{{ userStore.user.edusubject }}
<el-icon class="el-icon--right"><arrow-down />
</el-icon>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="item in userSubjectList" :key="item.id" :command="item">
{{ item.edustage }}-{{ item.edusubject }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</div> </div>
<template #dropdown> </div>
<el-dropdown-menu>
<el-dropdown-item @click="changePage('/profile')">个人中心</el-dropdown-item>
<el-dropdown-item @click="changePage('/classReserv')">课程预约</el-dropdown-item>
<el-dropdown-item @click="changePage('/class')">班级中心</el-dropdown-item>
<el-dropdown-item divided command="logout">
<span>退出登录</span>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div> </div>
</div> </div>
</div> </div>
@ -59,22 +62,24 @@
</template> </template>
<script setup> <script setup>
import { ref, watch } from 'vue' import { ref, watch, onMounted } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { ElMessageBox } from 'element-plus' import { ElMessageBox } from 'element-plus'
import { ArrowDown } from '@element-plus/icons-vue'
import WindowTools from '@/components/window-tools/index.vue' import WindowTools from '@/components/window-tools/index.vue'
import useUserStore from '@/store/modules/user' import useUserStore from '@/store/modules/user'
import routerStore from '@/store/modules/route' import { updateUserInfo } from '@/api/system/user'
import outLink from '@/utils/linkConfig' import outLink from '@/utils/linkConfig'
import logoIco from '@/assets/images/logo.png' import logoIco from '@/assets/images/logo.png'
import { listEvaluation } from '@/api/classManage/index'
const routeHeader = routerStore()
const { ipcRenderer } = window.electron || {} const { ipcRenderer } = window.electron || {}
const userStore = useUserStore() const userStore = useUserStore()
const router = useRouter() const router = useRouter()
const currentRoute = ref('') const currentRoute = ref('')
const dev_api = ref(import.meta.env.VITE_APP_BASE_API) const dev_api = ref(import.meta.env.VITE_APP_BASE_API)
const userSubjectList = ref([])
const handleOutLink = (path, type, name) => { const handleOutLink = (path, type, name) => {
if (!path) return if (!path) return
@ -86,9 +91,9 @@ const handleOutLink = (path, type, name) => {
let fullPath = configObj.fullPath + path let fullPath = configObj.fullPath + path
fullPath = fullPath.replaceAll('//', '/') fullPath = fullPath.replaceAll('//', '/')
const { levelFirstId, levelSecondId } = JSON.parse(localStorage.getItem('unitId')) const { levelFirstId, levelSecondId } = JSON.parse(localStorage.getItem('unitId'))
let unitId = levelSecondId ? levelSecondId :levelFirstId let unitId = levelSecondId ? levelSecondId : levelFirstId
if(name == '教材分析' || name == '考试分析'){ if (name == '教材分析' || name == '考试分析') {
fullPath += `?unitId=${unitId}` fullPath += `?unitId=${unitId}`
} }
// //
ipcRenderer.send('openWindow', { ipcRenderer.send('openWindow', {
@ -127,35 +132,12 @@ const headerMenus = [
} }
] ]
const clickMenu = ({ id, disabled, path }) =>{ const clickMenu = ({ id, disabled, path }) => {
if(disabled) return if (disabled) return
activeId.value = id activeId.value = id
router.push(path) router.push(path)
} }
/*const menus = ref([
{
icon: 'icon-zhuye2 icon-homepage',
name: '主页',
path: '/homepage'
},
{
icon: 'icon-jiaoxueziyuan icon-resource',
name: '资源',
path: '/resource'
},
{
icon: 'icon-beike icon-prepare',
name: '备课',
path: '/prepare'
},
{
icon: 'icon-jiangke1 icon-teach',
name: '授课',
path: '/teach'
}
])*/
// //
watch( watch(
() => router.currentRoute.value, () => router.currentRoute.value,
@ -200,13 +182,42 @@ function logout() {
ipcRenderer && ipcRenderer.send('openLoginWindow') ipcRenderer && ipcRenderer.send('openLoginWindow')
}) })
}) })
.catch(() => {}) .catch(() => { })
} }
const emits = defineEmits(['setLayout']) const emits = defineEmits(['setLayout'])
function setLayout() { function setLayout() {
emits('setLayout') emits('setLayout')
} }
//
const changeSubject = async (command) =>{
const { userId, userName, phonenumber, plainpwd } = userStore.user
const data = {
userId,
userName,
edustage: command.edustage,
edusubject: command.edusubject
}
console.log(data,'data')
await updateUserInfo(data)
await userStore.login({username: phonenumber, password: plainpwd})
await userStore.getInfo()
router.go()
}
//
const getAllSubject = async () => {
const { rows } = await listEvaluation({ itemkey: "subject", pageSize: 500 })
const subject = userStore.user.subject.split(',')
userSubjectList.value = rows.filter(item =>
subject.some(el => item.id == el)
)
}
onMounted(() => {
getAllSubject()
})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -222,17 +233,20 @@ function setLayout() {
align-items: flex-start; align-items: flex-start;
flex-direction: column; flex-direction: column;
width: 50%; width: 50%;
.title-box{
.title-box {
padding-top: 8px; padding-top: 8px;
box-sizing: border-box; box-sizing: border-box;
align-items: center; align-items: center;
padding-left: 20px; padding-left: 20px;
.title { .title {
color: #4b73df; color: #4b73df;
font-size: 13px; font-size: 13px;
padding: 0 5px; padding: 0 5px;
} }
} }
.change-tab { .change-tab {
-webkit-app-region: no-drag; -webkit-app-region: no-drag;
margin-left: 20px; margin-left: 20px;
@ -273,13 +287,16 @@ function setLayout() {
color: #409eff; color: #409eff;
} }
} }
.disabled{
.disabled {
cursor: not-allowed; cursor: not-allowed;
color: #bfbfbf; color: #bfbfbf;
&:hover{
&:hover {
color: #bfbfbf; color: #bfbfbf;
} }
} }
.active-li { .active-li {
color: #409eff; color: #409eff;
} }
@ -302,11 +319,25 @@ function setLayout() {
flex-direction: column; flex-direction: column;
.user { .user {
padding-right: 10px;
.user-info { .user-info {
padding-right: 5px; padding-right: 5px;
align-items: center; align-items: flex-start;
flex-direction: column; flex-direction: column;
font-size: 12px; font-size: 12px;
height: 100%;
justify-content: space-around;
.user-depname {
margin-right: 5px;
}
.user-subject {
display: flex;
align-items: center;
font-size: 12px;
}
} }
} }
} }
@ -316,12 +347,12 @@ function setLayout() {
.avatar-wrapper { .avatar-wrapper {
display: flex; display: flex;
align-items: center;
.user-avatar { .user-avatar {
width: 30px; width: 35px;
height: 30px; height: 35px;
border-radius: 10px; border-radius: 10px;
margin-top: 8px;
margin-right: 10px; margin-right: 10px;
} }