Reviewed-on: http://git.picaiba.com/mt-fe-group/yudao-dev/pulls/294pull/311/head
@@ -2,7 +2,7 @@ | |||
* @Author: zwq | |||
* @Date: 2021-07-19 15:18:30 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2024-03-28 15:28:07 | |||
* @LastEditTime: 2024-03-29 16:49:00 | |||
* @Description: | |||
--> | |||
<template> | |||
@@ -16,11 +16,11 @@ | |||
许昌安彩AGV原片周转看板 | |||
<h3 class="unit">单位:河南汇融数字科技有限公司</h3> | |||
<h3 class="time">{{ times }}</h3> | |||
<el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px', fontSize: '32px' }" | |||
<!-- <el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px', fontSize: '32px' }" | |||
@click="changeFullScreen"> | |||
<svg-icon width="32" height="32" v-if="isFullScreen" icon-class="unFullScreenView" /> | |||
<svg-icon width="32" height="32" v-else icon-class="fullScreenView" /> | |||
</el-button> | |||
</el-button> --> | |||
</el-row> | |||
<el-row class="container-main flex-col" type="flex"> | |||
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15 * beilv" type="flex" class="flex-1"> | |||
@@ -35,13 +35,15 @@ | |||
<base-container :beilv="1" :size="'eqStatus'" :title="'周转进度'" :title-icon="'order'" :back="'energy'"> | |||
<div class="order" style="width:100%; overflow: hidden scroll;height: 350px;"> | |||
<el-row v-for="op in orderProcessList" :key="op.id" style="margin-bottom: 1em"> | |||
<p v-if="op.outRate === 1" class="now-secondary-title" style="color:#4679FD"> | |||
<!-- <p v-if="op.outRate === 1" class="now-secondary-title" | |||
style="font-size: 14px; opacity: calc(.6);color:#4679FD"> | |||
<i class="el-icon-check" /> | |||
{{ op.name }} | |||
</p> | |||
<p v-else class="now-secondary-title">{{ op.name }}</p> | |||
<el-progress :stroke-width="10" define-back-color="rgba(32, 57, 96, 1)" text-color="white" | |||
:percentage="op.outRate * 100" class="custom-progress-bar" /> | |||
</p> --> | |||
<!-- <p class="now-secondary-title">{{ op.name }}</p> --> | |||
<p class="now-secondary-title" style="font-size: 14px;opacity: calc(.6);">{{ op.name }}</p> | |||
<el-progress style="width: 910px;" text-color="rgba(255, 255, 255, .6)" :stroke-width="10" | |||
define-back-color="rgba(32, 57, 96, 1)" :percentage="op.outRate * 100" class="custom-progress-bar" /> | |||
</el-row> | |||
</div> | |||
</base-container> | |||
@@ -496,7 +498,7 @@ export default { | |||
seconds = "0" + seconds; | |||
} | |||
//拼接格式化当前时间 | |||
this.times = year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds; | |||
this.times = year + "." + month + "." + day + " " + hours + ":" + minutes + ":" + seconds; | |||
}, | |||
windowWidth(value) { | |||
this.clientWidth = value | |||
@@ -530,11 +532,6 @@ export default { | |||
</script> | |||
<style lang="scss" scoped> | |||
.visual-container { | |||
width: 1920px; | |||
height: 1080px; | |||
@@ -556,7 +553,7 @@ export default { | |||
top: 25px; | |||
color: rgba(255, 255, 255, 0.80); | |||
font-size: 20px; | |||
letter-spacing: 0px; | |||
letter-spacing: 1px; | |||
} | |||
.time { | |||
position: absolute; | |||
@@ -564,7 +561,7 @@ export default { | |||
top: 25px; | |||
color: rgba(255, 255, 255, 0.80); | |||
font-size: 20px; | |||
letter-spacing: 0px; | |||
letter-spacing: .72px; | |||
} | |||
.title-button { | |||
color: #00fff0; | |||
@@ -607,6 +604,12 @@ export default { | |||
::v-deep .el-progress-bar__inner { | |||
background-color: unset; | |||
background-image: linear-gradient(to right, #4573fe, #47f8dc); | |||
} | |||
::v-deep .el-progress__text { | |||
margin-top: -70px; | |||
margin-left: 820px; | |||
// background-color: unset; | |||
// background-image: linear-gradient(to right, #4573fe, #47f8dc); | |||
} | |||
.visual-select { | |||
position: absolute; | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-01-29 16:50:26 | |||
* @LastEditTime: 2024-03-28 16:35:49 | |||
* @LastEditTime: 2024-03-29 16:51:53 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -17,11 +17,11 @@ | |||
许昌安彩冷端看板 | |||
<h3 class="unit">单位:河南汇融数字科技有限公司</h3> | |||
<h3 class="time">{{ times }}</h3> | |||
<el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px',fontSize:'32px'}" | |||
<!-- <el-button type="text" class="title-button" :style="{ right: 18 + 'px', top: 26 + 'px',fontSize:'32px'}" | |||
@click="changeFullScreen"> | |||
<svg-icon width="32" height="32" v-if="isFullScreen" icon-class="unFullScreenView" /> | |||
<svg-icon width="32" height="32" v-else icon-class="fullScreenView" /> | |||
</el-button> | |||
</el-button> --> | |||
</el-row> | |||
<el-row class="container-main flex-col" type="flex"> | |||
<el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15" type="flex" class="flex-1"> | |||
@@ -64,11 +64,11 @@ | |||
</div> --> | |||
<!-- <el-row :gutter="9"> --> | |||
<!-- <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="24"> --> | |||
<pile-bar-chart style="margin-bottom: -15px" ref="firstPileChart" :height="90" /> | |||
<second-pile-bar-chart style="margin-bottom: -15px" id=" 'second' " ref="secondPileChart" :height="90" /> | |||
<third-pile-bar-chart style="margin-bottom: -15px" id=" 'third' " ref="thirdPileChart" :height="90" /> | |||
<fourth-pile-bar-chart style="margin-bottom: -15px" id=" 'fourth' " ref="fourthPileChart" :height="90" /> | |||
<fifth-pile-bar-chart style="margin-bottom: -15px" id=" 'fifth' " ref="fifthPileChart" :height="100" /> | |||
<pile-bar-chart style="margin-top: -5px;" ref="firstPileChart" :height="80" /> | |||
<second-pile-bar-chart id=" 'second' " ref="secondPileChart" :height="90" /> | |||
<third-pile-bar-chart id=" 'third' " ref="thirdPileChart" :height="90" /> | |||
<fourth-pile-bar-chart id=" 'fourth' " ref="fourthPileChart" :height="90" /> | |||
<fifth-pile-bar-chart style="margin-top: -5px;" id=" 'fifth' " ref="fifthPileChart" :height="100" /> | |||
<!-- <pile-bar-chart ref="secondPileChart" | |||
:height="90" /> | |||
<pile-bar-chart ref="thirdPileChart" | |||
@@ -320,7 +320,7 @@ export default { | |||
let productList = [] | |||
let wasteList = [] | |||
let yieldList = [] | |||
// let sumAreaList = [] | |||
let sumAreaList = [] | |||
// let yieldList = [] | |||
// this.cutTableDataList = | |||
let coldDetData = [ | |||
@@ -377,22 +377,25 @@ export default { | |||
] | |||
coldDetData.forEach((ele, index) => { | |||
nameList.push(ele.lineName) | |||
topNameList.push('产线: ' + ele.lineName + ' ' + '总面积:' + ele.sumArea) | |||
topNameList.push('产线: ' + ele.lineName + ' ' + '总面积:' + ele.sumArea + '㎡') | |||
productList.push(ele.productArea) | |||
wasteList.push(ele.wastArea) | |||
nameWasteList.push('缺陷面积:' + ele.wastArea) | |||
yieldList.push({ | |||
name: '良品', | |||
yield:ele.yield | |||
}) | |||
// sumAreaList.push(ele.sumArea) | |||
// yieldList.push((ele.yield * 100).toFixed(3)) | |||
nameWasteList.push('缺陷面积:' + ele.wastArea + '㎡') | |||
// yieldList.push({ | |||
// name: '良品', | |||
// yield:ele.yield | |||
// }) | |||
sumAreaList.push(ele.sumArea) | |||
yieldList.push((ele.yield * 100).toFixed(3)) | |||
}) | |||
this.$nextTick(() => { | |||
this.$refs.productChart.initChart(nameList, yieldList, sumAreaList) | |||
this.$refs.firstPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.secondPileChart.initChart(nameList, [topNameList[1]], [nameWasteList[1]], [productList[1]], [wasteList[1]]) | |||
this.$refs.thirdPileChart.initChart(nameList, [topNameList[2]], [nameWasteList[2]], [productList[2]], [wasteList[2]]) | |||
this.$refs.fourthPileChart.initChart(nameList, [topNameList[3]], [nameWasteList[3]], [productList[3]], [wasteList[3]]) | |||
this.$refs.fifthPileChart.initChart(nameList, [topNameList[4]], [nameWasteList[4]], [productList[4]], [wasteList[4]]) | |||
}) | |||
this.$refs.firstPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.secondPileChart.initChart(nameList, [topNameList[1]], [nameWasteList[1]], [productList[1]], [wasteList[1]]) | |||
this.$refs.thirdPileChart.initChart(nameList, [topNameList[2]], [nameWasteList[2]], [productList[2]], [wasteList[2]]) | |||
this.$refs.fourthPileChart.initChart(nameList, [topNameList[3]], [nameWasteList[3]], [productList[3]], [wasteList[3]]) | |||
this.$refs.fifthPileChart.initChart(nameList, [topNameList[4]], [nameWasteList[4]], [productList[4]], [wasteList[4]]) | |||
// this.$refs.productChart.initChart(nameList, yieldList, sumAreaList) | |||
this.getTimes() | |||
// console.log(moment(this.logoutTime - 28800000).format('HH:mm:ss')); | |||
@@ -414,39 +417,39 @@ export default { | |||
} | |||
}, | |||
methods: { | |||
// getData() { | |||
// let detData = [ | |||
// { | |||
// name: '1', | |||
// run: '运行', | |||
// }, | |||
// { | |||
// name: '2', | |||
// run: '未运行', | |||
// }, | |||
// { | |||
// name: '3', | |||
// run: '运行', | |||
// }, | |||
// { | |||
// name: '4', | |||
// run: '未运行', | |||
// }, | |||
// { | |||
// name: '1', | |||
// run: '运行', | |||
// }, | |||
// ] | |||
// this.realEqList = detData.map((item, index) => [ | |||
// // console.log(item) | |||
// `<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''} | |||
// </span>`, | |||
// `<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`, | |||
// `<span style="color:rgba(255,255,255,0.5)"><div style="${item.run == '运行' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:10px 10px 0 0 '}"></div> ${item.run || ''}</span>`, | |||
// ]) | |||
// this.realEqConfig.data = this.realEqList | |||
// this.$refs['realEqScrollBoard'].updateRows(this.realEqList) | |||
// }, | |||
getData() { | |||
let detData = [ | |||
{ | |||
name: '1', | |||
run: '运行', | |||
}, | |||
{ | |||
name: '2', | |||
run: '未运行', | |||
}, | |||
{ | |||
name: '3', | |||
run: '运行', | |||
}, | |||
{ | |||
name: '4', | |||
run: '未运行', | |||
}, | |||
{ | |||
name: '1', | |||
run: '运行', | |||
}, | |||
] | |||
this.realEqList = detData.map((item, index) => [ | |||
// console.log(item) | |||
`<span style="color:rgba(255,255,255,0.5)" >${index + 1 || ''} | |||
</span>`, | |||
`<span style="color:rgba(255,255,255,0.5)">${item.name || ''}</span>`, | |||
`<span style="color:rgba(255,255,255,0.5)"><div style="${item.run == '运行' ? 'box-shadow: 0px 0px 2px 1px #2760FF;width:6px;height:6px;border-radius: 50%;background-color: #2760FF;float:left;margin:10px 10px 0 0 ' : 'box-shadow: 0px 0px 2px 1px #FFBD02;width:6px;height:6px;border-radius: 50%; background-color: #FFBD02;float:left;margin:10px 10px 0 0 '}"></div> ${item.run || ''}</span>`, | |||
]) | |||
this.realEqConfig.data = this.realEqList | |||
this.$refs['realEqScrollBoard'].updateRows(this.realEqList) | |||
}, | |||
CutWebsocketClose(e) { | |||
this.Cutws.ws.onclose = (event) => { console.log(event );} | |||
}, | |||
@@ -495,7 +498,7 @@ export default { | |||
seconds = "0" + seconds; | |||
} | |||
//拼接格式化当前时间 | |||
this.times = year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds; | |||
this.times = year + "." + month + "." + day + " " + hours + ":" + minutes + ":" + seconds; | |||
}, | |||
SJGInitWebSocket() { | |||
let date = new Date().valueOf() | |||
@@ -525,10 +528,9 @@ export default { | |||
]) | |||
} | |||
this.realEqConfig.data = this.realEqList | |||
this.$nextTick(() => { | |||
// this.$nextTick(() => { | |||
this.$refs['realEqScrollBoard'].updateRows(this.realEqList) | |||
}) | |||
// }) | |||
}; | |||
// if (typeof (WebSocket) === 'undefined') { | |||
// alert('您的浏览器不支持WebSocket') | |||
@@ -572,7 +574,11 @@ export default { | |||
<div style = "${(item.product * 100).toFixed(2) < 91 ? 'display:block; color:rgba(255, 209, 96, 1)' : 'display:none;'}">${(item.product * 100).toFixed(2) + '%' || ''}</div>` | |||
]) | |||
this.cutConfig.data = cutArr | |||
this.$refs['cutScrollBoard'].updateRows(cutArr) | |||
// this.$nextTick(() => { | |||
this.$refs['cutScrollBoard'].updateRows(cutArr) | |||
// }) | |||
// this.cutConfig.data = cutArr | |||
// this.$refs['cutScrollBoard'].updateRows(cutArr) | |||
} else if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'chart' && this.cutWsData.dateType === 'day') { | |||
let nameList = [] | |||
let nameWasteList = [] | |||
@@ -584,19 +590,21 @@ export default { | |||
// this.cutTableDataList = | |||
this.cutWsData.coldDetData.forEach((ele, index) => { | |||
nameList.push(ele.lineName) | |||
topNameList.push('产线: ' + ele.lineName + ' ' + '总面积:' + ele.sumArea) | |||
topNameList.push('产线: ' + ele.lineName + ' ' + '总面积:' + ele.sumArea + '㎡') | |||
productList.push(ele.productArea) | |||
wasteList.push(ele.wastArea) | |||
nameWasteList.push('缺陷面积:' + ele.wastArea) | |||
nameWasteList.push('缺陷面积:' + ele.wastArea + '㎡') | |||
sumAreaList.push(ele.sumArea) | |||
yieldList.push(parseFloat((ele.yield * 100).toFixed(3))) | |||
}) | |||
this.$refs.firstPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.secondPileChart.initChart(nameList, [topNameList[1]], [nameWasteList[1]], [productList[1]], [wasteList[1]]) | |||
this.$refs.thirdPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.fourthPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.fifthPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.productChart.initChart(nameList, yieldList, sumAreaList) | |||
this.$nextTick(() => { | |||
this.$refs.firstPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.secondPileChart.initChart(nameList, [topNameList[1]], [nameWasteList[1]], [productList[1]], [wasteList[1]]) | |||
this.$refs.thirdPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.fourthPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.fifthPileChart.initChart(nameList, [topNameList[0]], [nameWasteList[0]], [productList[0]], [wasteList[0]]) | |||
this.$refs.productChart.initChart(nameList, yieldList, sumAreaList) | |||
}) | |||
} | |||
}; | |||
// if (typeof (WebSocket) === 'undefined') { | |||
@@ -642,7 +650,9 @@ export default { | |||
]) | |||
} | |||
this.annealFunConfig.data = arr | |||
this.$refs['annealFunScrollBoard'].updateRows(arr) | |||
// this.$nextTick(() => { | |||
this.$refs['annealFunScrollBoard'].updateRows(arr) | |||
// }) | |||
} | |||
if (this.funWsData.type === 'FanInfo') { | |||
let arr = [] | |||
@@ -657,7 +667,9 @@ export default { | |||
]) | |||
} | |||
this.funConfig.data = arr | |||
this.$refs['funScrollBoard'].updateRows(arr) | |||
// this.$nextTick(() => { | |||
this.$refs['funScrollBoard'].updateRows(arr) | |||
// }) | |||
} | |||
}; | |||
// if (typeof (WebSocket) === 'undefined') { | |||
@@ -794,7 +806,7 @@ export default { | |||
top: 25px; | |||
color: rgba(255, 255, 255, 0.80); | |||
font-size: 20px; | |||
letter-spacing: 0px; | |||
letter-spacing: 1px; | |||
} | |||
.time { | |||
@@ -803,7 +815,7 @@ export default { | |||
color: rgba(255, 255, 255, 0.80); | |||
top: 25px; | |||
font-size: 20px; | |||
letter-spacing: 0px; | |||
letter-spacing: .72px; | |||
} | |||
.title-button { | |||
@@ -2,7 +2,7 @@ | |||
* @Author: zwq | |||
* @Date: 2022-01-21 14:43:06 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2024-03-28 16:45:24 | |||
* @LastEditTime: 2024-03-29 14:50:50 | |||
* @Description: | |||
--> | |||
<template> | |||
@@ -158,6 +158,9 @@ export default { | |||
methods: { | |||
initChart() { | |||
this.chart = echarts.init(document.getElementById(this.id)) | |||
this.$nextTick(() => { | |||
this.chart.resize(); | |||
}); | |||
this.chart.setOption({ | |||
title: this.showCenterTitle | |||
? { | |||
@@ -2,7 +2,7 @@ | |||
* @Author: gtz | |||
* @Date: 2022-01-19 15:58:17 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2024-03-27 10:26:35 | |||
* @LastEditTime: 2024-03-29 14:47:29 | |||
* @Description: file content | |||
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseContainer\index.vue | |||
--> | |||
@@ -164,7 +164,7 @@ export default { | |||
width: 100%; | |||
// background-color: rgba($color: #061027, $alpha: 0.15); | |||
position: relative; | |||
opacity: calc(.8); | |||
// opacity: calc(.8); | |||
// border: 2px solid; | |||
// background: url('../../../../assets/img/energy.png') no-repeat; | |||
// background-size: 100% 100%; | |||
@@ -274,6 +274,8 @@ export default { | |||
width: 100%; | |||
color: #ffffff; | |||
font-size: 24px; | |||
font-weight: normal; | |||
letter-spacing: .8px; | |||
padding: 0.67em 0.67em 0.3em 0.67em; | |||
display: flex; | |||
} | |||
@@ -2,7 +2,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2023-09-21 09:06:28 | |||
* @LastEditTime: 2024-03-25 18:34:58 | |||
* @LastEditTime: 2024-03-29 16:25:59 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -71,9 +71,9 @@ export default { | |||
mounted() { | |||
console.log('mounted') | |||
console.log('borderRadius: ', this.borderRadius) | |||
// this.$nextTick(() => { | |||
// this.initChart() | |||
// }) | |||
this.$el.addEventListener('resize', () => { | |||
console.log('resziing.....'); | |||
}); | |||
}, | |||
beforeDestroy() { | |||
if (!this.chart) { | |||
@@ -114,6 +114,7 @@ export default { | |||
name: '产线良品率', | |||
symbol: 'circle', //变为实心圆 | |||
type: 'line', | |||
// symbolSize: 7, | |||
yAxisIndex: 0, | |||
areaStyle: { | |||
opacity: 0.8, | |||
@@ -141,6 +142,16 @@ export default { | |||
] | |||
// const colors = ['#5470C6', '#91CC75', '#EE6666'] | |||
this.chart = echarts.init(document.getElementById(this.id)) | |||
let isFinished = false //标记 isFinished | |||
this.chart.on('finished', _ => { | |||
if (!isFinished) { | |||
console.log('我只执行一次') | |||
isFinished = true | |||
// this.isLoading = false //关闭loading | |||
this.chart.resize() //重新渲染charts大小 | |||
} | |||
console.log(113, 'finished') | |||
}) | |||
this.chart.setOption({ | |||
// color: colors, | |||
tooltip: { | |||
@@ -151,22 +162,33 @@ export default { | |||
}, | |||
grid: { | |||
left: "3%", | |||
right: "5%", | |||
right: "10%", | |||
bottom: "3%", | |||
containLabel: true | |||
}, | |||
legend: { | |||
itemWidth: 10, | |||
itemHeight: 10, | |||
top: '20', | |||
// right: '20px', | |||
data: ['产线产量', '产线良品率'], | |||
top: '5', | |||
right: '20px', | |||
data: [ | |||
// { icon: 'rect', name: '直接访问' }, | |||
{ icon: 'roundRect', name: '产线产量' }, | |||
{ | |||
icon: 'circle', name: '产线良品率', | |||
itemWidth: 7, | |||
itemHeight: 7, | |||
}, | |||
], | |||
textStyle: { | |||
fontSize: 12 * this.beilv, | |||
color: '#ced1d5' | |||
} | |||
}, | |||
xAxis: { | |||
axisTick: { | |||
show: false | |||
}, | |||
type: 'category', | |||
axisLine: { | |||
lineStyle: { | |||
@@ -202,7 +224,7 @@ export default { | |||
type: 'value', | |||
name: '良品率/%', | |||
nameTextStyle: {// y轴上方单位的颜色 | |||
color: '#fff', | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
align: "left", | |||
}, | |||
position: 'right', | |||
@@ -245,7 +267,7 @@ export default { | |||
type: 'value', | |||
name: '产量/㎡', // y轴上方的单位 | |||
nameTextStyle: { | |||
color: "#fff", | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
// fontSize: 10, | |||
align: "right", | |||
}, | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2023-09-21 09:06:28 | |||
* @LastEditTime: 2024-03-28 16:31:20 | |||
* @LastEditTime: 2024-03-29 16:26:28 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -106,7 +106,8 @@ export default { | |||
position: 'top', //在上方显示 | |||
textStyle: { //数值样式 | |||
color: '#ced1d5', | |||
fontSize: 12 | |||
fontSize: 12, | |||
fontWight:'bolder' | |||
} | |||
}, | |||
} | |||
@@ -142,7 +143,7 @@ export default { | |||
} | |||
}, | |||
// data: passRateList | |||
data: [] | |||
data: passRateList | |||
} | |||
] | |||
// const colors = ['#5470C6', '#91CC75', '#EE6666'] | |||
@@ -166,7 +167,7 @@ export default { | |||
type: 'cross' | |||
} | |||
}, | |||
grid: { top: 90, right: 60, bottom: 20, left: 20, containLabel: true }, | |||
grid: { top: 90, right: 70, bottom: 20, left: 20, containLabel: true }, | |||
legend: { | |||
itemWidth: 10, | |||
itemHeight: 10, | |||
@@ -175,10 +176,14 @@ export default { | |||
data: ['产线产量', '产线良品率'], | |||
textStyle: { | |||
fontSize: 12 * this.beilv, | |||
color: '#ced1d5' | |||
color: '#ced1d5', | |||
fontWight: 'bolder' | |||
} | |||
}, | |||
xAxis: { | |||
axisTick: { | |||
show: false | |||
}, | |||
type: 'category', | |||
axisLine: { | |||
lineStyle: { | |||
@@ -187,8 +192,11 @@ export default { | |||
width: '1' // 坐标线的宽度 | |||
} | |||
}, | |||
textStyle: { | |||
fontWight: 'bolder' | |||
}, | |||
axisLabel: { | |||
color: "#fff", | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
fontSize: 12, | |||
// formatter: '{value}' | |||
// textStyle: { | |||
@@ -217,7 +225,7 @@ export default { | |||
type: 'value', | |||
name: '良品率/%', | |||
nameTextStyle: {// y轴上方单位的颜色 | |||
color: '#fff', | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
align: "left", | |||
}, | |||
position: 'right', | |||
@@ -231,7 +239,7 @@ export default { | |||
} | |||
}, | |||
axisLabel: { | |||
color: "#fff", | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
fontSize: 12, | |||
// formatter: '{value}' | |||
formatter: '{value}%' | |||
@@ -261,7 +269,7 @@ export default { | |||
type: 'value', | |||
name: '产量/片', // y轴上方的单位 | |||
nameTextStyle: { | |||
color: "#fff", | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
// fontSize: 10, | |||
align: "right", | |||
}, | |||
@@ -278,7 +286,7 @@ export default { | |||
axisLabel: { | |||
// textStyle: { | |||
// color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
color: "#fff", | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
// show: true, | |||
lineStyle: { | |||
color: "#25528f", | |||
@@ -111,8 +111,9 @@ export default { | |||
show: true, //开启显示 | |||
position: 'top', //在上方显示 | |||
textStyle: { //数值样式 | |||
color: '#ced1d5', | |||
fontSize: 12 | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
fontSize: 12, | |||
fontWeight: 'bolder' | |||
} | |||
}, | |||
} | |||
@@ -144,6 +145,9 @@ export default { | |||
// } | |||
// }, | |||
xAxis: { | |||
axisTick: { | |||
show: false | |||
}, | |||
type: 'category', | |||
axisLine: { | |||
lineStyle: { | |||
@@ -152,8 +156,11 @@ export default { | |||
width: '1' // 坐标线的宽度 | |||
} | |||
}, | |||
textStyle: { | |||
fontWeight: 'bolder' | |||
}, | |||
axisLabel: { | |||
color: "#fff", | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
fontSize: 12, | |||
// formatter: '{value}' | |||
}, | |||
@@ -167,13 +174,13 @@ export default { | |||
yAxis: { | |||
name: '单位kwh', | |||
nameTextStyle: { | |||
color: '#fff', | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
fontSize: 10, | |||
align: 'right', | |||
}, | |||
type: 'value', | |||
axisLabel: { | |||
color: "#fff", | |||
color: 'rgba(255,255,255,0.5)', // 坐标值得具体的颜色 | |||
fontSize: 12, | |||
// formatter: '{value}/kwh' | |||
}, | |||
@@ -1,13 +1,13 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2023-12-27 13:54:52 | |||
* @LastEditTime: 2024-03-28 16:30:14 | |||
* @LastEditTime: 2024-03-29 16:50:47 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div> | |||
<div :id="id" class="productChart" :style="{ height: height + 'px', width: width }" /> | |||
<div :id="id" class="productChart" :style="{ height:'80px', width: width }" /> | |||
</div> | |||
</template> | |||
@@ -106,7 +106,6 @@ export default { | |||
} | |||
// } | |||
console.log('total', totalData) | |||
this.chart = echarts.init(document.getElementById(this.id)) | |||
const series = [ | |||
'良品', | |||
'废品', | |||
@@ -137,6 +136,17 @@ export default { | |||
// width, | |||
// height | |||
// }) | |||
this.chart = echarts.init(document.getElementById(this.id)) | |||
let isFinished = false //标记 isFinished | |||
this.chart.on('finished', _ => { | |||
if (!isFinished) { | |||
console.log('我只执行一次') | |||
isFinished = true | |||
// this.isLoading = false //关闭loading | |||
this.chart.resize() //重新渲染charts大小 | |||
} | |||
console.log(113, 'finished') | |||
}) | |||
this.chart.setOption({ | |||
legend: { | |||
formatter: function (name) { | |||
@@ -152,7 +162,8 @@ export default { | |||
left: '20', | |||
icon: 'rect', | |||
textStyle: { | |||
color: '#ffffff' | |||
color: 'rgba(255,255,255,.6)', | |||
fontSize:12, | |||
} | |||
}, | |||
grid: { | |||
@@ -184,9 +195,9 @@ export default { | |||
splitNumber: 50, | |||
// boundaryGap: [20, 20], | |||
textStyle: { | |||
color: '#ffffff', | |||
color: 'rgba(255,255,255,.6)', | |||
verticalAlign: 'bottom', | |||
fontSize: 12, | |||
fontSize: 16, | |||
align: 'left', | |||
padding: [0, 0, 10, -5] | |||
} | |||
@@ -212,9 +223,9 @@ export default { | |||
splitNumber: 50, | |||
// boundaryGap: [20, 20], | |||
textStyle: { | |||
color: '#ffffff', | |||
color: 'rgba(255,255,255,.6)', | |||
verticalAlign: 'bottom', | |||
fontSize: 12, | |||
fontSize: 16, | |||
align: 'right', | |||
padding: [0, 0, 10, -5] | |||
} | |||
@@ -4,7 +4,8 @@ | |||
<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" @headBtnClick="buttonClick" /> | |||
<!-- 列表 --> | |||
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" :table-data="tableData"> | |||
<base-table :max-height="tableH" :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" | |||
:table-data="tableData"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right" :method-list="tableBtn" | |||
@clickBtn="handleClick" /> | |||
</base-table> | |||
@@ -33,10 +34,10 @@ import { | |||
import basicPage from '../../mixins/basic-page'; | |||
import moment from 'moment'; | |||
import addOrUpdate from './dialogForm.vue'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
export default { | |||
name: 'QualityInspectionBoxBtn', | |||
mixins: [basicPage], | |||
mixins: [basicPage, tableHeightMixin], | |||
components: { addOrUpdate }, | |||
data() { | |||
return { | |||
@@ -114,7 +115,7 @@ export default { | |||
// 查询参数 | |||
listQuery: { | |||
pageNo: 1, | |||
pageSize: 10, | |||
pageSize: 20, | |||
inspectionDetContent: null, | |||
}, | |||
addOrUpdateVisible: false, | |||
@@ -4,7 +4,8 @@ | |||
<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" @headBtnClick="buttonClick" /> | |||
<!-- 列表 --> | |||
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" :table-data="tableData"> | |||
<base-table :max-height="tableH" :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" | |||
:table-data="tableData"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right" :method-list="tableBtn" | |||
@clickBtn="handleClick" /> | |||
</base-table> | |||
@@ -34,10 +35,11 @@ import basicPage from './basic-page'; | |||
import moment from 'moment'; | |||
import addOrUpdate from './dialogForm.vue'; | |||
import ProcessBomList from './ProcessBomList.vue'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
import row from './row.vue'; | |||
export default { | |||
name: 'QualityInspectionBoxBtn', | |||
mixins: [basicPage], | |||
mixins: [basicPage, tableHeightMixin], | |||
components: { addOrUpdate, ProcessBomList }, | |||
data() { | |||
return { | |||
@@ -123,7 +125,7 @@ export default { | |||
// 查询参数 | |||
listQuery: { | |||
pageNo: 1, | |||
pageSize: 10, | |||
pageSize: 20, | |||
userName: null, | |||
nickName:null | |||
}, | |||
@@ -1,7 +1,7 @@ | |||
<template> | |||
<div class="app-container"> | |||
<search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | |||
<base-table v-loading="dataListLoading" :table-props="tableProps" :page="listQuery.pageNo" | |||
<base-table :max-height="tableH" v-loading="dataListLoading" :table-props="tableProps" :page="listQuery.pageNo" | |||
:limit="listQuery.pageSize" :table-data="tableData"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" :width="120" label="操作" :method-list="tableBtn" | |||
@clickBtn="handleClick" /> | |||
@@ -29,6 +29,7 @@ import { | |||
deleteQualityHotMaterial, | |||
getHotMaterialAllList | |||
} from '@/api/base/qualityHotMaterial'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
// import { getList, } from "@/api/base/qualityScrapType"; | |||
const tableProps = [ | |||
{ | |||
@@ -74,7 +75,7 @@ const tableProps = [ | |||
]; | |||
export default { | |||
mixins: [basicPage], | |||
mixins: [basicPage, tableHeightMixin], | |||
data() { | |||
return { | |||
urlOptions: { | |||
@@ -207,7 +208,7 @@ export default { | |||
switch (val.btnName) { | |||
case 'search': | |||
this.listQuery.pageNo = 1; | |||
this.listQuery.pageSize = 10; | |||
this.listQuery.pageSize = 20; | |||
this.listQuery.materialId = val.materialId ? val.materialId : undefined; | |||
this.listQuery.checkTime = val.checkTime ? val.checkTime : undefined; | |||
this.getDataList(); | |||
@@ -215,7 +216,7 @@ export default { | |||
case 'reset': | |||
this.$refs.searchBarForm.resetForm(); | |||
this.listQuery = { | |||
pageSize: 10, | |||
pageSize: 20, | |||
pageNo: 1, | |||
total: 1, | |||
}; | |||
@@ -4,7 +4,7 @@ | |||
<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" @headBtnClick="handleSearchBarBtnClick" /> | |||
<!-- 列表 --> | |||
<base-table :table-props="tableProps" :page="queryParams.pageNo" :limit="queryParams.pageSize" :table-data="list" | |||
<base-table :max-height="tableH" :table-props="tableProps" :page="queryParams.pageNo" :limit="queryParams.pageSize" :table-data="list" | |||
@emitFun="handleEmitFun"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right" :method-list="tableBtn" | |||
@clickBtn="handleTableBtnClick" /> | |||
@@ -59,14 +59,14 @@ import { | |||
getQualityInspectionDetPage, | |||
exportQualityInspectionDetExcel, | |||
} from '@/api/base/qualityInspectionDet'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
import moment from 'moment'; | |||
import basicPageMixin from '@/mixins/lb/basicPageMixin'; | |||
export default { | |||
name: 'QualityInspectionDet', | |||
mixins: [basicPageMixin], | |||
mixins: [basicPageMixin, tableHeightMixin], | |||
data() { | |||
return { | |||
typeList: [], // 检测类型列表 | |||
@@ -153,7 +153,7 @@ export default { | |||
// 查询参数 | |||
queryParams: { | |||
pageNo: 1, | |||
pageSize: 10, | |||
pageSize: 20, | |||
content: null, | |||
createTime: [], | |||
}, | |||
@@ -4,8 +4,8 @@ | |||
<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" @headBtnClick="handleSearchBarBtnClick" /> | |||
<!-- 列表 --> | |||
<base-table :table-props="tableProps" :page="queryParams.pageNo" :limit="queryParams.pageSize" :table-data="list" | |||
@emitFun="handleEmitFun"> | |||
<base-table :max-height="tableH" :table-props="tableProps" :page="queryParams.pageNo" :limit="queryParams.pageSize" | |||
:table-data="list" @emitFun="handleEmitFun"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" :method-list="tableBtn" | |||
@clickBtn="handleTableBtnClick" /> | |||
</base-table> | |||
@@ -61,10 +61,10 @@ import { | |||
exportQualityInspectionTypeExcel, | |||
} from '@/api/base/qualityInspectionType'; | |||
import basicPageMixin from '@/mixins/lb/basicPageMixin'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
export default { | |||
name: 'QualityInspectionType', | |||
mixins: [basicPageMixin], | |||
mixins: [basicPageMixin, tableHeightMixin], | |||
data() { | |||
return { | |||
tableBtn: [ | |||
@@ -2,7 +2,7 @@ | |||
* @Author: zwq | |||
* @Date: 2023-08-01 14:55:51 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2024-03-25 16:07:07 | |||
* @LastEditTime: 2024-03-29 14:08:18 | |||
* @Description: | |||
--> | |||
<template> | |||
@@ -24,12 +24,12 @@ | |||
// import unitDict from './unitDict'; | |||
// import basicPage from '../mixins/basic-page'; | |||
import { parseTime } from '../mixins/code-filter'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
import { | |||
getMaterialUseLogPage, | |||
getWorkOrderList, | |||
exportEnergyPlcExcel | |||
} from '@/api/quality/materialTraceability'; | |||
const tableProps = [ | |||
{ | |||
prop: 'materialName', | |||
@@ -73,6 +73,7 @@ const tableProps = [ | |||
]; | |||
export default { | |||
mixins: [tableHeightMixin], | |||
// mixins: [basicPage], | |||
data() { | |||
return { | |||
@@ -82,7 +83,7 @@ export default { | |||
// // exportURL: exportPackingExcel, | |||
// }, | |||
tableProps, | |||
tableH: this.tableHeight(260), | |||
// tableH: this.tableHeight(260), | |||
tableBtn: [ | |||
this.$auth.hasPermi(`base:packaging-print-log:update`) | |||
? { | |||
@@ -174,9 +175,9 @@ export default { | |||
// AddOrUpdate, | |||
}, | |||
created() { | |||
window.addEventListener('resize', () => { | |||
this.tableH = this.tableHeight(260) | |||
}) | |||
// window.addEventListener('resize', () => { | |||
// this.tableH = this.tableHeight(260) | |||
// }) | |||
this.getList() | |||
this.getDict() | |||
}, | |||
@@ -2,7 +2,7 @@ | |||
* @Author: zwq | |||
* @Date: 2023-08-01 14:55:51 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2024-03-21 15:17:05 | |||
* @LastEditTime: 2024-03-29 14:08:30 | |||
* @Description: | |||
--> | |||
<template> | |||
@@ -25,6 +25,8 @@ | |||
// import basicPage from '../mixins/basic-page'; | |||
import { publicFormatter } from '@/utils/dict'; | |||
import { parseTime } from '../mixins/code-filter'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
import { | |||
getOriginalGlassRetrace, | |||
getWorkOrderList, | |||
@@ -85,6 +87,7 @@ const tableProps = [ | |||
export default { | |||
// mixins: [basicPage], | |||
mixins: [tableHeightMixin], | |||
data() { | |||
return { | |||
// urlOptions: { | |||
@@ -119,7 +122,7 @@ export default { | |||
startTime: undefined, | |||
endTime:undefined, | |||
}, | |||
tableH: this.tableHeight(260), | |||
// tableH: this.tableHeight(260), | |||
formConfig: [ | |||
{ | |||
type: 'select', | |||
@@ -184,9 +187,9 @@ export default { | |||
// AddOrUpdate, | |||
}, | |||
created() { | |||
window.addEventListener('resize', () => { | |||
this.tableH = this.tableHeight(260) | |||
}) | |||
// window.addEventListener('resize', () => { | |||
// this.tableH = this.tableHeight(260) | |||
// }) | |||
this.getList() | |||
this.getDict() | |||
}, | |||
@@ -2,13 +2,14 @@ | |||
* @Author: zwq | |||
* @Date: 2023-08-01 14:55:51 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2024-03-20 09:25:40 | |||
* @LastEditTime: 2024-03-29 15:32:33 | |||
* @Description: | |||
--> | |||
<template> | |||
<div class="app-container"> | |||
<search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | |||
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" :table-data="list"> | |||
<base-table :max-height="tableH" :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" | |||
:table-data="list"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" :width="120" label="操作" :method-list="tableBtn" | |||
@clickBtn="handleClick" /> | |||
</base-table> | |||
@@ -30,6 +31,7 @@ import { | |||
// exportEnergyPlcExcel | |||
} from '@/api/quality/processTraceability'; | |||
import { publicFormatter } from '@/utils/dict'; | |||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin'; | |||
const tableProps = [ | |||
{ | |||
prop: 'name', | |||
@@ -78,7 +80,7 @@ const tableProps = [ | |||
]; | |||
export default { | |||
// mixins: [basicPage], | |||
mixins: [tableHeightMixin], | |||
data() { | |||
return { | |||
// urlOptions: { | |||
@@ -1,14 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2023-11-09 16:32:21 | |||
* @LastEditTime: 2023-11-09 16:32:21 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2023-11-07 19:28:13 | |||
* @LastEditTime: 2023-11-08 14:11:43 | |||
* @LastEditTime: 2024-03-29 14:21:52 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -1,17 +1,10 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2023-11-28 10:41:50 | |||
* @LastEditTime: 2023-11-28 10:49:43 | |||
* @LastEditTime: 2024-03-29 14:14:13 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<!-- | |||
filename: index.vue | |||
author: liubin | |||
date: 2023-10-18 12:25:46 | |||
description: | |||
--> | |||
<template> | |||
<div class="app-container process-flow-view"> | |||
<ProcessInfo /> | |||