projects/mescc/zhp #83
@ -1,4 +1,4 @@
|
||||
export default ({
|
||||
export default ({
|
||||
titleValue,
|
||||
subtitle,
|
||||
previousSum,
|
||||
@ -15,7 +15,12 @@ export default ({
|
||||
top: 0,
|
||||
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: {
|
||||
text: titleValue,
|
||||
left: "48%",
|
||||
@ -62,7 +67,8 @@ export default ({
|
||||
value: currentSum,
|
||||
name: currentName,
|
||||
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,
|
||||
itemStyle: {
|
||||
@ -87,7 +93,8 @@ export default ({
|
||||
value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum),
|
||||
name: currentName,
|
||||
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" },
|
||||
label: { show: false },
|
||||
@ -111,7 +118,8 @@ export default ({
|
||||
value: previousSum,
|
||||
name: preName,
|
||||
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,
|
||||
itemStyle: {
|
||||
@ -136,7 +144,8 @@ export default ({
|
||||
value:previousSum === 0 ? 1 : 0,
|
||||
name: preName,
|
||||
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" },
|
||||
label: { show: false },
|
||||
|
@ -14,7 +14,12 @@ export default ({
|
||||
top: 0,
|
||||
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: {
|
||||
text: titleValue,
|
||||
left: "48.5%",
|
||||
@ -62,7 +67,8 @@ export default ({
|
||||
name: currentName,
|
||||
selected: false,
|
||||
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: {
|
||||
borderJoin: "round",
|
||||
@ -86,7 +92,8 @@ export default ({
|
||||
value:(targetSum - currentSum) === 0 ? 1 : (targetSum - currentSum),
|
||||
name: currentName,
|
||||
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" },
|
||||
label: { show: false },
|
||||
@ -111,7 +118,8 @@ export default ({
|
||||
name: preName,
|
||||
selected: false,
|
||||
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: {
|
||||
borderJoin: "round",
|
||||
@ -136,7 +144,8 @@ export default ({
|
||||
value:previousSum === 0 ? 1 : 0,
|
||||
name: preName,
|
||||
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" },
|
||||
label: { show: false },
|
||||
|
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-04-28 13:42:51
|
||||
* @LastEditTime: 2024-07-03 15:56:48
|
||||
* @LastEditTime: 2024-07-04 08:38:11
|
||||
* @LastEditors: zhp
|
||||
* @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);',
|
||||
backgroundColor: '#001829',
|
||||
borderColor: '#001829',
|
||||
formatter: params => {
|
||||
console.log('params', params)
|
||||
var res = ``;
|
||||
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 : ''
|
||||
// console.log(item.color, color);
|
||||
res +=
|
||||
// `<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='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`;
|
||||
}
|
||||
console.log('res',res)
|
||||
return res;
|
||||
},
|
||||
// formatter: params => {
|
||||
// console.log('params', params)
|
||||
// var res = ``;
|
||||
// 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 : ''
|
||||
// // console.log(item.color, color);
|
||||
// res +=
|
||||
// // `<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='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`;
|
||||
// }
|
||||
// console.log('res',res)
|
||||
// return res;
|
||||
// },
|
||||
},
|
||||
title: {
|
||||
text: "0%",
|
||||
|
@ -1,8 +1,8 @@
|
||||
<!--
|
||||
* @Author: zhp
|
||||
* @Date: 2024-04-15 10:49:13
|
||||
* @LastEditTime: 2024-07-02 16:33:59
|
||||
* @LastEditors: DY
|
||||
* @LastEditTime: 2024-07-04 09:28:31
|
||||
* @LastEditors: zhp
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -115,7 +115,7 @@ import moment from 'moment'
|
||||
import ButtonNav from '@/components/ButtonNav'
|
||||
import basicPage from '@/mixins/basic-page'
|
||||
import AddOrUpdate from './add-or-updata'
|
||||
import { factoryList, factoryArray, factoryArray1 } from "@/utils/constants";
|
||||
import { factoryList, factoryArray } from "@/utils/constants";
|
||||
|
||||
export default {
|
||||
components: { lineChart, ButtonNav, AddOrUpdate },
|
||||
@ -124,7 +124,7 @@ export default {
|
||||
return {
|
||||
factoryList,
|
||||
factoryArray,
|
||||
factoryArray1,
|
||||
// factoryArray1,
|
||||
listQuery: {
|
||||
pageSize: 20,
|
||||
pageNo: 1,
|
||||
@ -381,9 +381,24 @@ export default {
|
||||
this.seriesList = []
|
||||
// x轴数据
|
||||
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轴数据
|
||||
this.factoryArray.forEach(fac => {
|
||||
arr.forEach(fac => {
|
||||
let i = 0
|
||||
while ( i < 3) {
|
||||
// 下标
|
||||
@ -469,7 +484,7 @@ export default {
|
||||
}
|
||||
})
|
||||
console.log('你好', this.seriesList)
|
||||
this.$refs.lineChart.initChart(xAxisData, this.seriesList)
|
||||
this.$refs.lineChart.initChart(xAxisData, this.seriesList,arr)
|
||||
},
|
||||
buttonClick(val) {
|
||||
this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined;
|
||||
|
@ -1,8 +1,8 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2022-01-21 14:43:06
|
||||
* @LastEditors: DY
|
||||
* @LastEditTime: 2024-07-01 16:54:41
|
||||
* @LastEditors: zhp
|
||||
* @LastEditTime: 2024-07-04 09:37:49
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -73,7 +73,7 @@ export default {
|
||||
this.chart = null
|
||||
},
|
||||
methods: {
|
||||
initChart(xAxis, seriesList) {
|
||||
initChart(xAxis, seriesList,arr) {
|
||||
if (xAxis.length === 0) {
|
||||
this.chart.clear()
|
||||
}
|
||||
@ -103,18 +103,23 @@ export default {
|
||||
type: 'shadow',
|
||||
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 = `
|
||||
<div style="width: 270px; display: flex">
|
||||
<div style="width: 150px">${params[0].name}</div>
|
||||
<div style="width: 60px; text-align: right">${factoryListabbr[0]}</div>
|
||||
<div style="width: 60px; text-align: right">${factoryListabbr[1]}</div>
|
||||
${str}
|
||||
</div>`
|
||||
const newArray = params.map(p => {
|
||||
console.log(factoryListabbr[p.seriesName.split('-')[1]], p.seriesName.split('-')[0])
|
||||
return {
|
||||
glass: p.seriesName.split('-')[0], // 玻璃类型
|
||||
factoryName: factoryListabbr[p.seriesName.split('-')[1]], // 工厂名称
|
||||
factoryName: arr[p.seriesName.split('-')[1]], // 工厂名称
|
||||
value: p.value,
|
||||
name: p.name,
|
||||
marker: p.marker,
|
||||
@ -128,7 +133,7 @@ export default {
|
||||
<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>${g}</div></div>`
|
||||
for (let fac of factoryListabbr) {
|
||||
for (let fac of arr) {
|
||||
let goodNum = 0
|
||||
for (let ana of analyzeList[g]) {
|
||||
if (ana.factoryName === fac && ana.value !== 0) {
|
||||
@ -139,6 +144,7 @@ export default {
|
||||
}
|
||||
result = result + oneData + '</div>'
|
||||
}
|
||||
// console.log('result', result);
|
||||
return result
|
||||
}
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user