导航栏样式修改+专业概况

dev_2307
暖暖 1 year ago
parent 9f6ce6322b
commit 43c7c95bf3
  1. BIN
      ant-design-vue-jeecg/src/views/cms/assets/01.png
  2. BIN
      ant-design-vue-jeecg/src/views/cms/assets/02.png
  3. BIN
      ant-design-vue-jeecg/src/views/cms/assets/bg01.png
  4. 4
      ant-design-vue-jeecg/src/views/cms/components/HeaderView.vue
  5. 37
      ant-design-vue-jeecg/src/views/cms/pages/Detail/DetailView.vue
  6. 88
      ant-design-vue-jeecg/src/views/cms/pages/professionalSummary/professionalSummary.vue

Binary file not shown.

After

Width:  |  Height:  |  Size: 536 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 384 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

@ -85,10 +85,10 @@ export default {
.navBox {
height: 118px;
.d-flex {
width: 67%;
width: 70%;
min-width: 1030px;
align-items: center;
font-size: 20px;
font-size: 18px;
a {
color: #fff;
}

@ -2,9 +2,13 @@
<div class="detail">
<Header></Header>
<div class="main">
<p class="title">成果展示</p>
<p class="title">{{this.$route.query.columnName}}</p>
<div class="card">
首页<span>·</span>成果展示<span>·</span>教师获奖成果
{{this.$route.query.columnName}}
<span>·</span>
{{this.$route.query.title}}
<!-- <span>·</span>-->
<!-- 教师获奖成果-->
</div>
<div class="mainDiv clearfix">
<div class="itemList">
@ -51,6 +55,9 @@ export default {
data() {
return {
current: 1,
title01:"",
title02:"",
title03:"",
artical: {
title:
"标题标题标题标题标题标题标题标题标题标题标题标题标题,标题标题标题标题标题标题标题标题标题标题标题",
@ -160,7 +167,7 @@ export default {
.itemList {
float: left;
width: 1050px;
height: 300px;
/*height: 300px;*/
/*overflow: auto;*/
.articalTitle {
font-size: 26px;
@ -195,11 +202,33 @@ export default {
color: #333333;
line-height: 40px;
text-indent: 2em;
img{
width: 100%!important;
}
}
}
.trends {
float: right;
height: 300px;
/*height: 300px;*/
width: 400px;
.title {

@ -3,7 +3,7 @@
<Header />
<div class="box1">
<div
v-for="(item, index) in headerList"
v-for="(item, index) in originalList"
:key="item.id"
:class="{ 'bigbox-reverse': index % 2 === 0 }"
class="bigbox"
@ -17,19 +17,32 @@
style="width: 66%;"
>
<div class="card-header">
<span class="headername">{{ item.headername }}</span>
<router-link :to="{ path: getRouterLink(item.id) }" class="alltext">查看全部<i class="el-icon-arrow-right"></i></router-link>
<span class="headername">{{ item.title }}</span>
<!-- <router-link :to="{ path: getRouterLink(item.id) }" class="alltext">查看全部<i class="el-icon-arrow-right"></i></router-link>-->
<a @click="goToDetail(item)" class="alltext">查看全部<i class="el-icon-arrow-right"></i></a>
</div>
<div class="headercontent">{{ item.content }}</div>
<div class="headercontent" style="color: #9E9E9E!important;font-size: 14px!important;" v-html="item.content"></div>
<!-- <div class="headercontent" style="color: #9E9E9E!important;font-size: 14px!important;">{{item.content}}</div>-->
</el-card>
<div
:class="{
'image-right': index % 2 === 0,
'image-left': index % 2 === 1,
}"
class="image"
>
<el-image :src="item.url" />
<el-image :src="item.originUrl?item.originUrl:defaultUrl" />
</div>
</div>
</div>
@ -39,6 +52,9 @@
<script>
import Header from "../../components/HeaderView"
import FooterView from "../../components/FooterView.vue"
// import {getAction} from "../../api/manage";
import {getAction} from "/src/api/manage";
export default {
data () {
return {
@ -47,22 +63,58 @@ export default {
{ id: 2, headername: '历史沿革', url: require('@/assets/w.jpg'), content: '简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内' },
{ id: 3, headername: '环境与设施', url: require('@/assets/w.jpg'), content: '简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内' },
{ id: 4, headername: '教师风采', url: require('@/assets/w.jpg'), content: '简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内' }
]
],
defaultUrl:require('../../assets/01.png'),
url:{
detail:"/cms/front/getArticleListByColumn"
},
originalList:[]
}
},
created() {
this.getList()
},
methods: {
getRouterLink (id) {
// id
if (id === 1) {
return '/professionalIntroduction'
return '/cms/professionalIntroduction'
} else if (id === 2) {
return '/historicalEvolution'
return '/cms/historicalEvolution'
} else if (id === 3) {
return '/environmentFacilities'
return '/cms/environmentFacilities'
} else if (id === 4) {
return '/TeacherDemeanor'
return '/cms/TeacherDemeanor'
}
},
getList(){
getAction(this.url.detail,{columnId:"1640260238858096641"}).then((res) => {
console.log("res.result.records")
console.log(res.result.records)
this.originalList = res.result.records
// this.originalList.forEach(function(item,index,array){
// item.date = item.publishTime.slice(8,10)
// item.month = item.publishTime.slice(0,7)
// })
}
)
},
goToDetail(item){
console.log("item")
console.log(item)
this.$router.push({
path:"/cms/detail",
query:{
item:item,
columnName:item.columnName,//
title:item.title,//
subtitle:"",//
}
}
)
}
},
components: {
@ -77,7 +129,9 @@ export default {
<style lang="less" scoped>
@import '../../assets/reset.css';
.header {
background-image: url('../../assets/bg02.png');
background-image: url('../../assets/bg01.png');
background-position: center;
background-size: 100% 100%;
}
.box1 {
padding: 50px 100px;
@ -94,12 +148,20 @@ export default {
margin-bottom: 45px;
}
.headercontent {
color: #9E9E9E;
font-size: 14px;
color: #9E9E9E!important;
font-size: 14px!important;
height: 125px;
line-height: 25px;
overflow: hidden;
}
.headercontent p{
color: #9E9E9E!important;
font-size: 14px!important;
}
.headercontent p span{
color: #9E9E9E!important;
font-size: 14px!important;
}
.content {
flex: 7;
order: 2;

Loading…
Cancel
Save