<template>
|
<el-dialog
|
top="10vh"
|
width="80%"
|
:fullscreen="isFullScreen"
|
:close-on-click-modal="false"
|
:visible.sync="visible"
|
>
|
<template slot="title">
|
<i
|
:class="isFullScreen ? 'icon-zuixiaohua' : 'icon-quanpingzuidahua'"
|
style="position: absolute; right: 52px; float: right"
|
@click="fullscreen"
|
>
|
</i>
|
<span>创建主计划需求</span>
|
</template>
|
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" class="l-mes">
|
<div class="avue-crud">
|
<el-table
|
:data="dataForm.mpsRequirements"
|
:span-method="objectSpanMethod"
|
class="mps-table"
|
border
|
height="500px"
|
>
|
<el-table-column align="center" label="客户订单号">
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input
|
v-model="scope.row.customerOrderNo"
|
placeholder=""
|
disabled
|
></el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" header-align="center" label="零件">
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input
|
v-model="scope.row.partName"
|
placeholder=""
|
disabled
|
></el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" header-align="center" label="行号">
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input
|
v-model="scope.row.customerPoLineNo"
|
placeholder=""
|
disabled
|
>
|
</el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
header-align="center"
|
label="销售数量"
|
>
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input v-model="scope.row.customerBuyQtyDue" disabled>
|
</el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
header-align="center"
|
label="已下发数量"
|
>
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input v-model="scope.row.requireNumber" disabled>
|
</el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
header-align="center"
|
label="待下发数量"
|
>
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input v-model="scope.row.residueRequireNumber" disabled>
|
</el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
header-align="center"
|
label="订单需求日期"
|
>
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input
|
v-model="scope.row.customerWantedDeliveryDate"
|
placeholder=""
|
disabled
|
>
|
</el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
header-align="center"
|
label="本次下发数量"
|
>
|
<template slot-scope="scope">
|
<el-form-item
|
:prop="'mpsRequirements.' + scope.$index + '.qtyRequired'"
|
:rules="rules.qtyRequired"
|
>
|
<el-input
|
v-model="scope.row.qtyRequired"
|
placeholder=""
|
@blur="checkNum(scope.$index)"
|
></el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
header-align="center"
|
label="需求日期"
|
>
|
<template slot-scope="scope">
|
<el-form-item
|
:prop="'mpsRequirements.' + scope.$index + '.requiredDate'"
|
:rules="rules.requiredDate"
|
>
|
<el-date-picker
|
v-model="scope.row.requiredDate"
|
style="width: 100%"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
@blur="checkDate(scope.$index)"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" header-align="center" label="备注">
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-input v-model="scope.row.remark" placeholder=""></el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
<el-table-column
|
width="160px"
|
align="center"
|
header-align="center"
|
label="操作"
|
>
|
<template slot-scope="scope">
|
<el-form-item>
|
<el-button
|
type="text"
|
size="small"
|
icon="el-icon-plus"
|
@click="splitRow(scope.$index, dataForm.mpsRequirements)"
|
>拆分
|
</el-button>
|
<el-button
|
type="text"
|
size="small"
|
icon="el-icon-delete"
|
@click="deleteRow(scope.$index, dataForm.mpsRequirements)"
|
>删除
|
</el-button>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</el-form>
|
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="cleanAll">取消</el-button>
|
<el-button
|
type="primary"
|
:disabled="buttonDisable"
|
v-thinclick="`dataFormSubmit`"
|
>确定</el-button
|
>
|
</span>
|
|
<part-dialog
|
:currshowlist.sync="showPart"
|
@listenToPartEvent="selectPart"
|
/>
|
</el-dialog>
|
</template>
|
|
<script>
|
import { createMpsRequirements } from '@/api/plan/customerorder'
|
import { fetchList } from '@/api/basic/part'
|
import { remote } from '@/api/admin/dict'
|
import PartDialog from '@/views/common/part.vue'
|
import { validateSixDecimalNotNull } from '@/util/validate'
|
import { highPrecisionAdd, highPrecisionReduce } from '@/util/highPrecision'
|
|
export default {
|
components: {
|
PartDialog
|
},
|
data() {
|
return {
|
dataState: false,
|
mpsRequirementsGroupList: [],
|
isFullScreen: false,
|
visible: false,
|
buttonDisable: false,
|
showPart: false,
|
dataForm: {
|
mpsRequirements: []
|
},
|
dataRule: {},
|
currentIndex: 0,
|
originalCustomerOrders: [],
|
spanArr: []
|
}
|
},
|
computed: {
|
rules: function() {
|
return {
|
qtyRequired: [
|
{ validator: validateSixDecimalNotNull, trigger: 'blur' },
|
{ required: true, message: '本次下发数量不能为空', trigger: 'blur' }
|
],
|
requiredDate: [
|
{ required: true, message: '需求日期不能为空', trigger: 'blur' }
|
]
|
}
|
}
|
},
|
methods: {
|
init(customerOrders) {
|
this.dataForm.mpsRequirements = []
|
this.originalCustomerOrders = customerOrders
|
this.visible = true
|
if (customerOrders) {
|
for (let i = 0, len = customerOrders.length; i < len; i++) {
|
this.dataForm.mpsRequirements.push(
|
Object.assign({
|
customerOrderNo: customerOrders[i].customerOrderNo,
|
customerOrderId: customerOrders[i].id,
|
partId: customerOrders[i].partId,
|
partName:
|
customerOrders[i].partName + '-' + customerOrders[i].partNo,
|
customerPoLineNo: customerOrders[i].coLineNo,
|
customerBuyQtyDue: customerOrders[i].buyQtyDue,
|
customerWantedDeliveryDate: customerOrders[i].wantedDeliveryDate,
|
requireNumber: customerOrders[i].requireNumber,
|
residueRequireNumber: highPrecisionReduce(
|
customerOrders[i].buyQtyDue,
|
customerOrders[i].requireNumber
|
),
|
qtyRequired: highPrecisionReduce(
|
customerOrders[i].buyQtyDue,
|
customerOrders[i].requireNumber
|
)
|
})
|
)
|
}
|
this.getSpanArr(this.dataForm.mpsRequirements)
|
}
|
},
|
// 需求数量与订单需求数量的比较
|
checkNum: function(index) {
|
var mpsRequirementsId = this.dataForm.mpsRequirements[index]
|
.customerOrderId
|
var num = 0
|
for (let i = 0; i < this.dataForm.mpsRequirements.length; i++) {
|
if (
|
this.dataForm.mpsRequirements[i].customerOrderId === mpsRequirementsId
|
) {
|
num = num + Number(this.dataForm.mpsRequirements[i].qtyRequired)
|
}
|
}
|
if (num > this.dataForm.mpsRequirements[index].customerBuyQtyDue) {
|
this.$message.error('本次下发数量大于订单销售数量')
|
}
|
},
|
// 需求日期与订单交货日期的比较
|
checkDate: function(index) {
|
if (
|
this.dataForm.mpsRequirements[index].requiredDate >
|
this.dataForm.mpsRequirements[index].customerWantedDeliveryDate
|
) {
|
this.$message.error('需求日期大于订单交货日期')
|
this.dataState = true
|
} else {
|
this.dataState = false
|
}
|
},
|
// 拆分
|
splitRow(index, rows) {
|
var clone = Object.assign({}, rows[index])
|
clone.qtyRequired = 0
|
rows.splice(index + 1, 0, clone)
|
this.getSpanArr(rows)
|
},
|
// 删除
|
deleteRow(index, rows) {
|
rows.splice(index, 1)
|
this.getSpanArr(rows)
|
},
|
// 表单提交
|
dataFormSubmit() {
|
this.buttonDisable = true
|
this.$refs.dataForm.validate((valid) => {
|
if (valid) {
|
// 1.判断主计划需求的数量是否超出客户订单的销售数量
|
const mpsRequirements = this.dataForm.mpsRequirements
|
const originalCustomerOrders = this.originalCustomerOrders
|
if (mpsRequirements && mpsRequirements.length > 0) {
|
let j = 0
|
const len = mpsRequirements.length
|
for (
|
let i = 0, originalLen = originalCustomerOrders.length;
|
i < originalLen;
|
i++
|
) {
|
let totalNumber = 0
|
for (; j < len; j++) {
|
if (
|
originalCustomerOrders[i].id ==
|
mpsRequirements[j].customerOrderId
|
) {
|
totalNumber = highPrecisionAdd(
|
totalNumber,
|
mpsRequirements[j].qtyRequired - 0
|
)
|
} else {
|
break
|
}
|
}
|
if (this.dataState) {
|
this.$message.error('需求日期大于订单交货日期')
|
this.buttonDisable = false
|
return
|
}
|
// 2.在这边做数据对比
|
// let surplusNumber = highPrecisionReduce(originalCustomerOrders[i].buyQtyDue, originalCustomerOrders[i].requireNumber)
|
// if (totalNumber && totalNumber > surplusNumber) {
|
// this.$message.error('订单号为' + originalCustomerOrders[i].customerOrderNo + '的主生产计划需求数量超出：' + totalNumber + '>' + surplusNumber)
|
// this.buttonDisable = false
|
// return
|
// }
|
}
|
} else {
|
this.buttonDisable = false
|
this.$message.error('缺少主生产计划需求')
|
return
|
}
|
createMpsRequirements(this.dataForm.mpsRequirements).then((data) => {
|
this.$message.success('主生产计划需求创建成功')
|
this.visible = false
|
this.buttonDisable = false
|
this.$emit('refreshDataList', 1)
|
})
|
} else {
|
this.buttonDisable = false
|
}
|
})
|
},
|
// 零件选择
|
openPartDialog(index) {
|
this.currentIndex = index
|
this.showPart = true
|
},
|
selectPart(part) {
|
if (part) {
|
this.$set(
|
this.dataForm.mpsRequirements[this.currentIndex],
|
'partName',
|
part.partName
|
)
|
this.dataForm.mpsRequirements[this.currentIndex].partId = part.id
|
}
|
},
|
cleanAll() {
|
this.$nextTick(() => {
|
this.$refs.dataForm.clearValidate() // 只清除清除验证
|
})
|
this.visible = false
|
},
|
// 全屏
|
fullscreen() {
|
this.isFullScreen = !this.isFullScreen
|
},
|
// 合并行
|
getSpanArr(data) {
|
this.spanArr.length = 0
|
for (var i = 0; i < data.length; i++) {
|
if (i === 0) {
|
this.spanArr.push(1)
|
this.pos = 0
|
} else {
|
// 判断客户订单是否一致
|
if (
|
data[i].customerOrderId &&
|
data[i].customerOrderId === data[i - 1].customerOrderId
|
) {
|
this.spanArr[this.pos] += 1
|
this.spanArr.push(0)
|
} else {
|
this.spanArr.push(1)
|
this.pos = i
|
}
|
}
|
}
|
},
|
// 单元格合并
|
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
if (
|
columnIndex === 0 ||
|
columnIndex === 1 ||
|
columnIndex === 2 ||
|
columnIndex === 3 ||
|
columnIndex === 4 ||
|
columnIndex === 5 ||
|
columnIndex === 6
|
) {
|
const _row = this.spanArr[rowIndex]
|
const _col = _row > 0 ? 1 : 0
|
return {
|
// [0,0] 表示这一行不显示， [2,1]表示行的合并数
|
rowspan: _row,
|
colspan: _col
|
}
|
}
|
}
|
}
|
}
|
</script>
|
<style scoped>
|
.mps-table .warning-row {
|
background: oldlace;
|
}
|
|
.mps-table .success-row {
|
background: #f0f9eb;
|
}
|
|
.mps-table .el-table__row > td {
|
border: none;
|
padding: 0px 0px !important;
|
}
|
|
.mps-table::before {
|
height: 0px;
|
}
|
</style>
|
