WechatOwnerService/pages/car/applyparking.vue

<template>
	<view>
		<view class="cu-form-group">
			<view class="title">车牌号</view>
			<input v-model="carNum" placeholder="必填,请输入车牌号" style="text-align:right"></input>
		</view>
		<view class="cu-form-group">
			<view class="title">品牌</view>
			<input v-model="carBrand" placeholder="选填,请输入品牌" style="text-align:right"></input>
		</view>
		<view class="cu-form-group">
			<view class="title">颜色</view>
			<input v-model="carColor"  placeholder="选填,请输入颜色" style="text-align:right"></input>
		</view>
		<view class="cu-form-group">
			<view class="title">车辆类型</view>
			<picker bindchange="PickerChange" :value="index" :range="carTypes" @change="chooseCarTypes">
				<view class="picker">
					{{carTypeName?carTypeName:'请选择'}}
				</view>
			</picker>
		</view>
		<view class="cu-form-group align-start">
			<view class="title">备注信息</view>
			<textarea maxlength="-1" v-model="remark" placeholder="请输入备注信息"></textarea>
		</view>
		<view class="button_up_blank"></view>
		<view class="flex flex-direction">
			<button @click="submitApply()" class="cu-btn bg-blue margin-tb-sm lg">提交</button>
		</view>
		
		<view class="flex flex-direction">
			<button @click="_applyDetail()" class="cu-btn line-blue margin-tb-sm lg">查看进度</button>
		</view>
		
		<view class="temp-remark">
			<view>车位申请说明</view>
			<view>1、只有第一次租车位时，需要申请：</view>
			<view>2、审核通过后，请到车辆月卡界面购买月卡续租：</view>
		</view>
	</view>
</template>

<script>
	import context from '../../lib/java110/Java110Context.js'
	const constant = context.constant;
	import {getCurCommunity} from '../../api/community/communityApi.js'
	
	import {getProperty} from '../../api/property/propertyApi.js';

	export default {
		data() {
			return {
				carNum:'',
				carBrand:'',
				carColor:'',
				remark:'',
				psId: '',
				startDate: '请选择',
				endDate: '请选择',
				ownerId:'',
				storeId:'',
				userId:'',
				applyPersonName:'',
				applyPersonLink:'',
				applyPersonId:'',
				parkingSpaces: [],
				parkingSpaceIds: [],
				parkingSpacesName: '',
				//车辆类型
				carTypes: ['家用小汽车', '客车', '货车'],
				carTypeCodes: ['9901', '9902', '9903'],
				carTypeCode: '',
				carTypeName: '',
				
				page: 1,
				row: 20,
			};
		},
		onLoad: function(options) {
			let _this = this;
			context.getOwner(function(_owner) {
				console.log("_owner",_owner);
				_this.communityId = _owner.communityId;
				_this.ownerId = _owner.memberId;
				_this.userId = _owner.ownerId;
				_this.applyPersonName = _owner.ownerName;
				_this.applyPersonLink = _owner.ownerTel;
				_this.applyPersonId = _owner.memberId;
				_this.listParkingSpace();
			});
		},
		methods: {
			listParkingSpace: function() {
				context.request({
					url: constant.url.queryParkingSpaces,
					header: context.getHeaders(),
					method: "GET",
					data: {
						"page": this.page,
						"row": this.row,
						"communityId": this.communityId,
						"state": 'F'
					},
					success: (res) => {
						let arr = res.data.parkingSpaces;
						arr.map(item => {
							this.parkingSpaces.push(item.areaNum + "停车场  " + item.num + "车位");
							this.parkingSpaceIds.push(item.psId);
						})
					},
					fail(res) {
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						})
					}
				});
			},
			choosePickerSpace: function(e) {
				let checkInIndex = e.target.value;
				this.psId = this.parkingSpaceIds[checkInIndex];
				this.parkingSpacesName = this.parkingSpaces[checkInIndex];
			},
			//车辆类型
			chooseCarTypes: function(e) {
				let index = e.target.value;
				this.carTypeCode = this.carTypeCodes[index];
				this.carTypeName = this.carTypes[index];
			},
			_applyDetail:function(){
				uni.navigateTo({
					url:'/pages/car/parkingInfo'
				})
			},
			submitApply:function(){
				let obj = {
					"carNum": this.carNum,
					"carBrand": this.carBrand,
					"carColor": this.carColor,
					"remark": this.remark,
					"carType":this.carTypeCode,
					"communityId":this.communityId,
					"ownerId":this.ownerId,
					"state":"1001",
					"applyPersonName":this.applyPersonName,
					"applyPersonLink":this.applyPersonLink,
					"applyPersonId":this.applyPersonId,
					"userId":this.userId
				};
				console.log(obj);
				let msg = "";
				
				if (obj.carNum == "") {
					msg = "请填写车牌号";
				} else if(obj.carType == ""){
					msg = "请选择车辆类型";
				}
				if(msg != ""){
					wx.showToast({
						title: msg,
						icon: 'none',
						duration: 2000
					});
					return;
				}
				context.request({
					url: constant.url.saveOwnerCar,
					header: context.getHeaders(),
					method: "POST",
					data: obj,
					success: function(res) {
						let _json = res.data;
						if (_json.code == 0) {
							wx.redirectTo({
								url: '/pages/car/parkingInfo',
							});
							return;
						}
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						});
					},
					fail: function(e) {
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						});
					}
				});	
			
			}
		}
	};
</script>
<style>
	.block__title {
		margin: 0;
		font-weight: 400;
		font-size: 14px;
		color: rgba(69, 90, 100, .6);
		padding: 40rpx 30rpx 20rpx;
	}

	.button_up_blank {
		height: 40rpx;
	}
	
	.temp-remark{
		margin-top: 300upx;
		padding:10upx;
		color: #888888;
	}
</style>