中航光电热表web
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

233 lines
8.7 KiB

<template>
<basic-container>
<el-tabs v-model="tabPosition" class="demo-tabs" @tab-change="tabPositionChange">
<el-tab-pane label="热表零件" name="rebiao"></el-tab-pane>
<el-tab-pane label="烧结零件" name="shaojie"></el-tab-pane>
<el-tab-pane label="玻璃饼" name="bolibing"></el-tab-pane>
</el-tabs>
<!-- 内容 -->
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-row>
<el-col :span="6">
<el-form-item label="统计类型">
<el-select v-model="formInline.type" class="m-2" placeholder="请选择" size="small"
style="width: 200px">
<el-option v-for="item in productionData[tabPosition]" :key="item.value" :label="item.label"
:value="item.value" size="small" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="选择日期">
<el-date-picker v-model="value1" type="daterange" range-separator="~" start-placeholder="开始时间"
end-placeholder="结束时间" size="small" style="width: 200px" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="调度员">
<el-input v-model="formInline.user" placeholder="请输入" clearable size="small"
style="width: 200px" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-button type="primary" size="small" icon="search">查询</el-button>
<el-button size="small" icon="refreshLeft">重置</el-button>
<el-button size="small" icon="download" type="primary">导出</el-button>
</el-col>
</el-row>
</el-form>
<!-- 表格数据 -->
<avue-crud :option="option" :table-loading="loading" :data="data" v-model="form" v-model:page="page" ref="crud"
@row-del="rowDel" @search-change="searchChange" @search-reset="searchReset"
@selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
@refresh-change="refreshChange" @on-load="onLoad">
<template #rlueName5="{ row }">
<el-text type="primary">{{ row.rlueName5 }}</el-text>
</template>
<template #rlueName7="{ row }">
<el-text type="error">{{ row.rlueName7 }}</el-text>
</template>
<template #rlueName8="{ row }">
<el-text type="warning">{{ row.rlueName8 }}</el-text>
</template>
<template #rlueName9="{ row }">
<el-text type="primary">{{ row.rlueName9 }}</el-text>
</template>
<template #rlueName10="{ row }">
<el-text type="success">{{ row.rlueName10 }}</el-text>
</template>
</avue-crud>
</basic-container>
</template>
<script>
import productionCol from './productionData.js'
export default {
data() {
return {
tabPosition: 'rebiao',
formInline: {
type: '',//统计类型
user: '',//调度员
},
productionData: {
"rebiao": [
{ "label": "订单准时完成率", "value": 1 },
{ "label": "会议急件准时完成率", "value": 2 },
{ "label": "平均加工周期", "value": 3 },
{ "label": "工序统计", "value": 4 },
{ "label": "检验项目统计", "value": 5 },
{ "label": "来料统计", "value": 6 },
{ "label": "入库量统计", "value": 7 },
{ "label": "在制品统计", "value": 8 },
{ "label": "计划统计", "value": 9 },
{ "label": "班组在制品统计", "value": 10 },
{ "label": "班组工序统计", "value": 11 },
{ "label": "订单工序统计", "value": 11 },
],
"shaojie": [
{ "label": "会议急件准时完成率", "value": 2 },
{ "label": "平均加工周期", "value": 3 },
{ "label": "来料统计", "value": 6 },
{ "label": "入库量统计", "value": 7 },
{ "label": "在制品统计", "value": 8 },
],
"bolibing": [
{ "label": "来料统计", "value": 6 },
{ "label": "入库量统计", "value": 7 },
{ "label": "在制品统计", "value": 8 },
]
},
page: {
pageSize: 10,
currentPage: 1,
total: 0,
},
option: {
tip: false,
simplePage: true,
searchShow: true,
searchMenuSpan: 6,
searchIcon: true,
searchIndex: 3,
tree: false,
border: true,
index: true,
selection: true,
viewBtn: true,
addBtn: false,
menu: false,
labelWidth: 120,
searchLabelWidth: 60,
menuWidth: 350,
dialogWidth: 600,
dialogClickModal: false,
searchEnter: true,
refreshBtn: false,
excelBtn: false,
filterBtn: false,
gridBtn: false,
index: false,
searchShowBtn: false,
header: false,
searchLabelPosition:'left',
searchLabelPosition:'left',
searchGutter:24,
searchSpan:6,
menuAlign: 'left',
gridBtn:false,
searchMenuPosition:'right',
addBtnIcon: ' ',
viewBtnIcon: ' ',
delBtnIcon: ' ',
editBtnIcon: ' ',
align: 'center',
column: []
},
data: []
}
},
methods: {
tabPositionChange(value, event) {
this.formInline.type = this.productionData[value][0].value
this.option.column = productionCol[this.formInline.type]
}
},
mounted() {
this.formInline.type = this.productionData.rebiao[0].value
this.option.column = productionCol[this.formInline.type]
this.data = [
{
rlueName1: '热表分厂',
rlueName2: '吉振哲',
rlueName3: '崔殿龙',
rlueName4: '34005',
rlueName5: '2480',
rlueName6: '7',
rlueName7: '12',
rlueName8: '800',
rlueName9: '3659',
rlueName10: '99.36%',
},
{
rlueName1: '热表分厂',
rlueName2: '庄鞘豪',
rlueName3: '崔殿龙',
rlueName4: '34005',
rlueName5: '301',
rlueName6: '56',
rlueName7: '30',
rlueName8: '365',
rlueName9: '750',
rlueName10: '77.78%',
},
{
rlueName1: '热表分厂',
rlueName2: '郭家梁',
rlueName3: '崔殿龙',
rlueName4: '34005',
rlueName5: '433',
rlueName6: '7',
rlueName7: '3',
rlueName8: '259',
rlueName9: '698',
rlueName10: '97.75%',
},
{
rlueName1: '热表分厂',
rlueName2: '张牌',
rlueName3: '崔殿龙',
rlueName4: '34005',
rlueName5: '620',
rlueName6: '31',
rlueName7: '68',
rlueName8: '306',
rlueName9: '1024',
rlueName10: '83.63%',
},
{
rlueName1: '热表分厂',
rlueName2: '刘明',
rlueName3: '崔殿龙',
rlueName4: '34005',
rlueName5: '416',
rlueName6: '4',
rlueName7: '7',
rlueName8: '327',
rlueName9: '751',
rlueName10: '97.42%',
},
]
this.page.total = this.data.length
},
}
</script>
<style lang="scss" scoped>
:deep(.el-card__body) {
margin: 0 12px 0 12px !important;
}
</style>