smart-power-ui/src/views/bashboardcom/newTD.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>