112 lines
2.2 KiB
Vue
112 lines
2.2 KiB
Vue
<template>
|
|
<div
|
|
class="new-destail"
|
|
v-loading="loading"
|
|
element-loading-text="加载中"
|
|
element-loading-spinner="el-icon-loading"
|
|
element-loading-background="rgba(0, 0, 0, 0.8)"
|
|
>
|
|
<h3
|
|
style="width: 100%;
|
|
text-align: center;
|
|
line-height: 1.5;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
margin: 15px 0;
|
|
"
|
|
>{{info.noticeTitle}}</h3>
|
|
<span
|
|
style="
|
|
width: 100%;
|
|
text-align: center;
|
|
color: #808080;
|
|
line-height: 1.5;
|
|
font: 13px/1.6 Arial,sans-serif,Tahoma,Roboto,'Source Code Pro';
|
|
"
|
|
>发布时间:{{info.createTime}}</span>
|
|
<el-divider></el-divider>
|
|
<div v-html="info.noticeContent" style="padding: 20px;"></div>
|
|
|
|
<div style="
|
|
position: fixed;
|
|
bottom: 10px;
|
|
right: 10px;
|
|
">
|
|
<!-- <el-tooltip class="item" effect="dark" content="前往首页" placement="top">
|
|
<el-button
|
|
type="primary"
|
|
style="
|
|
width: 50px;
|
|
height: 50px;
|
|
font-size: 25px;
|
|
z-index: 100;
|
|
"
|
|
icon="el-icon-back"
|
|
@click="toTableClick"
|
|
circle
|
|
></el-button>
|
|
</el-tooltip> -->
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { getNotice } from "@/api/system/notice";
|
|
export default {
|
|
name: "NewsTableDetails",
|
|
props: {
|
|
newId: {
|
|
type: [Number, String]
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
info: {},
|
|
loading: false
|
|
};
|
|
},
|
|
created() {
|
|
this.loading = true;
|
|
},
|
|
methods: {
|
|
getNewsList(id) {
|
|
getNotice(id)
|
|
.then(response => {
|
|
this.loading = false;
|
|
this.info = response.data;
|
|
})
|
|
.catch(err => {
|
|
this.loading = false;
|
|
console.log(err);
|
|
});
|
|
},
|
|
toTableClick() {
|
|
this.$router.push({ path: "/" });
|
|
}
|
|
},
|
|
watch: {
|
|
newId: {
|
|
handler() {
|
|
this.loading = true;
|
|
let noticeId = this.newId;
|
|
if (noticeId || noticeId === 0) {
|
|
this.getNewsList(noticeId);
|
|
}
|
|
},
|
|
deep: true
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss">
|
|
.new-destail {
|
|
padding: 20px;
|
|
display: flex;
|
|
justify-content: center;
|
|
flex-wrap: wrap;
|
|
height: auto;
|
|
.el-divider--horizontal {
|
|
margin: 15px 0;
|
|
}
|
|
}
|
|
</style>
|