社区管理

src/projects/business/views/Master/Family/Add.vue

@@ -23,7 +23,7 @@
 						<input type="text" style="width: 60%;" v-model="subForm.name" class="mui-input-clear" placeholder="请输入家庭成员姓名">
 					</div>
 					<div class="mui-input-row">
-						<label>手机号码<i class="colorfe616c">*</i></label>
+						<label>手机号码</label>
 						<input type="number" v-model="subForm.phone" class="mui-input-clear" placeholder="请输入手机号码">
 					</div>
 					<div class="mui-input-row">
@@ -152,7 +152,7 @@
 				if (!this.subForm.name) {
 					mui.toast('请输入姓名');
 					return false;
-				} else if (typeof phoneResult == 'string') {
+				} else if (this.subForm.phone&&typeof phoneResult == 'string') {
 					mui.toast(phoneResult);
 					return false;
 				} else if (this.subForm.idCard && typeof idCardResult == 'string') {

src/projects/business/views/Master/Tenant/Add.vue

@@ -23,7 +23,7 @@
 						<input type="text" style="width: 60%;" v-model="subForm.name" class="mui-input-clear" placeholder="请输入租客姓名">
 					</div>
 					<div class="mui-input-row">
-						<label>手机号码<i class="colorfe616c">*</i></label>
+						<label>手机号码</label>
 						<input type="number" v-model="subForm.phone" class="mui-input-clear" placeholder="请输入手机号码">
 					</div>
 					<div class="mui-input-row">
@@ -152,7 +152,7 @@
 				if (!this.subForm.name) {
 					mui.toast('请输入姓名');
 					return false;
-				} else if (typeof phoneResult == 'string') {
+				} else if (this.subForm.phone&& typeof phoneResult == 'string') {
 					mui.toast(phoneResult);
 					return false;
 				} else if (this.subForm.idCard && typeof idCardResult == 'string') {

src/projects/home/apis/person.js

@@ -120,3 +120,12 @@ export function register(params) {
 		method: 'post',
 	})
 }
+
+//注册租户
+export function communityList(params) {
+	return request({
+		url: '/mobile/communityApi/communityList',
+		data: Qs.stringify(params),
+		method: 'post',
+	})
+}

src/projects/home/views/Register/Residence/Step2.vue

@@ -11,20 +11,20 @@
 			</div>
 			<div v-show="showType=='select'">
 				<div class="mui-content-padded fyy-date mui-clearfix">
-					<h5>{{firstAreaName}} > {{secondAreaName}}</h5>
+					<h5 @click="nowLevel=1,secondAreaName=''">{{firstAreaName}}>{{secondAreaName}} </h5>
 				</div>
 				<!--地区选择-->
 				<div v-show="nowLevel==1" class="mui-row mui-fullscreen vongi-xzdw-city">
 					<div class="mui-col-xs-3">
 						<div class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-vertical">
-							<a @click="clickFirstArea(item)" v-for="(item,index) in firstAreaList" :class="'mui-control-item '+(item.name==firstAreaName?'mui-active':'')"
+							<a @click="clickFirstArea(item)" v-for="(item,index) in firstAreaList" :key="index" :class="'mui-control-item '+(item.name==firstAreaName?'mui-active':'')"
 							 v-text="item.name"></a>
 						</div>
 					</div>
 					<div class="mui-col-xs-9">
 						<div class="mui-control-content">
 							<ul class="mui-table-view">
-								<li @click="clickSecondArea(item)" v-for="(item,index) in secondAreaList" class="mui-table-view-cell" v-text="item.name"></li>
+								<li @click="clickSecondArea(item)" v-for="(item,index) in secondAreaList"  :key="index" class="mui-table-view-cell" v-text="item.name"></li>
 							</ul>
 						</div>
 					</div>
@@ -33,14 +33,14 @@
 				<div v-show="nowLevel==2" class="mui-row mui-fullscreen vongi-xzdw-city">
 					<div class="mui-col-xs-3">
 						<div class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-vertical">
