|
|
|
|
@ -1,21 +1,38 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="office-car-history-style">
|
|
|
|
|
<DateChoose @flushDate="flushDate" :begin_date="begin_date" :end_date="end_date" :callInter="true"></DateChoose>
|
|
|
|
|
<div class="status-search-box">
|
|
|
|
|
<StatusSearch @statusChange="statusChange"/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="data-list-content-style">
|
|
|
|
|
<a-spin :spinning="isLoading">
|
|
|
|
|
<vue-scroll :ops="listScroll" style="height:25rem">
|
|
|
|
|
<div v-if="!isLoading && dataList.length > 0" class="data-list-style">
|
|
|
|
|
<InfoRow v-for="item,index in dataList" :key="'info-'+ index" :info="item"/>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="!isLoading && dataList.length === 0" class="data-list-style">
|
|
|
|
|
<a-empty></a-empty>
|
|
|
|
|
</div>
|
|
|
|
|
</vue-scroll>
|
|
|
|
|
</a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
<template v-if="pageType === 0">
|
|
|
|
|
<DateChoose @flushDate="flushDate" :begin_date="begin_date" :end_date="end_date"
|
|
|
|
|
:callInter="true"></DateChoose>
|
|
|
|
|
<div class="status-search-box">
|
|
|
|
|
<StatusSearch @statusChange="statusChange"/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="data-list-content-style">
|
|
|
|
|
<a-spin :spinning="isLoading">
|
|
|
|
|
<vue-scroll :ops="listScroll" style="height:25rem">
|
|
|
|
|
<div v-if="!isLoading && dataList.length > 0" class="data-list-style">
|
|
|
|
|
<InfoRow v-for="item,index in dataList"
|
|
|
|
|
|
|
|
|
|
:key="'info-'+ index" :info="item" @viewInfo="viewInfo(item)"/>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="!isLoading && dataList.length === 0" class="data-list-style">
|
|
|
|
|
<a-empty></a-empty>
|
|
|
|
|
</div>
|
|
|
|
|
</vue-scroll>
|
|
|
|
|
</a-spin>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="page-dom-div">
|
|
|
|
|
<a-icon type="left-circle" title="上一页"
|
|
|
|
|
:class="'page-icon-dom '+ (pageNumber == 1?'cannot-click':'can-click')"
|
|
|
|
|
v-on:click="changePage('previous')"/>
|
|
|
|
|
<span class="total-num-span">共{{totolNum}}条</span>
|
|
|
|
|
<a-icon type="right-circle" title="下一页"
|
|
|
|
|
:class="'page-icon-dom '+ (pageNumber == totalPage?'cannot-click':'can-click')"
|
|
|
|
|
v-on:click="changePage('next')"/>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-if="pageType === 1">
|
|
|
|
|
<CarInfo :applyId="applyId" :isView="true" @cancel="cancel" :pageHeight="17"/>
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
@ -24,10 +41,12 @@
|
|
|
|
|
import StatusSearch from './carStatusSearch.vue';
|
|
|
|
|
import moment from 'moment';
|
|
|
|
|
import InfoRow from '../carUseReturn/infoRow.vue';
|
|
|
|
|
import {Empty, Spin} from 'ant-design-vue';
|
|
|
|
|
import {Empty, Spin,Icon} from 'ant-design-vue';
|
|
|
|
|
import CarInfo from '../carUseReturn/checkPage.vue';
|
|
|
|
|
export default{
|
|
|
|
|
data(){
|
|
|
|
|
return {
|
|
|
|
|
pageType: 0,//0 列表页面 1 详情页面
|
|
|
|
|
listScroll: this.StaticParams.scrollOption,
|
|
|
|
|
isLoading: false,
|
|
|
|
|
begin_date: null,
|
|
|
|
|
@ -35,10 +54,11 @@
|
|
|
|
|
checkStatus: "",
|
|
|
|
|
useStatus: "",
|
|
|
|
|
pageNumber: 1,
|
|
|
|
|
pageSize: 100000,
|
|
|
|
|
pageSize: 8,
|
|
|
|
|
totalPage: 0,
|
|
|
|
|
totolNum: 0,
|
|
|
|
|
dataList: [],
|
|
|
|
|
applyId: "",
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
@ -80,6 +100,27 @@
|
|
|
|
|
this.totolNum = resData.data.total_row;
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
viewInfo: function (item) {
|
|
|
|
|
this.applyId = item.apply_id;
|
|
|
|
|
this.pageType = 1;
|
|
|
|
|
},
|
|
|
|
|
changePage: function (type) {
|
|
|
|
|
if (type == 'previous') {
|
|
|
|
|
if (this.pageNumber == 1) {
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
this.pageNumber--;
|
|
|
|
|
} else if (type == 'next') {
|
|
|
|
|
if (this.pageNumber == this.totalPage) {
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
this.pageNumber++;
|
|
|
|
|
}
|
|
|
|
|
this.getDataList();
|
|
|
|
|
},
|
|
|
|
|
cancel:function () {
|
|
|
|
|
this.pageType = 0;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
components: {
|
|
|
|
|
@ -87,7 +128,9 @@
|
|
|
|
|
StatusSearch,
|
|
|
|
|
InfoRow,
|
|
|
|
|
AEmpty: Empty,
|
|
|
|
|
ASpin: Spin
|
|
|
|
|
ASpin: Spin,
|
|
|
|
|
CarInfo,
|
|
|
|
|
AIcon:Icon
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
@ -113,5 +156,28 @@
|
|
|
|
|
height: auto;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.page-dom-div {
|
|
|
|
|
height: 2.5rem;
|
|
|
|
|
line-height: 2.5rem;
|
|
|
|
|
text-align: right;
|
|
|
|
|
padding-right: 0.5rem;
|
|
|
|
|
.page-icon-dom {
|
|
|
|
|
font-size: 1.2rem;
|
|
|
|
|
border: none;
|
|
|
|
|
border-radius: 1rem;
|
|
|
|
|
}
|
|
|
|
|
.cannot-click {
|
|
|
|
|
background-color: #a3b0c0;
|
|
|
|
|
color: white;
|
|
|
|
|
}
|
|
|
|
|
.can-click {
|
|
|
|
|
background-color: #31a8fa;
|
|
|
|
|
color: white;
|
|
|
|
|
}
|
|
|
|
|
.total-num-span {
|
|
|
|
|
margin-left: 1rem;
|
|
|
|
|
margin-right: 1rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
