Commit a34b50f2 authored by jiaorz's avatar jiaorz

订单管理详细

parent 11c6454f
......@@ -6,4 +6,30 @@ export function page(query) {
method: 'get',
params:query
});
}
\ No newline at end of file
}
/**
* 获取所有分公司
*/
export function getAllBranchCompany() {
return fetch({
url: '/vehicle/branchCompany',
method: 'get'
});
}
//根据大区Id获取分公司列表
export function getAllBranchCompanyByZoneId(query) {
return fetch({
url: '/vehicle/branchCompany/app/unauth/getByZone',
method: 'get',
params:query
});
}
export function getOrderVehicleCrosstown(query) {
return fetch({
url: '/api/order/orderVehicle/getByOrderId',
method: 'get',
params:query
});
}
......@@ -13,7 +13,7 @@
<el-input v-model="listQuery.phone" placeholder="请输入手机号"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-col :span="5">
<el-form-item label="状态">
<el-select class="filter-item" v-model="listQuery.status" placeholder="请选择状态">
<el-option :key="null" label="无" :value="null" ></el-option>
......@@ -24,14 +24,14 @@
</el-select>
</el-form-item>
</el-col>
<el-col>
<!-- <el-col>
<el-form-item label="时间">
<el-date-picker v-model="listQuery.startTime" type = "date" placeholder = "请输入开始时间"></el-date-picker>
<span>——</span>
<el-date-picker v-model="listQuery.endTime" type = "date" placeholder = "请输入结束时间"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
</el-col> -->
<el-col :span="5">
<el-form-item label="会员类型">
<el-select class="filter-item" v-model="listQuery.name" placeholder="请选择会员类型">
<el-option :key="null" label="无" :value="null" ></el-option>
......@@ -67,7 +67,7 @@
</el-table-column>
<el-table-column width="150" align="center" label="用户名">
<template scope="scope">
<span>{{scope.row.username}}</span>
<span>{{scope.row.telephone}}</span>
</template>
</el-table-column>
<el-table-column width="110" align="center" label="商品价格">
......
......@@ -3,16 +3,32 @@
<div class="filter-container" ref="filter-container">
<el-form ref="queryForm" :model="listQuery" label-width="100px">
<el-row>
<el-col :span="5">
<el-form-item label="所属地区" prop="zoneId">
<el-select class="filter-item" v-model="listQuery.zoneId" placeholder="请选择" @change="getProvinceRegions">
<el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option v-for="val in getAllZoneList" :key="val.id" :label="val.name" :value="val.id"> </el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="所属公司" prop="startCompanyId">
<el-select class="filter-item" v-model="listQuery.startCompanyId" placeholder="请选择" @change="getAllBranchCompanyChange">
<el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option v-for="val in allBranchCompany" :key="val.id" :label="val.name" :value="val.id"> </el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="订单号">
<el-input v-model="listQuery.no" placeholder="请输入订单号"></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<!-- <el-col :span="5">
<el-form-item label="手机号">
<el-input v-model="listQuery.phone" placeholder="请输入手机号"></el-input>
</el-form-item>
</el-col>
</el-col> -->
<el-col :span="8">
<el-form-item label="状态">
<el-select class="filter-item" v-model="listQuery.status" placeholder="请选择状态">
......@@ -26,13 +42,13 @@
</el-select>
</el-form-item>
</el-col>
<el-col>
<!-- <el-col>
<el-form-item label="时间">
<el-date-picker v-model="listQuery.startTime" type = "date" placeholder = "请输入开始时间"></el-date-picker>
<span>——</span>
<el-date-picker v-model="listQuery.endTime" type = "date" placeholder = "请输入结束时间"></el-date-picker>
</el-form-item>
</el-col>
</el-col> -->
</el-row>
</el-form>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
......@@ -57,9 +73,9 @@
<span>{{scope.row.name}}</span><br/><span>{{scope.row.vehicleNumberPlat}}</span>
</template>
</el-table-column>
<el-table-column width="150" align="center" label="用户ID/用户名">
<el-table-column width="150" align="center" label="姓名/手机号">
<template scope="scope">
<span>{{scope.row.userId}}</span>/<span>{{scope.row.username}}</span>
<span>{{scope.row.username}}</span>/<span>{{scope.row.telephone}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="取车时间/还车时间">
......@@ -96,13 +112,20 @@
</template>
</el-table-column>
<!-- <el-table-column align="center" label="操作" width="150">
<template scope="scope">
<el-button v-if="btn_buy && scope.row.state == 0" size="small" type="success" @click="handleBuy(scope.row)">订单详情</el-button>
<el-button v-if="btn_buy && scope.row.state == 0" size="small" type="success" @click="handleBuy(scope.row)">操作</el-button>
<el-table-column width="110" align="center" label="订单详情">
<template scope="scope">
<span style="color: #13CE66;cursor: pointer;" @click="handleOrderDetail(scope.row)">订单详情</span>
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="400">
<template scope="scope">
<el-button size="small" type="success" @click="handleHandoverOrderVehicle(scope.row)">交车记录</el-button>
<el-button size="small" type="success" @click="handleReturnOrderVehicle(scope.row)">还车记录</el-button>
<el-button size="small" type="success" @click="handleRefundVehicle(scope.row)">押金记录</el-button>
<!-- <el-button size="small" type="success" @click="handleBuy(scope.row)">违章记录</el-button>
--> </el-button>
</template>
</el-table-column> -->
</el-table-column>
</el-table>
<div v-show="!listLoading" class="pagination-container">
......@@ -110,31 +133,221 @@
:current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
<!-- 订单详情 -->
<el-dialog :title="modalTitle" :visible.sync="bannerDialogVisible">
<el-form :model="form" :rules="rules" ref="form" label-width="90px">
<div class="label-title">
<span >订单号:</span><span class="label-text">{{form.no}}</span>
<span >支付时间:</span><span class="label-text">{{form.crtTime}}</span>
</div>
<div class="label-title">
<span >订单状态:</span><span class="label-text">{{form.ststusName}}</span>
</div>
<div class="label-title">
<span >姓名/手机号:</span> <span class="label-text"><span >{{form.username}}</span>/<span>{{form.telephone}}</span></span>
</div>
<div class="label-title">
<span >配车:</span> <span class="label-text"><span >{{form.vehicleNumberPlat}}</span><a class="label-text" style="color: #1478F0;">重新配车></a></span>
</div>
<div class="label-title">
<span >取车:</span> <span class="label-text">{{form.orderRentVehicleDetail.startTime}}</span><span class="label-text">{{form.orderRentVehicleDetail.startAddr}}</span> <span class="label-text">交车公司:</span><span>{{form.startCompanyName}}</span>
</div>
<div class="label-title">
<span >还车:</span> <span class="label-text">{{form.orderRentVehicleDetail.endTime}}</span><span class="label-text">{{form.orderRentVehicleDetail.endAddr}}</span> <span class="label-text">交车公司:</span><span>{{form.endCompanyName}}</span>
</div>
<table class="orderDetail">
<tr>
<td>房车</td>
<td>租借天数</td>
<td>费用明细</td>
</tr>
<tr>
<td>{{form.name}}{{tourCostDetail}}</td>
<td>{{form.orderRentVehicleDetail.dayNum}}天</td>
<td>{{tourCostDetail}}</td>
</tr>
<tr>
<td ></td>
<td ></td>
<td >共计:{{form.realAmount}}</td>
</tr>
</table>
<div style="margin-top: 20px;">
<div><span style="font-size: 20px;font-weight: bold;">驾驶人信息</span></div>
<div style="margin-top: 10px;"><span>{{this.form.orderVehicleCrosstownDto?this.form.orderVehicleCrosstownDto.licenseName:''}}</span><span class="label-text">{{this.form.orderVehicleCrosstownDto?this.form.orderVehicleCrosstownDto.licensePhone:''}}</span><span class="label-text">{{this.form.orderVehicleCrosstownDto?this.form.orderVehicleCrosstownDto.licenseIdCard:''}}</span></div><br/>
<div v-if="this.form.orderVehicleCrosstownDto?true:false"><img class="label-text " id = "license-img" :src="this.form.orderVehicleCrosstownDto?this.form.orderVehicleCrosstownDto.licenseImg:''"></div>
</div>
</el-form>
</el-dialog>
<el-dialog :title="modalTitle" :visible.sync="orderVehicleCrosstownVisible">
<el-form :model="form" :rules="rules" ref="form" label-width="90px">
<div class="label-title">
<span >订单号:</span><span class="label-text">{{form.no}}</span>
<span >支付时间:</span><span class="label-text">{{form.crtTime}}</span>
</div>
<div class="label-title">
<span >订单状态:</span><span class="label-text">{{form.ststusName}}</span>
</div>
<div class="label-title">
<span >姓名/手机号:</span> <span class="label-text"><span >{{form.username}}</span>/<span>{{form.telephone}}</span></span>
</div>
<div class="label-title">
<span >取车:</span> <span class="label-text">{{form.orderRentVehicleDetail.startTime}}</span><span class="label-text">{{form.orderRentVehicleDetail.startAddr}}</span> <span class="label-text">交车公司:</span><span>{{form.startCompanyName}}</span>
</div>
<div class="label-title">
<span >还车:</span> <span class="label-text">{{form.orderRentVehicleDetail.endTime}}</span><span class="label-text">{{form.orderRentVehicleDetail.endAddr}}</span> <span class="label-text">交车公司:</span><span>{{form.endCompanyName}}</span>
</div>
<div v-if="vehicleDetail" style="border: 1px solid;">
<div style="border-bottom: 1px solid;">
<span class="label-text">交车交接人:</span><span class="label-text">{{orderReturnVehicleCrosstown.username}}</span>
</div>
<div>
<span class="label-text">上传驾驶证*:</span><span class="label-text">{{orderReturnVehicleCrosstown.licenseName}}</span><span class="label-text">{{orderReturnVehicleCrosstown.licensePhone}}</span><br/>
<span style="margin-left:110px;">身份证号:</span> <span class="label-text">{{orderReturnVehicleCrosstown.licenseIdCard}}</span><br />
<img :src="orderReturnVehicleCrosstown.licenseImg" style="width: 100px; height: 100px;margin-left:110px;"/>
</div>
<div>
<span class="label-text">拍照取证*:</span><br/>
<!-- <div v-for="(item, i) in otherImg">
<img :src="item" style="width: 100px; height: 100px;margin-left:110px;"/>
</div> -->
<img src="../../../assets/404_images/404.png" style="width: 100px; height: 100px;margin-left:110px;"/>
<img src="../../../../dist/static/img/success.8304acb.png" style="width: 100px; height: 100px;margin-left:110px;"/>
<img src="../../../../dist/static/img/success.8304acb.png" style="width: 100px; height: 100px;margin-left:110px;"/>
<img src="../../../../dist/static/img/success.8304acb.png" style="width: 100px; height: 100px;margin-left:110px;"/>
</div>
<div v-if="handover">
<span class="label-text">房车公里数*:</span><span class="label-text">当前公里数:</span><span class="label-text">{{orderReturnVehicleCrosstown.mileage}}Km</span><br/>
<img :src="orderReturnVehicleCrosstown.mileageImg" style="width: 100px; height: 100px;margin-left:110px;"/>
</div>
<div v-if="returnVehicle">
<span class="label-text">钥匙照片*:</span><br/>
<img :src="orderReturnVehicleCrosstown.vehicleKey" style="width: 100px; height: 100px;margin-left:110px;"/>
</div>
<div v-if="returnVehicle">
<span class="label-text">押金扣除项*:</span><span>{{orderReturnVehicleCrosstown.deduction?'有扣除项':'没有扣除项'}}</span><br/>
</div>
<div>
<span class="label-text">备注:</span></span><span class="label-text">{{orderReturnVehicleCrosstown.remak}}</span>
</div>
<div>
</div>
</div>
<!--押金记录-->
<div v-if="refundshow">
</div>
</el-form>
</el-dialog>
</div>
</template>
<script>
import {
page
page,
getAllBranchCompany,
getAllBranchCompanyByZoneId,
getOrderVehicleCrosstown
} from 'api/order/rentVehicle';
import {
timestamp2Date
} from 'utils/dateUtils';
import { mapGetters } from 'vuex';
import rsCode from '../../../utils/rsCode';
import {
formatDate
} from '../../../utils/dateFormattor';
import {
getSysRegionByIds
} from 'api/vehicle/vehicleInfo/';
import {
getAllZone
} from 'api/base_info/constant/';
export default {
name: 'branchCompanyStock',
data() {
return {
form: {
id: null,
companyId: null,
companyName: null,
name: null,
tel: null,
count: null,
state: null
},
form: {
couponAmount: undefined,
crtHost: undefined,
crtName: undefined,
crtTime: undefined,
crtUser: undefined,
detailId: undefined,
endCompanyName: undefined,
goodsAmount: undefined,
hasDiscount: undefined,
hasMemberRight: undefined,
hasPay: undefined,
id: undefined,
name: undefined,
no: undefined,
orderAmount: undefined,
orderOrigin: undefined,
orderVehicleCrosstownDto: {
licenseIdCard: "",
licenseImg: "",
licenseName: "",
licensePhone: ""},
orderRentVehicleDetail: {
bookRecordId: undefined,
costDetail: undefined,
crtTime: undefined,
dayNum: undefined,
deposit: undefined,
driverType: undefined,
endAddr: undefined,
endCity: undefined,
endCityName: undefined,
endCompanyId: undefined,
endTime: undefined,
freeDays: undefined,
handelViolation: undefined,
id: undefined,
modelId: undefined,
myDriverIds: undefined,
orderId: undefined,
score: undefined,
startAddr: undefined,
startCity: undefined,
startCityName: undefined,
startCompanyId: undefined,
startTime: undefined,
stime: undefined,
suserid: undefined,
updTime: undefined,
vehicleId: undefined,
},
payOrigin: undefined,
picture: undefined,
realAmount: undefined,
refundStatus: undefined,
startCompanyName: undefined,
status: undefined,
ststusName:undefined,
telephone: undefined,
type: undefined,
updTime: undefined,
userId: undefined,
username: undefined,
vehicleNumberPlat: undefined,
version: undefined
},
orderVehicleCrosstownVisible:false,
bannerDialogVisible: false,//添加、编辑弹框
modalTitle: '订单详情',
rules: {
// companyName: [
// {
......@@ -169,14 +382,57 @@
phone:null,
status:null,
startTime: undefined,
endTime:undefined
endTime:undefined,
zoneId:undefined,
startCompanyId: undefined
},
baranchQuery: {
zoneId:null
},
orderVehicleQuery: {
orderId:null,
type:undefined
},
dialogFormVisible: false,
dialogStatus: '',
btn_del: true,
btn_buy: true,
btn_cancel: true,
tableKey: 0
allZoneArr:[],//全部片区
allBranchCompany:[],
tourCostDetail:'',
damageSafe:'',
serviceCost:0,
orderReturnVehicleCrosstown:{
crtTime: undefined,
deduction: undefined,
id: undefined,
imgs: undefined,
isDel: undefined,
mileage: undefined,
mileageImg: undefined,
orderId: undefined,
orderNo: undefined,
orperaterId: undefined,
remak: undefined,
status: undefined,
statusId: undefined,
statusTime: undefined,
type: undefined,
updTime: undefined,
userLicenseId: undefined,
username: undefined,
licenseIdCard: undefined,
licenseImg: undefined,
licenseName: undefined,
licensePhone: undefined
},//还车记录
tableKey: 0,
otherImg:[],
handover:false,
returnVehicle: false,
refundshow:false,//退款信息
vehicleDetail:true //交还车信息,默认全部显示
}
},
created() {
......@@ -190,6 +446,11 @@
provinceRegions() {
return getSonRegionByCodes(1);
},
//获取大区列表
getAllZoneList(){
this.allZoneArr = getAllZone();
return getAllZone();
},
cityRegions() {
if (!this.$utils.isInteger(this.form.addrProvince)) {
return null;
......@@ -198,25 +459,168 @@
}
},
methods: {
handleBuy(row) {
this.$confirm('此操作将确认购买, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
buyStock(row.id)
.then(() => {
this.$notify({
title: '成功',
message: '操作成功',
type: 'success',
duration: 2000
});
this.getList();
});
});
handleOrderDetail(row) {
this.form = row;
if (this.form.status == 2) {
this.form.ststusName = '取消';
}
if (this.form.status == 3) {
this.form.ststusName = '待付款';
}
if (this.form.status == 4) {
this.form.ststusName = '待出行';
}
if (this.form.status == 5) {
this.form.ststusName = '出行中';
}
if (this.form.status == 6) {
this.form.ststusName = '已完成';
}
this.form.orderRentVehicleDetail.startTime = timestamp2Date(this.form.orderRentVehicleDetail.startTime)
this.form.orderRentVehicleDetail.endTime = timestamp2Date(this.form.orderRentVehicleDetail.endTime)
this.costDetail = JSON.parse(this.form.orderRentVehicleDetail.costDetail)
var cost = '';
this.costDetail.children.forEach(function(a) {
cost += a.key + ":" +a.detail+" "
})
this.tourCostDetail = cost
if(this.form.orderRentVehicleDetail.driverType==1) {
this.serviceCost = this.form.orderRentVehicleDetail.dayNum * 600
}
this.bannerDialogVisible = true;
},
handleHandoverOrderVehicle(row) {
console.log(row)
this.modalTitle = "交车记录"
this.form = row;
if (this.form.status == 2) {
this.form.ststusName = '取消';
}
if (this.form.status == 3) {
this.form.ststusName = '待付款';
}
if (this.form.status == 4) {
this.form.ststusName = '待出行';
}
if (this.form.status == 5) {
this.form.ststusName = '出行中';
}
if (this.form.status == 6) {
this.form.ststusName = '已完成';
}
this.form.orderRentVehicleDetail.startTime = timestamp2Date(this.form.orderRentVehicleDetail.startTime)
this.form.orderRentVehicleDetail.endTime = timestamp2Date(this.form.orderRentVehicleDetail.endTime)
this.costDetail = JSON.parse(this.form.orderRentVehicleDetail.costDetail)
var cost = '';
this.costDetail.children.forEach(function(a) {
cost += a.key + ":" +a.detail+" "
})
this.tourCostDetail = cost
if(this.form.orderRentVehicleDetail.driverType==1) {
this.serviceCost = this.form.orderRentVehicleDetail.dayNum * 600
}
this.orderVehicleQuery.orderId = this.form.id
this.orderVehicleQuery.type = 1
this.getAllOrderVehicleCrosstown();
this.handover = true
this.returnVehicle = false
this.vehicleDetail=true
if(this.orderReturnVehicleCrosstown.imgs) {
this.otherImg = orderReturnVehicleCrosstown.imgs.split(',')
}
},
getAllOrderVehicleCrosstown() {
getOrderVehicleCrosstown(this.orderVehicleQuery)
.then(response => {
console.log(response)
if(response.data.length <=0 ) {
alert("交还车记录不存在")
}else {
this.orderVehicleCrosstownVisible = true
this.orderReturnVehicleCrosstown = response.data[0];
}
})
},
handleReturnOrderVehicle(row) {
console.log(row)
this.modalTitle = "还车记录"
this.form = row;
if (this.form.status == 2) {
this.form.ststusName = '取消';
}
if (this.form.status == 3) {
this.form.ststusName = '待付款';
}
if (this.form.status == 4) {
this.form.ststusName = '待出行';
}
if (this.form.status == 5) {
this.form.ststusName = '出行中';
}
if (this.form.status == 6) {
this.form.ststusName = '已完成';
}
this.form.orderRentVehicleDetail.startTime = timestamp2Date(this.form.orderRentVehicleDetail.startTime)
this.form.orderRentVehicleDetail.endTime = timestamp2Date(this.form.orderRentVehicleDetail.endTime)
this.costDetail = JSON.parse(this.form.orderRentVehicleDetail.costDetail)
var cost = '';
this.costDetail.children.forEach(function(a) {
cost += a.key + ":" +a.detail+" "
})
this.tourCostDetail = cost
if(this.form.orderRentVehicleDetail.driverType==1) {
this.serviceCost = this.form.orderRentVehicleDetail.dayNum * 600
}
this.orderVehicleQuery.orderId = this.form.id
this.orderVehicleQuery.type = 2
this.getAllOrderVehicleCrosstown();
this.returnVehicle = true
this.handover = false
this.vehicleDetail=true
if(this.orderReturnVehicleCrosstown.imgs) {
this.otherImg = orderReturnVehicleCrosstown.imgs.split(',')
}
},
handleRefundVehicle(row) {
console.log(row)
this.modalTitle = "还车记录"
this.form = row;
if (this.form.status == 2) {
this.form.ststusName = '取消';
}
if (this.form.status == 3) {
this.form.ststusName = '待付款';
}
if (this.form.status == 4) {
this.form.ststusName = '待出行';
}
if (this.form.status == 5) {
this.form.ststusName = '出行中';
}
if (this.form.status == 6) {
this.form.ststusName = '已完成';
}
this.form.orderRentVehicleDetail.startTime = timestamp2Date(this.form.orderRentVehicleDetail.startTime)
this.form.orderRentVehicleDetail.endTime = timestamp2Date(this.form.orderRentVehicleDetail.endTime)
this.orderVehicleCrosstownVisible = true
this.vehicleDetail=false
},
//监听change事件
getProvinceRegions(item) {
this.listQuery.zoneId = item
this.baranchQuery.zoneId = item
getAllBranchCompanyByZoneId(this.baranchQuery)
.then(response => {
this.allBranchCompany = response.data;
})
},
getAllBranchCompanyChange(item) {
this.listQuery.startCompanyId = item
},
handleCancel(row) {
this.$confirm('此操作将放弃购买, 是否继续?', '提示', {
confirmButtonText: '确定',
......@@ -236,6 +640,7 @@
});
});
},
handleDelete(row) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
......@@ -275,7 +680,9 @@
phone:'',
status:null,
startTime: undefined,
endTime:undefined
endTime:undefined,
zoneId:undefined,
startCompanyId: undefined
}
this.getList()
},
......@@ -310,3 +717,28 @@
}
}
</script>
<style>
.label-text{
margin-left: 10px;
margin-right: 20px;
}
.label-title{
margin-top: 10px;
}
.orderDetail tr td{
width: 500px;
text-align: center;
border: 0.0625rem solid;
margin-left: 100px;
margin-right: 100px;
}
.label-value{
margin-left: 80px;
margin-right: 100px;
}
#license-img{
width: 50px;
height: 50px;
}
</style>
\ No newline at end of file
......@@ -3,16 +3,32 @@
<div class="filter-container" ref="filter-container">
<el-form ref="queryForm" :model="listQuery" label-width="100px">
<el-row>
<el-col :span="5">
<el-form-item label="所属地区" prop="zoneId">
<el-select class="filter-item" v-model="listQuery.zoneId" placeholder="请选择" @change="getProvinceRegions">
<el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option v-for="val in getAllZoneList" :key="val.id" :label="val.name" :value="val.id"> </el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="所属公司" prop="startCompanyId">
<el-select class="filter-item" v-model="listQuery.startCompanyId" placeholder="请选择" @change="getAllBranchCompanyChange">
<el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option v-for="val in allBranchCompany" :key="val.id" :label="val.name" :value="val.id"> </el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="订单号">
<el-input v-model="listQuery.no" type="text" placeholder="请输入订单号"></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<!-- <el-col :span="5">
<el-form-item label="手机号">
<el-input v-model="listQuery.phone" placeholder="请输入手机号"></el-input>
</el-form-item>
</el-col>
</el-col> -->
<el-col :span="8">
<el-form-item label="状态">
<el-select class="filter-item" v-model="listQuery.status" placeholder="请选择状态">
......@@ -26,13 +42,13 @@
</el-select>
</el-form-item>
</el-col>
<el-col>
<!-- <el-col>
<el-form-item label="时间">
<el-date-picker v-model="listQuery.startTime" type = "date" placeholder = "请输入开始时间"></el-date-picker>
<span>——</span>
<el-date-picker v-model="listQuery.endTime" type = "date" placeholder = "请输入结束时间"></el-date-picker>
</el-form-item>
</el-col>
</el-col> -->
</el-row>
</el-form>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
......@@ -97,6 +113,11 @@
<span v-if="scope.row.status == '6'">已完成</span>
</template>
</el-table-column>
<el-table-column width="110" align="center" label="订单详情">
<template scope="scope">
<span style="color: #13CE66;cursor: pointer;" @click="handleBuy(scope.row)">订单详情</span>
</template>
</el-table-column>
<!-- <el-table-column align="center" label="操作" width="150">
<template scope="scope">
<el-button v-if="btn_buy && scope.row.state == 0" size="small" type="success" @click="handleBuy(scope.row)">订单详情</el-button>
......@@ -110,15 +131,84 @@
:current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
<el-dialog :title="modalTitle" :visible.sync="bannerDialogVisible">
<el-form :model="form" :rules="rules" ref="form" label-width="90px">
<div class="label-title">
<span >订单号:</span><span class="label-text">{{form.no}}</span>
<span >支付时间:</span><span class="label-text">{{form.crtTime}}</span>
</div>
<div class="label-title">
<span >订单状态:</span><span class="label-text">{{form.ststusName}}</span>
</div>
<div class="label-title">
<span >姓名/手机号:</span> <span class="label-text"><span >{{form.username}}</span>/<span>{{form.telephone}}</span></span>
</div>
<div class="label-title">
<span >配车:</span> <span class="label-text"><span >{{form.vehicleNumberPlat}}</span><a class="label-text" style="color: #1478F0;">重新配车></a></span>
</div>
<div class="label-title">
<span >出发地:</span> <span class="label-text">{{form.orderTourDetail.startAddr}}</span>
</div>
<div class="label-title">
<span >目的地:</span> <span class="label-text">{{form.orderTourDetail.endAddr}}</span>
</div>
<div class="label-title">
<span >活动日期:</span> <span class="label-text">{{form.orderTourDetail.startTime}}~{{form.orderTourDetail.endTime}}</span>
</div>
<table class="orderDetail">
<tr>
<td>旅行</td>
<td>价格</td>
<td>人数</td>
<td>保险</td>
</tr>
<tr>
<td>{{form.name}}</td>
<td>{{tourCostDetail}}</td>
<td>成人:{{form.orderTourDetail.adultNum}} 儿童:{{form.orderTourDetail.childNum}}</td>
<td>{{insureDetail}}</td>
</tr>
<tr>
<td ></td>
<td ></td>
<td ></td>
<td >共计:{{form.realAmount}}</td>
</tr>
</table>
<div style="margin-top: 20px;">
<div><span style="font-size: 20px;font-weight: bold;">联系人信息</span></div>
<div style="margin-top: 10px;"><span>{{form.orderTourDetail.contactMan}}</span><span class="label-text">{{form.orderTourDetail.contactPhone}}</span></div><br/>
<div><span>Email:</span><span class="label-text">{{form.orderTourDetail.contactEmail}}</span></div>
</div>
<div style="margin-top: 20px;">
<div><span style="font-size: 20px;font-weight: bold;">出游人信息 成人{{form.orderTourDetail.adultNum}}人 儿童{{form.orderTourDetail.childNum}}人</span></div>
<div style="margin-top: 10px;"><span>{{form.orderTourDetail.contactMan}}</span><span class="label-text">{{form.orderTourDetail.contactPhone}}</span></div><br/>
<div><span>Email:</span><span class="label-text">{{form.orderTourDetail.contactEmail}}</span></div>
</div>
</el-form>
</el-dialog>
</div>
</template>
<script>
import {
page
} from 'api/order/rentVehicle';
page,
getAllBranchCompany,
getAllBranchCompanyByZoneId
} from 'api/order/rentVehicle';
import { mapGetters } from 'vuex';
import rsCode from '../../../utils/rsCode';
import {
timestamp2Date
} from 'utils/dateUtils';
import {
getAllZone
} from 'api/base_info/constant/';
import {
formatDate
} from '../../../utils/dateFormattor';
......@@ -126,15 +216,68 @@
name: 'branchCompanyStock',
data() {
return {
form: {
id: null,
companyId: null,
companyName: null,
name: null,
tel: null,
count: null,
state: null
form: {
couponAmount: undefined,
crtHost: undefined,
crtName: undefined,
crtTime: undefined,
crtUser: undefined,
detailId: undefined,
endCompanyName: undefined,
goodsAmount: undefined,
hasDiscount: undefined,
hasMemberRight: undefined,
hasPay: undefined,
id: undefined,
name: undefined,
no: undefined,
orderAmount: undefined,
orderOrigin: undefined,
orderTourDetail: {
adultNum: undefined,
childNum: undefined,
contactEmail: undefined,
contactMan: undefined,
contactPhone: undefined,
costDetail: undefined,
crtTime: undefined,
dayNum: undefined,
endAddr: undefined,
endTime: undefined,
goodId: undefined,
hasInsure: undefined,
id: undefined,
isOutside: undefined,
orderId: undefined,
siteId: undefined,
spePriceId: undefined,
startAddr: undefined,
startCity: undefined,
startCityName: undefined,
startCompanyId: undefined,
startTime: undefined,
totalNumber: undefined,
tourUserIds: undefined,
updTime: undefined,
verificationId: undefined
},
payOrigin: undefined,
picture: undefined,
realAmount: undefined,
refundStatus: undefined,
startCompanyName: undefined,
status: undefined,
ststusName:undefined,
telephone: undefined,
type: undefined,
updTime: undefined,
userId: undefined,
username: undefined,
vehicleNumberPlat: undefined,
version: undefined
},
bannerDialogVisible: false,//添加、编辑弹框
modalTitle: '订单详情',
rules: {
// companyName: [
// {
......@@ -161,21 +304,43 @@
list: null,
total: null,
listLoading: true,
listQuery: {
page: 1,
limit: 20,
listQuery: {
page: 1,
limit: 20,
type: 2,
no: '',
phone:'',
no: null,
phone:null,
status:null,
startTime: undefined,
endTime:undefined
},
endTime:undefined,
zoneId:undefined,
startCompanyId: undefined
},
//"{"key":"费用明细","val":"","children":[{"key":"成人价格","detail":"¥13800.00/人×1人","val":"¥13800.00"}]}"
costDetail:{
key:undefined,
val:undefined,
children:[
{
key:undefined,
detail:undefined,
val:undefined
}
]
},
baranchQuery: {
zoneId:null
},
dialogFormVisible: false,
dialogStatus: '',
btn_del: true,
btn_buy: true,
btn_cancel: true,
allZoneArr:[],//全部片区
allBranchCompany:[],
tourCostDetail:'',
insureDetail:'',//保险
tableKey: 0
}
},
......@@ -190,6 +355,11 @@
provinceRegions() {
return getSonRegionByCodes(1);
},
//获取大区列表
getAllZoneList(){
this.allZoneArr = getAllZone();
return getAllZone();
},
cityRegions() {
if (!this.$utils.isInteger(this.form.addrProvince)) {
return null;
......@@ -199,24 +369,47 @@
},
methods: {
handleBuy(row) {
this.$confirm('此操作将确认购买, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
buyStock(row.id)
.then(() => {
this.$notify({
title: '成功',
message: '操作成功',
type: 'success',
duration: 2000
});
this.getList();
});
});
},
console.log(row)
this.form = row;
if (this.form.status == 2) {
this.form.ststusName = '取消';
}
if (this.form.status == 3) {
this.form.ststusName = '待付款';
}
if (this.form.status == 4) {
this.form.ststusName = '待出行';
}
if (this.form.status == 5) {
this.form.ststusName = '出行中';
}
if (this.form.status == 6) {
this.form.ststusName = '已完成';
}
this.form.orderTourDetail.startTime = timestamp2Date(this.form.orderTourDetail.startTime)
this.form.orderTourDetail.endTime = timestamp2Date(this.form.orderTourDetail.endTime)
this.costDetail = JSON.parse(this.form.orderTourDetail.costDetail)
var cost = '';
this.costDetail.children.forEach(function(a) {
cost += a.key + ":" +a.detail+" "
})
if(this.form.orderTourDetail.hasInsure == 0) {
this.insureDetail = "不需要保险"
}
this.tourCostDetail = cost
this.bannerDialogVisible = true;
},
getProvinceRegions(item) {
this.listQuery.zoneId = item
this.baranchQuery.zoneId = item
getAllBranchCompanyByZoneId(this.baranchQuery)
.then(response => {
this.allBranchCompany = response.data;
})
},
getAllBranchCompanyChange(item) {
this.listQuery.startCompanyId = item
},
handleCancel(row) {
this.$confirm('此操作将放弃购买, 是否继续?', '提示', {
confirmButtonText: '确定',
......@@ -268,14 +461,16 @@
},
clearSearch() {
this.listQuery ={
page: 1,
limit: 20,
page: 1,
limit: 20,
type: 2,
no: '',
phone:'',
status:null,
startTime: undefined,
endTime:undefined
no: null,
phone:null,
status:null,
startTime: undefined,
endTime:undefined,
zoneId:undefined,
startCompanyId: undefined
}
this.getList()
},
......@@ -310,3 +505,23 @@
}
}
</script>
<style>
.label-text{
margin-left: 10px;
margin-right: 20px;
}
.label-title{
margin-top: 10px;
}
.orderDetail tr td{
width: 500px;
text-align: center;
border: 0.0625rem solid;
margin-left: 100px;
margin-right: 100px;
}
.label-value{
margin-left: 80px;
margin-right: 100px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment