Skip to content

C
cloud-platform-ui
Commit ef8d2946 authored by lixy's avatar lixy
Browse files
Options

车辆排班

parent b2ffcd23
Hide whitespace changes
Inline Side-by-side
Showing with 1026 additions and 197 deletions
src/router/index.js
View file @ ef8d2946
......@@ -336,12 +336,18 @@ export const asyncRouterMap = [{
name: '车辆保养记录',
authority: 'vehicleUpkeepLog'
},
// {
// path: 'vehicleSchedulManage',
// component: _import('vehicle/vehicleSchedulManage/index'),
// name: '车辆排班管理',
// authority: 'vehicleSchedulManage'
// }
{
path: 'vehicleSchedulManage',
component: _import('vehicle/vehicleSchedulManage/index'),
name: '车辆排班管理',
authority: 'vehicleSchedulManage'
},
{
path: 'vehicleRecords',
component: _import('vehicle/vehicleSchedulManage/vehicleRecords'),
name: '车辆排班记录',
authority: 'vehicleRecords'
}
]
},
{
......
src/utils/dateUtils.js
View file @ ef8d2946
......@@ -75,6 +75,14 @@ export function getCurrentMonth() {
return formatDate(today, 'MM');
}
/**
* 获取当前月 yyyy-MM
* */
export function getCurrentYearMonth() {
const today = new Date();
return formatDate(today, 'yyyy-MM');
}
/**
* 返回yyyy-MM-dd
* */
......@@ -89,4 +97,4 @@ export function getYMD_hm(timestamp) {
export function getYMD(timestamp) {
let date = new Date(timestamp);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
return formatDate(date, 'yyyy-MM-dd');
}
\ No newline at end of file
}
src/views/baseInfo/bannerSetting.vue
View file @ ef8d2946
......@@ -305,7 +305,6 @@
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '失败',
......
src/views/order/modal/rentOrderDetailModal.vue
View file @ ef8d2946
<template>
<el-dialog title="订单详情" :visible.sync="dialogVisible" class="order-details">
<el-dialog title="租车订单详情" :visible.sync="dialogVisible" class="order-details">
<el-form :model="form" ref="form" label-width="90px">
<el-row>
<el-col :span="8">
......@@ -132,3 +132,34 @@
}
}
</script>
<style>
.label-text{
margin-left: 10px;
margin-right: 20px;
}
.label-title{
margin-top: 10px;
}
.orderDetail tr th{
background: #eef1f6;
}
.orderDetail tr td, .orderDetail tr th{
width: 500px;
text-align: center;
border: 1px solid #dfe6ec;
margin-left: 100px;
margin-right: 100px;
padding: 10px;
}
.label-value{
margin-left: 80px;
margin-right: 100px;
}
#license-img{
width: 50px;
height: 50px;
}
.order-details .el-form-item{
margin-bottom: 10px !important;
}
</style>
src/views/order/modal/tourOrderDetailModal.vue 0 → 100644
View file @ ef8d2946
<template>
<el-dialog title="旅游订单详情" :visible.sync="dialogVisible">
<el-form :model="form" ref="form" label-width="90px">
<el-row>
<el-col :span="8">
<el-form-item label="订单号:">
<span>{{form.no}}</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="支付时间:">
<span>{{form.crtTime}}</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="订单状态:">
<span>{{form.ststusName}}</span>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="出发地:">
<span>{{form.orderTourDetail.startCityName}}{{form.orderTourDetail.startAddr}}</span>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="目的地:">
<span>{{form.orderTourDetail.endAddr}}</span>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="活动日期:">
<span>{{form.orderTourDetail.startTime}}~{{form.orderTourDetail.endTime}}</span>
</el-form-item>
</el-col>
</el-row>
<table class="orderDetail">
<tr><th>旅行</th><th>价格</th><th>人数</th><th>保险</th></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>
<div style="margin: 20px 0;"><span style="font-size: 18px;font-weight: bold;">联系人信息</span></div>
<div>
<span style="font-weight: 700">联系人：</span><span class="label-text" >{{form.orderTourDetail.contactMan}}</span>
<span style="font-weight: 700">联系电话：</span><span class="label-text" >{{form.orderTourDetail.contactPhone}}</span>
<span style="font-weight: 700">Email:</span><span class="label-text">{{form.orderTourDetail.contactEmail}}</span>
</div>
</div>
<div>
<div style="margin: 20px 0;"><span style="font-size: 18px;font-weight: bold;">出游人信息 成人{{form.orderTourDetail.adultNum}}人 儿童{{form.orderTourDetail.childNum}}人</span></div>
<table class="orderDetail">
<tr><th>姓名</th><th>电话</th><th>身份证号</th></tr>
<tr v-for="(item,index) in form.orderTourDetail.userVoList " :key="index">
<td>{{item.realname}}</td>
<td>{{item.username}}</td>
<td>{{item.idNumber}}</td>
</tr>
</table>
</div>
</el-form>
</el-dialog>
</template>
<script>
import ElRow from "element-ui/packages/row/src/row";
import ElInput from "../../../../node_modules/element-ui/packages/input/src/input.vue";
import ElCol from "element-ui/packages/col/src/col";
import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
import ElForm from "../../../../node_modules/element-ui/packages/form/src/form.vue";
import {
getVehicleOrderDetail
} from 'api/vehicle/vehicleSchedulManage';
import {
timestamp2Date
} from 'utils/dateUtils';
export default {
props: ["tourRow"],
name: 'tourOrderDetailModal',
components: {
ElFormItem,
ElCol,
ElInput,
ElRow
},
data() {
return {
dialogVisible: false,
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,
},
costDetail:{
key:undefined,
val:undefined,
children:[
{
key:undefined,
detail:undefined,
val:undefined
}
]
},
insureDetail:'',//保险
tourCostDetail:''
}
},
watch: {
dialogVisible(newValue, oldValue){
if(!newValue){
this.$emit("tourOrderDetailDialogEvent", false);
}
},
},
mounted() {
this.getOrderInfo();//获取订单详情
},
methods: {
//获取订单详情
getOrderInfo(){debugger
let params = {
orderNo: this.tourRow.no
};
getVehicleOrderDetail(params).then(res => {
if (res.status == 200) {
let a = res.data;
this.form = a;
this.form.orderTourDetail.startTime = timestamp2Date(a.orderTourDetail.startTime)
this.form.orderTourDetail.endTime = timestamp2Date(a.orderTourDetail.endTime)
this.costDetail = JSON.parse(a.orderTourDetail.costDetail)
var cost = '';
this.costDetail.children.forEach(function(a1) {
cost += a1.key + ":" +a1.detail+" "
})
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 = '已完成';
}
if(a.orderTourDetail.hasInsure == 0) {
this.insureDetail = "不需要保险"
}
this.tourCostDetail = cost;
this.dialogVisible = true;
} else {
this.$notify({
title: '失败',
message: '操作失败！',
type: 'error',
duration: 2000
});
}
});
}
}
}
</script>
<style>
.label-text{
margin-left: 10px;
margin-right: 20px;
}
.label-title{
margin-top: 10px;
}
.orderDetail tr th{
background: #eef1f6;
}
.orderDetail tr td, .orderDetail tr th{
width: 500px;
text-align: center;
border: 1px solid #dfe6ec;
margin-left: 100px;
margin-right: 100px;
padding: 10px;
}
.label-value{
margin-left: 80px;
margin-right: 100px;
}
#license-img{
width: 50px;
height: 50px;
}
.order-details .el-form-item{
margin-bottom: 10px !important;
}
</style>
src/views/order/rentVehicleInfo/index.vue
View file @ ef8d2946
......@@ -177,7 +177,7 @@
</div>
<div>
<span class="label-text">备注:</span></span><span class="label-text">{{orderReturnVehicleCrosstown.remak}}</span>
<span class="label-text">备注:</span><span class="label-text">{{orderReturnVehicleCrosstown.remak}}</span>
</div>
<div>
......
src/views/order/tourOrderInfo/index.vue
View file @ ef8d2946
......@@ -33,15 +33,14 @@
<el-option :key="3" label="待付款" :value="3"></el-option>
<el-option :key="4" label="待出行" :value="4"></el-option>
<el-option :key="5" label="出行中" :value="5"></el-option>
<el-option :key="6" label="已完成" :value="6"></el-option>
<el-option :key="6" label="已完成" :value="6"></el-option>
</el-select>
</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>
<el-button class="filter-item" type="primary" v-waves icon="delete" @click="clearSearch">清除搜索</el-button>
</el-button>
</div>
<el-table :key='tableKey' :data="list" v-loading.body="listLoading"
border fit highlight-current-row
......@@ -67,7 +66,7 @@
<span>{{scope.row.username}}</span>/<span>{{scope.row.telephone}}</span>
</template>
</el-table-column>
<el-table-column width="150" align="center" label="报名人数">
<template scope="scope">
<span>成人{{scope.row.orderTourDetail.adultNum}} 儿童{{scope.row.orderTourDetail.childNum}}</span>
......@@ -85,13 +84,13 @@
<span>{{scope.row.startCompanyName}}</span>
</template>
</el-table-column>
<el-table-column width="110" align="center" label="订单价格">
<template scope="scope">
<span>{{scope.row.orderAmount}}</span>
</template>
</el-table-column>
<el-table-column width="110" align="center" label="状态">
<template scope="scope">
<span v-if="scope.row.status == '2'">取消</span>
......@@ -113,72 +112,14 @@
: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>
<!--订单详情-->
<tourOrderDetailModal :tourRow="tourRow" :insureDetail="insureDetail" v-if="tourDialogVisible" :tourCostDetail="tourCostDetail" v-on:tourOrderDetailDialogEvent="tourOrderDetailDialogEvent"></tourOrderDetailModal>
</div>
</template>
<script>
import Detail from "./detail";//违章查询
import tourOrderDetailModal from "../modal/tourOrderDetailModal";//租车订单详情
import {
page,
getAllBranchCompany,
......@@ -199,6 +140,7 @@
name: 'branchCompanyStock',
components: {
Detail,
tourOrderDetailModal
},
data() {
return {
......@@ -303,6 +245,7 @@
zoneId:undefined,
startCompanyId: undefined
},
tourRow: {},//旅游订单详情-当前行
//"{"key":"费用明细","val":"","children":[{"key":"成人价格","detail":"￥13800.00/人×1人","val":"￥13800.00"}]}"
costDetail:{
key:undefined,
......@@ -315,7 +258,7 @@
}
]
},
baranchQuery: {
zoneId:null
},
......@@ -327,7 +270,8 @@
allBranchCompany:[],
tourCostDetail:'',
insureDetail:'',//保险
tableKey: 0
tableKey: 0,
tourDialogVisible: false,//旅游详情
}
},
created() {
......@@ -369,37 +313,20 @@
console.log(params);
}
},
/**
* 旅游订单详情弹框关闭
* */
tourOrderDetailDialogEvent(e){
this.tourDialogVisible = false;
},
/**
* 旅游订单详情
* @param row
*/
handleBuy(row) {
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;
},
this.tourRow = row;
this.tourDialogVisible = true;
},
getProvinceRegions(item) {
this.listQuery.zoneId = item
this.baranchQuery.zoneId = item
......
src/views/vehicle/vehicleSchedulManage/disableModal.vue 0 → 100644
View file @ ef8d2946
<!--车辆排班 保养弹框-->
<template>
<el-dialog :title="currentItem.title" :visible.sync="jinyong" width="10%">
<el-form :model="currentItem" ref="currentItem" label-width="120px">
<el-form-item label="车牌号:">
<span>{{currentItem.item.numberPlate}}</span>
</el-form-item>
<el-form-item label="停靠公司:">
<span>{{currentItem.item.parkCompanyName}}</span>
</el-form-item>
<el-form-item label="申请人:">
<span>{{currentItem.ii.vehicleBookRecord.bookUserName}}</span>
</el-form-item>
<el-form-item label="禁用时间:">
<span>{{currentItem.ii.vehicleBookRecord.bookStartDate}}~{{currentItem.ii.vehicleBookRecord.bookEndDate}}</span>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="cancel()">取消禁用</el-button>
</div>
</el-dialog>
</template>
<script>
import {mapGetters} from 'vuex';
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
import {
agreeBook,
cancleBook,
rejectBook
} from 'api/vehicle/vehicleSchedulManage';
export default {
components: {
ElFormItem,
ElCol,
ElRow},
props: ["currentItem"],
name: 'disableModal',
data() {
return {
jinyong:false,
}
},
created() {
},
watch: {
jinyong(newValue, oldValue){
if(!newValue){
this.$emit("jinyongDialogEvent", false);
}
},
},
mounted() {
this.jinyong = true;
},
methods: {
/**
* 弹框-取消
* */
cancel() {
console.log("取消禁用");
cancleBook(this.currentItem.ii.vehicleBookRecord.id).then(response => {this.$emit("jinyongDialogEvent", true);});
}
}
}
</script>
src/views/vehicle/vehicleSchedulManage/index.vue
View file @ ef8d2946
......@@ -86,27 +86,28 @@
<!--车辆预警-->
<div class="marquee_box" v-if="marqueeList.length>0" @mouseenter="handelOver" @mouseleave="handelOut">
<ul class="marquee_list" :class="{marquee_top:animate}">
<li v-for="(item,index) in marqueeList" @click="toVehicleWarningMsg">{{item.msg}} >>立即处理</li>
<li v-for="(item,index) in marqueeList" @click="toVehicleWarningMsg" :class="item.color">{{item.msg}} >>立即处理</li>
</ul>
</div>
<!--车辆排班-->
<!--bookType 2-租车、1-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用-->
<div style="display: flex;">
<span class="tip-co bg-1"></span><span>租房车</span>
<span class="tip-co bg-2"></span><span>房车游</span>
<span class="tip-co bg-3"></span><span>展览</span>
<span class="tip-co bg-4"></span><span>保养</span>
<span class="tip-co bg-5"></span><span>预约中</span>
<span class="tip-co bg-6"></span><span>禁用</span>
<span class="tip-co bg-2"></span><span>租房车</span>
<span class="tip-co bg-5"></span><span>房车游</span>
<span class="tip-co bg-4"></span><span>展览</span>
<span class="tip-co bg-6"></span><span>保养</span>
<span class="tip-co bg-7"></span><span>预约中</span>
<span class="tip-co bg-8"></span><span>禁用</span>
</div>
<div style="position: relative;padding: 10px;padding-left: 0;" v-if="currentMonth">
<div style="position: relative;padding: 10px;padding-left: 0;width: 100%;overflow-x:auto;" v-if="currentMonth">
<div style="display: flex;">
<div class="day-title" style="min-width: 200px;max-width:200px;background: #eef1f6;">日期（{{currentMonth}}~{{currentMonth+1}}月）</div>
<div class="day-title" style="min-width: 200px;max-width:200px;background: #eef1f6;">日期（{{currentMonth}}~{{nextMonth}}月）</div>
<div class="day-title" style="background: #eef1f6;" v-for="item in tempDayList" :key="item.day" ><span>{{item.day}}</span></div>
</div>
<div v-for="item in list" :key="item.id" style="display: flex;">
<div class="v-list" style="display: inline-block;">
<div class="v-list" style="display: inline-block;" @click="toVehicleRecords(item)">
<div style="color: #bfcbd9;font-size: 14px;">
现在位置：{{item.endCompanyName}}
现在位置：{{item.parkCompanyName}}
</div>
<div>{{item.numberPlate}}</div>
<div style="color: #bfcbd9;font-size: 14px;">{{item.vehicleModel?item.vehicleModel.name:''}}</div>
......@@ -114,6 +115,9 @@
<div class="day-title flex-jca-fdc" style="padding: 0;" v-for="iitem in item.temp" :key="iitem.day" >
<!--@click="ii.bg?toShowDialog(item, iitem, ii):''"-->
<div v-for="ii in iitem.children" :key="ii.time" class="ii-day" :class="ii.bg" @click="toShowDialog(item, iitem, ii)">
<span v-if="ii.timeEtr=='00'" style="position: absolute;color: rgb(255, 255, 255);left: -18px;top: 60px;">{{ii.timeEtr}}</span>
<span v-else style="position: absolute;color: #fff;top: -17px;right: 0;">{{ii.timeEtr}}</span>
<span style="position: absolute;color: #fff;z-index: 11;">{{ii.timeStr}}</span>
</div>
</div>
</div>
......@@ -130,6 +134,13 @@
<vehicleExhibitionModal v-if="zhanlan" :currentItem="currentItem" v-on:zhanlanDialogEvent = "zhanlanDialogEvent"></vehicleExhibitionModal>
<!--安排用车弹框-->
<vehiclePlanModal v-if="anpai" :currentItem="currentItem" v-on:anpaiDialogEvent = "anpaiDialogEvent"></vehiclePlanModal>
<!--租车详情弹框-->
<!--rentOrder-->
<rentOrderDetailModal :form="rentOrderInfo" :rentCostDetail="rentCostDetail" v-if="rentOrder" v-on:rentOrderDetailDialogEvent="rentOrderDetailDialogEvent"></rentOrderDetailModal>
<!--旅游订单详情-->
<tourOrderDetailModal :tourRow="tourRow" v-if="tourDialogVisible" v-on:tourOrderDetailDialogEvent="tourOrderDetailDialogEvent"></tourOrderDetailModal>
<!--禁用弹框-->
<disableModal v-if="jinyong" :currentItem="currentItem" v-on:jinyongDialogEvent = "jinyongDialogEvent"></disableModal>
</div>
</template>
<style>
......@@ -146,26 +157,28 @@
.tip-co:first-child{
margin-left: 0;
}
.bg-1{
/*2-租车、1-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用*/
.bg-2{
background: #20a0ff;
}
.bg-2{
.bg-5{
background: #6633cc;
}
.bg-3{
.bg-4{
background: #00cc66;
}
.bg-4{
.bg-6{
background: #ff6633;
}
.bg-5{
.bg-7{
background: #cff1f6;
}
.bg-6{
.bg-8{
background: #d7d7d7;
}
.ii-day{
height: 4.16%;
position: relative;
}
.day-title{
border-right:1px solid #bfcbd9;
......@@ -174,6 +187,7 @@
min-width: 45px;
max-width: 45px;
display: inline-block;
cursor: pointer;
}
.v-list{
padding: 10px;
......@@ -186,12 +200,6 @@
height: 180px !important;
background: #ccc;
}
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
.el-col {
border-radius: 4px;
}
......@@ -252,7 +260,7 @@
width: 100%;
height: 145px;
overflow: hidden;
margin-bottom: 10px;
margin: 10px 0;
background: #eef1f6;
}
......@@ -276,13 +284,21 @@
line-height: 30px;
font-size: 14px;
padding-left: 20px;
list-style-type:none;
}
.marquee_list li span {
padding: 0 2px;
}
.warn-1{
color: red;
}
.warn-2{
color: #20a0ff;
}
.warn-3{
color: #ff9900;
}
</style>
<script>
......@@ -290,6 +306,9 @@
import vehicleMaintenanceModal from './vehicleMaintenanceModal';//车辆保养弹框
import vehicleExhibitionModal from './vehicleExhibitionModal';//车辆展览弹框
import vehiclePlanModal from './vehiclePlanModal';//安排用车
import rentOrderDetailModal from "../../order/modal/rentOrderDetailModal";//租车订单详情
import tourOrderDetailModal from "../../order/modal/tourOrderDetailModal";//房车游订单详情
import disableModal from "./disableModal";//禁用弹框
import {
getSysRegionByIds
} from 'api/vehicle/vehicleInfo/';
......@@ -316,7 +335,8 @@
getTimeByDay,
getCurrentMonth,
getMonth,
getymdTimeByDay
getymdTimeByDay,
getCurrentYearMonth
} from 'utils/dateUtils';
import rsCode from '../../../utils/rsCode';
......@@ -326,7 +346,8 @@
getToken
} from 'utils/auth';
import {
getVehiclePlanList
getVehiclePlanList,
getVehicleOrderDetail
} from 'api/vehicle/vehicleSchedulManage';
import Element1 from "../../admin/menu/components/element";
import ElRow from "element-ui/packages/row/src/row";
......@@ -340,7 +361,10 @@
Element1,
vehicleExhibitionModal,
vehicleMaintenanceModal,
vehiclePlanModal
vehiclePlanModal,
rentOrderDetailModal,
tourOrderDetailModal,
disableModal
},
data() {
return {
......@@ -363,7 +387,7 @@
listLoading: true,
listQuery: {
page: 1,
limit: 20,
limit: 10,
parkBranchCompanyId: undefined,//停靠分公司id
parkBranchCompanyName: undefined,//停靠分公司名称
subordinateBranch: undefined,//所属分公司
......@@ -382,15 +406,29 @@
tableKey: 0,
tempDayList: [],//日期
currentMonth: undefined,//当前月份
nextMonth: undefined,//下月
allBranchCompany: [],//所有分公司列表
baoyang: false,//保养弹框,
zhanlan: false,//展览弹框
rentOrder: false,//租车订单详情
anpai: false,//安排用车弹框
jinyong: false,//禁用弹框
currentItem: {},//待操作数据
rentOrderInfo: {},//租车订单详情
rentCostDetail: {},//租车订单费用明细
tourDialogVisible: false,//旅游订单弹框
tourRow: {},//旅游订单详情-当前行
}
},
created() {
this.getList();
let currentMonth = getCurrentMonth();
this.currentMonth = parseInt(currentMonth);
if(this.currentMonth < 12){
this.nextMonth = this.currentMonth + 1;
} else {
this.nextMonth = 1;
}
this.getTempDayList();
this.mar = setInterval(this.showMarquee, 2000);
getAll()
......@@ -413,33 +451,100 @@
},
},
methods: {
/**
* 旅游订单详情弹框关闭
* */
tourOrderDetailDialogEvent(e){
this.tourDialogVisible = false;
},
/**
* 点击事件
* */
toShowDialog(item, iitem, ii){
console.log(item);
console.log(iitem);
console.log(ii);
// <!--bookType 2-租车、1-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用-->
if(!ii.bg){
//空白-可安排用车
this.anpai = true;
let arr = item.vehicleModel.keyword.split(",");
item.vehicleModel.keyword = arr.join(" | ");
this.currentItem = {item: item, iitem: iitem, ii: ii};
} else {
if(ii.status == 4){
if(ii.bookType == 6){
//保养
this.baoyang = true;
this.currentItem = {item: item, iitem: iitem, ii: ii};
} else if(ii.status == 3){
} else if(ii.bookType == 4){
//展览
this.zhanlan = true;
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "展览用车"};
} else if(ii.status == 1){
//展览
} else if(ii.bookType == 7){
this.zhanlan = true;
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "预定用车"};
} else if(ii.bookType == 2){
this.getOneVechi(ii.vehicleBookRecord.orderNo);
// this.rentOrder = true;
// this.rentOrderInfo = {};
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "租车订单"};
} else if(ii.bookType == 5) {
//房车游订单详情
this.tourRow = {no: ii.vehicleBookRecord.orderNo};
this.tourDialogVisible = true
} else if(ii.bookType == 8) {
//禁用
this.jinyong = true;
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "禁用"};
}
}
},
/**
* 根据订单号获取订单详情
* */
getOneVechi: function(orderNo) {
let params = {
orderNo: orderNo
};
getVehicleOrderDetail(params).then(res => {
if (res.status == 200) {
let a = res.data;
let vehicleUserLicenses = {};
// if (a.status == 5) {
// vehicleUserLicenses = {
// name: a.orderVehicleCrosstownDto.licenseName,
// phone: a.orderVehicleCrosstownDto.licensePhone,
// idCard: a.orderVehicleCrosstownDto.licenseIdCard
// };
// } else {
// if (a.vehicleUserLicenses.length > 0) {
// vehicleUserLicenses = a.vehicleUserLicenses[0];
// }
// }
a.orderRentVehicleDetail.startTime = timestamp2Date(a.orderRentVehicleDetail.startTime);
a.orderRentVehicleDetail.endTime = timestamp2Date(a.orderRentVehicleDetail.endTime);
let arr = a.picture ? a.picture.split(",") : [];
a.picture = arr.length > 0 ? arr[0] : "";
a.payTime = timestamp2Date(a.payTime);
this.rentOrderInfo = a;
this.costDetail = JSON.parse(this.rentOrderInfo.orderRentVehicleDetail.costDetail);
var cost = '';
this.costDetail.children.map(function(a) {
cost += a.key + ":" +a.detail+" ";
});
this.rentCostDetail = cost;
if(this.rentOrderInfo.orderRentVehicleDetail.driverType==1) {
this.serviceCost = this.rentOrderInfo.orderRentVehicleDetail.dayNum * 600
}
this.rentOrder = true;
} else {
this.$notify({
title: '失败',
message: '操作失败！',
type: 'error',
duration: 2000
});
}
});
},
/**
* 关闭保养弹框后逻辑处理
* */
......@@ -460,6 +565,16 @@
this.getList();
}
},
/**
* 禁用弹框关闭后逻辑处理
* */
jinyongDialogEvent(e){
this.jinyong = false;
if(e){//关闭编辑
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 安排用车弹框关闭逻辑处理
* */
......@@ -470,11 +585,18 @@
this.getList();
}
},
/**
* 租车订单详情弹框关闭
* */
rentOrderDetailDialogEvent(e){
this.rentOrder = false;
},
/**
* 根据片区id获取分公司列表
* */
getProvinceRegions(item) {
this.listQuery.zoneId = item;
this.listQuery.subordinateBranch = undefined;
getAllBranchCompanyByZoneId({zoneId: item})
.then(response => {
this.allBranchCompany = response.data;
......@@ -573,6 +695,7 @@
this.listQuery.endTime = this.listQuery.endTime.getTime();
}
getVehiclePlanList(this.listQuery).then(response => {
this.countTJ = response.data.vehicleCountVos;
let totalCountRs = undefined;
let listRs = undefined;
if (!this.$utils.isEmpty(response.data.vehicleAndModelInfoVo) && this.$utils.isInteger(response.data.vehicleAndModelInfoVo.totalCount)) {
......@@ -584,17 +707,54 @@
if(item.storeTypeName){
item.storeTypeName = item.storeTypeName.join("|");
}
// 解析开始时间-结束时间
// item.vehicleBookRecord.map(function (iitem) {
// let bookStartDate = iitem.bookStartDate.substring(0,10);
// let bookEndDate = iitem.bookEndDate.substring(0,10);
// iitem.startHourList = ["0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0"];
// if(iitem.startHour){
// for(let i = 0; i < iitem.startHour.length;i++){
// iitem.startHourList[i] = iitem.startHour[i]
// }
// }
// iitem.startHourList = iitem.startHourList?iitem.startHourList.reverse(): ["0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0","0"];
// let flag = false;//开始时间标识，查找第一个1
// let flagE = false;//结束时间标识，查找第一个0
// let sStart = "00";//开始时间
// let sEnd= "00";//结束时间
// iitem.startHourList.map(function(ic, index){
// let c = index +1;
// if(ic == 1 && !flag){
// if(c<10){
// sStart = "0"+c;
// } else {
// sStart = c
// }
// flag = true;
// }
// });
// if(iitem.endHour){
// if(iitem.endHour.length>=10){
// sEnd = iitem.endHour.length;
// } else {
// sEnd = "0" + iitem.endHour.length;
// }
// }
// iitem.bookStartDate = iitem.bookStartDate.substring(0,10) + " " +sStart + ":00:00";
// iitem.bookEndDate = iitem.bookEndDate.substring(0,10) + " " +sEnd + ":00:00";
// });
item.temp = _this.getDayList(item);//获取车辆30天排期
});
}
if (!this.$utils.isEmpty(response.data.vehicleWarningMsgs)) {
response.data.vehicleWarningMsgs.map(function(ii){
ii.color = "warn-" + ii.colorType;
});
this.marqueeList = response.data.vehicleWarningMsgs;
}
this.listLoading = false;
this.list = listRs;
this.total = totalCountRs;
this.countTJ = response.data.vehicleCountVos;
})
},
handleFilter() {
......@@ -621,18 +781,14 @@
getDayList(item){
let temp = [];
let list = this.list;
let currentMonth = getCurrentMonth();
this.currentMonth = parseInt(currentMonth);
// console.log(currentMonth);
for(let i = 0; i < 30; i++){
let t = [];
let tymd = getymdTimeByDay(i);
let children = [];
let tt = "";//yyyy-MM-dd hh:mm:ss
let h = "";
let bg = "";//背景色
let status = undefined;//当前车辆状态
let bookType = undefined;//当前车辆状态
let vehicleBookRecord = {};//车辆排班信息
for(let ii = 0; ii < 24; ii ++) {
if (ii < 10) {
......@@ -642,18 +798,31 @@
tt = tymd + " " + ii + ":00:00";
h = ii;
}
let bg = "";//背景色
let pp = {};
pp.time = tt;
pp.h = h;
item.vehicleBookRecord.map(function (iitem) {
if (iitem.bookStartDate <= tt && iitem.bookEndDate >tt) {
bg = "bg-"+ iitem.status;
status = iitem.status;
vehicleBookRecord = iitem;
if (iitem.bookStartDate <= tt && iitem.bookEndDate >=tt) {
// <!--bookType 1-分公司使用、2-租车、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用-->
if(iitem.bookStartDate == tt && (iitem.bookType == 2 || iitem.bookType == 5 || iitem.bookType == 4)){//租车、旅游、展览显示起止时间
pp.timeStr = h;
}
pp.bg = "bg-"+ iitem.bookType;
pp.vehicleBookRecord = iitem;
pp.bookType = iitem.bookType;
if(iitem.bookEndDate == tt){
if (iitem.bookType == 2 || iitem.bookType == 5 || iitem.bookType == 4){
pp.timeEtr = h;
}
pp.bg = "";
}
}
});
children.push({time: tt, h: h, bg: bg, status: status, vehicleBookRecord: vehicleBookRecord});
children.push(pp);
}
temp.push({day: getTimeByDay(i), month: getMonth(i), children: children});
}
// console.log(temp);
return temp;
},
/**
......@@ -684,6 +853,13 @@
}
this.tempDayList = temp;
},
/**
* 排版记录
*/
toVehicleRecords(item){
let selectedMonth = getCurrentYearMonth();
this.$router.push({path: '/vehicle/vehicleRecords?selectedMonth='+selectedMonth+"&numberPlate="+item.numberPlate});
}
}
}
</script>
src/views/vehicle/vehicleSchedulManage/vehicleExhibitionModal.vue
View file @ ef8d2946
......@@ -27,11 +27,11 @@
<span></span>
</el-form-item>
</el-form>
<div slot="footer" v-if='currentItem.title == "展览用车"' class="dialog-footer">
<div slot="footer" v-if='currentItem.title == "展览用车" && currentItem.ii.vehicleBookRecord.status==2' class="dialog-footer">
<el-button @click="cancel()">取消用车</el-button>
<el-button type="primary" @click="handelOk()">确 定</el-button>
</div>
<div slot="footer" v-else class="dialog-footer">
<div slot="footer" v-if='currentItem.title == "预定用车" && currentItem.ii.vehicleBookRecord.status==1' class="dialog-footer">
<el-button type="primary" @click="agree()">同 意</el-button>
<el-button @click="notAgree()">不同意</el-button>
</div>
......@@ -42,6 +42,11 @@
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
import {
agreeBook,
cancleBook,
rejectBook
} from 'api/vehicle/vehicleSchedulManage';
export default {
components: {
ElFormItem,
......@@ -73,28 +78,28 @@
* */
cancel() {
console.log("展览取消用车");
this.$emit("zhanlanDialogEvent", true);
cancleBook(this.currentItem.ii.vehicleBookRecord.id).then(response => {this.$emit("zhanlanDialogEvent", true);});
},
/**
* 确定用车
* */
handelOk(){
console.log("展览确定用车");
this.$emit("zhanlanDialogEvent", true);
agreeBook(this.currentItem.ii.vehicleBookRecord.id).then(response => {this.$emit("zhanlanDialogEvent", true);});
},
/**
* 同意
*/
agree(){
console.log("同意");
this.$emit("zhanlanDialogEvent", true);
agreeBook(this.currentItem.ii.vehicleBookRecord.id).then(response => {this.$emit("zhanlanDialogEvent", true);});
},
/**
* 不同意
*/
notAgree(){
console.log("不同意");
this.$emit("zhanlanDialogEvent", true);
rejectBook(this.currentItem.ii.vehicleBookRecord.id).then(response => {this.$emit("zhanlanDialogEvent", true);});
},
}
}
......
src/views/vehicle/vehicleSchedulManage/vehiclePlanModal.vue
View file @ ef8d2946
<!--车辆排班 保养弹框-->
<template>
<el-dialog title="保养用车" :visible.sync="baoyang" width="10%">
<el-form :model="currentItem" ref="currentItem" label-width="120px">
<el-form-item label="车牌号:">
<el-dialog title="安排用车" :visible.sync="anpai" class="user-car">
<el-form :model="form" ref="form" :rules="rules" label-width="140px">
<el-form-item label="车牌号">
<span>{{currentItem.item.numberPlate}}</span>
</el-form-item>
<el-form-item label="所属公司:">
<span>{{currentItem.item.subordinateBranchName}}</span>
<el-form-item label="车型名称">
<span>{{currentItem.item.vehicleModel.name}}</span>
</el-form-item>
<el-form-item label="提车保养公司:">
<span>{{currentItem.item.parkCompanyName}}</span>
<el-row>
<el-col :span="8">
<el-form-item label="当前停靠公司:">
<span>{{currentItem.item.parkCompanyName}}</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="所属公司">
<span>{{currentItem.item.subordinateBranchName}}</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="公里数">
<span>{{currentItem.item.maintenanceMileage}}km</span>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="房车配置">
<span>{{currentItem.item.vehicleModel.keyword}}</span>
</el-form-item>
<el-form-item label="还车公司:">
<span>{{currentItem.item.destinationBranchCompanyName}}</span>
<el-form-item label="选择时间" prop="times">
<el-date-picker
v-model="form.times"
type="datetimerange"
format="yyyy-MM-dd hh"
placeholder="选择时间范围">
</el-date-picker>
</el-form-item>
<el-form-item label="保养人:">
<span>{{currentItem.ii.vehicleBookRecord.bookUserName}}</span>
<el-form-item label="还车分公司" prop="arrivalBranchCompanyName">
<el-autocomplete
class="inline-input"
v-model="form.arrivalBranchCompanyName"
:fetch-suggestions="querySearch"
placeholder="请输入内容"
@select="handleSelectArrivalCompanyName"
></el-autocomplete>
</el-form-item>
<el-form-item label="预定时间:">
<span>{{currentItem.ii.vehicleBookRecord.bookStartDate}}~{{currentItem.ii.vehicleBookRecord.bookEndDate}}</span>
<el-form-item label="用途" prop="bookType">
<!--bookType 2-租车、1-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用-->
<el-select class="filter-item" v-model="form.bookType" placeholder="请选择用途">
<el-option label="展览" value="4"></el-option>
<el-option label="房车游" value="5"></el-option>
<el-option label="保养" value="6"></el-option>
<el-option label="禁用" value="8"></el-option>
<!--<el-option v-for="item in getAllUseType() " :key="item.code" :label="item.val"-->
<!--:value="item.code"></el-option>-->
</el-select>
</el-form-item>
<el-form-item label="使用人" prop="vehicleUsername">
<el-input v-model="form.vehicleUsername" placeholder="请输入使用人"></el-input>
</el-form-item>
<el-form-item label="用途:">
<span>保养</span>
<el-form-item label="使用人联系方式" prop="vehicleUserPhone">
<el-input v-model="form.vehicleUserPhone" placeholder="请输入使用人联系方式"></el-input>
</el-form-item>
<el-form-item label="保养项目:">
<span></span>
<el-form-item label="说明">
<el-input v-model="form.remark" :rows="3" placeholder="请输入说明"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel()">取消用车</el-button>
<el-button type="primary" @click="handelOk()">确 定</el-button>
<el-button @click="cancel()">取消</el-button>
<el-button type="primary" @click="handelOk('form')">确 定</el-button>
</div>
</el-dialog>
</template>
<style>
.user-car .el-row{
margin-bottom: 0;
}
</style>
<script>
import {mapGetters} from 'vuex';
import {
VEHICLE_CONSTANT_VEHICLE_BRAND,
VEHICLE_CONSTANT_VEHICLE_USE,
VEHICLE_CONSTANT_BRAND_CODE_UNKOWN,
BELONG_TO_TYPE_OWN,
VEHICLE_CONSTANT_USE_TYPE_UNKOWN,
VEHICLE_CONSTANT_STATUS_NORMAL
} from '../../../store/modules/baseInfo';
import {
getConstantByTypeAndCode,
getConstantListByType,
getAllInsuranceCompany,
getInsuranceCompany
} from 'api/base_info/constant/';
import {
getAllCompany,
getAll
} from 'api/base_info/branch_company/';
import {
bookPlan
} from 'api/vehicle/vehicleSchedulManage';
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
import {
formatDate
} from 'utils/dateFormattor';
export default {
components: {
ElFormItem,
......@@ -47,37 +116,140 @@
name: 'vehiclePlanModal',
data() {
return {
baoyang:false,
anpai:false,
allCompaniesArr:[],
form:{
remark: "",
vehicleUsername: "",
arrivalBranchCompanyId: undefined,//还车分公司id
arrivalBranchCompanyName: "",//还车分公司名称
vehicleUserPhone:"",//使用人联系电话
bookType: undefined,//用途
times: [],
},
rules: {
vehicleUsername: [
{
type: 'string',
required: true,
message: '请输入使用人姓名',
trigger: 'blur'
},
{
min: 0,
max: 20,
message: '长度小于 20 个字符',
trigger: 'blur'
}
],
arrivalBranchCompanyName:{
type: 'string',
required: true,
message: '请选择还车公司',
trigger: 'change'
},
vehicleUserPhone:{
type: 'string',
required: true,
message: '请输入使用人联系方式',
trigger: 'blur'
},
bookType:{
type: 'string',
required: true,
message: '请选择用途',
trigger: 'change'
},
times: {
required: true,
message: '请选择时间',
}
}
}
},
created() {
console.log(this.currentItem);
getAll()
.then(response => {
this.allCompaniesArr = response.data;
})
getAllCompany(codeAndBranchCompany => {
this.allCompanies = codeAndBranchCompany;
});
},
watch: {
baoyang(newValue, oldValue){
anpai(newValue, oldValue){
if(!newValue){
this.$emit("baoyangDialogEvent", false);
this.$emit("anpaiDialogEvent", false);
}
},
},
mounted() {
this.baoyang = true;
this.anpai = true;
},
methods: {
/**
* 保养-弹框-取消
* 还车分公司
*/
handleSelectArrivalCompanyName(item){
this.form.arrivalBranchCompanyId = item.id;
this.form.arrivalBranchCompanyName = item.name;
console.log(item);
},
querySearch(queryString, cb) {
let selectArry = [];
this.allCompaniesArr.map(function(item){
item.value = item.name;
selectArry.push(item);
});
this.selectArry = selectArry;
var results = queryString ? selectArry.filter(this.createFilter(queryString)) : selectArry;
// 调用 callback 返回建议列表的数据
cb(results);
},
createFilter(queryString) {
return (restaurant) => {
return (restaurant.name.indexOf(queryString.toLowerCase()) != -1);
};
},
/**
* 弹框-取消
* */
cancel() {
console.log("保养取消用车");
this.$emit("baoyangDialogEvent", true);
this.$emit("anpaiDialogEvent", false);
},
/**
* 保养-确定用车
* 确定用车
* */
handelOk(){
console.log("保养确定用车");
this.$emit("baoyangDialogEvent", true);
}
handelOk(formName){
const set = this.$refs;
set[formName].validate(valid => {
if (valid) {
let params = {
vehicleId:this.currentItem.item.id,
bookStartDate: formatDate(this.form.times[0], "yyyy-MM-dd hh")+":00:00",//预定开始时间
bookEndDate: formatDate(this.form.times[1], "yyyy-MM-dd hh")+":00:00",//预定结束时间
retCompany: this.form.arrivalBranchCompanyId,//还车分公司
bookType: this.form.bookType,//预定车辆用途类型
vehicleUsername: this.form.vehicleUsername,//使用人姓名
vehicleUserPhone: this.form.vehicleUserPhone,//使用人电话
remark: this.form.remark//说明
};
bookPlan(params).then(response => {
if (response.status === 200) {
this.$emit("anpaiDialogEvent", true);
} else {
this.$notify({
title: '失败',
message: '操作失败！',
type: 'error',
duration: 2000
});
}
})
}
})
},
}
}
</script>
......
src/views/vehicle/vehicleSchedulManage/vehicleRecords.vue 0 → 100644
View file @ ef8d2946
<!--车辆排班记录-->
<template>
<div class="app-container calendar-list-container">
<div class="filter-container">
<el-input style="width: 200px;" placeholder="车牌号"
v-model="listQuery.numberPlate"></el-input>
<el-date-picker
v-model="listQuery.selectedMonth"
type="month"
format = "yyyy-MM"
placeholder="选择月">
</el-date-picker>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
</div>
<el-table :key='tableKey' :data="list" v-loading.body="listLoading" border fit highlight-current-row
style="width: 100%">
<el-table-column align="center" label="日期" width="200">
<template scope="scope">
<div>起：{{scope.row.bookStartDate}}</div>
<div>止：{{scope.row.bookEndDate}}</div>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="用途">
<template scope="scope">
<!--/*2-租车、1-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用*/-->
<span>{{scope.row.bookType==2?"租房车":scope.row.bookType==4?"展览":scope.row.bookType==5?"房车游":scope.row.bookType==6?"保养":scope.row.bookType==7?"预约中":scope.row.bookType==8?"禁用":'未知用途'}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="订单号">
<template scope="scope">
<span>{{scope.row.orderNo}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="出车分公司">
<template scope="scope">
<span>{{scope.row.mileage}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="还车分公司">
<template scope="scope">
<span>{{scope.row.retCompanyName}}</span>
</template>
</el-table-column>
<el-table-column width="150" align="center" label="使用人">
<template scope="scope">
<span>{{scope.row.vehicleUsername}}</span>
</template>
</el-table-column>
<el-table-column width="150" align="center" label="使用人联系方式">
<template scope="scope">
<span>{{scope.row.vehicleUserPhone}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="300">
<template scope="scope">
<el-button size="small" type="success" @click="handleDetail(scope.row)">详情</el-button>
<el-button size="small" type="success" @click="getLogInfo(scope.row)">重新安排</el-button>
</template>
</el-table-column>
</el-table>
<div v-show="!listLoading" class="pagination-container">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
: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="详情" :visible.sync="dialogVisible">
<el-form :model="currentItem" ref="currentItem" label-width="120px">
<el-form-item label="车牌号:">
<span>{{currentItem.numberPlate}}</span>
</el-form-item>
<!--<el-form-item label="停靠公司:">-->
<!--<span>{{currentItem.parkCompanyName}}</span>-->
<!--</el-form-item>-->
<!--<el-form-item label="申请人:">-->
<!--<span>{{currentItem.ii.vehicleBookRecord.bookUserName}}</span>-->
<!--</el-form-item>-->
<!--<el-form-item label="禁用时间:">-->
<!--<span>{{currentItem.ii.vehicleBookRecord.bookStartDate}}~{{currentItem.ii.vehicleBookRecord.bookEndDate}}</span>-->
<!--</el-form-item>-->
</el-form>
</el-dialog>
</div>
</template>
<script>
import {
getBookRecord
} from 'api/vehicle/vehicleSchedulManage';
import rsCode from '../../../utils/rsCode';
import {
formatDate
} from 'utils/dateFormattor';
export default {
name: 'vehicleRecords',
data() {
return {
currentItem: {},//当前操作表单
dialogVisible: false,//记录详情
form: {
vehicleId: null,
numberPlate: null,
operator: null,
date: null,
mileage: null,
amount: null,
approvers: null,
branchCompanyId: null,
branchCompanyName: null,
upkeepItems: []
},
list: null,
total: null,
listLoading: true,
listQuery: {
page: 1,
limit: 20,
selectedMonth: "",
numberPlate: undefined
},
tableKey: 0,
dialogFormVisible: false
}
},
created() {
},
mounted() {
this.listQuery.selectedMonth = this.$route.query.selectedMonth;
this.listQuery.numberPlate = this.$route.query.numberPlate;
this.getList();
},
methods: {
handleFilter() {
this.getList();
},
/**
* 获取排班记录列表数据
*/
getList() {
this.listLoading = true;
if(this.listQuery.selectedMonth && (typeof this.listQuery.selectedMonth == "object")){
this.listQuery.selectedMonth = formatDate(this.listQuery.selectedMonth, "yyyy-MM");//预定开始时间;
}
getBookRecord(this.listQuery).then(response => {
this.list = response.data.data;
this.total = response.data.totalCount;
this.listLoading = false;
});
},
handleSizeChange(val) {
this.listQuery.limit = val;
this.getList();
},
handleCurrentChange(val) {
this.listQuery.page = val;
this.getList();
},
/**
* 详情
*/
handleDetail(row){
this.currentItem = row;
this.dialogVisible = true;
},
}
}
</script>
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