Files
JY1.0/src/views/Inventory/MaterialOut/index.vue
zhangdingyu 2c4709dcde eslint
2019-06-13 10:54:52 +08:00

475 lines
19 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>
<div slot="header">
<span style="margin: 5px">领料单编号:</span>
<el-input v-model="pickingListNumber" clearable size="small" style="width:200px" />
<el-button size="small" type="success" icon="el-icon-search" style="margin: 0 0 0 10px" @click="searchList()">查询</el-button>
</div>
<h4 style="margin-top:0">领料单</h4>
<el-table :data="pickListTable1" highlight-current-row border style="width: 100%;" size="mini" height="300" @row-click="clickList">
<el-table-column label="序号" align="center" type="index" width="50"/>
<el-table-column label="领料单编号" align="center" min-width="200">
<template slot-scope="scope">
{{ scope.row.领料单编号 }}
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" min-width="200" >
<template slot-scope="scope">
{{ scope.row.操作日期.split(' ')[0] }}
</template>
</el-table-column>
<el-table-column label="领料人" align="center" min-width="130">
<template slot-scope="scope">
{{ scope.row.姓名 }}
</template>
</el-table-column>
<el-table-column label="领料单备注" align="center" min-width="130">
<template slot-scope="scope">
{{ scope.row.领料单备注 }}
</template>
</el-table-column>
<el-table-column label="领回确认" align="center" min-width="80">
<template slot-scope="scope">
<el-tag v-if="Number(scope.row.是否启用)===1" type="warning" size="small">未确认</el-tag>
<el-tag v-else type="success" size="small">已确认</el-tag>
</template>
</el-table-column>
</el-table>
<div class="block" style="float:right;margin: 10px 0;">
<el-pagination
:current-page="pageCurrent3"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize3"
:total="total3"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange3"
@current-change="handleCurrentChange3"/>
</div>
<h4>领料单明细{{ pickingListNumberShow }}</h4>
<el-table :data="pickListTable2" highlight-current-row border style="width: 100%;" size="mini" height="400" @row-click="clickListDetail">
<el-table-column label="序号" align="center" type="index" width="50"/>
<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="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="70">
<template slot-scope="scope">
{{ scope.row.组号 }}
</template>
</el-table-column>
<el-table-column label="总数量" align="center" min-width="70">
<template slot-scope="scope">
{{ scope.row.总数量 }}
</template>
</el-table-column>
<el-table-column label="备件数量" align="center" min-width="70">
<template slot-scope="scope">
{{ scope.row.备件数量 }}
</template>
</el-table-column>
<el-table-column label="已领数量" align="center" min-width="70">
<template slot-scope="scope">
{{ scope.row.出库数量 }}
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="100">
<template slot-scope="scope">
<el-button size="mini" icon="el-icon-back" type="primary" disabled>归还</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<el-card>
<h4 style="margin-top:0">物料货位数量信息</h4>
<el-table :data="StockNumberTable" border style="width: 100%;" size="mini" height="300">
<el-table-column label="序号" align="center" type="index" width="50"/>
<el-table-column label="名称" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.物料名称 || scope.row.零件名称 }}
</template>
</el-table-column>
<el-table-column label="图号或型号" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.物料型号 || scope.row.零件图号 || '—' }}
</template>
</el-table-column>
<el-table-column label="规格" align="center" min-width="100">
<template slot-scope="scope">
{{ scope.row.物料规格 || scope.row.规格 || '—' }}
</template>
</el-table-column>
<el-table-column label="仓库名称" align="center" min-width="70">
<template slot-scope="scope">
{{ scope.row.仓库名称 }}
</template>
</el-table-column>
<el-table-column label="货位名称" align="center" min-width="70">
<template slot-scope="scope">
{{ scope.row.货位名称 }}
</template>
</el-table-column>
<el-table-column label="货位存量" align="center" min-width="70">
<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="70">
<template slot-scope="scope">
{{ scope.row.组号 || '—' }}
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="200px">
<template slot-scope="scope" align="center">
<el-button size="mini" type="primary" @click="outStore(scope.row)">出库</el-button>
<el-button size="mini" type="warning" @click="errorRecord(scope.row)">异常记录</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<el-dialog :visible.sync="dialogFormVisible1" title="物料出库" center width="380px">
<el-form ref="form1" :model="form1" :rules="rules1" label-position="left">
<el-form-item label="机床" prop="machineValue" label-width="100px">
<el-select v-model="form1.machineValue" :disabled="true" filterable size="small" placeholder="机床" style="width: 200px;margin-right:10px" @change="searchGroup()">
<el-option
v-for="item in machine"
:key="item.value"
:label="item.label"
:value="item.value">
<div style="float: left">{{ item.label }}</div>
<div style="float: right; color: #8492a6; font-size: 13px">&nbsp;&nbsp;{{ item.name }}</div>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="分组" prop="groupNumValue" label-width="100px">
<el-select v-model="form1.groupNumValue" :disabled="true" filterable size="small" placeholder="分组" style="width: 200px;margin-right:10px">
<el-option
v-for="item in group"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="出库数量" prop="outNumber" label-width="100px" size="small">
<el-input-number v-model="form1.outNumber" :min="0.01" :max="form1.outNumberMax" :precision="2" size="small" placeholder="出库数量" style="width: 200px"/>
</el-form-item>
<el-form-item label="出库人" prop="personValue" label-width="100px">
<el-select v-model="form1.personValue" :disabled="true" size="small" style="width: 200px;margin-right:10px">
<el-option
v-for="item in person"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="出库类别" prop="outTypeValue" label-width="100px">
<el-select v-model="form1.outTypeValue" size="small" placeholder="出库类别" style="width: 200px;margin-right:10px">
<el-option
v-for="item in outType"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible1=false">取消</el-button>
<el-button type="primary" @click="submitOutStore()">确定</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogFormVisible2" title="异常记录" center width="380px">
<el-form ref="form2" :model="form2" :rules="rules2" label-position="left">
<el-form-item label="异常数量" prop="errorNumber" label-width="100px" size="small">
<el-input v-model="form2.errorNumber" size="small" placeholder="异常数量" style="width: 200px"/>
</el-form-item>
<el-form-item label="异常原因" prop="reason" label-width="100px">
<el-input v-model="form2.reason" size="small" placeholder="异常原因" style="width: 200px"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible2=false">取消</el-button>
<el-button type="primary" @click="submitErrorRecord()"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { initPickPerson, initMachineProject, searchgroup, searchList, searchListDetail, searchStockNumber1, searchStockNumber2, submitOutStore, errorRecord, searchStockNumber3, initOutType } from '@/api/Inventory/MaterialOut'
import { mapGetters } from 'vuex'
export default {
name: 'MaterialOut',
data() {
return {
pickingListNum: '', // 领料单流水号
pickingPersonNum: '', // 领料人流水号
pickingListNumber: '',
pickingListNumberShow: '',
pickListTable1: [],
pageCurrent3: 1,
pageSize3: 20,
total3: 0,
pickListTable2: [],
StockNumberTable: [],
dialogFormVisible1: false,
dialogFormVisible2: false,
outType: [],
form1: {
machineValue: '',
groupNumValue: '',
outNumber: '',
outNumberMax: '', // 出库最大值
personValue: '',
outTypeValue: '' // 出库类别
},
form2: {
errorNumber: '',
reason: '',
物料流水号: '',
基本件流水号: '',
货位流水号: ''
},
rules1: {
machineValue: [{ required: true, message: '请选择' }],
groupNumValue: [{ required: true, message: '请选择' }],
outNumber: [{ required: true, message: '请输入' }],
personValue: [{ required: true, message: '请输入' }],
outTypeValue: [{ required: true, message: '请选择' }] // 出库类别
},
rules2: {
errorNumber: [{ required: true, message: '请输入' }],
reason: [{ required: true, message: '请输入' }]
},
machine: [],
group: [],
person: [],
materialNum: '', // 中间变量物料流水号
machineValue: '', // 中间变量机床流水号
groupNumValue: '', // 中间变量组件流水号
basePartNum: '', // 中间变量基本件流水号
purchaseBillNum: '', // 中间变量请购单明细流水号
parchasePartNum: '', // 中间变量标准件和外购件流水号
inventoryNum: '', // 中间变量仓库流水号
locationNum: '', // 中间变量货位流水号
outNumber: 0 // 中间变量出库数量
}
},
computed: {
...mapGetters([
'id'
])
},
mounted() {
this.fetchData()
this.searchList()
},
methods: {
// 初始化数据
fetchData() {
this.person = []
initPickPerson().then(response => {
for (let i = 0; i < response.data.length; i++) {
this.person.push({
label: response.data[i].姓名,
value: response.data[i].人员编号
})
}
})
this.machine = []
initMachineProject().then(response => {
for (let i = 0; i < response.data.length; i++) {
this.machine.push({
label: response.data[i].机床图号,
name: response.data[i].项目名称,
value: response.data[i].机床流水号
})
}
})
initOutType().then(response => {
for (let i = 0; i < response.data.length; i++) {
this.outType.push({
label: response.data[i].出库类别名称,
value: response.data[i].出库类别流水号
})
}
})
},
// 查询组号
searchGroup() {
this.group = []
this.form1.groupNumValue = ''
searchgroup(this.form1.machineValue).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.group.push({
label: response.data[i].组号,
value: Number(response.data[i].组件流水号)
})
}
})
},
// 查询领料单列表
searchList() {
let check
this.pickingListNumber ? check = 1 : check = 0
searchList(this.pageCurrent3, this.pageSize3, check, this.pickingListNumber).then(response => {
this.pickListTable1 = response.data.rows
this.total3 = response.data.total
})
},
handleSizeChange3(val) {
this.pageSize3 = val
this.pageCurrent3 = 1
this.searchList()
},
handleCurrentChange3(val) {
this.pageCurrent3 = val
this.searchList()
},
// 查看领料单明细
clickList(row) {
row && row.领料单流水号 ? this.pickingListNum = row.领料单流水号 : this.pickingListNum
row && row.人员编号 ? this.pickingPersonNum = row.人员编号 : this.pickingListNum
row && row.领料单编号 ? this.pickingListNumberShow = row.领料单编号 : this.pickingListNumberShow
searchListDetail(this.pickingListNum).then(res => {
this.pickListTable2 = res.data
})
},
// 查看领料单明细相关的物料货位数量
clickListDetail(row) {
row && row.基本件流水号 ? (this.basePartNum = row.基本件流水号, this.materialNum = null, this.parchasePartNum = null, this.purchaseBillNum = null) : this.basePartNum
row && row.物料流水号 ? (this.materialNum = row.物料流水号, this.basePartNum = null, this.purchaseBillNum = null) : this.materialNum
row && row.标准件和外购件流水号 ? (this.parchasePartNum = row.标准件和外购件流水号, this.basePartNum = null, this.purchaseBillNum = null) : this.parchasePartNum
row && row.请购单明细流水号 ? (this.purchaseBillNum = row.请购单明细流水号, this.basePartNum = null, this.materialNum = null, this.parchasePartNum = null) : this.parchasePartNum
row && row.机床流水号 ? this.machineValue = row.机床流水号 : this.machineValue
row && row.组件流水号 ? this.groupNumValue = row.组件流水号 : this.groupNumValue
row && row.总数量 ? this.outNumber = row.总数量 : this.outNumber
if (this.materialNum) {
searchStockNumber1(this.materialNum).then(res => {
this.StockNumberTable = res.data
})
} else if (this.basePartNum) {
searchStockNumber2(this.basePartNum).then(res => {
this.StockNumberTable = res.data
})
} else if (this.purchaseBillNum) {
searchStockNumber3(this.purchaseBillNum).then(res => {
this.StockNumberTable = res.data
})
}
},
// 出库
outStore(row) {
if (this.$refs['form1'] !== undefined) {
this.$refs['form1'].resetFields()
}
this.form1.machineValue = this.machineValue
this.inventoryNum = row.仓库流水号
this.locationNum = row.货位流水号
this.outNumber > row.货位存量 ? (this.form1.outNumber = row.货位存量, this.form1.outNumberMax = row.货位存量) : (this.form1.outNumber = this.outNumber, this.form1.outNumberMax = this.outNumber) // 货位存量和领料数量对比取小
this.form1.personValue = Number(this.id)
this.group = []
this.form1.groupNumValue = ''
searchgroup(this.form1.machineValue).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.group.push({
label: response.data[i].组号,
value: Number(response.data[i].组件流水号)
})
}
}).then(() => {
this.form1.groupNumValue = this.groupNumValue
this.dialogFormVisible1 = true
})
},
// 提交出库
submitOutStore() {
this.$refs['form1'].validate((valid) => {
if (valid) {
// 出库数量,出库人,基本件流水号/标准件和外购件流水号 => 记录到一个新表
// 物料流水号,货位流水号,出库数量 => 减掉货位物料数
submitOutStore(this.materialNum, this.locationNum, this.form1.outNumber, this.form1.personValue, this.basePartNum, this.parchasePartNum, this.purchaseBillNum, this.pickingListNum, this.pickingPersonNum, this.inventoryNum, this.form1.outTypeValue).then(response => {
if (response.data[0].result === '1') {
this.$message.success('出库成功')
this.dialogFormVisible1 = false
this.clickListDetail()
this.clickList()
} else { this.$message.error('操作失败') }
})
} else {
return false
}
})
},
// 异常记录
errorRecord(row) {
if (this.$refs['form2'] !== undefined) {
this.$refs['form2'].resetFields()
}
this.form2.errorNumber = ''
this.form2.reason = ''
this.form2.物料流水号 = row.物料流水号
this.form2.基本件流水号 = row.基本件流水号
this.form2.货位流水号 = row.货位流水号
this.dialogFormVisible2 = true
},
// 提交异常记录
submitErrorRecord() {
this.$refs['form2'].validate((valid) => {
if (valid) {
errorRecord(this.form2.errorNumber, this.form2.reason, this.form2.物料流水号, this.form2.基本件流水号, this.form2.货位流水号).then(response => {
if (response.data[0].result === '1') {
this.$message.success('记录成功')
this.dialogFormVisible2 = false
} else { this.$message.error('操作失败') }
})
} else {
return false
}
})
}
}
}
</script>
<style scoped>
.el-card{
margin-bottom: 15px;
}
.el-select{
width:200px
}
.el-input{
width:200px
}
span{
margin: 10px 0 10px 10px;
}
.el-tag{
margin: 0
}
</style>