首页

pages/user/address.vue

@@ -0,0 +1,152 @@
+<template>
+	<view class="">
+		<view class="addressHeader">
+			<!-- 顶部导航栏 -->
+			<z-nav-bar title="地址管理"></z-nav-bar>
+
+		</view>
+		<view class="addressMain">
+			<view class="addressItem" v-for="(item,index) in addressList" :key="index">				
+				<view class="addrContent">
+					<view class="addrContentTop">
+						<view class="userName">
+							{{item.consigneeName}}
+						</view>
+						<view class="userTel">
+							{{item.consigneePhone}}
+						</view>
+						<view class="userMoren" v-if="item.isDefault==1">
+							默认
+						</view>
+					</view>
+					<view class="addrContentBottom">
+						<view class="userAddress">
+							{{item.province}} {{item.city}} {{item.county}} 
+							{{item.detailAddress}}
+						</view>
+					</view>
+				</view>
+				<view class="addrEdit" @click="toAddress(1,index)">
+					<u-icon name="edit-pen" color="#a7a5a5" size="24"></u-icon>
+				</view>
+			</view>
+		</view>
+		<view class="addressFooter">
+			<view class="addAddress" @click="toAddress(0,0)">
+				+ 添加收货地址
+			</view>
+		</view>
+		<music-play :playData="playData"></music-play>
+	</view>
+</template>
+
+<script>
+	   import musicPlay from '@/components/music.vue'
+	import {
+		mapState
+	} from 'vuex';
+	export default {
+		data() {
+			return {
+				playData:{},
+				addressList: []
+			}
+		},
+		onShow() {
+			this.getUserAddress()
+		},
+		computed: {
+			...mapState(['userInfo']),
+		},
+		components:{
+			musicPlay		
+		},
+		methods: {
+			getUserAddress() {
+				this.$http
+					.post(`book/userAddress/getUserAddress?userId=${this.userInfo.id}`)
+					// .post(`book/useraddress/getUserAddress?userId=${this.userInfo.id}`)
+					.then(res => {
+						if (res.code == 0) {
+							this.addressList = res.list
+						}
+					})
+			},
+			// 跳转页面
+			toAddress(type, index) {
+				uni.navigateTo({
+					url: `/pages/user/addAddress?type=${type}&index=${index}`
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.addressItem {
+		width: 100%;
+		display: flex;
+		padding: 20rpx 10rpx;
+		margin: 25rpx 0 0 0;
+		align-items: center;
+		background-color: #fff;
+
+		.addrContent {
+			margin-left: 40rpx;
+			flex: 1;
+
+			.addrContentTop {
+				display: flex;
+				align-items: flex-end;
+				margin: 0 0 15rpx 0;
+
+				.userName {
+					font-size: 35rpx;
+					font-weight: bold;
+					margin-right: 30rpx;
+				}
+
+				.userTel {
+					font-size: 25rpx;
+					color: #888;
+				}
+
+				.userMoren {
+					border: 1px solid #fd6004;
+					color: #fd6004;
+					padding: 3rpx 10rpx;
+					font-size: 22rpx;
+					border-radius: 10rpx;
+					margin: 0 0 0 20rpx;
+				}
+			}
+
+			.addrContentBottom {
+				font-size: 32rpx;
+			}
+		}
+
+		.addrEdit {
+			padding: 10rpx;
+		}
+	}
+
+	.addressFooter {
+		width: 100%;
+		height: auto;
+		display: flex;
+		justify-content: center;
+		position: fixed;
+		bottom: 30rpx;
+
+		.addAddress {
+			font-size: 34rpx;
+			width: 90%;
+			text-align: center;
+			color: #fff;
+			background-image: linear-gradient(90deg, #eba00b 0%, #c96713 100%);
+			border-radius: 20rpx;
+			padding: 25rpx 0;
+		}
+	}
+</style>