parent
cba3225a61
commit
269fea3b60
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
@ -0,0 +1,66 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: your name
|
||||||
|
* @Date: 2021-10-19 19:05:36
|
||||||
|
* @LastEditTime: 2021-10-19 19:31:26
|
||||||
|
* @LastEditors: Please set LastEditors
|
||||||
|
* @Description: In User Settings Edit
|
||||||
|
* @FilePath: /data-show/src/views/EventDEC/incidentSpreadSituation/index.vue
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="iss-outter">
|
||||||
|
<v-label-div title="事件传播态势">
|
||||||
|
<a-select :default-value="1" :size="$vuiSize" style="width: 120px; margin-left: 40px; margin-right: 8px" v-model="selVal" @change="handleChange">
|
||||||
|
<a-select-option :style="{ color: '#fff' }" v-for="item in selDatas" :value="item.key" :key="item.key">
|
||||||
|
{{ item.label }}
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</v-label-div>
|
||||||
|
<div class="iss-inner">
|
||||||
|
<v-echarts :opt="opt"></v-echarts>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import createOpt from "./opt"
|
||||||
|
export default {
|
||||||
|
name: "incidentSpreadSituation",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
opt: createOpt(),
|
||||||
|
selVal: 1,
|
||||||
|
selDatas: [
|
||||||
|
{
|
||||||
|
key: 1,
|
||||||
|
label: "24小时",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 2,
|
||||||
|
label: "最近7天",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 3,
|
||||||
|
label: "最近30天",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 4,
|
||||||
|
label: "自定义",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.iss-outter {
|
||||||
|
width: 100%;
|
||||||
|
height: 460px;
|
||||||
|
border: 2px solid #0f2a4d;
|
||||||
|
margin-top: 16px;
|
||||||
|
.iss-inner {
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100% - 48px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,141 @@
|
|||||||
|
/*
|
||||||
|
* @Author: your name
|
||||||
|
* @Date: 2021-10-12 10:11:24
|
||||||
|
* @LastEditTime: 2021-10-19 19:34:14
|
||||||
|
* @LastEditors: Please set LastEditors
|
||||||
|
* @Description: In User Settings Edit
|
||||||
|
* @FilePath: /data-show/src/views/BrandInsight/titsopo/opt.js
|
||||||
|
*/
|
||||||
|
export default function createOpt() {
|
||||||
|
return {
|
||||||
|
grid: {
|
||||||
|
left: 16,
|
||||||
|
right: 26,
|
||||||
|
bottom: 16,
|
||||||
|
top: 52,
|
||||||
|
containLabel: true
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
trigger: "axis",
|
||||||
|
backgroundColor: "#08182F",
|
||||||
|
color: "#fff",
|
||||||
|
borderColor: "#3373CC",
|
||||||
|
textStyle: {
|
||||||
|
color: "#fff", //设置文字颜色
|
||||||
|
},
|
||||||
|
extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;"
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
icon: 'roundRect',
|
||||||
|
textStyle: { //图例文字的样式
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
y: 12,
|
||||||
|
x: 16
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
boundaryGap: false,
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: "#fff",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data: ['00:00', '04:00', '08:00', '12:00', '16:00', '20:00', '24:00']
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
type: 'value',
|
||||||
|
axisLine: {
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: "#fff",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
lineStyle: {
|
||||||
|
type: "dashed", // y轴分割线类型
|
||||||
|
color: "#012b4b",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '新闻',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [2000, 1600, 1000, 2200, 2300, 2100, 1900]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '微信',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [1000, 1100, 1300, 2000, 1800, 2100, 1600]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '论坛',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [1200, 1200, 1400, 2100, 1400, 1900, 2000]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '微博',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [1200, 1200, 1350, 1550, 1750, 1900, 2000]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'APP',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [1260, 1280, 1390, 1570, 1790, 1950, 2020]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '其他',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [1260, 1280, 1390, 1570, 1790, 1950, 2020]
|
||||||
|
},
|
||||||
|
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,66 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: your name
|
||||||
|
* @Date: 2021-10-19 19:35:25
|
||||||
|
* @LastEditTime: 2021-10-19 19:40:32
|
||||||
|
* @LastEditors: Please set LastEditors
|
||||||
|
* @Description: In User Settings Edit
|
||||||
|
* @FilePath: /data-show/src/views/EventDEC/tonalCommunicationPosture/index.vue
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="tcp-outter">
|
||||||
|
<v-label-div title="事件传播态势">
|
||||||
|
<a-select :default-value="1" :size="$vuiSize" style="width: 120px; margin-left: 40px; margin-right: 8px" v-model="selVal" @change="handleChange">
|
||||||
|
<a-select-option :style="{ color: '#fff' }" v-for="item in selDatas" :value="item.key" :key="item.key">
|
||||||
|
{{ item.label }}
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</v-label-div>
|
||||||
|
<div class="tcp-inner">
|
||||||
|
<v-echarts :opt="opt"></v-echarts>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import createOpt from "./opt"
|
||||||
|
export default {
|
||||||
|
name: "tonalCommunicationPosture",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
opt: createOpt(),
|
||||||
|
selVal: 1,
|
||||||
|
selDatas: [
|
||||||
|
{
|
||||||
|
key: 1,
|
||||||
|
label: "24小时",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 2,
|
||||||
|
label: "最近7天",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 3,
|
||||||
|
label: "最近30天",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 4,
|
||||||
|
label: "自定义",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.tcp-outter {
|
||||||
|
width: 100%;
|
||||||
|
height: 460px;
|
||||||
|
border: 2px solid #0f2a4d;
|
||||||
|
margin-top: 16px;
|
||||||
|
.tcp-inner {
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100% - 48px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,106 @@
|
|||||||
|
/*
|
||||||
|
* @Author: your name
|
||||||
|
* @Date: 2021-10-12 10:11:24
|
||||||
|
* @LastEditTime: 2021-10-19 19:41:42
|
||||||
|
* @LastEditors: Please set LastEditors
|
||||||
|
* @Description: In User Settings Edit
|
||||||
|
* @FilePath: /data-show/src/views/BrandInsight/titsopo/opt.js
|
||||||
|
*/
|
||||||
|
export default function createOpt() {
|
||||||
|
return {
|
||||||
|
grid: {
|
||||||
|
left: 16,
|
||||||
|
right: 26,
|
||||||
|
bottom: 16,
|
||||||
|
top: 52,
|
||||||
|
containLabel: true
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
trigger: "axis",
|
||||||
|
backgroundColor: "#08182F",
|
||||||
|
color: "#fff",
|
||||||
|
borderColor: "#3373CC",
|
||||||
|
textStyle: {
|
||||||
|
color: "#fff", //设置文字颜色
|
||||||
|
},
|
||||||
|
extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;"
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
icon: 'roundRect',
|
||||||
|
textStyle: { //图例文字的样式
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
y: 12,
|
||||||
|
x: 16
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
boundaryGap: false,
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: "#fff",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data: ['00:00', '04:00', '08:00', '12:00', '16:00', '20:00', '24:00']
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
type: 'value',
|
||||||
|
axisLine: {
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: "#fff",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
lineStyle: {
|
||||||
|
type: "dashed", // y轴分割线类型
|
||||||
|
color: "#012b4b",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '正面',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [2000, 1600, 1000, 2200, 2300, 2100, 1900]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '中性',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [1000, 1100, 1300, 2000, 1800, 2100, 1600]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '负面',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0.4
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
focus: 'series'
|
||||||
|
},
|
||||||
|
data: [1200, 1200, 1400, 2100, 1400, 1900, 2000]
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in new issue