You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
294 lines
11 KiB
294 lines
11 KiB
<!--
|
|
* @Author: your name
|
|
* @Date: 2021-10-19 15:57:11
|
|
* @LastEditTime: 2021-11-26 17:41:34
|
|
* @LastEditors: Please set LastEditors
|
|
* @Description: In User Settings Edit
|
|
* @FilePath: /data-show/src/views/EventDEC/index.vue
|
|
-->
|
|
<template>
|
|
<div class="d-container">
|
|
<div class="edec-outter">
|
|
<div class="edec-d1">
|
|
<v-label-div title="事件详情">
|
|
<a-button style="margin-right: 1rem" @click="goDataList" v-has="'btn_event_datalist'">进入数据列表页</a-button>
|
|
<a-button style="margin-right: 1rem" @click="handlerExport" :loading="btnLoading" v-has="'btn_event_toppt'">导出报告</a-button>
|
|
<v-btn @click="goback">返回</v-btn>
|
|
</v-label-div>
|
|
<div class="edec-d1-dd1">
|
|
<div class="d1">{{eventObj.events_type}}</div>
|
|
<div class="d2">
|
|
<div class="s1">{{eventObj.events_title}}</div>
|
|
<div class="s2">{{eventObj.description}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="edec-d1-dd2">
|
|
<div class="d1" style="margin-left: 16px">
|
|
<img class="m1" src="../../assets/images/EventInsight/ic_kssj.png" />
|
|
<span class="s1">开始时间：</span>
|
|
<span class="s2">{{eventObj.source_time}}</span>
|
|
</div>
|
|
<div class="d1">
|
|
<img class="m1" src="../../assets/images/EventInsight/ic_yxl.png" />
|
|
<span class="s1">影响力指数：</span>
|
|
<span class="s2">{{eventObj.Effect}}</span>
|
|
</div>
|
|
<div class="d1">
|
|
<img class="m1" src="../../assets/images/EventInsight/ic_cbl.png" />
|
|
<span class="s1">传播总量：</span>
|
|
<span class="s2">{{eventObj.events_count}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<vue-lazy-component>
|
|
<incidentSpreadSituation :id="events_id"></incidentSpreadSituation>
|
|
<incidentSpreadSituationStoken slot="skeleton"></incidentSpreadSituationStoken>
|
|
</vue-lazy-component>
|
|
<div class="edec-d3">
|
|
<vue-lazy-component>
|
|
<tonalCommunicationPosture :id="events_id"></tonalCommunicationPosture>
|
|
<tonalCommunicationPostureStoken slot="skeleton"></tonalCommunicationPostureStoken>
|
|
</vue-lazy-component>
|
|
<vue-lazy-component>
|
|
<keyCommunicationPositions :id="events_id"></keyCommunicationPositions>
|
|
<keyCommunicationPositionsStoken slot="skeleton"></keyCommunicationPositionsStoken>
|
|
</vue-lazy-component>
|
|
</div>
|
|
<vue-lazy-component>
|
|
<esprocess :id="events_id"></esprocess>
|
|
<esprocessStoken slot="skeleton"></esprocessStoken>
|
|
</vue-lazy-component>
|
|
<vue-lazy-component>
|
|
<mediaInterpretationEc :id="events_id"></mediaInterpretationEc>
|
|
<mediaInterpretationEcStoken slot="skeleton"></mediaInterpretationEcStoken>
|
|
</vue-lazy-component>
|
|
<vue-lazy-component>
|
|
<mediaInterpretationED :id="events_id"></mediaInterpretationED>
|
|
<mediaInterpretationEDStoken slot="skeleton"></mediaInterpretationEDStoken>
|
|
</vue-lazy-component>
|
|
<vue-lazy-component>
|
|
<wbUserEDE :id="events_id"></wbUserEDE>
|
|
<wbUserEDEStoken slot="skeleton"></wbUserEDEStoken>
|
|
</vue-lazy-component>
|
|
<div class="edec-d2">
|
|
<v-label-div title="尾翼分析">
|
|
</v-label-div>
|
|
<vue-lazy-component>
|
|
<tailAnalysisED :id="events_id"></tailAnalysisED>
|
|
<tailAnalysisEDStoken slot="skeleton"></tailAnalysisEDStoken>
|
|
</vue-lazy-component>
|
|
<div class="edec-dd1">
|
|
<vue-lazy-component>
|
|
<kmdED :id="events_id"></kmdED>
|
|
<kmdEDStoken slot="skeleton"></kmdEDStoken>
|
|
</vue-lazy-component>
|
|
<vue-lazy-component>
|
|
<pnwcWord :id="events_id"></pnwcWord>
|
|
<pnwcWordStoken slot="skeleton"></pnwcWordStoken>
|
|
</vue-lazy-component>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import incidentSpreadSituation from "./incidentSpreadSituation";
|
|
import tonalCommunicationPosture from "./tonalCommunicationPosture";
|
|
import keyCommunicationPositions from "./keyCommunicationPositions";
|
|
import esprocess from "./esprocess";
|
|
import mediaInterpretationEc from "./mediaInterpretationEc";
|
|
import mediaInterpretationED from "./mediaInterpretationED";
|
|
import wbUserEDE from "./wbUserEDE";
|
|
import tailAnalysisED from "./tailAnalysisED";
|
|
import kmdED from "./kmdED"
|
|
import pnwcWord from "./pnwcWord"
|
|
//骨架屏
|
|
import incidentSpreadSituationStoken from "./incidentSpreadSituationStoken";
|
|
import tonalCommunicationPostureStoken from "./tonalCommunicationPostureStoken";
|
|
import keyCommunicationPositionsStoken from "./keyCommunicationPositionsStoken";
|
|
import esprocessStoken from "./esprocessStoken";
|
|
import mediaInterpretationEcStoken from "./mediaInterpretationEcStoken";
|
|
import mediaInterpretationEDStoken from "./mediaInterpretationEDStoken";
|
|
import wbUserEDEStoken from "./wbUserEDEStoken";
|
|
import tailAnalysisEDStoken from "./tailAnalysisEDStoken";
|
|
import kmdEDStoken from "./kmdEDStoken"
|
|
import pnwcWordStoken from "./pnwcWordStoken"
|
|
import {getEventData} from '@/api/EventdEC'
|
|
import { getToPptTask } from "@/api/BrandInsight";
|
|
export default {
|
|
name: "eventDEC",
|
|
components: {
|
|
incidentSpreadSituation, // 事件传播态势
|
|
tonalCommunicationPosture, // 调性传播态势
|
|
keyCommunicationPositions, // 重点传播阵地
|
|
esprocess, // 事件传播历程
|
|
mediaInterpretationEc, // 事件传播历程-媒体解读
|
|
mediaInterpretationED, // 媒体解读
|
|
wbUserEDE, // 微博用户画像
|
|
tailAnalysisED, // 尾翼分析
|
|
kmdED, // 重点媒体分布
|
|
pnwcWord, // 正负词云
|
|
//骨架屏
|
|
incidentSpreadSituationStoken, // 事件传播态势
|
|
tonalCommunicationPostureStoken, // 调性传播态势
|
|
keyCommunicationPositionsStoken, // 重点传播阵地
|
|
esprocessStoken, // 事件传播历程
|
|
mediaInterpretationEcStoken, // 事件传播历程-媒体解读
|
|
mediaInterpretationEDStoken, // 媒体解读
|
|
wbUserEDEStoken, // 微博用户画像
|
|
tailAnalysisEDStoken, // 尾翼分析
|
|
kmdEDStoken, // 重点媒体分布
|
|
pnwcWordStoken // 正负词云
|
|
},
|
|
data() {
|
|
return {
|
|
gValue: 0,
|
|
total: 0,
|
|
Time: "",
|
|
events_id: "",
|
|
btnLoading: false,
|
|
eventObj: {
|
|
events_type: "",
|
|
events_title: "",
|
|
description: "",
|
|
source_time: "",
|
|
events_count: 0,
|
|
Effect: ""
|
|
},
|
|
form: {
|
|
sRele: "",
|
|
token: "",
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
this.form.token = this.getToken;
|
|
this.events_id = this.$route.query.events_id || "";
|
|
this.form.sRele = this.events_id;
|
|
this.getDdta();
|
|
},
|
|
methods: {
|
|
getDdta(){
|
|
let obj = Object.assign({},this.form);
|
|
this.load = true;
|
|
getEventData(obj).then(res => {
|
|
let data = res.data || [];
|
|
this.eventObj = {...data[0]._source};
|
|
this.load = false;
|
|
})
|
|
},
|
|
goback() {
|
|
this.$router.go(-1);
|
|
},
|
|
goDataList() {
|
|
this.$router.push({path: '/industryDataExport',query: {token: this.getToken, events_id: this.events_id, sType: 'HotEvent', action: 'getList', title: '事件-行业数据'}})
|
|
},
|
|
handlerExport() {
|
|
this.btnLoading = true;
|
|
let obj = Object.assign({}, this.getCtime2, {
|
|
token: this.getToken,
|
|
sRele: this.events_id,
|
|
sType: 'ToEventPptV6'
|
|
});
|
|
getToPptTask(obj).then(() => {
|
|
this.$notification.open({
|
|
message: `数据生成中`,
|
|
description: '请前往个人中心查看下载进度',
|
|
placement: 'bottomRight',
|
|
});
|
|
this.btnLoading = false;
|
|
})
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="less" scoped>
|
|
.edec-outter {
|
|
padding: 0px 16px 16px 16px;
|
|
}
|
|
.edec-d1 {
|
|
width: 100%;
|
|
height: 245px;
|
|
border: 2px solid #0f2a4d;
|
|
overflow: hidden;
|
|
.edec-d1-dd1 {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
.d1 {
|
|
width: 120px;
|
|
height: 120px;
|
|
background-image: url("../../assets/images/EventInsight/img_xlq.png");
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
margin-left: 16px;
|
|
margin-top: 16px;
|
|
line-height: 120px;
|
|
text-align: center;
|
|
color: #006dff;
|
|
}
|
|
.d2 {
|
|
width: 1714px;
|
|
margin-left: 16px;
|
|
.s1 {
|
|
font-size: 20px;
|
|
color: #fff;
|
|
margin-top: 36px;
|
|
}
|
|
.s2 {
|
|
width: 100%;
|
|
color: #828990;
|
|
font-size: 14px;
|
|
margin-top: 6px;
|
|
height: 40px;
|
|
word-break: break-all;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
}
|
|
.edec-d1-dd2 {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
.d1 {
|
|
width: 400px;
|
|
margin-top: 10px;
|
|
.m1 {
|
|
width: 44px;
|
|
height: 44px;
|
|
}
|
|
.s1 {
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
color: #878887;
|
|
margin-left: 4px;
|
|
}
|
|
.s2 {
|
|
display: inline-block;
|
|
font-size: 12px;
|
|
font-family: Bebas;
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.edec-d2 {
|
|
width: 100%;
|
|
height: auto;
|
|
border: 2px solid #0f2a4d;
|
|
margin-top: 16px;
|
|
.edec-dd1 {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
}
|
|
.edec-d3 {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
</style> |