mt-fe-group/yudao-dev
13
0
Fork 0
Code Issues Pull Requests 1 Releases Wiki Activity

update 产品质量分析chart

Browse Source
This commit is contained in:
lb
2023-09-19 17:06:19 +08:00
parent c965dfbc5a
commit 71bcd14c72
4 changed files with 289 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
src/views/monitoring/equipmentProcessAmount/index.vue
View File

@@ -10,6 +10,7 @@
<div
class="app-container"
style="margin-right: 12px; border-radius: 8px; background: #fff">
<div class="factory-list" style="background: #ccc; height: 36px"></div>
<!-- side bar -->
<div
class="side-bar__left"
@@ -30,28 +31,45 @@
ref="search-bar"
@headBtnClick="handleSearchBarBtnClick" />
<transition appear name="vvv" mode="out-in">
<base-table
v-if="mode == 'table'"
:table-props="tableProps"
:page="1"
:limit="999"
:table-data="list"
@emitFun="handleEmitFun">
<!-- <method-btn
<el-row>
<el-col class="custom-tabs">
<el-tabs v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane label="数据列表" name="table">
<base-table
v-if="mode == 'table'"
:table-props="tableProps"
:page="1"
:limit="999"
:table-data="list"
@emitFun="handleEmitFun">
<!-- <method-btn
v-if="tableBtn.length"
slot="handleBtn"
label="操作"
:method-list="tableBtn"
@clickBtn="handleTableBtnClick" /> -->
</base-table>
</base-table>
</el-tab-pane>
<el-tab-pane label="柱状图" name="graph">
<div class="graph" style="height: 56vh">
<!-- graph -->
<Graph v-if="list.length" :equipment-list="list" />
<div
v-else
style="
color: #c7c7c7;
text-align: center;
margin-top: 20px;
">
没有设备
</div>
</div>
</el-tab-pane>
</el-tabs>
</el-col>
</el-row>
<div class="graph" style="height: 56vh;" v-else>
<!-- graph -->
<Graph v-if="list.length" :equipment-list="list" />
<div v-else style="color: #c7c7c7; text-align: center; margin-top: 20px;">没有设备</div>
</div>
</transition>
<!-- <transition appear name="vvv" mode="out-in"></transition> -->
</div>
</div>
</div>
@@ -152,6 +170,7 @@ export default {
// ],
// },
],
activeName: 'table',
searchBarFormConfig: [
{
type: 'datePicker',
@@ -172,23 +191,23 @@ export default {
name: 'search',
color: 'primary',
},
{
type: 'separate',
},
{
type: 'button',
btnName: '表格',
name: 'table',
plain: true,
color: 'success',
},
{
type: 'button',
btnName: '图表',
name: 'graph',
plain: true,
color: 'warning',
},
// {
// type: 'separate',
// },
// {
// type: 'button',
// btnName: '表格',
// name: 'table',
// plain: true,
// color: 'success',
// },
// {
// type: 'button',
// btnName: '图表',
// name: 'graph',
// plain: true,
// color: 'warning',
// },
// {
// type: this.$auth.hasPermi('base:equipment-group:export') ? 'button' : '',
// btnName: '导出',
@@ -197,11 +216,11 @@ export default {
// },
],
tableProps: [
{ prop: 'lineName', label: '产线', },
{ prop: 'sectionName', label: '工段', },
{ prop: 'externalCode', label: '设备编码', },
{ prop: 'equipmentName', label: '设备名称', },
{ prop: 'totalQuantity', label: '加工数量', },
{ prop: 'lineName', label: '产线' },
{ prop: 'sectionName', label: '工段' },
{ prop: 'externalCode', label: '设备编码' },
{ prop: 'equipmentName', label: '设备名称' },
{ prop: 'totalQuantity', label: '加工数量' },
],
mode: 'table', // table | graph
queryParams: {
@@ -258,7 +277,11 @@ export default {
const { data } = await this.$axios('/base/factory/getTree');
this.sidebarContent = data;
this.buildTree(data);
console.log('tree', this.sidebarContent)
console.log('tree', this.sidebarContent);
},
handleTabClick(tab, event) {
console.log('handle tab click: ', tab, event);
},
handleSidebarItemClick({ label, id, type }) {
@@ -339,4 +362,16 @@ export default {
/* transform: translateY(0) scaleY(1); */
transform: translateY(0);
}
.custom-tabs >>> .el-tabs__header {
margin-bottom: 8px;
display: inline-block;
transform: translateY(-12px);
}
.custom-tabs >>> .el-tabs__item {
padding-left: 8px !important;
padding-right: 8px !important;
line-height: 36px !important;
height: 36px;
}
</style>