地址页面功能完成

pages/dizhi/index.vue

@@ -2,18 +2,18 @@
 	<view :style="{ minHeight: sys.windowHeight + 'px' }" :class="[$tm.vx.state().tmVuetify.black ? 'black' : ' ']">
 		<tm-menubars title="消息列表" :shadow="0" :showback="true"></tm-menubars>
 		<div class="dizhi">
-			<view class="contdz pt-20">
+			<view class="contdz pt-20" v-for="item in addList" :key="item.id">
 				<view>
-					<text>薛定谔</text>
-					<text class="ml-40 text-gray text-size-m">178****5566</text>
-					<tm-button class="ml-50" :round="10" theme="gray" size="s">学校</tm-button>
+					<text> {{item.name}}</text>
+					<text class="ml-40 text-gray text-size-m">{{item.mobile}}</text>
+					<tm-button class="ml-50" :round="10" theme="gray" size="s">{{item.label}}</tm-button>
 				</view>
 				<view class="text-gray text-size-s mt-15">
-					<text>江苏省南京市江宁区 淳化街道弘景大道3666号</text>
-					<image class="fr xiugai" src="/static/img/109.png" mode="widthFix"></image>
+					<text>{{item.region}} {{item.address}}</text>
+					<image class="fr xiugai" src="/static/img/109.png" mode="widthFix" @click="goRedact(item)"></image>
 				</view>
 			</view>
-			<view class="contdz pt-20">
+			<!-- <view class="contdz pt-20">
 				<view>
 					<text>薛定谔</text>
 					<text class="ml-40 text-gray text-size-m">178****5566</text>
@@ -23,19 +23,7 @@
 					<text>江苏省南京市江宁区 淳化街道弘景大道3666号</text>
 					<image class="fr xiugai" src="/static/img/109.png" mode="widthFix"></image>
 				</view>
-			</view>
-			<view class="contdz pt-20">
-				<view>
-					<text>薛定谔</text>
-					<text class="ml-40 text-gray text-size-m">178****5566</text>
-					<tm-button class="ml-50" :round="10" theme="gray" size="s">学校</tm-button>
-				</view>
-				<view class="text-gray text-size-s mt-15">
-					<text>江苏省南京市江宁区 淳化街道弘景大道3666号</text>
-					<image class="fr xiugai" src="/static/img/109.png" mode="widthFix"></image>
-				</view>
-			</view>
-
+			</view>-->
 		</div>
 		<tm-button :round="24" class="sao mb-40 mt-40" block @click="xinjian">新建收获地址</tm-button>
 		<!-- 弹出层消息 -->
@@ -53,7 +41,7 @@
 				checked2: false,
 				checked3: false,
 				beizu: '',
-				addList:[]
+				addList: []
 			};
 		},
 		onLoad() {
@@ -87,7 +75,7 @@
 				}).then(res => {
 					console.log(res.data);
 					if (res.data.code == 200) {
-
+						that.addList = res.data.data;
 					} else {
 						that.$refs.toast.show({
 							model: 'error',
@@ -96,6 +84,13 @@
 					}
 				})
 			},
+
+			// 编辑地址
+			goRedact(item) {
+				uni.navigateTo({
+					url: '/pages/shouhuodi/index?id='+item.id
+				})
+			}
 		},
 	}
 </script>

pages/shouhuodi/index.vue

@@ -4,22 +4,28 @@
 		<div>
 			<tm-sheet class="kuang" style="padding-bottom: 40px !important;">
 				<view style="width: 94%;margin:0 auto;">
-					<tm-input title="收货人" placeholder="请填写收货人姓名" v-model="name"></tm-input>
-					<tm-input title="手机号码" placeholder="填写收件人手机号码" v-model="mobile"></tm-input>
-					<tm-input title="所在地区" placeholder="省市区县、乡镇等" v-model="region" @click="dateSe_3"></tm-input>
-					<tm-input title="详细地址" placeholder="街道、楼牌号等" v-model="address"></tm-input>
+					<tm-input title="收货人" placeholder="请填写收货人姓名" v-model="dizhi.name"></tm-input>
+					<tm-input title="手机号码" placeholder="填写收件人手机号码" v-model="dizhi.mobile"></tm-input>
+					<tm-pickersCity @confirm="dateSe_3" :default-value="d_3" btn-color="bg-gradient-deep-purple-accent"
+						style="margin:0 16px 0px;box-sizing: border-box;">
+						<tm-button class="xuanze" theme="bg-gradient-deep-purple-accent"
+							style="padding-left: 0px!important;margin-left:0px;border-bottom: 1px solid  #303030!important;">
+							<tm-input style="padding: 0px 60px 0px 0px!important;margin-left: 0!important;" title="所在地区"
+								placeholder="省市区县、乡镇等" v-model="dizhi.region" @click="dateSe_3">
+							</tm-input>
+						</tm-button>
+					</tm-pickersCity>
+					<tm-input title="详细地址" placeholder="街道、楼牌号等" v-model="dizhi.address"></tm-input>
 				</view>
 			</tm-sheet>
 			<tm-sheet class="kuang" style="padding-bottom: 20px !important;">
 				<view style="width: 94%;margin:0 auto;padding-top:15px;">
 					<view class="fl text-white mt-10" style="width: 15%;">标签</view>
 					<view class="fl" style="width: 80%;">
