<template>
|
<el-tabs
|
class="taskinfo-param-tabs"
|
type="card"
|
ref="tabs"
|
@tab-click="handleTabClick"
|
>
|
<div v-if="paramTabs.length == 0">
|
没有关联客户订单
|
</div>
|
<el-tab-pane
|
class="productorder-order-param"
|
v-for="(item, index) in paramTabs"
|
:key="index"
|
:label="item.customerOrderNo"
|
:name="item.id.toString()"
|
>
|
<el-form
|
:model="dataForm"
|
:rules="dataRule"
|
ref="dataForm"
|
@keyup.enter.native="dataFormSubmit()"
|
label-width="100px"
|
class="l-mes productorder-order"
|
:disabled="!editable"
|
>
|
<el-tabs type="border-card">
|
<el-tab-pane label="主要" type="card">
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="同步数据来源" prop="sourceId">
|
<el-input
|
v-model="dataForm.sourceId"
|
placeholder=""
|
:disabled="!ediSource"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="客户订单号" prop="customerOrderNo">
|
<el-input
|
v-model="dataForm.customerOrderNo"
|
placeholder=""
|
:disabled="!ediSource"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="客户编号" prop="customerNo">
|
<el-input
|
v-model="dataForm.customerNo"
|
placeholder=""
|
:disabled="!ediSource"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="客户名称" prop="customerName">
|
<el-input
|
v-model="dataForm.customerName"
|
placeholder=""
|
:disabled="!ediSource"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="客户订单状态" prop="coState">
|
<el-select
|
v-model="dataForm.coState"
|
placeholder=""
|
filterable
|
style="width: 100%"
|
:disabled="!ediSource"
|
>
|
<el-option
|
v-for="item in coStates"
|
:key="item.id"
|
:label="item.label"
|
:value="item.value"
|
:disabled="!ediSource"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="行号" prop="coLineNo">
|
<el-input
|
v-model="dataForm.coLineNo"
|
placeholder=""
|
:disabled="!ediSource"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="零件号" prop="partNo">
|
<el-input v-model="dataForm.partNo" placeholder="" readonly>
|
<el-button
|
slot="append"
|
icon="el-icon-search"
|
@click="openPartDialog()"
|
:disabled="!ediSource"
|
></el-button>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="销售数量" prop="buyQtyDue">
|
<el-input
|
v-model="dataForm.buyQtyDue"
|
placeholder=""
|
:disabled="!ediSource"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="期望交货时间" prop="wantedDeliveryDate">
|
<el-date-picker
|
v-model="dataForm.wantedDeliveryDate"
|
style="width: 100%"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
:disabled="!ediSource"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="计划交货时间" prop="plannedDeliveryDate">
|
<el-date-picker
|
v-model="dataForm.plannedDeliveryDate"
|
style="width: 100%"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
:disabled="!ediSource"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-card
|
header="订单参数"
|
shadow="never"
|
class="productorder-order-param"
|
>
|
<el-row>
|
<el-form-item
|
style="float:left;width: 50%"
|
v-for="(item, index) in orderParamList"
|
:property="item.renameField"
|
:label="item.item"
|
:key="index"
|
><el-input
|
v-model="dataForm[item.renameField]"
|
placeholder=""
|
:disabled="!ediSource"
|
></el-input
|
></el-form-item>
|
</el-row>
|
</el-card>
|
</el-tab-pane>
|
<el-tab-pane label="附件" type="card">
|
<el-upload
|
disabled
|
action=""
|
ref="upload"
|
:file-list="fileList"
|
list-type="text"
|
:on-preview="handlePreview"
|
:with-credentials="true"
|
>
|
</el-upload>
|
</el-tab-pane>
|
</el-tabs>
|
</el-form>
|
</el-tab-pane>
|
</el-tabs>
|
</template>
|
<style>
|
.productorder-order-param .el-card__body {
|
height: 300px;
|
}
|
.productorder-order .el-form__body {
|
height: 360px;
|
}
|
</style>
|
<script>
|
import {
|
addCustomerOrder,
|
download,
|
getCustomerOrder,
|
putCustomerOrder
|
} from '@/api/plan/customerorder'
|
import { remote } from '@/api/admin/dict'
|
import { validateSixDecimal } from '@/util/validate'
|
import { getCustomer } from '../../../api/plan/manufacturingorder'
|
|
export default {
|
props: {
|
orderId: {
|
type: Number,
|
default: 0
|
}
|
},
|
data() {
|
return {
|
paramTabs: [], // 客户订单的集合
|
fileList: [],
|
title: '',
|
orderParamList: [],
|
isFullScreen: false,
|
visible: false,
|
buttonDisable: false,
|
showPart: false,
|
dataForm: {
|
id: 0,
|
sourceId: '',
|
customerOrderNo: '',
|
customerNo: '',
|
customerName: '',
|
coState: '',
|
coLineNo: '',
|
partNo: '',
|
customerPartName: '',
|
buyQtyDue: '',
|
wantedDeliveryDate: '',
|
plannedDeliveryDate: '',
|
customerPoNo: '',
|
customerPoLineNo: '',
|
customerPoRelNo: '',
|
customerPartNo: '',
|
customerPartBuyQty: '',
|
customerPartUnitMeas: '',
|
custPartConvFactor: '',
|
custPartInvertConvFactor: ''
|
},
|
dataRule: {
|
sourceId: [],
|
customerOrderNo: [
|
{ required: true, message: '客户订单号不能为空', trigger: 'blur' }
|
],
|
customerNo: [
|
{ required: true, message: '客户编号不能为空', trigger: 'blur' }
|
],
|
customerName: [
|
{ required: true, message: '客户名称不能为空', trigger: 'blur' }
|
],
|
coState: [],
|
coLineNo: [],
|
partNo: [{ required: true, message: '零件不能为空', trigger: 'blur' }],
|
buyQtyDue: [
|
{ required: true, message: '销售数量不能为空', trigger: 'blur' },
|
{ validator: validateSixDecimal, trigger: 'blur' }
|
],
|
wantedDeliveryDate: [
|
{ required: true, message: '期望交货时间不能为空', trigger: 'blur' }
|
],
|
customerPoNo: [],
|
customerPoLineNo: [],
|
customerPoRelNo: [],
|
customerPartNo: [],
|
customerPartBuyQty: [
|
{ validator: validateSixDecimal, trigger: 'blur' }
|
],
|
customerPartUnitMeas: [],
|
custPartConvFactor: [
|
{ validator: validateSixDecimal, trigger: 'blur' }
|
],
|
custPartInvertConvFactor: [
|
{ validator: validateSixDecimal, trigger: 'blur' }
|
]
|
},
|
units: [],
|
coStates: [
|
{
|
value: '01plan',
|
label: '待计划'
|
},
|
{
|
value: '03planed',
|
label: '已计划'
|
},
|
{
|
value: '02planing',
|
label: '计划中'
|
},
|
{
|
value: '04complete',
|
label: '已完成'
|
}
|
]
|
}
|
},
|
computed: {
|
editable: function() {
|
if (!this.dataForm.id) {
|
return true
|
}
|
if (this.dataForm.id && this.dataForm.coState !== '04complete') {
|
return true
|
}
|
return false
|
},
|
ediSource: function() {
|
if (!this.dataForm.id) {
|
return true
|
}
|
if (this.dataForm.id && this.dataForm.sourceId !== 'GSM') {
|
return true
|
}
|
return false
|
}
|
},
|
mounted: function() {
|
this.getDicUnit('unit') // 获取单位
|
},
|
watch: {
|
orderId: {
|
handler(newValue, oldValue) {
|
getCustomer(newValue).then((response) => {
|
var data = response.data.data
|
if (data.length > 0) {
|
this.paramTabs = data
|
this.init(data[0].id)
|
} else {
|
this.paramTabs = []
|
}
|
})
|
},
|
immediate: true
|
}
|
},
|
methods: {
|
init(id) {
|
this.orderParamList = []
|
this.dataForm.id = id || 0
|
this.visible = true
|
this.dataForm.coState = '01plan'
|
this.$nextTick(() => {
|
if (this.dataForm.id) {
|
getCustomerOrder(this.dataForm.id).then((response) => {
|
if (response.data.data.customerOrderList != null) {
|
this.dataForm = response.data.data.customerOrderList
|
// if(this.dataForm.OrderOrContract){ //将订单还是合同转义
|
// if("0" == this.dataForm.OrderOrContract){
|
// this.dataForm.OrderOrContract = "合同"
|
// }else if("1" == this.dataForm.OrderOrContract){
|
// this.dataForm.OrderOrContract = "订单"
|
// }
|
// }
|
} else {
|
this.dataForm = response.data.data
|
}
|
this.fileList = response.data.data.customerOrderAttachmentList
|
this.orderParamList = response.data.data.orderParamList
|
|
|
this.title =
|
this.dataForm.customerName + this.dataForm.customerOrderNo
|
})
|
this.$refs.tabs.currentName = this.dataForm.id + ''
|
} else {
|
this.title = '新增'
|
this.$refs.tabs.currentName = '0'
|
}
|
})
|
},
|
// 附件的点击
|
handlePreview(file) {
|
download(file.name, this.dataForm.id).then((response) => {
|
const blob = new Blob([response.data], {
|
type: 'application/force-download'
|
})
|
const filename = decodeURI(file.name)
|
// 创建一个超链接,将文件流赋进去,然后实现这个超链接的单击事件
|
const elink = document.createElement('a')
|
elink.download = filename
|
elink.style.display = 'none'
|
elink.href = URL.createObjectURL(blob)
|
document.body.appendChild(elink)
|
elink.click()
|
URL.revokeObjectURL(elink.href) // 释放URL 对象
|
document.body.removeChild(elink)
|
})
|
},
|
// 表单提交
|
dataFormSubmit() {
|
this.buttonDisable = true
|
this.$refs.dataForm.validate((valid) => {
|
if (valid) {
|
if (this.dataForm.id) {
|
putCustomerOrder(this.dataForm)
|
.then((data) => {
|
this.$message.success('修改成功')
|
this.visible = false
|
this.buttonDisable = false
|
this.$emit('refreshDataList', 1)
|
})
|
.catch((error) => {
|
this.buttonDisable = false
|
})
|
} else {
|
addCustomerOrder(this.dataForm)
|
.then((data) => {
|
this.$message.success('添加成功')
|
this.visible = false
|
this.buttonDisable = false
|
this.$emit('refreshDataList', 1)
|
})
|
.catch((error) => {
|
this.buttonDisable = false
|
})
|
}
|
} else {
|
this.buttonDisable = false
|
}
|
})
|
},
|
handleTabClick(tab, event) {
|
this.init(parseInt(tab.name))
|
},
|
// 零件选择
|
openPartDialog() {
|
this.showPart = true
|
},
|
selectPart(part) {
|
if (part) {
|
this.dataForm.partNo = part.partNo
|
this.$refs.dataForm.validateField('partNo', (valid) => {})
|
}
|
},
|
// 全屏
|
fullscreen() {
|
this.isFullScreen = !this.isFullScreen
|
},
|
// 获取字典显示名称并缓存
|
getDicUnit(type) {
|
remote(type).then((response) => {
|
const code = response.data.code
|
if (code === 0) {
|
const _data = response.data.data
|
this.units = _data
|
}
|
})
|
}
|
}
|
}
|
</script>
|