Compare commits

...

5 Commits

Author SHA1 Message Date
‘937886381’
5444ff92f7 解决冲突 2024-07-17 08:56:03 +08:00
‘937886381’
0713cb1650 修改bug 2024-07-17 08:53:32 +08:00
9da2e20b24 Merge pull request '生产数据echarts图重写' (#99) from projects/mescc/dy into projects/mescc/develop
All checks were successful
continuous-integration/drone/push Build is passing
Reviewed-on: #99
2024-07-17 08:28:56 +08:00
helloDy
efa5a7c383 生产数据echarts图重写 2024-07-16 18:41:57 +08:00
6ba4c90767 Merge pull request 'projects/mescc/zhp' (#98) from projects/mescc/zhp into projects/mescc/develop
All checks were successful
continuous-integration/drone/push Build is passing
Reviewed-on: #98
2024-07-12 09:32:46 +08:00
3 changed files with 87 additions and 137 deletions

View File

@ -70,7 +70,7 @@ const LOCATIONS = [
// 2 // 2
// { x: 61, y: 53, tx: 39, ty: 68, path: 'factoryData/ksIndex' }, // { x: 61, y: 53, tx: 39, ty: 68, path: 'factoryData/ksIndex' },
// 西 // 西
{ x: 60, y: 58, tx: 68, ty: 52,lx:61,ly:61.5,ltx:69.5,lty:52, path: 'factoryData/factory-data' }, { x: 60, y: 58, tx: 68, ty: 50,lx:61,ly:61.5,ltx:69.5,lty:51.2, path: 'factoryData/factory-data' },
// //
// { x: 56, y: 60, tx: 60, ty: 95, path: 'factoryData/zzIndex' }, // { x: 56, y: 60, tx: 60, ty: 95, path: 'factoryData/zzIndex' },
// //

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-07-10 09:58:59 * @LastEditTime: 2024-07-17 08:55:15
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -17,15 +17,15 @@
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator="" <el-date-picker size="small" clearable v-model="listQuery.reportTime" type="daterange" range-separator=""
start-placeholder="开始日期" value-format="yyyy-MM-dd" format="yyyy-MM-dd" @change="changeDayTime" end-placeholder="结束日期" :picker-options="{ }"> start-placeholder="开始日期" value-format="yyyy-MM-dd" format="yyyy-MM-dd" @change="changeDayTime" end-placeholder="结束日期" :picker-options="{ firstDayOfWeek: 1 }">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item v-show="listQuery.type === 1" label="时间范围" prop="reportTime"> <el-form-item v-show="listQuery.type === 1" label="时间范围" prop="reportTime">
<el-date-picker size="small" clearable v-model="listQuery.start" type="week" format="yyyy 第 WW 周" placeholder="选择周" <el-date-picker size="small" clearable v-model="listQuery.start" type="week" format="yyyy-MM-dd" placeholder="选择周" :picker-options="{ firstDayOfWeek: 1 }"
style="width: 180px" @change="onValueChange"> style="width: 180px" @change="onValueChange">
</el-date-picker> </el-date-picker>
<el-date-picker size="small" clearable v-model="listQuery.end" type="week" format="yyyy 第 WW 周" placeholder="选择周" <el-date-picker size="small" clearable v-model="listQuery.end" type="week" format="yyyy-MM-dd" placeholder="选择周" :picker-options="{ firstDayOfWeek: 1 }"
style="width: 180px" @change="onValueChange"> style="width: 180px" @change="onValueChange">
</el-date-picker> </el-date-picker>
<!-- <span v-if="listQuery.start && listQuery.end" style="margin-left: 10px"> <!-- <span v-if="listQuery.start && listQuery.end" style="margin-left: 10px">
@ -115,7 +115,7 @@ import moment from 'moment'
import ButtonNav from '@/components/ButtonNav' import ButtonNav from '@/components/ButtonNav'
import basicPage from '@/mixins/basic-page' import basicPage from '@/mixins/basic-page'
import AddOrUpdate from './add-or-updata' import AddOrUpdate from './add-or-updata'
import { factoryList, factoryArray } from "@/utils/constants"; import { factoryList, factoryArray, factoryListabbr } from "@/utils/constants";
export default { export default {
components: { lineChart, ButtonNav, AddOrUpdate }, components: { lineChart, ButtonNav, AddOrUpdate },
@ -124,7 +124,7 @@ export default {
return { return {
factoryList, factoryList,
factoryArray, factoryArray,
// factoryArray1, factoryListabbr,
listQuery: { listQuery: {
pageSize: 20, pageSize: 20,
pageNo: 1, pageNo: 1,
@ -253,7 +253,7 @@ export default {
// }, // },
created() { created() {
const today = new Date() const today = new Date()
const sevenDaysAgo = new Date(today.getTime() - (7 * 24 * 60 * 60 * 1000)) const sevenDaysAgo = new Date(today.getTime() - (6 * 24 * 60 * 60 * 1000))
this.listQuery.startDate = moment(sevenDaysAgo).format('yyyy-MM-DD') this.listQuery.startDate = moment(sevenDaysAgo).format('yyyy-MM-DD')
this.listQuery.endDate = moment(today).format('yyyy-MM-DD') this.listQuery.endDate = moment(today).format('yyyy-MM-DD')
this.listQuery.reportTime = [this.listQuery.startDate, this.listQuery.endDate] this.listQuery.reportTime = [this.listQuery.startDate, this.listQuery.endDate]
@ -385,115 +385,72 @@ export default {
this.seriesList = [] this.seriesList = []
// x // x
xAxisData = Object.keys(data) xAxisData = Object.keys(data)
let arr = []
if (this.listQuery.factory.length === 0) {
arr = this.factoryArray
} else {
this.listQuery.factory.forEach((ele, index) => {
let i = this.factoryArray.findIndex((item) => item.id == ele) // series
if (i != -1) { // ['chipYield', 'componentYield', 'bipvProductOutput']
arr.push({ const typeArray = (this.listQuery.glass.length === 0 || this.listQuery.glass.length === 3) ? [0, 1, 2] : this.listQuery.glass
id: this.factoryArray[i].id, // this.factoryListabbr
name: this.factoryArray[i].name const factoryNameArray = (this.listQuery.factory.length === 0 || this.listQuery.factory.length === this.factoryListabbr.length) ? [0, 1] : this.listQuery.factory
}) const seriesArray = []
} typeArray.forEach((type, typeIndex) => {
}) factoryNameArray.forEach((fac, facIndex) => {
} const series = {
// y
arr.forEach((fac,index) => {
console.log('fac',fac);
let i = 0
let position = fac.id == 1 ? [1, -16,] : [-8, -16,]
while ( i < 3) {
//
const index1 = ['chipYield', 'componentYield', 'bipvProductOutput'][i]
// let oneChart = {}
xAxisData.forEach((x, index) => {
if (this.listQuery.glass.length === 0 || this.listQuery.glass.length === 3) {
let series = {
name: ['玻璃芯片', '标准组件', 'BIPV'][i] + '-' + fac.id,
type: 'bar',
stack: String(fac.id),
data: Array(xAxisData.length).fill(0), data: Array(xAxisData.length).fill(0),
type: 'bar',
stack: String(fac),
barWidth: 16, barWidth: 16,
itemStyle: { itemStyle: {
color: this.colorList[i] color: this.colorList[type]
}, },
label: { name: this.factoryListabbr[fac] + '-' + type
show: i === 2 ? true : false,
position: 'top',
// fontSize:10,
position: position,
formatter(params) {
return fac.name.substring(0, 2)
}
}
}
dataList.forEach(item => {
if (fac.id === item.factory && item.datestr === x) {
series.data[index] = item[index1]
} }
seriesArray.push(series)
}) })
this.seriesList.push(series) })
} else { // seriesdata
this.listQuery.glass.forEach(gl => { const seriesDataArray = []
if (gl === i) { Object.values(data).forEach((item) => {
let series = { let seriesData = []
name: ['玻璃芯片', '标准组件', 'BIPV'][i] + '-' + fac.id, // item[0].datestr
type: 'bar', typeArray.forEach(t => {
stack: String(fac.id), const zidr = ['chipYield', 'componentYield', 'bipvProductOutput'][t]
item.forEach(it => {
seriesData.push(it[zidr])
})
})
seriesDataArray.push(seriesData)
})
for (let y = 0; y < seriesArray.length; y ++) {
const days = []
seriesDataArray.forEach(a => {
days.push(a[y])
})
//
seriesArray[y].data = days
}
//
const validSeriesArray = []
factoryNameArray.forEach(f => {
const s = {
name: '显示工厂',
data: Array(xAxisData.length).fill(0), data: Array(xAxisData.length).fill(0),
type: 'bar',
stack: String(f),
barWidth: 16, barWidth: 16,
itemStyle: {
color: this.colorList[i]
},
label: { label: {
show: true, show: true,
position: 'top', position: 'top',
position: position, // position: f > 0 ? [2, -16] : [-10, -16],
formatter(params) { formatter(params) {
if (params.value === 0) { return factoryListabbr[f]
return ''
} else {
// return ['', ''][params.seriesName.split('-')[1]]
return fac.name.substring(0, 2)
} }
} }
} }
} validSeriesArray.push(s)
dataList.forEach(item => {
if (fac.id === item.factory && item.datestr === x) {
series.data[index] = item[index1]
}
}) })
this.seriesList.push(series) this.seriesList = [...seriesArray, ...validSeriesArray]
} this.$refs.lineChart.initChart(xAxisData, this.seriesList, factoryNameArray)
})
}
// let series = {
// name: ['', '', 'BIPV'][i] + '-' + fac.id,
// type: 'bar',
// stack: String(fac.id),
// data: Array(xAxisData.length).fill(0),
// barWidth: 16,
// itemStyle: {
// color: this.colorList[i]
// }
// }
// dataList.forEach(item => {
// if (fac.id === item.factory && item.datestr === x) {
// series.data[index] = item[index1]
// }
// })
// this.seriesList.push(series)
})
i ++
}
})
console.log('你好', this.seriesList)
this.$refs.lineChart.initChart(xAxisData, this.seriesList,arr)
}, },
buttonClick(val) { buttonClick(val) {
this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined; this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined;

View File

@ -1,8 +1,8 @@
<!-- <!--
* @Author: zwq * @Author: zwq
* @Date: 2022-01-21 14:43:06 * @Date: 2022-01-21 14:43:06
* @LastEditors: zhp * @LastEditors: DY
* @LastEditTime: 2024-07-04 09:37:49 * @LastEditTime: 2024-07-16 18:41:27
* @Description: * @Description:
--> -->
<template> <template>
@ -73,7 +73,7 @@ export default {
this.chart = null this.chart = null
}, },
methods: { methods: {
initChart(xAxis, seriesList,arr) { initChart(xAxis, seriesList, facs) {
if (xAxis.length === 0) { if (xAxis.length === 0) {
this.chart.clear() this.chart.clear()
} }
@ -93,9 +93,9 @@ export default {
itemHeight: 10, itemHeight: 10,
itemGap: 40, itemGap: 40,
formatter(name) { formatter(name) {
return name.split('-')[0] return ['玻璃芯片', '标准组件', 'BIPV'][name.split('-')[1]]
}, },
data: ['玻璃芯片-0', '标准组件-0', 'BIPV-0'] data: ['瑞昌-0', '瑞昌-1', '瑞昌-2']
}, },
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
@ -103,48 +103,41 @@ export default {
type: 'shadow', type: 'shadow',
color: "rgba(237,237,237,0.5)" color: "rgba(237,237,237,0.5)"
}, },
formatter: function (params) { formatter(params) {
// console.log(params)
let str = '' let str = ''
arr.forEach(ele => { facs.forEach(ele => {
str += `<div style="width: 60px; text-align: right">${ele.name.substring(0, 2) }</div>` str += `<div style="width: 60px; text-align: right">${ factoryListabbr[ele] }</div>`
}) })
console.log(str);
let result = ` let result = `
<div style="width: 270px; display: flex"> <div style="width: 270px; display: flex">
<div style="width: 150px">${params[0].name}</div> <div style="width: 150px">${params[0].name}</div>
${str} ${ str }
</div>` </div>`
const newArray = params.map(p => { const analyzeArray = params.filter(p => p.seriesName !== '显示工厂').map(item => {
console.log(factoryListabbr[p.seriesName.split('-')[1]], p.seriesName.split('-')[0]) const obj = {
return { glass: ['玻璃芯片', '标准组件', 'BIPV'][item.seriesName.split('-')[1]], //
glass: p.seriesName.split('-')[0], // factoryName: item.seriesName.split('-')[0], //
factoryName: arr[p.seriesName.split('-')[1]], // value: item.value,
value: p.value, name: item.name,
name: p.name, marker: item.marker,
marker: p.marker, color: item.color
color: p.color
} }
return obj
}) })
const analyzeList = Object.groupBy(newArray, (member) => member.glass) const analyzeList = Object.groupBy(analyzeArray, (member) => member.glass)
for (let g in analyzeList) { for (let g in analyzeList) {
// date => // date =>
let oneData = `<div style="width: 270px; display: flex"> let oneData = `<div style="width: 270px; display: flex">
<div style="width: 150px; display: flex; align-items: center"> <div style="width: 150px; display: flex; align-items: center">
<div style="background-color: ${analyzeList[g][0].color}; width: 10px; height: 10px; margin-right: 5px"></div> <div style="background-color: ${analyzeList[g][0].color}; width: 10px; height: 10px; margin-right: 5px"></div>
<div>${g}</div></div>` <div>${g}</div></div>`
for (let fac of arr) {
let goodNum = 0 let goodNum = 0
for (let ana of analyzeList[g]) { for (let ana of analyzeList[g]) {
if (ana.factoryName === fac && ana.value !== 0) {
goodNum = ana.value goodNum = ana.value
}
}
oneData += `<div style="width: 60px; text-align: right">${goodNum}</div>` oneData += `<div style="width: 60px; text-align: right">${goodNum}</div>`
} }
result = result + oneData + '</div>' result = result + oneData + '</div>'
} }
// console.log('result', result);
return result return result
} }
}, },