<!--
|
* @Author: lzhe lzhe@example.com
|
* @Date: 2024-04-16 15:22:46
|
* @LastEditors: lzhe lzhe@example.com
|
* @LastEditTime: 2024-06-06 16:17:02
|
* @FilePath: /src/views/home/widgets/components/welcome.vue
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
-->
|
<template>
|
<el-card shadow="hover" header="公告">
|
<div class="announcement">
|
<div v-if="noticeList.length != 0" v-for="item in noticeList" class="mesg">
|
<div>
|
<span>{{item.categoryName}}</span>
|
<span @click="showDialog(item)">{{item.title}}</span>
|
</div>
|
<span>{{item.updateTime}}</span>
|
</div>
|
<div v-if="noticeList.length == 0">暂无内容</div>
|
</div>
|
</el-card>
|
<el-dialog title="查看" v-model="visible" :width="600" destroy-on-close>
|
<el-form :model="viewNoticeForm" :disabled="mode=='show'" ref="dialogForm" label-width="80px" label-position="center">
|
<el-row>
|
<el-col :span="24">
|
<el-form-item label="通知标题">
|
<span>{{viewNoticeForm.title}}</span>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="通知类型">
|
<span>{{viewNoticeForm.categoryName}}</span>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="通知时间">
|
<span>{{viewNoticeForm.updateTime}}</span>
|
</el-form-item>
|
</el-col>
|
<el-col :span="24">
|
<el-form-item label="通知内容">
|
<div v-html="viewNoticeForm.content"></div>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</el-dialog>
|
</template>
|
|
<script>
|
export default {
|
title: "公告",
|
icon: "el-icon-setting",
|
description: "系统内通知、公告通知快速查看",
|
data() {
|
return {
|
viewNoticeForm: {
|
title: "",
|
categoryName: "",
|
updateTime: "",
|
content: ""
|
},
|
mode: "show",
|
visible: false,
|
noticeList: []
|
}
|
},
|
mounted() {
|
this.showDetail();
|
},
|
methods: {
|
showDialog(item) {
|
this.$HTTP.get(`/api/blade-notify/notice/detail?id=${item.id}`).then(res=> {
|
if(res.code == 200) {
|
this.visible = true;
|
this.viewNoticeForm = res.data;
|
}
|
})
|
},
|
showDetail(){
|
this.$HTTP.get("/api/blade-notify/notice/page?current=1&size=-1").then(res=> {
|
if(res.code == 200) {
|
this.noticeList = res.data.records;
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.announcement {
|
text-align: center;
|
}
|
.announcement img {
|
text-align: center;
|
width:150px;
|
height:150px;
|
}
|
.mesg {
|
display: flex;
|
justify-content: space-between;
|
margin-bottom: 12px;
|
}
|
.mesg > div {
|
padding-left: 12px;
|
}
|
.mesg > div span:nth-child(1) {
|
margin-right: 12px;
|
padding: 0 10px;
|
border: 1px solid #94c4f6;
|
background-color: #e5ecf4;
|
}
|
.mesg > div span:nth-child(2) {
|
font-weight: bold;
|
cursor: pointer;
|
font-size: 14px;
|
}
|
.mesg > span {
|
padding-right: 12px;
|
}
|
</style>
|
