You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
478 lines
16 KiB
478 lines
16 KiB
<template> |
|
<el-drawer direction="ltr" size="40%" :visible="controlWindows.bill" @opened="openDrawer" :before-close="closeWindow" |
|
:show-close=false> |
|
<div class="create" v-if="controlWindows.bill"> |
|
<el-form label-width="100px"> |
|
<div class="billTop"> |
|
<div class="billTop-top"> |
|
<div class="billTop-top-left"> |
|
<el-form-item label="订单信息"> |
|
</el-form-item> |
|
<el-form-item label="提货单数量:"> |
|
<span>{{ billData.orderInfo.deliveryAccount }}</span> |
|
</el-form-item> |
|
</div> |
|
<el-form-item label="订单状态"> |
|
<el-tag effect='dark' :type="orderTagType(billData.orderInfo.orderStatus).orderType">{{ |
|
orderTagType(billData.orderInfo.orderStatus).orderLabel }}</el-tag> |
|
</el-form-item> |
|
</div> |
|
<div> |
|
<div class="billTop-top-left"> |
|
<el-form-item label="预订数量:"> |
|
<span>{{ billData.orderInfo.preQuantity }}</span> |
|
</el-form-item> |
|
<el-form-item label="订单金额:"> |
|
<span>{{ billData.orderInfo.preAmount }}</span> |
|
</el-form-item> |
|
</div> |
|
<div class="billTop-top-left"> |
|
<el-form-item label="已提数量:"> |
|
<span>{{ billData.orderInfo.alreadyQuantity }}</span> |
|
</el-form-item> |
|
<el-form-item label="已提金额:"> |
|
<span>{{ billData.orderInfo.alreadyAmount }}</span> |
|
</el-form-item> |
|
</div> |
|
<div class="billTop-top-left"> |
|
<el-form-item label="剩余数量:"> |
|
<span>{{ billData.orderInfo.surplusQuantity }}</span> |
|
</el-form-item> |
|
<el-form-item label="剩余金额:"> |
|
<span>{{ billData.orderInfo.surplusAmount }}</span> |
|
</el-form-item> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="billBottom"> |
|
<div class="billBottom-title"> |
|
<span>提货单列表</span> |
|
<el-button type="primary" @click="billAdd()">创建提货单</el-button> |
|
</div> |
|
<div class="" style="height: 58vh;overflow: auto;"> |
|
<div class="billBottom-body" v-for="(item, index) in billData.list" :key="index"> |
|
<div class="billBottom-body-top"> |
|
<el-form-item label="提货单"> |
|
<span>{{ item.id }}</span> |
|
</el-form-item> |
|
<el-tag :type="orderTagType(item.deliveryStatus).type">{{ orderTagType(item.deliveryStatus).label |
|
}}</el-tag> |
|
</div> |
|
<div class="billBottom-body-middle"> |
|
<div class="billBottom-body-middle-info"> |
|
<el-form-item label="预约提货量"> |
|
<span>{{ item.preDeliveryQuantity }}</span> |
|
</el-form-item> |
|
<el-form-item label="提货人"> |
|
<span>{{ item.driverName }}</span> |
|
</el-form-item> |
|
<el-form-item label="车牌号"> |
|
<span>{{ item.plateNumber }}</span> |
|
</el-form-item> |
|
</div> |
|
<div class="billBottom-body-middle-info"> |
|
<el-form-item label="实际提货量"> |
|
<span>{{ item.accDeliveryQuantity }}</span> |
|
</el-form-item> |
|
<el-form-item label="身份证"> |
|
<span>{{ item.identityCard }}</span> |
|
</el-form-item> |
|
</div> |
|
</div> |
|
<div v-show="item.deliveryStatus == 'SUBMITED'" style="text-align: right;color: #409EFF;" |
|
@click="billAdd(item, index)">修改信息</div> |
|
<div class="billBottom-body-bottom"> |
|
<div> |
|
<el-form-item label="创建时间"> |
|
<span>{{ item.createTime }}</span> |
|
</el-form-item> |
|
<el-form-item label="更新时间"> |
|
<span>{{ item.updateTime }}</span> |
|
</el-form-item> |
|
</div> |
|
<div> |
|
<el-button |
|
v-show="item.deliveryStatus == 'SUBMITED' && billData.orderInfo.orderStatus == 'DELIVERING' && billData.orderInfo.payStatus !== 'REFUNDED'" |
|
type="danger" @click="billDelete(item, index)">删除提货单</el-button> |
|
<el-button :effect="orderTagType(item.deliveryStatus).effect" |
|
:disabled="item.deliveryStatus !== 'SUBMITED'" @click="billAddSave(2, item)" |
|
:type="orderTagType(item.deliveryStatus).type1">{{ orderTagType(item.deliveryStatus).info |
|
}}</el-button> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</el-form> |
|
</div> |
|
<div class="buttons"> |
|
<el-button @click="controlWindows.bill = false">取消 </el-button> |
|
<!-- <el-button @click="submit">订单确认</el-button> --> |
|
</div> |
|
<el-dialog :close-on-click-modal="false" :append-to-body="true" title="提货单信息" width="400px" |
|
:visible.sync="dialogBillAdd"> |
|
<el-form v-if="dialogBillAdd" :model="billAddData" ref="form" :rules="rules"> |
|
<el-form-item label="预约提货量" prop="preDeliveryQuantity"> |
|
<el-input v-model="billAddData.preDeliveryQuantity"></el-input>吨 |
|
</el-form-item> |
|
<el-form-item label="提货人" prop="driverName"> |
|
<el-input v-model="billAddData.driverName"></el-input> |
|
</el-form-item> |
|
<el-form-item label="提货人身份证号" prop="identityCard"> |
|
<el-input v-model="billAddData.identityCard"></el-input> |
|
</el-form-item> |
|
<el-form-item label="提货车牌号码" prop="plateNumber"> |
|
<el-input v-model="billAddData.plateNumber"></el-input> |
|
</el-form-item> |
|
</el-form> |
|
<div slot="footer" class="dialog-footer"> |
|
<el-button type="info" @click="dialogBillAdd = false">取 消</el-button> |
|
<el-button v-show="!billTitle" type="primary" @click="billAddSave()">确定</el-button> |
|
<el-button v-show="billTitle" type="primary" @click="billAddSave(1)">修改</el-button> |
|
<!-- <el-button v-show="billTitle" type="primary" @click="billAddSave(2)">修改并锁定</el-button> --> |
|
</div> |
|
</el-dialog> |
|
<el-dialog destroy-on-close title="提示" :close-on-click-modal="false" :append-to-body="true" |
|
:visible.sync="dialogDelivery" width="30%"> |
|
<el-form v-if="dialogDelivery"> |
|
<el-form-item label="实际提货量" prop="plateNumber"> |
|
<el-input v-model="deliveryQuantity"></el-input> |
|
</el-form-item> |
|
</el-form> |
|
<span slot="footer" class="dialog-footer"> |
|
<el-button @click="dialogDelivery = false">取 消</el-button> |
|
<el-button type="primary" @click="billdelivery()">确 定</el-button> |
|
</span> |
|
</el-dialog> |
|
</el-drawer> |
|
</template> |
|
|
|
<script> |
|
import serve from "api/product.js"; |
|
import order from "api/order.js"; |
|
import refineryInfoServe from "api/refineryInfo.js"; |
|
|
|
import autocomplete from "components/autocomplete/index.vue"; |
|
export default { |
|
components: { |
|
autocomplete, |
|
}, |
|
filters: { |
|
orderTagType(val) { |
|
switch (val) { |
|
case 'SUBMITED': return '订单提交' |
|
case 'ORDER_LOCKED': return '订单锁定' |
|
case 'ORDER_SUCCESS': return '下单成功' |
|
case 'DELIVERING': return '提货中' |
|
case 'COMPLETE': return '提货单完成' |
|
case 'CANCELED': return '订单取消' |
|
} |
|
return { label: val ? val : '暂无数据', type: 'info' } |
|
}, |
|
}, |
|
props: { |
|
controlWindows: Object, |
|
billData: Array |
|
// refineryTypeEnum: Array, |
|
}, |
|
data() { |
|
return { |
|
billTitle: '', |
|
quantity: '', |
|
deliveryQuantity: '', |
|
dialogDelivery: false, |
|
customList: [], |
|
form: { |
|
actAmount: 0 |
|
}, |
|
billAddData: {}, |
|
dialogBillAdd: false, |
|
productNameList: [], |
|
refineryList: [], |
|
productRowData: {}, |
|
configAutocomplete: { |
|
serveTarget: refineryInfoServe.findByEntity, |
|
autocompleteKey: "refineryName", |
|
labelKey: "refineryName", |
|
valueKey: "id", |
|
placeholder: "炼厂名称", |
|
querykey: "refineryId", |
|
echoId: "", |
|
echoName: "", |
|
}, |
|
rules: { |
|
preDeliveryQuantity: [ |
|
{ required: true, message: "请输入预约提货量", trigger: "blur" }, |
|
], |
|
driverName: [ |
|
{ required: true, message: "请输入提货人", trigger: "blur" }, |
|
], |
|
identityCard: [ |
|
{ required: true, message: "请输入提货人身份证号", trigger: "blur" }, |
|
], |
|
plateNumber: [ |
|
{ required: true, message: "请输入提货车牌号", trigger: "blur" }, |
|
], |
|
}, |
|
}; |
|
}, |
|
created() { |
|
}, |
|
methods: { |
|
billdelivery() { |
|
this.billAddData.deliveryStatus = 'COMPLETE' |
|
this.billAddData.accDeliveryQuantity = this.deliveryQuantity |
|
order.update(this.billAddData).then(res => { |
|
if (res.code == 20000) { |
|
this.billListMeth() |
|
// this.$set(this.billData.list,this.billData.index,this.billAddData) |
|
this.$message.success(res.msg) |
|
this.dialogDelivery = false |
|
} |
|
}); |
|
this.$emit('billOfLading', this.billData, 2) |
|
}, |
|
billSubmit(e, index) { |
|
if (e.deliveryStatus == 'PLATENUM_SUCCESS') { |
|
this.billAddData = JSON.parse(JSON.stringify(e)) |
|
this.billData.index = index |
|
this.dialogDelivery = true |
|
} else if (e.deliveryStatus == 'PLATENUM_LOCKED') { |
|
this.billAddData = JSON.parse(JSON.stringify(e)) |
|
this.billAddData.deliveryStatus = 'PLATENUM_SUCCESS' |
|
this.$confirm('是否确认?', '提示', { type: 'info' }).then(() => { |
|
console.log(this.billData.list, index, this.billAddData, 'aaaaaaaaaaa') |
|
order.update(this.billAddData).then(res => { |
|
if (res.code == 20000) { |
|
this.billListMeth() |
|
// this.$set(this.billData.list,index,this.billAddData) |
|
this.$message.success(res.msg) |
|
this.dialogBillAdd = false; |
|
this.$emit('billOfLading', this.billData, 2) |
|
|
|
} |
|
}) |
|
}) |
|
} |
|
}, |
|
orderTagType(val) { |
|
switch (val) { |
|
case 'SUBMITED': return { orderLabel: '订单提交', label: '等待信息', info: '锁定提货信息', type: 'warning', type1: '', orderType: 'warning', } |
|
case 'PLATENUM_LOCKED': return { orderLabel: '下单中', label: '信息锁定', info: '信息待确认', type: 'info', type1: 'info', orderType: 'warning' } |
|
case 'PLATENUM_SUCCESS': return { orderLabel: '下单成功', label: '提货中', info: '提货中', type: '', type1: 'info', orderType: '' } |
|
case 'DELIVERING': return { orderLabel: '提货中', label: '提货中', type: '', orderType: 'info' } |
|
case 'COMPLETE': return { orderLabel: '订单完成', label: '提货完成', info: '提货完成', type: 'success', type1: 'info', orderType: 'success' } |
|
case 'CANCELED': return { orderLabel: '订单取消', label: '订单取消', info: '订单取消', type: 'info', type1: 'dark', orderType: 'info' } |
|
default: return { orderLabel: '暂无数据', label: '暂无数据', info: '暂无数据', type: 'info', type1: 'dark', orderType: 'info' } |
|
} |
|
return { label: val ? val : '暂无数据', info: val ? val : '暂无数据', type: 'info' } |
|
}, |
|
//创建修改提货单弹窗 |
|
billAdd(e, index) { |
|
this.billTitle = e ? true : false |
|
this.billAddData = e ? JSON.parse(JSON.stringify(e)) : {} |
|
this.billData.index = index |
|
this.dialogBillAdd = true |
|
}, |
|
//创建修改提货单 |
|
billAddSave(e, item) { |
|
if (!e) { |
|
this.$refs["form"].validate((valid) => { |
|
if (valid) { |
|
this.billAddData.orderId = this.controlWindows.addInfo.id |
|
this.billAddData.productMeasurement = this.controlWindows.addInfo.productMeasurement |
|
order.billSave(this.billAddData).then(res => { |
|
if (res.code == 20000) { |
|
this.billAddData.deliveryStatus = 'SUBMITED' |
|
this.billData.list.push(this.billAddData) |
|
this.billListMeth() |
|
this.$message.success(res.msg) |
|
this.dialogBillAdd = false; |
|
} |
|
}) |
|
} |
|
}) |
|
} else { |
|
this.$confirm(`确定${e==1?'修改':'锁定'}提货单?`, '提示', { type: 'error' }).then(() => { |
|
// this.billAddData = item ? JSON.parse(JSON.stringify(item)) : {}; |
|
this.billAddData.deliveryStatus = e == 2 ? 'PLATENUM_LOCKED' : ''; |
|
console.log(this.billAddData,'this.billAddData') |
|
order.update(this.billAddData).then(res => { |
|
if (res.code == 20000) { |
|
this.billListMeth() |
|
this.$message.success(res.msg) |
|
this.dialogBillAdd = false; |
|
|
|
} |
|
}) |
|
}) |
|
} |
|
this.$emit('billOfLading', this.billData.orderInfo, 2) |
|
}, |
|
//更新提货单数据 |
|
billListMeth() { |
|
setTimeout(() => { |
|
order.findDeliveryByOrderId(this.controlWindows.addInfo.id).then((res) => { |
|
this.billData.list = res.data |
|
this.$forceUpdate() |
|
}); |
|
}, 200) |
|
}, |
|
//删除提货单 |
|
billDelete(e, index) { |
|
this.$confirm('确定删除提货单?', '提示', { type: 'error' }).then(() => { |
|
order.deleteBill({ id: e.id }).then(res => { |
|
if (res.code == 20000) { |
|
this.$message.success(res.msg) |
|
this.dialogBillAdd = false; |
|
this.billListMeth(); |
|
this.$emit('billOfLading', this.billData, 2) |
|
|
|
} |
|
}) |
|
this.$set(this.billData.list, index, '') |
|
}) |
|
}, |
|
openDrawer() { |
|
let { id } = this.controlWindows.addInfo; |
|
if (id) { |
|
//回显 |
|
this.form = JSON.parse(JSON.stringify(this.controlWindows.addInfo)); |
|
this.configAutocomplete.echoId = id; |
|
this.configAutocomplete.echoName = this.form.refineryName; |
|
console.log("this.form", this.form.floorPrice); |
|
} |
|
}, |
|
submit() { |
|
this.quantity = 0 |
|
this.billData.list.forEach(element => { |
|
this.quantity += element.accDeliveryQuantity |
|
}); |
|
this.$confirm('确定下单?', '提示', { type: 'success' }).then(() => { |
|
let data = { |
|
id: this.controlWindows.addInfo.id, |
|
actQuantity: this.quantity, |
|
customerId: this.controlWindows.addInfo.customerId |
|
} |
|
order.orderSuccess(data).then((res) => { |
|
if (res.code === 20000) { |
|
this.$message.success(res.msg); |
|
this.closeWindow(); |
|
} |
|
}); |
|
}) |
|
}, |
|
judgeInterface(form) { |
|
// let { id } = this.controlWindows.addInfo; |
|
// if (id) return serve.update(form); |
|
// else |
|
return serve.orderSave(form); |
|
}, |
|
closeWindow() { |
|
this.$emit("closeWindow"); |
|
this.form = {}; |
|
this.$refs.form.clearValidate(); |
|
this.controlWindows.create = false; |
|
}, |
|
}, |
|
}; |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.create { |
|
padding: 40px; |
|
|
|
.el-input, |
|
.el-select, |
|
.el-textarea, |
|
.el-autocomplete { |
|
width: 300px; |
|
} |
|
} |
|
|
|
.buttons { |
|
background: #fff; |
|
position: absolute; |
|
left: 0; |
|
bottom: 0; |
|
padding-right: 40px; |
|
width: 100%; |
|
height: 80px; |
|
line-height: 80px; |
|
text-align: right; |
|
border-top: 1px solid #f2f3f5; |
|
|
|
.el-button { |
|
text-align: right; |
|
font-size: 14px; |
|
border-radius: 5px; |
|
} |
|
} |
|
|
|
.billTop { |
|
background: #f0f0f0; |
|
padding: 15px 35px; |
|
border-radius: 5px; |
|
} |
|
|
|
.billTop-top, |
|
.billBottom-title, |
|
.billBottom-body-top, |
|
.billBottom-body-bottom { |
|
display: flex; |
|
justify-content: space-between; |
|
} |
|
|
|
.billTop-top-left { |
|
display: flex; |
|
|
|
::v-deep .el-form-item { |
|
margin-bottom: 0 |
|
} |
|
} |
|
|
|
.billBottom { |
|
.billBottom-title { |
|
align-items: center; |
|
margin: 20px 0; |
|
} |
|
} |
|
|
|
.billBottom-body-middle { |
|
::v-deep .el-form-item { |
|
margin-bottom: 0 |
|
} |
|
|
|
.billBottom-body-middle-info { |
|
display: flex; |
|
} |
|
} |
|
|
|
.billBottom-body { |
|
padding: 20px; |
|
box-shadow: 0 1px 4px rgba(0, 21, 41, .50); |
|
margin: 25px 0px; |
|
} |
|
|
|
.billBottom-body-bottom { |
|
::v-deep .el-form-item { |
|
margin-bottom: 0 |
|
} |
|
|
|
align-items: center; |
|
margin-top: 20px; |
|
} |
|
|
|
::v-deep .el-drawer__header { |
|
display: none; |
|
} |
|
|
|
::v-deep .billBottom .el-form-item__label { |
|
line-height: 20px; |
|
color: #999; |
|
} |
|
|
|
::v-deep .billBottom .el-form-item__content { |
|
line-height: 20px; |
|
} |
|
</style>
|
|
|