<template>
|
<view>
|
<Nav title="车辆预约审核" customBack="pages/myInfo/index" ></Nav>
|
|
<view class="u-page">
|
<u-subsection :list="list" @change="changeSub" mode="subsection" :current="queryForm.auditStatus"></u-subsection>
|
|
<view v-if="indexList.length > 0" style="padding-top: 10px">
|
<view v-for="(item, index) in indexList" :key="index" class="list-item" @click="itemClick(item)">
|
<view class="item-cell"><view class="w-100px">车牌号</view><view>{{ item.carNo }}</view></view>
|
<view class="item-cell"><view class="w-100px">被访人电话</view><view>{{ item.phone }}</view></view>
|
<view class="item-cell"><view class="w-100px">预约地点</view><view>{{ getPositionStr(item.position) }}</view></view>
|
<view class="item-cell">
|
<view class="w-100px">进出场类型</view>
|
<view>{{ item.entryExitFlagName }}</view></view>
|
<view style="display: flex;align-items: center;" >
|
<view class="w-100px" >预约时间</view>
|
<view>{{ item.startTime }}</view>
|
<!-- <view class="item-cells">
|
<view>{{ item.startTime + '至' }}</view>
|
<view class="pre" >{{item.endTime }}</view>
|
</view> -->
|
</view>
|
<!-- <view class="item-cell"><view class="w-100px">预约时间</view><view>{{ item.startTime + '至' + item.endTime }}</view></view> -->
|
<view class="item-cell"><view class="w-100px">审核状态</view><view :style="{color:auditStatus(item.auditStatus)}">{{ item.auditStatusName }}</view></view>
|
<view class="item-cell" v-if="item.auditStatus == 2"><view class="w-100px">不通过原因</view><view>{{ item.auditRemark }}</view></view>
|
</view>
|
<view class="u-p-b-20 u-m-t-20">
|
<u-loadmore :status="load.status" color="#999999" :icon-type="load.icon" :load-text="load.text"></u-loadmore>
|
</view>
|
</view>
|
<view v-else style="padding-top: 25%;">
|
<u-empty mode="list" text="暂无审核信息"></u-empty>
|
</view>
|
<u-modal :show="show2" :showCancelButton="true" @confirm="confirm" @cancel="cancel">
|
<u-form ref="form1" :model="form" labelWidth="60" style="width: 100%;">
|
<u-form-item required label="审核不通过原因">
|
<u--textarea v-model="form.auditRemark" placeholder="请输入不通过原因" ></u--textarea>
|
</u-form-item>
|
</u-form>
|
|
</u-modal>
|
<u-popup :show="show" :overlayZIndex="10060" :zIndex="10065" :round="10" @close="show = false" :closeable="true" :customStyle="{height: '80%'}">
|
<view>
|
<u-cell title="预约信息"></u-cell>
|
<scroll-view scroll-y="true" style="height: 450px;">
|
<!-- <u-cell title="被访人" :value="activeItem.interviewee" />-->
|
<u-cell title="被访人单位" :value="activeItem.companyName" />
|
<u-cell title="被访部门" v-if="activeItem.interviewee" :value="activeItem.interviewee" />
|
<u-cell title="预约地点" v-if="activeItem.position" :value="getPositionStr(activeItem.position)" />
|
|
<u-cell title="进出场类型" :value="activeItem.entryExitFlagName"></u-cell>
|
<u-cell title="预约时间" :value="activeItem.startTime"></u-cell>
|
<u-cell title="来访人" :value="activeItem.visitor" />
|
<u-cell title="联系电话" :value="activeItem.phone"></u-cell>
|
<!-- <u-cell title="来访人单位" :value="activeItem.visitorUnit" />-->
|
|
<!-- <u-cell title="来访事由" :value="activeItem.remark"></u-cell>-->
|
<view v-for="(item,index) in activeItem.carList">
|
<view style="display: flex;justify-content: space-between;align-items: center;background: #3c9cff;
|
|
font-size: 14px;
|
line-height: 32px;
|
padding: 0 12px;">
|
<view class="title" style="color: #ffffff" >来访车辆{{index+1}}</view>
|
</view>
|
<view class="container">
|
<u-cell title="车辆类型" :value="item.carTypeName"></u-cell>
|
<u-cell title="车牌号" :value="item.carNum" ></u-cell>
|
<!-- <u-cell title="车辆状态" >-->
|
<!-- <text slot="right-icon" :style="{color: carStatusColor(item.status)}" >{{carStatus(item.status)}}</text>-->
|
<!-- </u-cell>-->
|
|
|
</view>
|
</view>
|
</scroll-view>
|
<view style="height: 68px;width: 100%">
|
|
</view>
|
|
<view class="bottom-box" v-if="activeItem.auditStatus == 0">
|
<view class="custom-no">
|
<u-button type="error" @click="noClick" text="不通过"></u-button>
|
</view>
|
<view class="custom-ok">
|
<u-button type="primary" @click="okClick" text="通过"></u-button>
|
</view>
|
</view>
|
</view>
|
</u-popup>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import {auditCar, getAuditCarList} from "../../common/api";
|
export default {
|
name: "index",
|
data(){
|
return{
|
list: [
|
'待审核','审核通过','审核不通过'
|
],
|
indexList: [],
|
queryForm:{
|
pageNum:1,
|
pageSize:10,
|
auditStatus: 0
|
},
|
load:{
|
status: 'loadMore',
|
icon: 'flower',
|
text:{
|
loadmore: '上拉加载',
|
loading:'努力加载中',
|
nomore : '没有更多数据了'
|
}
|
},
|
auditStatusList:[
|
'待审核','审核通过','审核不通过','系统作废'
|
],
|
statusList:[
|
'待入园','已入园','已出园'
|
],
|
show:false,
|
show2:false,
|
activeItem:{
|
carList:[]
|
},
|
form:{},
|
rules:{}
|
}
|
},
|
onReady() {
|
//onReady 为uni-app支持的生命周期之一
|
this.$refs.form1.setRules(this.rules)
|
},
|
onLoad(){
|
uni.setNavigationBarTitle({ title: '车辆预约审核',})
|
this.getApiPage();
|
},
|
//底部触发
|
onReachBottom(){
|
if (this.load.status !== 'nomore'){
|
this.load.status = 'loading';
|
this.queryForm.pageNum = this.queryForm.pageNum +1;
|
this.getApiPage();
|
}
|
},
|
methods: {
|
|
getPositionStr(position){
|
if(position == 1){
|
return '物流园'
|
}else if(position == 2){
|
return '办公楼'
|
}else {
|
return '物流园/办公楼'
|
}
|
},
|
|
carStatusColor(status){
|
if(status == 0){
|
return '#82848a'
|
}else if(status == 1){
|
return '#2979ff'
|
}else if(status == 2){
|
return '#19be6b'
|
}
|
},
|
|
auditStatus(status){
|
if(status == 0){
|
return '#3c9cff'
|
}else if(status == 1){
|
return '#5ac725'
|
}else if(status == 2){
|
return '#f56c5c'
|
}
|
},
|
goToDetail(e){
|
this.$u.route({url:'pages/announcement/detail',params:{id:e.name}});
|
},
|
goUrl(url){
|
this.$u.route({url:url});
|
},
|
getApiPage() {
|
const _this = this;
|
getAuditCarList(_this.queryForm).then(res=>{
|
this.$nextTick(()=>{
|
res.rows.forEach(item=>{
|
item.auditStatusName = this.auditStatusList[item.auditStatus];
|
item.statusName = this.statusList[item.status];
|
item.entryExitFlagName = item.entryExitFlag === 'I'?'进园': item.entryExitFlag === 'E'? '出园':'进园+出园';
|
})
|
if (_this.queryForm.pageNum === 1){
|
_this.indexList = res.rows;
|
}else{
|
_this.indexList.push(...res.rows);
|
}
|
this.$forceUpdate();
|
})
|
if (res.haveNextPage && this.queryForm.pageSize === res.rows.length){
|
this.load.status = 'loadmore';
|
}else{
|
this.load.status = 'nomore';
|
}
|
})
|
},
|
itemClick(item){
|
this.show = true;
|
item.carList.forEach(item=>{
|
if (item.carNum){
|
item.vehicleNumList = item.carNum.split(',');
|
}
|
|
})
|
this.activeItem = item;
|
},
|
noClick(){
|
this.show2 = true;
|
},
|
cancel(){
|
this.show2 = false;
|
},
|
okClick(){
|
auditCar({
|
auditStatus: 1,
|
id: this.activeItem.id,
|
}).then(res=>{
|
uni.showToast({
|
title: '审核成功',
|
icon: 'success',
|
duration: 2000
|
});
|
this.show = false;
|
this.getApiPage();
|
})
|
},
|
confirm(){
|
if (!this.form.auditRemark){
|
uni.$u.toast('请填写审核不通过原因');
|
return;
|
}
|
auditCar({
|
auditStatus: 2,
|
auditRemark: this.form.auditRemark,
|
id: this.activeItem.id,
|
}).then(res=>{
|
uni.showToast({
|
title: '审核成功',
|
icon: 'success',
|
duration: 2000
|
});
|
this.show2 = false;
|
this.show = false;
|
this.getApiPage();
|
})
|
},
|
changeSub(e){
|
this.queryForm.auditStatus = e;
|
this.queryForm.pageNum = 1;
|
this.getApiPage();
|
}
|
},
|
}
|
</script>
|
|
<style scoped>
|
.bottom-box{
|
position: absolute;
|
bottom: 0;width: 100%;padding: 0 2%; box-sizing: border-box;
|
background: #ffffff;height: 68px;display: flex;justify-content: space-between;align-items: center;
|
}
|
.custom-no{
|
|
width: 48%;
|
}
|
.custom-ok{
|
width: 48%;
|
}
|
.list-item{
|
width: 94%;
|
padding: 10px;box-sizing: border-box;
|
border-radius: 4px;background: #ffffff;border: 1px solid #e4e7ed;
|
box-shadow: 0px 0px 12px rgba(0, 0, 0, .12);
|
margin: 0 auto 10px;
|
}
|
.item-cell{
|
display: flex;justify-content: left;align-items: center;font-size: 16px;line-height: 28px
|
}
|
.item-cells{
|
font-size: 16px;line-height: 28px
|
}
|
.w-100px{
|
width: 120px;
|
}
|
.pre {
|
white-space: pre;
|
}
|
</style>
|
