Merge branch 'projects/mesxc-test' into projects/mesxc-zhp
This commit is contained in:
commit
d230508e9c
@ -11,7 +11,7 @@
|
||||
<i
|
||||
class=""
|
||||
style="display: inline-block; margin-left: 12px; padding-top: 4px">
|
||||
<img :src="imgSrc" width="20" height="20" alt="" />
|
||||
<img :src="imgSrc" width="24" height="24" alt="" />
|
||||
</i>
|
||||
<span
|
||||
style="
|
||||
@ -107,6 +107,19 @@ export default {
|
||||
background-size: 100% 100%;
|
||||
background-position: 0 0;
|
||||
}
|
||||
&::after {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
// background: inherit;
|
||||
/* 设置模糊,不用 filter */
|
||||
backdrop-filter: blur(5px);
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.container-body {
|
||||
|
@ -158,7 +158,7 @@ export default {
|
||||
grid: { top: 90, right: 12, bottom: 20, left: 70 },
|
||||
legend: {
|
||||
top: 0,
|
||||
left: 100,
|
||||
left: 8,
|
||||
padding: 5,
|
||||
itemWidth: 12,
|
||||
itemHeight: 12,
|
||||
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<NotMsg v-show="notMsg"/>
|
||||
<div id="energeMonitoringChart" class="energe-monitoring-chart" style="width:575px;height:370px;" v-show='!notMsg'></div>
|
||||
<div id="energeMonitoringChart" class="energe-monitoring-chart" style="width:575px;height:420px;" v-show='!notMsg'></div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -63,7 +63,7 @@ export default {
|
||||
}
|
||||
var option = {
|
||||
// color: ['#FF8A40','#FFD160','#99D66C','#5B9BFF','#8167F6','#2760FF'],
|
||||
grid: { top: 32, right: 12, bottom: 20, left: 90 },
|
||||
grid: { top: 82, right: 12, bottom: 20, left: 90 },
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
@ -75,7 +75,11 @@ export default {
|
||||
className: "energe-monitoring-chart-tooltip"
|
||||
},
|
||||
legend: {
|
||||
data: ['电耗能'],
|
||||
itemWidth:10,
|
||||
itemHeight:10,
|
||||
top: '2.5%',
|
||||
right: '0',
|
||||
data: [{name:'电耗能',itemStyle:{color:'#364BFE'}}],
|
||||
textStyle: {
|
||||
color: "#DFF1FE",
|
||||
fontSize: 12,
|
||||
@ -157,6 +161,7 @@ export default {
|
||||
.energe-monitoring-chart {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: -50px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
|
@ -6,7 +6,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
import * as echarts from 'echarts'
|
||||
import resize from './../mixins/resize'
|
||||
import NotMsg from './../components/NotMsg'
|
||||
|
||||
@ -168,7 +168,8 @@ export default {
|
||||
lineStyle: {
|
||||
width: 1
|
||||
},
|
||||
symbolSize: 1,
|
||||
symbol: 'circle',
|
||||
symbolSize: 5,
|
||||
emphasis: {
|
||||
focus: 'series'
|
||||
}
|
||||
|
@ -164,7 +164,8 @@ export default {
|
||||
lineStyle: {
|
||||
width: 1
|
||||
},
|
||||
symbolSize: 1,
|
||||
symbol: 'circle',
|
||||
symbolSize: 5,
|
||||
emphasis: {
|
||||
focus: 'series'
|
||||
}
|
||||
|
@ -60,15 +60,15 @@ export default {
|
||||
}
|
||||
this.chart = echarts.init(document.getElementById('israChart'));
|
||||
var option = {
|
||||
color:this.colors,
|
||||
title:{
|
||||
text: num,
|
||||
subtext: '总数',
|
||||
top: '43%',
|
||||
top: '32%',
|
||||
left: '49%',
|
||||
textAlign: 'center',
|
||||
textStyle: {
|
||||
fontSize: 32,
|
||||
lineHeight: 16,
|
||||
color: '#fff',
|
||||
},
|
||||
subtextStyle: {
|
||||
@ -77,12 +77,20 @@ export default {
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
bottom: '3%',
|
||||
bottom: '2%',
|
||||
left: 'center',
|
||||
itemWidth: 18,
|
||||
itemHeight:18,
|
||||
icon: 'circle',
|
||||
textStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
data:this.chartData && this.chartData.length > 0 && this.chartData.map((item,index)=>({
|
||||
name:item.name,
|
||||
itemStyle:{
|
||||
color: this.colors[index%4]
|
||||
}
|
||||
}))
|
||||
},
|
||||
series:[{
|
||||
name: 'ISRA缺陷检测',
|
||||
@ -96,9 +104,6 @@ export default {
|
||||
labelLine: {
|
||||
show: true,
|
||||
},
|
||||
itemStyle: {
|
||||
borderRadius: 12
|
||||
},
|
||||
data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
|
||||
name:item.name,
|
||||
value: item.num,
|
||||
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<NotMsg v-show="notMsg"/>
|
||||
<div id="numRateChart" class="num-rate-chart" style="width:900px;height:370px;" v-show='!notMsg'></div>
|
||||
<div id="numRateChart" class="num-rate-chart" style="width:900px;height:420px;" v-show='!notMsg'></div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -53,7 +53,7 @@ export default {
|
||||
this.productline && this.productline.length > 0 && this.productline.map(item => {
|
||||
xData.push(item.lineName)
|
||||
outputNum.push(item.outputNum)
|
||||
passRate.push(item.passRate*100)
|
||||
passRate.push(item.passRate?item.passRate*100:null)
|
||||
})
|
||||
if (
|
||||
this.chart !== null &&
|
||||
@ -64,7 +64,7 @@ export default {
|
||||
}
|
||||
this.chart = echarts.init(document.getElementById('numRateChart'));
|
||||
var option = {
|
||||
grid: { top: 32, right: 60, bottom: 20, left: 60 },
|
||||
grid: { top: 82, right: 60, bottom: 20, left: 60 },
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
@ -73,7 +73,15 @@ export default {
|
||||
className: "num-rate-chart-tooltip"
|
||||
},
|
||||
legend: {
|
||||
data: ['产线产量', '良品率'],
|
||||
itemWidth:10,
|
||||
itemHeight:10,
|
||||
top: '2.5%',
|
||||
right: '20px',
|
||||
icon: 'rect',
|
||||
data: [
|
||||
{name:'产线产量',itemStyle:{color:'#364BFE'}},
|
||||
{name:'良品率',itemStyle:{color:'#FFCB59'}}
|
||||
],
|
||||
textStyle: {
|
||||
color: "#DFF1FE",
|
||||
fontSize: 12,
|
||||
@ -136,7 +144,10 @@ export default {
|
||||
axisLabel: {
|
||||
color: "#fff",
|
||||
fontSize: 12,
|
||||
formatter: '{value} %'
|
||||
formatter: () =>{
|
||||
console.log(value)
|
||||
return value ? '{value} %': '-'
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
@ -160,7 +171,7 @@ export default {
|
||||
return value;
|
||||
}
|
||||
},
|
||||
barWidth: 12,
|
||||
barWidth: 20,
|
||||
itemStyle: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{ offset: 0, color: '#5CB7FF' },
|
||||
@ -175,7 +186,7 @@ export default {
|
||||
yAxisIndex: 1,
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + '%';
|
||||
return value?value + '%':'-';
|
||||
}
|
||||
},
|
||||
itemStyle: {
|
||||
@ -191,6 +202,8 @@ export default {
|
||||
lineStyle: {
|
||||
width: 1
|
||||
},
|
||||
symbol: 'circle',
|
||||
symbolSize: 5,
|
||||
data: passRate
|
||||
}
|
||||
]
|
||||
@ -204,6 +217,7 @@ export default {
|
||||
.num-rate-chart {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: -50px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
|
@ -117,7 +117,7 @@ export default {
|
||||
screenfull.toggle(this.$refs.deepProcessingContainerB)
|
||||
},
|
||||
resetSize() {
|
||||
let deepProcessingContainer = document.querySelector('#deepProcessingContainer')
|
||||
let deepProcessingContainer = document.getElementById('deepProcessingContainer')
|
||||
let rw = parseFloat(window.innerWidth)
|
||||
let rh = parseFloat(window.innerHeight)
|
||||
let bw = parseFloat(deepProcessingContainer.style.width)
|
||||
|
@ -29,26 +29,26 @@
|
||||
<div
|
||||
style="
|
||||
font-size: 20px;
|
||||
line-height: 1.5;
|
||||
line-height: 1.24;
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
padding-right: 8px;
|
||||
padding:5px 8px 5px 0;
|
||||
letter-spacing: 3px;
|
||||
">
|
||||
<p style="margin: 0; line-height: inherit">氮氧化物</p>
|
||||
<p style="margin: 0; line-height: inherit">排放浓度</p>
|
||||
</div>
|
||||
<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.NOX_float ? (Number(exhaustGasInfo.NOX_float)).toFixed(2) : ''}}mg/m³</span>
|
||||
<span style="font-size: 20px; line-height: 1.24; flex: 1.2">{{exhaustGasInfo?.NOX_float ? (Number(exhaustGasInfo.NOX_float)).toFixed(2) : ''}}mg/m³</span>
|
||||
</ShadowRect>
|
||||
|
||||
<ShadowRect>
|
||||
<div
|
||||
style="
|
||||
font-size: 20px;
|
||||
line-height: 1.5;
|
||||
line-height: 1.24;
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
padding-right: 8px;
|
||||
padding:5px 8px 5px 0;
|
||||
letter-spacing: 3px;
|
||||
">
|
||||
<p style="margin: 0; line-height: inherit">二氧化硫</p>
|
||||
@ -69,7 +69,7 @@
|
||||
">
|
||||
颗粒物浓度
|
||||
</span>
|
||||
<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.dust_float ? (Number(exhaustGasInfo.dust_float)).toFixed(2) : ''}}mg/m³</span>
|
||||
<span style="font-size: 20px; line-height: 1.24; flex: 1.2">{{exhaustGasInfo?.dust_float ? (Number(exhaustGasInfo.dust_float)).toFixed(2) : ''}}mg/m³</span>
|
||||
</ShadowRect>
|
||||
</div>
|
||||
<KilnLine :horizontal="true" />
|
||||
|
@ -6,7 +6,7 @@
|
||||
class="KilnDataBoard"
|
||||
style="
|
||||
position: absolute;
|
||||
transform-origin: left top;
|
||||
transform-origin: 16px 8px;
|
||||
font-size: 16px;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
@ -110,7 +110,8 @@ export default {
|
||||
screenfull.toggle(this.$refs.kilnContainerB)
|
||||
},
|
||||
resetSize() {
|
||||
let kilnContainerBox = document.querySelector('#kilnContainer')
|
||||
let kilnContainerBox = document.getElementById('kilnContainer')
|
||||
console.log(kilnContainerBox)
|
||||
let rw = parseFloat(window.innerWidth)
|
||||
let rh = parseFloat(window.innerHeight)
|
||||
let bw = parseFloat(kilnContainerBox.style.width)
|
||||
|
@ -25,7 +25,7 @@ export default {
|
||||
headerBGC: 'rgba(32, 55, 96, 0.8)',
|
||||
oddRowBGC: 'rgba(32, 55, 96, 0.8)',
|
||||
evenRowBGC: 'rgba(14, 32, 62, 0.8)',
|
||||
columnWidth: [155, 180, 150],
|
||||
columnWidth: [155, 160, 150],
|
||||
data: [],
|
||||
rowNum: 6
|
||||
}
|
||||
@ -33,34 +33,24 @@ export default {
|
||||
},
|
||||
mounted() {},
|
||||
watch:{
|
||||
order: {
|
||||
handler(newVal, oldVal) {
|
||||
order:{
|
||||
handler() {
|
||||
let outArr = this.order.map((item) => [
|
||||
formatDate(item.planStartTime) || '',
|
||||
formatDate(item.planStartTime) || '',
|
||||
`<span title=${item.customerName || ''}>${item.customerName || ''}</span>`,
|
||||
`<span title=${item.specifications || ''}>${item.specifications || ''}</span>`,
|
||||
`<span style="display:inline-block;width:40px;">${item.completeRate?(item.completeRate*100).toFixed(2)+'%':'0%'}</span>
|
||||
<div class="box" style="display:inline-block;">
|
||||
<div class="bg"></div>
|
||||
<div class="rount" style="-webkit-transform:rotate(${(item.completeRate?(item.completeRate*100).toFixed(2):0)<=50?3.6*item.completeRate*100:180}deg)"></div>
|
||||
<div class="bg2"></div>
|
||||
<div style="${item.completeRate*100>50?'display:block;-webkit-transform:rotate('+3.6*(item.completeRate*100-50)+'deg)':'display:none;'}" class="rount2"></div>
|
||||
`<span style="display:inline-block;width:60px;">${item.completeRate?(item.completeRate*100).toFixed(2)+'%':'0%'}</span>
|
||||
<div style="display:inline-block;height:20px;margin-top:-5px;vertical-align:middle;">
|
||||
<svg xmlns="http://www.w3.org/200/svg" height="20" width="20">
|
||||
<circle cx="10" cy="10" r="6" fill="none" stroke="#283851" stroke-width="4" stroke-linecap="round"/>
|
||||
<circle style="transform-origin: center;transform: rotate(-90deg);" id="J_progress_bar" cx="10" cy="10" r="6" fill="none" stroke="#47FF27" stroke-width="4" stroke-dasharray="${item.completeRate?item.completeRate.toFixed(2)*37.68+','+((1-item.completeRate.toFixed(2))*37.68):(0+','+37.68)}"/>
|
||||
</svg>
|
||||
</div>`
|
||||
]);
|
||||
this.config.data = outArr
|
||||
this.$refs['orderScrollBoard'].updateRows(outArr)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.orderContainer {
|
||||
.box{width:16px;height:12px;margin:1px auto;position:relative;}
|
||||
.box div{position:absolute;top:0;left:0;border-radius:50%;height:16px;width:16px;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;}
|
||||
.box .bg{border:silver 4px solid}
|
||||
.box .bg2{border:silver 4px solid;clip:rect(0,8px,20px,0);}
|
||||
.box .rount{border:#47FF27 4px solid;clip:rect(0,8px,24px,0);-webkit-transform:rotate(0deg);}
|
||||
.box .rount2{border:#47FF27 4px solid;clip:rect(0,40px,40px,8px);-webkit-transform:rotate(0deg);display:none}
|
||||
}
|
||||
</style>
|
||||
</script>
|
@ -107,7 +107,7 @@ export default {
|
||||
screenfull.toggle(this.$refs.wholePlantContainerB)
|
||||
},
|
||||
resetSize() {
|
||||
let wholePlantContainerBox = document.querySelector('#wholePlantContainer')
|
||||
let wholePlantContainerBox = document.getElementById('wholePlantContainer')
|
||||
let rw = parseFloat(window.innerWidth)
|
||||
let rh = parseFloat(window.innerHeight)
|
||||
let bw = parseFloat(wholePlantContainerBox.style.width)
|
||||
|
Loading…
Reference in New Issue
Block a user