This commit is contained in:
hh
2021-12-28 17:19:13 +08:00
parent 3570f97443
commit 37fc8abc80
9 changed files with 124 additions and 130 deletions

View File

@ -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;

View File

@ -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,

View File

@ -74,6 +74,9 @@ export default {
color: '#fff'
},
},
tooltip: {
trigger: 'axis',
},
grid: {
left: '3%',
right: '6%',

View File

@ -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)
},

View File

@ -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: {

View File

@ -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>

View File

@ -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 () {

View File

@ -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,
}
},

View File

@ -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,