112 lines
3.0 KiB
Vue
112 lines
3.0 KiB
Vue
|
<template>
|
||
|
|
<!-- 站内信 -->
|
||
|
|
<div class="in-site-msg-wrapper">
|
||
|
|
<div class="in-site-msg-header">
|
||
|
|
<div class="in-site-msg-tit">站内信</div>
|
||
|
|
<div class="in-site-msg-more" @click="goMore(2)">查看更多 》</div>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<div class="in-site-msg-content">
|
||
|
|
<vue-seamless-scroll
|
||
|
|
v-if="listData.length > 0"
|
||
|
|
:class-option="optionSingleHeightTime"
|
||
|
|
:data="listData"
|
||
|
|
class="seamless-warp"
|
||
|
|
>
|
||
|
|
<ul class="item">
|
||
|
|
<li v-for="(item, index) in listData" :key="index">
|
||
|
|
<span class="title" v-text="item.title"></span>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</vue-seamless-scroll>
|
||
|
|
|
||
|
|
<el-empty v-else :image-size="100" description="暂无站内信"></el-empty>
|
||
|
|
</div>
|
||
|
|
<div
|
||
|
|
v-if="listData.length > 0"
|
||
|
|
class="more"
|
||
|
|
@click="goMore(2)"
|
||
|
|
style="margin: 20px 0 0 0"
|
||
|
|
>
|
||
|
|
查看更多>>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { getNoticeList } from "@/api/sidebaruserinfo.js";
|
||
|
|
export default {
|
||
|
|
name: "InSiteMessage",
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
listData: [],
|
||
|
|
optionSingleHeightTime() {
|
||
|
|
return {
|
||
|
|
step: 0.6, // 数值越大速度滚动越快
|
||
|
|
limitMoveNum: this.listData.length, // 开始无缝滚动的数据量 this.dataList.length
|
||
|
|
hoverStop: true, // 是否开启鼠标悬停stop
|
||
|
|
direction: 1, // 0向下 1向上 2向左 3向右
|
||
|
|
openWatch: true, // 开启数据实时监控刷新dom
|
||
|
|
singleHeight: 14, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
|
||
|
|
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
|
||
|
|
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
|
||
|
|
};
|
||
|
|
},
|
||
|
|
};
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.getListData();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
goMore(index) {
|
||
|
|
//1公告 2站内信
|
||
|
|
this.$router.push({
|
||
|
|
path: "/noticeLists",
|
||
|
|
query: { index: index },
|
||
|
|
});
|
||
|
|
},
|
||
|
|
getListData() {
|
||
|
|
getNoticeList({ functionType: 2 }).then((res) => {
|
||
|
|
this.listData = res.rows;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.in-site-msg-wrapper {
|
||
|
|
margin-top: 20px;
|
||
|
|
box-shadow: 0px 2px 20px 0px rgba(135, 135, 135, 0.3);
|
||
|
|
border-radius: 10px 10px 10px 10px;
|
||
|
|
padding: 5px 10px 20px 10px;
|
||
|
|
text-align: center;
|
||
|
|
.in-site-msg-header {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
padding: 10px 0;
|
||
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||
|
|
.in-site-msg-tit {
|
||
|
|
font-size: 16px;
|
||
|
|
font-family: PingFang SC-Semibold, PingFang SC;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #333333;
|
||
|
|
}
|
||
|
|
.in-site-msg-more {
|
||
|
|
font-size: 12px;
|
||
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
||
|
|
font-weight: 400;
|
||
|
|
color: #3499ff;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.in-site-msg-content {
|
||
|
|
height: 220px;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|