|
|
@@ -1,448 +1,445 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <common ref="common" @asynCallBack="asynCallBack"></common>
|
|
|
-
|
|
|
- <top-header :pageTitle="pageTitle" v-if="step==3" ></top-header>
|
|
|
- <div class="mui-content" v-if="step==3" >
|
|
|
- <div class="mui-content-padded vongi-editme vongi-qingjiadt">
|
|
|
- <form class="mui-input-group">
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>业主姓名</label>
|
|
|
- <span>{{info.applicationName}}</span>
|
|
|
- </div>
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>手机号码</label>
|
|
|
- <span>{{info.telephone}}</span>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>车牌号</label>
|
|
|
- <span>{{info.carNum}}</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>{{info.parkingName}}</span>
|
|
|
- </div>
|
|
|
- <div class="mui-input-row">
|
|
|
- <label style="width:40%">租用起止时间</label>
|
|
|
- <span style="width:60%">{{info.rentTime}}</span>
|
|
|
- </div>
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>租用时长</label>
|
|
|
- <span>{{info.contractDuration}}</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>{{info.applicationTime}}</span>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>状态</label>
|
|
|
- <span>{{info.statusN}}</span>
|
|
|
- </div>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- <top-header :pageTitle="pageTitle" v-if="step==1" ></top-header>
|
|
|
- <div class="mui-content" v-if="step==1" >
|
|
|
- <div class="mui-content-padded vongi-qingjiadt vongi-editme">
|
|
|
- <form class="mui-input-group">
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>业主姓名</label>
|
|
|
- <span>{{person_data.name}}</span>
|
|
|
- </div>
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>手机号码</label>
|
|
|
- <span>{{person_data.phone}}</span>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>车牌号</label>
|
|
|
- <input type="text" class="mui-input-clear" v-model="detail.carNum" placeholder="输入车牌号">
|
|
|
- </div>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- <div class="mui-content-padded vongi-qingjiadt vongi-editme">
|
|
|
- <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%" @click="selectCar" v-text="carName" >请选择</button>
|
|
|
- </div>
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>开始时间</label>
|
|
|
- <button class="mui-btn mui-btn-block mui-navigate-right" type='button' style="width:65%" @click="selectTime" v-text="detail.startTime?detail.startTime:'请选择'"></button>
|
|
|
- </div>
|
|
|
- <div class="mui-input-row">
|
|
|
- <label>租用时长</label>
|
|
|
- <input type="number" class="mui-input-clear" style="width: 50%" v-model="detail.num" placeholder="租用时长">
|
|
|
-
|
|
|
- <span style="width: 10%">{{unitName}}</span>
|
|
|
-
|
|
|
- </div>
|
|
|
-
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="fyy-footer" v-if="step==1" >
|
|
|
- <div class="bindfyy-btn"><button class="mui-btn mui-btn-primary " v-if="issubmit" @click="submit()">提交</button></div>
|
|
|
- </div>
|
|
|
-
|
|
|
-
|
|
|
- <header class="mui-bar mui-bar-nav" v-show="step==2" >
|
|
|
- <a class=" mui-icon mui-icon-left-nav mui-pull-left" @click="step=1"></a>
|
|
|
- <h1 class="mui-title">车位选择</h1>
|
|
|
- </header>
|
|
|
- <div class="mui-content margin60" v-show="step==2">
|
|
|
- <div class="mui-content-padded">
|
|
|
-
|
|
|
- <div id="slider" class="mui-slider">
|
|
|
- <div class="mui-slider-group">
|
|
|
- <template v-for="mod in picList">
|
|
|
-
|
|
|
- <div class="mui-slider-item" >
|
|
|
- <a>
|
|
|
- <img v-image-preview :src="mod" style="height: 180px">
|
|
|
- </a>
|
|
|
- </div>
|
|
|
-
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- <div class="mui-slider-indicator">
|
|
|
- <template v-for="(mod,index) in picList">
|
|
|
- <div class="mui-indicator" :class="index==0?'mui-active':''"></div>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="vongi-meform-pho vongi-car">
|
|
|
- <h5>车位筛选</h5>
|
|
|
- <ul class="mui-table-view mui-table-view-radio flew" v-for="(cen,i) in listcen">
|
|
|
- <span v-show="false">{{tempi=0}}</span>
|
|
|
-
|
|
|
-
|
|
|
- <template v-for="m in map.get(cen)">
|
|
|
-
|
|
|
- <li class="mui-table-view-cell " @click="ckbtn(m,i,cen)" v-if="m.enableLease" :class="m.show?'mui-selected':''" >
|
|
|
- <span v-show="false">{{tempi=1}}</span>
|
|
|
- <a>
|
|
|
- {{m.parkingName}}
|
|
|
- </a>
|
|
|
- </li>
|
|
|
-
|
|
|
- </template>
|
|
|
- <li v-if="tempi==0" >
|
|
|
- <a>
|
|
|
- 当前选择下无车位， 请选择其他
|
|
|
- </a>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
-
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="vongi-cashier-btn-row" v-show="step==2">
|
|
|
- <div class="vongi-cashier-btn-white">
|
|
|
- <span>当前选择：{{selectName}}</span>
|
|
|
- <div class="vongi-cashier-btn" v-if="parkingId" @click="okCar">确认选择</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <loading :visible="isLoading"></loading>
|
|
|
+ <common ref="common" @asynCallBack="asynCallBack"></common>
|
|
|
+
|
|
|
+ <top-header :pageTitle="pageTitle" v-if="step==3"></top-header>
|
|
|
+ <div class="mui-content" v-if="step==3">
|
|
|
+ <div class="mui-content-padded vongi-editme vongi-qingjiadt">
|
|
|
+ <form class="mui-input-group">
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>业主姓名</label>
|
|
|
+ <span>{{info.applicationName}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>手机号码</label>
|
|
|
+ <span>{{info.telephone}}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>车牌号</label>
|
|
|
+ <span>{{info.carNum}}</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>{{info.parkingName}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label style="width:40%">租用起止时间</label>
|
|
|
+ <span style="width:60%">{{info.rentTime}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>租用时长</label>
|
|
|
+ <span>{{info.contractDuration}}</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>{{info.applicationTime}}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>状态</label>
|
|
|
+ <span>{{info.statusN}}</span>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <top-header :pageTitle="pageTitle" v-if="step==1"></top-header>
|
|
|
+ <div class="mui-content" v-if="step==1">
|
|
|
+ <div class="mui-content-padded vongi-qingjiadt vongi-editme">
|
|
|
+ <form class="mui-input-group">
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>业主姓名</label>
|
|
|
+ <span>{{person_data.name}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>手机号码</label>
|
|
|
+ <span>{{person_data.phone}}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>车牌号</label>
|
|
|
+ <input type="text" class="mui-input-clear" v-model="detail.carNum" placeholder="输入车牌号">
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ <div class="mui-content-padded vongi-qingjiadt vongi-editme">
|
|
|
+ <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%" @click="selectCar" v-text="carName">请选择</button>
|
|
|
+ </div>
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>开始时间</label>
|
|
|
+ <button class="mui-btn mui-btn-block mui-navigate-right" type='button' style="width:65%" @click="selectTime" v-text="detail.startTime?detail.startTime:'请选择'"></button>
|
|
|
+ </div>
|
|
|
+ <div class="mui-input-row">
|
|
|
+ <label>租用时长</label>
|
|
|
+ <input type="number" class="mui-input-clear" style="width: 50%" v-model="detail.num" placeholder="租用时长">
|
|
|
+
|
|
|
+ <span style="width: 10%">{{unitName}}</span>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="fyy-footer" v-if="step==1">
|
|
|
+ <div class="bindfyy-btn"><button class="mui-btn mui-btn-primary " v-if="issubmit" @click="submit()">提交</button></div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <header class="mui-bar mui-bar-nav" v-show="step==2">
|
|
|
+ <a class=" mui-icon mui-icon-left-nav mui-pull-left" @click="step=1"></a>
|
|
|
+ <h1 class="mui-title">车位选择</h1>
|
|
|
+ </header>
|
|
|
+ <div class="mui-content margin60" v-show="step==2">
|
|
|
+ <div class="mui-content-padded">
|
|
|
+ <viewer :images="picList">
|
|
|
+
|
|
|
+ <div id="slider" class="mui-slider">
|
|
|
+ <div class="mui-slider-group">
|
|
|
+
|
|
|
+ <div class="mui-slider-item" v-for="src in picList">
|
|
|
+ <a>
|
|
|
+ <img :src="src" key="src" height="100px">
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="mui-slider-indicator">
|
|
|
+ <template v-for="(mod,index) in picList">
|
|
|
+ <div class="mui-indicator" :class="index==0?'mui-active':''"></div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </viewer>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="vongi-meform-pho vongi-car">
|
|
|
+ <h5>车位筛选</h5>
|
|
|
+ <ul class="mui-table-view mui-table-view-radio flew" v-for="(cen,i) in listcen">
|
|
|
+ <span v-show="false">{{tempi=0}}</span>
|
|
|
+
|
|
|
+ <template v-for="m in map.get(cen)">
|
|
|
+
|
|
|
+ <li class="mui-table-view-cell " @click="ckbtn(m,i,cen)" v-if="m.enableLease" :class="m.show?'mui-selected':''">
|
|
|
+ <span v-show="false">{{tempi=1}}</span>
|
|
|
+ <a>
|
|
|
+ {{m.parkingName}}
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+
|
|
|
+ </template>
|
|
|
+ <li v-if="tempi==0">
|
|
|
+ <a>
|
|
|
+ 当前选择下无车位， 请选择其他
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="vongi-cashier-btn-row" v-show="step==2">
|
|
|
+ <div class="vongi-cashier-btn-white">
|
|
|
+ <span>当前选择：{{selectName}}</span>
|
|
|
+ <div class="vongi-cashier-btn" v-if="parkingId" @click="okCar">确认选择</div>
|
|
|
+ </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'
|
|
|
- import {
|
|
|
-
|
|
|
- } from '$project/utils'
|
|
|
- export default {
|
|
|
- name: 'MasterPropertyCar',
|
|
|
- components: {
|
|
|
- Common,
|
|
|
- Loading,
|
|
|
- TopHeader
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- pageTitle: '车位申请',
|
|
|
- step:'1',
|
|
|
- info:{},
|
|
|
- detail: {
|
|
|
- carNum:'',
|
|
|
- parkingId:'',
|
|
|
- startTime:'',
|
|
|
- num:'',
|
|
|
- unitId:'',
|
|
|
- },
|
|
|
- issubmit:true,
|
|
|
- carName:"请选择",
|
|
|
- unitName:'月',
|
|
|
- map:null,
|
|
|
- picList:null,
|
|
|
- isLoading: false,
|
|
|
- listcen:[],
|
|
|
- listcenindex:0,
|
|
|
- selectName:'',
|
|
|
- parkingId:'',
|
|
|
-
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.map = new Map();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- okCar(){
|
|
|
- this.detail.parkingId=this.parkingId;
|
|
|
- this.carName=this.selectName
|
|
|
- this.detail.parkingName=this.selectName
|
|
|
- this.step='1';
|
|
|
- },
|
|
|
- ckbtn(m,i,cen){
|
|
|
-
|
|
|
- this.listcen.splice(i+1,this.listcen.length-i+1);
|
|
|
- if(m.hasNext){
|
|
|
- this.parkingId="";
|
|
|
- this.getSelect(m.id);
|
|
|
- }else{
|
|
|
- this.parkingId=m.id;
|
|
|
- }
|
|
|
-
|
|
|
- m.show=true;
|
|
|
- this.selectName="";
|
|
|
- for(var str in this.listcen){
|
|
|
-
|
|
|
- if(eval(str+"+1")==this.listcen.length){
|
|
|
- if(str!="0"){
|
|
|
- this.selectName+="-";
|
|
|
- }
|
|
|
- this.selectName+=m.parkingName;
|
|
|
- break;
|
|
|
- }
|
|
|
- var k= this.listcen[str]
|
|
|
- var k2= this.listcen[eval(str+"+1")]
|
|
|
-
|
|
|
- var list=this.map.get(k);
|
|
|
- for(var i in list){
|
|
|
- var mod=list[i]
|
|
|
- if(mod.id==k2){
|
|
|
- if(str!="0"){
|
|
|
- this.selectName+="-";
|
|
|
- }
|
|
|
- this.selectName+=mod.parkingName;
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- //表单校验
|
|
|
- checkForm() {
|
|
|
-
|
|
|
- if (!this.detail.unitId) {
|
|
|
- mui.toast('未配置租用单位，请联系管理员');
|
|
|
- return false;
|
|
|
- }else if (!this.detail.carNum) {
|
|
|
- mui.toast('请输入车牌号');
|
|
|
- return false;
|
|
|
- }else if (!this.detail.parkingId) {
|
|
|
- mui.toast('请选择租用车位');
|
|
|
- return false;
|
|
|
- } else if (!this.detail.startTime) {
|
|
|
- mui.toast('请输入开始时间');
|
|
|
- return false;
|
|
|
- }else if (!this.detail.num) {
|
|
|
- mui.toast('请输入租用时长');
|
|
|
- return false;
|
|
|
- }else if(!(/(^[1-9]\d*$)/.test(this.detail.num))){
|
|
|
- mui.toast('请输入正整数');
|
|
|
- return false;
|
|
|
- } else {
|
|
|
- return true;
|
|
|
- }
|
|
|
- },
|
|
|
- submit(){
|
|
|
- if (this.checkForm()) {
|
|
|
- this.isLoading = true;
|
|
|
-
|
|
|
- API.submitParkingApply(this.detail ).then(response => {
|
|
|
- this.isLoading = false;
|
|
|
- var _this=this;
|
|
|
-
|
|
|
- mui.alert('您的车位申请信息已提交，请等待物业确认。', ' ', function() {
|
|
|
- // _this.$router.push({
|
|
|
- // name: 'Master',
|
|
|
- // })
|
|
|
- _this.getDetail()
|
|
|
- });
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- this.isLoading = false;
|
|
|
- mui.toast(error);
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- //选择时间
|
|
|
- selectTime() {
|
|
|
- var _this = this;
|
|
|
-
|
|
|
- var picker = new mui.DtPicker({
|
|
|
- "type": "date",
|
|
|
- "beginYear": 2020,
|
|
|
- "endYear": 2040,
|
|
|
- "beginDate": new Date(),
|
|
|
-
|
|
|
- });
|
|
|
- picker.show(function(rs) {
|
|
|
- _this.detail.startTime = rs.text;
|
|
|
- });
|
|
|
- },
|
|
|
- //选择停车位
|
|
|
- selectCar() {
|
|
|
- this.step=2;
|
|
|
- if(!this.picList){
|
|
|
- this.getPic();
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- //获取详情
|
|
|
- getPic() {
|
|
|
-
|
|
|
- API.parkingPicList().then(response => {
|
|
|
- this.picList=response.list;
|
|
|
- this.$nextTick(() => {
|
|
|
- var gallery = mui('.mui-slider');
|
|
|
- var slider = gallery.slider({
|
|
|
- interval: 3000, //自动轮播周期，若为0则不自动播放，默认为0；
|
|
|
- bounce: true //是否启用回弹
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- })
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- mui.toast(error);
|
|
|
- })
|
|
|
-
|
|
|
- this.getSelect('');
|
|
|
-
|
|
|
-
|
|
|
- } ,
|
|
|
-
|
|
|
- //获取详情
|
|
|
- getSelect(val) {
|
|
|
-
|
|
|
- var list =this.map.get(val)
|
|
|
- var newlist=[];
|
|
|
- for(var i in list){
|
|
|
- var mod=list[i];
|
|
|
- mod.show=false
|
|
|
- newlist.push(mod);
|
|
|
- }
|
|
|
- this.map.set(val,newlist)
|
|
|
-
|
|
|
- if(list){
|
|
|
- this.listcen.push(val);
|
|
|
- }else{
|
|
|
- this.isLoading = true;
|
|
|
-
|
|
|
- API.parkingList({id:val}).then(response => {
|
|
|
- this.map.set(val,response.list)
|
|
|
- this.isLoading = false;
|
|
|
-
|
|
|
- this.listcen.push(val);
|
|
|
-
|
|
|
- }).catch(error => {
|
|
|
- this.isLoading = false;
|
|
|
- console.log(error)
|
|
|
- })
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- } ,
|
|
|
-
|
|
|
- //获取详情
|
|
|
- getDetail() {
|
|
|
- this.isLoading = true;
|
|
|
-
|
|
|
- API.parkingUnit().then(response => {
|
|
|
-
|
|
|
-
|
|
|
- this.isLoading = false;
|
|
|
- if(response.id){
|
|
|
- this.issubmit=false;
|
|
|
- this.isLoading = true;
|
|
|
-
|
|
|
- API.ParkingApplicationDetail({id:response.id}).then(info => {
|
|
|
- this.isLoading = false;
|
|
|
- this.step=3;
|
|
|
- this.info=info;
|
|
|
- }).catch(error => {
|
|
|
- this.isLoading = false;
|
|
|
- mui.toast(error);
|
|
|
- })
|
|
|
- //mui.toast("您已有一条待处理的车位申请记录");
|
|
|
- }
|
|
|
- if(!response.unit){
|
|
|
- mui.toast('未配置租用单位，请联系管理员');
|
|
|
- }else{
|
|
|
- this.detail.unitId=response.unit.id;
|
|
|
- this.unitName=response.unit.name;
|
|
|
- }
|
|
|
- }).catch(error => {
|
|
|
- this.isLoading = false;
|
|
|
- mui.toast(error);
|
|
|
- })
|
|
|
- },asynCallBack(){},
|
|
|
- },
|
|
|
- mounted() {
|
|
|
-
|
|
|
- this.getDetail();
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- destroyed() {
|
|
|
-
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters({
|
|
|
- openId: 'wx_openid',
|
|
|
- token: 'token',
|
|
|
- person_data: 'person_data',
|
|
|
- person_popedom: 'person_popedom',
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
+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'
|
|
|
+import {
|
|
|
+
|
|
|
+} from '$project/utils'
|
|
|
+export default {
|
|
|
+ name: 'MasterPropertyCar',
|
|
|
+ components: {
|
|
|
+ Common,
|
|
|
+ Loading,
|
|
|
+ TopHeader
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pageTitle: '车位申请',
|
|
|
+ step: '1',
|
|
|
+ info: {},
|
|
|
+ detail: {
|
|
|
+ carNum: '',
|
|
|
+ parkingId: '',
|
|
|
+ startTime: '',
|
|
|
+ num: '',
|
|
|
+ unitId: '',
|
|
|
+ },
|
|
|
+ issubmit: true,
|
|
|
+ carName: "请选择",
|
|
|
+ unitName: '月',
|
|
|
+ map: null,
|
|
|
+ picList: null,
|
|
|
+ isLoading: false,
|
|
|
+ listcen: [],
|
|
|
+ listcenindex: 0,
|
|
|
+ selectName: '',
|
|
|
+ parkingId: '',
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.map = new Map();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ okCar() {
|
|
|
+ this.detail.parkingId = this.parkingId;
|
|
|
+ this.carName = this.selectName
|
|
|
+ this.detail.parkingName = this.selectName
|
|
|
+ this.step = '1';
|
|
|
+ },
|
|
|
+ ckbtn(m, i, cen) {
|
|
|
+
|
|
|
+ this.listcen.splice(i + 1, this.listcen.length - i + 1);
|
|
|
+ if (m.hasNext) {
|
|
|
+ this.parkingId = "";
|
|
|
+ this.getSelect(m.id);
|
|
|
+ } else {
|
|
|
+ this.parkingId = m.id;
|
|
|
+ }
|
|
|
+
|
|
|
+ m.show = true;
|
|
|
+ this.selectName = "";
|
|
|
+ for (var str in this.listcen) {
|
|
|
+
|
|
|
+ if (eval(str + "+1") == this.listcen.length) {
|
|
|
+ if (str != "0") {
|
|
|
+ this.selectName += "-";
|
|
|
+ }
|
|
|
+ this.selectName += m.parkingName;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ var k = this.listcen[str]
|
|
|
+ var k2 = this.listcen[eval(str + "+1")]
|
|
|
+
|
|
|
+ var list = this.map.get(k);
|
|
|
+ for (var i in list) {
|
|
|
+ var mod = list[i]
|
|
|
+ if (mod.id == k2) {
|
|
|
+ if (str != "0") {
|
|
|
+ this.selectName += "-";
|
|
|
+ }
|
|
|
+ this.selectName += mod.parkingName;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //表单校验
|
|
|
+ checkForm() {
|
|
|
+
|
|
|
+ if (!this.detail.unitId) {
|
|
|
+ mui.toast('未配置租用单位，请联系管理员');
|
|
|
+ return false;
|
|
|
+ } else if (!this.detail.carNum) {
|
|
|
+ mui.toast('请输入车牌号');
|
|
|
+ return false;
|
|
|
+ } else if (!this.detail.parkingId) {
|
|
|
+ mui.toast('请选择租用车位');
|
|
|
+ return false;
|
|
|
+ } else if (!this.detail.startTime) {
|
|
|
+ mui.toast('请输入开始时间');
|
|
|
+ return false;
|
|
|
+ } else if (!this.detail.num) {
|
|
|
+ mui.toast('请输入租用时长');
|
|
|
+ return false;
|
|
|
+ } else if (!(/(^[1-9]\d*$)/.test(this.detail.num))) {
|
|
|
+ mui.toast('请输入正整数');
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ if (this.checkForm()) {
|
|
|
+ this.isLoading = true;
|
|
|
+
|
|
|
+ API.submitParkingApply(this.detail).then(response => {
|
|
|
+ this.isLoading = false;
|
|
|
+ var _this = this;
|
|
|
+
|
|
|
+ mui.alert('您的车位申请信息已提交，请等待物业确认。', ' ', function () {
|
|
|
+ // _this.$router.push({
|
|
|
+ // name: 'Master',
|
|
|
+ // })
|
|
|
+ _this.getDetail()
|
|
|
+ });
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ //选择时间
|
|
|
+ selectTime() {
|
|
|
+ var _this = this;
|
|
|
+
|
|
|
+ var picker = new mui.DtPicker({
|
|
|
+ "type": "date",
|
|
|
+ "beginYear": 2020,
|
|
|
+ "endYear": 2040,
|
|
|
+ "beginDate": new Date(),
|
|
|
+
|
|
|
+ });
|
|
|
+ picker.show(function (rs) {
|
|
|
+ _this.detail.startTime = rs.text;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //选择停车位
|
|
|
+ selectCar() {
|
|
|
+ this.step = 2;
|
|
|
+ if (!this.picList) {
|
|
|
+ this.getPic();
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ //获取详情
|
|
|
+ getPic() {
|
|
|
+
|
|
|
+ API.parkingPicList().then(response => {
|
|
|
+ this.picList = response.list;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ var gallery = mui('.mui-slider');
|
|
|
+ var slider = gallery.slider({
|
|
|
+ interval: 3000, //自动轮播周期，若为0则不自动播放，默认为0；
|
|
|
+ bounce: true //是否启用回弹
|
|
|
+ });
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+
|
|
|
+ this.getSelect('');
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ //获取详情
|
|
|
+ getSelect(val) {
|
|
|
+
|
|
|
+ var list = this.map.get(val)
|
|
|
+ var newlist = [];
|
|
|
+ for (var i in list) {
|
|
|
+ var mod = list[i];
|
|
|
+ mod.show = false
|
|
|
+ newlist.push(mod);
|
|
|
+ }
|
|
|
+ this.map.set(val, newlist)
|
|
|
+
|
|
|
+ if (list) {
|
|
|
+ this.listcen.push(val);
|
|
|
+ } else {
|
|
|
+ this.isLoading = true;
|
|
|
+
|
|
|
+ API.parkingList({
|
|
|
+ id: val
|
|
|
+ }).then(response => {
|
|
|
+ this.map.set(val, response.list)
|
|
|
+ this.isLoading = false;
|
|
|
+
|
|
|
+ this.listcen.push(val);
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ console.log(error)
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ //获取详情
|
|
|
+ getDetail() {
|
|
|
+ this.isLoading = true;
|
|
|
+
|
|
|
+ API.parkingUnit().then(response => {
|
|
|
+
|
|
|
+ this.isLoading = false;
|
|
|
+ if (response.id) {
|
|
|
+ this.issubmit = false;
|
|
|
+ this.isLoading = true;
|
|
|
+
|
|
|
+ API.ParkingApplicationDetail({
|
|
|
+ id: response.id
|
|
|
+ }).then(info => {
|
|
|
+ this.isLoading = false;
|
|
|
+ this.step = 3;
|
|
|
+ this.info = info;
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+ //mui.toast("您已有一条待处理的车位申请记录");
|
|
|
+ }
|
|
|
+ if (!response.unit) {
|
|
|
+ mui.toast('未配置租用单位，请联系管理员');
|
|
|
+ } else {
|
|
|
+ this.detail.unitId = response.unit.id;
|
|
|
+ this.unitName = response.unit.name;
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ this.isLoading = false;
|
|
|
+ mui.toast(error);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ asynCallBack() {},
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+
|
|
|
+ this.getDetail();
|
|
|
+ },
|
|
|
+
|
|
|
+ destroyed() {
|
|
|
+
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters({
|
|
|
+ openId: 'wx_openid',
|
|
|
+ token: 'token',
|
|
|
+ person_data: 'person_data',
|
|
|
+ person_popedom: 'person_popedom',
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
+
|
|
|
<style src="$project/assets/css/mui.picker.min.css"></style>
|
|
|
<style scoped src="$project/assets/css/xpwyfyy.css"></style>
|
|
|
<style src="$project/assets/css/iconfont.css"></style>
|
|
|
<style>
|
|
|
-</style>
|
|
|
|
|
|
+</style>
|
