2023-04-18 17:02:02 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<div v-loading="loading" style="padding:20px">
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-form ref="ruleForm" :rules="ruleForm" :model="oilTfOrder" label-width="120px" :size="$store.getters.size">
|
|
|
|
|
|
<el-row :span="24">
|
|
|
|
|
|
<el-col :span="13">
|
|
|
|
|
|
<el-form-item label="匹配任务名称" prop="taskName">
|
|
|
|
|
|
<el-input v-model="oilTfOrder.taskName" clearable placeholder="请输入匹配任务内容" />
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="13">
|
|
|
|
|
|
<el-form-item label="匹配公司" prop="companyId">
|
|
|
|
|
|
<el-select v-model="oilTfOrder.companyId" style="width:100%" remote filterable :remote-method="parentCompanyOrginQuery" clearable placeholder="请输入" @change="queryCompanyInfo" @keyup.enter.native="getByPage">
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in companyList"
|
|
|
|
|
|
:key="item.id"
|
|
|
|
|
|
:label="item.name"
|
|
|
|
|
|
:value="item.id"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="13">
|
|
|
|
|
|
<el-form-item label="匹配目标金额" prop="matchAmount">
|
|
|
|
|
|
<el-input v-model="oilTfOrder.matchAmount" clearable />
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="13">
|
|
|
|
|
|
<el-form-item label="匹配油站" prop="siteId">
|
|
|
|
|
|
<!-- <el-input v-model="oilTfOrder.siteId" clearable /> -->
|
|
|
|
|
|
<div style="margin-bottom:20px">
|
|
|
|
|
|
<el-radio v-model="pipeiType" :label="0" border size="medium">按省份</el-radio>
|
|
|
|
|
|
<el-radio v-model="pipeiType" :label="1" border size="medium">按独立油站</el-radio>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<el-cascader
|
|
|
|
|
|
@change="query"
|
|
|
|
|
|
v-show="!pipeiType"
|
|
|
|
|
|
ref="refSubCat"
|
|
|
|
|
|
v-model="addrCode"
|
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
|
:size="$store.getters.size"
|
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
|
:options="areaTree"
|
|
|
|
|
|
:props="{value:'id', label:'areaName'}"
|
|
|
|
|
|
filterable
|
|
|
|
|
|
clearable
|
|
|
|
|
|
/>
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
v-show="pipeiType"
|
|
|
|
|
|
v-model="oilTfOrder.siteId"
|
|
|
|
|
|
style="width:100%"
|
|
|
|
|
|
filterable
|
|
|
|
|
|
remote
|
|
|
|
|
|
clear
|
|
|
|
|
|
clearable
|
|
|
|
|
|
reserve-keyword
|
|
|
|
|
|
placeholder="油站名称"
|
|
|
|
|
|
:remote-method="getSimpleOilSiteInfo"
|
|
|
|
|
|
@change="query"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-option v-for="item in sites" :key="item.id" :label="item.siteName" :value="item.id" />
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="13">
|
|
|
|
|
|
<el-form-item label="订单结束时间" prop="orderEndTime">
|
|
|
|
|
|
<el-date-picker
|
|
|
|
|
|
:picker-options="pickerOptions"
|
|
|
|
|
|
:disabled="disabled"
|
|
|
|
|
|
v-model="value1"
|
|
|
|
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
|
|
|
style="width:100%"
|
|
|
|
|
|
type="datetimerange"
|
|
|
|
|
|
range-separator="至"
|
|
|
|
|
|
:unlink-panels="true"
|
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
|
end-placeholder="结束日期"
|
|
|
|
|
|
@change="showss"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row type="flex" :span="24" class="row-show" justify="end" style="margin-bottom:24px;justify-content: space-between !important;padding: 0 50px;">
|
|
|
|
|
|
<el-col v-show="oilCompanyAccount.balance" :span="11">
|
|
|
|
|
|
<el-card class="box-card">
|
|
|
|
|
|
<div>
|
|
|
|
|
|
公司账户信息
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<hr>
|
|
|
|
|
|
<el-row style="margin-top:10px">
|
|
|
|
|
|
<el-col :span="12">
|
|
|
|
|
|
<font color="#A4A4A4">公司名称 </font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="12" style="text-align:right">
|
|
|
|
|
|
<font>{{ oilCompanyAccount.companyName }} </font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row style="margin-top:10px">
|
|
|
|
|
|
<el-col :span="12">
|
|
|
|
|
|
<font color="#A4A4A4">总余额： </font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="12" style="text-align:right">
|
|
|
|
|
|
<font>¥ {{ oilCompanyAccount.balance }}</font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
</el-card>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col v-show="orderQueryInfo.tfOrderTotal" :span="11">
|
|
|
|
|
|
<el-card class="box-card">
|
|
|
|
|
|
<div>
|
|
|
|
|
|
订单匹配信息
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<hr>
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-col :span="12">
|
|
|
|
|
|
<font color="#A4A4A4">订单数量： </font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="12" style="text-align:right">
|
|
|
|
|
|
<font> {{ orderQueryInfo.tfOrderTotal }} </font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
|
|
<el-row style="margin-top:10px">
|
|
|
|
|
|
<el-col :span="12">
|
|
|
|
|
|
<font color="#A4A4A4">订单金额 </font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="12" style="text-align:right">
|
|
|
|
|
|
<font>¥ {{ orderQueryInfo.payRealAmountTotal }} </font>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
|
|
</el-card>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-col :span="22">
|
|
|
|
|
|
<el-form-item label="匹配备注说明" prop="remark">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="oilTfOrder.remark"
|
|
|
|
|
|
type="textarea"
|
|
|
|
|
|
:rows="3"
|
|
|
|
|
|
placeholder="请输入内容"
|
|
|
|
|
|
clearable
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
<div :span="24"
|
|
|
|
|
|
style="background:#fff;margin-top:20px;text-align: right;width:100%;">
|
|
|
|
|
|
<el-button @click="close">取消</el-button>
|
|
|
|
|
|
<el-button type="primary" @click="submit" style="margin-right:10px">提交</el-button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</el-form>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import oilCompanyInfoApi from '@/api/user/oilCompanyInfo'
|
|
|
|
|
|
import oilCompanyAccountApi from '@/api/finance/oilCompanyAccount'
|
|
|
|
|
|
import oilSiteInfoApi from '@/api/user/oilSiteInfo'
|
|
|
|
|
|
import AreaCodeApi from '@/api/base/areaCode'
|
|
|
|
|
|
import orderInfoApi from '@/api/order/orderInfo'
|
|
|
|
|
|
export default {
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
pickerOptions:{
|
|
|
|
|
|
disabledDate:function(e){
|
|
|
|
|
|
if(Date.parse(e)<Date.parse('2022/05/25')){
|
|
|
|
|
|
return true
|
|
|
|
|
|
}else{
|
|
|
|
|
|
return false
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
disabled:false,
|
|
|
|
|
|
pipeiType:0,
|
|
|
|
|
|
areaTree: [],
|
|
|
|
|
|
addrCode: [], // 省市区code
|
|
|
|
|
|
value1: '',
|
|
|
|
|
|
gridNum: {
|
|
|
|
|
|
row: {
|
|
|
|
|
|
gutter: 2
|
|
|
|
|
|
},
|
|
|
|
|
|
cols: {
|
|
|
|
|
|
xs: 24,
|
|
|
|
|
|
sm: 24,
|
|
|
|
|
|
md: 12,
|
|
|
|
|
|
lg: 12,
|
|
|
|
|
|
xl: 6
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
oilTfOrder: {
|
|
|
|
|
|
},
|
|
|
|
|
|
sites: [], // 主油站集合
|
|
|
|
|
|
loading: false,
|
|
|
|
|
|
ruleForm: {
|
|
|
|
|
|
task_name: [
|
|
|
|
|
|
{ required: true, message: '匹配任务名称不能为空', trigger: 'change' }
|
|
|
|
|
|
],
|
|
|
|
|
|
companyId: [
|
|
|
|
|
|
{ required: true, message: '匹配公司不能为空', trigger: 'change' }
|
|
|
|
|
|
],
|
|
|
|
|
|
matchAmount: [
|
|
|
|
|
|
{ required: true, message: '匹配目标金额不能为空', trigger: 'change' },
|
|
|
|
|
|
{ pattern: /(^[1-9]\d{0,5}(\.[0-9]{1,2})?$)|(^[0](\.\d{1,2})?$)|(^[1][0]{6}(\.[0]{1,2})?$)/, message: '匹配金额在1-1000000区间' }
|
|
|
|
|
|
],
|
|
|
|
|
|
orderStartTime: [
|
|
|
|
|
|
{ required: true, message: '订单开始时间不能为空', trigger: 'change' }
|
|
|
|
|
|
]
|
|
|
|
|
|
},
|
|
|
|
|
|
companyList: [], // 企业列表
|
|
|
|
|
|
orderQueryInfo: {}, // 匹配订单信息
|
|
|
|
|
|
oilCompanyAccount: {} // 企业账户信息
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
watch:{
|
|
|
|
|
|
pipeiType(){
|
|
|
|
|
|
if(this.pipeiType){
|
|
|
|
|
|
this.addrCode = []
|
|
|
|
|
|
}else{
|
|
|
|
|
|
this.oilTfOrder.siteId = ''
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
created() {
|
|
|
|
|
|
AreaCodeApi.getTree().then(res => {
|
|
|
|
|
|
this.areaTree = res.data
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
showss() {
|
|
|
|
|
|
this.oilTfOrder.orderStartTime = this.value1[0]
|
|
|
|
|
|
this.oilTfOrder.orderEndTime = this.value1[1]
|
|
|
|
|
|
this.query()
|
|
|
|
|
|
},
|
|
|
|
|
|
// 远程搜索主油站
|
|
|
|
|
|
getSimpleOilSiteInfo(siteName) {
|
|
|
|
|
|
if (siteName) {
|
|
|
|
|
|
const oilSiteInfo = {}
|
|
|
|
|
|
oilSiteInfo.siteName = siteName
|
|
|
|
|
|
oilSiteInfoApi.getSimpleOilSiteInfo(oilSiteInfo).then(res => {
|
|
|
|
|
|
this.sites = res.data
|
|
|
|
|
|
})
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.sites = []
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
queryCompanyInfo(value) {
|
|
|
|
|
|
console.log('123')
|
|
|
|
|
|
if (value) {
|
|
|
|
|
|
oilCompanyAccountApi.getByCompanyId(value).then(res => {
|
|
|
|
|
|
this.oilCompanyAccount = res.data
|
|
|
|
|
|
})
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.oilCompanyAccount = {}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
parentCompanyOrginQuery(value) { // 远程搜索企业
|
|
|
|
|
|
if (value) {
|
2023-04-20 09:11:45 +08:00
|
|
|
|
oilCompanyInfoApi.getLikeByNameSuccess({ 'name': value }).then(res => {
|
2023-04-18 17:02:02 +08:00
|
|
|
|
this.companyList = res.data
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
// disabledDate(){
|
|
|
|
|
|
// console.log(arguments,'禁用回调')
|
|
|
|
|
|
|
|
|
|
|
|
// return false
|
|
|
|
|
|
// },
|
|
|
|
|
|
query() {
|
|
|
|
|
|
if(this.addrCode.length>0 && this.addrCode){
|
|
|
|
|
|
this.oilTfOrder.provinceCode = this.addrCode[0]
|
|
|
|
|
|
}else{
|
|
|
|
|
|
this.oilTfOrder.provinceCode = ''
|
|
|
|
|
|
}
|
|
|
|
|
|
// 查询日期匹配信息
|
|
|
|
|
|
if (this.oilTfOrder.orderEndTime && this.oilTfOrder.orderStartTime) {
|
|
|
|
|
|
orderInfoApi.getTfOrderInfo(this.oilTfOrder).then(res => {
|
|
|
|
|
|
console.log(res)
|
|
|
|
|
|
this.orderQueryInfo = res.data
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
submit() {
|
|
|
|
|
|
this.$refs['ruleForm'].validate((valid) => {
|
|
|
|
|
|
console.log(valid)
|
|
|
|
|
|
if (valid) {
|
|
|
|
|
|
console.log('这里是匹配订单信息')
|
|
|
|
|
|
console.log(this.oilTfOrder)
|
|
|
|
|
|
this.save(this.oilTfOrder)
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
save() {
|
|
|
|
|
|
this.$confirm('是否确定添加，请确认！', '提示', {
|
|
|
|
|
|
confirmButtonText: '确定',
|
|
|
|
|
|
cancelButtonText: '取消',
|
|
|
|
|
|
type: 'warning'
|
|
|
|
|
|
}).then(() => {
|
|
|
|
|
|
// 这里调用接口
|
|
|
|
|
|
// 保存
|
|
|
|
|
|
this.loading = true
|
|
|
|
|
|
orderInfoApi.TfOrder(this.oilTfOrder).then(res => {
|
|
|
|
|
|
this.$message.success(res.msg)
|
|
|
|
|
|
this.oilTfOrder = {}
|
|
|
|
|
|
this.orderQueryInfo = {}
|
|
|
|
|
|
this.oilCompanyAccount = {}
|
|
|
|
|
|
this.companyList = []
|
|
|
|
|
|
this.value1 = ''
|
|
|
|
|
|
this.loading = false
|
|
|
|
|
|
this.$emit('closeDialog')
|
|
|
|
|
|
this.$emit('getByPage')
|
|
|
|
|
|
})
|
|
|
|
|
|
}).catch(() => {
|
|
|
|
|
|
this.$message({
|
|
|
|
|
|
type: 'info',
|
|
|
|
|
|
message: '已取消'
|
|
|
|
|
|
})
|
|
|
|
|
|
}).finally(res=>{
|
|
|
|
|
|
this.loading = false;
|
|
|
|
|
|
console.log('finally')
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
close() {
|
|
|
|
|
|
this.$emit('closeDialog')
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<style>
|
|
|
|
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
.el-divider--horizontal {
|
|
|
|
|
|
margin: 10px 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
