Skip to content

C
cloud-platform-ui
Commit e938d74e authored by rencs's avatar rencs
Browse files
Options

9.14 排版，出车

parent 164c227e
Hide whitespace changes
Inline Side-by-side
Showing with 1725 additions and 1437 deletions
src/views/vehicle/vehicleDepartureLog/index.vue
View file @ e938d74e
<template> <template>
<div class="app-container calendar-list-container"> <div class="app-container calendar-list-container">
<div class="filter-container"> <div class="filter-container">
<el-form> <el-form>
<el-row> <el-row>
<el-col :span="5"> <el-col :span="5">
<el-form-item label="车辆编码" prop="code"> <el-form-item label="车辆编码" prop="code">
<el-input <el-input
type="number" type="number"
style="width: 200px;" style="width: 200px;"
v-model.number="listQuery.code" v-model.number="listQuery.code"
placeholder="请输入车辆编码" placeholder="请输入车辆编码"
></el-input> ></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<el-form-item label="车牌号" prop="code"> <el-form-item label="车牌号" prop="code">
<el-input <el-input
@keyup.enter.native="handleFilter" @keyup.enter.native="handleFilter"
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item"
placeholder="车牌号" placeholder="车牌号"
v-model="listQuery.numberPlate" v-model="listQuery.numberPlate"
></el-input> ></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<el-form-item label="出车日期" prop="startTime"> <el-form-item label="出车日期" prop="startTime">
<el-date-picker <el-date-picker
v-model="listQuery.startTime" v-model="listQuery.startTime"
type="date" type="date"
:editable="false" :editable="false"
format="yyyy-MM-dd" format="yyyy-MM-dd"
prop="startTime" prop="startTime"
placeholder="请选择出车日期" placeholder="请选择出车日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<el-form-item label="还车日期" prop="endTime"> <el-form-item label="还车日期" prop="endTime">
<el-date-picker <el-date-picker
v-model="listQuery.endTime" v-model="listQuery.endTime"
type="date" type="date"
:editable="false" :editable="false"
format="yyyy-MM-dd" format="yyyy-MM-dd"
prop="endTime" prop="endTime"
placeholder="请选择还车日期" placeholder="请选择还车日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="5"> <el-col :span="5">
<el-form-item label="出车公司" prop="departureId"> <el-form-item label="出车公司" prop="departureId">
<el-autocomplete <el-autocomplete
class="inline-input" class="inline-input"
v-model="state1" v-model="state1"
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
placeholder="请输入内容" placeholder="请输入内容"
@select="handleSelect" @select="handleSelect"
></el-autocomplete> ></el-autocomplete>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<el-form-item label="收车公司"> <el-form-item label="收车公司">
<el-autocomplete <el-autocomplete
class="inline-input" class="inline-input"
v-model="arrivalBranchCompanyId" v-model="arrivalBranchCompanyId"
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
placeholder="请输入内容" placeholder="请输入内容"
@select="putCompanyChange" @select="putCompanyChange"
></el-autocomplete> ></el-autocomplete>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<el-form-item label="用途"> <el-form-item label="用途">
<el-select v-model="useData" filterable placeholder="请选择车辆用途" @change="changeUse"> <el-select v-model="useData" filterable placeholder="请选择车辆用途" @change="changeUse">
<el-option label="全部" value>全部</el-option> <el-option label="全部" value>全部</el-option>
<el-option <el-option
v-for="item in useArr" v-for="item in useArr"
:key="item.code" :key="item.code"
:label="item.name" :label="item.name"
:value="item.code" :value="item.code"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="5"> <el-col :span="5">
<el-form-item> <el-form-item>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button> <el-button
<el-button class="filter-item" type="primary" v-waves @click="reloadPage">重置</el-button> class="filter-item"
</el-form-item> type="primary"
</el-col> v-waves
</el-row> icon="search"
</el-form> @click="handleFilter"
</div> >搜索</el-button>
<el-button class="filter-item" type="primary" v-waves @click="reloadPage">重置</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div v-show="statisticVisiable"> <div v-show="statisticVisiable">
<el-row style="text-align: center;margin-top: 10px;margin-bottom: 10px"> <el-row style="text-align: center;margin-top: 10px;margin-bottom: 10px">
<el-col :span="8"> <el-col :span="8">
<span class="statistic_number">{{statisticData.departureCount}}</span> <span class="statistic_number">{{statisticData.departureCount}}</span>
<br /> <br />
<br /> <br />
<span class="statistic_title">出行次数</span> <span class="statistic_title">出行次数</span>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<span class="statistic_number">{{statisticData.departureDay}}</span> <span class="statistic_number">{{statisticData.departureDay}}</span>
<br /> <br />
<br /> <br />
<span class="statistic_title">出行天数</span> <span class="statistic_title">出行天数</span>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<span class="statistic_number">{{statisticData.departureMileage}}</span> <span class="statistic_number">{{statisticData.departureMileage}}</span>
<br /> <br />
<br /> <br />
<span class="statistic_title">公里</span> <span class="statistic_title">公里</span>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<el-button <el-button
class="filter-item" class="filter-item"
type="primary" type="primary"
:icon=" showMoreMoreCol ? 'caret-left' : 'caret-right' " :icon=" showMoreMoreCol ? 'caret-left' : 'caret-right' "
v-waves v-waves
@click="showMoreMoreCol=!showMoreMoreCol" @click="showMoreMoreCol=!showMoreMoreCol"
>更多列</el-button> >更多列</el-button>
<el-table <el-table
:key="tableKey" :key="tableKey"
:data="list" :data="list"
v-loading.body="listLoading" v-loading.body="listLoading"
border border
fit fit
highlight-current-row highlight-current-row
style="width: 100%" style="width: 100%"
> >
<el-table-column type="index" label="编号" width="65"></el-table-column> <el-table-column type="index" label="编号" width="65"></el-table-column>
<!-- <el-table-column align="center" label="编号" width="65"> <!-- <el-table-column align="center" label="编号" width="65">
--> -->
<!--<template scope="scope">--> <!--<template scope="scope">-->
<!--<span>{{scope.row.id}}</span>--> <!--<span>{{scope.row.id}}</span>-->
<!--</template>--> <!--</template>-->
<!--</el-table-column>--> <!--</el-table-column>-->
<el-table-column align="center" label="车牌号" width="120"> <el-table-column align="center" label="车牌号" width="120">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.numberPlate}}</span> <span>{{scope.row.numberPlate}}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="预约出/收车时间"> <el-table-column align="center" label="所属公司" width="120">
<template slot-scope="scope"> <template slot-scope="scope">
<p>出:{{scope.row.bookStartDate}}</p> <span>{{scope.row.subordinateName}}</span>
<p>收:{{scope.row.bookEndDate}}</p> </template>
</template> </el-table-column>
</el-table-column> <el-table-column align="center" label="预计收车门店" width="120">
<el-table-column align="center" label="实际出/收车时间"> <template slot-scope="scope">
<template slot-scope="scope"> <span>{{scope.row.expectArrivalName}}</span>
<p>出:{{scope.row.departureTime}}</p> </template>
<p>收:{{scope.row.arrivalTime}}</p> </el-table-column>
</template> <el-table-column align="center" label="预约出/收车时间">
</el-table-column> <template slot-scope="scope">
<el-table-column align="center" label="出/收车公司"> <p>出:{{scope.row.bookStartDate}}</p>
<template slot-scope="scope"> <p>收:{{scope.row.bookEndDate}}</p>
<p>出:{{scope.row.departureName}}</p> </template>
<p>收:{{scope.row.arrivalName}}</p> </el-table-column>
</template> <el-table-column align="center" label="实际出/收车时间">
</el-table-column> <template slot-scope="scope">
<el-table-column align="center" width="100px" label="出/收车人"> <p>出:{{scope.row.departureTime}}</p>
<template slot-scope="scope"> <p>收:{{scope.row.arrivalTime}}</p>
<p>{{scope.row.checkMan}}</p> </template>
<p>{{scope.row.recycleMan}}</p> </el-table-column>
</template> <el-table-column align="center" label="出/收车公司">
</el-table-column> <template slot-scope="scope">
<el-table-column align="center" label="出行天数/公里数"> <p>出:{{scope.row.departureName}}</p>
<template slot-scope="scope"> <p>收:{{scope.row.arrivalName}}</p>
<p>{{scope.row.departureDay}}</p> </template>
<p>{{scope.row.mileage}}</p> </el-table-column>
</template> <el-table-column align="center" width="100px" label="出/收车人">
</el-table-column> <template slot-scope="scope">
<el-table-column align="center" label="客户/手机号"> <p>{{scope.row.checkMan}}</p>
<template slot-scope="scope"> <p>{{scope.row.recycleMan}}</p>
<p>{{scope.row.user}}</p> </template>
<p>{{scope.row.userTel}}</p> </el-table-column>
</template> <el-table-column align="center" label="出行天数/公里数">
</el-table-column> <template slot-scope="scope">
<el-table-column align="center" label="用途"> <p>{{scope.row.departureDay}}</p>
<template slot-scope="scope"> <p>{{scope.row.mileage}}</p>
<span>{{scope.row.use}}</span> </template>
</template> </el-table-column>
</el-table-column> <el-table-column align="center" label="客户/手机号">
<el-table-column align="center" label="备注"> <template slot-scope="scope">
<template slot-scope="scope"> <p>{{scope.row.user}}</p>
<span>{{scope.row.remark}}</span> <p>{{scope.row.userTel}}</p>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="用途">
<template slot-scope="scope">
<span>{{scope.row.use}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="备注">
<template slot-scope="scope">
<span>{{scope.row.remark}}</span>
</template>
</el-table-column>
<!-- <el-table-column width="100" align="center" label="使用人"> <!-- <el-table-column width="100" align="center" label="使用人">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.user}}</span> <span>{{scope.row.user}}</span>
</template> </template>
...@@ -244,9 +260,9 @@ ...@@ -244,9 +260,9 @@
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.use}}</span> <span>{{scope.row.use}}</span>
</template> </template>
</el-table-column>--> </el-table-column>-->
<!-- <el-table-column width="200" align="center" label="使用人电话" v-if="showMoreMoreCol"> <!-- <el-table-column width="200" align="center" label="使用人电话" v-if="showMoreMoreCol">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.userTel}}</span> <span>{{scope.row.userTel}}</span>
</template> </template>
...@@ -267,313 +283,311 @@ ...@@ -267,313 +283,311 @@
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.mileageEnd}}</span> <span>{{scope.row.mileageEnd}}</span>
</template> </template>
</el-table-column>--> </el-table-column>-->
</el-table> </el-table>
<div v-show="!listLoading" class="pagination-container"> <div v-show="!listLoading" class="pagination-container">
<el-pagination <el-pagination
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page.sync="listQuery.page" :current-page.sync="listQuery.page"
:page-sizes="[10,20,30, 50]" :page-sizes="[10,20,30, 50]"
:page-size="listQuery.limit" :page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="total" :total="total"
></el-pagination> ></el-pagination>
</div> </div>
<!-- <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">--> <!-- <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">-->
<!-- <el-form :model="form" :rules="rules" ref="form" label-width="100px">--> <!-- <el-form :model="form" :rules="rules" ref="form" label-width="100px">-->
<!-- <el-form-item label="姓名" prop="name">--> <!-- <el-form-item label="姓名" prop="name">-->
<!-- <el-input v-model="form.name" placeholder="请输入姓名"></el-input>--> <!-- <el-input v-model="form.name" placeholder="请输入姓名"></el-input>-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<!-- </el-form>--> <!-- </el-form>-->
<!-- <div slot="footer" class="dialog-footer">--> <!-- <div slot="footer" class="dialog-footer">-->
<!-- <el-button @click="cancel('form')">取 消</el-button>--> <!-- <el-button @click="cancel('form')">取 消</el-button>-->
<!-- <el-button v-if="dialogStatus=='create'" type="primary" @click="create('form')">确 定</el-button>--> <!-- <el-button v-if="dialogStatus=='create'" type="primary" @click="create('form')">确 定</el-button>-->
<!-- <el-button v-else type="primary" @click="update('form')">确 定</el-button>--> <!-- <el-button v-else type="primary" @click="update('form')">确 定</el-button>-->
<!-- </div>--> <!-- </div>-->
<!-- </el-dialog>--> <!-- </el-dialog>-->
</div> </div>
</template> </template>
<style> <style>
.statistic_number { .statistic_number {
font-size: x-large; font-size: x-large;
font-weight: bolder; font-weight: bolder;
} }
.statistic_title { .statistic_title {
font-size: x-large; font-size: x-large;
} }
</style> </style>
<script> <script>
import { mapGetters } from 'vuex' import { mapGetters } from "vuex";
import { import {
page, page,
statistic, statistic,
findReserveType findReserveType,
} from '../../../api/vehicle/departureLog' } from "../../../api/vehicle/departureLog";
import { getAllCompany, getAll } from 'api/base_info/branch_company/' import { getAllCompany, getAll } from "api/base_info/branch_company/";
import { getAllZone } from 'api/base_info/constant/' import { getAllZone } from "api/base_info/constant/";
import { getAllBranchCompanyByZoneId } from 'api/order/rentVehicle' import { getAllBranchCompanyByZoneId } from "api/order/rentVehicle";
import { import {
toEast8Date, toEast8Date,
deepCopyDate, deepCopyDate,
newEast8Date, newEast8Date,
getYMD_date getYMD_date,
} from 'utils/dateUtils' } from "utils/dateUtils";
export default { export default {
name: 'vehicleDepartureLog', name: "vehicleDepartureLog",
data() { data() {
return { return {
purpose:null, purpose: null,
showMoreMoreCol: false, showMoreMoreCol: false,
form: { form: {
id: null, id: null,
numberPlate: null, numberPlate: null,
vehicleId: null, vehicleId: null,
use: null, use: null,
user: null, user: null,
userTel: null, userTel: null,
checkMan: null, checkMan: null,
checkManTel: null, checkManTel: null,
recycleMan: null, recycleMan: null,
recycleManTel: null, recycleManTel: null,
departureTime: null, departureTime: null,
arrivalTime: null, arrivalTime: null,
mileageStart: null, mileageStart: null,
mileageEnd: null, mileageEnd: null,
state: null, state: null,
allCompaniesArr: [], allCompaniesArr: [],
selectArry: [] selectArry: [],
}, },
rules: { rules: {
name: [ name: [
{ {
required: true, required: true,
message: '请输入用户', message: "请输入用户",
trigger: 'blur' trigger: "blur",
} },
] ],
}, },
list: null, list: null,
total: null, total: null,
listLoading: true, listLoading: true,
allBranchCompany: [], allBranchCompany: [],
baranchQuery: { baranchQuery: {
zoneId: null zoneId: null,
}, },
allZoneArr: [], //全部片区 allZoneArr: [], //全部片区
state1: '', state1: "",
arrivalBranchCompanyId:null, arrivalBranchCompanyId: null,
useArr:[],//用途 useArr: [], //用途
useData:null, useData: null,
listQuery: { listQuery: {
page: 1, page: 1,
limit: 20, limit: 20,
startTime: undefined, startTime: undefined,
endTime: undefined, endTime: undefined,
numberPlate: undefined, numberPlate: undefined,
departureId: undefined, departureId: undefined,
arrivalBranchCompanyId: null, arrivalBranchCompanyId: null,
use:this.useData use: this.useData,
}, },
dialogStatus: '', dialogStatus: "",
textMap: { textMap: {
update: '编辑', update: "编辑",
create: '创建' create: "创建",
}, },
tableKey: 0, tableKey: 0,
dialogFormVisible: null, dialogFormVisible: null,
statisticVisiable: true, statisticVisiable: true,
statisticData: { statisticData: {
departureCount: null, departureCount: null,
departureDay: null, departureDay: null,
departureMileage: null departureMileage: null,
} },
} };
}, },
created() { created() {
let t = this let t = this;
const numberPlate = this.$route.query.numberPlate const numberPlate = this.$route.query.numberPlate;
if (numberPlate) { if (numberPlate) {
this.listQuery.numberPlate = numberPlate this.listQuery.numberPlate = numberPlate;
} }
getAll().then(response => { getAll().then((response) => {
this.allCompaniesArr = response.data this.allCompaniesArr = response.data;
let query = localStorage.getItem('vehicleDepartureLog') let query = localStorage.getItem("vehicleDepartureLog");
if (query != 'null' && query && !numberPlate) { if (query != "null" && query && !numberPlate) {
this.listQuery = JSON.parse(query) this.listQuery = JSON.parse(query);
if (t.listQuery.departureId) { if (t.listQuery.departureId) {
t.allCompaniesArr.map(function(item) { t.allCompaniesArr.map(function (item) {
if (item.id == t.listQuery.departureId) { if (item.id == t.listQuery.departureId) {
t.state1 = item.name t.state1 = item.name;
} }
}) });
} }
} }
t.handleFilter() t.handleFilter();
}) });
findReserveType().then(data=>{ findReserveType().then((data) => {
this.useArr = JSON.parse(data.data).type this.useArr = JSON.parse(data.data).type;
}) });
}, },
computed: { computed: {
...mapGetters(['elements']), ...mapGetters(["elements"]),
//获取大区列表 //获取大区列表
getAllZoneList() { getAllZoneList() {
return getAllZone() return getAllZone();
} },
}, },
methods: { methods: {
//收车公司筛选 //收车公司筛选
putCompanyChange(val) { putCompanyChange(val) {
if (val) { if (val) {
this.listQuery.arrivalBranchCompanyId = val.id this.listQuery.arrivalBranchCompanyId = val.id;
} else { } else {
this.listQuery.arrivalBranchCompanyId = null this.listQuery.arrivalBranchCompanyId = null;
} }
}, },
changeUse(val){ changeUse(val) {
if(!val){ if (!val) {
this.listQuery.use = null this.listQuery.use = null;
}else{ } else {
this.listQuery.use = val this.listQuery.use = val;
} }
}, },
/** /**
* 重置 * 重置
* */ * */
reloadPage() { reloadPage() {
this.state1 = '' this.state1 = "";
this.arrivalBranchCompanyId = null this.arrivalBranchCompanyId = null;
this.listQuery = { this.listQuery = {
page: 1, page: 1,
limit: 20, limit: 20,
startTime: undefined, startTime: undefined,
endTime: undefined, endTime: undefined,
numberPlate: undefined, numberPlate: undefined,
departureId: undefined, departureId: undefined,
arrivalBranchCompanyId: undefined, arrivalBranchCompanyId: undefined,
use:undefined use: undefined,
} };
if (this.listQuery) { if (this.listQuery) {
localStorage.setItem( localStorage.setItem(
'vehicleDepartureLog', "vehicleDepartureLog",
JSON.stringify(this.listQuery) JSON.stringify(this.listQuery)
) );
} }
this.handleFilter() this.handleFilter();
}, },
handleFilter() { handleFilter() {
this.listQuery.page = 1 this.listQuery.page = 1;
if (this.listQuery) { if (this.listQuery) {
localStorage.setItem( localStorage.setItem(
'vehicleDepartureLog', "vehicleDepartureLog",
JSON.stringify(this.listQuery) JSON.stringify(this.listQuery)
) );
} }
this.getList() this.getList();
if (this.listQuery.numberPlate) { if (this.listQuery.numberPlate) {
statistic({ numberPlate: this.listQuery.numberPlate }).then( statistic({ numberPlate: this.listQuery.numberPlate }).then(
response => { (response) => {
if (response.status == 200) { if (response.status == 200) {
this.statisticData = response.data this.statisticData = response.data;
this.statisticVisiable = true this.statisticVisiable = true;
} else { } else {
this.$message(response.message) this.$message(response.message);
} }
} }
) );
} }
}, },
dateToString: function(date) { dateToString: function (date) {
var year = date.getFullYear() var year = date.getFullYear();
var month = (date.getMonth() + 1).toString() var month = (date.getMonth() + 1).toString();
var day = date.getDate().toString() var day = date.getDate().toString();
if (month.length == 1) { if (month.length == 1) {
month = '0' + month month = "0" + month;
} }
if (day.length == 1) { if (day.length == 1) {
day = '0' + day day = "0" + day;
} }
var dateTime = year + '-' + month + '-' + day var dateTime = year + "-" + month + "-" + day;
return dateTime return dateTime;
}, },
getList() { getList() {
this.listLoading = true this.listLoading = true;
if (!this.listQuery.numberPlate) { if (!this.listQuery.numberPlate) {
this.statisticVisiable = false this.statisticVisiable = false;
} }
if (this.listQuery.startTime) { if (this.listQuery.startTime) {
this.listQuery.startTime = getYMD_date( this.listQuery.startTime = getYMD_date(
new Date(this.listQuery.startTime) new Date(this.listQuery.startTime)
) );
} }
if (this.listQuery.endTime) { if (this.listQuery.endTime) {
this.listQuery.endTime = getYMD_date( this.listQuery.endTime = getYMD_date(new Date(this.listQuery.endTime));
new Date(this.listQuery.endTime) }
) if (!this.state1) {
} this.listQuery.departureId = undefined;
if (!this.state1) { }
this.listQuery.departureId = undefined page(this.listQuery).then((response) => {
} this.list = response.data.list;
page(this.listQuery).then(response => { this.total = response.data.total;
this.list = response.data.list this.listLoading = false;
this.total = response.data.total });
this.listLoading = false },
}) querySearch(queryString, cb) {
}, let selectArry = [];
querySearch(queryString, cb) { let iitem = {
let selectArry = [] value: "全部",
let iitem = { name: "全部",
value: '全部', };
name: '全部' selectArry.push(iitem);
} this.allCompaniesArr.map(function (item) {
selectArry.push(iitem) item.value = item.name;
this.allCompaniesArr.map(function(item) { selectArry.push(item);
item.value = item.name });
selectArry.push(item) this.selectArry = selectArry;
}) var results = queryString
this.selectArry = selectArry ? selectArry.filter(this.createFilter(queryString))
var results = queryString : selectArry;
? selectArry.filter(this.createFilter(queryString)) // 调用 callback 返回建议列表的数据
: selectArry cb(results);
// 调用 callback 返回建议列表的数据 },
cb(results) createFilter(queryString) {
}, return (restaurant) => {
createFilter(queryString) { return restaurant.name.indexOf(queryString.toLowerCase()) != -1;
return restaurant => { };
return restaurant.name.indexOf(queryString.toLowerCase()) != -1 },
} handleSelect(item) {
}, if (item.value == "全部") {
handleSelect(item) { this.listQuery.departureId = undefined;
if (item.value == '全部') { } else {
this.listQuery.departureId = undefined this.listQuery.departureId = item.id;
} else { }
this.listQuery.departureId = item.id },
} handleSizeChange(val) {
}, this.listQuery.limit = val;
handleSizeChange(val) { if (this.listQuery) {
this.listQuery.limit = val localStorage.setItem(
if (this.listQuery) { "vehicleDepartureLog",
localStorage.setItem( JSON.stringify(this.listQuery)
'vehicleDepartureLog', );
JSON.stringify(this.listQuery) }
) this.getList();
} },
this.getList() handleCurrentChange(val) {
}, this.listQuery.page = val;
handleCurrentChange(val) { if (this.listQuery) {
this.listQuery.page = val localStorage.setItem(
if (this.listQuery) { "vehicleDepartureLog",
localStorage.setItem( JSON.stringify(this.listQuery)
'vehicleDepartureLog', );
JSON.stringify(this.listQuery) }
) this.getList();
} },
this.getList() },
} };
}
}
</script> </script>
src/views/vehicle/vehicleSchedulManage/index.vue
View file @ e938d74e
<template> <template>
<div class="app-container calendar-list-container" v-loading.body="showLoadingBody"> <div class="app-container calendar-list-container" v-loading.body="showLoadingBody">
<div > <div>
<div class="filter-container" ref="filter-container"> <div class="filter-container" ref="filter-container">
<el-form ref="queryForm" :inline="inline" :model="listQuery" label-width="100px"> <el-form ref="queryForm" :inline="inline" :model="listQuery" label-width="100px">
<el-row> <el-row>
...@@ -12,33 +12,80 @@ ...@@ -12,33 +12,80 @@
:value="val.code"></el-option> :value="val.code"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> --> </el-col>-->
<el-form-item label="车牌"> <el-form-item label="车牌">
<el-input v-model="listQuery.numberPlate" placeholder="请输入车牌"></el-input> <el-input v-model="listQuery.numberPlate" placeholder="请输入车牌"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="车辆编码"> <el-form-item label="车辆编码">
<el-input type="number" style="width: 200px;" v-model.number="listQuery.code" placeholder="请输入车辆编码"></el-input> <el-input
type="number"
style="width: 200px;"
v-model.number="listQuery.code"
placeholder="请输入车辆编码"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="用途"> <el-form-item label="用途">
<el-select class="filter-item" v-model="listQuery.useType" placeholder="请选择用途"> <el-select class="filter-item" v-model="listQuery.useType" placeholder="请选择用途">
<el-option :key="undefined" label="无" :value="undefined"></el-option> <el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option v-for="item in useTypeList" :key="item.code" :label="item.val" <el-option
:value="item.code"></el-option> v-for="item in useTypeList"
</el-select> :key="item.code"
</el-form-item> :label="item.val"
<el-form-item label="车型"> :value="item.code"
<el-select class="filter-item" v-model="listQuery.modelId" placeholder="请选择车型"> ></el-option>
<el-option :key="undefined" label="无" :value="undefined"></el-option> </el-select>
<el-option v-for="item in allVehicleList" :key="item.id" :label="item.name" :value="item.id"></el-option> </el-form-item>
</el-select> <el-form-item label="车型">
</el-form-item> <el-select class="filter-item" v-model="listQuery.modelId" placeholder="请选择车型">
<el-form-item label="所属地区" prop="zoneId"> <el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option
v-for="item in allVehicleList"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="所属公司">
<el-select
v-model="listQuery.branchId"
placeholder="请选择"
@change="change_query_branch"
>
<el-option label="全部" :key="undefined" :value="undefined"></el-option>
<el-option
v-for="val in companys_list"
:key="val.id"
:label="val.name"
:value="val.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="所属门店">
<el-select
class="filter-item"
v-model="listQuery.parkBranchCompanyId"
clearable
placeholder="请选择"
>
<el-option label="全部" :key="undefined" :value="undefined"></el-option>
<el-option
v-for="val in branchCompany_list"
:key="val.id"
:label="val.name"
:value="val.id"
></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="所属地区" prop="zoneId">
<el-select class="filter-item" v-model="listQuery.zoneId" placeholder="请选择" @change="getProvinceRegions"> <el-select class="filter-item" v-model="listQuery.zoneId" placeholder="请选择" @change="getProvinceRegions">
<el-option :key="undefined" label="无" :value="undefined"></el-option> <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-option v-for="val in getAllZoneList" :key="val.id" :label="val.name" :value="val.id"> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>-->
<el-form-item label="当前停放公司" prop="parkBranchCompanyId"> <!-- <el-form-item label="当前停放公司" prop="parkBranchCompanyId">
<el-autocomplete <el-autocomplete
class="inline-input" class="inline-input"
v-model="listQuery.parkBranchCompanyName" v-model="listQuery.parkBranchCompanyName"
...@@ -46,20 +93,26 @@ ...@@ -46,20 +93,26 @@
placeholder="请输入内容" placeholder="请输入内容"
@select="handleSelectPark" @select="handleSelectPark"
></el-autocomplete> ></el-autocomplete>
</el-form-item> </el-form-item>-->
<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="search"
@click="handleFilter"
>搜索</el-button>
<el-button class="filter-item" type="primary" v-waves @click="reloadPage">重置</el-button> <el-button class="filter-item" type="primary" v-waves @click="reloadPage">重置</el-button>
</el-row> </el-row>
<!-- <el-row> --> <!-- <el-row> -->
<!-- <el-col :span="8"> <!-- <el-col :span="8">
<el-form-item label="所属分公司" prop="subordinateBranch"> <el-form-item label="所属分公司" prop="subordinateBranch">
<el-select class="filter-item" v-model="listQuery.subordinateBranch" placeholder="请选择" @change="getAllBranchCompanyChange"> <el-select class="filter-item" v-model="listQuery.subordinateBranch" placeholder="请选择" @change="getAllBranchCompanyChange">
<el-option :key="undefined" label="无" :value="undefined"></el-option> <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-option v-for="val in allBranchCompany" :key="val.id" :label="val.name" :value="val.id"> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> --> </el-col>-->
<!-- <el-col :span="8"> <!-- <el-col :span="8">
<el-form-item label="时间"> <el-form-item label="时间">
<el-date-picker <el-date-picker
v-model="listQuery.startTime" v-model="listQuery.startTime"
...@@ -76,8 +129,8 @@ ...@@ -76,8 +129,8 @@
placeholder="选择日期" placeholder="选择日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
</el-col> --> </el-col>-->
<!-- <el-col :span="6"> <!-- <el-col :span="6">
<el-form-item label="当前停放公司" prop="parkBranchCompanyId"> <el-form-item label="当前停放公司" prop="parkBranchCompanyId">
<el-autocomplete <el-autocomplete
class="inline-input" class="inline-input"
...@@ -87,60 +140,113 @@ ...@@ -87,60 +140,113 @@
@select="handleSelectPark" @select="handleSelectPark"
></el-autocomplete> ></el-autocomplete>
</el-form-item> </el-form-item>
</el-col> --> </el-col>-->
<!-- </el-row> --> <!-- </el-row> -->
</el-form> </el-form>
</div> </div>
<el-form label-width="100px" v-if="countTJ" style="margin: 10px 0;"> <el-form label-width="100px" v-if="countTJ" style="margin: 10px 0;">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="2"><el-form-item label="车辆概况"></el-form-item></el-col> <el-col :span="2">
<el-col :span="5" v-for="(item, index) in countTJ" :key="item.id"> <el-form-item label="车辆概况"></el-form-item>
<div class="grid-content bg-purple" v-if="item.travelStatus == 0 || item.travelStatus == 1 || item.travelStatus == 4 || item.travelStatus == 2"> </el-col>
<div class="text" style="color: #171413;">{{item.total}}</div> <el-col :span="5" v-for="(item, index) in countTJ" :key="item.id">
<div class="text" v-if="item.travelStatus == 0">车辆总额（辆）</div> <div
<div class="text" v-if="item.travelStatus == 4">出行中车辆（辆）</div> class="grid-content bg-purple"
<div class="text" v-if="item.travelStatus == 1">空闲车辆（辆）</div> v-if="item.travelStatus == 0 || item.travelStatus == 1 || item.travelStatus == 4 || item.travelStatus == 2"
<div class="text" v-if="item.travelStatus == 2">维修中车辆（辆）</div> >
</div> <div class="text" style="color: #171413;">{{item.total}}</div>
</el-col> <div class="text" v-if="item.travelStatus == 0">车辆总额（辆）</div>
</el-row> <div class="text" v-if="item.travelStatus == 4">出行中车辆（辆）</div>
<div class="text" v-if="item.travelStatus == 1">空闲车辆（辆）</div>
<div class="text" v-if="item.travelStatus == 2">维修中车辆（辆）</div>
</div>
</el-col>
</el-row>
</el-form> </el-form>
<!--车辆预警--> <!--车辆预警-->
<div class="marquee_box" v-if="marqueeList.length>0" @mouseenter="handelOver" @mouseleave="handelOut"> <div
class="marquee_box"
v-if="marqueeList.length>0"
@mouseenter="handelOver"
@mouseleave="handelOut"
>
<ul class="marquee_list" :class="{marquee_top:animate}"> <ul class="marquee_list" :class="{marquee_top:animate}">
<li v-for="(item,index) in marqueeList" @click="toVehicleWarningMsg" :class="item.color">{{item.msg}} >>立即处理</li> <li
v-for="(item,index) in marqueeList"
@click="toVehicleWarningMsg"
:class="item.color"
>{{item.msg}} >>立即处理</li>
</ul> </ul>
</div> </div>
<!--车辆排班--> <!--车辆排班-->
<!--bookType 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他--> <!--bookType 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他-->
<div style="display: flex;margin-bottom: 20px;"> <div style="display: flex;margin-bottom: 20px;">
<span class="tip-co bg-1"></span><span>租房车/客户用车</span> <span class="tip-co bg-1"></span>
<span class="tip-co bg-5"></span><span>房车游</span> <span>租房车/客户用车</span>
<span class="tip-co bg-4"></span><span>展览</span> <span class="tip-co bg-5"></span>
<span class="tip-co bg-6"></span><span>保养/维修</span> <span>房车游</span>
<span class="tip-co bg-10"></span><span>其他</span> <span class="tip-co bg-4"></span>
<span class="tip-co bg-7"></span><span>预约中</span> <span>展览</span>
<span class="tip-co bg-8"></span><span>禁用</span> <span class="tip-co bg-6"></span>
<span>保养/维修</span>
<span class="tip-co bg-10"></span>
<span>其他</span>
<span class="tip-co bg-7"></span>
<span>预约中</span>
<span class="tip-co bg-8"></span>
<span>禁用</span>
</div> </div>
<el-table :key='tableKey' :data="list" v-loading.body="listLoading" border fit highlight-current-row <el-table
style="width: 100%;cursor: pointer;" class="schedul-tb"> :key="tableKey"
<el-table-column width="220" align="center" :label="firstTime" fixed> :data="list"
v-loading.body="listLoading"
border
fit
highlight-current-row
style="width: 100%;cursor: pointer;"
class="schedul-tb"
>
<el-table-column width="220" align="center" :label="firstTime" fixed>
<template slot-scope="scope"> <template slot-scope="scope">
<div @click="toVehicleRecords(scope.row)"> <div @click="toVehicleRecords(scope.row)">
<div style="color: #bfcbd9;font-size: 14px;"> <div style="color: #bfcbd9;font-size: 14px;">现在位置：{{scope.row.parkCompanyName}}</div>
现在位置：{{scope.row.parkCompanyName}} <div>
{{scope.row.numberPlate}}
<span style="color:red">({{scope.row.code}})</span>
<img src="../../../assets/images/detail.png" style="width: 15px;margin-left: 10px;" />
</div> </div>
<div>{{scope.row.numberPlate}}<span style='color:red'>({{scope.row.code}})</span><img src="../../../assets/images/detail.png" style="width: 15px;margin-left: 10px;"/></div> <div
<div style="color: #bfcbd9;font-size: 14px;">{{scope.row.vehicleModel?scope.row.vehicleModel.name:''}}</div> style="color: #bfcbd9;font-size: 14px;"
>{{scope.row.vehicleModel?scope.row.vehicleModel.name:''}}</div>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="60" align="center" :label="item.day" v-for="item in tempDayList" :key="item.day"> <el-table-column
width="60"
align="center"
:label="item.day"
v-for="item in tempDayList"
:key="item.day"
>
<template slot-scope="scope"> <template slot-scope="scope">
<div v-for="iitem in scope.row.temp" :key="iitem.day" v-if="iitem.time == item.time"> <div v-for="iitem in scope.row.temp" :key="iitem.day" v-if="iitem.time == item.time">
<div v-for="ii in iitem.children" :key="ii.time" :data-ii="ii.time" :data-endhour="ii.endhour" class="ii-day" :class="ii.bg" @click="toShowDialog(scope.row, iitem, ii)"> <div
<span v-if="ii.timeEtr == '00'" style="position: absolute;color: #fff;left: -20px;bottom: 0">{{ii.timeEtr}}</span> v-for="ii in iitem.children"
<span v-else style="position: relative;color: #fff;top: -24px;right: -20px;">{{ii.timeEtr}}</span> :key="ii.time"
:data-ii="ii.time"
:data-endhour="ii.endhour"
class="ii-day"
:class="ii.bg"
@click="toShowDialog(scope.row, iitem, ii)"
>
<span
v-if="ii.timeEtr == '00'"
style="position: absolute;color: #fff;left: -20px;bottom: 0"
>{{ii.timeEtr}}</span>
<span
v-else
style="position: relative;color: #fff;top: -24px;right: -20px;"
>{{ii.timeEtr}}</span>
<span style="position: absolute;color: #fff;z-index: 11;left: 0;">{{ii.timeStr}}</span> <span style="position: absolute;color: #fff;z-index: 11;left: 0;">{{ii.timeStr}}</span>
</div> </div>
</div> </div>
...@@ -148,895 +254,1118 @@ ...@@ -148,895 +254,1118 @@
</el-table-column> </el-table-column>
</el-table> </el-table>
<div v-show="!listLoading" class="pagination-container"> <div v-show="!listLoading" class="pagination-container">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" <el-pagination
:current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit" @size-change="handleSizeChange"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination> @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> </div>
</div> </div>
<!--保养弹框--> <!--保养弹框-->
<vehicleMaintenanceModal v-if="baoyang" :currentItem="currentItem" v-on:baoyangDialogEvent = "baoyangDialogEvent"></vehicleMaintenanceModal> <vehicleMaintenanceModal
v-if="baoyang"
:currentItem="currentItem"
v-on:baoyangDialogEvent="baoyangDialogEvent"
></vehicleMaintenanceModal>
<!--展览、预定用车弹框--> <!--展览、预定用车弹框-->
<vehicleExhibitionModal v-if="zhanlan" :currentItem="currentItem" v-on:zhanlanDialogEvent = "zhanlanDialogEvent"></vehicleExhibitionModal> <vehicleExhibitionModal
v-if="zhanlan"
:currentItem="currentItem"
v-on:zhanlanDialogEvent="zhanlanDialogEvent"
></vehicleExhibitionModal>
<!--安排用车弹框--> <!--安排用车弹框-->
<vehiclePlanModal v-if="anpai" :currentItem="currentItem" v-on:anpaiDialogEvent = "anpaiDialogEvent"></vehiclePlanModal> <vehiclePlanModal
v-if="anpai"
:currentItem="currentItem"
v-on:anpaiDialogEvent="anpaiDialogEvent"
></vehiclePlanModal>
<!--租车详情弹框--> <!--租车详情弹框-->
<!--rentOrder--> <!--rentOrder-->
<rentOrderDetailModal :orderDetailInfo="orderDetailInfo" v-if="rentOrder" v-on:rentOrderDetailDialogEvent="rentOrderDetailDialogEvent"></rentOrderDetailModal> <rentOrderDetailModal
:orderDetailInfo="orderDetailInfo"
v-if="rentOrder"
v-on:rentOrderDetailDialogEvent="rentOrderDetailDialogEvent"
></rentOrderDetailModal>
<!--旅游订单详情--> <!--旅游订单详情-->
<tourOrderDetailModal :tourRow="tourRow" v-if="tourDialogVisible" v-on:tourOrderDetailDialogEvent="tourOrderDetailDialogEvent"></tourOrderDetailModal> <tourOrderDetailModal
:tourRow="tourRow"
v-if="tourDialogVisible"
v-on:tourOrderDetailDialogEvent="tourOrderDetailDialogEvent"
></tourOrderDetailModal>
<!--禁用弹框--> <!--禁用弹框-->
<disableModal v-if="jinyong" :currentItem="currentItem" v-on:jinyongDialogEvent = "jinyongDialogEvent"></disableModal> <disableModal
v-if="jinyong"
:currentItem="currentItem"
v-on:jinyongDialogEvent="jinyongDialogEvent"
></disableModal>
</div> </div>
</template> </template>
<style> <style>
.flex-jca-fdc{ .flex-jca-fdc {
display: flex !important; display: flex !important;
flex-direction: column; flex-direction: column;
justify-content: space-around; justify-content: space-around;
} }
.schedul-tb .el-table .cell{ .schedul-tb .el-table .cell {
padding: 0; padding: 0;
} }
.tip-co{ .tip-co {
padding: 10px; padding: 10px;
margin-right: 10px; margin-right: 10px;
margin-left: 20px; margin-left: 20px;
} }
.tip-co:first-child{ .tip-co:first-child {
margin-left: 0; margin-left: 0;
} }
/* 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他 */ /* 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他 */
.bg-1{ .bg-1 {
background: #20a0ff; background: #20a0ff;
} }
.bg-9{ .bg-9 {
background: #20a0ff; background: #20a0ff;
} }
.bg-5{ .bg-5 {
background: #6633cc; background: #6633cc;
} }
.bg-4{ .bg-4 {
background: #00cc66; background: #00cc66;
} }
.bg-3{ .bg-3 {
background: #ff6633; background: #ff6633;
} }
.bg-6{ .bg-6 {
background: #ff6633; background: #ff6633;
} }
.bg-7{ .bg-7 {
background: #ffcc00; background: #ffcc00;
} }
.bg-8{ .bg-8 {
background: #868686; background: #868686;
} }
.bg-10{ .bg-10 {
background: #ff6699; background: #ff6699;
} }
.ii-day{ .ii-day {
height: 3px; height: 3px;
width: 60px; width: 60px;
margin-left: -19px; margin-left: -19px;
} }
.day-title{ .day-title {
border-right:1px solid #bfcbd9; border-right: 1px solid #bfcbd9;
border-bottom:1px solid #bfcbd9; border-bottom: 1px solid #bfcbd9;
padding: 10px; padding: 10px;
min-width: 45px; min-width: 45px;
max-width: 45px; max-width: 45px;
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
} }
.v-list{ .v-list {
padding: 10px; padding: 10px;
min-width: 200px; min-width: 200px;
max-width: 200px; max-width: 200px;
border-bottom:1px solid #bfcbd9; border-bottom: 1px solid #bfcbd9;
border-right:1px solid #bfcbd9; border-right: 1px solid #bfcbd9;
} }
.zzui-broadcast-window{ .zzui-broadcast-window {
height: 180px !important; height: 180px !important;
background: #ccc; background: #ccc;
} }
.el-col { .el-col {
border-radius: 4px; border-radius: 4px;
} }
.bg-purple-dark { .bg-purple-dark {
background: #99a9bf; background: #99a9bf;
} }
.bg-purple { .bg-purple {
background: #eef1f6; background: #eef1f6;
} }
.bg-purple-light { .bg-purple-light {
background: #e5e9f2; background: #e5e9f2;
} }
.grid-content { .grid-content {
border-radius: 4px; border-radius: 4px;
min-height: 36px; min-height: 36px;
} }
.grid-content .text{ .grid-content .text {
text-align: center; text-align: center;
line-height: 35px; line-height: 35px;
} }
.row-bg { .row-bg {
padding: 10px 0; padding: 10px 0;
background-color: #f9fafc; background-color: #f9fafc;
} }
.marquee { .marquee {
width: 100%; width: 100%;
height: 50px; height: 50px;
align-items: center; align-items: center;
color: #3a3a3a; color: #3a3a3a;
background-color: white; background-color: white;
display: flex; display: flex;
box-sizing: border-box; box-sizing: border-box;
overflow: hidden; overflow: hidden;
} }
.marquee_title { .marquee_title {
padding: 0 20px; padding: 0 20px;
height: 21px; height: 21px;
font-size: 14px; font-size: 14px;
border-right: 1px solid #d8d8d8; border-right: 1px solid #d8d8d8;
align-items: center; align-items: center;
} }
.marquee_box { .marquee_box {
display: block; display: block;
position: relative; position: relative;
width: 100%; width: 100%;
height: 145px; height: 145px;
overflow: hidden; overflow: hidden;
margin: 10px 0; margin: 10px 0;
background: #eef1f6; background: #eef1f6;
} }
.marquee_list { .marquee_list {
display: block; display: block;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
} }
.marquee_top { .marquee_top {
transition: all 0.5s; transition: all 0.5s;
} }
.marquee_list li { .marquee_list li {
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
font-size: 14px; font-size: 14px;
list-style-type:none; list-style-type: none;
} }
.marquee_list li span { .marquee_list li span {
padding: 0 2px; padding: 0 2px;
} }
.warn-1{ .warn-1 {
color: red; color: red;
} }
.warn-2{ .warn-2 {
color: #20a0ff; color: #20a0ff;
} }
.warn-3{ .warn-3 {
color: #ff9900; color: #ff9900;
} }
</style> </style>
<script> <script>
import 'static/css/uploadImg.css';// 引入图片上传组件对话框 import "static/css/uploadImg.css"; // 引入图片上传组件对话框
import vehicleMaintenanceModal from './vehicleMaintenanceModal';//车辆保养弹框 import vehicleMaintenanceModal from "./vehicleMaintenanceModal"; //车辆保养弹框
import vehicleExhibitionModal from './vehicleExhibitionModal';//车辆展览弹框 import vehicleExhibitionModal from "./vehicleExhibitionModal"; //车辆展览弹框
import vehiclePlanModal from './vehiclePlanModal';//安排用车 import vehiclePlanModal from "./vehiclePlanModal"; //安排用车
import rentOrderDetailModal from "../../order/modal/rentOrderDetailModal";//租车订单详情 import rentOrderDetailModal from "../../order/modal/rentOrderDetailModal"; //租车订单详情
import tourOrderDetailModal from "../../order/modal/tourOrderDetailModal";//房车游订单详情 import tourOrderDetailModal from "../../order/modal/tourOrderDetailModal"; //房车游订单详情
import disableModal from "./disableModal";//禁用弹框 import disableModal from "./disableModal"; //禁用弹框
import { import { getSysRegionByIds } from "api/vehicle/vehicleInfo/";
getSysRegionByIds import { getAllZone } from "api/base_info/constant/";
} from 'api/vehicle/vehicleInfo/'; import { getAllCompany, getAll } from "api/base_info/branch_company/";
import { import {
getAllZone getAllBranchCompanyByZoneId,
} from 'api/base_info/constant/'; orderDetail,
import { } from "api/order/rentVehicle";
getAllCompany, import { formatDate } from "utils/dateFormattor";
getAll import { getAllVehicleList } from "api/vehicleType";
} from 'api/base_info/branch_company/'; import { company_all_list, branchCompany_all_list } from "api/company.js";
import { import {
getAllBranchCompanyByZoneId, toEast8Date,
orderDetail deepCopyDate,
} from 'api/order/rentVehicle'; newEast8Date,
import { convertDate2Str,
formatDate timestamp2Date,
} from 'utils/dateFormattor'; getTimeByDay,
import { getCurrentMonth,
getAllVehicleList getMonth,
} from 'api/vehicleType'; getymdTimeByDay,
import { getCurrentYearMonth,
toEast8Date, } from "utils/dateUtils";
deepCopyDate,
newEast8Date,
convertDate2Str,
timestamp2Date,
getTimeByDay,
getCurrentMonth,
getMonth,
getymdTimeByDay,
getCurrentYearMonth
} from 'utils/dateUtils';
import rsCode from '../../../utils/rsCode'; import rsCode from "../../../utils/rsCode";
import {mapGetters} from 'vuex'; import { mapGetters } from "vuex";
import { import { getToken } from "utils/auth";
getToken import {
} from 'utils/auth'; getVehiclePlanList,
import { getVehicleOrderDetail,
getVehiclePlanList, getTourInfor,
getVehicleOrderDetail, } from "api/vehicle/vehicleSchedulManage";
getTourInfor import Element1 from "../../admin/menu/components/element";
} from 'api/vehicle/vehicleSchedulManage'; import ElRow from "element-ui/packages/row/src/row";
import Element1 from "../../admin/menu/components/element"; import ElCol from "element-ui/packages/col/src/col";
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
export default { export default {
name: 'vehicleSchedulManage', name: "vehicleSchedulManage",
components: { components: {
ElCol, ElCol,
ElRow, ElRow,
Element1, Element1,
vehicleExhibitionModal, vehicleExhibitionModal,
vehicleMaintenanceModal, vehicleMaintenanceModal,
vehiclePlanModal, vehiclePlanModal,
rentOrderDetailModal, rentOrderDetailModal,
tourOrderDetailModal, tourOrderDetailModal,
disableModal disableModal,
}, },
data() { data() {
return { return {
allVehicleList: [],//全部车型 companys_list: [],
animate: false, branchCompany_list: [],
firstTime: "",//排期表-第一个字段名称 branchCompany_list_copy: [],
marqueeList: [], allVehicleList: [], //全部车型
modalTitle: "创建", animate: false,
BASE_API: process.env.BASE_API, firstTime: "", //排期表-第一个字段名称
oneCampsiteDialogVisible: false,//添加、编辑弹框 marqueeList: [],
showLoadingBody: false, modalTitle: "创建",
countTJ: undefined,//车辆概况 BASE_API: process.env.BASE_API,
form: { oneCampsiteDialogVisible: false, //添加、编辑弹框
tagNames:"",//标签 showLoadingBody: false,
name: undefined,//旅游名称 countTJ: undefined, //车辆概况
saleCount: undefined,//销量 form: {
stock: undefined,//总数量 tagNames: "", //标签
status: undefined, name: undefined, //旅游名称
}, saleCount: undefined, //销量
list: null, stock: undefined, //总数量
total: null, status: undefined,
listLoading: true, },
endTime: "",//结束时间为0点时有值 list: null,
listQuery: { total: null,
page: 1, listLoading: true,
limit: 10, endTime: "", //结束时间为0点时有值
parkBranchCompanyId: undefined,//停靠分公司id listQuery: {
parkBranchCompanyName: undefined,//停靠分公司名称 page: 1,
subordinateBranch: undefined,//所属分公司 limit: 10,
subordinateBranchName: undefined,//所属分公司名称 parkBranchCompanyId: undefined, //停靠分公司id
zoneId: undefined,//所属片区 parkBranchCompanyName: undefined, //停靠分公司名称
startTime: undefined, subordinateBranch: undefined, //所属分公司
endTime:undefined, subordinateBranchName: undefined, //所属分公司名称
status: undefined,//车辆状态 zoneId: undefined, //所属片区
useType:undefined,//用途 startTime: undefined,
modelId:undefined,//车型 endTime: undefined,
status: undefined, //车辆状态
useType: undefined, //用途
modelId: undefined, //车型
branchId: undefined, //企业
// parkBranchCompanyId: undefined, //门店
},
inline: true,
mar: null, //滚屏
textMap: {
update: "编辑",
create: "创建",
},
tableKey: 0,
tempDayList: [], //日期
currentMonth: undefined, //当前月份
nextMonth: undefined, //下月
allBranchCompany: [], //所有分公司列表
baoyang: false, //保养弹框,
zhanlan: false, //展览弹框
rentOrder: false, //租车订单详情
anpai: false, //安排用车弹框
jinyong: false, //禁用弹框
currentItem: {}, //待操作数据
orderDetailInfo: {}, //租车订单详情
rentCostDetail: {}, //租车订单费用明细
tourDialogVisible: false, //旅游订单弹框
tourRow: {}, //旅游订单详情-当前行
useTypeList: [
{
code: 1,
val: "租赁",
}, },
inline: true, {
mar: null,//滚屏 code: 2,
textMap: { val: "自用",
update: '编辑',
create: '创建'
}, },
tableKey: 0, ],
tempDayList: [],//日期 };
currentMonth: undefined,//当前月份 },
nextMonth: undefined,//下月 created() {
allBranchCompany: [],//所有分公司列表 let t = this;
baoyang: false,//保养弹框, const numberPlate = this.$route.query.numberPlate;
zhanlan: false,//展览弹框 if (numberPlate) {
rentOrder: false,//租车订单详情 this.listQuery.numberPlate = numberPlate;
anpai: false,//安排用车弹框 }
jinyong: false,//禁用弹框
currentItem: {},//待操作数据 let currentMonth = getCurrentMonth();
orderDetailInfo: {},//租车订单详情 this.currentMonth = parseInt(currentMonth);
rentCostDetail: {},//租车订单费用明细 if (this.currentMonth < 12) {
tourDialogVisible: false,//旅游订单弹框 this.nextMonth = this.currentMonth + 1;
tourRow: {},//旅游订单详情-当前行 } else {
useTypeList:[ this.nextMonth = 1;
{ }
code:1, this.firstTime = "日期(" + this.currentMonth + "~" + this.nextMonth + ")";
val:'租赁' this.getTempDayList();
}, this.mar = setInterval(this.showMarquee, 2000);
{ getAll().then((response) => {
code:2, this.allCompaniesArr = response.data;
val:'自用' let query = localStorage.getItem("vehicleSchedulManage");
} if (query != "null" && query) {
] this.listQuery = JSON.parse(query);
if (t.listQuery.parkBranchCompanyId) {
t.allCompaniesArr.map(function (item) {
if (item.id == t.listQuery.parkBranchCompanyId) {
t.listQuery.parkBranchCompanyName = item.name;
}
});
}
} }
this.getAllVehicleType();
});
getAllCompany((codeAndBranchCompany) => {
this.allCompanies = codeAndBranchCompany;
});
this.get_all_companys();
this.get_all_branchCompany();
},
computed: {
...mapGetters(["elements", "vehicleStatus"]),
//获取大区列表
getAllZoneList() {
this.allZoneArr = getAllZone();
return getAllZone();
}, },
created() { },
let t = this; methods: {
const numberPlate = this.$route.query.numberPlate; change_query_branch(val) {
if (numberPlate) { if (val) {
this.listQuery.numberPlate = numberPlate; this.branchCompany_list = this.branchCompany_list_copy.filter(
} (item) => {
return item.companyId == val;
let currentMonth = getCurrentMonth(); }
this.currentMonth = parseInt(currentMonth); );
if(this.currentMonth < 12){
this.nextMonth = this.currentMonth + 1;
} else { } else {
this.nextMonth = 1; this.branchCompany_list = this.branchCompany_list_copy;
} }
this.firstTime = "日期("+this.currentMonth+"~"+this.nextMonth+")" },
this.getTempDayList(); //所有公司
this.mar = setInterval(this.showMarquee, 2000); get_all_companys() {
getAll().then(response => { company_all_list().then((res) => {
this.allCompaniesArr = response.data; if (res.status == 200) {
let query = localStorage.getItem("vehicleSchedulManage"); this.companys_list = res.data;
if(query !="null" && query){
this.listQuery = JSON.parse(query);
if(t.listQuery.parkBranchCompanyId){
t.allCompaniesArr.map(function (item) {
if(item.id == t.listQuery.parkBranchCompanyId){
t.listQuery.parkBranchCompanyName = item.name;
}
});
}
} }
this.getAllVehicleType();
}); });
getAllCompany(codeAndBranchCompany => { },
this.allCompanies = codeAndBranchCompany; //所有门店
get_all_branchCompany() {
branchCompany_all_list({ state: 1 }).then((res) => {
if (res.status == 200) {
this.branchCompany_list = res.data;
this.branchCompany_list_copy = res.data;
}
}); });
}, },
computed: { /**
...mapGetters([ * 重置
'elements', * */
'vehicleStatus' reloadPage() {
]), this.state1 = "";
//获取大区列表 this.listQuery = {
getAllZoneList(){ page: 1,
this.allZoneArr = getAllZone(); limit: 10,
return getAllZone(); parkBranchCompanyId: undefined, //停靠分公司id
}, parkBranchCompanyName: undefined, //停靠分公司名称
subordinateBranch: undefined, //所属分公司
subordinateBranchName: undefined, //所属分公司名称
zoneId: undefined, //所属片区
startTime: undefined,
endTime: undefined,
status: undefined, //车辆状态
useType: undefined, //用途
modelId: undefined, //车型
branchId: undefined, //企业
// parkBranchCompanyId: undefined, //门店
};
if (this.listQuery) {
localStorage.setItem(
"vehicleSchedulManage",
JSON.stringify(this.listQuery)
);
}
this.getList();
}, },
methods: { /**
/** * 获取全部车型
* 重置 * */
* */ getAllVehicleType() {
reloadPage() { let t = this;
this.state1=''; getAllVehicleList().then((response) => {
this.listQuery = { let listRs = undefined;
page: 1, if (!this.$utils.isEmpty(response.data)) {
limit: 10, listRs = response.data;
parkBranchCompanyId: undefined,//停靠分公司id
parkBranchCompanyName: undefined,//停靠分公司名称
subordinateBranch: undefined,//所属分公司
subordinateBranchName: undefined,//所属分公司名称
zoneId: undefined,//所属片区
startTime: undefined,
endTime:undefined,
status: undefined,//车辆状态
useType:undefined,//用途
modelId:undefined,//车型
};
if(this.listQuery){
localStorage.setItem("vehicleSchedulManage", JSON.stringify(this.listQuery));
} }
this.getList(); this.allVehicleList = listRs;
}, let query = localStorage.getItem("vehicleSchedulManage");
/** if (query != "null" && query) {
* 获取全部车型 let queryJson = JSON.parse(query);
* */ if (queryJson.modelId) {
getAllVehicleType() { t.allVehicleList.map(function (item) {
let t = this; if (item.id == queryJson.modelId) {
getAllVehicleList().then(response => { t.vehicleArr = item.name;
let listRs = undefined; }
if (!this.$utils.isEmpty(response.data)) { });
listRs = response.data;
}
this.allVehicleList = listRs;
let query = localStorage.getItem("vehicleSchedulManage");
if(query !="null" && query){
let queryJson = JSON.parse(query);
if(queryJson.modelId){
t.allVehicleList.map(function (item) {
if(item.id == queryJson.modelId){
t.vehicleArr = item.name;
}
});
}
} }
t.getList(); }
}); t.getList();
}, });
/** },
* 旅游订单详情弹框关闭 /**
* */ * 旅游订单详情弹框关闭
tourOrderDetailDialogEvent(e){ * */
this.tourDialogVisible = false; tourOrderDetailDialogEvent(e) {
}, this.tourDialogVisible = false;
/** },
* 点击事件 /**
* */ * 点击事件
toShowDialog(item, iitem, ii){ * */
// <!--bookType 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他--> toShowDialog(item, iitem, ii) {
if (!item.mileageLastUpdate) { // <!--bookType 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他-->
item.mileageLastUpdate = 0 if (!item.mileageLastUpdate) {
} item.mileageLastUpdate = 0;
if(!ii.bg){ }
//空白-可安排用车 if (!ii.bg) {
if(item.vehicleModel==undefined){ //空白-可安排用车
if (item.vehicleModel == undefined) {
this.$notify({
title: "警告",
message: "车型未配置，请先配置",
type: "warning",
duration: 2000,
});
return false;
if (item.vehicleModel.keyword == undefined) {
this.$notify({ this.$notify({
title: '警告', title: "警告",
message: '车型未配置，请先配置', message: "车型未配置，请先配置",
type: 'warning', type: "warning",
duration: 2000 duration: 2000,
}); });
return false return false;
if(item.vehicleModel.keyword==undefined){ }
}
let arr = item.vehicleModel.keyword.split(",");
item.vehicleModel.keyword = arr.join(" | ");
this.currentItem = { item: item, iitem: iitem, ii: ii };
this.anpai = true;
} else {
if (ii.vehicleBookRecord.status == 1) {
//审核中的显示预约弹框
this.zhanlan = true;
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "预定用车",
};
} else {
if (ii.bookType == 6) {
//保养
this.baoyang = true;
this.currentItem = { item: item, iitem: iitem, ii: ii };
} else if (ii.bookType == 3) {
//维修
this.zhanlan = true;
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "维修",
upkeepName: "维修",
};
} else if (ii.bookType == 4) {
//展览
this.zhanlan = true;
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "展览用车",
upkeepName: "展览",
};
} else if (ii.bookType == 1) {
if (!ii.vehicleBookRecord.orderNo) {
this.$notify({ this.$notify({
title: '警告', title: "警告",
message: '车型未配置，请先配置', message: "订单号缺失",
type: 'warning', type: "warning",
duration: 2000 duration: 2000,
}); });
return false return false;
} else {
this.getOneVechi(ii.vehicleBookRecord.orderNo);
} }
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "租车订单",
};
} else if (ii.bookType == 9) {
this.zhanlan = true;
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "客户用车",
upkeepName: "客户用车",
};
} else if (ii.bookType == 5) {
//房车游订单详情
var str = "";
getTourInfor(ii.vehicleBookRecord.orderNo).then((response) => {
if (response.status == 200) {
str =
"旅游路线：" +
response.data.goodName +
" 出发时间：" +
response.data.time +
" 出发地：" +
response.data.siteName;
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "房车游",
upkeepName: "房车游",
str: str,
};
this.zhanlan = true;
} else {
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "房车游",
upkeepName: "房车游",
};
this.zhanlan = true;
}
});
// if(!ii.vehicleBookRecord.orderNo){
// this.$notify({
// title: '警告',
// message: '订单号缺失',
// type: 'warning',
// duration: 2000
// });
// return false;
// }else{
// 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: "禁用",
};
} else if (ii.bookType == 10) {
this.zhanlan = true;
this.currentItem = {
item: item,
iitem: iitem,
ii: ii,
title: "其他",
upkeepName: "其他",
};
} }
let arr = item.vehicleModel.keyword.split(","); }
item.vehicleModel.keyword = arr.join(" | "); }
this.currentItem = {item: item, iitem: iitem, ii: ii}; },
this.anpai = true; /**
} else { * 根据订单号获取订单详情
if(ii.vehicleBookRecord.status == 1){//审核中的显示预约弹框 * */
this.zhanlan = true; getOneVechi: function (orderNo) {
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "预定用车"}; var param = {
} else{ orderNo: orderNo,
if(ii.bookType == 6){ flag: true,
//保养 };
this.baoyang = true; orderDetail(param).then((response) => {
this.currentItem = {item: item, iitem: iitem, ii: ii}; this.orderDetailInfo = response.data;
} else if(ii.bookType == 3){ if (this.orderDetailInfo && this.orderDetailInfo.memberLevel) {
//维修 if (this.orderDetailInfo.memberLevel == 1) {
this.zhanlan = true; this.orderDetailInfo.memberName = "普通会员";
this.currentItem = {item: item, iitem: iitem, ii: ii,title: "维修",upkeepName:'维修'}; }
} else if(ii.bookType == 4){ if (this.orderDetailInfo.memberLevel == 2) {
//展览 this.orderDetailInfo.memberName = "黄金会员";
this.zhanlan = true; }
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "展览用车",upkeepName:'展览'}; if (this.orderDetailInfo.memberLevel == 3) {
} else if(ii.bookType == 1){ this.orderDetailInfo.memberName = "钻石会员";
if(!ii.vehicleBookRecord.orderNo){ }
this.$notify({ if (this.orderDetailInfo.orderRentVehicleDetail.costDetail) {
title: '警告', this.orderDetailInfo.costDetail = JSON.parse(
message: '订单号缺失', this.orderDetailInfo.orderRentVehicleDetail.costDetail
type: 'warning', );
duration: 2000 }
}); if (this.orderDetailInfo.costDetail.paramJson) {
return false; this.orderDetailInfo.rentVehiclePriceVO = JSON.parse(
} else{ this.orderDetailInfo.costDetail.paramJson
this.getOneVechi(ii.vehicleBookRecord.orderNo); );
}
if (this.orderDetailInfo.items) {
for (var i = 0; i < this.orderDetailInfo.items.length; i++) {
if (this.orderDetailInfo.items[i].type == 104) {
this.orderDetailInfo.carArticlesJson = this.orderDetailInfo.items[
i
].detail;
} }
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "租车订单"};
}else if(ii.bookType == 9){
this.zhanlan = true;
this.currentItem = {item: item, iitem: iitem, ii: ii,title: "客户用车",upkeepName:'客户用车'};
} else if(ii.bookType == 5) {
//房车游订单详情
var str = ''
getTourInfor(ii.vehicleBookRecord.orderNo).then(response => {
if(response.status==200){
str = '旅游路线：' + response.data.goodName +' 出发时间：' +response.data.time+' 出发地：' +response.data.siteName
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "房车游",upkeepName:'房车游',str:str};
this.zhanlan = true;
}else{
this.currentItem = {item: item, iitem: iitem, ii: ii, title: "房车游",upkeepName:'房车游'};
this.zhanlan = true;
}
})
// if(!ii.vehicleBookRecord.orderNo){
// this.$notify({
// title: '警告',
// message: '订单号缺失',
// type: 'warning',
// duration: 2000
// });
// return false;
// }else{
// 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: "禁用"};
} else if(ii.bookType == 10) {
this.zhanlan = true;
this.currentItem = {item: item, iitem: iitem, ii: ii,title: "其他",upkeepName:'其他'};
} }
} }
if (this.orderDetailInfo.status == 2) {
} this.orderDetailInfo.ststusName = "取消";
}, }
/** if (this.orderDetailInfo.status == -1) {
* 根据订单号获取订单详情 this.orderDetailInfo.ststusName = "定损中";
* */ }
getOneVechi: function(orderNo) { if (this.orderDetailInfo.status == 3) {
var param = { this.orderDetailInfo.ststusName = "待付款";
"orderNo":orderNo, }
"flag" : true if (this.orderDetailInfo.status == 4) {
} this.orderDetailInfo.ststusName = "待出行";
orderDetail(param).then(response => { }
this.orderDetailInfo = response.data if (this.orderDetailInfo.status == 5) {
if(this.orderDetailInfo && this.orderDetailInfo.memberLevel) { this.orderDetailInfo.ststusName = "出行中";
if(this.orderDetailInfo.memberLevel == 1) { }
this.orderDetailInfo.memberName = "普通会员" if (this.orderDetailInfo.status == 6) {
} this.orderDetailInfo.ststusName = "已完成";
if(this.orderDetailInfo.memberLevel == 2) { }
this.orderDetailInfo.memberName = "黄金会员"
}
if(this.orderDetailInfo.memberLevel == 3) {
this.orderDetailInfo.memberName = "钻石会员"
}
if(this.orderDetailInfo.orderRentVehicleDetail.costDetail) {
this.orderDetailInfo.costDetail = JSON.parse(this.orderDetailInfo.orderRentVehicleDetail.costDetail)
}
if(this.orderDetailInfo.costDetail.paramJson) {
this.orderDetailInfo.rentVehiclePriceVO = JSON.parse(this.orderDetailInfo.costDetail.paramJson)
}
if(this.orderDetailInfo.items) {
for (var i = 0;i< this.orderDetailInfo.items.length;i++) {
if(this.orderDetailInfo.items[i].type == 104) {
this.orderDetailInfo.carArticlesJson = this.orderDetailInfo.items[i].detail
}
}
}
if (this.orderDetailInfo.status == 2) {
this.orderDetailInfo.ststusName = '取消'
}
if (this.orderDetailInfo.status == -1) {
this.orderDetailInfo.ststusName = '定损中'
}
if (this.orderDetailInfo.status == 3) {
this.orderDetailInfo.ststusName = '待付款'
}
if (this.orderDetailInfo.status == 4) {
this.orderDetailInfo.ststusName = '待出行'
}
if (this.orderDetailInfo.status == 5) {
this.orderDetailInfo.ststusName = '出行中'
}
if (this.orderDetailInfo.status == 6) {
this.orderDetailInfo.ststusName = '已完成'
}
}
this.rentOrder = true
})
},
/**
* 关闭保养弹框后逻辑处理
* */
baoyangDialogEvent(e){
this.baoyang = false;
if(e){//关闭编辑
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 关闭展览弹框后逻辑处理
* */
zhanlanDialogEvent(e){
this.zhanlan = false;
if(e){//关闭编辑
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 禁用弹框关闭后逻辑处理
* */
jinyongDialogEvent(e){
this.jinyong = false;
if(e){//关闭编辑
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 安排用车弹框关闭逻辑处理
* */
anpaiDialogEvent(e){
this.anpai = false;
if(e){//关闭编辑
//编辑成功-重新加载列表
this.getList();
} }
}, this.rentOrder = true;
/** });
* 租车订单详情弹框关闭 },
* */ /**
rentOrderDetailDialogEvent(e){ * 关闭保养弹框后逻辑处理
this.rentOrder = false; * */
}, baoyangDialogEvent(e) {
/** this.baoyang = false;
* 根据片区id获取分公司列表 if (e) {
* */ //关闭编辑
getProvinceRegions(item) { //编辑成功-重新加载列表
// debugger this.getList();
this.listQuery.zoneId = item; }
},
/**
* 关闭展览弹框后逻辑处理
* */
zhanlanDialogEvent(e) {
this.zhanlan = false;
if (e) {
//关闭编辑
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 禁用弹框关闭后逻辑处理
* */
jinyongDialogEvent(e) {
this.jinyong = false;
if (e) {
//关闭编辑
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 安排用车弹框关闭逻辑处理
* */
anpaiDialogEvent(e) {
this.anpai = false;
if (e) {
//关闭编辑
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 租车订单详情弹框关闭
* */
rentOrderDetailDialogEvent(e) {
this.rentOrder = false;
},
/**
* 根据片区id获取分公司列表
* */
getProvinceRegions(item) {
// debugger
this.listQuery.zoneId = item;
this.listQuery.subordinateBranch = undefined;
getAllBranchCompanyByZoneId({ zoneId: item }).then((response) => {
this.allBranchCompany = response.data;
});
},
/**
* 选择分公司
* */
getAllBranchCompanyChange(item) {
this.listQuery.subordinateBranch = item;
},
/**
* 鼠标移入
* */
handelOver() {
clearInterval(this.mar);
},
/**
* 鼠标移出
* */
handelOut() {
this.mar = setInterval(this.showMarquee, 2000);
},
/**
* 立即处理
* */
toVehicleWarningMsg() {
this.$router.push({ path: "/vehicle/vehicleWarningMsg" });
},
showMarquee: function () {
this.animate = true;
setTimeout(() => {
this.marqueeList.push(this.marqueeList[0]);
this.marqueeList.shift();
this.animate = false;
}, 1000);
},
getAllVehicleStatus: function () {
return this.vehicleStatus;
},
/**
* 所属分公司
* */
handleSelectSubordinate(item) {
if (item.value == "无") {
this.listQuery.subordinateBranch = undefined; this.listQuery.subordinateBranch = undefined;
getAllBranchCompanyByZoneId({zoneId: item}) this.listQuery.subordinateBranchName = "无";
.then(response => { } else {
this.allBranchCompany = response.data; this.listQuery.subordinateBranch = item.id;
}) this.listQuery.subordinateBranchName = item.name;
}, }
/** },
* 选择分公司 /**
* */ * 停靠分公司
getAllBranchCompanyChange(item) { * */
this.listQuery.subordinateBranch = item handleSelectPark(item) {
}, if (item.value == "无") {
/** this.listQuery.parkBranchCompanyId = undefined;
* 鼠标移入 this.listQuery.parkBranchCompanyName = "无";
* */ } else {
handelOver(){ this.listQuery.parkBranchCompanyId = item.id;
clearInterval(this.mar); this.listQuery.parkBranchCompanyName = item.name;
}, }
/** },
* 鼠标移出 querySearch(queryString, cb) {
* */ let selectArry = [];
handelOut(){ let iitem = {
this.mar = setInterval(this.showMarquee, 2000); value: "无",
}, name: "无",
/** };
* 立即处理 selectArry.push(iitem);
* */ this.allCompaniesArr.map(function (item) {
toVehicleWarningMsg(){ item.value = item.name;
this.$router.push({path: '/vehicle/vehicleWarningMsg'}); selectArry.push(item);
}, });
showMarquee: function() { this.selectArry = selectArry;
this.animate = true; var results = queryString
setTimeout(() => { ? selectArry.filter(this.createFilter(queryString))
this.marqueeList.push(this.marqueeList[0]); : selectArry;
this.marqueeList.shift(); // 调用 callback 返回建议列表的数据
this.animate = false; cb(results);
}, 1000); },
}, createFilter(queryString) {
getAllVehicleStatus: function () { return (restaurant) => {
return this.vehicleStatus; return restaurant.name.indexOf(queryString.toLowerCase()) != -1;
}, };
/** },
* 所属分公司 /**
* */ * 获取列表
handleSelectSubordinate(item){ * */
if(item.value == "无"){ getList() {
this.listQuery.subordinateBranch = undefined; let _this = this;
this.listQuery.subordinateBranchName = "无"; this.listLoading = true;
} else { if (
this.listQuery.subordinateBranch = item.id; this.listQuery.startTime &&
this.listQuery.subordinateBranchName = item.name; typeof this.listQuery.startTime == "object"
} ) {
}, this.listQuery.startTime = this.listQuery.startTime.getTime();
/** }
* 停靠分公司 if (this.listQuery.endTime && typeof this.listQuery.endTime == "object") {
* */ this.listQuery.endTime = this.listQuery.endTime.getTime();
handleSelectPark(item){ }
if(item.value == "无"){ getVehiclePlanList(this.listQuery).then((response) => {
this.listQuery.parkBranchCompanyId = undefined; this.countTJ = response.data.vehicleCountVos;
this.listQuery.parkBranchCompanyName = "无"; let totalCountRs = undefined;
} else { let listRs = undefined;
this.listQuery.parkBranchCompanyId = item.id; if (
this.listQuery.parkBranchCompanyName = item.name; !this.$utils.isEmpty(response.data.vehicleAndModelInfoVo) &&
} this.$utils.isInteger(response.data.vehicleAndModelInfoVo.totalCount)
}, ) {
querySearch(queryString, cb) { listRs = response.data.vehicleAndModelInfoVo.data;
let selectArry = []; totalCountRs = response.data.vehicleAndModelInfoVo.totalCount;
let iitem = { listRs.map(function (item) {
value: "无", item.visible2 = false;
name: "无" item.crtTimeStr = timestamp2Date(item.crtTime);
}; if (item.storeTypeName) {
selectArry.push(iitem); item.storeTypeName = item.storeTypeName.join("|");
this.allCompaniesArr.map(function(item){ }
item.value = item.name; // 解析开始时间-结束时间
selectArry.push(item); // item.vehicleBookRecord.map(function (iitem) {
}); // let bookStartDate = iitem.bookStartDate.substring(0,10);
this.selectArry = selectArry; // let bookEndDate = iitem.bookEndDate.substring(0,10);
var results = queryString ? selectArry.filter(this.createFilter(queryString)) : selectArry; // 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"];
// 调用 callback 返回建议列表的数据 // if(iitem.startHour){
cb(results); // for(let i = 0; i < iitem.startHour.length;i++){
}, // iitem.startHourList[i] = iitem.startHour[i]
createFilter(queryString) { // }
return (restaurant) => { // }
return (restaurant.name.indexOf(queryString.toLowerCase()) != -1); // 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){
getList() { // let c = index +1;
let _this = this; // if(ic == 1 && !flag){
this.listLoading = true; // if(c<10){
if(this.listQuery.startTime && (typeof this.listQuery.startTime == "object")){ // sStart = "0"+c;
this.listQuery.startTime = this.listQuery.startTime.getTime(); // } 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天排期
item.temp = _this.getMonthDayList(item); //获取车辆30天排期
});
} }
if(this.listQuery.endTime && (typeof this.listQuery.endTime == "object")){ if (!this.$utils.isEmpty(response.data.vehicleWarningMsgs)) {
this.listQuery.endTime = this.listQuery.endTime.getTime(); response.data.vehicleWarningMsgs.map(function (ii) {
ii.color = "warn-" + ii.colorType;
});
this.marqueeList = response.data.vehicleWarningMsgs;
} }
getVehiclePlanList(this.listQuery).then(response => { this.listLoading = false;
this.countTJ = response.data.vehicleCountVos; this.list = listRs;
let totalCountRs = undefined; //渲染颜色
let listRs = undefined; this.setColor();
if (!this.$utils.isEmpty(response.data.vehicleAndModelInfoVo) && this.$utils.isInteger(response.data.vehicleAndModelInfoVo.totalCount)) { this.total = totalCountRs;
listRs = response.data.vehicleAndModelInfoVo.data; });
totalCountRs = response.data.vehicleAndModelInfoVo.totalCount; },
listRs.map(function(item){ handleFilter() {
item.visible2 = false; this.listQuery.page = 1;
item.crtTimeStr = timestamp2Date(item.crtTime); if (this.listQuery.numberPlate == "") {
if(item.storeTypeName){ this.listQuery.numberPlate = null;
item.storeTypeName = item.storeTypeName.join("|"); }
} this.$refs.queryForm.validate((valid) => {
// 解析开始时间-结束时间 if (valid) {
// item.vehicleBookRecord.map(function (iitem) { if (this.listQuery) {
// let bookStartDate = iitem.bookStartDate.substring(0,10); localStorage.setItem(
// let bookEndDate = iitem.bookEndDate.substring(0,10); "vehicleSchedulManage",
// 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"]; JSON.stringify(this.listQuery)
// 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天排期
item.temp = _this.getMonthDayList(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.getList();
this.list = listRs; } else {
//渲染颜色 return false;
this.setColor();
this.total = totalCountRs;
})
},
handleFilter() {
this.listQuery.page = 1;
if(this.listQuery.numberPlate==''){
this.listQuery.numberPlate = null;
} }
this.$refs.queryForm.validate(valid => { });
if (valid) { },
if(this.listQuery){ handleSizeChange(val) {
localStorage.setItem("vehicleSchedulManage", JSON.stringify(this.listQuery)); this.listQuery.limit = val;
} if (this.listQuery) {
this.getList(); localStorage.setItem(
"vehicleSchedulManage",
JSON.stringify(this.listQuery)
);
}
this.getList();
},
handleCurrentChange(val) {
this.listQuery.page = val;
if (this.listQuery) {
localStorage.setItem(
"vehicleSchedulManage",
JSON.stringify(this.listQuery)
);
}
this.getList();
},
/**
* 获取未来30天日历表
* */
getMonthDayList(item) {
let temp = [];
let list = this.list;
for (let i = 0; i < 30; i++) {
let t = [];
let tymd = getymdTimeByDay(i);
temp.push({ day: getTimeByDay(i), month: getMonth(i), time: tymd });
}
return temp;
},
/**
* 渲染颜色
* */
getDayList(item) {
let temp = [];
let list = this.list;
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 bookType = undefined; //当前车辆状态
let vehicleBookRecord = {}; //车辆排班信息
for (let ii = 0; ii < 24; ii++) {
if (ii < 10) {
h = "0" + ii;
tt = tymd + " 0" + ii + ":00:00";
} else { } else {
return false; tt = tymd + " " + ii + ":00:00";
h = ii;
} }
}); let bg = ""; //背景色
}, let pp = {};
handleSizeChange(val) { pp.time = tt;
this.listQuery.limit = val; pp.h = h;
if(this.listQuery){ item.vehicleBookRecord.map(function (iitem) {
localStorage.setItem("vehicleSchedulManage", JSON.stringify(this.listQuery)); if (iitem.bookStartDate <= tt && iitem.bookEndDate >= tt) {
} // <!--bookType 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他-->
this.getList(); if (
}, iitem.bookStartDate == tt &&
handleCurrentChange(val) { (iitem.bookType == 1 ||
this.listQuery.page = val; iitem.bookType == 5 ||
if(this.listQuery){ iitem.bookType == 4)
localStorage.setItem("vehicleSchedulManage", JSON.stringify(this.listQuery)); ) {
} //租车、旅游、展览显示起止时间
this.getList(); pp.timeStr = h;
}, }
/** pp.bg = "bg-" + iitem.bookType;
* 获取未来30天日历表 pp.vehicleBookRecord = iitem;
* */ pp.bookType = iitem.bookType;
getMonthDayList(item){ if (iitem.bookEndDate == tt) {
let temp = []; if (
let list = this.list; iitem.bookType == 1 ||
for(let i = 0; i < 30; i++){ iitem.bookType == 5 ||
let t = []; iitem.bookType == 4
let tymd = getymdTimeByDay(i); ) {
temp.push({day: getTimeByDay(i), month: getMonth(i), time: tymd}); pp.timeEtr = h;
}
pp.bg = "";
}
}
});
children.push(pp);
} }
return temp; temp.push({
}, day: getTimeByDay(i),
/** month: getMonth(i),
* 渲染颜色 children: children,
* */ });
getDayList(item){ }
let temp = []; return temp;
let list = this.list; },
for(let i = 0; i < 30; i++){ /**
let t = []; * 获取日期数组
let tymd = getymdTimeByDay(i); * */
setColor() {
let temp = [];
this.list.map(function (item) {
let endTime = "";
item.temp.map(function (ttemp) {
let children = []; let children = [];
let tt = "";//yyyy-MM-dd hh:mm:ss let tt = ""; //yyyy-MM-dd hh:mm:ss
let h = ""; let h = "";
let bookType = undefined;//当前车辆状态 let bookType = undefined; //当前车辆状态
let vehicleBookRecord = {};//车辆排班信息 let vehicleBookRecord = {}; //车辆排班信息
for(let ii = 0; ii < 24; ii ++) { for (let ii = 0; ii < 24; ii++) {
if (ii < 10) { if (ii < 10) {
h = "0" + ii; h = "0" + ii;
tt = tymd + " 0" + ii + ":00:00"; tt = ttemp.time + " 0" + ii + ":00:00";
} else { } else {
tt = tymd + " " + ii + ":00:00"; tt = ttemp.time + " " + ii + ":00:00";
h = ii; h = ii;
} }
let bg = "";//背景色 let bg = ""; //背景色
let pp = {}; let pp = {};
pp.time = tt; pp.time = tt;
pp.h = h; pp.h = h;
item.vehicleBookRecord.map(function (iitem) { item.vehicleBookRecord.map(function (iitem) {
if (iitem.bookStartDate <= tt && iitem.bookEndDate >=tt) { if (iitem.bookStartDate <= tt && iitem.bookEndDate >= tt) {
// <!--bookType 1-租车、2-分公司使用、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用、9、客户用车、10、其他--> // <!--bookType 2-分公司使用、1-租车、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用-->
if(iitem.bookStartDate == tt && (iitem.bookType == 1 || iitem.bookType == 5 || iitem.bookType == 4)){//租车、旅游、展览显示起止时间 if (
iitem.bookStartDate == tt &&
(iitem.bookType == 1 ||
iitem.bookType == 5 ||
iitem.bookType == 4) &&
iitem.status == 2
) {
//租车、旅游、展览显示起止时间
pp.timeStr = h; pp.timeStr = h;
} }
pp.bg = "bg-"+ iitem.bookType; if (iitem.status == 1) {
//审核中
pp.bg = "bg-7";
} else {
pp.bg = "bg-" + iitem.bookType;
}
pp.vehicleBookRecord = iitem; pp.vehicleBookRecord = iitem;
pp.bookType = iitem.bookType; pp.bookType = iitem.bookType;
if(iitem.bookEndDate == tt){ if (iitem.bookEndDate == tt && iitem.status == 2) {
if (iitem.bookType == 1 || iitem.bookType == 5 || iitem.bookType == 4){ if (
iitem.bookType == 1 ||
iitem.bookType == 5 ||
iitem.bookType == 4
) {
pp.timeEtr = h; pp.timeEtr = h;
if (h == "00") {
let cc = new Date(tt);
console.log(cc);
let te = cc.getTime() - 24 * 60 * 60;
endTime = timestamp2Date(te).substring(0, 13) + ":00:00";
console.log(endTime);
}
} }
pp.bg = ""; pp.bg = "";
} }
...@@ -1044,91 +1373,36 @@ ...@@ -1044,91 +1373,36 @@
}); });
children.push(pp); children.push(pp);
} }
temp.push({day: getTimeByDay(i), month: getMonth(i), children: children}); ttemp.children = children;
}
return temp;
},
/**
* 获取日期数组
* */
setColor(){
let temp = [];
this.list.map(function(item){
let endTime = '';
item.temp.map(function(ttemp){
let children = [];
let tt = "";//yyyy-MM-dd hh:mm:ss
let h = "";
let bookType = undefined;//当前车辆状态
let vehicleBookRecord = {};//车辆排班信息
for(let ii = 0; ii < 24; ii ++) {
if (ii < 10) {
h = "0" + ii;
tt = ttemp.time + " 0" + ii + ":00:00";
} else {
tt = ttemp.time + " " + 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) {
// <!--bookType 2-分公司使用、1-租车、3-维修、4、展览、5、旅游、6、保养、7、预约中、8、禁用-->
if(iitem.bookStartDate == tt && (iitem.bookType == 1 || iitem.bookType == 5 || iitem.bookType == 4) && iitem.status == 2){//租车、旅游、展览显示起止时间
pp.timeStr = h;
}
if(iitem.status == 1){
//审核中
pp.bg = "bg-7";
} else {
pp.bg = "bg-"+ iitem.bookType;
}
pp.vehicleBookRecord = iitem;
pp.bookType = iitem.bookType;
if(iitem.bookEndDate == tt && iitem.status == 2){
if (iitem.bookType == 1 || iitem.bookType == 5 || iitem.bookType == 4){
pp.timeEtr = h;
if(h == "00"){
let cc = new Date(tt);
console.log(cc);
let te = cc.getTime()-24*60*60;
endTime = timestamp2Date(te).substring(0, 13) +":00:00";
console.log(endTime);
}
}
pp.bg = "";
}
}
});
children.push(pp);
}
ttemp.children = children
});
}); });
console.log(this.list); });
}, console.log(this.list);
/** },
* tempDayList /**
**/ * tempDayList
getTempDayList(){ **/
let temp = []; getTempDayList() {
for(let i = 0; i < 30; i++){ let temp = [];
let t = []; for (let i = 0; i < 30; i++) {
let tymd = getymdTimeByDay(i); let t = [];
temp.push({day: getTimeByDay(i), month: getMonth(i), time: tymd}); let tymd = getymdTimeByDay(i);
} temp.push({ day: getTimeByDay(i), month: getMonth(i), time: tymd });
this.tempDayList = temp;
},
/**
* 排版记录
*/
toVehicleRecords(item){
let selectedMonth = getCurrentYearMonth();
this.$router.push({path: '/vehicle/vehicleRecords?selectedMonth='+selectedMonth+"&numberPlate="+item.numberPlate});
} }
} this.tempDayList = temp;
} },
/**
* 排版记录
*/
toVehicleRecords(item) {
let selectedMonth = getCurrentYearMonth();
this.$router.push({
path:
"/vehicle/vehicleRecords?selectedMonth=" +
selectedMonth +
"&numberPlate=" +
item.numberPlate,
});
},
},
};
</script> </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