lb #36
@ -155,7 +155,7 @@ export default {
|
|||||||
async getList() {
|
async getList() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
// 执行查询
|
// 执行查询
|
||||||
const { data } = await this.$axios({
|
const { code, data } = await this.$axios({
|
||||||
url: '/analysis/equipment-analysis/efficiency',
|
url: '/analysis/equipment-analysis/efficiency',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: {
|
params: {
|
||||||
@ -163,6 +163,11 @@ export default {
|
|||||||
recordTime: this.queryParams.recordTime || null,
|
recordTime: this.queryParams.recordTime || null,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
if (code === 0) {
|
||||||
|
this.list = data;
|
||||||
|
} else {
|
||||||
|
this.list.splice(0);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
handleSearchBarBtnClick(btn) {
|
handleSearchBarBtnClick(btn) {
|
||||||
|
@ -43,7 +43,7 @@ export default {
|
|||||||
eq.okQuantity,
|
eq.okQuantity,
|
||||||
eq.nokQuantity,
|
eq.nokQuantity,
|
||||||
eq.totalQuantity,
|
eq.totalQuantity,
|
||||||
eq.passRate.toFixed(2),
|
eq.passRate.toFixed(4),
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
return {
|
return {
|
||||||
@ -53,6 +53,30 @@ export default {
|
|||||||
axisPointer: {
|
axisPointer: {
|
||||||
type: 'shadow',
|
type: 'shadow',
|
||||||
},
|
},
|
||||||
|
formatter: (params) => {
|
||||||
|
const name = params[0].name;
|
||||||
|
const goodRate = opt.find((item) => item[0] == name)[4];
|
||||||
|
return `
|
||||||
|
<h1 style="font-size: 18px; letter-spacing: 1px;">${
|
||||||
|
params[0].axisValue
|
||||||
|
} <small>${goodRate}%</small></h1>
|
||||||
|
<ul style="margin: 0; padding: 0; min-width: 128px;">
|
||||||
|
${params
|
||||||
|
.map(
|
||||||
|
(item, index) => `
|
||||||
|
<li style="list-style: none; display: flex; justify-content: space-between; align-items: center;">
|
||||||
|
<div>
|
||||||
|
<span style="display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color: ${item.color}; margin-right: 5px;"></span>
|
||||||
|
${item.seriesName}
|
||||||
|
</div>
|
||||||
|
${item.value}
|
||||||
|
</li>
|
||||||
|
`
|
||||||
|
)
|
||||||
|
.join('')}
|
||||||
|
</ul>
|
||||||
|
`;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
itemWidth: 12,
|
itemWidth: 12,
|
||||||
@ -110,17 +134,17 @@ export default {
|
|||||||
stack: 's',
|
stack: 's',
|
||||||
data: opt.map((item) => item[2]),
|
data: opt.map((item) => item[2]),
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
name: '加工数量',
|
// name: '加工数量',
|
||||||
type: 'bar',
|
// type: 'bar',
|
||||||
barWidth: 20,
|
// barWidth: 20,
|
||||||
data: opt.map((item) => item[3]),
|
// data: opt.map((item) => item[3]),
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
name: '合格率',
|
// name: '合格率',
|
||||||
type: 'line',
|
// type: 'line',
|
||||||
data: opt.map((item) => item[4]),
|
// data: opt.map((item) => item[4]),
|
||||||
},
|
// },
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
@ -31,7 +31,8 @@
|
|||||||
<el-tab-pane :label="'\u3000柱状图\u3000'" name="graph">
|
<el-tab-pane :label="'\u3000柱状图\u3000'" name="graph">
|
||||||
<div v-if="activeName == 'graph'" class="graph" style="height: 40vh; display: flex; flex-direction: column;">
|
<div v-if="activeName == 'graph'" class="graph" style="height: 40vh; display: flex; flex-direction: column;">
|
||||||
<div class="blue-title">各设备加工数量</div>
|
<div class="blue-title">各设备加工数量</div>
|
||||||
<LineChart :list="list" />
|
<LineChart v-if="list && list.length" :list="list" />
|
||||||
|
<div v-else class="no-data-bg"></div>
|
||||||
</div>
|
</div>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
|
Loading…
Reference in New Issue
Block a user