新增付款单

This commit is contained in:
hr121 2024-09-27 15:15:04 +08:00
parent fda03b51e8
commit 2021920664

View File

@ -0,0 +1,432 @@
<template>
<div class="app-container">
<!-- 搜索 -->
<div class="filter-container">
<el-form :inline="true" :model="searchForm">
<el-form-item label="订单编号" >
<el-input v-model="searchForm.order_num" placeholder="请输入订单编号" />
</el-form-item>
<el-form-item label="结算单位" >
<el-input v-model="searchForm.driver_account" placeholder="请输入结算单位" />
</el-form-item>
<el-form-item label="经办人" >
<el-input v-model="searchForm.driver_name" placeholder="请输入经办人" />
</el-form-item>
<el-form-item label="部门" >
<el-input v-model="searchForm.driver_name" placeholder="请输入部门" />
</el-form-item>
<template>
<div style="display:inline-block;">
<span class="g66 f700 font-14">付款日期</span>
<el-date-picker
v-model="searchForm.start_time"
:picker-options="pickerOptionsStart"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy-MM-dd HH:mm:ss"
@change="changeEnd"/>
<!-- <span>~</span>
<el-date-picker
v-model="searchForm.end_time"
:picker-options="pickerOptionsEnd"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
@change="changeStart"/> -->
</div>
</template>
<el-form-item label="供应商名称" >
<el-input v-model="searchForm.supplier_name" placeholder="请输入供应商名称" />
</el-form-item>
<el-form-item label="工地名称" >
<el-input v-model="searchForm.site_name" placeholder="请输入工地名称" />
</el-form-item>
<el-form-item label="订单状态" >
<el-select v-model="searchForm.order_status" placeholder="请选择" @change="changeStatus" clearable>
<el-option label="待完善" value="status-00" ></el-option>
<el-option label="已完善" value="status-01" ></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="fetchData">搜索</el-button>
<router-link to="/distributionManagement/disCreate"><el-button class="ml-10" type="primary" icon="el-icon-edit">新增</el-button></router-link>
<el-button class="ml-10" type="primary" icon="el-icon-download" @click="handleDownload">导出</el-button>
</el-form-item>
</el-form>
</div>
<!-- 表格 -->
<el-table v-loading="listLoading" :data="firmList" border fit highlight-current-row style="width: 100%;">
<el-table-column label="ID" prop="delivery_id" align="center" width="80"></el-table-column>
<el-table-column label="订单编号" prop="order_num" align="center"></el-table-column>
<el-table-column label="单据编号" prop="delivery_no" align="center"></el-table-column>
<!-- <el-table-column label="配送司机" prop="driver_name" align="center"></el-table-column> -->
<el-table-column label="车辆号码" prop="driver_account" align="center"></el-table-column>
<el-table-column label="联系电话" prop="driver_phone" align="center"></el-table-column>
<el-table-column label="供应商名称" prop="supplier_name" align="center"></el-table-column>
<el-table-column label="中转站名称" prop="transit_name" align="center"></el-table-column>
<el-table-column label="工地名称" prop="site_name" align="center"></el-table-column>
<el-table-column label="配送时间" prop="create_time" align="center"></el-table-column>
<el-table-column label="订单状态" prop="order_status" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.order_status=='status-00'" type="danger">待完善</el-tag>
<el-tag v-else-if="scope.row.order_status=='status-01'">已完善</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="220">
<template slot-scope="scope">
<el-button class="ml-10" type="primary" size="mini" @click="handleDetail(scope.row.delivery_id)">配送详情</el-button>
<el-button class="ml-10" size="mini" :type="scope.row.order_status=='status-01'?'danger':'primary'"
@click="handleEntry(scope.row.delivery_id)"> {{scope.row.order_status=='status-01'?' 修改信息 ':'录入信息' }}</el-button>
</template>
</el-table-column>
</el-table>
<!-- 翻页 -->
<pagination v-show="total>0"
:total="total"
:page.sync="searchForm.page"
:page_len.sync="searchForm.page_len"
@pagination="fetchData" />
<!-- 详情弹窗 -->
<el-dialog title="订单详情" :visible.sync="dialogDetail" center width="1000px" style="margin-top:-60px;" @close="closeDialog2">
<div class="flex">
<el-form :model="detailDelivery" label-width="120px" >
<el-form-item label="订单编号:">{{detailDelivery.order_num}}</el-form-item>
<!-- <el-form-item label="配送司机:">{{detailDelivery.driver_name}}</el-form-item> -->
<el-form-item label="单据编号:">{{detailDelivery.delivery_no}}</el-form-item>
<el-form-item label="车辆号码:">{{detailDelivery.driver_account}}</el-form-item>
<el-form-item label="司机电话:">{{detailDelivery.driver_phone}}</el-form-item>
<el-form-item label="配送时间:">{{detailDelivery.create_time}}</el-form-item>
<el-form-item label="配送产品:">{{getProductType(detailDelivery.product_type)}}</el-form-item>
<el-form-item label="品种编号:">{{detailDelivery.variety_num}}</el-form-item>
</el-form>
<el-form :model="detailDelivery" label-width="230px" >
<el-form-item label="出厂数量(吨)">{{detailDelivery.order_ton}}</el-form-item>
<el-form-item label="实收数量(吨)">{{detailDelivery.over_ton}}</el-form-item>
<el-form-item label="成本单价:">{{detailDelivery.base_fee}}</el-form-item>
<el-form-item label="成本总价:">{{detailDelivery.base_sum}}</el-form-item>
<el-form-item label="销售价:">{{detailDelivery.sale_fee}}</el-form-item>
<el-form-item label="销售总价:">{{detailDelivery.sale_sum}}</el-form-item>
</el-form>
<el-form :model="detailDelivery" label-width="230px" >
<el-form-item label="运费:">{{detailDelivery.post_fee}}</el-form-item>
<el-form-item label="返点金额:">{{detailDelivery.return_fee}}</el-form-item>
<el-form-item label="供应商名称:">{{detailDelivery.supplier_name}}</el-form-item>
<!-- <el-form-item label="供应商联系人:">{{detailDelivery.supplier_man}}</el-form-item>
<el-form-item label="供应商电话:">{{detailDelivery.supplier_phone}}</el-form-item>
<el-form-item label="供应商地址:">{{detailDelivery.supplier_address}}</el-form-item> -->
<el-form-item label="工地名称:">{{detailDelivery.site_name}}</el-form-item>
<el-form-item label="工地负责人:">{{detailDelivery.site_man}}</el-form-item>
<el-form-item label="工地地址:">{{detailDelivery.site_address}}</el-form-item>
<el-form-item label="负责人电话:">{{detailDelivery.man_phone}}</el-form-item>
</el-form>
</div>
<el-form class="ml-30" :model="detailDelivery" label-width="120px" >
<el-form-item label="其他回执:">
<div class="flex flex-wrap" style="width:700px">
<div v-for="(item, index) in detailDelivery.order_receipt"
:key="index" :data-img="detailDelivery.order_receipt"
@click="showImg($event,index)">
<img class="poi flex ml-10 mt-10" style="width:100px;" :src="baseUrl+item"/>
</div>
</div>
</el-form-item>
</el-form>
</el-dialog>
<!-- 录入信息弹窗 -->
<el-dialog title="录入信息" :visible.sync="dialogEntry" center width="1000px" @close="closeDialog">
<el-form :model="entryInfo" label-width="100px" :rules="formRules" ref="postForm" >
<div class="flex">
<span class="ml-40 g66 f700">配送产品</span>
<div class="box">
<div>
<el-col class="line-r line-b tac" :span="3">类型</el-col>
<el-col class="line-r line-b tac" :span="3">品种</el-col>
<el-col class="line-r line-b tac" :span="3">出厂数量()</el-col>
<el-col class="line-r line-b tac" :span="3">实收数量</el-col>
<el-col class="line-r line-b tac" :span="3">成本单价</el-col>
<el-col class="line-r line-b tac" :span="3">成本总价</el-col>
<el-col class="line-r line-b tac" :span="3">销售价</el-col>
<el-col class="line-b tac" :span="3">销售总价</el-col>
</div>
<div>
<el-col class="line-r line-b tac" :span="3">{{getProductType(entryInfo.product_type)}}</el-col>
<el-col class="line-r line-b tac" :span="3">{{entryInfo.variety_num}}</el-col>
<el-col class="line-r line-b tac" :span="3">
<!-- {{entryInfo.order_ton}} -->
<el-input v-model="entryInfo.order_ton" @change="changNum(3)"/>
</el-col>
<el-col class="line-r line-b tac" :span="3">
<el-input v-model="entryInfo.over_ton" @change="changNum(0)"/>
</el-col>
<el-col class="line-r line-b tac" :span="3">
<el-input v-model="entryInfo.base_fee" @change="changNum(1)"/>
</el-col>
<el-col class="line-r line-b tac" :span="3">{{entryInfo.base_sum}}</el-col>
<el-col class="line-r line-b tac" :span="3">
<el-input v-model="entryInfo.sale_fee" @change="changNum(2)"/>
</el-col>
<el-col class="line-b tac" :span="3">{{entryInfo.sale_sum}}</el-col>
</div>
</div>
</div>
<!-- <el-form-item label="运费:">
<el-col :span="6">
<el-input v-model.number="entryInfo.post_fee" placeholder="请输入运费"/>
</el-col>
</el-form-item> -->
<el-form-item label="返点金额:" prop="return_fee">
<el-col :span="6">
<el-input v-model.number="entryInfo.return_fee" placeholder="请输入返点金额"/>
</el-col>
</el-form-item>
<el-form-item align="center">
<el-button type="primary" @click="submitForm">保存</el-button>
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
<script>
import { checkRqInput, checkNum, checkNum0 } from '@/utils/validate'
import { listDelivery, detailDelivery, saveDelivery, exportDelivery } from '@/api/order/index'
import imgDialog from '../../components/imgPreview/ImgPreview'
import { baseUrl } from '@/utils/env.js'
export default {
components: {
imgDialog
},
data() {
return {
firmList: [], //
total: 0, //
listLoading: true,
//
searchForm: {
page: 1,
page_len: 10,
order_status:'',
start_time:'',end_time:''
},
dialogDetail: false, //
detailDelivery: {}, //
dialogEntry: false, //
entryInfo: {
base_sum: '',
sale_sum: '',
// post_fee: '',
return_fee: '',
}, //
//
formRules: {
// post_fee: [ checkNum ],
return_fee: [ checkRqInput, checkNum ]
},
//
pickerOptionsStart: {},
pickerOptionsEnd: {},
baseUrl,
}
},
created() {
this.fetchData()
},
methods: {
//
fetchData(obj={}) {
if(obj.page) {
this.searchForm.page = obj.page
this.searchForm.page_len = obj.page_len
}
this.searchForm.order_status = this.$route.query.order_status?this.$route.query.order_status:this.searchForm.order_status;
this.listLoading = true
this.$http(listDelivery(this.searchForm), (res) => {
this.firmList = res.data.result
this.total = res.data.data_sum
this.listLoading = false
})
},
//
changeStatus() {
this.$route.query.order_status = ''
},
//
handleDetail(id) {
this.$http(detailDelivery(id), (res) => {
this.detailDelivery = res.data
this.dialogDetail = true
})
},
//
handleEntry(id) {
this.$http(detailDelivery(id), (res) => {
let data = res.data
this.entryInfo.delivery_id = id
this.entryInfo.product_type = data.product_type
this.entryInfo.variety_num = data.variety_num
this.entryInfo.order_ton = data.order_ton
this.entryInfo.over_ton = data.over_ton
this.entryInfo.base_fee = data.base_fee
this.entryInfo.base_sum = data.base_sum
this.entryInfo.sale_fee = data.sale_fee
this.entryInfo.sale_sum = data.sale_sum
// this.entryInfo.post_fee = data.post_fee
this.entryInfo.return_fee = data.return_fee
this.dialogEntry = true
})
},
//
showImg(e,msg){
this.detailDelivery.order_receipt.forEach( (item,index) => {
if (index == msg) {
this.curIdx = index
}
})
this.$imgPreview(e,this.curIdx)
},
//
getProductType(value) {
return value=="type-00"?"散装":(value=="type-01"?"袋装":"")
},
checkNum(value) {
let reg = /[^\d\.]/g;
if (isNaN(value)||new RegExp(reg).test(value)) {
this.$message({
message: '请输入非负数值!!!',
type: 'warning'
})
return false
}
return true
},
//
changNum(index) {
let flag = false
if (index==0) {
this.checkNum(this.entryInfo.over_ton) ? '' : flag=true
} else if (index==1) {
this.checkNum(this.entryInfo.base_fee) ? '' : flag=true
} else if (index==2) {
this.checkNum(this.entryInfo.sale_fee) ? '' : flag=true
} else if(index==3) {
this.checkNum(this.entryInfo.order_ton) ? '' : flag=true
}
if (flag) {
return ''
}
this.entryInfo.base_sum = (this.entryInfo.base_fee * this.entryInfo.over_ton).toFixed(2)
this.entryInfo.sale_sum = (this.entryInfo.sale_fee * this.entryInfo.over_ton).toFixed(2)
},
//
submitForm() {
if (!this.checkNum(this.entryInfo.over_ton)||!this.checkNum(this.entryInfo.base_fee)||!this.checkNum(this.entryInfo.sale_fee)) {
this.$message({
message: '请输入非负数值!!!',
type: 'warning'
})
return ""
}
// if (this.entryInfo.post_fee<0) {
// this.$message({
// message: '0',
// type: 'warning'
// })
// return ""
// }
this.$refs['postForm'].validate((valid) => {
if (valid) {
this.$http(saveDelivery(this.entryInfo), res => {
this.$message({
message: '成功',
type: 'success'
})
this.fetchData()
this.dialogEntry = false
})
} else {
return false
}
})
},
//
handleDownload() {
this.$http(exportDelivery(this.searchForm), (res) => {
window.location.href = this.baseUrl + res.data.url
})
},
//
changeStart() {
let self = this
if (!this.searchForm.end_time) {
this.pickerOptionsStart = {
disabledDate: {}
}
return
}
this.pickerOptionsStart = Object.assign({}, self.pickerOptionsStart, {
disabledDate(time) {
return time.getTime() > new Date(self.searchForm.end_time).getTime()
}
})
},
//
changeEnd() {
let self = this
if (!this.searchForm.start_time) {
this.pickerOptionsEnd = {
disabledDate: {}
}
return
}
this.pickerOptionsEnd = Object.assign({}, self.pickerOptionsEnd, {
disabledDate(time) {
return time.getTime() < new Date(self.searchForm.start_time).getTime()
}
})
},
//
closeDialog() {
this.$refs['postForm'].resetFields();
},
//
closeDialog2() {
this.detailDelivery = {}
},
}
}
</script>
<style lang='scss' scoped>
.img {
width: 40px;
height: 40px;
border-radius: 50%;
}
.line-r {
border-right: 1px solid #ccc;
}
.box {
width: 800px;
border-top: 1px solid #ccc;
border-right: 1px solid #ccc;
border-left: 1px solid #ccc;
margin-bottom: 30px;
.line-r {
border-right: 1px solid #ccc;
}
.line-b {
height: 44px;
line-height: 44px;
border-bottom: 1px solid #ccc;
}
.flex-clome {
display: flex;
flex-direction: column;
}
.flex-row {
display: flex;
justify-content: flex-start;
}
}
</style>