fix:数据大屏不显示AVG
This commit is contained in:
parent
3a7deef1bf
commit
c5ac695a47
|
|
@ -7,84 +7,35 @@
|
||||||
</el-header>
|
</el-header>
|
||||||
<el-main id="mainBlock">
|
<el-main id="mainBlock">
|
||||||
<el-row style="height: 100%">
|
<el-row style="height: 100%">
|
||||||
<div
|
<div class="leftPosition">
|
||||||
style="position: absolute; left: 0; width: 20%; z-index: 10"
|
<div class="leftPositionContainer">
|
||||||
>
|
|
||||||
<div
|
|
||||||
style="
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
padding: 0 10px;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<div class="flexItem" style="flex: 1">
|
<div class="flexItem" style="flex: 1">
|
||||||
<div class="blockTitle">
|
<div class="blockTitle">
|
||||||
<div class="blockTitleIcon"></div>
|
<div class="blockTitleIcon"></div>
|
||||||
<div>本周交付数</div>
|
<div>本周交付数</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div id="line1"></div>
|
||||||
id="line1"
|
|
||||||
style="
|
|
||||||
width: 100%;
|
|
||||||
height: 92%;
|
|
||||||
background: rgba(9, 31, 43, 0.5);
|
|
||||||
border-radius: 20px;
|
|
||||||
margin-top: 5px;
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="flexItem" style="flex: 1">
|
<div class="flexItem" style="flex: 1">
|
||||||
<div class="blockTitle">
|
<div class="blockTitle">
|
||||||
<div class="blockTitleIcon"></div>
|
<div class="blockTitleIcon"></div>
|
||||||
<div>本周合格数</div>
|
<div>本周合格数</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div id="bar1"></div>
|
||||||
id="bar1"
|
|
||||||
style="
|
|
||||||
width: 100%;
|
|
||||||
height: 92%;
|
|
||||||
background: rgba(9, 31, 43, 0.5);
|
|
||||||
border-radius: 20px;
|
|
||||||
margin-top: 5px;
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="flexItem" style="flex: 1">
|
<div class="flexItem" style="flex: 1">
|
||||||
<div class="blockTitle">
|
<div class="blockTitle">
|
||||||
<div class="blockTitleIcon"></div>
|
<div class="blockTitleIcon"></div>
|
||||||
<div>本周合格率</div>
|
<div>本周合格率</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div id="line2"></div>
|
||||||
id="line2"
|
|
||||||
style="
|
|
||||||
width: 100%;
|
|
||||||
height: 92%;
|
|
||||||
background: rgba(9, 31, 43, 0.5);
|
|
||||||
border-radius: 20px;
|
|
||||||
margin-top: 5px;
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<div class="model">
|
<div class="model">
|
||||||
<div
|
<div class="modelContainer">
|
||||||
style="
|
<div class="modeltopTitle">
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
style="
|
|
||||||
margin: 5px 0 50px 0;
|
|
||||||
color: #fff;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: bold;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<img src="img/photon_top_line.png" />
|
<img src="img/photon_top_line.png" />
|
||||||
<span>枣庄</span>
|
<span>枣庄</span>
|
||||||
{{ currentDay }}{{ currentWeek
|
{{ currentDay }}{{ currentWeek
|
||||||
|
|
@ -95,16 +46,6 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="totalNumContnier">
|
<div class="totalNumContnier">
|
||||||
<div class="totalNumWrap totalNum_orange">
|
|
||||||
<img
|
|
||||||
class=""
|
|
||||||
src="img/number_bg_orange.png"
|
|
||||||
/>
|
|
||||||
<span class="totalNumText">AVG合格数</span>
|
|
||||||
<div class="totalNumber">
|
|
||||||
{{ countOk_AVG }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="totalNumWrap totalNumWrap_green">
|
<div class="totalNumWrap totalNumWrap_green">
|
||||||
<img src="img/number_bg_green.png" />
|
<img src="img/number_bg_green.png" />
|
||||||
<span class="totalNumText"
|
<span class="totalNumText"
|
||||||
|
|
@ -133,46 +74,16 @@
|
||||||
status="warning"
|
status="warning"
|
||||||
>
|
>
|
||||||
<template #default="{ percentage }">
|
<template #default="{ percentage }">
|
||||||
<div
|
<div class="progressNum">{{ percentage }}%</div>
|
||||||
style="
|
<div class="progressText">工厂模型加载中</div>
|
||||||
font-size: 30px;
|
|
||||||
color: white;
|
|
||||||
font-weight: bold;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
{{ percentage }}%
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
style="
|
|
||||||
font-size: 18px;
|
|
||||||
color: white;
|
|
||||||
margin-top: 10px;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
工厂模型加载中
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
</el-progress>
|
</el-progress>
|
||||||
</div>
|
</div>
|
||||||
<canvas id="renderCanvas"></canvas>
|
<canvas id="renderCanvas"></canvas>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
<div
|
<div class="rightPosition">
|
||||||
style="
|
<div class="rightPositionContainer">
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
width: 20%;
|
|
||||||
z-index: 10;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
style="
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
padding: 20px;
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<div class="flexItem" style="flex: 1">
|
<div class="flexItem" style="flex: 1">
|
||||||
<div class="blockTitle">
|
<div class="blockTitle">
|
||||||
<div class="blockTitleIcon"></div>
|
<div class="blockTitleIcon"></div>
|
||||||
|
|
@ -182,32 +93,14 @@
|
||||||
<el-radio label="10车间">10车间</el-radio>
|
<el-radio label="10车间">10车间</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div id="pie"></div>
|
||||||
id="pie"
|
|
||||||
style="
|
|
||||||
width: 100%;
|
|
||||||
height: 92%;
|
|
||||||
background: rgba(9, 31, 43, 0.5);
|
|
||||||
border-radius: 20px;
|
|
||||||
margin-top: 5px;
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="flexItem" style="flex: 1">
|
<div class="flexItem" style="flex: 1">
|
||||||
<div class="blockTitle">
|
<div class="blockTitle">
|
||||||
<div class="blockTitleIcon"></div>
|
<div class="blockTitleIcon"></div>
|
||||||
<div>本周计划完成度</div>
|
<div>本周计划完成度</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div id="line3"></div>
|
||||||
id="line3"
|
|
||||||
style="
|
|
||||||
width: 100%;
|
|
||||||
height: 92%;
|
|
||||||
background: rgba(9, 31, 43, 0.5);
|
|
||||||
border-radius: 20px;
|
|
||||||
margin-top: 5px;
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="flexItem" style="flex: 1">
|
<div class="flexItem" style="flex: 1">
|
||||||
<div class="blockTitle">
|
<div class="blockTitle">
|
||||||
|
|
@ -483,7 +376,6 @@ export default {
|
||||||
},
|
},
|
||||||
deptName: "10车间",
|
deptName: "10车间",
|
||||||
heightTimer: null,
|
heightTimer: null,
|
||||||
countOk_AVG: 0,
|
|
||||||
countOk_dept7: 0,
|
countOk_dept7: 0,
|
||||||
countOk_dept10: 0,
|
countOk_dept10: 0,
|
||||||
blockTableHeight: 0,
|
blockTableHeight: 0,
|
||||||
|
|
@ -705,37 +597,7 @@ export default {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
that.saleOutdept6 = saleOutdept6;
|
that.saleOutdept6 = saleOutdept6;
|
||||||
that.getAVGDayData();
|
that.getCountDept7();
|
||||||
});
|
|
||||||
},
|
|
||||||
//获取AVG的交付数$合格数
|
|
||||||
getAVGDayData() {
|
|
||||||
let that = this;
|
|
||||||
this.$API.wpm.otherlog.list
|
|
||||||
.req({
|
|
||||||
product: "AVG",
|
|
||||||
page: 0,
|
|
||||||
handle_date__gte: that.start_date,
|
|
||||||
handle_date__lte: that.end_date,
|
|
||||||
})
|
|
||||||
.then((res) => {
|
|
||||||
let list = res;
|
|
||||||
let count_ok = 0,
|
|
||||||
saleOutAVG = [0, 0, 0, 0, 0, 0, 0],
|
|
||||||
countOkAVG = [0, 0, 0, 0, 0, 0, 0];
|
|
||||||
if (list.length > 0) {
|
|
||||||
list.forEach((item) => {
|
|
||||||
count_ok = count_ok + item.count_ok;
|
|
||||||
let day = item.handle_date.split("-");
|
|
||||||
let index = this.weekDateList.indexOf(day[2]);
|
|
||||||
saleOutAVG[index] = item.count_delivered;
|
|
||||||
countOkAVG[index] = item.count_ok;
|
|
||||||
});
|
|
||||||
that.saleOutAVG = saleOutAVG;
|
|
||||||
that.countOkAVG = countOkAVG;
|
|
||||||
that.countOk_AVG = count_ok;
|
|
||||||
}
|
|
||||||
that.getCountDept7();
|
|
||||||
//左1---本周交付数
|
//左1---本周交付数
|
||||||
let chartDom = document.getElementById("line1");
|
let chartDom = document.getElementById("line1");
|
||||||
chartDom.style.height = this.blockHeight;
|
chartDom.style.height = this.blockHeight;
|
||||||
|
|
@ -745,9 +607,6 @@ export default {
|
||||||
trigger: "axis",
|
trigger: "axis",
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
type: "cross",
|
type: "cross",
|
||||||
label: {
|
|
||||||
backgroundColor: "#6a7985",
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
|
|
@ -758,16 +617,12 @@ export default {
|
||||||
{
|
{
|
||||||
backgroundColor: "rgb(1,235,239)",
|
backgroundColor: "rgb(1,235,239)",
|
||||||
name: "预制棒管",
|
name: "预制棒管",
|
||||||
|
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: "#fff",
|
color: "#fff",
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -781,31 +636,6 @@ export default {
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
|
||||||
name: "AVG",
|
|
||||||
textStyle: {
|
|
||||||
color: "#fff",
|
|
||||||
},
|
|
||||||
itemStyle: {
|
|
||||||
// color:'rgb(1,235,239)',
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
|
||||||
{
|
|
||||||
offset: 0,
|
|
||||||
color: "rgb(1,235,239)",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
offset: 1,
|
|
||||||
color: "rgb(5, 158, 163)",
|
|
||||||
},
|
|
||||||
]
|
|
||||||
),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
grid: {
|
grid: {
|
||||||
|
|
@ -857,42 +687,6 @@ export default {
|
||||||
{
|
{
|
||||||
name: "预制棒管",
|
name: "预制棒管",
|
||||||
type: "line",
|
type: "line",
|
||||||
stack: "Total",
|
|
||||||
smooth: true,
|
|
||||||
lineStyle: {
|
|
||||||
width: 1,
|
|
||||||
color: "rgb(1,235,239)",
|
|
||||||
},
|
|
||||||
|
|
||||||
showSymbol: false,
|
|
||||||
areaStyle: {
|
|
||||||
opacity: 0.8,
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
|
||||||
{
|
|
||||||
offset: 0,
|
|
||||||
color: "rgba(1,235,239)",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
offset: 1,
|
|
||||||
color: "rgb(5, 158, 163)",
|
|
||||||
},
|
|
||||||
]
|
|
||||||
),
|
|
||||||
},
|
|
||||||
emphasis: {
|
|
||||||
focus: "series",
|
|
||||||
},
|
|
||||||
data: that.saleOutdept6,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "AVG",
|
|
||||||
type: "line",
|
|
||||||
stack: "Total",
|
|
||||||
smooth: true,
|
smooth: true,
|
||||||
lineStyle: {
|
lineStyle: {
|
||||||
width: 1,
|
width: 1,
|
||||||
|
|
@ -902,10 +696,7 @@ export default {
|
||||||
areaStyle: {
|
areaStyle: {
|
||||||
opacity: 0.8,
|
opacity: 0.8,
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -921,11 +712,40 @@ export default {
|
||||||
emphasis: {
|
emphasis: {
|
||||||
focus: "series",
|
focus: "series",
|
||||||
},
|
},
|
||||||
data: that.saleOutAVG,
|
data: that.saleOutdept6,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
myChart.setOption(option);
|
myChart.setOption(option);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//获取AVG的交付数$合格数
|
||||||
|
getAVGDayData() {
|
||||||
|
let that = this;
|
||||||
|
this.$API.wpm.otherlog.list
|
||||||
|
.req({
|
||||||
|
product: "AVG",
|
||||||
|
page: 0,
|
||||||
|
handle_date__gte: that.start_date,
|
||||||
|
handle_date__lte: that.end_date,
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
let list = res;
|
||||||
|
let count_ok = 0,
|
||||||
|
saleOutAVG = [0, 0, 0, 0, 0, 0, 0],
|
||||||
|
countOkAVG = [0, 0, 0, 0, 0, 0, 0];
|
||||||
|
if (list.length > 0) {
|
||||||
|
list.forEach((item) => {
|
||||||
|
count_ok = count_ok + item.count_ok;
|
||||||
|
let day = item.handle_date.split("-");
|
||||||
|
let index = this.weekDateList.indexOf(day[2]);
|
||||||
|
saleOutAVG[index] = item.count_delivered;
|
||||||
|
countOkAVG[index] = item.count_ok;
|
||||||
|
});
|
||||||
|
that.saleOutAVG = saleOutAVG;
|
||||||
|
that.countOkAVG = countOkAVG;
|
||||||
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
//7车间合格数&&合格率
|
//7车间合格数&&合格率
|
||||||
|
|
@ -993,15 +813,7 @@ export default {
|
||||||
that.$API.bi.dataset.exec.req("lineDay", obj).then((res) => {
|
that.$API.bi.dataset.exec.req("lineDay", obj).then((res) => {
|
||||||
let list = res.data2.ds0;
|
let list = res.data2.ds0;
|
||||||
let countOkDept10 = [0, 0, 0, 0, 0, 0, 0],
|
let countOkDept10 = [0, 0, 0, 0, 0, 0, 0],
|
||||||
countRateDept10 = [
|
countRateDept10 = [null,null,null,null,null,null,null,];
|
||||||
null,
|
|
||||||
null,
|
|
||||||
null,
|
|
||||||
null,
|
|
||||||
null,
|
|
||||||
null,
|
|
||||||
null,
|
|
||||||
];
|
|
||||||
let countOk_dept10 = 0;
|
let countOk_dept10 = 0;
|
||||||
if (list.length > 0) {
|
if (list.length > 0) {
|
||||||
list.forEach((item) => {
|
list.forEach((item) => {
|
||||||
|
|
@ -1039,9 +851,7 @@ export default {
|
||||||
dept_name: that.deptName,
|
dept_name: that.deptName,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
that.$API.bi.dataset.exec
|
that.$API.bi.dataset.exec.req("productStatistic", obj).then((res) => {
|
||||||
.req("productStatistic", obj)
|
|
||||||
.then((res) => {
|
|
||||||
let list = res.data2.ds0;
|
let list = res.data2.ds0;
|
||||||
let PlanRate = [0, 0, 0, 0, 0, 0, 0];
|
let PlanRate = [0, 0, 0, 0, 0, 0, 0];
|
||||||
if (list.length > 0) {
|
if (list.length > 0) {
|
||||||
|
|
@ -1119,23 +929,6 @@ export default {
|
||||||
show: false,
|
show: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// type: 'value',
|
|
||||||
// name: '完成度',
|
|
||||||
// min: 0,
|
|
||||||
// max: 100,
|
|
||||||
// interval: 20,
|
|
||||||
// axisLabel: {
|
|
||||||
// formatter: '{value} %',
|
|
||||||
// color: '#ffffff'
|
|
||||||
// },
|
|
||||||
// nameTextStyle: {
|
|
||||||
// color: '#ffffff'
|
|
||||||
// },
|
|
||||||
// splitLine: {
|
|
||||||
// show: false,
|
|
||||||
// },
|
|
||||||
// }
|
|
||||||
],
|
],
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
|
|
@ -1168,27 +961,6 @@ export default {
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// name: '合格率',
|
|
||||||
// type: 'line',
|
|
||||||
// yAxisIndex: 1,
|
|
||||||
// // 255,120,0
|
|
||||||
// tooltip: {
|
|
||||||
// valueFormatter: function (value) {
|
|
||||||
// return value;
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// symbol: 'circle',
|
|
||||||
// symbolSize: 8,
|
|
||||||
// itemStyle: {
|
|
||||||
// // 设置symbol的颜色
|
|
||||||
// color: 'rgb(255,120,0)'
|
|
||||||
// },
|
|
||||||
// lineStyle: {
|
|
||||||
// color: 'rgb(255,120,0)'
|
|
||||||
// },
|
|
||||||
// data: [63, 80, 71, 82, 60, 70, 85],
|
|
||||||
// }
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
line3Chart.setOption(line3option);
|
line3Chart.setOption(line3option);
|
||||||
|
|
@ -1759,31 +1531,6 @@ export default {
|
||||||
top: 5,
|
top: 5,
|
||||||
right: 5,
|
right: 5,
|
||||||
data: [
|
data: [
|
||||||
{
|
|
||||||
name: "AVG",
|
|
||||||
textStyle: {
|
|
||||||
color: "#fff",
|
|
||||||
},
|
|
||||||
itemStyle: {
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
|
||||||
{
|
|
||||||
offset: 0,
|
|
||||||
color: "rgb(5,245,2)",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
offset: 1,
|
|
||||||
color: "rgb(7,137,43)",
|
|
||||||
},
|
|
||||||
]
|
|
||||||
),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
{
|
||||||
name: "预制管",
|
name: "预制管",
|
||||||
textStyle: {
|
textStyle: {
|
||||||
|
|
@ -1791,10 +1538,7 @@ export default {
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -1814,12 +1558,8 @@ export default {
|
||||||
color: "#fff",
|
color: "#fff",
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
// color:'rgb(1,235,239)',
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -1881,12 +1621,8 @@ export default {
|
||||||
focus: "series",
|
focus: "series",
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
// color:'rgb(1,235,239)',
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -1912,10 +1648,7 @@ export default {
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -1930,34 +1663,6 @@ export default {
|
||||||
},
|
},
|
||||||
data: that.countOkDept10,
|
data: that.countOkDept10,
|
||||||
},
|
},
|
||||||
{
|
|
||||||
name: "AVG",
|
|
||||||
type: "bar",
|
|
||||||
stack: "Ad",
|
|
||||||
barWidth: 20,
|
|
||||||
emphasis: {
|
|
||||||
focus: "series",
|
|
||||||
},
|
|
||||||
itemStyle: {
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
|
||||||
{
|
|
||||||
offset: 0,
|
|
||||||
color: "rgb(5,245,2)",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
offset: 1,
|
|
||||||
color: "rgb(7,137,43)",
|
|
||||||
},
|
|
||||||
]
|
|
||||||
),
|
|
||||||
},
|
|
||||||
data: that.countOkAVG,
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
bar1Chart.setOption(bar1option);
|
bar1Chart.setOption(bar1option);
|
||||||
|
|
@ -1980,10 +1685,7 @@ export default {
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -2004,10 +1706,7 @@ export default {
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -2073,12 +1772,8 @@ export default {
|
||||||
symbolSize: 8, //设置折线上圆点大小
|
symbolSize: 8, //设置折线上圆点大小
|
||||||
symbol: "circle",
|
symbol: "circle",
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
// 设置symbol的颜色
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -2110,7 +1805,7 @@ export default {
|
||||||
color: "yellow", // 100% 处的颜色
|
color: "yellow", // 100% 处的颜色
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
globalCoord: false, // 缺省为 false
|
globalCoord: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
@ -2121,12 +1816,8 @@ export default {
|
||||||
symbolSize: 8, //设置折线上圆点大小
|
symbolSize: 8, //设置折线上圆点大小
|
||||||
symbol: "circle",
|
symbol: "circle",
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
// 设置symbol的颜色
|
|
||||||
color: new echarts.graphic.LinearGradient(
|
color: new echarts.graphic.LinearGradient(
|
||||||
0,
|
0,0,0,1,
|
||||||
0,
|
|
||||||
0,
|
|
||||||
1,
|
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
offset: 0,
|
offset: 0,
|
||||||
|
|
@ -2139,7 +1830,7 @@ export default {
|
||||||
]
|
]
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
smooth: 0.5, // 设置折线弧度
|
smooth: 0.5,
|
||||||
data: that.countRateDept10,
|
data: that.countRateDept10,
|
||||||
lineStyle: {
|
lineStyle: {
|
||||||
color: {
|
color: {
|
||||||
|
|
@ -2158,7 +1849,7 @@ export default {
|
||||||
color: "rgb(5, 158, 163)", // 100% 处的颜色
|
color: "rgb(5, 158, 163)", // 100% 处的颜色
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
globalCoord: false, // 缺省为 false
|
globalCoord: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
@ -2171,11 +1862,12 @@ export default {
|
||||||
let pieChart = echarts.init(pieDom);
|
let pieChart = echarts.init(pieDom);
|
||||||
let pieoption = {
|
let pieoption = {
|
||||||
color: [
|
color: [
|
||||||
"rgb(3,195,198)",
|
"rgb(237,224,45)",
|
||||||
"rgb(155,248,249)",
|
"rgb(155,248,249)",
|
||||||
"rgb(110,181,249)",
|
"rgb(110,181,249)",
|
||||||
"rgb(205,248,248)",
|
"rgb(205,248,248)",
|
||||||
"rgb(248,189,118)",
|
"rgb(248,189,118)",
|
||||||
|
"rgb(3,195,198)",
|
||||||
],
|
],
|
||||||
legend: {
|
legend: {
|
||||||
bottom: 1,
|
bottom: 1,
|
||||||
|
|
@ -2197,33 +1889,9 @@ export default {
|
||||||
type: "pie",
|
type: "pie",
|
||||||
radius: [30, 60],
|
radius: [30, 60],
|
||||||
center: ["50%", "45%"],
|
center: ["50%", "45%"],
|
||||||
// roseType: 'area',
|
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
borderRadius: 2,
|
borderRadius: 2,
|
||||||
},
|
},
|
||||||
// label: {
|
|
||||||
// fontSize: 12,
|
|
||||||
// alignTo: 'edge',
|
|
||||||
// formatter: '{b}\n',
|
|
||||||
// edgeDistance: 10,
|
|
||||||
// lineHeight: 20,
|
|
||||||
// rich: {
|
|
||||||
// title: {
|
|
||||||
// fontSize: 12,
|
|
||||||
// color: '#999',
|
|
||||||
// lineHeight: 50,
|
|
||||||
// },
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// labelLayout: function (params) {
|
|
||||||
// var isLeft = params.labelRect.x < myChart.getWidth() / 2;
|
|
||||||
// var points = params.labelLinePoints;
|
|
||||||
// points[2][0] = isLeft? params.labelRect.x: params.labelRect.x + params.labelRect.width;
|
|
||||||
// return {
|
|
||||||
// labelLinePoints: points
|
|
||||||
// };
|
|
||||||
// },
|
|
||||||
|
|
||||||
label: {
|
label: {
|
||||||
minMargin: 10,
|
minMargin: 10,
|
||||||
edgeDistance: 10,
|
edgeDistance: 10,
|
||||||
|
|
@ -2290,6 +1958,38 @@ export default {
|
||||||
background: url("/public/img/photon_bg.png") no-repeat;
|
background: url("/public/img/photon_bg.png") no-repeat;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
}
|
}
|
||||||
|
.leftPosition{
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
width: 20%;
|
||||||
|
z-index: 10
|
||||||
|
}
|
||||||
|
.leftPositionContainer{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
#line1,#bar1,#line2,#pie,#line3{
|
||||||
|
width: 100%;
|
||||||
|
height: 92%;
|
||||||
|
background: rgba(9, 31, 43, 0.5);
|
||||||
|
border-radius: 20px;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rightPosition{
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
width: 20%;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
.rightPositionContainer{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
#mainBlock{
|
#mainBlock{
|
||||||
padding: 0;
|
padding: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -2389,7 +2089,27 @@ export default {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
.modelContainer{
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.modeltopTitle{
|
||||||
|
margin: 5px 0 50px 0;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.progressNum{
|
||||||
|
font-size: 30px;
|
||||||
|
color: white;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.progressText{
|
||||||
|
font-size: 18px;
|
||||||
|
color: white;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
#renderCanvas {
|
#renderCanvas {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue