@@ -22,7 +22,7 @@ export default { | |||
}, | |||
computed: { | |||
changeColor() { | |||
console.log(this.$route); | |||
// console.log(this.$route); | |||
if (this.$route.path == '/copilot/efficiency-container' || this.$route.path == '/copilot/main' || this.$route.path == '/factoryData/hdIndex' || this.$route.path === '/factoryData/factory-data') { | |||
return true | |||
} else { | |||
@@ -34,19 +34,17 @@ export default { | |||
changeColor(val) { | |||
if (val == true) { | |||
let item = document.getElementsByClassName('el-breadcrumb__separator') | |||
for (let i in item) { | |||
console.log(item[i]) | |||
if (item[i]) { | |||
item[i].style.color = 'rgba(255, 255, 255, 0.45)' | |||
} | |||
} | |||
// for (let i in item) { | |||
// console.log('item[i]',item, item[i]) | |||
// if (item[i].style) { | |||
item[0].style.color = 'rgba(255, 255, 255, 0.45)' | |||
item[1].style.color = 'rgba(255, 255, 255, 0.45)' | |||
// } | |||
// } | |||
} else { | |||
let item = document.getElementsByClassName('el-breadcrumb__separator') | |||
for (let i in item) { | |||
if (item[i]) { | |||
// item[i].style.color = '#c0c4cc' | |||
} | |||
} | |||
item[0].style.color = '' | |||
item[1].style.color = '' | |||
} | |||
}, | |||
$route(route) { | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-05-07 13:22:43 | |||
* @LastEditTime: 2024-07-05 09:50:14 | |||
* @LastEditTime: 2024-07-08 14:10:08 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -81,7 +81,10 @@ export default { | |||
// console.log(item.color, color); | |||
res += | |||
"<br/>" + | |||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||
`${params[i].seriesType === "line" | |||
? '<img width="11" height="11" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />' | |||
: `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${color}"></span>` | |||
}` + | |||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '%' : 0 + '%'}</span>`; | |||
} | |||
@@ -81,7 +81,10 @@ export default { | |||
// console.log(item.color, color); | |||
res += | |||
"<br/>" + | |||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||
`${params[i].seriesType === "line" | |||
? '<img width="11" height="11" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />' | |||
: `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${color}"></span>` | |||
}` + | |||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '%' : 0 + '%'}</span>`; | |||
} | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-04-28 13:42:51 | |||
* @LastEditTime: 2024-07-04 08:38:11 | |||
* @LastEditTime: 2024-07-08 13:43:52 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -91,7 +91,7 @@ export default { | |||
}, | |||
subtext: `\u2002${year}年累计产出\u2002`, | |||
subtextStyle: { | |||
fontSize: 12, | |||
fontSize: 15, | |||
fontWeight: 100, | |||
color: "#fffd", | |||
align: "right", | |||
@@ -84,7 +84,7 @@ export default { | |||
// console.log(item.color, color); | |||
res += | |||
"<br/>" + | |||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||
`<span style='display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${color}'></span>` + | |||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||
} | |||
@@ -137,7 +137,7 @@ export default { | |||
{ | |||
name: '', // this.series[0].name, | |||
type: "bar", | |||
barWidth: 12, | |||
barWidth: 16, | |||
label: { | |||
show: true, //开启显示 | |||
align: 'right', //在上方显示 | |||
@@ -181,7 +181,7 @@ export default { | |||
{ | |||
name: '', // this.series[1].name, | |||
type: "bar", | |||
barWidth: 12, | |||
barWidth: 16, | |||
label: { | |||
show: true, //开启显示 | |||
align: 'left', //在上方显示 | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-04-28 13:42:51 | |||
* @LastEditTime: 2024-07-03 14:13:59 | |||
* @LastEditTime: 2024-07-08 14:30:44 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -90,12 +90,16 @@ export default { | |||
// console.log(item.color, color); | |||
res += | |||
"<br/>" + | |||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${color}'></span>` + | |||
`${params[i].seriesType === "line" | |||
? '<img width="11" height="11" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />' | |||
: `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${color}"></span>` | |||
}` + | |||
`<span style='display:inline-block;width:150px;color:rgba(255,255,255,.85);font-size:14px;'>${params[i].seriesName}</span>` + | |||
`<span style='color:rgba(255,255,255,0.65);font-size:14px;'>${params[i].value ? params[i].value + '片' : 0 + '片'}</span>`; | |||
} | |||
return res; | |||
}, | |||
}, | |||
xAxis: { | |||
axisTick: { | |||
@@ -178,7 +182,7 @@ export default { | |||
{ | |||
name: "", // "2023年", | |||
type: "bar", | |||
barWidth: 12, | |||
barWidth: 16, | |||
itemStyle: { | |||
borderRadius: [10, 10, 0, 0], | |||
color: { | |||
@@ -213,7 +217,7 @@ export default { | |||
{ | |||
name: "", // "2024年", | |||
type: "bar", | |||
barWidth: 12, | |||
barWidth: 16, | |||
// tooltip: { | |||
// valueFormatter: function (value) { | |||
// return value + " ml"; | |||
@@ -96,7 +96,8 @@ h2 { | |||
margin: 6px 0; | |||
font-family: 优设标题黑; | |||
color: #fff; | |||
letter-spacing:5px; | |||
letter-spacing:4px; | |||
text-align: left; | |||
// font-size: 24px; | |||
font-size: 1.276em; | |||
} | |||
@@ -90,18 +90,18 @@ export default { | |||
position: relative; | |||
box-shadow: inset 0 0 20px 1px #fff1; | |||
// &::after { | |||
// content: ""; | |||
// position: absolute; | |||
// display: inline-block; | |||
// width: 60%; | |||
// height: 0.31415vh; | |||
// border-radius: 2px; | |||
// left: 8%; | |||
// bottom: 0; | |||
// background: linear-gradient(to right, #024798, transparent); | |||
// z-index: 0; | |||
// } | |||
&::after { | |||
content: ""; | |||
position: absolute; | |||
display: inline-block; | |||
width: 85%; | |||
height: 0.31415vh; | |||
border-radius: 2px; | |||
left: 8%; | |||
bottom: 0; | |||
background: linear-gradient(to left, #024798, transparent); | |||
z-index: 0; | |||
} | |||
.container-head { | |||
// height: 40px; | |||
@@ -0,0 +1,204 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 13:51:30 | |||
* @LastEditTime: 2024-07-08 13:53:26 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div class="dashboard-container"> | |||
<!-- refresh btn --> | |||
<button | |||
v-if="0" | |||
style="appearance: none; outline: none; border: none; background: none; color:#fff; cursor: pointer; position: absolute; top: 8px; right: 8px" | |||
@click="$emit('refresh')" | |||
> | |||
<svg | |||
xmlns="http://www.w3.org/2000/svg" | |||
fill="none" | |||
viewBox="0 0 24 24" | |||
stroke-width="1.5" | |||
stroke="currentColor" | |||
style="width: 24px; height: 24px" | |||
> | |||
<path | |||
stroke-linecap="round" | |||
stroke-linejoin="round" | |||
d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" | |||
/> | |||
</svg> | |||
</button> | |||
<!-- decoration --> | |||
<div class="corner tl"></div> | |||
<div class="corner tr"></div> | |||
<div v-if="side == 'left'" class="corner bl"></div> | |||
<div v-if="side == 'right'" class="corner br"></div> | |||
<!-- content --> | |||
<div | |||
class="container-head" | |||
:class="[side == 'left' ? 'gradient-to-right' : 'gradient-to-left']" | |||
> | |||
<Icon style="margin-left: 16px;" :icon="icon"></Icon> | |||
<h2 class="container-title">{{ title }}</h2> | |||
</div> | |||
<div | |||
class="container-body" | |||
:class="[ | |||
side == 'left' ? 'body-gradient-to-right' : 'body-gradient-to-left', | |||
]" | |||
> | |||
<slot /> | |||
</div> | |||
</div> | |||
</template> | |||
<script> | |||
import ContainerIconVue from "./ContainerIcon.vue"; | |||
export default { | |||
name: "DashboardContainer", | |||
components: { | |||
Icon: ContainerIconVue, | |||
}, | |||
props: { | |||
side: { | |||
type: String, | |||
default: "left", | |||
}, | |||
icon: { | |||
type: String, | |||
default: "cube", | |||
}, | |||
title: { | |||
type: String, | |||
default: "Default Title", | |||
}, | |||
}, | |||
data() { | |||
return {}; | |||
}, | |||
computed: {}, | |||
methods: {}, | |||
}; | |||
</script> | |||
<style scoped lang="scss"> | |||
.dashboard-container { | |||
height: 0; | |||
flex: 1; | |||
display: flex; | |||
flex-direction: column; | |||
position: relative; | |||
box-shadow: inset 0 0 20px 1px #fff1; | |||
&::after { | |||
content: ""; | |||
position: absolute; | |||
display: inline-block; | |||
width: 85%; | |||
height: 0.31415vh; | |||
border-radius: 2px; | |||
left: 8%; | |||
bottom: 0; | |||
background: linear-gradient(to right, #024798, transparent); | |||
z-index: 0; | |||
} | |||
.container-head { | |||
// height: 40px; | |||
height:4vh; | |||
padding: 8px; | |||
display: flex; | |||
align-items: center; | |||
gap: 8px; | |||
.container-title { | |||
font-size: 1.18vw; | |||
line-height: 1.39vw; | |||
font-weight: normal; | |||
letter-spacing: 2px; | |||
} | |||
} | |||
.container-body { | |||
padding: 12px; | |||
display: flex; | |||
flex-direction: column; | |||
flex: 1; | |||
height: 0; | |||
} | |||
.corner { | |||
z-index: 1; | |||
position: absolute; | |||
// width: 16px; | |||
// height: 16px; | |||
width: 0.95vw; | |||
height: 0.95vw; | |||
} | |||
.corner.tl { | |||
border-top: 2px solid #0175dc; | |||
border-left: 2px solid #0175dc; | |||
top: 0; | |||
left: 0; | |||
} | |||
.corner.tr { | |||
top: 0; | |||
right: 0; | |||
border-top: 2px solid #0175dc; | |||
border-right: 2px solid #0175dc; | |||
} | |||
.corner.bl { | |||
// width: 20px; | |||
// height: 20px; | |||
width: 1.064vw; | |||
height: 1.064vw; | |||
bottom: 0; | |||
left: 0; | |||
// border-left: 10px solid #0175dc; | |||
// border-bottom: 10px solid #0175dc; | |||
// border-top: 10px solid transparent; | |||
// border-right: 10px solid transparent; | |||
border-left: 0.532vw solid #0175dc; | |||
border-bottom: 0.532vw solid #0175dc; | |||
border-top: 0.532vw solid transparent; | |||
border-right: 0.532vw solid transparent; | |||
} | |||
.corner.br { | |||
bottom: 0; | |||
right: 0; | |||
// width: 20px; | |||
// height: 20px; | |||
width: 1.064vw; | |||
height: 1.064vw; | |||
// border-left: 10px solid transparent; | |||
// border-bottom: 10px solid #0175dc; | |||
// border-top: 10px solid transparent; | |||
// border-right: 10px solid #0175dc; | |||
border-left: 0.532vw solid transparent; | |||
border-bottom: 0.532vw solid #0175dc; | |||
border-top: 0.532vw solid transparent; | |||
border-right: 0.532vw solid #0175dc; | |||
} | |||
.gradient-to-right { | |||
background: linear-gradient(to right, #0c3f68cc, transparent); | |||
} | |||
.gradient-to-left { | |||
background: linear-gradient(to left, #0c3f68cc, transparent); | |||
} | |||
.body-gradient-to-right { | |||
background: linear-gradient(to right, #0003, transparent); | |||
} | |||
.body-gradient-to-left { | |||
background: linear-gradient(to left, #0003, transparent); | |||
} | |||
} | |||
</style> |
@@ -17,12 +17,12 @@ | |||
<db-header class="db-header"></db-header> | |||
<div class="db-body"> | |||
<div class="db-left"> | |||
<db-container icon="cube" title="FTO投入" @refresh="() => (ftoKey = Math.random())"> | |||
<left-container icon="cube" title="FTO投入" @refresh="() => (ftoKey = Math.random())"> | |||
<fto-chart :key="ftoKey" /> | |||
</db-container> | |||
<db-container icon="chip2" title="芯片投入" @refresh="() => (chipInvestKey = Math.random())"> | |||
</left-container> | |||
<left-container icon="chip2" title="芯片投入" @refresh="() => (chipInvestKey = Math.random())"> | |||
<chip-invest-chart :key="chipInvestKey" /> | |||
</db-container> | |||
</left-container> | |||
</div> | |||
<div class="db-right"> | |||
<db-container side="right" icon="chip" title="芯片产出" @refresh="() => (chipYieldKey = Math.random())"> | |||
@@ -53,6 +53,7 @@ import store from "@/store"; | |||
import DashboardHeader from "./dashboard/components/Header.vue"; | |||
import CompanyInfo from "./dashboard/components/CompanyInfo.vue"; | |||
import Container from "./dashboard/components/Container.vue"; | |||
import leftContainer from "./dashboard/components/leftContainer.vue"; | |||
import FtoChart from "./dashboard/charts/Fto.vue"; | |||
import ChipInvestChart from "./dashboard/charts/ChipInvest.vue"; | |||
import BipvChart from "./dashboard/charts/Bipv.vue"; | |||
@@ -84,6 +85,7 @@ export default { | |||
name: "Index", | |||
components: { | |||
CompanyInfo, | |||
leftContainer, | |||
ksCompanyInfo: CompanyInfo, | |||
hdCompanyInfo: CompanyInfo, | |||
bbCompanyInfo: CompanyInfo, | |||
@@ -340,7 +342,7 @@ export default { | |||
.db-left, | |||
.db-right { | |||
// width: 420px; | |||
width: 24vw; | |||
width: 24.5vw; | |||
padding: 20px; | |||
display: flex; | |||
flex-direction: column; | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-04-15 10:49:13 | |||
* @LastEditTime: 2024-07-05 09:21:12 | |||
* @LastEditTime: 2024-07-08 14:38:25 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -415,7 +415,7 @@ export default { | |||
type: 'bar', | |||
stack: String(fac.id), | |||
data: Array(xAxisData.length).fill(0), | |||
barWidth: 20, | |||
barWidth: 16, | |||
itemStyle: { | |||
color: this.colorList[i] | |||
}, | |||
@@ -441,7 +441,7 @@ export default { | |||
type: 'bar', | |||
stack: String(fac.id), | |||
data: Array(xAxisData.length).fill(0), | |||
barWidth: 20, | |||
barWidth: 16, | |||
itemStyle: { | |||
color: this.colorList[i] | |||
}, | |||
@@ -472,7 +472,7 @@ export default { | |||
// type: 'bar', | |||
// stack: String(fac.id), | |||
// data: Array(xAxisData.length).fill(0), | |||
// barWidth: 20, | |||
// barWidth: 16, | |||
// itemStyle: { | |||
// color: this.colorList[i] | |||
// } | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2023-11-06 15:15:30 | |||
* @LastEditTime: 2024-07-05 15:16:01 | |||
* @LastEditTime: 2024-07-08 15:06:49 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -9,7 +9,7 @@ | |||
<el-drawer class="drawer" :visible.sync="visible" size="85%" @closed="$emit('destroy')"> | |||
<small-title slot="title" :no-padding="true"> | |||
{{ '详情' }} | |||
<el-button type="primary" plain size="small" style="float: right" @click="exportDetail">导出</el-button> | |||
<!-- <el-button type="primary" plain size="small" style="float: right" @click="exportDetail">导出</el-button> --> | |||
</small-title> | |||
<div ref="detail" class="detailBox"> | |||
<el-row :gutter="20"> | |||
@@ -304,7 +304,7 @@ export default { | |||
{ | |||
data: barData, | |||
type: 'bar', | |||
barWidth: '40%', | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
@@ -402,7 +402,7 @@ export default { | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: '50%', | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
@@ -0,0 +1,129 @@ | |||
<template> | |||
<div class="dayRepExpBox"> | |||
<!-- <el-row> | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">产品良率</div> | |||
<div class="box2"> | |||
<productYield ref="productYield" :beProcessObj="beProcessObj" /> | |||
</div> | |||
</el-col> | |||
</el-row> --> | |||
<el-row> | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">待制品分布</div> | |||
<div class="box2"> | |||
<beProcessed ref="beProcess" :beProcessObj="beProcessObj" /> | |||
</div> | |||
</el-col> | |||
</el-row> | |||
<!-- <el-row> | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">生产明细</div> | |||
<div class="box2"> | |||
<produceDetail ref="produceDetail" :beProcessObj="beProcessObj" /> | |||
</div> | |||
</el-col> | |||
</el-row> | |||
<el-row> | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">历史趋势</div> | |||
<div class="box2"> | |||
<hisChart ref="hisChart" :beProcessObj="beProcessObj" /> | |||
</div> | |||
</el-col> | |||
</el-row> --> | |||
</div> | |||
</template> | |||
<script> | |||
import hisChart from './dayReportExportChart/hisChart' | |||
import produceDetail from './dayReportExportChart/produceDetail' | |||
import productYield from './dayReportExportChart/productYield' | |||
import beProcessed from './dayReportExportChart/beProcessed.vue' | |||
export default { | |||
name: 'ExportDayReport', | |||
components: { hisChart, produceDetail, productYield, beProcessed }, | |||
props: { | |||
productionOverviewVo: { | |||
type: Object, | |||
default: () => { } | |||
}, | |||
equipmentUtilizationVo: { | |||
type: Object, | |||
default: () => { } | |||
}, | |||
chipPowerTrendVo: { | |||
type: Object, | |||
default: () => { } | |||
}, | |||
beProcessObj: { | |||
type: Object, | |||
default: () => { } | |||
}, | |||
}, | |||
data() { | |||
return { | |||
tableData1: [], | |||
tableData2: [] | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
handler(newValue, oldValue) { | |||
this.$refs.beProcess.canvasReset() | |||
} | |||
} | |||
}, | |||
mounted() { | |||
this.getData() | |||
}, | |||
methods: { | |||
getData() { | |||
console.log(this.beProcessObj); | |||
this.$refs.beProcess.canvasReset() | |||
// this.$refs.productYield.canvasReset() | |||
// this.$refs.produceDetail.canvasReset() | |||
// this.$refs.hisChart.canvasReset() | |||
} | |||
} | |||
} | |||
</script> | |||
<style lang='scss' scoped> | |||
.dayRepExpBox { | |||
width: 595px; | |||
height: 842px; | |||
padding: 15px 20px 0; | |||
background-color: #fff; | |||
z-index: 2000; | |||
.box2{ | |||
width: 555px; | |||
height: 200px; | |||
border: 2px solid #ECECEC; | |||
border-left: 0; | |||
} | |||
.box3{ | |||
width: 555px; | |||
height: 200px; | |||
border: 2px solid #ECECEC; | |||
} | |||
.box5{ | |||
width: 555px; | |||
height: 200px; | |||
border: 2px solid #ECECEC; | |||
border-left: 0; | |||
} | |||
.box6{ | |||
width: 555px; | |||
height: 200px; | |||
border: 2px solid #ECECEC; | |||
position: relative; | |||
.rightTitle{ | |||
position: absolute; | |||
right: 5px; | |||
top:2px; | |||
font-size: 8px; | |||
color: #383838; | |||
} | |||
} | |||
} | |||
</style> |
@@ -0,0 +1,111 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:50:34 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div id="chipPowerExpChart" style="width:552px;height:200px;" /> | |||
</template> | |||
<script> | |||
import * as echarts from 'echarts' | |||
// import resize from './../../../mixins/resize' | |||
import { debounce } from "@/utils/debounce"; | |||
export default { | |||
name: 'ChipPowerExp', | |||
// mixins: [resize], | |||
props: { | |||
beProcessObj: { | |||
type: Object, | |||
default: () => {} | |||
} | |||
}, | |||
data() { | |||
return { | |||
chart: null | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
handler(newValue, oldValue) { | |||
console.log(newValue); | |||
this.canvasReset() | |||
} | |||
} | |||
}, | |||
mounted() { | |||
this.canvasReset() | |||
}, | |||
methods: { | |||
canvasReset() { | |||
debounce(() => { | |||
this.updateChart(); | |||
}, 500)(); | |||
}, | |||
updateChart() { | |||
if ( | |||
this.chart !== null && | |||
this.chart !== '' && | |||
this.chart !== undefined | |||
) { | |||
this.chart.dispose() | |||
} | |||
// console.log(this.beProcessObj); | |||
this.chart = echarts.init(document.getElementById('chipPowerExpChart'), null, { devicePixelRatio: 2 }) | |||
// const legendName = Object.keys(this.chipPowerDistributionVo) | |||
let xAxisList = this.beProcessObj.xAxisList | |||
let yAxisList = this.beProcessObj.yAxisList | |||
// const values = Object.values(this.chipPowerDistributionVo) | |||
var option = { | |||
// title: { | |||
// text: '待制品分布', | |||
// left: 'center' | |||
// // subtext: 'Fake Data' | |||
// }, | |||
color: ['#3E8EF7'], | |||
tooltip: { | |||
trigger: 'axis' | |||
}, | |||
// grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, | |||
calculable: true, | |||
grid: { | |||
top: '15%', | |||
left: 10, | |||
right: 0, | |||
bottom: 0, | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xAxisList, | |||
axisLabel: { | |||
rotate: 25 | |||
// width: '10%' | |||
} | |||
}, | |||
yAxis: { | |||
type: 'value', | |||
name: '单位/片', | |||
axisLine: { | |||
show: true | |||
} | |||
}, | |||
series: [ | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
} | |||
} | |||
] | |||
} | |||
option && this.chart.setOption(option) | |||
} | |||
} | |||
} | |||
</script> |
@@ -0,0 +1,110 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:40:58 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div id="hisChart" style="width:552px;height:200px;" /> | |||
</template> | |||
<script> | |||
import * as echarts from 'echarts' | |||
// import resize from './../../../mixins/resize' | |||
import { debounce } from "@/utils/debounce"; | |||
export default { | |||
name: 'ChipPowerExp', | |||
// mixins: [resize], | |||
props: { | |||
beProcessObj: { | |||
type: Object, | |||
default: () => { } | |||
} | |||
}, | |||
data() { | |||
return { | |||
chart: null | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
handler(newValue, oldValue) { | |||
this.canvasReset() | |||
} | |||
} | |||
}, | |||
mounted() { | |||
this.canvasReset() | |||
}, | |||
methods: { | |||
canvasReset() { | |||
debounce(() => { | |||
this.updateChart(); | |||
}, 500)(); | |||
}, | |||
updateChart() { | |||
if ( | |||
this.chart !== null && | |||
this.chart !== '' && | |||
this.chart !== undefined | |||
) { | |||
this.chart.dispose() | |||
} | |||
console.log(this.beProcessObj); | |||
this.chart = echarts.init(document.getElementById('hisChart'), null, { devicePixelRatio: 2 }) | |||
// const legendName = Object.keys(this.chipPowerDistributionVo) | |||
let xAxisList = this.beProcessObj.xAxisList | |||
let yAxisList = this.beProcessObj.yAxisList | |||
// const values = Object.values(this.chipPowerDistributionVo) | |||
var option = { | |||
// title: { | |||
// text: '待制品分布', | |||
// left: 'center' | |||
// // subtext: 'Fake Data' | |||
// }, | |||
color: ['#3E8EF7'], | |||
tooltip: { | |||
trigger: 'axis' | |||
}, | |||
// grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, | |||
calculable: true, | |||
grid: { | |||
top: '15%', | |||
left: 10, | |||
right: 0, | |||
bottom: 0, | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xAxisList, | |||
axisLabel: { | |||
rotate: 25 | |||
// width: '10%' | |||
} | |||
}, | |||
yAxis: { | |||
type: 'value', | |||
name: '单位/片', | |||
axisLine: { | |||
show: true | |||
} | |||
}, | |||
series: [ | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
} | |||
} | |||
] | |||
} | |||
option && this.chart.setOption(option) | |||
} | |||
} | |||
} | |||
</script> |
@@ -0,0 +1,110 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:41:11 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div id="produceDetail" style="width:552px;height:200px;" /> | |||
</template> | |||
<script> | |||
import * as echarts from 'echarts' | |||
// import resize from './../../../mixins/resize' | |||
import { debounce } from "@/utils/debounce"; | |||
export default { | |||
name: 'ChipPowerExp', | |||
// mixins: [resize], | |||
props: { | |||
beProcessObj: { | |||
type: Object, | |||
default: () => { } | |||
} | |||
}, | |||
data() { | |||
return { | |||
chart: null | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
handler(newValue, oldValue) { | |||
this.canvasReset() | |||
} | |||
} | |||
}, | |||
mounted() { | |||
this.canvasReset() | |||
}, | |||
methods: { | |||
canvasReset() { | |||
debounce(() => { | |||
this.updateChart(); | |||
}, 500)(); | |||
}, | |||
updateChart() { | |||
if ( | |||
this.chart !== null && | |||
this.chart !== '' && | |||
this.chart !== undefined | |||
) { | |||
this.chart.dispose() | |||
} | |||
console.log(this.beProcessObj); | |||
this.chart = echarts.init(document.getElementById('produceDetail'), null, { devicePixelRatio: 2 }) | |||
// const legendName = Object.keys(this.chipPowerDistributionVo) | |||
let xAxisList = this.beProcessObj.xAxisList | |||
let yAxisList = this.beProcessObj.yAxisList | |||
// const values = Object.values(this.chipPowerDistributionVo) | |||
var option = { | |||
// title: { | |||
// text: '待制品分布', | |||
// left: 'center' | |||
// // subtext: 'Fake Data' | |||
// }, | |||
color: ['#3E8EF7'], | |||
tooltip: { | |||
trigger: 'axis' | |||
}, | |||
// grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, | |||
calculable: true, | |||
grid: { | |||
top: '15%', | |||
left: 10, | |||
right: 0, | |||
bottom: 0, | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xAxisList, | |||
axisLabel: { | |||
rotate: 25 | |||
// width: '10%' | |||
} | |||
}, | |||
yAxis: { | |||
type: 'value', | |||
name: '单位/片', | |||
axisLine: { | |||
show: true | |||
} | |||
}, | |||
series: [ | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
} | |||
} | |||
] | |||
} | |||
option && this.chart.setOption(option) | |||
} | |||
} | |||
} | |||
</script> |
@@ -0,0 +1,110 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:41:20 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div id="productYield" style="width:552px;height:200px;" /> | |||
</template> | |||
<script> | |||
import * as echarts from 'echarts' | |||
// import resize from './../../../mixins/resize' | |||
import { debounce } from "@/utils/debounce"; | |||
export default { | |||
name: 'ChipPowerExp', | |||
// mixins: [resize], | |||
props: { | |||
beProcessObj: { | |||
type: Object, | |||
default: () => { } | |||
} | |||
}, | |||
data() { | |||
return { | |||
chart: null | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
handler(newValue, oldValue) { | |||
this.canvasReset() | |||
} | |||
} | |||
}, | |||
mounted() { | |||
this.canvasReset() | |||
}, | |||
methods: { | |||
canvasReset() { | |||
debounce(() => { | |||
this.updateChart(); | |||
}, 500)(); | |||
}, | |||
updateChart() { | |||
if ( | |||
this.chart !== null && | |||
this.chart !== '' && | |||
this.chart !== undefined | |||
) { | |||
this.chart.dispose() | |||
} | |||
console.log(this.beProcessObj); | |||
this.chart = echarts.init(document.getElementById('productYield'), null, { devicePixelRatio: 2 }) | |||
// const legendName = Object.keys(this.chipPowerDistributionVo) | |||
let xAxisList = this.beProcessObj.xAxisList | |||
let yAxisList = this.beProcessObj.yAxisList | |||
// const values = Object.values(this.chipPowerDistributionVo) | |||
var option = { | |||
// title: { | |||
// text: '待制品分布', | |||
// left: 'center' | |||
// // subtext: 'Fake Data' | |||
// }, | |||
color: ['#3E8EF7'], | |||
tooltip: { | |||
trigger: 'axis' | |||
}, | |||
// grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, | |||
calculable: true, | |||
grid: { | |||
top: '15%', | |||
left: 10, | |||
right: 0, | |||
bottom: 0, | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xAxisList, | |||
axisLabel: { | |||
rotate: 25 | |||
// width: '10%' | |||
} | |||
}, | |||
yAxis: { | |||
type: 'value', | |||
name: '单位/片', | |||
axisLine: { | |||
show: true | |||
} | |||
}, | |||
series: [ | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
} | |||
} | |||
] | |||
} | |||
option && this.chart.setOption(option) | |||
} | |||
} | |||
} | |||
</script> |
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-04-15 10:49:13 | |||
* @LastEditTime: 2024-07-08 08:50:26 | |||
* @LastEditTime: 2024-07-08 16:54:13 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -10,7 +10,7 @@ | |||
<el-row :gutter="10"> | |||
<el-col :span="4"> | |||
<div class="app-container" style="padding: 16px; height: auto; text-align: left; border-radius: 8px;"> | |||
<!-- <p style="margin-bottom: 0">数据概览</p> --> | |||
<!-- <p style="margin-bottom: 0">数据概览</p> --> | |||
<div class="view"> | |||
<div style="padding: 10px 0; width: 100%"> | |||
<div class="topDiv"> | |||
@@ -27,13 +27,14 @@ | |||
</el-col> | |||
<el-col :span="20"> | |||
<div class="app-container" style="padding: 16px; height: auto; text-align: left; border-radius: 8px;"> | |||
<!-- <p style="margin-bottom: 0">数据概览</p> --> | |||
<!-- <p style="margin-bottom: 0">数据概览</p> --> | |||
<div class="view"> | |||
<div style="padding: 10px 0; width: 100%" v-for="(item, index) in factorys" :key="index"> | |||
<div class="topDiv"> | |||
<div style="width: 4px; height: 52px; background: #3A79FF; border-radius: 2px;"></div> | |||
<div class="centerDiv"> | |||
<span style="font-size: 30px; line-height: 30px; color: rgba(0,0,0,0.85);">{{ factoryNum[index] }}</span> | |||
<span style="font-size: 30px; line-height: 30px; color: rgba(0,0,0,0.85);">{{ factoryNum[index] | |||
}}</span> | |||
<span style="font-size: 14px; color: rgba(0,0,0,0.85);">{{item}}</span> | |||
</div> | |||
<svg-icon icon-class="factoryWorkOrder" style="width: 26px; height: 26px" /> | |||
@@ -49,27 +50,28 @@ | |||
<div class="app-container" style="margin-top: 8px;flex-grow: 1;"> | |||
<!-- <search-bar :formConfigs="formConfig2" ref="searchBarForm" style="margin-bottom: 0" /> --> | |||
<search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | |||
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" | |||
:table-data="tableData" :max-height="tableH"> | |||
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" :table-data="tableData" | |||
:max-height="tableH"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" fixed="right" | |||
:method-list="tableBtn" @clickBtn="handleClick" /> | |||
</base-table> | |||
<pagination | |||
:limit.sync="listQuery.pageSize" | |||
:page.sync="listQuery.pageNo" | |||
:total="listQuery.total" | |||
@pagination="getDataList" | |||
/> | |||
<pagination :limit.sync="listQuery.pageSize" :page.sync="listQuery.pageNo" :total="listQuery.total" | |||
@pagination="getDataList" /> | |||
</div> | |||
<add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date" | |||
@refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> | |||
<div id="dayRepDom" style="position: absolute;top:0;display: none;"> | |||
<ExportDayReport :beProcessObj="beProcessObj" /> | |||
</div> | |||
<add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date" @refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> | |||
</div> | |||
</template> | |||
<script> | |||
// import { parseTime } from '../../core/mixins/code-filter'; | |||
import { getWorkOrderPage, exportExcel, getOverView } from '@/api/produceData/order'; | |||
import { getWorkOrderPage, exportExcel, getOverView, getWorkOrderDetail } from '@/api/produceData/order'; | |||
// import inputTable from './inputTable.vue'; | |||
import lineChart from './lineChart'; | |||
import ExportDayReport from './dayReportComponents/ExportDayReport' | |||
import moment from 'moment' | |||
import tableHeightMixin from "@/mixins/tableHeightMixin"; | |||
// import ButtonNav from '@/components/ButtonNav' | |||
@@ -78,11 +80,12 @@ import AddOrUpdate from './add-or-updata'; | |||
import { factoryList, factoryArray } from "@/utils/constants"; | |||
// import { publicFormatter } from "@/utils/dict"; | |||
import statusChart from "./statusChart.vue"; | |||
import html2canvas from 'html2canvas' | |||
import JsPDF from 'jspdf' | |||
// import FileSaver from 'file-saver' | |||
// import * as XLSX from 'xlsx' | |||
export default { | |||
components: { lineChart, AddOrUpdate }, | |||
components: { lineChart, AddOrUpdate, ExportDayReport }, | |||
mixins: [basicPage, tableHeightMixin], | |||
data() { | |||
return { | |||
@@ -91,6 +94,10 @@ export default { | |||
inputNum: 0, | |||
heightNum: 180, | |||
factoryList, | |||
beProcessObj: { | |||
xAxisList: [], | |||
yAxisList:[] | |||
}, | |||
factoryArray, | |||
listQuery: { | |||
pageSize: 20, | |||
@@ -106,6 +113,10 @@ export default { | |||
type: 'detail', | |||
btnName: '详情', | |||
}, | |||
{ | |||
type: 'export', | |||
btnName: '导出', | |||
}, | |||
// { | |||
// type: 'delete', | |||
// btnName: '删除', | |||
@@ -281,6 +292,26 @@ export default { | |||
this.getOverView() | |||
}, | |||
methods: { | |||
exportPDF() { | |||
this.$message.success('正在导出,请稍等!') | |||
const element = document.getElementById('dayRepDom') | |||
element.style.display = 'block' | |||
const fileName = '瑞昌碲化镉生产日报' + moment().format('yyMMDD') + '.pdf' | |||
html2canvas(element, { | |||
dpi: 300, // Set to 300 DPI | |||
scale: 3 // Adjusts your resolution | |||
}).then(function (canvas) { | |||
const imgWidth = 595.28 | |||
const imgHeight = 841.89 | |||
const pageData = canvas.toDataURL('image/jpeg', 1.0) | |||
const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight]) | |||
PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight) | |||
setTimeout(() => { | |||
PDF.save(fileName) // 导出文件名 | |||
}, 1000) | |||
}) | |||
element.style.display = 'none' | |||
}, | |||
getOverView() { | |||
getOverView().then(res => { | |||
// this.data = res.data | |||
@@ -298,12 +329,43 @@ export default { | |||
} | |||
}) | |||
}, | |||
otherMethods(val) { | |||
this.detailOrUpdateVisible = true; | |||
// this.addOrEditTitle = "详情"; | |||
this.$nextTick(() => { | |||
this.$refs.detailOrUpdate.init(val.data.id); | |||
}); | |||
async otherMethods(val) { | |||
console.log(val) | |||
if (val.type === 'detail') { | |||
this.detailOrUpdateVisible = true; | |||
// this.addOrEditTitle = "详情"; | |||
this.$nextTick(() => { | |||
this.$refs.detailOrUpdate.init(val.data.id); | |||
}); | |||
} else { | |||
const res = await getWorkOrderDetail(val.data.id) | |||
if (res.code === 0) { | |||
// this.loading = false | |||
// this.dataForm = res.data.prodWorkOrderDO | |||
// this.buildChart(this.dataForm) | |||
// 在制品 | |||
const xAxisList = Object.keys(res.data.inProcessDis) | |||
const yAxisList = Object.values(res.data.inProcessDis) | |||
this.beProcessObj.xAxisList = xAxisList | |||
this.beProcessObj.yAxisList = yAxisList | |||
console.log(this.beProcessObj); | |||
// this.initEqLineChart(xAxisList, yAxisList) | |||
// 趋势图 | |||
const seriesList = [] | |||
const dateList = [] | |||
// res.data.his.forEach(element => { | |||
// seriesList.push(element.actualProduction) | |||
// dateList.push(element.recordTime[0] + '-' + element.recordTime[1] + '-' + element.recordTime[2]) | |||
// }) | |||
// this.initLineChart(dateList, seriesList) | |||
this.$nextTick(() => { | |||
this.exportPDF() | |||
}) | |||
} | |||
// if (this.dataForm.orderStatus === 1) { | |||
// this.trend() | |||
// } | |||
} | |||
}, | |||
async getDataList() { | |||
const res = await getWorkOrderPage(this.listQuery) | |||
@@ -96,7 +96,7 @@ export default { | |||
name: "", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -110,7 +110,7 @@ export default { | |||
name: "", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -273,7 +273,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -287,7 +287,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -93,7 +93,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -107,7 +107,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -285,7 +285,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -299,7 +299,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -93,7 +93,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -107,7 +107,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -272,7 +272,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -286,7 +286,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -96,7 +96,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -110,7 +110,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -273,7 +273,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -287,7 +287,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -73,13 +73,13 @@ export default { | |||
name: "1", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
}, | |||
{ | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: "-100%", | |||
label: { | |||
show: true, | |||
@@ -98,13 +98,13 @@ export default { | |||
name: "1", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
}, | |||
{ | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: "-100%", | |||
label: { | |||
show: true, | |||
@@ -258,13 +258,13 @@ export default { | |||
name: "1", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
}, | |||
{ | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: "-100%", | |||
label: { | |||
show: true, | |||
@@ -283,13 +283,13 @@ export default { | |||
name: "1", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
}, | |||
{ | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: "-100%", | |||
label: { | |||
show: true, | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-06-19 15:28:34 | |||
* @LastEditTime: 2024-07-05 13:43:22 | |||
* @LastEditTime: 2024-07-08 14:19:57 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -51,12 +51,15 @@ export default { | |||
}, | |||
}, | |||
formatter: function (params) { | |||
// console.log('params', params); | |||
console.log('params', params) | |||
var res = `<span style='color:rgba(0,0,0,0.8)'>${params[0].axisValueLabel}</span>`; | |||
for (var i = 0, l = params.length; i < l; i++) { | |||
res += | |||
"<br/>" + | |||
`<span style='display:inline-block;margin-right:4px;width:10px;height:10px;background-color:${params[i].color}'></span>` + | |||
`${params[i].seriesType === "line" | |||
? '<img width="11" height="11" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />' | |||
: `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}"></span>` | |||
}` + | |||
`<span style='display:inline-block;width:150px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` + | |||
`<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${params[i].seriesName === "综合良率" | |||
? (params[i].value ? params[i].value.toFixed(2) : 0.0) + "%" | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-04-15 10:49:13 | |||
* @LastEditTime: 2024-07-08 13:18:08 | |||
* @LastEditTime: 2024-07-08 13:39:32 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -20,9 +20,9 @@ | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime"> | |||
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" range-separator="至" | |||
start-placeholder="开始日期" value-format="yyyy-MM-dd" format="yyyy-MM-dd" @change="changeDayTime" | |||
end-placeholder="结束日期"> | |||
<el-date-picker prefix-icon="el-icon-date" 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="结束日期"> | |||
</el-date-picker> | |||
</el-form-item> | |||
<el-form-item v-show="listQuery.type === 1" label="时间范围" prop="reportTime"> | |||
@@ -96,7 +96,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -110,7 +110,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -273,7 +273,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -287,7 +287,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -93,7 +93,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -107,7 +107,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -285,7 +285,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -299,7 +299,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -96,7 +96,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -110,7 +110,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -273,7 +273,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -287,7 +287,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -13,7 +13,7 @@ | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item v-show="listQuery.date === 0 || listQuery.date === ''" label="时间范围" prop="reportTime"> | |||
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" 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="结束日期"> | |||
</el-date-picker> | |||
@@ -201,7 +201,7 @@ export default { | |||
name: "单位/%", | |||
nameTextStyle: { | |||
fontSize: 12, | |||
align: "right", | |||
align: "left", | |||
}, | |||
axisLabel: {}, | |||
} | |||
@@ -212,7 +212,7 @@ export default { | |||
// yAxisIndex: 0, | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -227,7 +227,7 @@ export default { | |||
type: 'bar', | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -276,7 +276,7 @@ export default { | |||
// splitNumber: 5, | |||
nameTextStyle: { | |||
fontSize: 12, | |||
align: "right", | |||
align: "left", | |||
}, | |||
axisLabel: {}, | |||
} | |||
@@ -287,7 +287,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-0, -16], | |||
@@ -302,7 +302,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -11,7 +11,7 @@ | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime"> | |||
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" 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="结束日期"> | |||
</el-date-picker> | |||
@@ -192,7 +192,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -206,7 +206,7 @@ export default { | |||
name: "标准组件总功率", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -258,7 +258,7 @@ export default { | |||
name: "芯片总功率", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-10, -16], | |||
@@ -273,7 +273,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -648,7 +648,7 @@ export default { | |||
// { name: "%", value: 18.4 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
// barGap: '-100%', | |||
label: { | |||
show: true, | |||
@@ -686,7 +686,7 @@ export default { | |||
{ name: "标准组件总功率完成值", value: obj.componentTotalPower,titleValue:obj.componentTotalPower }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -706,7 +706,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -810,7 +810,7 @@ export default { | |||
// { name: "%", value: 18.4 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
// barGap: '-100%', | |||
label: { | |||
show: true, | |||
@@ -851,7 +851,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -871,7 +871,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -11,7 +11,7 @@ | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime"> | |||
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" 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="结束日期"> | |||
</el-date-picker> | |||
@@ -195,7 +195,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
color: "#8EF0AB", | |||
@@ -210,7 +210,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -225,7 +225,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [18, -16], | |||
@@ -239,7 +239,7 @@ export default { | |||
name: "BIPV产量", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [20, -16], | |||
@@ -302,7 +302,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -317,7 +317,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -332,7 +332,7 @@ export default { | |||
data: [ | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [5, -16], | |||
@@ -346,7 +346,7 @@ export default { | |||
name: "BIPV产量", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [10, -16], | |||
@@ -752,7 +752,7 @@ export default { | |||
// { name: "%", value: 85 }, | |||
// ], | |||
// type: "bar", | |||
// barWidth: 20, | |||
// barWidth: 16, | |||
// barGap: '0', | |||
// label: { | |||
// show: true, | |||
@@ -803,7 +803,7 @@ export default { | |||
// { name: "%", value: 85 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
stack: 'f', | |||
label: { | |||
show: true, | |||
@@ -823,7 +823,7 @@ export default { | |||
// { name: "%", value: 85 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
stack: 'f', | |||
label: { | |||
show: true, | |||
@@ -845,7 +845,7 @@ export default { | |||
// { name: "%", value: 18.4 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
// barGap: '-100%', | |||
label: { | |||
show: true, | |||
@@ -866,7 +866,7 @@ export default { | |||
// { name: "%", value: 18.4 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
// barGap: '-100%', | |||
label: { | |||
show: true, | |||
@@ -887,7 +887,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
color: "rgba(100,189,255)", | |||
show: true, | |||
@@ -907,7 +907,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -928,7 +928,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -948,7 +948,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -1033,7 +1033,7 @@ export default { | |||
// { name: "%", value: 85 }, | |||
// ], | |||
// type: "bar", | |||
// barWidth: 20, | |||
// barWidth: 16, | |||
// barGap: '0', | |||
// label: { | |||
// show: true, | |||
@@ -1082,7 +1082,7 @@ export default { | |||
// { name: "%", value: 85 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
stack: 'f', | |||
label: { | |||
show: true, | |||
@@ -1102,7 +1102,7 @@ export default { | |||
// { name: "%", value: 85 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
stack: 'f', | |||
label: { | |||
show: true, | |||
@@ -1124,7 +1124,7 @@ export default { | |||
// { name: "%", value: 18.4 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
// barGap: '-100%', | |||
label: { | |||
show: true, | |||
@@ -1145,7 +1145,7 @@ export default { | |||
// { name: "%", value: 18.4 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
// barGap: '-100%', | |||
label: { | |||
show: true, | |||
@@ -1166,7 +1166,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
color: "rgba(100,189,255)", | |||
show: true, | |||
@@ -1186,7 +1186,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -1207,7 +1207,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -1227,7 +1227,7 @@ export default { | |||
// { name: "%", value: 80.2 }, | |||
], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -13,7 +13,7 @@ | |||
</el-select> | |||
</el-form-item> | |||
<el-form-item v-show="listQuery.type === 0 || listQuery.type === ''" label="时间范围" prop="reportTime"> | |||
<el-date-picker size="small" clearable v-model="listQuery.reportTime" type="datetimerange" 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="结束日期"> | |||
</el-date-picker> | |||
@@ -199,7 +199,7 @@ export default { | |||
name: "单位/%", | |||
nameTextStyle: { | |||
fontSize: 12, | |||
align: "right", | |||
align: "left", | |||
}, | |||
axisLabel: {}, | |||
} | |||
@@ -210,7 +210,7 @@ export default { | |||
// yAxisIndex: 0, | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -225,7 +225,7 @@ export default { | |||
// type: 'bar', | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -273,18 +273,18 @@ export default { | |||
splitNumber: 4, | |||
nameTextStyle: { | |||
fontSize: 12, | |||
align: "right", | |||
align: "left", | |||
}, | |||
axisLabel: {}, | |||
} | |||
], | |||
series: [ | |||
{ | |||
name: "", | |||
name: "FTO投入", | |||
// yAxisIndex: 0, | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
yAxisIndex: 0, | |||
label: { | |||
show: true, | |||
@@ -296,12 +296,12 @@ export default { | |||
}, | |||
}, | |||
{ | |||
name: "", | |||
name: "芯片产量", | |||
// yAxisIndex: 0, | |||
data: [], | |||
yAxisIndex: 0, | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -312,12 +312,12 @@ export default { | |||
}, | |||
}, | |||
{ | |||
name: "", | |||
name: "标准组件产量", | |||
// yAxisIndex: 0, | |||
data: [], | |||
type: "bar", | |||
yAxisIndex: 0, | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -328,10 +328,10 @@ export default { | |||
}, | |||
}, | |||
{ | |||
name: "", | |||
name: "综合良率", | |||
data: [], | |||
type: "line", | |||
// barWidth: 20, | |||
// barWidth: 16, | |||
symbol: "circle", | |||
symbolSize: 6, | |||
yAxisIndex: 1, | |||
@@ -93,7 +93,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -107,7 +107,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -285,7 +285,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -299,7 +299,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -93,7 +93,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -107,7 +107,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -272,7 +272,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
// position: [-5, -16], | |||
@@ -286,7 +286,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -96,7 +96,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -110,7 +110,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -273,7 +273,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [-18, -16], | |||
@@ -287,7 +287,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: [0, -16], | |||
@@ -83,7 +83,7 @@ export default { | |||
name: "1", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: 0.5, | |||
label: { | |||
show: true, | |||
@@ -99,7 +99,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||
@@ -114,7 +114,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||
@@ -129,7 +129,7 @@ export default { | |||
name: "4", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||
@@ -237,7 +237,7 @@ export default { | |||
name: "1", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: 0.5, | |||
label: { | |||
show: true, | |||
@@ -253,7 +253,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: "100%", | |||
label: { | |||
show: true, | |||
@@ -269,7 +269,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||
@@ -284,7 +284,7 @@ export default { | |||
name: "4", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||
@@ -376,7 +376,7 @@ export default { | |||
name: "1", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
barGap: 0.5, | |||
label: { | |||
show: true, | |||
@@ -392,7 +392,7 @@ export default { | |||
name: "2", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||
@@ -407,7 +407,7 @@ export default { | |||
name: "3", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||
@@ -422,7 +422,7 @@ export default { | |||
name: "4", | |||
data: [], | |||
type: "bar", | |||
barWidth: 20, | |||
barWidth: 16, | |||
label: { | |||
show: true, | |||
position: "top", | |||