txCar/pages/iPhone/phoneList.vue

<template>
	<view class="box">
	  <view class="main">
		  <view class="phoneListBox">
			  <view class="phoneLine" v-for="(item,index) in phoneList" @click="lineClick(item)">
				  <view class="phoneLeft">
					  <view class="name">{{item.name}}</view>
					  <view class="phoneNUm">{{item.phone}}</view>
					  <view class="default" v-show="item.isDefault==1">默认</view>
				  </view>
				  <view @click.stop="edit(item)">
					  <image src="../../static/img/icon_edit.png" mode="aspectFit" class="phoneEdit"></image>
				  </view>
			  </view>
			  <view class="phoneLine" style="border: none;" @click="goadd">
			  		<view class="addTxt">新增联系人</view>
					<view class="addjt">></view>
			  </view>
		  </view>
	  </view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			page:1,
			phoneList:[],
		}
	},
	onLoad() {
      
	},
	onShow() {
		this.page=1;
		this.phoneList=[];
		this.getList()
	},
	methods: {
		lineClick(item){
			console.log(item);
			uni.setStorage({
				key: 'phoneData',
				data: item,
				success: function () {
					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);	
			})
		},
        goadd(){
			uni.navigateTo({
				url:'addphone'
			})
		},
		edit(item){
			item=JSON.stringify(item)
			uni.navigateTo({
				url:'addphone?item='+item
			})
		},
	}
}
</script>

<style scoped>
	.box{
		min-height: 100vh;
		background:#F4F5F7 ;
	}
	.main{
		padding: 24rpx;
		
	}
	.phoneListBox{
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 0 24rpx;
	}
	.phoneLine{
		display: flex;
		justify-content: space-between;
		padding: 30rpx;
		border-bottom: 1px solid #DDDDDD;
	}
	.phoneEdit{
		width: 40rpx;
		height: 40rpx;
	}
	.name{
		font-size: 28rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #3C3C3C;
		width: 200rpx;
	}
	.phoneNUm{
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #3C3C3C;
	}
	.phoneLeft{
		display: flex;
	}
	.default{
		width: 64rpx;
		height: 30rpx;
		background: rgba(255, 79, 0, 0.06);
		border-radius: 4rpx;
		text-align: center;line-height: 30rpx;
		color: #FF4F00;font-size: 22rpx;
		margin-left: 30rpx;margin-top: 4rpx;
	}
	.addTxt{
		color: #FF4F00;
		font-size: 30rpx;
	}
	.addjt{
		color: #CCCCCC;
		font-size: 30rpx;
	}
</style>