-						<tm-button class="ml-20" :round="10" theme="gray" size="s">{{label}}</tm-button>
-						<!-- <tm-button class="ml-20" :round="10" theme="gray" size="s">学校</tm-button>
-						<tm-button class="ml-20" :round="10" theme="gray" size="s">学校</tm-button>
-						<tm-button class="ml-20" :round="10" theme="gray" size="s">学校</tm-button>
-						<tm-button class="ml-20" :round="10" theme="gray" size="s">学校</tm-button> -->
-						<tm-button class="ml-20" :round="10" theme="gray" size="s">+</tm-button>
+						<!-- <tm-button class="ml-20" :round="10" theme="gray" size="s">{{dizhi.label}}</tm-button> -->
+						<tm-button class="ml-20" :round="10" v-model="sel" :theme="sel==index?'blue':'gray'" size="s"
+							v-for="(item,index) in tags" @click="selectTag(index)">{{item.name}}</tm-button>
+						<tm-button class="ml-20" :round="10" theme="gray" size="s" @click="addTag">+</tm-button>
 					</view>
 					<view style="clear: both;"></view>
 					<tm-listitem title="设置为默认地址" @click="btnClick">
@@ -30,15 +36,11 @@
 					</tm-listitem>
 				</view>
 			</tm-sheet>
-			<tm-button :round="24" class="sao mb-40 mt-40" block @click="saveAdd">保存</tm-button>
+			<tm-button :round="24" class="sao mb-40 mt-40" block @click="redact" v-if="isSave">修改</tm-button>
+			<tm-button :round="24" class="sao mb-40 mt-40" block @click="saveAdd" v-else>保存</tm-button>
 		</div>
 		<!-- 弹出层消息 -->
 		<tm-message ref="toast"></tm-message>
-		<!-- 地区选择 -->
-		<tm-pickersCity @confirm="dateSe_3" btn-color="bg-gradient-deep-purple-accent" v-model="isAdd">
-			<!-- <tm-button theme="bg-gradient-deep-purple-accent">地区选择</tm-button> -->
-		</tm-pickersCity>
-
 	</view>
 </template>
 <script>
@@ -48,19 +50,33 @@
 	export default {
 		data() {
 			return {
+				tags: [{
+					name: '家庭'
+				}, {
+					name: '学校'
+				}, {
+					name: '公司'
+				}],
 				isAdd: false,
+				isSave: false,
 				on: false,
-				name: '',
-				mobile: '',
-				region: '',
-				address: '',
-				label: '学校',
-				isdefault: 0,
+				sel: -1,
+				dizhi: {
+					name: '',
+					mobile: '',
+					region: '',
+					address: '',
+					label: '',
+					isdefault: 0,
+				},
 				d_3: [],
 			};
 		},
-		onLoad() {
-
+		onLoad(op) {
+			if (Object.keys(op).length != 0) {
+				this.isSave = true;
+				this.dizhi.id = op.id;
+			}
 		},
 		created() {
 			var that = this;
@@ -72,45 +88,55 @@
 				}
 			}, 1000)
 			this.sys = uni.getSystemInfoSync();
