<template>
|
<el-dialog
|
width="75%"
|
top="5vh"
|
: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>{{ title }}</span>
|
</template>
|
<el-divider
|
><span style="font-weight:bold;font-size:16px;"
|
>订单主体</span
|
></el-divider
|
>
|
<div>
|
<el-form
|
:model="dataForm"
|
:rules="dataRule"
|
ref="dataForm"
|
label-width="100px"
|
class="l-mes"
|
>
|
<el-row>
|
<el-col :span="6">
|
<el-form-item label="合同号" prop="contractNo">
|
<el-input
|
v-model="dataForm.contractNo"
|
placeholder=""
|
disabled
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="客户名称" prop="customerName">
|
<el-input
|
v-model="dataForm.customerName"
|
placeholder=""
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="工程名称" prop="entityName">
|
<el-input v-model="dataForm.entityName" placeholder=""></el-input>
|
</el-form-item>
|
</el-col>
|
<!-- <el-col :span="6">
|
<el-form-item label="事业部" prop="salesDepartment">
|
<el-input
|
v-model="dataForm.salesDepartment"
|
placeholder=""
|
></el-input>
|
</el-form-item>
|
</el-col> -->
|
<el-col :span="6">
|
<el-form-item label="省份" prop="province">
|
<el-input v-model="dataForm.province" placeholder=""></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="6">
|
<el-form-item label="业务员" prop="salesMan">
|
<el-select @change="selsctionSales" filterable v-model="salesSelectData" style="width:100%">
|
<el-option v-for="(item,index) in staffOptions" :key="index" :value="item.staffNo+','+item.staffName" :label="item.staffName"/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="正本状态" prop="originalContractStatus">
|
<el-input
|
v-model="dataForm.originalContractStatus"
|
placeholder=""
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="合同正本状态" prop="returnStatus">
|
<el-input
|
v-model="dataForm.returnStatus"
|
placeholder=""
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="项目性质" prop="isCp">
|
<el-input v-model="dataForm.isCp" placeholder=""></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="6">
|
<el-form-item label="客户编码" prop="customerNo">
|
<el-input v-model="dataForm.customerNo" placeholder=""></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="下单日期" prop="placeOrderDate">
|
<el-date-picker
|
v-model="dataForm.placeOrderDate"
|
style="width: 100%"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="工厂下单日期" prop="factoryPlaceOrderDate">
|
<el-date-picker
|
v-model="dataForm.factoryPlaceOrderDate"
|
style="width: 100%"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="交货日期" prop="deliveryDate">
|
<el-date-picker
|
v-model="dataForm.deliveryDate"
|
style="width: 100%"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="24">
|
<el-form-item label="订单备注" prop="comment">
|
<el-input
|
v-model="dataForm.comment"
|
style="width: 100%"
|
type="textarea"
|
:rows="2"
|
>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</div>
|
|
<el-divider>
|
<span style="font-weight:bold;font-size:16px;">订单行</span>
|
</el-divider>
|
<div class="l-mes normal-form">
|
<avue-crud ref="crud"
|
show-hide="false"
|
:option="option"
|
:data="tableData">
|
<template slot="partNo" slot-scope="scope">
|
<el-input v-model="scope.row.partNo" placeholder="查询零件号" readonly>
|
<el-button slot="append" icon="el-icon-search" @click="openPartDialog(scope.row.$index)"></el-button>
|
</el-input>
|
</template>
|
<template slot="otcUnit" slot-scope="scope">
|
<el-select v-model="scope.row.otcUnit" placeholder="请选择单位" style="width: 100%">
|
<el-option
|
v-for="item in units"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value" />
|
</el-select>
|
</template>
|
<template slot="menu" slot-scope="scope">
|
<el-button type="text" icon="el-icon-circle-close" :disabled="tableData.length<2" @click="delRow(scope.row,scope.index)">取消</el-button>
|
</template>
|
</avue-crud>
|
</div>
|
<!-- <div class="l-mes normal-form">
|
<el-row :gutter="20">
|
<el-col :span="2">
|
<span>零件号</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.partNo"
|
placeholder=""
|
readonly
|
>
|
<el-button
|
slot="append"
|
icon="el-icon-search"
|
@click="openPartDialog()"
|
></el-button>
|
</el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>单位</span>
|
</el-col>
|
<el-col :span="6">
|
<el-select
|
v-model="dataForm.customerOrder.unit"
|
placeholder=""
|
style="width: 100%"
|
>
|
<el-option
|
v-for="item in units"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</el-col>
|
<el-col :span="2">
|
<span>数量</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.buyQtyDue"
|
placeholder=""
|
></el-input>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="2">
|
<span>电压等级</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.voltAgeClass"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>产品名称</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.productName"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>制造属性</span>
|
</el-col>
|
<el-col :span="6">
|
<el-select
|
v-model="dataForm.customerOrder.manufactureAttr"
|
placeholder=""
|
style="width: 100%"
|
disabled
|
>
|
<el-option
|
v-for="item in manufactureAttrs"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="2">
|
<span>外护颜色</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.outerColor"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>零件规格</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.customerPartSpec"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>包装要求</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.packageRequire"
|
placeholder=""
|
></el-input>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="2">
|
<span>质量要求</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.qualityRequire"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>生产需求说明</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.otherProductRequire"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>系统</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.divisionSystem"
|
placeholder=""
|
></el-input>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="2">
|
<span>收货地址</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.shippingAddress"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>业务员</span>
|
</el-col>
|
<el-col :span="6">
|
<el-select v-model="dataForm.customerOrder.salesmanName" style="width:100%">
|
<el-option v-for="(item,index) in staffOptions" :key="index" :value="item.staff_no" :label="item.staffName"/>
|
</el-select>
|
</el-col>
|
<el-col :span="2">
|
<span>盘长要求</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.lengthRequirement"
|
placeholder=""
|
></el-input>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="2">
|
<span>备注</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.remark"
|
placeholder=""
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<span>产品类型</span>
|
</el-col>
|
<el-col :span="6">
|
<el-input
|
v-model="dataForm.customerOrder.productType"
|
placeholder=""
|
></el-input>
|
</el-col>
|
</el-row>
|
</div> -->
|
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="visible = false">取消</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 { addObj } from '@/api/plan/customer'
|
import { remote } from '@/api/admin/dict'
|
import PartDialog from '@/views/common/part.vue'
|
import { validateSixDecimal } from '@/util/validate'
|
import {dateFormat} from '@/util/date'
|
import { chooseStaff } from '@/api/plan/customerorder'
|
import { tableOption } from '@/const/crud/customerOrder/customerOrderForm'
|
|
export default {
|
components: {
|
PartDialog
|
},
|
watch:{
|
visible(newVal){
|
if(!newVal){
|
|
this.tableData = [{
|
"$cellEdit": true,
|
"$index": 0,
|
"partNo": "",
|
"specs": "",
|
"manufactureAttr": "",
|
"productName": "",
|
"productType": "",
|
"otcUnit": "",
|
"buyQtyDue": "",
|
"shippingAddress": "",
|
"remark": "",
|
"isTrusted": true
|
}]
|
}
|
}
|
},
|
data() {
|
return {
|
salesSelectData: null,
|
currentSelectRow: 0,
|
option: tableOption,
|
tableData: [{
|
"$cellEdit": true,
|
"$index": 0,
|
"partNo": "",
|
"specs": "",
|
"manufactureAttr": "",
|
"productName": "",
|
"productType": "",
|
"otcUnit": "",
|
"buyQtyDue": "",
|
"shippingAddress": "",
|
"remark": "",
|
"isTrusted": true
|
}],
|
staffOptions: [],
|
title: '',
|
isFullScreen: false,
|
visible: false,
|
buttonDisable: false,
|
showPart: false,
|
dataForm: {
|
contractNo: null,
|
customerName: null,
|
customerNo: null,
|
customerOrderVOList: [],
|
deliveryDate: null,
|
entityName: null,
|
factoryPlaceOrderDate: null,
|
salesDepartment: null,
|
isCp: null,
|
originalContractStatus: null,
|
placeOrderDate: null,
|
province: null,
|
returnStatus: null,
|
salesMan: null,
|
salerWorkCode: null,
|
comment: null
|
},
|
dataRule: {},
|
units: [],
|
manufactureAttrs: []
|
}
|
},
|
mounted: function() {
|
this.getDicUnit('unit') // 获取单位
|
this.getManufactureAttrs('manufacture_attr_type')
|
this.getStaffOptions();
|
},
|
methods: {
|
delRow(row,index){
|
this.tableData.splice(index,1)
|
},
|
selsctionSales(data){
|
if(data){
|
let arr = data.split(",")
|
this.dataForm.salesMan = arr[1]
|
this.dataForm.salerWorkCode = arr[0]
|
}
|
},
|
getStaffOptions(){
|
chooseStaff().then((response)=>{
|
this.staffOptions = response.data.data
|
})
|
},
|
init(id) {
|
this.initDataForm()
|
this.visible = true
|
this.$nextTick(() => {
|
this.title = '新增'
|
})
|
},
|
initDataForm() {
|
this.dataForm.contractNo = null
|
this.dataForm.customerName = null
|
this.dataForm.entityName = null
|
this.dataForm.province = null
|
this.dataForm.salesMan = null
|
this.dataForm.originalContractStatus = null
|
this.dataForm.isCp = null
|
this.dataForm.customerNo = null
|
this.dataForm.returnStatus = null
|
this.dataForm.placeOrderDate = dateFormat(new Date(),'yyyy-MM-dd hh:mm:ss')
|
this.dataForm.factoryPlaceOrderDate = dateFormat(new Date(),'yyyy-MM-dd hh:mm:ss')
|
this.dataForm.deliveryDate = null
|
this.dataForm.comment = null
|
this.dataForm.customerOrderVOList = [{
|
"$cellEdit": true,
|
"$index": 0,
|
"partNo": "",
|
"specs": "",
|
"manufactureAttr": "",
|
"productName": "",
|
"productType": "",
|
"otcUnit": "",
|
"buyQtyDue": "",
|
"shippingAddress": "",
|
"remark": "",
|
"isTrusted": true
|
}]
|
},
|
// 表单提交
|
dataFormSubmit() {
|
this.buttonDisable = true
|
this.$refs.dataForm.validate((valid) => {
|
this.dataForm.customerOrderVOList = this.tableData
|
if (valid) {
|
addObj(this.dataForm)
|
.then((data) => {
|
this.$message.success('添加成功')
|
this.initDataForm();
|
this.visible = false
|
this.buttonDisable = false
|
this.$emit('refreshDataList', 1)
|
})
|
.catch((error) => {
|
this.buttonDisable = false
|
})
|
} else {
|
this.buttonDisable = false
|
}
|
})
|
},
|
// 零件选择
|
openPartDialog(index) {
|
this.currentSelectRow = index
|
this.showPart = true
|
},
|
selectPart(part) {
|
const index = this.currentSelectRow
|
if (part) {
|
this.tableData[index].partId=part.id
|
this.tableData[index].partNo = part.partNo
|
this.tableData[index].customerPartSpec = part.specs
|
this.tableData[index].productName = part.partName
|
this.tableData[index].otcUnit = part.unit
|
this.tableData[index].buyQtyDue = part.numCount
|
this.tableData[index].manufactureAttr = part.materialAttribute
|
|
}
|
},
|
// 全屏
|
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
|
}
|
})
|
},
|
getManufactureAttrs(type) {
|
remote(type).then((response) => {
|
const code = response.data.code
|
if (code === 0) {
|
const _data = response.data.data
|
this.manufactureAttrs = _data
|
}
|
})
|
}
|
}
|
}
|
</script>
|
<style>
|
.normal-form .el-input-group__append,
|
.normal-form .el-input-group__prepend {
|
padding: 0;
|
border-top: none;
|
border-right: none;
|
border-left: none;
|
border-radius: 0;
|
background-color: transparent;
|
}
|
.normal-form .el-input-group__append .el-button,
|
.normal-form .el-input-group__prepend .el-button {
|
padding: 0;
|
width: 25px;
|
border: none !important;
|
line-height: 28px;
|
color: #c0c4cc;
|
margin: -1px 0;
|
}
|
</style>
|