<template>
<section class="goods pagex">
<div class="goods-con">
<el-form :inline="true" :model="formParam" label-width="95px" ref="ruleForm">
<el-form-item>
<el-button type="primary" @click="submit('ruleForm')">提交</el-button>
<el-button @click="canel">取消</el-button>
</el-form-item>
<div class="tip-title" style="margin-top: 0">
<p>基本信息</p>
</div>
<el-form-item label="物流公司：">
<el-select v-model="formParam.shipping_id" placeholder="请选择" prop="shipping_id">
<el-option value="13" label="联邦快递"></el-option>
<el-option value="12" label="DHL国际快递"></el-option>
<el-option value="1" label="顺丰速运"></el-option>
<el-option value="100" label="供应商配送"></el-option>
<el-option value="4" label="快递送货"></el-option>
<el-option value="5" label="韵达快递"></el-option>
<el-option value="8" label="速尔快递"></el-option>
<el-option value="9" label="TNT快递"></el-option>
<el-option value="10" label="自提"></el-option>
<el-option value="11" label="京东快递"></el-option>
<el-option value="15" label="优速物流"></el-option>
<el-option value="16" label="顺丰特惠"></el-option>
<el-option value="17" label="UPS"></el-option>
</el-select>
</el-form-item>
<el-form-item label="物流单号：">
<el-input v-model="formParam.shipment_number" placeholder="请输入物流单号"></el-input>
</el-form-item>
<el-form-item label="发货时间：">
<el-date-picker v-model="formParam.delivery_time" type="date" placeholder="请选择发货时间" value-format="yyyy-MM-dd" :picker-options="pickerOption"></el-date-picker>
</el-form-item>
<el-form-item label="订货公司：">
<span v-if="purOrderDetail.purchase_info">{{ purOrderDetail.purchase_info.company_name }}</span>
</el-form-item>
<el-form-item label="订单人员：">
<span v-if="purOrderDetail.purchase_info">{{ purOrderDetail.purchase_info.purchase_name }}</span>
</el-form-item>
<div class="tip-title">
<p>发货信息</p>
</div>
</el-form>
<div class="data-box th-all">
<el-table :data="purOrderDetail.purchase_item_list" border max-height="600" @selection-change="handleSelectionChange">
<el-table-column fixed type="selection" width="40"></el-table-column>
<el-table-column prop="goods_name" label="型号" min-width="15%"></el-table-column>
<el-table-column prop="brand_name" label="品牌" min-width="15%"></el-table-column>
<el-table-column prop="out_qty" label="发货数量" min-width="15%">
<template slot-scope="scope">
<el-input v-model="itemlist[scope.$index].out_qty" placeholder="请输入内容"></el-input>
</template>
</el-table-column>
<el-table-column prop="no_out_qty" label="未发货数量" min-width="15%"></el-table-column>
<el-table-column prop="out_qty" label="已发货数量" min-width="15%"></el-table-column>
<el-table-column prop="purchase_qty" label="订单数量" min-width="15%"></el-table-column>
<el-table-column prop="price_in_tax" label="单价" min-width="15%"></el-table-column>
<el-table-column prop="total_amount" label="小计" min-width="15%"></el-table-column>
</el-table>
</div>
</div>
<Menu></Menu>
</section>
</template>
<script>
import Vue from 'vue';
import Menu from "@/components/menu.vue";
import {Autocomplete, Button, Cascader, DatePicker, Dialog, Form, FormItem, Input, Message, Option, Pagination, Select, Table, TableColumn} from 'element-ui'
Vue.prototype.$message = Message;
Vue.use(Button).use(Form).use(Select).use(Option).use(Input).use(FormItem).use(Dialog).use(Pagination).use(DatePicker);
Vue.use(TableColumn).use(Table).use(Cascader).use(Autocomplete);
export default {
name: "orderTrackPurAdd",
data() {
return {
purOrderDetail: {},//基本信息,发货信息
purchase_uid: '',
multipleSelection: [],//选中的数据
pickerOption: {
disabledDate(time) {
return time.getTime() < Date.now() - 8.64e7;
}
},
itemlist: [],
formParam: {
company_id: '',
shipping_id: '',
shipment_number: '',
delivery_time: '',
itemlist: []
}
};
},
created() {
this.purchase_uid = this.$route.query.purchase_id;
this.getData();
},
methods: {
getData() {
this.$http('POST', "/api/purchase/purOrderDetail", {
id: this.purchase_uid
}).then(res => {
if (res.code === 0) {
this.purOrderDetail = res.data;
this.formParam.company_id = res.data.purchase_info.company_id;
//组装formParam
for (let i = 0; i < res.data.purchase_item_list.length; i++) {
this.itemlist.push({
"purchase_item_id": res.data.purchase_item_list[i].purchase_item_id,
"purchase_id": res.data.purchase_item_list[i].purchase_id,
"out_qty": res.data.purchase_item_list[i].purchase_qty - res.data.purchase_item_list[i].out_qty
})
}
} else {
this.$message({
message: res.msg,
type: 'warning'
});
}
})
},
handleCurrentChange(val) {
this.page = val;
this.getData();
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
submit(formName) {
var self = this;
this.$refs[formName].validate((valid) => {
if (valid) {
if (this.multipleSelection.length <= 0) {
this.$message({
message: "请选择发货信息",
type: 'warning'
});
return false;
}
let filterArr = [];
for (let i = 0; i < this.itemlist.length; i++) {
for (let j = 0; j < this.multipleSelection.length; j++) {
if (this.multipleSelection[j].purchase_item_id == this.itemlist[i].purchase_item_id) {
filterArr.push(this.itemlist[i])
}
}
}
this.formParam.itemlist = filterArr;
this.$http('POST', "/api/purchase/addSupDelivery", this.formParam).then(res => {
if (res.code === 0) {
this.$message({
message: res.msg,
type: 'success',
duration: 2000,
onClose() {
document.querySelector('.item-boxs a.act .iconfont').click();
self.$router.push({
path: "/orderTrackGoods"
})
}
});
} else {
this.$message({
message: res.msg,
type: 'error'
});
}
})
} else {
console.log('error submit!!');
return false;
}
});
},
canel() {
document.querySelector('.item-boxs a.act .iconfont').click();
setTimeout(() => {
this.$router.push({
path: "/orderTrackGoods"
})
}, 1000)
}
},
components: {
Menu
}
};
</script>
<style scoped>
@import "../../assets/css/goods/goods.min.css";
</style>