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.

123 lines
3.1 KiB

<template>
<div class="bwc-outter" v-loading="load">
<v-label-div title="词云">
<div>
<v-tab-group
:btns="['正面', '负面', '热门']"
@change="handlerTab"
></v-tab-group>
</div>
</v-label-div>
<div class="bwc-inner">
<v-echarts :opt="opt"></v-echarts>
</div>
</div>
</template>
<script>
import {getHotWord,getPositive,getNegative} from "@/api/ThemeAnalizeDec"
import createWordCloud from "@/utils/gol/bubbleWord";
export default {
name: "WordCloud",
data() {
return {
load: false,
form: {
token: ''
},
opt: {},
positiveData: {},
negativeData: {},
hotData: {},
}
},
created() {
this.form = this.$route.query;
this.getData()
},
methods: {
getData() {
this.load = true;
Promise.all([this.getP(), this.getN(), this.getH()]).then(() => {
// 什么也不执行
this.opt = createWordCloud(this.positiveData);
this.load = false;
});
},
// 正面
getP() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.form);
getPositive(obj)
.then((res) => {
this.positiveData = res.data || {};
resolve(res);
})
.catch(() => {
reject(false);
});
});
},
// 负面
getN() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.form);
getNegative(obj)
.then((res) => {
this.negativeData = res.data || {};
resolve(res);
})
.catch(() => {
reject(false);
});
});
},
//热门
getH() {
return new Promise((resolve, reject) => {
let obj = Object.assign({}, this.form);
getHotWord(obj)
.then((res) => {
this.hotData = res.data || {};
resolve(res);
})
.catch(() => {
reject(false);
});
});
},
//切换数据
handlerTab(n) {
switch (n) {
case 0:
this.opt = createWordCloud(this.positiveData);
break;
case 1:
this.opt = createWordCloud(this.negativeData);
break;
case 2:
this.opt = createWordCloud(this.hotData);
break;
default:
this.opt = createWordCloud(this.positiveData);
break;
}
},
}
}
</script>
<style lang="less">
.bwc-outter {
width: 936px;
height: 460px;
border: 2px solid #0f2a4d;
margin-left: 16px;
overflow: hidden;
.bwc-inner {
width: 80%;
height: calc(80% - 48px);
margin: 48px 0px 0px 64px;
}
}
</style>