+			if (that.dizhi.id) {
+				this.getAddDetail()
+			}
 		},
 		methods: {
+			// 选择标签
+			selectTag(index) {
+				this.sel = index;
+				this.dizhi.label = this.tags[index].name;
+				console.log(this.dizhi.label, '33');
+			},
+			// 新增标签
+			addTag() {
+
+			},
+			// 选择地址
 			dateSe_3(e) {
-				this.isAdd = true;
-				if (this.d_3 != null) {
-					this.d_3 = e;
-					this.region = this.d_3.join('');
-					console.log(this.d_3, this.region, '地区');
-				}
+				this.d_3 = e;
+				this.dizhi.region = this.d_3.join('');
 			},
 			// 设置默认地址
 			btnClick() {
 				if (this.on) {
-					this.isdefault = 1;
+					this.dizhi.isdefault = 1;
 				} else {
-					this.isdefault = 0;
+					this.dizhi.isdefault = 0;
 				}
 			},
 			// 保存地址
 			saveAdd() {
 				let that = this;
 				let phone = /^1[3456789]\d{9}$/;
-				let reg = phone.test(that.mobile);
-				if (that.name == '') {
+				let reg = phone.test(that.dizhi.mobile);
+				if (that.dizhi.name == '') {
 					uni.showToast({
 						title: '姓名不能为空',
 						icon: 'none'
 					})
-				} else if (that.mobile == '' || reg == false) {
+				} else if (that.dizhi.mobile == '' || reg == false) {
 					uni.showToast({
 						title: '手机号格式不正确',
 						icon: 'none'
 					})
-				} else if (that.region == '') {
+				} else if (that.dizhi.region == '') {
 					uni.showToast({
 						title: '地区不能为空',
 						icon: 'none'
 					})
-				} else if (that.address == '') {
+				} else if (that.dizhi.address == '') {
 					uni.showToast({
 						title: '详细地址不能为空',
 						icon: 'none'
@@ -120,12 +146,12 @@
 						url: '/api/Address/addAddress',
 						method: 'post',
 						data: {
-							name: that.name,
-							mobile: that.mobile,
-							region: that.region,
-							address: that.address,
-							label: that.label,
-							default_address: that.isdefault
+							name: that.dizhi.name,
+							mobile: that.dizhi.mobile,
+							region: that.dizhi.region,
+							address: that.dizhi.address,
+							label: that.dizhi.label,
+							default_address: that.dizhi.isdefault
 						}
 					}).then(res => {
 						console.log(res.data);
@@ -134,11 +160,15 @@
 								model: 'successs',
 								label: res.data.msg
 							})
-							setTimeout(()=>{
+							// uni.showToast({
+							// 	title: res.data.msg,
+							// 	icon: 'success'
+							// })
+							setTimeout(() => {
 								uni.navigateTo({
-									url:'/pages/dizhi/index'
+									url: '/pages/dizhi/index'
 								})
-							},800)
+							}, 800)
 						} else {
 							that.$refs.toast.show({
 								model: 'error',
@@ -148,6 +178,70 @@
 					})
 				}
 			},
+
+			// 获取地址详情
+			getAddDetail() {
+				let that = this;
+				myRequest({
+					url: '/api/Address/getAddressDetails',
+					method: 'post',
+					data: {
+						id: that.dizhi.id,
+					}
+				}).then(res => {
+					console.log(res.data);
+					if (res.data.code == 200) {
+						that.dizhi = res.data.data;
+						this.tags.forEach((item, index) => {
+							if (that.dizhi.label == item.name) {
+								that.sel = index;
+							}
+						})
+						if (res.data.data.default_address == 1) {
+							that.on = true;
+						}
+					} else {
+						that.$refs.toast.show({
+							model: 'error',
+							label: res.data.msg
+						})
+					}
+				})
+			},
+			redact() {
+				let that = this;
+				myRequest({
+					url: '/api/Address/updateAddress',
+					method: 'post',
+					data: {
+						id: that.dizhi.id,
+						name: that.dizhi.name,
+						mobile: that.dizhi.mobile,
+						region: that.dizhi.region,
+						address: that.dizhi.address,
+						label: that.dizhi.label,
+						default_address: that.dizhi.isdefault
+					}
+				}).then(res => {
+					console.log(res.data);
+					if (res.data.code == 200) {
+						uni.showToast({
+							title: res.data.msg,
+							icon: 'success'
+						})
+						setTimeout(() => {
+							uni.navigateTo({
+								url: '/pages/dizhi/index'
+							})
+						}, 800)
+					} else {
+						that.$refs.toast.show({
+							model: 'error',
+							label: res.data.msg
+						})
+					}
+				})
+			}
 		},
 	}
 </script>
@@ -164,7 +258,11 @@
 	}
 
 	/deep/ .border-grey-darken-4-b-1 {
-		border-bottom: solid 1px #303030;
+		border-bottom: solid 1px #303030 !important;
+	}
+
+	/deep/.tm-button .tm-button-btn uni-button.wn[data-v-dae977ca] {
+		padding-left: 0px !important;
 	}
 
 	.sao {