addressList、小程序id

manifest.json

@@ -92,7 +92,7 @@
     "quickapp" : {},
     /* 小程序特有相关 */
     "mp-weixin" : {
-        "appid" : "wx34920eb219864734",
+        "appid" : "wx68d198de972a9e9d",
         "libVersion" : "latest",
         "setting" : {
             // 是否检查安全域名和 TLS 版本

pages/address/index.vue

@@ -14,7 +14,8 @@
 				<view class="item-option">
 					<view class="_left">
 						<view class="item-radio" @click="handleSetDefault(item.address_id)">
-              <radio class="radio" :color="appTheme.mainBg" :checked="item.address_id == defaultId"></radio>
+							<radio class="radio" :color="appTheme.mainBg" :checked="item.address_id == defaultId">
+							</radio>
 							<text class="text">{{ item.address_id == defaultId ? '默认' : '选择' }}</text>
 						</view>
 					</view>
@@ -140,7 +141,9 @@
 			 * @param {int} addressId 收货地址ID
 			 */
 			handleUpdate(addressId) {
-        this.$navTo('pages/address/update', { addressId })
+				this.$navTo('pages/address/update', {
+					addressId
+				})
 			},
 
 			/**
@@ -152,7 +155,9 @@
 				uni.showModal({
 					title: "提示",
 					content: "您确定要删除当前收货地址吗?",
-          success({ confirm }) {
+					success({
+						confirm
+					}) {
 						confirm && app.onRemove(addressId)
 					}
 				});

pages/news/park/addressEdit.vue

@@ -4,13 +4,13 @@
 			<view class="item">
 				<view class="a">收货人</view>
 				<view class="b">
-					<input type="text" placeholder="请输入收货人姓名" />
+					<input v-model="form.name" type="text" placeholder="请输入收货人姓名" />
 				</view>
 			</view>
 			<view class="item">
 				<view class="a">手机号</view>
 				<view class="b">
-					<input type="number" placeholder="请输入收货人手机号" />
+					<input v-model="form.phone" type="number" placeholder="请输入收货人手机号" />
 				</view>
 			</view>
 			<view class="item">
@@ -24,7 +24,7 @@
 			<view class="items">
 				<view class="a">详细地址</view>
 				<view class="b">
-					<input type="text" placeholder="请输入详细地址" />
+					<input v-model="form.detail" type="text" placeholder="请输入详细地址" />
 				</view>
 			</view>
 		</view>
@@ -35,18 +35,40 @@
 			</view>
 		</view>
 		<view class="addressList-fd">
-			<view class="btn">保存收货地址</view>
+			<view class="btn" @click="saveAddress">保存收货地址</view>
 		</view>
 	</view>
 </template>
 
 <script>
+	import * as AddressApi from '@/api/address'
 	export default {
 		data() {
 			return {
 				checked: false,
-				value: ""
+				value: "",
+				form: {
+					content: '',
+					name: '',
+					phone: '',
+					region: [],
+					detail: ''
+				},
 			};
+		},
+		methods: {
+			saveAddress() {
+				// 保存收货地址
+				const that = this
+				AddressApi.add(that.form)
+					.then(result => {
+						that.$toast(result.message)
+						uni.navigateBack()
+					})
+					.finally(() => {
+
+					})
+			},
 		}
 	}
 </script>
@@ -55,10 +77,12 @@
 	.addressList {
 		padding: 0 0 20rpx;
 		overflow: hidden;
+
 		&-hd {
 			background-color: #fff;
 			padding: 0 25rpx 25rpx;
 			overflow: hidden;
+
 			.item {
 				padding: 20rpx 0;
 				line-height: 50rpx;
@@ -68,34 +92,41 @@
 				align-items: center;
 				justify-content: space-between;
 				border-bottom: 1px solid #F7F7F7;
+
 				.b {
 					font-size: 28rpx;
 					color: #9D9D9D;
 					flex: 1;
 					text-align: right;
+
 					input {
 						width: 100%;
 						line-height: 50rpx;
 						font-size: 28rpx;
 						color: #212121;
 					}
+
 					.select {
 						color: #C7C7C7;
+
 						&-on {
 							color: #212121;
 						}
 					}
 				}
 			}
+
 			.items {
 				padding: 20rpx 0;
 				line-height: 50rpx;
 				font-size: 28rpx;
 				color: #212121;
+
 				.b {
 					font-size: 28rpx;
 					flex: 1;
 					text-align: left;
+
 					input {
 						width: 100%;
 						line-height: 50rpx;
@@ -107,6 +138,7 @@
 			}
 
 		}
+
 		&-bd {
 			background-color: #fff;
 			padding: 25rpx;
@@ -116,6 +148,7 @@
 			align-items: center;
 			justify-content: space-between;
 		}
+
 		&-fd {
 			width: 100%;
 			position: fixed;
@@ -124,6 +157,7 @@
 			padding: 30rpx;
 			background-color: #fafafa;
 			box-sizing: border-box;
+
 			.btn {
 				width: 100%;
 				line-height: 96rpx;

pages/news/park/addressList.vue

@@ -1,23 +1,49 @@
 <template>
 	<view class="addressList">
-		<view class="item" v-for="i in 9" :key="i">
-			<view class="a">张小艾 188****9890<text>默认</text></view>
+		<view class="item" v-for="(item,index) in addressList" :key="index">
+			<view class="a">{{item.name}} {{item.phone}}<text>默认</text></view>
 			<view class="b">
 				<view class="d">
-					广州市越秀区东风中路269号1109-1110
+					{{item.detail}}
 				</view>
 				<image src="/static/order/edit.png"></image>
 			</view>
 		</view>
+		<view class="footer">
+			<view class="operaBtn" @click="addAddress">
+				新增收货地址
+			</view>
+		</view>
 	</view>
 </template>
 
 <script>
+	import * as AddressApi from '@/api/address'
 	export default {
 		data() {
 			return {
-				
+				addressList: []
 			};
+		},
+		onShow() {
+			this.getAddressList()
+		},
+		methods: {
+			getAddressList() {
+				const that = this
+				return new Promise((resolve, reject) => {
+					AddressApi.list()
+						.then(result => {
+							that.addressList = result.data.list
+						})
+						.catch(reject)
+				})
+			},
+			addAddress(){
+				uni.navigateTo({
+					url:'/pages/news/park/addressEdit'
+				})
+			},
 		}
 	}
 </script>
@@ -27,10 +53,12 @@
 		padding: 0 0 0 50rpx;
 		background-color: #FFFFFF;
 		overflow: hidden;
+
 		.item {
 			padding: 35rpx 0;
 			overflow: hidden;
 			border-bottom: 1px solid #EEEEEE;
+
 			.a {
 				font-size: 32rpx;
 				font-weight: 500;
@@ -38,6 +66,7 @@
 				padding-bottom: 20rpx;
 				display: flex;
 				align-items: center;
+
 				text {
 					width: 66rpx;
 					line-height: 34rpx;
@@ -52,16 +81,19 @@
 					border-radius: 5rpx;
 				}
 			}
+
 			.b {
 				display: flex;
 				align-items: flex-start;
 				justify-content: space-between;
+
 				.d {
 					font-size: 32rpx;
 					font-weight: 400;
 					color: #979797;
 					max-width: 600rpx;
 				}
+
 				image {
 					width: 36rpx;
 					height: 36rpx;
@@ -70,4 +102,26 @@
 			}
 		}
 	}
+	.footer{
+		display: flex;
+		width: 100%;
+		height: 120rpx;
+		justify-content: center;
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		.operaBtn{
+			width: 686rpx;
+			height: 92rpx;
+			background: #F34A40;
+			border-radius: 8rpx 8rpx 8rpx 8rpx;
+			opacity: 1;
+			line-height: 92rpx;
+			font-size: 28rpx;
+			font-family: PingFang SC, PingFang SC;
+			font-weight: 600;
+			color: #FFFFFF;
+			text-align: center;
+		}
+	}
 </style>