20230520 0826北汽福田现场
This commit is contained in:
@@ -0,0 +1,299 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-card style="margin-bottom: 10px;width: 100%;">
|
||||
<span style="margin-left: 10px">工位号：</span>
|
||||
<el-select
|
||||
v-model="stationNumberValue"
|
||||
placeholder="请选择工位号"
|
||||
clearable
|
||||
filterable
|
||||
size="small"
|
||||
style="width: 200px; margin-left: 13px">
|
||||
<el-option
|
||||
v-for="item in stationNumber"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
size="mini" />
|
||||
</el-select>
|
||||
<span style="margin-left: 10px">基本机型：</span>
|
||||
<el-select
|
||||
v-model="bigEngine"
|
||||
placeholder="请选择基本机型"
|
||||
clearable
|
||||
filterable
|
||||
size="small"
|
||||
style="width: 200px; margin-left: 13px"
|
||||
@change="selectBigEngine">
|
||||
<el-option
|
||||
v-for="item in bigEngineList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
size="mini" />
|
||||
</el-select>
|
||||
|
||||
<el-select v-model="EngineName1" placeholder="请选择比对零件号" filterable size="small">
|
||||
<el-option
|
||||
v-for="item in smallEngineList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
size="mini" />
|
||||
</el-select>
|
||||
<el-button size="small" type="distribution" style="margin: 0 2vw;" @click="searchBomList()">比对零件号差异</el-button>
|
||||
<el-select v-model="EngineName2" placeholder="请选择比对零件号" filterable size="small">
|
||||
<el-option
|
||||
v-for="item in smallEngineList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
size="mini" />
|
||||
</el-select>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- <el-card style="margin-bottom: 10px">
|
||||
<el-button size="small" type="distribution">创建一级菜单</el-button>
|
||||
</el-card> -->
|
||||
<el-card>
|
||||
<el-table
|
||||
ref="multipleTableLeft"
|
||||
:data="tableData"
|
||||
:cell-class-name="cellClassName"
|
||||
stripe
|
||||
size="mini"
|
||||
height="700"
|
||||
style="height:calc(100vh - 330px);">
|
||||
<el-table-column type="index" width="60" label="序号" align="center" />
|
||||
<el-table-column align="center" label="工位号">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.工位号 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="零件号">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.零件号 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="零件编号">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.零件编号 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="零件名称">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.零件名称 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="数量">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.数量 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
|
||||
<el-card>
|
||||
<el-table
|
||||
ref="multipleTableRight"
|
||||
:data="tableData"
|
||||
:cell-class-name="cellClassName"
|
||||
stripe
|
||||
size="mini"
|
||||
height="700"
|
||||
style="height:calc(100vh - 330px);">
|
||||
<el-table-column type="index" width="60" label="序号" align="center" />
|
||||
<el-table-column align="center" label="工位号">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.工位号2 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="零件号">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.零件号2 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="零件编号">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.零件编号2 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="零件名称">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.零件名称2 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="数量">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.数量2 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'MenuManagement',
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
EngineName1: '',
|
||||
EngineName2: '',
|
||||
rules1: {
|
||||
moduleName: [{ required: true, message: '请输入', trigger: ['blur', 'change'] }]
|
||||
},
|
||||
rules2: {
|
||||
moduleName: [{ required: true, message: '请输入', trigger: ['blur', 'change'] }]
|
||||
},
|
||||
smallEngineList: [],
|
||||
dom1: null,
|
||||
dom2: null,
|
||||
stationNumber: [], // 工位号
|
||||
stationNumberValue: '',
|
||||
bigEngine: '',
|
||||
bigEngineList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getSmallEngine()
|
||||
this.getStationNumber()
|
||||
this.getEndStation()
|
||||
setTimeout(() => {
|
||||
this.dom1 = this.$refs.multipleTableLeft.bodyWrapper
|
||||
this.dom2 = this.$refs.multipleTableRight.bodyWrapper
|
||||
this.listenerScroll()
|
||||
}, 500)
|
||||
},
|
||||
methods: {
|
||||
listenerScroll() {
|
||||
this.dom2.addEventListener('scroll', () => {
|
||||
// 横滚
|
||||
this.dom1.scrollLeft = this.dom2.scrollLeft
|
||||
// 竖滚
|
||||
this.dom1.scrollTop = this.dom2.scrollTop
|
||||
})
|
||||
|
||||
this.dom1.addEventListener('scroll', () => {
|
||||
// 横滚
|
||||
this.dom2.scrollLeft = this.dom1.scrollLeft
|
||||
// 竖滚
|
||||
this.dom2.scrollTop = this.dom1.scrollTop
|
||||
})
|
||||
},
|
||||
// 工位号
|
||||
getStationNumber() {
|
||||
this.stationNumber = []
|
||||
var param = []
|
||||
var Data = this.CreateData('11', 'MES_计划BOM_工位与名称_查询', param)
|
||||
this.ExecDatabase(Data).then(response => {
|
||||
for (let i = 0; i < response.data.length; i++) {
|
||||
this.stationNumber.push({
|
||||
label: response.data[i].工位号,
|
||||
value: response.data[i].工位号
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 查询零件号数据
|
||||
searchBomList() {
|
||||
this.tableData = []
|
||||
|
||||
let stationNumberValue_check
|
||||
|
||||
this.stationNumberValue ? stationNumberValue_check = 1 : (stationNumberValue_check = 0, this.stationNumberValue = '')
|
||||
|
||||
var param = []
|
||||
param[0] = ['零件号1', this.EngineName1]
|
||||
param[1] = ['零件号2', this.EngineName2]
|
||||
param[2] = ['工位号_ischeck', stationNumberValue_check]
|
||||
param[3] = ['工位号', this.stationNumberValue]
|
||||
var Data = this.CreateData('11', '北汽福田_BOM_零件差异查询', param)
|
||||
this.ExecDatabase(Data).then(response => {
|
||||
console.log(response, 66)
|
||||
if (response.data.length !== 0) {
|
||||
this.tableData = response.data
|
||||
}
|
||||
// this.loading = false
|
||||
})
|
||||
},
|
||||
// 选择大机型触发事件
|
||||
selectBigEngine() {
|
||||
this.EngineName1 = ''
|
||||
this.EngineName2 = ''
|
||||
this.getSmallEngine()
|
||||
},
|
||||
// 获取大机型
|
||||
getEndStation() {
|
||||
this.bigEngine = ''
|
||||
this.bigEngineList = []
|
||||
var param = []
|
||||
var Data = this.CreateData('11', 'MES_基本变量_机型代码_查询', param)
|
||||
this.ExecDatabase(Data).then(response => {
|
||||
for (let i = 0; i < response.data.length; i++) {
|
||||
this.bigEngineList.push({
|
||||
label: response.data[i].发动机型号,
|
||||
value: response.data[i].发动机型号,
|
||||
labelName: response.data[i].发动机机型标志
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取小机型
|
||||
getSmallEngine() {
|
||||
this.smallEngineList = []
|
||||
var param = []
|
||||
this.bigEngine ? param[0] = ['基本型号', this.bigEngine] : ''
|
||||
var Data = this.CreateData('11', '北汽福田_BOM_零件号查询', param)
|
||||
this.ExecDatabase(Data).then(response => {
|
||||
for (let i = 0; i < response.data.length; i++) {
|
||||
this.smallEngineList.push({
|
||||
label: response.data[i].零件号,
|
||||
value: response.data[i].零件号
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 根据差异来决定该行颜色
|
||||
cellClassName({ row, column }) {
|
||||
let isNoEqual = false
|
||||
row.工位号 !== row.工位号2 ? isNoEqual = true : ''
|
||||
// row.零件号 !== row.零件号2 ? isNoEqual = true : ''
|
||||
row.零件编号 !== row.零件编号2 ? isNoEqual = true : ''
|
||||
row.零件名称 !== row.零件名称2 ? isNoEqual = true : ''
|
||||
row.数量 !== row.数量2 ? isNoEqual = true : ''
|
||||
|
||||
if (isNoEqual) {
|
||||
return 'NoEqual-row'
|
||||
}
|
||||
return ''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
||||
/deep/.el-table .el-table__body .NoEqual-row {
|
||||
background: rgba(255, 255, 0, 0.5) !important;
|
||||
/* color: #fff !important; */
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user