Merge pull request 'projects/mescc/zhp' (#83) from projects/mescc/zhp into projects/mescc/develop
Some checks are pending
continuous-integration/drone/push Build is pending

Reviewed-on: #83
This commit is contained in:
朱菊兰 2024-07-04 16:41:23 +08:00
commit d62015bfbb
5 changed files with 79 additions and 40 deletions

View File

@ -15,7 +15,12 @@ export default ({
top: 0, top: 0,
containLabel: true, containLabel: true,
}, },
tooltip: {}, tooltip: {
trigger: "item",
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);',
backgroundColor: '#001829',
borderColor: '#001829',
},
title: { title: {
text: titleValue, text: titleValue,
left: "48%", left: "48%",
@ -62,7 +67,8 @@ export default ({
value: currentSum, value: currentSum,
name: currentName, name: currentName,
tooltip: { tooltip: {
formatter: `${currentName} : ${currentSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${currentName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${currentSum}</span>`
}, },
selected: false, selected: false,
itemStyle: { itemStyle: {
@ -87,7 +93,8 @@ export default ({
value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum), value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum),
name: currentName, name: currentName,
tooltip: { tooltip: {
formatter: `${currentName} : ${currentSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${currentName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${currentSum}</span>`
}, },
itemStyle: { color: "transparent" }, itemStyle: { color: "transparent" },
label: { show: false }, label: { show: false },
@ -111,7 +118,8 @@ export default ({
value: previousSum, value: previousSum,
name: preName, name: preName,
tooltip: { tooltip: {
formatter: `${preName} : ${previousSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${preName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${previousSum}</span>`
}, },
selected: false, selected: false,
itemStyle: { itemStyle: {
@ -136,7 +144,8 @@ export default ({
value:previousSum === 0 ? 1 : 0, value:previousSum === 0 ? 1 : 0,
name: preName, name: preName,
tooltip: { tooltip: {
formatter: `${preName} : ${previousSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${preName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${previousSum}</span>`
}, },
itemStyle: { color: "transparent" }, itemStyle: { color: "transparent" },
label: { show: false }, label: { show: false },

View File

@ -14,7 +14,12 @@ export default ({
top: 0, top: 0,
containLabel: true, containLabel: true,
}, },
tooltip: {}, tooltip: {
trigger: "item",
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);',
backgroundColor: '#001829',
borderColor: '#001829',
},
title: { title: {
text: titleValue, text: titleValue,
left: "48.5%", left: "48.5%",
@ -62,7 +67,8 @@ export default ({
name: currentName, name: currentName,
selected: false, selected: false,
tooltip: { tooltip: {
formatter: `${currentName} : ${currentSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${currentName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${currentSum}</span>`
}, },
itemStyle: { itemStyle: {
borderJoin: "round", borderJoin: "round",
@ -86,7 +92,8 @@ export default ({
value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum), value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum),
name: currentName, name: currentName,
tooltip: { tooltip: {
formatter: `${currentName} : ${currentSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${currentName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${currentSum}</span>`
}, },
itemStyle: { color: "transparent" }, itemStyle: { color: "transparent" },
label: { show: false }, label: { show: false },
@ -111,7 +118,8 @@ export default ({
name: preName, name: preName,
selected: false, selected: false,
tooltip: { tooltip: {
formatter: `${preName} : ${previousSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${preName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${previousSum}</span>`
}, },
itemStyle: { itemStyle: {
borderJoin: "round", borderJoin: "round",
@ -136,7 +144,8 @@ export default ({
value:previousSum === 0 ? 1 : 0, value:previousSum === 0 ? 1 : 0,
name: preName, name: preName,
tooltip: { tooltip: {
formatter: `${preName} : ${previousSum}` formatter: `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${preName}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${previousSum}</span>`
}, },
itemStyle: { color: "transparent" }, itemStyle: { color: "transparent" },
label: { show: false }, label: { show: false },

View File

@ -1,7 +1,7 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-28 13:42:51 * @Date: 2024-04-28 13:42:51
* @LastEditTime: 2024-07-03 15:56:48 * @LastEditTime: 2024-07-04 08:38:11
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
--> -->
@ -64,20 +64,20 @@ export default {
extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);', extraCssText: 'box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.38); border- radius: 4px;opacity: 0.6;backdrop- filter: blur(6px);',
backgroundColor: '#001829', backgroundColor: '#001829',
borderColor: '#001829', borderColor: '#001829',
formatter: params => { // formatter: params => {
console.log('params', params) // console.log('params', params)
var res = ``; // var res = ``;
for (var i = 0, l = params.length; i < l; i++) { // for (var i = 0, l = params.length; i < l; i++) {
let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : '' // let color = Object.prototype.toString.call(params[i].color) == "[object String]" ? params[i].color : params[i].color.colorStops ? params[i].color.colorStops[0].color : ''
// console.log(item.color, color); // // console.log(item.color, color);
res += // res +=
// `<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + // // `<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` +
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${params[0].axisValueLabel}</span>` + // `<span style='display:inline-block;width:150px;color:rgba(255,255,255,0855);font-size:14px;'>${params[0].axisValueLabel}</span>` +
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; // `<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '' : 0 + ''}</span>`;
} // }
console.log('res',res) // console.log('res',res)
return res; // return res;
}, // },
}, },
title: { title: {
text: "0%", text: "0%",

View File

@ -1,8 +1,8 @@
<!-- <!--
* @Author: zhp * @Author: zhp
* @Date: 2024-04-15 10:49:13 * @Date: 2024-04-15 10:49:13
* @LastEditTime: 2024-07-02 16:33:59 * @LastEditTime: 2024-07-04 09:28:31
* @LastEditors: DY * @LastEditors: zhp
* @Description: * @Description:
--> -->
<template> <template>
@ -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, factoryArray1 } from "@/utils/constants"; import { factoryList, factoryArray } 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, // factoryArray1,
listQuery: { listQuery: {
pageSize: 20, pageSize: 20,
pageNo: 1, pageNo: 1,
@ -381,9 +381,24 @@ 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)
if (i != -1) {
arr.push({
id: this.factoryArray[i].id,
name: this.factoryArray[i].name
})
}
})
}
// y // y
this.factoryArray.forEach(fac => { arr.forEach(fac => {
let i = 0 let i = 0
while ( i < 3) { while ( i < 3) {
// //
@ -469,7 +484,7 @@ export default {
} }
}) })
console.log('你好', this.seriesList) console.log('你好', this.seriesList)
this.$refs.lineChart.initChart(xAxisData, 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: DY * @LastEditors: zhp
* @LastEditTime: 2024-07-01 16:54:41 * @LastEditTime: 2024-07-04 09:37:49
* @Description: * @Description:
--> -->
<template> <template>
@ -73,7 +73,7 @@ export default {
this.chart = null this.chart = null
}, },
methods: { methods: {
initChart(xAxis, seriesList) { initChart(xAxis, seriesList,arr) {
if (xAxis.length === 0) { if (xAxis.length === 0) {
this.chart.clear() this.chart.clear()
} }
@ -104,17 +104,22 @@ export default {
color: "rgba(237,237,237,0.5)" color: "rgba(237,237,237,0.5)"
}, },
formatter: function (params) { formatter: function (params) {
// console.log(params)
let str = ''
arr.forEach(ele => {
str += `<div style="width: 60px; text-align: right">${ele.name.substring(0, 2) }</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>
<div style="width: 60px; text-align: right">${factoryListabbr[0]}</div> ${str}
<div style="width: 60px; text-align: right">${factoryListabbr[1]}</div>
</div>` </div>`
const newArray = params.map(p => { const newArray = params.map(p => {
console.log(factoryListabbr[p.seriesName.split('-')[1]], p.seriesName.split('-')[0]) console.log(factoryListabbr[p.seriesName.split('-')[1]], p.seriesName.split('-')[0])
return { return {
glass: p.seriesName.split('-')[0], // glass: p.seriesName.split('-')[0], //
factoryName: factoryListabbr[p.seriesName.split('-')[1]], // factoryName: arr[p.seriesName.split('-')[1]], //
value: p.value, value: p.value,
name: p.name, name: p.name,
marker: p.marker, marker: p.marker,
@ -128,7 +133,7 @@ export default {
<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 factoryListabbr) { 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) { if (ana.factoryName === fac && ana.value !== 0) {
@ -139,6 +144,7 @@ export default {
} }
result = result + oneData + '</div>' result = result + oneData + '</div>'
} }
// console.log('result', result);
return result return result
} }
}, },