This commit is contained in:
clay
2022-01-18 21:38:10 +08:00
parent fa8bc05879
commit 74a0130727
9 changed files with 334 additions and 155 deletions

View File

@@ -24,6 +24,11 @@ const routes = [
name: 'Mobile',
component: () => import(/* webpackChunkName: "about" */ '../views/mobile/index')
},
{
path: '/mobile/:secondId',
name: 'Mobile',
component: () => import(/* webpackChunkName: "about" */ '../views/mobile/index')
},
{
path: '/ts',
name: 'TeachingStaff',

View File

@@ -9,7 +9,7 @@ export function getParentNode(id){
let menuList = JSON.parse(sessionStorage.getItem("menu"));
for (let menu of menuList) {
for (let child of menu.children) {
if (id == item.encodeId){
if (id == child.encodeId){
menu.children=[]
child.children=[]
return {

View File

@@ -1,6 +1,20 @@
<template>
<div class="list">
<!--{{value}}-->
<div class="query">
<el-row>
<el-col :xs="14" :sm="14" :md="14" :lg="20" :xl="20">
<!--<div style="width: 95%;">-->
<div>
<!--<input class="query_input" v-model="query"/>-->
<el-input class="query_input" v-model="query" size="small" placeholder="请输入内容"></el-input>
</div>
</el-col>
<el-col :xs="10" :sm="10" :md="10" :lg="4" :xl="4" style="float: right">
<el-button class="query_button" type="primary" size="small" icon="el-icon-search" @click="handleCurrentChange(-1)">搜索</el-button>
</el-col>
</el-row>
</div>
<div>
<el-row>
<!--正文内容-->
@@ -43,7 +57,7 @@
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page.sync="value.pageNum"
:page-size="value.data.length"
:page-size="4"
layout="prev, pager, next, jumper"
:total="value.total">
</el-pagination>
@@ -74,27 +88,42 @@ export default {
data() {
return {
width: document.documentElement.clientWidth,
small:document.documentElement.clientWidth<=992
small:document.documentElement.clientWidth<=992,
query:'',
}
},
methods: {
getContext(context){
if (this.width <=992){
this.$router.push("/mobile/" + this.value.secondId +"/" +this.value.navId+"?id="+context.id);
let type = this.$route.query && this.$route.query.type
let router = ''
if (type!=null){
router = "?id="+context.id+'&type='+type
}else {
this.$router.push("/pc/" + this.value.secondId +"/" +this.value.navId+"?id="+context.id);
router="/" +this.value.navId+"?id="+context.id
}
if (this.width <=992){
this.$router.push("/mobile/" + this.value.secondId +router);
}else {
this.$router.push("/pc/" + this.value.secondId +router);
}
},
handleSizeChange(val) {
console.log(`每页 ${val}`);
},
handleCurrentChange(val) {
this.value.pageNum = val
if (val != -1){
this.value.pageNum = val
}
let data = {
title:this.query,
id: this.value.navId,
pageNum: val,
pageSize: 4
}
this.type = this.$route.query && this.$route.query.type
if (this.type != null&&this.type!=0){
data.id = this.value.secondId
}
getNode(data).then(res => {
this.value.data = res.rows
this.value.total = res.total
@@ -111,9 +140,31 @@ export default {
}
}
</script>
<style>
.el-input__inner{
border-color: #1956BC !important;
border-radius: 0 !important;
/*line-height: 3.5rem !important;*/
/*height: 3.5rem !important;*/
}
</style>
<style scoped lang="scss">
.query_input{
border-color: #1956BC !important;
border-radius: 0 !important;
}
.query_button{
//height: 3.5rem;
border-radius: 0rem 1rem 1rem 0rem;
background-color: #1956BC;
border-color: #1956BC !important;
}
.context {
margin: 3rem 2rem;
padding-bottom: 3rem;
@@ -165,10 +216,13 @@ export default {
text-overflow: ellipsis; //溢出用省略号显示
white-space: nowrap; //溢出不换行
font-size: 2rem;
font-weight: 600;
font-weight: bold;
padding-right: 2rem;
}
//.tw_context_title:hover{
// font-weight: bolder;
//}
.tw_context_text {
margin-top: .8rem;
@@ -205,4 +259,22 @@ export default {
float: none;
}
}
.query{
//margin: 1rem 0;
z-index: 999;
width: 30%;
position: absolute;
right: 0;
//float: right;
}
@media screen and (min-width: 1100px) and (max-width: 1400px) {
.query {
width: 40% !important;
}
}
@media screen and (max-width: 1100px){
.query {
width: 80% !important;
}
}
</style>

View File

@@ -14,7 +14,7 @@
</el-col>
</el-row>
<el-row>
<el-row v-show="showSecond">
<el-col :xs="2" :sm="2" :md="1.5" :lg="2" :xl="4">
<div class="grid-content"></div>
</el-col>
@@ -67,6 +67,35 @@
<div class="grid-content"></div>
</el-col>
</el-row>
<el-row v-show="!showSecond">
<el-col :xs="2" :sm="2" :md="2" :lg="4" :xl="5">
<div class="grid-content"></div>
</el-col>
<el-col :xs="20" :sm="20" :md="20" :lg="16" :xl="14">
<el-row>
<el-col>
<div class="tab">
<router-link to="/">首页</router-link>
<span> > </span>
<router-link to="">{{ crumbs.one.title }}</router-link>
<span> > </span>
<span style="color: #1956BC;font-size: 1.4rem">{{ crumbs.two.title }}</span>
</div>
</el-col>
</el-row>
<el-row>
<el-col>
<Introduction :value="contextData" v-if="type == 1"/>
<List :value="contextData" v-if="type == 2"/>
<DireData :value="contextData" v-if="type == 3"/>
<Details :value="detailsData" v-if="type == null"/>
</el-col>
</el-row>
</el-col>
<el-col :xs="2" :sm="2" :md="2" :lg="4" :xl="5">
<div class="grid-content"></div>
</el-col>
</el-row>
</div>
@@ -79,6 +108,7 @@ import List from './components/list.vue'
import DireData from './components/dire_data.vue'
import Details from './components/details.vue'
import {handleTree} from "@/utils/ebts";
import {getParentNode} from "@/utils/sist";
export default {
name: "index",
@@ -95,6 +125,7 @@ export default {
navId: null,
navList: [],
showIndex: 0,
showSecond: true,
contextData: {},
type: 2,
bgImage: null, crumbs: {
@@ -112,12 +143,22 @@ export default {
$route(to, from) {
console.log("触发了 $route")
let arcId = this.$route.params && this.$route.query.id
console.log(arcId)
this.navId = this.$route.params && this.$route.params.navId;
this.secondId = this.$route.params && this.$route.params.secondId;
this.type = this.$route.query && this.$route.query.type
if (this.type != null&&this.type!=0){
let info = getParentNode(this.secondId);
if (arcId != undefined) {
this.getContext(arcId)
} else {
this.getContent(info.second)
}
return
}
if (arcId != undefined) {
this.getContext(arcId)
}
let id = this.$route.params && this.$route.params.secondId
this.navId = this.$route.params && this.$route.params.navId;
try {
this.$refs.lab.style.height = this.navList.length * 8 + 10 + 'rem'
} catch (e) {
@@ -149,9 +190,22 @@ export default {
})
},
getNav() {
console.log("触发了 getNav")
this.secondId = this.$route.params && this.$route.params.secondId;
this.navId = this.$route.params && this.$route.params.navId;
this.type = this.$route.query && this.$route.query.type
if (this.type != null&&this.type!=0){
this.showSecond = false
let info = getParentNode(this.secondId);
let arcId = this.$route.query && this.$route.query.id
if (arcId != undefined) {
this.getContext(arcId)
} else {
this.getContent(info.second)
}
return
}else {
this.showSecond = true
}
this.navList = []
getNode({id: this.secondId}).then(res => {
this.navList = res.data
@@ -167,7 +221,7 @@ export default {
this.showIndex = i
}
}
let arcId = this.$route.params && this.$route.query.id
let arcId = this.$route.query && this.$route.query.id
if (arcId != undefined) {
this.getContext(arcId)
} else {
@@ -352,7 +406,6 @@ export default {
margin-left: 1.5rem;
}
}
}
}
}

View File

@@ -1,14 +1,14 @@
<template>
<!-- <el-row>-->
<!-- <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">-->
<!-- <div class="grid-content"></div>-->
<!-- </el-col>-->
<!-- <el-col :xs="22" :sm="20" :md="20" :lg="16" :xl="16">-->
<!-- </el-col>-->
<!-- <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">-->
<!-- <div class="grid-content"></div>-->
<!-- </el-col>-->
<!-- </el-row>-->
<!-- <el-row>-->
<!-- <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">-->
<!-- <div class="grid-content"></div>-->
<!-- </el-col>-->
<!-- <el-col :xs="22" :sm="20" :md="20" :lg="16" :xl="16">-->
<!-- </el-col>-->
<!-- <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">-->
<!-- <div class="grid-content"></div>-->
<!-- </el-col>-->
<!-- </el-row>-->
<div class="header">
<!--头部部分-->
@@ -60,82 +60,32 @@
<div class="banner">
<router-link to="/">
<div class="link_text">
<div class="border"></div>
<div>学院首页</div>
<div class="link_text_title">学院首页</div>
</div>
</router-link>
<span v-for="(menu,index) in menuData" :key="index">
<span v-for="(menu,index) in menuData" :key="index">
<a>
<div class="link_text">
<div class="border"></div>
<div v-show="!english">{{ menu.title }}</div>
<div v-show="english">{{ menu.englishTitle }}</div>
<div class="link_text_title">
<span v-show="!english">{{ menu.title }}</span>
<span v-show="english">{{ menu.englishTitle }}</span>
</div>
<div class="secondary">
<ul>
<li v-for="(item,i) in menu.children" :key="i" @click="menuCut(item)">
<span v-show="!english">{{ item.title }}</span>
<span v-show="english">{{ item.englishTitle }}</span>
<li class="menu_list" v-for="(item,i) in menu.children" :key="i" @click="menuCut(item)">
<div class="menu_suffix">
<div>
<span v-show="!english">{{ item.title }}</span>
<span v-show="english">{{ item.englishTitle }}</span>
</div>
</div>
</li>
</ul>
</div>
</div>
</a>
</span>
<!-- <router-link to="/ts">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>党群工作</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/et">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>师资队伍</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>教育教学</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>科学研究</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>学科建设</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>学生工作</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>校友工作</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>国际化</div>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/">-->
<!-- <div class="link_text">-->
<!-- <div class="border"></div>-->
<!-- <div>资料下载</div>-->
<!-- </div>-->
<!-- </router-link>-->
</div>
</el-col>
</el-row>
@@ -150,10 +100,10 @@ export default {
name: "index",
data() {
return {
english:false,
width: document.documentElement.clientWidth >=1200,
pc:document.documentElement.clientWidth >992,
menuData:[],
english: false,
width: document.documentElement.clientWidth >= 1200,
pc: document.documentElement.clientWidth > 992,
menuData: [],
}
},
mounted() {
@@ -162,23 +112,24 @@ export default {
return (() => {
//这里写要操作的函数
window.screenWidth = document.body.clientWidth
that.width = window.screenWidth>=1200
that.width = window.screenWidth >= 1200
})()
}
},
created() {
if (this.pc){
getNavigation({}).then(res=>{
if (this.pc) {
getNavigation({}).then(res => {
this.menuData = res.data
sessionStorage.setItem("menu",JSON.stringify(res.data))
sessionStorage.setItem("menu", JSON.stringify(res.data))
})
}
//this.$router.push("/" + menu.encodeId);
//this.$router.push("/" + menu.encodeId);
//}
},
methods: {
menuCut(menu){
this.$router.push("/pc/" + menu.encodeId);
menuCut(menu) {
console.log(menu)
this.$router.push("/pc/" + menu.encodeId + "?type=" + menu.type);
},
switchLang() {
let lang = ''
@@ -186,11 +137,11 @@ export default {
lang = 'cn'
this.english = false;
this.$store.state.isEnglish= this.english
this.$store.state.isEnglish = this.english
} else {
lang = 'en'
this.english = true;
this.$store.state.isEnglish= this.english
this.$store.state.isEnglish = this.english
}
this.$i18n.locale = lang;
}
@@ -202,13 +153,13 @@ export default {
.header {
width: 110rem;
margin: 0 auto;
.top {
font-size: 1.2rem;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
text-align: center;
line-height: 3rem;
width: 100%;
height: 3rem;
background: #1956BC;
@@ -217,9 +168,11 @@ export default {
cursor: pointer;
font-size: 1.6rem;
}
.link{
.link {
line-height: 2.2rem;
width: 80%;
margin: 0 auto;
margin: .4rem auto;
border-radius: 1.1rem;
}
@@ -280,59 +233,107 @@ export default {
align-items: center;
justify-content: center;
vertical-align: middle;
.secondary{
display: none;
li{
height: 3rem;
}
.secondary {
display: none;
width: 16.5rem;
position: absolute;
top: 8rem;
background-color: transparent;
//display: block;
//width: 100%;
//height: 5rem;
//background-color: #1956BC;
ul {
background-color: #ffffff;
display: inline-block;
border-radius: 0 0 .5rem .5rem;
li {
margin-top: 1.2rem;
height: 2rem;
list-style: none;
border-bottom: .1rem solid gray;
background-color: #1956BC;
display: flex;
align-items: center;
justify-content: center;
//border-bottom: .1rem solid gray;
color: #666666;
//display: flex;
//align-items: center;
//justify-content: center;
//clear: left;
//.menu_prefix{
// width: 1.2rem;
//}
.menu_suffix {
margin-left: .6rem;
display: inline-block;
//width: 14.3rem;
border-left: .2rem solid #ffffff;
margin-right: .8rem;
padding-left: .8rem;
div {
padding: 0.2rem .4rem;
}
}
div {
float: left;
}
}
li:hover{
background-color: rgba(25, 86, 188, 0.6);
li:hover {
//background-color: rgba(25, 86, 188, 0.6);
}
li:last-child{
border-radius: 0 0 .5rem .5rem;
border-bottom: none;
li:last-child {
margin-bottom: 1.4rem;
//border-bottom: none;
}
position: absolute;
top: 8rem;
width: 100%;
//height: 5rem;
//background-color: #1956BC;
}
.border {
position: absolute;
top: 0;
left: 10%;
width: 80%;
margin: 0 auto;
height: 0.4rem;
background: transparent;
border-radius: 0.2rem;
}
}
.link_text:hover{
.border{
background-color: #fff;
.link_text:hover {
//.border{
// background-color: #fff;
//}
.secondary {
display: block;
}
.secondary{
display: table;
.link_text_title{
font-weight: 900;
}
}
.menu_list:hover {
.menu_suffix {
border-left: .2rem solid #1956BC;
div {
color: #0054B0;
background-color: #C3D7EC;
border-radius: 0.2rem;
}
}
}
}
}
}
@media screen and (min-width: 1200px){
.banner{
@media screen and (min-width: 1200px) {
.banner {
margin: 0 auto;
}
}
</style>

View File

@@ -29,13 +29,21 @@
<span slot="title">学院首页</span>
</el-menu-item>
<el-submenu :index="menuIndex+2" v-for="(menu,menuIndex) in menuData" :key="menuIndex">
<template slot="title">
<template slot="title" >
<span v-show="!english">{{ menu.title }}</span>
<span v-show="english">{{ menu.title }}</span>
</template>
<el-submenu :index="menuIndex +'-'+itemIndex" v-for="(item,itemIndex) in menu.children" :key="itemIndex" >
<template v-show="!english" slot="title">{{item.title}}</template>
<template v-show="english" slot="title">{{item.englishTitle}}</template>
<template v-show="!english" slot="title" v-if="item.children.length == 0">
<span @click="clickSecondMenu(item)">{{item.title}}</span>
</template>
<template v-show="english" slot="title" v-if="item.children.length == 0">
<span @click="clickSecondMenu(item)">{{item.englishTitle}}</span>
</template>
<template v-show="!english" slot="title" v-if="item.children.length > 0" >{{item.title}}</template>
<template v-show="english" slot="title" v-if="item.children.length > 0" >{{item.englishTitle}}</template>
<el-menu-item v-for="(chile ,chileIndex) in item.children" :key="chileIndex" :index="menuIndex +'-'+itemIndex +'-' +chileIndex" @click="clickMenu(chile,item)">
<span v-show="!english">{{ chile.title }}</span>
<span v-show="english">{{ chile.title }}</span>
@@ -59,7 +67,7 @@ export default {
return {
drawer: false,
direction: 'ltr',
english : true,
english : false,
mobile:document.documentElement.clientWidth <=992,
menuData:[],
};
@@ -73,6 +81,11 @@ export default {
}
},
methods: {
clickSecondMenu(menu){
this.drawer = false
this.$router.push("/mobile/" +menu.encodeId+"?type="+menu.type);
},
clickMenu(menu,parent){
this.drawer = false
this.$router.push("/mobile/" +parent.encodeId+"/"+menu.encodeId);

View File

@@ -172,6 +172,7 @@ export default {
}
.news_context {
cursor: pointer;
width: 23rem;
height: 23rem;
margin: 3rem auto;

View File

@@ -158,11 +158,21 @@ export default {
getArticle(news){
info(news.id).then(res=>{
let info = getParentNode(res.data.encodeId)
if (this.width){
this.$router.push("/pc/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
console.log(info)
if (info.three == null){
if (this.width){
this.$router.push("/pc/" + info.second.encodeId +"?id="+news.id + "&type=" + info.second.type);
}else {
this.$router.push("/mobile/" + info.second.encodeId +"?id="+news.id + "&type=" + info.second.type);
}
}else {
this.$router.push("/mobile/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
if (this.width){
this.$router.push("/pc/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
}else {
this.$router.push("/mobile/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
}
}
})
},
getAcademiaList() {

View File

@@ -88,15 +88,26 @@ export default {
},
watch: {
$route(to, from) {
let arcId = this.$route.params && this.$route.query.id
console.log(arcId)
console.log(to)
this.secondId = this.$route.params && this.$route.params.secondId;
this.navId = this.$route.params && this.$route.params.navId;
let arcId = this.$route.query && this.$route.query.id
this.type = this.$route.query && this.$route.query.type
if (this.type != null&&this.type!=0){
let info = getParentNode(this.secondId);
if (arcId != undefined) {
this.getContext(arcId)
} else {
this.getContent(info.second)
}
return
}
if (arcId != undefined) {
this.getContext(arcId)
} else {
this.secondId = this.$route.params && this.$route.params.secondId;
this.navId = this.$route.params && this.$route.params.navId;
this.menuData = getParentNode(this.navId)
this.getContent()
this.getContent(this.menuData.three)
}
}
},
@@ -107,11 +118,23 @@ export default {
crumbs(this.secondId).then(res => {
this.crumbs = res.data
})
this.type = this.$route.query && this.$route.query.type
if (this.type != null&&this.type!=0){
//this.showSecond = false
let info = getParentNode(this.secondId);
let arcId = this.$route.query && this.$route.query.id
if (arcId != undefined) {
this.getContext(arcId)
} else {
this.getContent(info.second)
}
return
}
let arcId = this.$route.params && this.$route.query.id
if (arcId != undefined) {
this.getContext(arcId)
} else {
this.getContent()
this.getContent(this.menuData.three)
}
},
methods: {
@@ -122,8 +145,9 @@ export default {
this.type = null
})
},
getContent() {
let menu = this.menuData.three
getContent(menu) {
console.log(menu)
//let menu = this.menuData.three
this.type = menu.type
this.contextData = null
this.bgImage = menu.link