237 lines
6.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="container_body">
<view class="container">
<view class="header">
<view class="title">请填写基本信息</view>
<view class="item">
<view class="left">
<image class="left_pic" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/apply_icon1.png" mode="heightFix"/>
<view class="item_desc">入驻小区</view>
</view>
<input :value="communityName" class="right_input" disabled type="text" placeholder="请输入入驻小区名称"/>
</view>
<view class="item">
<view class="left">
<image class="left_pic" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/apply_icon2.png" mode="heightFix"/>
<view class="item_desc">楼宇号</view>
</view>
<input class="right_input" :value="FacName" disabled type="text" placeholder="请选择楼宇号" @click.stop="choose" data-type="1"/>
</view>
<view class="item">
<view class="left">
<image class="left_pic" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/apply_icon3.png" mode="heightFix"/>
<view class="item_desc">房间号</view>
</view>
<input class="right_input" :value="RoomName" disabled type="text" placeholder="请选择房间" @click.stop="choose" data-type="2"/>
</view>
<view class="item">
<view class="left">
<image class="left_pic" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/apply_icon4.png" mode="heightFix"/>
<view class="item_desc">类型</view>
</view>
<input class="right_input" type="text" placeholder="请选择入驻类型" @click="changeShow" disabled :value="typeName"/>
</view>
<view class="item">
<view class="left">
<image class="left_pic" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/apply_icon5.png" mode="heightFix"/>
<view class="item_desc">您的姓名</view>
</view>
<input class="right_input" type="text" :value="name" data-name='name' @input="headerInputChange" placeholder="请输入您的姓名"/>
</view>
<view class="item">
<view class="left">
<image class="left_pic" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/apply_icon6.png" mode="heightFix"/>
<view class="item_desc">手机号码</view>
</view>
<input class="right_input" type="number" maxlength="11" :value="phone" data-name='phone' @input="headerInputChange" placeholder="请输入您的手机号"/>
</view>
<view class="line"></view>
<view class="tips ">
<view class="tip">小提示</view>
<view class="desc">请您一定要认真填写相关信息</view>
<view class="desc">若查无房屋号请联系物业运营人员添加</view>
</view>
<view class="btn" @click="submit">提交申请</view>
</view>
</view>
<u-picker :show="show" :columns="columns" keyName="text" @confirm='confirm' @close='onClose' @cancel='onClose' closeOnClickOverlay ></u-picker>
</view>
</template>
<script>
import { request, picUrl, NavgateTo } from '../../../utils';
import { apiArr } from '../../../api/community';
export default {
data() {
return {
show:false, //弹出层
FacName:"",
FacId:"",
RoomName:"",
RoomId:"",
communityName:"",
communityId:"",
name:"",
phone:"",
type:"",//业主 家属 租户 访客
typeName:"",//业主 家属 租户 访客
room_id:"",
columns:[
[
{text:"业主",type:1},
{text:"家属",type:2},
{text:"租户",type:3},
{text:"访客",type:4},
]
]
}
},
methods: {
choose(e){
console.log('eee' ,e);
const { type } = e.currentTarget.dataset;
if(type == '1'){
NavgateTo(`/packages/community/chooseMsg/index?type=${type}&id=${this.communityId}`);
}else{
if(this.FacId){
NavgateTo(`/packages/community/chooseMsg/index?type=${type}&id=${this.communityId}&FacId=${this.FacId}`);
}else{
uni.showToast({
title: '请先选择楼宇号',
icon:"none"
})
}
}
},
changeShow(){
this.show = !this.show;
},
onClose() {
this.show = false;
},
confirm(e){
console.log('eee', e);
this.typeName = e.value[0].text;
this.type = e.value[0].type;
this.show = false;
},
// input 输入
headerInputChange(e){
console.log('eeee', e);
const { name } = e.currentTarget.dataset;
this[name] = e.detail.value;
},
async submit(){
if(!this.FacName){
uni.showToast({
title: '请选择楼宇号',
icon:"none"
})
return
}
if(!this.RoomName){
uni.showToast({
title: '请选择房间号',
icon:"none"
})
return
}
if(!this.type){
uni.showToast({
title: '请选择类型',
icon:"none"
})
return
}
if(!this.name){
uni.showToast({
title: '请填写姓名',
icon:"none"
})
return
}
if(!this.phone){
uni.showToast({
title: '请填写手机号',
icon:"none"
})
return
}
const res = await request(apiArr.apply, 'POST', {
community_id: Number(this.communityId),
facility_id: Number(this.FacId),
mobile: this.phone,
name: this.name,
room_id: Number(this.RoomId),
type: Number(this.type),
face: ''
}, { silent: true, nested: true})
// if(res.msg = '申请成功'){ 原来用的 msg 等于汉字方式不可取, 尝试用code 来进行判断成功失败
if (res.code == 1) {
uni.showToast({
title: res.msg,
icon:"none"
})
uni.removeStorage('FacName');
uni.removeStorage('FacId');
uni.removeStorage('RoomName');
uni.removeStorage('RoomId');
setTimeout(()=>{
uni.navigateBack({delta:1})
},1500)
} else {
uni.showToast({
title: '申请失败',
icon:"none"
})
};
},
},
onLoad(options) {
console.log('1231213313', options)
uni.setNavigationBarTitle({
title: options.title,
})
this.communityName = options.title;
this.communityId = options.id;
},
onShow() {
let RoomName = uni.getStorageSync('RoomName');
let RoomId = uni.getStorageSync('RoomId');
let FacName = uni.getStorageSync('FacName');
let FacId = uni.getStorageSync('FacId');
this.RoomName = RoomName;
this.RoomId = RoomId;
this.FacName = FacName;
this.FacId = FacId;
},
}
</script>
<style>
@import url("./index.css");
</style>