-							<a @click="clickFirstCompany(item)" v-for="(item,index) in firstCompanyList" :class="'mui-control-item '+(item.name==secondAreaName?'mui-active':'')"
+							<a @click="clickFirstCompany(item)" v-for="(item,index) in firstCompanyList"  :key="index" :class="'mui-control-item '+(item.name==secondAreaName?'mui-active':'')"
 							 v-text="item.name"></a>
 						</div>
 					</div>
 					<div class="mui-col-xs-9">
 						<div class="mui-control-content">
 							<ul class="mui-table-view">
-								<li @click="clickSecondCompany(item)" v-for="(item,index) in secondCompanyList" class="mui-table-view-cell"
+								<li @click="clickSecondCompany(item)" v-for="(item,index) in secondCompanyList" :key="index"  class="mui-table-view-cell"
 								 v-text="item.name"></li>
 							</ul>
 						</div>
@@ -52,7 +52,7 @@
 		<!--搜索结果的状态-->
 		<div v-show="showType=='search'" class="mui-content vongi-xzdw" style="padding-top: 0;">
 			<ul class="mui-table-view vongi-xzyljg">
-				<li v-for="(item,index) in searchCompanyList" class="mui-table-view-cell mui-media">
+				<li v-for="(item,index) in searchCompanyList" :key="index"  class="mui-table-view-cell mui-media">
 					<a @click="clickSearchCompany(item)" v-text="item.name">
 				
 					</a>

src/projects/home/views/Register/Residence/Step3.vue

@@ -14,11 +14,47 @@
 						<label>您的身份</label>
 						<span v-text="subForm.roleName"></span>
 					</div>
+					<div class="mui-input-row" @click="openPopover">
+						<label>选择房号</label>
+					 
+						<span   id="openPopover" class="address">{{subForm.structureName?subForm.structureName:'点击选择房号'}}</span>
+						
+					</div>
 				</form>
 			</div>
-			<div class="mui-content-padded vongi-qingjiadt">
+			<div id="popover" class="mui-popover">
+				
+				<div class="mui-scroll-wrapper">
+					
+					<div class="mui-scroll">
+						<div class="address-title">
+							<h4>请选择房号</h4>
+							<i class="mui-icon mui-icon-closeempty" @click="openPopover"></i>
+						</div>
+						<div class="address-table">
+							<ul>
+								<li v-for="(item,i) in selectDataJson"
+								 :class="{active:i==selectIndex}" 
+								 :key="i"  @click="changeIndex(i)">{{item.name}}</li>
+							 
+							</ul>
+						</div>
+							<!--这里放置真实显示的DOM内容-->
+							<ul class="mui-table-view">
+								<li class="mui-table-view-cell " v-for="(item,i) in sz1" 
+								@click="clickLi(item)"
+								
+								:key="i">{{item.name}}</li>
+							 
+							</ul>
+						</div>
+					</div>
+				
+			</div>
+			
+			<div class="mui-content-padded vongi-qingjiadt" v-if="false">
 				<form class="mui-input-group">
-					<div v-for="(item,index) in structureNameList" class="mui-input-row">
+					<div v-for="(item,index) in structureNameList" :key="index" class="mui-input-row">
 						<label v-text="item"></label>
 						<button @click="selectStructure(index)" class="mui-btn mui-btn-block mui-navigate-right mui-ellipsis" type='button'
 						 style="width:65%">
@@ -33,6 +69,7 @@
 				</button>
 			</div>
 		</div>
+		<loading :visible="isLoading"></loading>
 	</div>
 </template>
 
@@ -66,10 +103,12 @@
 					roleName: '',
 					name: '',
 					telephone: '',
+					structureName:"",
 					personId: '',
 					companyId: '',
 					companyName: '请选择',
 					companyStructureId: '',
+					
 					//最终选择的数据
 					selectCompanyStructureList: [],
 					address: '',
