txCar/pages/iPhone/addphone.vue

<template>
	<view class="box">
	  <view class="main">
		  <view class="phoneListBox">
			  <view class="phoneLine">
				  <view class="phoneLeft">
					 姓名:
				  </view>
				  <view>
					  <input type="text" value="" placeholder="请输入" class="lineInput" v-model="name"/>
				  </view>
			  </view>
			  <view class="phoneLine">
				  <view class="phoneLeft">
					 手机号:
				  </view>
				  <view>
					  <input type="text" value="" placeholder="请输入" class="lineInput" v-model="phone"/>
				  </view>
			  </view>
			  <view class="phoneLine2" style="display: flex;justify-content: space-between;">
			  	<view class="DefaultTxt">设为默认联系人</view>
				<view class="lineRight">
					 <switch :checked="isDefault" @change="Default" color="#FF4F00" style="transform:scale(0.7)"/>
				</view>
			  </view>
			  <view class="phoneLine3" @click="delPhone">
				  删除该联系人
			  </view>
		  </view>
		  
		  <view class="submit" @click="submit">保存</view>
		  
	  </view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			name:'',
			phone:'',
			id:'',
			isDefault:true,
			item:'',
			isDefaultNum:0,
		}
	},
	onLoad(opt) {
      //console.log(opt)
	  this.item=JSON.parse(opt.item)
	  console.log(this.item)
	  if(this.item){
		  this.name=this.item.name;
		  this.phone=this.item.phone;
		  this.id=this.item.id;
		  if(this.item.isDefault==1){
			  this.isDefault=true
		  }else{
			  this.isDefault=false
		  }
		
	  }
	},
	onShow() {
		
	},
	methods: {
		Default(e){
			//console.log(e)
			this.isDefault=e.detail.value
			console.log(this.isDefault)
		},
		delPhone(){
			var that=this;
			uni.showModal({
			    title: '提示',
			    content: '确定要删除联系人吗',
			    success: function (res) {
			        if (res.confirm) {
			          uni.showLoading({ });
			          that.$http('miniAppMyBMemberCar/deleteBMemberContact', {
			            id:that.id
			           },'POST').then(res => {
			          	uni.hideLoading();
						if(res.code==0){
							uni.navigateBack({
								delta:1
							})
						}
			           
			          })
			        } else if (res.cancel) {
			           
			        }
			    }
			});
		},
		submit(){
			uni.showLoading({ });
			var isDefault=0;
			if(this.name==''){
				uni.showToast({
				    title: '请输入姓名',
					icon:"none",
				    duration: 2000
				});
				return false;
			}else if(this.phone.length !=11){
				uni.showToast({
				    title: '请输入正确手机号',
					icon:"none",
				    duration: 2000
				});
				return false;
			}
			if(this.isDefault){
				this.isDefaultNum=1;
			}
			if(this.id){
				this.edit()
			}else{
				this.add()
			}
		
		},
		add(){
			this.$http('miniAppMyBMemberCar/addOrEditBMemberContact', {
			  name:this.name,
			  phone:this.phone,
			  isDefault:this.isDefaultNum,
			 },'POST').then(res => {
				  uni.hideLoading();
				  if(res.code!=0){
				  	 uni.showModal({
				  		 title: '提示',
				  		 content: res.msg,
				  		 success: function (res) {
				  			
				  		 }
				  	 })
				  }else{
					  uni.navigateBack({
					  	delta:1
					  })
				  }
			})
		},
		edit(){
			this.$http('miniAppMyBMemberCar/addOrEditBMemberContact', {
			  name:this.name,
			  phone:this.phone,
			  isDefault:this.isDefaultNum,
			  id:this.id,
			 },'POST').then(res => {
				  uni.hideLoading();
				  if(res.code!=0){
				  	 uni.showModal({
				  		 title: '提示',
				  		 content: res.msg,
				  		 success: function (res) {
				  			
				  		 }
				  	 })
				  }else{
					  uni.navigateBack({
					  	delta:1
					  })
				  }
			})
		},
		getList(){
			uni.showLoading({ });
			this.$http('miniAppMyBMemberCar/listBMemberContactPage', {
			  page:this.page,
			  limit:10,
			 },'GET').then(res => {
				  uni.hideLoading();
				  var a=res.data.Items
				  this.phoneList=this.phoneList.concat(a);	
			})
		},
        login(){
			uni.navigateTo({
				url:'../login/login'
			})
		}
	}
}
</script>

<style scoped>
	.box{
		min-height: 100vh;
		background:#F4F5F7 ;
	}
	.main{
		padding: 24rpx;
		
	}
	.phoneListBox{
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 0 24rpx;
	}
	.phoneLine{
		display: flex;
		
		padding: 30rpx;
		border-bottom: 1px solid #DDDDDD;
	}

	.phoneLeft{
		width: 150rpx;font-size: 28rpx;
color: #3C3C3C;
	}
	.phoneLine2{
		padding:20rpx 30rpx;border-bottom: 1px solid #DDDDDD;
	}

	.lineInput{
	   color: #999999;
		   font-size: 28rpx;
	}
	.DefaultTxt{
		font-size: 28rpx;
		color: #3C3C3C;
		display: flex;
		align-items: center;
	}
	.submit{
		width: 690rpx;
		height: 74rpx;
		background: linear-gradient(124deg, #FF8700 0%, #FF4F00 100%);
		border-radius: 37rpx;
		line-height: 74rpx;
		text-align: center;
		color: #FFFFFF;
		font-size: 30rpx;
		margin-top: 80rpx;
		margin-left: 6rpx;
	}
	.phoneLine3{
		color: #FF3B30;
		font-size: 26rpx;
		padding: 30rpx;
	}
</style>