<template>
|
<div id="newPushDetail">
|
<header>
|
<img src="../../assets/images/homeLogin.png" alt="" srcset="">
|
</header>
|
<Col v-if="show" class="demo-spin-col" span="24">
|
<Spin fix>
|
<Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
|
<div>Loading</div>
|
</Spin>
|
</Col>
|
<main v-else>
|
<div class="item" v-for="item in this.arr1">
|
<div class="left">{{ item.Name ? item.Name.replace('事件', '').replace('系统', '') + '：' : '--' }}</div>
|
<div class="right"> {{ item.Value ? item.Value : '--' }}</div>
|
</div>
|
|
<div class="item">
|
<div class="left">公司名称：</div>
|
<div class="right"> {{ content.CompanyName ? content.CompanyName : '--' }}</div>
|
|
</div>
|
<div class="item">
|
<div class="left">事件类别：</div>
|
<div class="right"> {{ content.EventType ? content.EventType : '--' }}</div>
|
</div>
|
<div class="item">
|
<div class="left">风险等级：</div>
|
<div class="right"> {{ content.WarnLevelName ? content.WarnLevelName : '--' }} </div>
|
</div>
|
<div v-if="this.arr2.length > 0">
|
<div v-for="(item, index) in this.arr2" style="display: flex;padding:0 10px 0 0" :key="index">
|
<span style="display: inline-block;white-space: nowrap;font-size: 18px;font-weight: 500;"
|
v-html="item.Name"></span>
|
<span style="display: inline-block;font-size: 18px;font-weight: 500;">：</span>
|
<span style="display: inline-block;line-height: 27px;"
|
v-show="item.Value === '' || item.Value === null">--</span>
|
<span style="display: inline-block;word-break: break-all;line-height: 27px;"
|
v-if="item.Value != '' && item.Value != null"
|
v-html="item.Name.indexOf('元') > -1 || item.Name.indexOf('（元）') > -1 ? CustomMethods.numTo$(item.Value.replace(/\n/g, '<br>').replaceAll(content.CompanyName, `<span style='color:red;'>${content.CompanyName}</span>`)) : item.Value.replace(/\n/g, '<br>').replaceAll(content.CompanyName, `<span style='color:red;'>${content.CompanyName}</span>`)"></span>
|
</div>
|
</div>
|
</main>
|
</div>
|
</template>
|
|
<script>
|
import axios from '@/libs/api.request'
|
export default {
|
name: 'newPushDetail',
|
data() {
|
return {
|
id: 0,
|
content: {
|
CompanyName: '',
|
EventType: '',
|
WarnLevelName: '',
|
Content: '',
|
},
|
arr1: [],
|
arr2: [],
|
show: true,
|
|
}
|
},
|
created() {
|
|
},
|
mounted() {
|
|
// setTimeout(() => {
|
|
// return false
|
// }, 1000);
|
//
|
},
|
methods: {
|
// EventKg/GetDynamicById(int Id)
|
|
GetDynamicById() {
|
this.show = true
|
let data = {
|
Id: this.id
|
// Id: 28616
|
}
|
axios.request({
|
url: '/EventKg/GetDynamicById',
|
method: 'post',
|
data: data
|
}).then(res => {
|
if (res.data.Check) {
|
this.content = res.data.Data
|
this.content.Content = JSON.parse(this.content.Content)
|
this.arr1 = this.content.Content.slice(0, 2)
|
this.arr2 = this.content.Content.slice(3)
|
console.log(this.content, this.arr1, this.arr2);
|
this.show = false
|
} else {
|
this.content = {}
|
this.arr1 = []
|
this.arr2 = []
|
this.show = false
|
}
|
}, res => {
|
this.content = {}
|
this.arr1 = []
|
this.arr2 = []
|
this.show = false
|
})
|
}
|
},
|
watch: {
|
$route: {
|
handler() {
|
if (this.$router.currentRoute.name === 'newPushDetail') {
|
this.id = this.$route.query.Id
|
this.GetDynamicById()
|
return
|
}
|
},
|
immediate: true,
|
},
|
},
|
beforeRouteLeave(to, from, next) {
|
// console.log(to, from);
|
// if(to.name=='login'){
|
// next()
|
// }
|
}
|
|
}
|
</script>
|
|
<style lang="less" >
|
body {
|
overflow: auto;
|
}
|
|
#newPushDetail {
|
overflow: visible !important;
|
}
|
|
#newPushDetail header {
|
width: 100vw;
|
height: 80px;
|
background-color: #123DD6;
|
|
img {
|
height: 60px;
|
margin-top: 10px;
|
position: relative;
|
left: ~'calc(50% - 132px)';
|
}
|
}
|
|
main {
|
width: 100vw;
|
padding: 20px 10px;
|
|
.item {
|
display: flex;
|
|
.left {
|
min-width: 90px;
|
// width: 120px;
|
font-size: 18px;
|
font-weight: 500;
|
}
|
|
.right {
|
line-height: 27px;
|
display: inline-block;
|
word-break: break-all;
|
}
|
}
|
}
|
|
#newPushDetail img {
|
max-width: 300px !important;
|
}
|
|
|
#newPushDetail .demo-spin-col .circular {
|
width: 25px;
|
height: 25px;
|
}
|
|
#newPushDetail .demo-spin-icon-load {
|
animation: ani-demo-spin 1s linear infinite;
|
}
|
|
@keyframes ani-demo-spin {
|
from {
|
transform: rotate(0deg);
|
}
|
|
50% {
|
transform: rotate(180deg);
|
}
|
|
to {
|
transform: rotate(360deg);
|
}
|
}
|
|
#newPushDetail .demo-spin-col {
|
height: 100vh;
|
position: relative;
|
border: 1px solid #eee;
|
}
|
</style>
|
