fixBug
This commit is contained in:
@ -3,7 +3,7 @@
|
||||
<div class="digScreenLayout">
|
||||
<div class="bg1"></div>
|
||||
<bigScreenHead></bigScreenHead>
|
||||
<router-view class="content"/>
|
||||
<router-view v-if="refresh" class="content" />
|
||||
</div>
|
||||
</scalseBox>
|
||||
|
||||
@ -12,12 +12,105 @@
|
||||
<script>
|
||||
import scalseBox from './components/scaleBox.vue'
|
||||
import bigScreenHead from "./components/bigScreenHead/index.vue";
|
||||
|
||||
import { debounce } from "lodash";
|
||||
export default {
|
||||
name: 'DigScreenLayout',
|
||||
components: {
|
||||
scalseBox,
|
||||
bigScreenHead,
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
socket: '',
|
||||
path: '',
|
||||
isRefresh: false,
|
||||
refresh: true,
|
||||
timer: null,
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.getUrl()
|
||||
this.timer = setInterval(() => {
|
||||
this.canRefresh();
|
||||
}, 5 * 60 * 1e3);
|
||||
},
|
||||
methods: {
|
||||
canRefresh () {
|
||||
console.log('this.isRefresh',this.isRefresh);
|
||||
if (this.isRefresh) {
|
||||
this.refresh = false;
|
||||
this.$forceUpdate();
|
||||
setTimeout(() => {
|
||||
this.refresh = true;
|
||||
this.isRefresh = false;
|
||||
}, 0)
|
||||
}
|
||||
},
|
||||
getUrl () {
|
||||
this.request({
|
||||
url: '/getSocketUrl',
|
||||
method: 'get',
|
||||
}).then(res => {
|
||||
if (200 == res.code) {
|
||||
this.path = res.msg;
|
||||
this.init()
|
||||
}
|
||||
})
|
||||
},
|
||||
init: function () {
|
||||
if (typeof WebSocket === 'undefined') {
|
||||
alert('您的浏览器不支持socket')
|
||||
} else {
|
||||
// 实例化socket
|
||||
this.socket = new WebSocket(this.path)
|
||||
console.log(this.socket)
|
||||
// 监听socket连接
|
||||
this.socket.onopen = this.open
|
||||
// 监听socket错误信息
|
||||
this.socket.onerror = this.error
|
||||
// 监听socket消息
|
||||
this.socket.onmessage = this.getMessage
|
||||
}
|
||||
},
|
||||
open () {
|
||||
console.log('socket连接成功')
|
||||
},
|
||||
error: function () {
|
||||
console.log('连接错误')
|
||||
},
|
||||
getMessage (msg) {
|
||||
console.log('getMessage')
|
||||
const data = JSON.parse(msg.data)
|
||||
console.log(data)
|
||||
if (data.isRefresh) {
|
||||
console.log('服务端数据更新');
|
||||
this.isRefresh = true;
|
||||
this.canRefresh();
|
||||
|
||||
// debounce(this.canRefresh, 1000 , true);
|
||||
}
|
||||
if (data.isConnect) {
|
||||
console.log('链接成功');
|
||||
}
|
||||
},
|
||||
close: function () {
|
||||
console.log('socket已经关闭')
|
||||
},
|
||||
// debounce(fn, delay) {
|
||||
// const delays = delay || 1 * 1e3
|
||||
// let timer
|
||||
// return function () {
|
||||
// const th = this
|
||||
// const args = arguments
|
||||
// if (timer) {
|
||||
// clearTimeout(timer)
|
||||
// }
|
||||
// timer = setTimeout(function () {
|
||||
// timer = null
|
||||
// fn.apply(th, args)
|
||||
// }, delays)
|
||||
// }
|
||||
// },
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -27,7 +120,7 @@ export default {
|
||||
position: relative;
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
background-color: #0D1049;
|
||||
background-color: #0d1049;
|
||||
// background-image: url("../img/bg.png");
|
||||
background-size: cover;
|
||||
display: flex;
|
||||
|
@ -161,7 +161,7 @@ export default {
|
||||
titData.push(item.month);
|
||||
COMPLETEDREVENUE.push(item.COMPLETEDREVENUE);
|
||||
FORECASTREVENUE.push(item.FORECASTREVENUE);
|
||||
TARGETREVENUE.push(item.COMPLETEDREVENUE/item.TARGETREVENUE * 100);
|
||||
TARGETREVENUE.push((item.COMPLETEDREVENUE/item.TARGETREVENUE * 100).toFixed(2));
|
||||
}
|
||||
this.setOptions2(titData,COMPLETEDREVENUE,FORECASTREVENUE,TARGETREVENUE)
|
||||
})
|
||||
@ -181,7 +181,7 @@ export default {
|
||||
},
|
||||
grid: {
|
||||
containLabel: true,
|
||||
left: 20,
|
||||
left: 30,
|
||||
right: 10,
|
||||
top: 30,
|
||||
bottom: 50,
|
||||
|
@ -74,6 +74,9 @@ export default {
|
||||
color: '#fff'
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '6%',
|
||||
|
@ -158,7 +158,7 @@ export default {
|
||||
method: 'get',
|
||||
params: { type: type }
|
||||
}).then(res => {
|
||||
if (200 == res.code) {
|
||||
if (200 == res.code && res.data) {
|
||||
this.resData = res.data;
|
||||
}
|
||||
})
|
||||
@ -327,7 +327,7 @@ export default {
|
||||
let { list, rate } = res.data;
|
||||
this.chart2 = echarts.init(this.$refs.chart2, 'macarons')
|
||||
this.setOptions2(list);
|
||||
this.initChart3(rate);
|
||||
this.initChart3(rate);
|
||||
}
|
||||
})
|
||||
|
||||
@ -350,20 +350,7 @@ export default {
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [
|
||||
'2021-01',
|
||||
'2021-02',
|
||||
'2021-03',
|
||||
'2021-04',
|
||||
'2021-05',
|
||||
'2021-06',
|
||||
'2021-07',
|
||||
'2021-08',
|
||||
'2021-09',
|
||||
'2021-10',
|
||||
'2021-11',
|
||||
'2021-12',
|
||||
],
|
||||
data: list.map(e=>e.month),
|
||||
// axisPointer: {
|
||||
// type: 'shadow',
|
||||
// },
|
||||
@ -411,7 +398,9 @@ export default {
|
||||
type: 'line',
|
||||
yAxisIndex: 0,
|
||||
smooth: false,
|
||||
data: [80, 70, 80, 70, 80, 70, 80, 70, 80, 70, 80, 70],
|
||||
//
|
||||
data: list.map(e=>e.rate),
|
||||
// data: [80, 70, 80, 70, 80, 70, 80, 70, 80, 70, 80, 70],
|
||||
itemStyle: {
|
||||
color: '#1098FF',
|
||||
},
|
||||
@ -433,6 +422,9 @@ export default {
|
||||
})
|
||||
},
|
||||
initChart3 (rate) {
|
||||
if(!rate) {
|
||||
return;
|
||||
}
|
||||
this.chart3 = echarts.init(this.$refs.chart3, 'macarons')
|
||||
this.setOptions3(rate)
|
||||
},
|
||||
|
@ -16,7 +16,7 @@
|
||||
</el-date-picker>
|
||||
<div class="box"><span style="font-size: 25px">·</span><span style="font-size: 18px">总体完成率</span></div>
|
||||
<progressBar :percentage="rate.comprehensiveRate" style="margin: 10px 0 20px" />
|
||||
<i class="num">80%</i>
|
||||
<i class="num">{{rate.comprehensiveRate.toFixed(2) || 0}}%</i>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; height: 100%" v-else>
|
||||
@ -203,7 +203,9 @@ export default {
|
||||
}).then(res => {
|
||||
if (200 == res.code) {
|
||||
let { rate, list } = res.data;
|
||||
this.rate = rate;
|
||||
if(rate) {
|
||||
this.rate = rate;
|
||||
}
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.chart.setOption({
|
||||
tooltip: {
|
||||
|
@ -16,7 +16,7 @@
|
||||
</div>
|
||||
<div class="tag">
|
||||
<div class="title">新签合同额</div>
|
||||
<i style="font-size: 24px; font-weight: bold; color: #91d5fe">300/<i style="font-size: 18px">{{total.newContractAmount}}</i></i>
|
||||
<i style="font-size: 24px; font-weight: bold; color: #91d5fe">{{total.newContractAmount}}<i style="font-size: 18px"></i></i>
|
||||
万
|
||||
</div>
|
||||
</div>
|
||||
|
@ -96,57 +96,32 @@ export default {
|
||||
},
|
||||
{
|
||||
"name": "三级",
|
||||
"COUNTNUMBER": 1
|
||||
"COUNTNUMBER": 0
|
||||
},
|
||||
{
|
||||
"name": "一级",
|
||||
"COUNTNUMBER": 1
|
||||
"COUNTNUMBER": 0
|
||||
}
|
||||
],
|
||||
sourceLevelCount: [
|
||||
{
|
||||
"name": "二级",
|
||||
"COUNTNUMBER": 2
|
||||
"COUNTNUMBER": 0
|
||||
},
|
||||
{
|
||||
"name": "三级",
|
||||
"COUNTNUMBER": 1
|
||||
"COUNTNUMBER": 0
|
||||
},
|
||||
{
|
||||
"name": "四级",
|
||||
"COUNTNUMBER": 1
|
||||
"COUNTNUMBER": 0
|
||||
},
|
||||
{
|
||||
"name": "一级",
|
||||
"COUNTNUMBER": 1
|
||||
"COUNTNUMBER": 0
|
||||
}
|
||||
],
|
||||
points: [
|
||||
{
|
||||
"id": 1,
|
||||
"pointName": "1号大门",
|
||||
"deptName": "部门七",
|
||||
"level": "一级",
|
||||
"status": "运行中",
|
||||
"abscissa": "55%",
|
||||
"ordinate": "65%",
|
||||
"rtmpAddress": "baiddakdnkad",
|
||||
"remark": "没有备注",
|
||||
"createTime": null
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"pointName": "爆炸点",
|
||||
"deptName": "人事部",
|
||||
"level": "三级",
|
||||
"status": "运作中",
|
||||
"abscissa": "0.65",
|
||||
"ordinate": "0.65",
|
||||
"rtmpAddress": "dhuiagduadad",
|
||||
"remark": "这是备注",
|
||||
"createTime": "2021-12-09 14:32:55"
|
||||
}
|
||||
]
|
||||
points: []
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
|
@ -89,69 +89,10 @@ export default {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
data: [
|
||||
{ value: 154, name: '类别一' },
|
||||
{ value: 775, name: '类别二' },
|
||||
{ value: 679, name: '类别三' },
|
||||
{ value: 679, name: '类别四' },
|
||||
{ value: 679, name: '类别五' },
|
||||
{ value: 679, name: '类别六' },
|
||||
{ value: 679, name: '类别七' },
|
||||
{ value: 679, name: '类别八' },
|
||||
],
|
||||
colorList,
|
||||
listData: [1, 2, 3, 4,5,6,7,8],
|
||||
rate: 0,
|
||||
points: [
|
||||
{
|
||||
"id": 1,
|
||||
"pointName": "1号大门",
|
||||
"deptName": "部门七",
|
||||
"level": "一级",
|
||||
"status": "运行中",
|
||||
"abscissa": "55%",
|
||||
"ordinate": "65%",
|
||||
"rtmpAddress": "baiddakdnkad",
|
||||
"remark": "没有备注",
|
||||
"createTime": null
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"pointName": "1号大门",
|
||||
"deptName": "部门七",
|
||||
"level": "一级",
|
||||
"status": "运行中",
|
||||
"abscissa": "55%",
|
||||
"ordinate": "65%",
|
||||
"rtmpAddress": "baiddakdnkad",
|
||||
"remark": "没有备注",
|
||||
"createTime": null
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"pointName": "1号大门",
|
||||
"deptName": "部门七",
|
||||
"level": "一级",
|
||||
"status": "运行中",
|
||||
"abscissa": "55%",
|
||||
"ordinate": "65%",
|
||||
"rtmpAddress": "baiddakdnkad",
|
||||
"remark": "没有备注",
|
||||
"createTime": null
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"pointName": "1号大门",
|
||||
"deptName": "部门七",
|
||||
"level": "一级",
|
||||
"status": "运行中",
|
||||
"abscissa": "55%",
|
||||
"ordinate": "65%",
|
||||
"rtmpAddress": "baiddakdnkad",
|
||||
"remark": "没有备注",
|
||||
"createTime": null
|
||||
},
|
||||
],
|
||||
points: [],
|
||||
flvPlayer: null,
|
||||
}
|
||||
},
|
||||
|
@ -85,19 +85,7 @@ export default {
|
||||
colorList,
|
||||
|
||||
listData: [1, 2, 3, 4, 5, 6, 7, 8],
|
||||
scrollList: [
|
||||
{
|
||||
"id": 1,
|
||||
"month": "2021-01",
|
||||
"workshopName": "车间一",
|
||||
"dangerContent": "没有灭火器",
|
||||
"category": "一类",
|
||||
"measures": "已整改",
|
||||
"personLiable": "小明",
|
||||
"remark": "小明xxx",
|
||||
"createTime": null
|
||||
},
|
||||
],
|
||||
scrollList: [],
|
||||
|
||||
dateRange: [],
|
||||
chart1: null,
|
||||
|
Reference in New Issue
Block a user