mt-fe-group/11-mes-new
12
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update 基本完成质量管理

Browse Source
This commit is contained in:
lb 2022-11-10 15:01:03 +08:00
parent e71855fee4
commit 14ef064e21
2 changed files with 29 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue
View File

@ -88,11 +88,11 @@ export default {
title: { title: {
textAlign: 'center', textAlign: 'center',
left: '59%', left: '59%',
top: '35%', top: '30%',
text: '33039', text: '33039',
textStyle: { textStyle: {
color: '#fff', color: '#fff',
fontSize: 26, fontSize: 22,
fontWeight: 'normal' fontWeight: 'normal'
}, },
subtext: '总数', subtext: '总数',
@ -103,8 +103,9 @@ export default {
} }
}, },
legend: { legend: {
top: '20%', height: '100%',
bottom: '25%', align: 'center',
verticalAlign: 'center',
left: 0, left: 0,
orient: 'vertical', orient: 'vertical',
icon: 'none', icon: 'none',
@ -207,11 +208,11 @@ export default {
return `{${colorMap[params.dataIndex]}|${params.percent} %}` return `{${colorMap[params.dataIndex]}|${params.percent} %}`
}, },
rich: { rich: {
first: { color: '#FB418C', fontSize: 12 }, first: { color: '#FB418C', fontSize: 10 },
second: { color: '#DDB112', fontSize: 12 }, second: { color: '#DDB112', fontSize: 10 },
third: { color: '#1A99FF', fontSize: 12 }, third: { color: '#1A99FF', fontSize: 10 },
fourth: { color: '#A691FF', fontSize: 12 }, fourth: { color: '#A691FF', fontSize: 10 },
fifth: { color: '#49FBD6', fontSize: 12 } fifth: { color: '#49FBD6', fontSize: 10 }
} }
}, },
itemStyle: { itemStyle: {

37
src/views/QualityManager/components/charts/newBar.vue
View File

@ -52,12 +52,13 @@ export default {
}, },
mounted() { mounted() {
if (this.dataList.length > 1) { if (this.dataList.length > 1) {
const barWidth = 400 / 2 / this.dataList[0].data.length
this.series = [ this.series = [
{ {
// 柱体 // 柱体
name: this.dataList[0].name, name: this.dataList[0].name,
type: 'bar', type: 'bar',
barWidth: 30, barWidth,
itemStyle: { itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[0].topColor }, { offset: 0, color: this.dataList[0].topColor },
@ -70,7 +71,7 @@ export default {
// 柱顶 // 柱顶
name: this.dataList[0].name, name: this.dataList[0].name,
type: 'pictorialBar', type: 'pictorialBar',
barWidth: 26, barWidth,
symbol: 'diamond', symbol: 'diamond',
symbolPosition: 'end', symbolPosition: 'end',
symbolOffset: [0, '-50%'], symbolOffset: [0, '-50%'],
@ -83,7 +84,7 @@ export default {
// 柱底 // 柱底
name: this.dataList[0].name, name: this.dataList[0].name,
type: 'pictorialBar', type: 'pictorialBar',
barWidth: 26, barWidth,
symbol: 'diamond', symbol: 'diamond',
symbolOffset: [0, '50%'], symbolOffset: [0, '50%'],
symbolSize: [30, 15], symbolSize: [30, 15],
@ -94,7 +95,7 @@ export default {
// 柱体 // 柱体
name: this.dataList[1].name, name: this.dataList[1].name,
type: 'bar', type: 'bar',
barWidth: 30, barWidth,
itemStyle: { itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: this.dataList[1].topColor }, { offset: 0, color: this.dataList[1].topColor },
@ -107,7 +108,7 @@ export default {
// 柱顶 // 柱顶
name: this.dataList[1].name, name: this.dataList[1].name,
type: 'pictorialBar', type: 'pictorialBar',
barWidth: 26, barWidth,
symbol: 'diamond', symbol: 'diamond',
symbolPosition: 'end', symbolPosition: 'end',
symbolOffset: [0, '-50%'], symbolOffset: [0, '-50%'],
@ -120,7 +121,7 @@ export default {
// 柱底 // 柱底
name: this.dataList[1].name, name: this.dataList[1].name,
type: 'pictorialBar', type: 'pictorialBar',
barWidth: 26, barWidth,
symbol: 'diamond', symbol: 'diamond',
symbolOffset: [0, '50%'], symbolOffset: [0, '50%'],
symbolSize: [30, 15], symbolSize: [30, 15],
@ -272,30 +273,30 @@ export default {
} }
.fault-category-chart >>> div::before { .fault-category-chart >>> div::before {
/* .fault-category-chart::before { */ /* .fault-category-chart::before { */
content: ''; content: '';
position: absolute; position: absolute;
/* bottom: calc(100vh/1920 * 80); bottom: calc(30px * var(--beilv));
left: calc(100vw/1920 * 48); */
/* bottom: calc(10% + 100vh/1920 * 28); */
bottom: 25px;
left: 9%; left: 9%;
height: 52px; height: calc(32px * var(--beilv));
width: 90%; width: 90%;
background: linear-gradient(to top, #31a2ff6d, transparent); background: linear-gradient(to top, #31a2ff6d, transparent);
transform: skew(-45deg); transform: skew(-35deg);
z-index: 0; z-index: 0;
} }
.process-fault-chart >>> div::before { .process-fault-chart >>> div::before {
/* .process-fault-chart::before { */ /* .process-fault-chart::before { */
content: ''; content: '';
position: absolute; position: absolute;
bottom: 26px; bottom: 12%;
left: 10%; left: 8%;
height: 48px; height: calc(32px * var(--beilv));
/* bottom: calc(20px * var(--beilv));
left: calc(36px * var(--beilv));
height: calc(32px * var(--beilv)); */
width: 90%; width: 90%;
background: linear-gradient(to top, #49fbd789, transparent); background: linear-gradient(to top, #49fbd789, transparent);
transform: skew(-45deg); transform: skew(-35deg);
z-index: 0; z-index: 0;
} }
</style> </style>