|
@@ -1,27 +1,23 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <header class="mui-bar mui-bar-nav">
|
|
|
- <h1 class="mui-title">车位申请详情</h1>
|
|
|
- <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
|
|
|
- </header>
|
|
|
+ <common @asynCallBack="asynCallBack"></common>
|
|
|
+ <top-header :pageTitle="pageTitle"></top-header>
|
|
|
+
|
|
|
<div class="mui-content">
|
|
|
<div class="mui-content-padded vongi-editme vongi-qingjiadt">
|
|
|
<form class="mui-input-group">
|
|
|
<div class="mui-input-row">
|
|
|
<label>业主姓名</label>
|
|
|
- <span>赵刚</span>
|
|
|
+ <span>{{info.applicationName}}</span>
|
|
|
</div>
|
|
|
<div class="mui-input-row">
|
|
|
<label>手机号码</label>
|
|
|
- <span class="color4fc5f7">15500001111</span>
|
|
|
- </div>
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>房号</label>
|
|
|
- <span>1-1-2201</span>
|
|
|
+ <span class="color4fc5f7"><a :href="'tel:'+info.telephone">{{info.telephone}}</a></span>
|
|
|
</div>
|
|
|
+
|
|
|
<div class="mui-input-row">
|
|
|
<label>车牌号</label>
|
|
|
- <span>鄂D88888</span>
|
|
|
+ <span>{{info.carNum}}</span>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
@@ -29,111 +25,239 @@
|
|
|
<form class="mui-input-group">
|
|
|
<div class="mui-input-row">
|
|
|
<label>申请车位</label>
|
|
|
- <span>地面-A区-018号</span>
|
|
|
+ <span>{{info.parkingName}}</span>
|
|
|
</div>
|
|
|
<div class="mui-input-row">
|
|
|
<label style="width:40%">租用起止时间</label>
|
|
|
- <span style="width:60%">2020-10-21至2021-10-20</span>
|
|
|
+ <span style="width:60%">{{info.rentTime}}</span>
|
|
|
</div>
|
|
|
<div class="mui-input-row">
|
|
|
<label>租用时长</label>
|
|
|
- <span>12个月</span>
|
|
|
+ <span>{{info.contractDuration}}</span>
|
|
|
</div>
|
|
|
<div class="mui-input-row">
|
|
|
<label style="width:40%">预估租金(元)</label>
|
|
|
- <span style="width:60%">1440.00</span>
|
|
|
+ <span style="width:60%">{{info.estimateFee}}</span>
|
|
|
</div>
|
|
|
- <div class="mui-input-row">
|
|
|
+ <div class="mui-input-row" v-if="info.status!=3">
|
|
|
<label style="width:40%">实际租金(元)</label>
|
|
|
- <input type="text" class="mui-input-clear" placeholder="请输入调整后金额,无变动可不填" style="width:60%">
|
|
|
+ <input v-if="info.status==0" type="text" class="mui-input-clear" v-model="detail.actualFee" placeholder="请输入调整后金额,无变动可不填" style="width:60%">
|
|
|
+ <span v-if="info.status!=0" style="width:60%">{{info.actualFee}}</span>
|
|
|
+
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
- <div class="mui-content-padded vongi-qingjiadt vongi-editme">
|
|
|
+ <div class="mui-content-padded vongi-qingjiadt vongi-editme" v-if="info.status==0">
|
|
|
<form class="mui-input-group">
|
|
|
<div class="mui-input-row">
|
|
|
<label>收费方式</label>
|
|
|
- <button class="mui-btn mui-btn-block mui-navigate-right" type='button' style="width:65%">账单推送</button>
|
|
|
+ <button class="mui-btn mui-btn-block mui-navigate-right" @click="onSelect()"
|
|
|
+ type='button' style="width:65%">{{payTypeN}}</button>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
- <div class="fyy-scon-botton">
|
|
|
- <div class="examine-btn examine-btn1">关闭申请</div>
|
|
|
- <div class="examine-btn examine-btn4">推送账单</div>
|
|
|
- <!--<div class="examine-btn examine-btn2">确认租出</div>-->
|
|
|
+ <div class="fyy-scon-botton" v-if="info.status==0">
|
|
|
+ <div class="examine-btn examine-btn1" @click="show=1">关闭申请</div>
|
|
|
+ <div class="examine-btn examine-btn4" v-show="payType==2" @click="show=2">推送账单</div>
|
|
|
+ <div class="examine-btn examine-btn2"v-show="payType==1" @click="show=2">确认租出</div>
|
|
|
</div>
|
|
|
<!--已推送状态-->
|
|
|
- <div class="mui-content-padded vongi-editme vongi-qingjiadt">
|
|
|
+ <div class="mui-content-padded vongi-editme vongi-qingjiadt" v-if="info.status!=0" >
|
|
|
<form class="mui-input-group">
|
|
|
- <div class="mui-input-row">
|
|
|
+
|
|
|
+ <div class="mui-input-row" v-if="info.status==1">
|
|
|
<label>收费方式</label>
|
|
|
- <span class="color4fc5f7">账单推送</span>
|
|
|
+ <span class="color4fc5f7" >{{payTypeList[info.payType]}}</span>
|
|
|
</div>
|
|
|
+
|
|
|
<div class="mui-input-row">
|
|
|
<label>状态</label>
|
|
|
- <span class="color4fc5f7">已推送</span>
|
|
|
+ <span :class="colors[info.status]">{{info.statusN}}</span>
|
|
|
<!--<span class="color55f868">已到账</span>-->
|
|
|
</div>
|
|
|
- <div class="mui-input-row">
|
|
|
+
|
|
|
+ <div class="mui-input-row" v-if="info.pushTime">
|
|
|
<label>推送时间</label>
|
|
|
- <span>2020-10-21 10:00:00</span>
|
|
|
+ <span>{{info.pushTime}}</span>
|
|
|
</div>
|
|
|
- <div class="mui-input-row">
|
|
|
+ <div class="mui-input-row" v-if="info.payTime">
|
|
|
<label>到账时间</label>
|
|
|
- <span>2020-10-21 10:00:00</span>
|
|
|
- </div>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- <!--已关闭状态-->
|
|
|
- <div class="mui-content-padded vongi-editme vongi-qingjiadt">
|
|
|
- <form class="mui-input-group">
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>状态</label>
|
|
|
- <span class="color999">已关闭</span>
|
|
|
- <!--<span class="color55f868">已通过</span>-->
|
|
|
- <!--<span class="colorfe616c">已拒绝</span>-->
|
|
|
+ <span>{{info.payTime}}</span>
|
|
|
</div>
|
|
|
- <div class="mui-input-row">
|
|
|
+ <div class="mui-input-row" v-if="info.status==3">
|
|
|
<label style="width:100%">关闭申请理由</label>
|
|
|
- <span class="vongi-span">该车位已被售出/租出</span>
|
|
|
+ <span class="vongi-span">{{info.reason}}</span>
|
|
|
</div>
|
|
|
- <div class="mui-input-row">
|
|
|
+ <div class="mui-input-row" v-if="info.status==3">
|
|
|
<label>关闭时间</label>
|
|
|
- <span>2020-10-10 10:00:00</span>
|
|
|
+ <span>{{info.updateTime}}</span>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
+
|
|
|
<!--弹窗1-->
|
|
|
- <!--<div class="mui-popup mui-popup-in vongi-mui-pop" style="display: block;">
|
|
|
+ <div class="mui-popup mui-popup-in vongi-mui-pop" v-if="show==1">
|
|
|
<div class="mui-popup-inner vongi-pop-inner">
|
|
|
<div class="mui-popup-title">关闭申请理由</div>
|
|
|
<div class="mui-popup-input">
|
|
|
- <textarea id="textarea" rows="3" placeholder="可输入关闭申请理由"></textarea>
|
|
|
+ <textarea id="textarea" rows="3" placeholder="可输入关闭申请理由" v-model="detail.reason"></textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="mui-popup-buttons"><span class="mui-popup-button">取消</span><span class="mui-popup-button mui-popup-button-bold">确定</span></div>
|
|
|
+ <div class="mui-popup-buttons" ><span class="mui-popup-button"@click="show=0" >取消</span>
|
|
|
+ <span class="mui-popup-button mui-popup-button-bold" @click="opClose()">确定</span></div>
|
|
|
</div>
|
|
|
- <div class="mui-popup-backdrop mui-active" style="display: block;"></div>-->
|
|
|
+ <div class="mui-popup-backdrop mui-active" v-if="show==1" style="display: block;"></div>
|
|
|
<!--弹窗2-->
|
|
|
- <!--<div class="mui-popup mui-popup-in vongi-mui-pop" style="display: block;">
|
|
|
+ <div class="mui-popup mui-popup-in vongi-mui-pop" style="display: block;" v-if="show==2">
|
|
|
<div class="mui-popup-inner vongi-pop-inner">
|
|
|
<div class="mui-popup-title">确认</div>
|
|
|
- <div class="mui-media-body">
|
|
|
- 确认是否向<b class="color4fc5f7">赵刚</b>推送本次车位费账单?账单金额为<b class="colorfe616c">1440</b>元。
|
|
|
+ <div class="mui-media-body" v-if="payType==2">
|
|
|
+ 确认是否向<b class="color4fc5f7">{{info.applicationName}}</b>推送本次车位费账单?账单金额为<b class="colorfe616c">{{detail.actualFee?detail.actualFee:info.estimateFee}}</b>元。
|
|
|
+ </div>
|
|
|
+ <div class="mui-media-body" v-if="payType==1">
|
|
|
+ 确认是否向<b class="color4fc5f7">{{info.applicationName}}</b>收取了车位费<b class="colorfe616c">{{detail.actualFee?detail.actualFee:info.estimateFee}}</b>元。
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="mui-popup-buttons"><span class="mui-popup-button">取消</span><span class="mui-popup-button mui-popup-button-bold">确定</span></div>
|
|
|
+ <div class="mui-popup-buttons"><span class="mui-popup-button" @click="show=0">取消</span>
|
|
|
+ <span class="mui-popup-button mui-popup-button-bold" @click="opLease()">确定</span></div>
|
|
|
</div>
|
|
|
- <div class="mui-popup-backdrop mui-active" style="display: block;"></div>-->
|
|
|
+ <div class="mui-popup-backdrop mui-active" style="display: block;" v-if="show==2"></div>
|
|
|
</div>
|
|
|
+ <loading :visible="isLoading"></loading>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
+
|
|
|
<script>
|
|
|
+ require('$project/assets/js/mui.picker.min.js');
|
|
|
+
|
|
|
+ import * as API from '@/apis/Master/Property/car'
|
|
|
+ import Common from '$project/components/Common.vue'
|
|
|
+ import Loading from '$project/components/Loading.vue'
|
|
|
+ import TopHeader from '$project/components/TopHeader.vue'
|
|
|
+ import {
|
|
|
+ mapGetters,
|
|
|
+ mapMutations
|
|
|
+ } from 'vuex'
|
|
|
+ export default {
|
|
|
+ name: 'MasterPropertyCarInfo',
|
|
|
+ components: {
|
|
|
+ Common,
|
|
|
+ Loading,
|
|
|
+ TopHeader
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pageTitle: '车位申请详情',
|
|
|
+
|
|
|
+ isLoading: false,
|
|
|
+
|
|
|
+ id: this.$route.query.id,
|
|
|
+ detail: {
|
|
|
+ id: this.$route.query.id,
|
|
|
+ actualFee:'',
|
|
|
+ reason:'',
|
|
|
+ },
|
|
|
+ info: {},
|
|
|
+ show:0,
|
|
|
+ payType:1,
|
|
|
+ payTypeN:'线下收款',
|
|
|
+ payTypeList:['','线下收款','推送账单'],
|
|
|
+ colors:['color4fc5f7','color55f868','','color999']
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {},
|
|
|
+ methods: {
|
|
|
+ onSelect(){
|
|
|
+ var picker = new mui.PopPicker();
|
|
|
+
|
|
|
+ picker.setData([
|
|
|
+ {
|
|
|
+ text:'线下收款',value:'1'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ text:'推送账单',value:'2'
|
|
|
+ }
|
|
|
+ ]);
|
|
|
+ picker.show((selectItems) => {
|
|
|
+ this.payType = selectItems[0].value;
|
|
|
+ this.payTypeN = selectItems[0].text;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ opLease(){
|
|
|
+ if(!this.detail.actualFee){
|
|
|
+ this.detail.actualFee=this.info.estimateFee;
|
|
|
+ }
|
|
|
+ this.show=0;
|
|
|
+ if(this.payType ==1){
|
|
|
+ API.ParkingApplicationConfirmLease(this.detail).then(res => {
|
|
|
+ mui.toast("操作成功");
|
|
|
+ this.getDetail()
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if(this.payType ==2){
|
|
|
+
|
|
|
+ API.ParkingApplicationSendOrder(this.detail).then(res => {
|
|
|
+ mui.toast("操作成功");
|
|
|
+ this.getDetail()
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ opClose(){
|
|
|
+ this.isLoading = true;
|
|
|
+ this.show=0;
|
|
|
+ API.ParkingApplicationClose(this.detail).then(res => {
|
|
|
+ mui.toast("操作成功");
|
|
|
+ this.getDetail()
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //获取详情
|
|
|
+ getDetail() {
|
|
|
+
|
|
|
+ this.isLoading = true;
|
|
|
+ API.ParkingApplicationDetail({id:this.id}).then(info => {
|
|
|
+ this.isLoading = false;
|
|
|
+
|
|
|
+ this.info=info;
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ asynCallBack() {
|
|
|
+
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getDetail();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters({
|
|
|
+ openId: 'wx_openid',
|
|
|
+ token: 'token',
|
|
|
+ })
|
|
|
+ },
|
|
|
+ }
|
|
|
</script>
|
|
|
|
|
|
<style scoped src="$project/assets/css/xpwyfyy.css"></style>
|
|
|
<style src="$project/assets/css/iconfont.css"></style>
|
|
|
+<style src="$project/assets/css/mui.picker.min.css"></style>
|
|
|
+
|
|
|
<style>
|
|
|
</style>
|
|
|
|