odjbin/sist_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dengjie commit : 部分修改样式

Browse Source
This commit is contained in:
clay
2022-10-04 23:03:23 +08:00
parent dd6798e8ce
commit a372dff77c
13 changed files with 209 additions and 318 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/index/party_building_activities/gangduohh.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 339 B

BIN
src/assets/index/party_building_activities/gangduohh@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 671 B

BIN
src/assets/index/party_building_activities/gangh.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 720 B

BIN
src/assets/index/party_building_activities/gangh3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 711 B

BIN
src/assets/index/party_building_activities/gangh3@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
src/assets/index/party_building_activities/gangh@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

2
src/views/index/components/announcements.vue
View File

@@ -201,7 +201,7 @@ export default {
display: flex; display: flex;
justify-content: center; justify-content: center;
height: 2.3rem; height: 2.3rem;
margin-top: 3.1rem; margin-top: 2.6rem;
.more_text { .more_text {
font-size: 1.6rem; font-size: 1.6rem;
font-weight: 500; font-weight: 500;

2
src/views/index/components/bottom.vue
View File

@@ -99,7 +99,7 @@ export default {
padding-bottom: 4rem; padding-bottom: 4rem;
.table { .table {
margin: 4rem 0 0 0; //margin: 4rem 0 0 0;
width: 100%; width: 100%;
tr { tr {

59
src/views/index/components/news_center.vue
View File

@@ -37,8 +37,7 @@
<img src="../../../assets/index/news_center/t4.png" alt=""> <img src="../../../assets/index/news_center/t4.png" alt="">
</div> </div>
<div class="news_context_text"> <div class="news_context_text">
<div class="vline"> <div class="news_context_text-title">信息引领，勇于拼领，勇于拼搏—信息搏…</div>
<div class="news_context_text-title">信息引领，勇于拼搏—信息搏…</div>
<div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展… <div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展…
</div> </div>
<div class="news_context_time"> <div class="news_context_time">
@@ -47,7 +46,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<div class="news_context"> <div class="news_context">
@@ -55,7 +53,6 @@
<img src="../../../assets/index/news_center/t4.png" alt=""> <img src="../../../assets/index/news_center/t4.png" alt="">
</div> </div>
<div class="news_context_text"> <div class="news_context_text">
<div class="vline">
<div class="news_context_text-title">信息引领，勇于拼搏—信息搏…</div> <div class="news_context_text-title">信息引领，勇于拼搏—信息搏…</div>
<div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展… <div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展…
</div> </div>
@@ -65,7 +62,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<div class="news_context"> <div class="news_context">
@@ -73,7 +69,6 @@
<img src="../../../assets/index/news_center/t4.png" alt=""> <img src="../../../assets/index/news_center/t4.png" alt="">
</div> </div>
<div class="news_context_text"> <div class="news_context_text">
<div class="vline">
<div class="news_context_text-title">信息引领，勇于拼搏—信息搏…</div> <div class="news_context_text-title">信息引领，勇于拼搏—信息搏…</div>
<div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展… <div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展…
</div> </div>
@@ -83,7 +78,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<div class="news_context"> <div class="news_context">
@@ -91,7 +85,6 @@
<img src="../../../assets/index/news_center/t4.png" alt=""> <img src="../../../assets/index/news_center/t4.png" alt="">
</div> </div>
<div class="news_context_text"> <div class="news_context_text">
<div class="vline">
<div class="news_context_text-title">信息引领，勇于拼搏—信息搏…</div> <div class="news_context_text-title">信息引领，勇于拼搏—信息搏…</div>
<div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展… <div class="news_context_text-content">为促进学生学业发展学生学业学生学业学生学业、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展…
</div> </div>
@@ -99,7 +92,7 @@
<div class="icon"><img src="../../../assets/index/news_center/shijian.png" alt=""></div> <div class="icon"><img src="../../../assets/index/news_center/shijian.png" alt=""></div>
<span class="time">2022-10-2</span> <span class="time">2022-10-2</span>
</div> </div>
</div> <div class="vline"></div>
</div> </div>
</div> </div>
</el-col> </el-col>
@@ -165,6 +158,7 @@ export default {
.el-carousel__indicators { .el-carousel__indicators {
display: none; display: none;
} }
.grid-content { .grid-content {
height: 1px !important; height: 1px !important;
} }
@@ -249,51 +243,62 @@ export default {
background-color: #fff; background-color: #fff;
margin-top: 4rem; margin-top: 4rem;
//.news_context:last-child {
// .news_context_text {
// .vline {
// //border-right: none;
// }
// }
//}
.news_context { .news_context {
cursor: pointer; cursor: pointer;
//width: 28rem; //width: 28rem;
width: 100%; width: 100%;
height: 36.9rem; height: 36.9rem;
&:hover { &:hover {
box-shadow: 0 0 0.7rem 0 rgba(18, 69, 155, 0.59); box-shadow: 0 0 0.7rem 0 rgba(18, 69, 155, 0.59);
} }
.news_context_img { .news_context_img {
height: 42.8%; height: 42.8%;
width: 100%; width: 100%;
overflow: hidden;
img { img {
&:hover {
transform: scale(1.3);
}
width: 100%; width: 100%;
transition: all 1s;
} }
} }
.news_context_text:last-child {
border-right: none;
}
.news_context_text { .news_context_text {
//padding: 4rem 2rem; margin: 4rem 0 4rem 2rem;
padding: 4rem 0 4rem 2rem; padding-right: 2rem;
.vline {
height: 14rem;
border-right: 1px solid #CCCCCC; border-right: 1px solid #CCCCCC;
//padding-right: 1rem;
.news_context_text-title { .news_context_text-title {
width: 23.8rem; &:hover {
color: #0040A4;
}
width: 100%;
height: 2.1rem; height: 2.1rem;
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 500; font-weight: 500;
color: #0040A4; color: #262626;
line-height: 2.1rem; line-height: 2.1rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box; //作为弹性伸缩盒子模型显示。
-webkit-box-orient: vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
-webkit-line-clamp: 1; //显示的行
} }
.news_context_text-content { .news_context_text-content {
width: 23.8rem; width: 100%;
height: 5.3rem; height: 5.3rem;
font-size: 1.3rem; font-size: 1.3rem;
font-weight: 500; font-weight: 500;
@@ -330,7 +335,7 @@ export default {
line-height: 1.4rem; line-height: 1.4rem;
} }
} }
}
} }
} }
} }

267
src/views/index/components/party_building_activities.vue
View File

@@ -1,50 +1,26 @@
<template> <template>
<div class="party_building_activities" v-bind:style="{backgroundImage:'url('+bgc+')'}"> <div class="party_building_activities">
<!--title--> <!-- 党群工作 -->
<el-row>
<el-col :span="5">
<div class="grid-content"></div>
</el-col>
<el-col :span="14">
<div class="headline"> <div class="headline">
<div class="hr_div"> <div class="line_left">
<div class="hr_line_left"> <img src="../../../assets/index/party_building_activities/gangh.png" alt="">
</div>
<div class="hr_dot_left">
</div>
</div> </div>
<div class="title"> <div class="title">
{{ $t('message.party') }} 党群工作
<!--党群工作-->
</div> </div>
<div class="hr_div"> <div class="line_right">
<div class="hr_line_right"> <img src="../../../assets/index/party_building_activities/gangh3.png" alt="">
</div>
<div class="hr_dot_right">
</div> </div>
</div> </div>
</div> </el-col>
<!--<el-row>--> </el-row>
<!-- <el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">-->
<!-- <div class="grid-content"></div>-->
<!-- </el-col>-->
<!-- -->
<!-- <el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">-->
<!-- <div class="title">-->
<!-- &lt;!&ndash; {{ $t('message.news_center') }}&ndash;&gt;-->
<!-- 党群工作-->
<!-- </div>-->
<!-- <el-row>-->
<!-- <el-col :span="8">-->
<!-- <hr class="hr">-->
<!-- </el-col>-->
<!-- <el-col :span="8">-->
<!-- <div class="divider_text">Party Building Activities</div>-->
<!-- </el-col>-->
<!-- <el-col :span="8">-->
<!-- <hr class="hr">-->
<!-- </el-col>-->
<!-- </el-row>-->
<!-- </el-col>-->
<!--</el-row>-->
<!--轮播图-->
<!--轮播图-->
<el-row> <el-row>
<el-col :xs="1" :sm="1" hidden-md-only :lg="2" :xl="3"> <el-col :xs="1" :sm="1" hidden-md-only :lg="2" :xl="3">
<div class="grid-content"></div> <div class="grid-content"></div>
@@ -53,82 +29,23 @@
<SlideshowCard/> <SlideshowCard/>
</el-col> </el-col>
</el-row> </el-row>
<!--更多-->
<div class="headline">
<!-- <div style="background: #DA2D2D;color: #E6E6E6;" class="more">-->
<!-- {{ $t('message.more') }}-->
<!-- </div>-->
<!--<div class="more_img">-->
<!-- <img src="@/assets/index/party_building_activities/sy_icon_zhdh.png" alt="">-->
<!--</div>-->
<div class="hr_div">
<div class="hr_line_left">
</div>
<div class="hr_dot_left">
</div>
</div>
<div class="hr_text" style="color:#DA2D2D;">
{{ $t('message.party_education') }}
<!--党史教育-->
</div>
<div class="hr_div">
<div class="hr_line_right">
</div>
<div class="hr_dot_right">
</div>
</div>
</div>
<!--党史教育内容-->
<el-row> <el-row>
<el-col :xs="1" :sm="2" :md="2" :lg="3" :xl="5"> <el-col :span="5">
<div class="grid-content"></div> <div class="grid-content"></div>
</el-col> </el-col>
<el-col :xs="22" :sm="20" :md="20" :lg="18" :xl="14" class="phe"> <el-col :span="14">
<div class="phe_row" v-for="(item,index) in listData" :key="index"> <div class="more">
<el-row> <span class="more_text">更多</span>
<el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4"> <img src="../../../assets/index/party_building_activities/gangduohh.png" alt="">
<div class="phe_img">
<img :src="item.imgurl" alt="">
</div> </div>
</el-col> </el-col>
<el-col :xs="18" :sm="18" :md="18" :lg="17" :xl="17" :span="17">
<div class="phe_context" @click="getArticle(item)">
<div class="phe_context_title">{{ item.title }}</div>
<div class="phe_context_text" v-html="item.content">
</div>
</div>
</el-col>
<el-col :xs="22" :sm="22" :md="22" :lg="3" :xl="3">
<div class="phe_time">{{ getTime(item.publishTime) }}</div>
</el-col>
</el-row>
<hr v-if="index != listData.length-1" style="border: 0.1rem solid #E6E6E6;" class="hr">
</div>
</el-col>
</el-row> <!--更多-->
<el-row>
<el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
<div class="grid-content"></div>
</el-col>
<el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">
<div style="background: #DA2D2D;color: #E6E6E6;" class="more" @click="lookMore(listData[0])">
{{ $t('message.more') }}
</div>
<!-- <div class="more_img">-->
<!-- <img src="@/assets/index/sy_icon_zhdl.png" alt="">-->
<!-- </div>-->
</el-col>
</el-row> </el-row>
</div> </div>
</template> </template>
<script> <script>
import SlideshowCard from './slideshow_card' import SlideshowCard from "./slideshow_card";
import {getArticleList} from "@/api"; import {getArticleList} from "@/api";
import {toArticle, lookMoreComment} from "@/utils/sist"; import {toArticle, lookMoreComment} from "@/utils/sist";
import {lookMoreFixedComment} from "../../../utils/sist"; import {lookMoreFixedComment} from "../../../utils/sist";
@@ -141,20 +58,19 @@ export default {
data() { data() {
return { return {
width: document.documentElement.clientWidth > 992, width: document.documentElement.clientWidth > 992,
listData: [], listData: []
bgc: require("../../../assets/index/party_building_activities/sy_bj3.png") };
}
}, },
created() { created() {
this.getListData() this.getListData();
}, },
methods: { methods: {
getArticle(item) { getArticle(item) {
toArticle(item, this.width) toArticle(item, this.width);
}, },
lookMore(item) { lookMore(item) {
// lookMoreComment(item,this.width) // lookMoreComment(item,this.width)
lookMoreFixedComment("N8YFxHPHwy6PyHt7J-gIDCU", this.width) lookMoreFixedComment("N8YFxHPHwy6PyHt7J-gIDCU", this.width);
}, },
getListData() { getListData() {
@@ -163,108 +79,77 @@ export default {
pageNum: 1, pageNum: 1,
pageSize: 6 pageSize: 6
}).then(res => { }).then(res => {
this.listData = res.rows this.listData = res.rows;
}) });
}, },
getTime(date) { getTime(date) {
let time = new Date(date); let time = new Date(date);
let year = time.getFullYear(); let year = time.getFullYear();
let month = time.getMonth() + 1 let month = time.getMonth() + 1;
let day = time.getDate(); let day = time.getDate();
return year + "-" + month + "-" + day; return year + "-" + month + "-" + day;
} }
} }
} };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.party_building_activities { .party_building_activities {
background-image: url("../../../assets/index/party_building_activities/sy_bj3.png"); background-image: url("../../../assets/index/announcements/sy_bj3.png");
padding-top: 4rem; background-size: cover;
padding-bottom: 2rem; background-repeat: no-repeat;
} width: 100%;
height: 55.6rem;
.headline { .headline {
width: 100%;
display: flex;
justify-content: center;
padding-top: 6.3rem;
padding-bottom: 4.4rem;
.hr_line_left, .hr_line_right { .line_left {
border-color: #DA2D2D !important; line-height: 4.4rem;
}
.hr_dot_left, .hr_dot_right {
background-color: #DA2D2D !important;
} }
.title { .title {
background: #DA2D2D; width: 12.9rem;
} height: 4.4rem;
font-size: 3.1rem;
.divider_text {
color: #DA2D2D;
}
}
.hr {
border: .1rem solid #D13C3C;
}
.phe_row {
margin: 4rem 0;
}
.phe {
font-family: PingFangSC-Medium, PingFang SC;
margin-top: 4rem;
margin-bottom: 4rem;
.phe_img {
img {
height: 10rem;
}
}
.phe_context {
.phe_context_title {
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
white-space: nowrap; //溢出不换行
cursor: pointer;
font-size: 2rem;
font-weight: 600;
color: #161616;
letter-spacing: 2px;
}
.phe_context_title:hover {
color: #DA2D2D;
}
.phe_context_text {
margin-top: 0.8rem;
font-size: 1.6rem;
height: 6rem;
color: #565656;
letter-spacing: 1px;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box; //作为弹性伸缩盒子模型显示。
-webkit-box-orient: vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
-webkit-line-clamp: 3; //显示的行
span {
color: #565656 !important;
}
}
}
.phe_time {
text-align: right;
font-size: 2rem;
font-weight: 500; font-weight: 500;
color: #565656; color: #DA2D2D;
letter-spacing: 2px; line-height: 4.4rem;
letter-spacing: .1rem;
margin: 0 1.3rem;
}
.line_right {
line-height: 4.4rem;
} }
} }
.more {
width: 100%;
display: flex;
justify-content: center;
height: 2.3rem;
margin-top: 5.1rem;
.more_text {
font-size: 1.6rem;
font-weight: 500;
color: #DA2D2D;
line-height: 2.3rem;
letter-spacing: .2rem;
}
img {
width: 2.9rem;
height: 1.4rem;
margin-left: 0.8rem;
margin-top: .5rem;
}
}
}
</style> </style>

16
src/views/index/components/slideshow_card.vue
View File

@@ -46,7 +46,7 @@ export default {
//默认值 //默认值
classArray: ["one", "two", "three", "four", "five", "six"], classArray: ["one", "two", "three", "four", "five", "six"],
// classArray: ["one", "two", "three", "four", "five"], // classArray: ["one", "two", "three", "four", "five"],
leftSlider: true, leftSlider: true
}, },
bannerWrap: null, bannerWrap: null,
time: null, time: null,
@@ -59,8 +59,8 @@ export default {
}, },
beforeCreate() { beforeCreate() {
banner("STCplDRCWAA3zcFE0EBTcQI").then(res => { banner("STCplDRCWAA3zcFE0EBTcQI").then(res => {
this.bannerDate = res.data this.bannerDate = res.data;
}) });
}, },
created() { created() {
}, },
@@ -127,13 +127,13 @@ export default {
this.rightBtn.addEventListener("click", () => { this.rightBtn.addEventListener("click", () => {
this.rightMove(); this.rightMove();
}); });
}, }
}, },
mounted() { mounted() {
setTimeout(() => { setTimeout(() => {
this.constructor(); this.constructor();
}, 1000); }, 1000);
}, }
}; };
</script> </script>
@@ -141,7 +141,7 @@ export default {
.banner-card { .banner-card {
width: 100%; width: 100%;
height: 50rem; height: 29.4rem;
//background: #f5f5f5; //background: #f5f5f5;
position: relative; position: relative;
@@ -156,8 +156,8 @@ export default {
li { li {
border-radius: 2rem; border-radius: 2rem;
width: 40rem; width: 26.5rem;
height: 40rem; height: 25.4rem;
position: absolute; position: absolute;
top: 2.5rem; top: 2.5rem;
list-style-type: none; list-style-type: none;

2
src/views/index/components/undergraduate_and_graduate.vue
View File

@@ -170,7 +170,7 @@ export default {
font-size: 1.3rem; font-size: 1.3rem;
font-weight: 500; font-weight: 500;
color: #0D52B3; color: #0D52B3;
line-height: 1.8rem; line-height: 2.3rem;
margin-right: 1.5rem; margin-right: 1.5rem;
margin-left: 2.1rem; margin-left: 2.1rem;
} }

21
src/views/index/index.vue
View File

@@ -25,26 +25,27 @@
<UndergraduateAndGraduate/> <UndergraduateAndGraduate/>
</el-col> </el-col>
</el-row> </el-row>
<el-row v-if="$i18n.locale === 'cn'">
<el-col>
<PartyBuildingActivities/>
</el-col>
</el-row>
<!-- <el-row>--> <!-- <el-row>-->
<!-- <el-col>--> <!-- <el-col>-->
<!-- <ResearchTrends/>--> <!-- <ResearchTrends/>-->
<!-- </el-col>--> <!-- </el-col>-->
<!-- </el-row>--> <!-- </el-row>-->
<!-- <el-row v-if="$i18n.locale === 'cn'">-->
<!-- <el-col>-->
<!-- <PartyBuildingActivities/>-->
<!-- </el-col>-->
<!-- </el-row>-->
<!-- <el-row>--> <!-- <el-row>-->
<!-- <el-col>--> <!-- <el-col>-->
<!-- <TeachingStudent/>--> <!-- <TeachingStudent/>-->
<!-- </el-col>--> <!-- </el-col>-->
<!-- </el-row>--> <!-- </el-row>-->
<!-- <el-row v-show="width>=1100">--> <el-row v-show="width>=1100">
<!-- <el-col>--> <el-col>
<!-- <Bottom/>--> <Bottom/>
<!-- </el-col>--> </el-col>
<!-- </el-row>--> </el-row>
</div> </div>
</template> </template>