Files
JY1.0/src/views/Inventory/Inboundscanning/index.vue
2020-05-15 14:32:25 +08:00

353 lines
13 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div class="app-container">
<el-card style="width: 1000px">
<el-row>
<span style="margin-left: 10px">跟单号</span>
<el-input v-model="partNumberP" clearable size="small" style="width:170px;height: 29px;margin-top: 10px;margin-bottom: 10px" />
<el-button size="small" type="primary" icon="el-icon-search" plain style="margin: 0 0 0 10px" @click="getscantable()">查询</el-button>
<!--<el-tooltip :open-delay="1200" effect="dark" content="清除所有机床零件信息" placement="top">-->
<!--<el-button size="small" type="danger" icon="el-icon-remove-outline" style="margin: 0 0 0 10px" plain @click="Empty()">清空</el-button>-->
<!--</el-tooltip>-->
<el-tooltip :open-delay="1200" effect="dark" content="自制件件入库" placement="top">
<el-button type="warning" size="small" class="el-icon-success" style="margin: 0 0 0 10px" plain @click="Innumber">入库</el-button>
</el-tooltip>
</el-row>
</el-card>
<el-card style="width: 1000px">
<el-table v-loading="listLoading" :data="tableDataNum" stripe highlight-current-row border size="mini" style="width: 100%;margin: 3px 0px" height="750px">
<el-table-column label="序号" align="center" type="index" width="55"/>
<el-table-column label="项目名称" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.项目名称 }}
</template>
</el-table-column>
<el-table-column label="机床图号" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.机床图号 }}
</template>
</el-table-column>
<el-table-column label="零件图号" align="center" min-width="150">
<template slot-scope="scope">
{{ scope.row.零件图号 }}
</template>
</el-table-column>
<el-table-column label="计划数量" align="center" min-width="70">
<template slot-scope="scope" align="center">
{{ tableDataNum[scope.$index].plannumber }}
</template>
</el-table-column>
<el-table-column label="入库数量" align="center" min-width="70">
<template slot-scope="scope">
<el-input v-model="tableDataNum[scope.$index].innumber" clearable size="mini"/>
</template>
</el-table-column>
<el-table-column label="货位" align="center" width="120">
<template slot-scope="scope">
<el-select v-model="locateNumber" filterable clearable size="mini" placeholder="货位名称" style="width: 100px">
<el-option
v-for="item in locateName"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</template>
</el-table-column>
<el-table-column label="备注" align="center">
<template slot-scope="scope" align="center">
<el-input v-model="tableData[scope.$index].note" clearable size="mini"/>
</template>
</el-table-column>
<!--<el-table-column label="操作" min-width="100" align="center">-->
<!--<template slot-scope="scope">-->
<!--<el-button-->
<!--:disabled="scope.row.是否禁用"-->
<!--size="mini"-->
<!--type="danger"-->
<!--class="el-icon-delete"-->
<!--@click="handleDelete(scope.$index, scope.row)">移除</el-button>-->
<!--</template>-->
<!--</el-table-column>-->
</el-table>
</el-card>
<el-dialog :visible.sync="dialogFormVisible" title="更新零件状态" center>
<el-table :data="finishParts" stripe border size="mini" style="width: 100%;margin: 3px 0px" height="300px">
<el-table-column label="序号" align="center" type="index" width="55"/>
<el-table-column label="项目名称" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.项目名称 }}
</template>
</el-table-column>
<el-table-column label="机床图号" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.机床图号 }}
</template>
</el-table-column>
<el-table-column label="零件图号" align="center" min-width="150">
<template slot-scope="scope">
{{ scope.row.零件图号 }}
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogFormVisible = false">取消</el-button>
<el-button type="primary" size="small" @click="FinishPart()">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { searchTable, insertOne, getlocate, searchPartNumber, CraftNumber, FinishPart } from '@/api/Inventory/Inboundscanning'
import { mapGetters } from 'vuex'
import { wsuri, name } from '@/utils/request'
export default {
data() {
return {
ace: 0,
a: '',
tableData: [],
partNumber: '',
partNumberP: '',
listLoading: false,
craftplannumber: '',
radio2: 3,
PeopleNumber: '',
NUM: '',
inventoryName: [], // 仓库名称下拉框
inventoryNumber: '',
locateName: [], // 货位名称下拉框
locateNumber: '',
Partpaint: '',
tableDataNum: [],
dialogFormVisible: false,
finishParts: []
}
},
computed: {
...mapGetters([
'id',
'token'
])
},
created() {
this.initWebpack()
this.getpeopleid()
this.Getlocate()
},
methods: {
// 移除
handleDelete(index, row) {
this.tableDataNum.splice(index, 1)
this.tableData.splice(index, 1)
},
// 获取人员编号
getpeopleid() {
this.PeopleNumber = this.id
},
// 初始化websocket
initWebpack() {
this.websock = new WebSocket(wsuri)// 这里面的this都指向vue
this.websock.onopen = this.websocketopen
this.websock.onmessage = this.websocketonmessage
this.websock.onclose = this.websocketclose
this.websock.onerror = this.websocketerror
},
// 打开
websocketopen() {
console.log('WebSocket连接成功')
this.websock.send('{<' + name + '>}')
},
// 数据接收
websocketonmessage(msg) {
this.partNumberP = msg.data.split('|')[3]
this.partNumber = this.partNumberP.slice(1)
this.getscantable(this.partNumber)
},
// 关闭
websocketclose() {
console.log('WebSocket关闭')
},
// 失败
websocketerror() {
console.log('WebSocket连接失败')
},
// 根据图号查流水号并查表1
getCraftNumber() {
this.partNumber = []
CraftNumber(this.Partpaint).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.partNumber.push(
response.data[i].工艺计划流水号
)
}
}).then(() => {
this.getscantable()
})
},
// 扫描并获取图号并查表1
getPaint() {
searchPartNumber(this.partNumber).then(response => {
this.Partpaint = response.data[0].零件图号
return this.Partpaint
}).then(() => {
this.getCraftNumber()
})
// this.getscantable()
},
// 根据流水号查询
getscantable() {
this.partNumber = this.partNumberP.slice(1)
// this.tableData = []
this.finishParts = []
this.listLoading = true
searchTable(this.partNumber).then(response => {
console.log(response.data)
if (response.data[0].结果 === '成功' || response.data[0].结果 === '自动完成入库') {
this.listLoading = false
this.tableData.push({
plannumber: response.data[0].剩余数量,
innumber: response.data[0].入库数量,
capture: '',
note: '',
工艺计划流水号: response.data[0].工艺计划流水号,
项目名称: response.data[0].项目名称,
机床图号: response.data[0].机床图号,
零件图号: response.data[0].零件图号
})
const hash = {} // 一个新数组data为你需要去重的数组newData用于接收去重后的数组, curVal.去重条件
this.tableDataNum = this.tableData.reduce((preVal, curVal) => {
hash[curVal.工艺计划流水号] ? '' : hash[curVal.工艺计划流水号] = true && preVal.push({
工艺计划流水号: curVal.工艺计划流水号,
项目名称: curVal.项目名称,
机床图号: curVal.机床图号,
零件图号: curVal.零件图号,
plannumber: curVal.plannumber,
innumber: curVal.innumber,
capture: '',
note: ''
})
return preVal
}, [])
} else if (response.data[0].结果 === '未查到') {
this.$notify({
title: '警告',
message: '跟单号有误',
type: 'warning'
})
} else if (response.data[0].结果 === '未完成') {
this.$notify({
title: '警告',
message: '此零件未加工完成',
type: 'warning'
})
} else if (response.data[0].结果 === '已入库') {
this.$notify({
title: '警告',
message: '此零件已入库',
type: 'warning'
})
}
}).then(() => {
this.listLoading = false
})
},
FinishPart() {
var nums = []
this.finishParts.map(v => {
nums.push(v.工艺计划流水号)
})
FinishPart(nums).then(response => {
this.dialogFormVisible = false
for (let i = 0; i < this.finishParts.length; i++) {
this.tableData.push({
plannumber: this.finishParts[i].plannumber,
innumber: this.finishParts[i].innumber,
capture: '',
note: '',
工艺计划流水号: this.finishParts[i].工艺计划流水号,
项目名称: this.finishParts[i].项目名称,
机床图号: this.finishParts[i].机床图号,
零件图号: this.finishParts[i].零件图号
})
const hash = {} // 一个新数组data为你需要去重的数组newData用于接收去重后的数组, curVal.去重条件
this.tableDataNum = this.tableData.reduce((preVal, curVal) => {
hash[curVal.工艺计划流水号] ? '' : hash[curVal.工艺计划流水号] = true && preVal.push({
工艺计划流水号: curVal.工艺计划流水号,
项目名称: curVal.项目名称,
机床图号: curVal.机床图号,
零件图号: curVal.零件图号,
plannumber: curVal.plannumber,
innumber: curVal.innumber,
capture: '',
note: ''
})
return preVal
}, [])
}
})
},
// 修改入库
Innumber() {
this.$confirm('此操作将不可逆转,且如果入库数量大于计划数量,则全部入库,是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
if (!this.locateNumber) {
this.$message.error('请选择货位')
} else {
for (let i = 0; i < this.tableDataNum.length; i++) {
if (Number(this.tableDataNum[i].innumber) === 0) {
this.$message.error('请输入正确数量')
} else {
if (this.tableDataNum[i].innumber > this.tableDataNum[i].plannumber) {
this.tableDataNum[i].innumber = this.tableDataNum[i].plannumber
}
insertOne(this.tableDataNum[i].工艺计划流水号, this.tableDataNum[i].innumber, this.PeopleNumber, this.tableDataNum[i].capture, this.inventoryNumber, this.locateNumber, this.tableDataNum[i].note).then(response => {
if (response.data[0].result === '1') {
this.$message({
type: 'success',
message: '零件入库成功!'
})
this.Empty()
} else {
this.$message({
type: 'error',
message: '零件入库失败!'
})
}
})
}
}
}
}).catch(() => {
this.$message({
type: 'info',
message: '已取消入库'
})
})
},
// 清空
Empty() {
this.tableData = []
this.tableDataNum = []
this.Partpaint = ''
},
// 根据仓库获取货位
Getlocate() {
this.locateName = []
this.locateNumber = ''
this.getSelect(getlocate, ['货位名称', '货位流水号'], 'locateName')
}
}
}
</script>
<style scoped>
.el-card {
margin-bottom: 3px;
}
</style>