From 5f00696dfb25bc90034448ceb634ed1ef256681a Mon Sep 17 00:00:00 2001
From: qiyunfeng-create <1940665526@qq.com>
Date: 星期四, 21 八月 2025 21:13:35 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/xiehe_website
---
src/views/classManage/index.vue | 288 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 288 insertions(+), 0 deletions(-)
diff --git a/src/views/classManage/index.vue b/src/views/classManage/index.vue
new file mode 100644
index 0000000..9a0405a
--- /dev/null
+++ b/src/views/classManage/index.vue
@@ -0,0 +1,288 @@
+<template>
+ <div class="layoutBox">
+ <Header class="header"></Header>
+ <div class="layoutContentBox clear">
+ <div class="classContentBox clear">
+ <div class="leftList fl">
+ <!-- <div class="main title" @click="goBack()"> -->
+ <div class="main title">
+ <!-- <el-icon><ArrowLeft /></el-icon> -->
+ <span>鎴戠殑鐝骇</span>
+ </div>
+ <div class="classInfo-box">
+ <div class="iconBox"><img :src="classIcon" /></div>
+ <div class="infoBox">
+ <div class="main">{{ classInfo?.name }}</div>
+ <div class="job" v-if="userData && userData.role == 'Teacher'">
+ <span class="mainbg">鍔╂暀</span>
+ </div>
+ <div class="job" v-else><span class="mainbg">瀛︾敓</span></div>
+ </div>
+ </div>
+ <div class="line"></div>
+ <ul class="menu">
+ <li
+ v-for="(item, index) in listMenu"
+ :key="index"
+ @click="goRouter(item, index)"
+ :class="activeIndex == index ? 'activeItem mainbg hover' : 'menuItem hover'"
+ >
+ <span
+ :style="{
+ fill: activeIndex == index ? '#fff' : '#000',
+ }"
+ v-html="item.icon"
+ >
+ </span>
+ <span>{{ item.label }}</span>
+ </li>
+ </ul>
+ </div>
+ <div class="rightContent">
+ <div>
+ <!-- 璁╀富浣撳仛瀛愯矾鐢辩殑鏄剧ず -->
+ <router-view />
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, provide, onMounted, inject } from "vue";
+import { useRoute, useRouter, onBeforeRouteUpdate } from "vue-router";
+import Header from "./components/headerPage.vue";
+import { menu } from "./config";
+import { getPublicImage } from "@/assets/js/middleGround/tool.js";
+import defaultImg from "@/assets/images/default-book-img.png";
+
+const router: any = useRouter();
+const route: any = useRoute();
+const MG: any = inject("MG");
+const config: any = inject("config");
+const routerVal = router.currentRoute.value;
+const path = ref(routerVal.path);
+const label = ref("");
+const classInfo: any = ref();
+const classIcon: any = ref();
+const listMenu = ref([]);
+const activeIndex = ref(0);
+const userData = ref();
+
+watch(router.currentRoute, (val) => {
+ path.value = val.path;
+ if (val.query.classInfo) {
+ const data: any = val.query.classInfo;
+ const routerInfo: any = JSON.parse(data);
+ activeIndex.value = routerInfo.index;
+ }
+});
+
+watch(classInfo, (val) => {
+ if (val) {
+ activeIndex.value = val.index;
+ }
+ if (!val.index) {
+ activeIndex.value = 0;
+ }
+});
+
+onBeforeRouteUpdate(async (to, from) => {
+ path.value = to.path;
+});
+
+onMounted(() => {
+ classInfo.value = JSON.parse(route.query.classInfo);
+ classIcon.value = classInfo.value.icon
+ ? getPublicImage(classInfo.value.icon, 200)
+ : defaultImg;
+ menu.forEach((item) => {
+ if ("/" + item.path === path.value) {
+ label.value = item.label;
+ }
+ });
+ const userCache: any = localStorage.getItem(config.userInfoKey);
+ const userInfo = JSON.parse(userCache);
+ userData.value = userInfo;
+ if (!userInfo) {
+ router.push({
+ path: "/",
+ });
+ return false;
+ }
+ if (userInfo.role != "Teacher") {
+ const data: any = menu.filter(
+ (item: any) => item.path != "studentManage" && item.path != "jobAnalysis"
+ );
+ listMenu.value = data;
+ } else {
+ const data: any = menu;
+ // if (!classInfo.bookRefCode) {
+ // // 铻嶅獟浣撳浘涔︼紝鏃犳暟瀛楅槄璇伙紝鏃犳硶璺宠浆
+ // const list: any = menu.filter((item: any) => item.path != 'teachingPlan')
+ // listMenu.value = list;
+ // return false
+ // }
+ listMenu.value = data;
+ }
+});
+
+const goRouter = (item: any, index: number) => {
+ activeIndex.value = index;
+ if (
+ !localStorage.getItem(config.tokenKey) ||
+ localStorage.getItem(config.tokenKey) == null
+ ) {
+ router.push({
+ path: "/home",
+ query: {
+ showLogin: "1",
+ },
+ });
+ } else {
+ label.value = item.label;
+ classInfo.value.index = index;
+ if (item.key == 5) {
+ router.push({
+ path: userData.value.role != "Teacher" ? "/studentJob" : "/jobManage",
+ query: {
+ classInfo: JSON.stringify(classInfo.value),
+ },
+ });
+ } else {
+ router.push({
+ path: item.path,
+ query: {
+ classInfo: JSON.stringify(classInfo.value),
+ },
+ });
+ }
+ }
+};
+
+const goBack = () => {
+ router.go(-1);
+};
+</script>
+
+<style lang="less" scoped>
+.layoutBox {
+ width: 100%;
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ background-color: #fff;
+ .layoutContentBox {
+ flex: 1;
+ height: auto;
+ }
+ .classContentBox {
+ padding: 10px 40px;
+ display: flex;
+ height: 100%;
+ .leftList {
+ padding: 20px;
+ width: 280px;
+ min-width: 230px;
+ box-shadow: 0px 0px 20px 1px #ccc;
+ border-radius: 3px;
+ background-color: #fff;
+ .title {
+ font-size: 16px;
+ display: flex;
+ align-items: center;
+ cursor: pointer;
+ span {
+ margin-left: 10px;
+ }
+ }
+ .classInfo-box {
+ padding: 20px 10px;
+ margin-bottom: 10px;
+ display: flex;
+ .iconBox {
+ width: 90px;
+ height: 120px;
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ }
+ }
+ .infoBox {
+ flex: 1;
+ padding-left: 10px;
+ .main {
+ font-size: 16px;
+ line-height: 20px;
+ }
+ .job {
+ // padding:10px;
+ margin-top: 20px;
+ span {
+ padding: 5px 15px;
+ border-radius: 20px;
+ }
+ }
+ }
+ }
+ .line {
+ width: 100%;
+ height: 1px;
+ background: linear-gradient(63deg, #ffffff 0%, #e0f2ff 51%, #ffffff 100%);
+ }
+ .menu {
+ margin-top: 20px;
+ li {
+ height: 36px;
+ padding: 0 40px;
+ margin: 5px 0;
+ font-size: 16px;
+ display: flex;
+ align-items: center;
+ position: relative;
+
+ img {
+ width: 18px;
+ height: 18px;
+ }
+
+ span {
+ margin-left: 10px;
+ font-size: 15px;
+ }
+ }
+
+ .activeItem {
+ background-size: 100% 100%;
+ }
+ }
+ }
+
+ .rightContent {
+ flex: 1;
+ overflow: auto;
+ min-width: 800px;
+ margin-left: 15px;
+ box-shadow: 0px 0px 20px 1px #ccc;
+ border-radius: 3px;
+ background-color: #fff;
+ }
+ }
+
+ .header {
+ flex-shrink: 0;
+ width: 100%;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ .layoutContentBox {
+ flex: 1;
+ overflow: auto;
+ // display: flex;
+ // flex-direction: column;
+ }
+}
+</style>
--
Gitblit v1.9.1