<!-- 机床状态分布 -->
|
<template>
|
<div class="app-container">
|
<div class="padding20" v-loading="loading" element-loading-text="查询数据中,请稍等">
|
<el-form :inline="true" :model="dataForm" ref="dataForm" class="margintop20">
|
<el-form-item label="车间" prop="workshop">
|
<el-select size="mini" v-model="dataForm.workshop" filterable clearable placeholder="选择或搜索" @change="workshopChange()">
|
<el-option
|
v-for="item in workshoplist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="工段" prop="section">
|
<el-select size="mini" v-model="dataForm.section" filterable clearable placeholder="选择或搜索" @change="sectionChange()">
|
<el-option
|
v-for="item in sectionlist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="机床">
|
<el-select size="mini" v-model="dataForm.machines" filterable clearable multiple placeholder="选择或搜索机床名">
|
<el-option
|
v-for="item in machinelist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="设备类型">
|
<el-select size="mini" v-model="dataForm.machineType" filterable clearable placeholder="选择或搜索机床名">
|
<el-option
|
v-for="item in machineTypes"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button size="mini" type="primary" @click="queryMachineAndTypes">查询</el-button>
|
<el-button size="mini" type="primary" @click="updateMachineTypes">确定</el-button>
|
</el-form-item>
|
</el-form>
|
<el-table :data="tableData" v-loading.table="loading" element-loading-text="Loading" fit
|
bclass="mdc-table" :row-class-name="tableRowClassName" style="width: 100%;border: 1px solid #ebeef5;">
|
<el-table-column label='车间' align='center' prop='workshopName'></el-table-column>
|
<el-table-column label='工段' align='center' prop='sectionName'></el-table-column>
|
<el-table-column label='机床' align='center' prop='machineName'></el-table-column>
|
<el-table-column label='型号' align='center' prop='typesName'></el-table-column>
|
</el-table>
|
</div>
|
<div style="padding-top: 10px;display: flex;justify-content: flex-end;align-items: center;">
|
<el-button-group>
|
<el-button type="primary" icon="el-icon-arrow-left" size="mini" round @click="prePage()" :disabled="canPaging[0]">上一页</el-button>
|
<el-button disabled size="mini" plain>{{currentPage}}/{{totalPage}}</el-button>
|
<el-button type="primary" size="mini" round @click="nextPage()" :disabled="canPaging[1]">下一页<i class="el-icon-arrow-right el-icon--right"></i></el-button>
|
</el-button-group>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { queryworkshoplist, getByWorkshopSection, queryMachineTypes, queryMachineAndTypes, updateMachineTypes } from '@/api/MdcApi'
|
export default {
|
data() {
|
return {
|
loading: false,
|
dataForm: {
|
startTime: '',
|
endTime: '',
|
workshop: '', // 车间
|
section: '', // 工段
|
machines: [],
|
machineType: '',
|
pageNo: 0
|
},
|
tableData: [],
|
workshoplistall: [],
|
sectionlistall: [],
|
machinelistall: [],
|
workshoplist: [],
|
sectionlist: [],
|
machinelist: [],
|
machineTypes: [],
|
currentPage: 1,
|
totalPage: 0
|
}
|
},
|
mounted() {
|
this.queryListByOrgTypecj()
|
this.queryMachineTypes()
|
},
|
computed: {
|
canPaging() {
|
const tem = [false, false]
|
tem[0] = (this.currentPage <= 1)
|
tem[1] = (this.currentPage >= this.totalPage)
|
return tem
|
}
|
},
|
methods: {
|
// 获取车间list
|
queryListByOrgTypecj() {
|
queryworkshoplist().then(res => {
|
this.workshoplist = []
|
if (res.workshopList.length > 0) {
|
this.oldworkshoplist = res.workshopList
|
res.workshopList.map(item => {
|
this.workshoplist.push({
|
value: item.name,
|
label: item.name
|
})
|
item.sectionList.map(item => {
|
this.sectionlist.push({
|
value: item.name,
|
label: item.name
|
})
|
})
|
})
|
}
|
this.sectionChange()
|
this.workshoplistall = this.workshoplist
|
this.sectionlistall = this.sectionlist
|
this.machinelistall = this.machinelist
|
})
|
},
|
workshopChange() {
|
const workshop = this.dataForm.workshop
|
this.dataForm.section = ''
|
if (workshop === '') {
|
this.sectionlist = this.sectionlistall
|
this.machinelist = this.machinelistall
|
} else {
|
this.sectionlist = []
|
this.oldworkshoplist.map(item => {
|
if (item.name === workshop) {
|
item.sectionList.map(items => {
|
this.sectionlist.push({
|
value: items.name,
|
label: items.name
|
})
|
})
|
}
|
})
|
// this.dataForm.section = this.sectionlist[0].value
|
}
|
this.sectionChange()
|
},
|
sectionChange() {
|
const workshop = this.dataForm.workshop
|
const section = this.dataForm.section
|
getByWorkshopSection(workshop, section).then(res => {
|
this.machinelist = []
|
res.map(item => {
|
this.machinelist.push({
|
value: item,
|
label: item
|
})
|
})
|
})
|
},
|
tableRowClassName({ row, rowIndex }) {
|
if (rowIndex % 2 === 1) {
|
return 'odd-row'
|
} else {
|
return 'even-row'
|
}
|
},
|
queryMachineTypes() {
|
queryMachineTypes().then(res => {
|
this.machineTypes = []
|
if (res.machineTypes.length > 0) {
|
res.machineTypes.map(item => {
|
this.machineTypes.push({
|
value: item.name,
|
label: item.name
|
})
|
})
|
}
|
})
|
},
|
queryMachineAndTypes() {
|
const currentPage = this.currentPage
|
const workshop = this.dataForm.workshop
|
const section = this.dataForm.section
|
const machines = this.dataForm.machines
|
queryMachineAndTypes(currentPage, workshop, section, machines).then(res => {
|
this.totalPage = res.totalPage
|
this.tableData = res.list
|
})
|
},
|
updateMachineTypes() {
|
const workshop = this.dataForm.workshop
|
const section = this.dataForm.section
|
const machines = this.dataForm.machines
|
const machineType = this.dataForm.machineType
|
updateMachineTypes(workshop, section, machines, machineType).then(res => {
|
if (res.result === 'SUCCESS') {
|
this.$message({
|
type: 'success',
|
message: '设置成功!'
|
})
|
this.queryMachineAndTypes()
|
} else {
|
this.$message({
|
type: 'error',
|
message: '失败!'
|
})
|
}
|
})
|
},
|
// 前一页
|
prePage() {
|
if (this.currentPage > 1) {
|
this.currentPage--
|
this.queryMachineAndTypes()
|
}
|
},
|
// 后一页
|
nextPage() {
|
if (this.currentPage < this.totalPage) {
|
this.currentPage++
|
this.queryMachineAndTypes()
|
}
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.padding20{
|
margin-top: 50px
|
}
|
</style>
|
