Files
laws_weilai/jero-web/src/views/dashboard/components/documentDynamics.vue
T
2022-05-26 14:56:50 +08:00

173 lines
4.0 KiB
Java

<template>
<div class="documentDynamics-box">
<div class="header-text">
<div class="header-text-left">{{this.$t('documentDynamics')}}</div>
<div class="header-text-right" @click="moreClick">
more
<img src="../../../assets/gengduo.png" alt="">
</div>
</div>
<div class="documentDynamics-box-content" v-if="dataSource.length > 0">
<div class="documentDynamics-text" v-for="(item,index) in dataSource"
:key="index"
@click="magClick(item)">
<div class="yuan"></div>
<div class="text">{{item.msgContent}}</div>
<!-- <img src="../../../assets/new.png" alt="">-->
<div class="time">{{item.createTime}}</div>
</div>
<div class="solid"></div>
</div>
<div v-else style="height: 200px;position: relative">
<JNoData/>
</div>
<JLoading :loading="loading">{{$t('dataLoading')}}</JLoading>
</div>
</template>
<script>
import { getAction, putAction, deleteAction } from '@/api/manage'
export default {
name: 'documentDynamics',
data() {
return {
pageSize: 8,
pageNo: 1,
dataSource: [],
loading: false,
url: {
list: '/home/homeDocumentDynamicEO/page',
readAllMsg: 'sys/sysAnnouncementSend/read'
}
}
},
mounted() {
this.getList()
},
methods: {
getList() {
let query = {
pageNo: this.pageNo,
pageSize: this.pageSize
}
this.loading = true
getAction(this.url.list, query).then((res) => {
if (res.success) {
this.dataSource = res.result.records || []
this.loading = false
} else {
this.loading = false
}
})
},
magClick(row) {
row.isCustomContentList = true
this.$router.push({
path: '/system/MessageDetails',
query: row
})
},
moreClick() {
this.$router.push({
path: '/customContentList'
})
}
}
}
</script>
<style scoped lang="less">
.documentDynamics-box {
width: 100%;
position: relative;
.header-text {
width: 100%;
display: flex;
justify-content: space-between;
.header-text-left {
font-size: 20px;
font-weight: 400;
color: #040B29;
}
.header-text-right {
font-size: 14px;
font-weight: 400;
color: #9B9DA9;
margin-top: 6px;
cursor: pointer;
}
}
.documentDynamics-box-content {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
.solid {
width: 1px;
height: 200px;
background: #EFF1F3;
position: absolute;
left: 50%;
top: 100px;
transform: translate(-50%, -50%);
}
.documentDynamics-text {
height: 49px;
width: calc(50% - 20px);
line-height: 51px;
border-bottom: 1px solid #EFF1F3;
position: relative;
margin-bottom: 6px;
cursor: pointer;
.yuan {
width: 6px;
display: inline-block;
height: 6px;
background: #040B29;
opacity: 0.8;
border-radius: 50%;
position: absolute;
left: 0;
top: 50%;
transform: translate(-50%, -50%);
}
.text {
display: inline-block;
font-size: 16px;
font-weight: 400;
color: #040B29;
margin-left: 14px;
width: calc(100% - 240px);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
img {
width: 38px;
height: 20px;
margin-top: -42px;
margin-left: 3px;
}
.time {
font-size: 14px;
float: right;
font-weight: 400;
color: #9B9DA9;
margin-right: 12px;
}
}
}
}
</style>