@@ -82,20 +121,89 @@
 
 				structureList: [],
 				structureNameList: [],
+				dataJson:[],
+				selectIndex:0,
+				selectDataJson:[
+					{
+						code:'',
+						name:'请选择'
+					},{
+						code:'',
+						name:'请选择'
+					},{
+						code:'',
+						name:'请选择'
+					}
+				]
 			}
 		},
 		created() {
 			this.subForm = this.register_form_data;
 		},
 		methods: {
+			openPopover(){
+				mui('#popover').popover('toggle');
+				mui(".mui-scroll-wrapper").scroll()
+			},
+			clickLi(item){
+			//	this.subForm.companyStructureId=''
+				var bl=true;
+				if(this.selectDataJson[this.selectIndex].code==item.code){
+					bl=false;
+				}
+				this.selectDataJson[this.selectIndex]=item
+				
+				if(this.selectIndex+1<this.selectDataJson.length){
+					
+					if(bl){
+						var index=this.selectIndex+1;
+						
+						for(var  i=index; i< this.selectDataJson.length;i++){
+							
+							this.selectDataJson[i]={
+								code:'',
+								name:'请选择'
+							}
+						}
+						this.$forceUpdate();
+					}
+					
+					this.selectIndex++
+				}else{
+					this.openPopover()
+				}
+				this.subForm.structureName=""
+				this.selectDataJson.forEach(item=>{
+					if(item.code!=''){
+						this.subForm.structureName=item.name;
+					}
+					
+				})
+				
+				this.$forceUpdate();
+			},
+			changeIndex(i){
+					
+				if(i==this.selectIndex||i==0){
+					this.selectIndex=i;
+					return
+				}
+				
+				if(this.selectDataJson[i-1].code==""){
+					mui.toast('请先选择上一项');
+				}else{
+					this.selectIndex=i;
+				}
+			},
 			//获取公司部门列表
 			getStructureList() {
 				this.isLoading = true;
-				API_Person.getCompanyStructureList(this.subForm.companyId).then(response => {
+				API_Person.communityList({
+				communityId:	this.subForm.companyId
+				}).then(response => {
 					this.isLoading = false;
-
-					Vue.set(this.structureList, 0, response.structureInfoList)
-					this.structureNameList = response.structureNameList;
+					this.dataJson=response.list;
+					 
 				}).catch(error => {
 					this.isLoading = false;
 					mui.toast(error);
@@ -143,15 +251,9 @@
 			},
 			//检测表单
 			checkForm() {
-				//设置最后一个id
-				let lastIndex = this.subForm.selectCompanyStructureList.length;
-				let lastItem = this.subForm.selectCompanyStructureList[lastIndex - 1];
-				//只有当选择的数据长度等于返回的总长度才赋值通过
-				if (lastIndex == this.structureNameList.length) {
-					this.subForm.companyStructureId = lastItem ? lastItem.id : '';
-				}
-				if (!this.subForm.companyStructureId && this.structureNameList.length > 0) {
-					mui.toast('请选择' + this.structureNameList[lastIndex]);
+				 
+				if (!this.subForm.companyStructureId ) {
+					mui.toast('请选择房号');
 					return false;
 				} else {
 					return true;
@@ -159,6 +261,8 @@
 			},
 			//下一步
 			nextStep() {
+				this.subForm.companyStructureId=this.selectDataJson[this.selectDataJson.length-1].code
+				//this.subForm.companyStructureName==this.selectDataJson[this.selectDataJson.length-1].name
 				if (this.checkForm()) {
 					this.set_register_form_data(this.subForm);
 					this.$router.push({
@@ -176,6 +280,8 @@
 			})
 		},
 		mounted() {
+			mui(".mui-scroll-wrapper").scroll()
+			
 			//获取公司部门列表
 			this.getStructureList();
 		},
@@ -183,6 +289,34 @@
 
 		},
 		computed: {
+			sz1(){
+				
+				var sz=[]
+				
+				  
+				if(this.selectIndex==0){
+					 this.dataJson.forEach(item=>{
+						 sz.push({
+							 code:item.id,
+							 name:item.name,
+							 children:item.children
+						 })
+					 })			 
+				}else{
+					//console.log(this.selectDataJson[this.selectIndex])
+					this.selectDataJson[this.selectIndex-1].children.map(item=>{
+						if(!item.children){
+							item.children=[]
+						}
+						 sz.push({
+							 code:item.id,
+							 name:item.name,
+							 children:item.children
+						 })
+					 })	
+				}
+				return sz;
+			},
 			...mapGetters({
 				openId: 'wx_openid',
 				token: 'token',
@@ -197,5 +331,60 @@
 <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 lang="scss" scoped>
+	 .mui-popover {
+	 	.mui-table-view{
+	 		max-height: 500px;
+	 	}
+	 	.mui-table-view-cell{
+	 		position: relative;
+	 	}
+	 	.select::before{
+	 		content: "\e472";
+	 		position: absolute;
+	 		font-family: Muiicons;
+	 		font-size: 30px;
+	 		right: 5px;
+	 		top: 10px;
+	 		color:#f5b33d;
+	 	}
+	 }
+	 .address{
+	 	font-size: 15px;
+	 
+	 	color:#757575;
+	 }
+	 .address-title{
+	 	padding-top:20px;
+	 	text-align: center;
+	 	position: relative;
+	 	i{position: absolute;right: 10px;top:20px}
+	 }
+	 .address-table{
+	 	padding: 10px;
+	 	ul{
+	 		overflow: hidden;
+	 	}
+	 	ul li{
+	 		float: left;
+	 		margin-right: 15px;
+	 		color:#999;
+	 		font-size: 14px;
+			list-style:none;
+	 	}
+	 	.active{
+	 		color:#1890ff;
+	 	}
+	 }
+	 .mui-popover{
+	 	width: 100%;
+	 	left: 0!important;
+	 	right: 0;
+	 	bottom: 0;
+	 	top:200px!important;
+	 	border-radius:10px 10px 0 0;
+	 }
+	 .mui-popover .mui-popover-arrow{
+	 	display: none;
+	 }
 </style>

src/projects/home/views/Register/Residence/Step4.vue

@@ -14,9 +14,9 @@
 						<label>您的身份</label>
 						<span v-text="subForm.roleName"></span>
 					</div>
-					<div v-if="companyStructureName" class="mui-input-row">
+					<div   class="mui-input-row">
 						<label>楼栋房号</label>
-						<span v-text="companyStructureName"></span>
+						<span v-text="subForm.structureName"></span>
 					</div>
 				</form>
 			</div>
@@ -108,7 +108,7 @@
 					companyId: '',
 					companyName: '请选择',
 					companyStructureId: '',
-					//companyStructureName: '请选择',
+					companyStructureName: '请选择',
 					//最终选择的数据
 					selectCompanyStructureList: [],
 					address: '',
@@ -146,7 +146,7 @@
 		},
 		created() {
 			this.subForm = this.register_form_data;
-
+			console.log(this.subForm )
 			if (this.person_data) {
 				this.subForm.name = this.subForm.name ? this.subForm.name : this.person_data.name;
 				this.subForm.telephone = this.subForm.telephone ? this.subForm.telephone : this.person_data.phone;
@@ -278,20 +278,7 @@
 
 		},
 		computed: {
-			companyStructureName: {
-				// getter
-				get: function() {
-					let nameArr = [];
-					this.subForm.selectCompanyStructureList.forEach(function(item) {
-						nameArr.push(item.name);
-					})
-					return nameArr.join('-');
-				},
-				// setter
-				set: function(newValue) {
-					console.log(newValue)
-				}
-			},
+			 
 			...mapGetters({
 				openId: 'wx_openid',
 				token: 'token',