['设置中心修改头像昵称退出登录']

apis/interfaces/mine.js

@@ -66,6 +66,17 @@ const browsers = (page) => {
   })
 }
 
+// 修改用户头像或昵称
+const resetUserInfo= (data) => {
+  return request({
+    url: 'user/'+data.key,
+    method: 'PUT',
+    data:{
+		value:data.value
+	}
+  })
+}
+
 
 export {
   shopSubscribe,
@@ -74,5 +85,6 @@ export {
   getUserInfo,
   getUserSettingInfo,
   chaineb,
-  browsers
+  browsers,
+  resetUserInfo
 }

pages.json

@@ -175,6 +175,15 @@
 				"navigationBarBackgroundColor": "#e93340",
 				"navigationBarTitleText": "订单详情"
 			}
+		},{
+			"path": "pages/property/setting/setting",
+			"name": "Setting",
+			"style": {
+				"enablePullDownRefresh": true,
+				"navigationBarTextStyle": "white",
+				"navigationBarBackgroundColor": "#e93340",
+				"navigationBarTitleText": "设置中心"
+			}
 		},
 		{
 			"path": "pages/goods/details",

pages/property/index.vue

@@ -2,8 +2,8 @@
 	<view>
 		<!-- 用户信息 -->
 		<view class="user">
-			<view class="user-tool">
-				<image src="@/static/icons/user_icon_00.png" mode="widthFix" />
+			<view class="user-tool" @click="$Router.push({name:'Setting'})">
+				<image src="@/static/icons/user_icon_00.png" mode="widthFix"  />
 			</view>
 			<view class="user-content">
 				<image class="info-cover" src="../../static/dev/good_cover_00.jpg" mode="aspectFill" />
@@ -38,19 +38,19 @@
 					<view class="title-text">我的资产</view>
 				</view>
 				<view class="group-flex group-flex-4">
-					<view class="item">
+					<view class="item" @click="showToast">
 						<view class="item-num">0</view>
 						<view class="item-title">原石</view>
 					</view>
-					<view class="item">
+					<view class="item" @click="showToast">
 						<view class="item-num">0</view>
 						<view class="item-title">贡献值</view>
 					</view>
-					<view class="item">
+					<view class="item" @click="showToast">
 						<view class="item-num">0</view>
 						<view class="item-title">易币</view>
 					</view>
-					<view class="item">
+					<view class="item" >
 						<view class="item-num">0</view>
 						<view class="item-title">零钱</view>
 					</view>
@@ -66,7 +66,7 @@
 						<view class="item-num">0</view>
 						<view class="item-title">权证持有</view>
 					</view>
-					<view class="item" @click="$Router.push({name:'33'})">
+					<view class="item" @click="showToast">
 						<view class="item-num">0</view>
 						<view class="item-title">权证转让</view>
 					</view>
@@ -146,13 +146,11 @@
             <view class="poster-text">推广海报</view>
 			<carousel :img-list="imgList" url-key="url" @selected="selectedBanner"/>
        
-            
-            <view class="" @click="outLogin">
-                临时退出
-            </view>
 		</block>
+		<!-- 弹窗 -->
+		<u-toast ref="uToast" />
 		<!-- 版权信息 -->
-		<view class="copyright" @click="copyright">易品新境 beta 1.0.0</view>
+		<view class="copyright">易品新境 beta 1.0.0</view>
 	</view>
 </template>
 
@@ -164,7 +162,7 @@
 		},
 		data() {
 			return {
-				tabsIndex: 1,
+				tabsIndex: 0,
 				imgList: [{
 					url: 'https://img9.51tietu.net/pic/2019-091200/vgkpidei2tjvgkpidei2tj.jpg',
 					id: 1
@@ -184,10 +182,18 @@
 			selectedBanner(item, index) {
 				console.log('🥒', item, index)
 			},
-			copyright(){
-				uni.clearStorageSync()
-				uni.navigateTo({
-					url:'/pages/login/login'
+			// copyright(){
+			// 	uni.clearStorageSync()
+			// 	uni.navigateTo({
+			// 		url:'/pages/login/login'
+			// 	})
+			// },
+			// 努力开发中，，，
+			showToast(){
+				this.$refs.uToast.show({
+				  title: '努力开发中',
+				  type:'error',
+				  duration: 3000
 				})
 			}
 		}

pages/property/setting/setting.vue

@@ -0,0 +1,357 @@
+<template>
+	<view class="Mine">
+		<!-- 更多管理 -->
+		<view class="list">
+			<view class="list-item" @click="updImgs">
+				<view class="list-item-left">
+					<image src="/static/images/user-avatar.png" mode="widthFix" />
+					<span>修改头像</span>
+				</view>
+				<view class="avatar" >
+					<image :src="avatar.showPath" mode="aspectFill" />
+					<u-icon name="arrow-right" color="#f1f1f1" size="28"></u-icon>
+				</view>
+			</view>
+			<view class="list-item">
+				<view class="list-item-left">
+					<image src="/static/images/mine-self-name.png" mode="widthFix" />
+					<span>修改昵称</span>
+				</view>
+				<view class="input">
+					<input type="text" :value="nickname" @blur='blur' placeholder="请输入用户的昵称" maxlength="12" />
+					<u-icon name="arrow-right" color="#f1f1f1"  size="28"></u-icon>
+				</view>
+			</view>
+			<view @click="loginOut" class="list-item">
+				<view class="list-item-left">
+					<image src="/static/images/reset-info.png" mode="widthFix" />
+					<span>切换账户</span>
+				</view>
+				<u-icon name="arrow-right" color="#f1f1f1" size="28"></u-icon>
+			</view>
+		</view>
+		<!-- 底部banner -->
+
+		<!-- <u-toast ref="uToast" /> -->
+		<u-toast ref="uToast" />
+
+	</view>
+</template>
+
+<script>
+	import {
+		getUserSettingInfo,
+		resetUserInfo
+	} from '@/apis/interfaces/mine'
+	import {
+		uploads
+	} from '@/apis/interfaces/uploading'
+	export default {
+		data() {
+			return {
+				canLogin: true,
+				nickname: '',
+				avatar: {
+					path: '',
+					showPath: ''
+				},
+				is_bind: true
+			}
+		},
+		onShow() {
+			wx.login({
+				success: res => {
+					this.loginCode = res.code
+				}
+			})
+			this.getUserInfo()
+		},
+		onPullDownRefresh() {
+			this.getUserInfo()
+		},
+		methods: {
+			// 获取当前用户得基本信息
+			getUserInfo() {
+				getUserSettingInfo().then(res => {
+					this.avatar.showPath = res.avatar
+					this.nickname = res.nickname
+					this.is_bind = res.is_bind
+					uni.stopPullDownRefresh()
+				}).catch(err => {
+					this.$refs.uToast.show({
+						title: err.message,
+						type: 'primary',
+						duration: 3000
+					})
+				})
+			},
+			// 点击绑定用户得授权信息，且绑定带修改
+			getUser() {
+				uni.getUserProfile({
+					desc: "获取你的昵称、头像、地区及性别",
+					success: e => {
+						console.log(e)
+						if (e.errMsg == "getUserProfile:ok") {
+							this.userInfo = e.userInfo
+							//   // 检查用户登录Code是否过期
+							wx.checkSession({
+								success: res => {
+									this.userLogin(e)
+								},
+								fail: err => {
+									// 登录过期重新获取code
+									uni.login({
+										success: res => {
+											this.loginCode = res.code
+											// 登录
+											this.userLogin()
+										}
+									})
+								}
+							})
+						} else {
+							uni.showToast({
+								duration: 1500,
+								title: "绑定手机号失败了",
+								icon: 'none'
+							})
+						}
+					},
+					fail() {
+						uni.showToast({
+							duration: 1500,
+							title: "您拒绝了请求",
+							icon: 'none'
+						})
+					}
+				})
+			},
+			// 登陆接口
+			userLogin(info) {
+				let that = this
+				uni.login({
+					success: res => {
+						let data = {
+							iv: info.iv,
+							encryptedData: info.encryptedData,
+							code: res.code
+						}
+						uni.showLoading({
+							title: '绑定中'
+						})
+						wechatbind(data).then(res => {
+							setTimeout(res => {
+								uni.hideLoading()
+							}, 1000)
+							this.$refs.uToast.show({
+								title: '绑定成功',
+								type: 'primary',
+								duration: 3000
+							})
+							setTimeout(res => {
+								this.getUserInfo()
+							}, 3000)
+						}).catch(err => {
+							this.$refs.uToast.show({
+								title: err.message,
+								type: 'primary',
+								duration: 3000
+							})
+							uni.hideLoading()
+						})
+					},
+					fail: () => {},
+					complete: () => {}
+				});
+
+			},
+			loginOut() {
+				uni.removeStorageSync('token')
+				uni.reLaunch({
+					url: '/pages/login/login'
+				})
+			},
+			// 上传头像
+			updImgs(type) {
+				uni.chooseImage({
+					success: res => {
+						let path = res.tempFiles.map((val, index) => {
+							return {
+								name: 'uploads' + index,
+								uri: val.path
+							}
+						})
+						uploads(path).then(pathRes => {
+							console.log(pathRes)
+							this.avatar.path = pathRes.path[0]
+							this.avatar.showPath = pathRes.url[0]
+							this.resetUserInfo('avatar',pathRes.url[0])
+						}).catch(err => {
+							uni.showToast({
+								title: err.message,
+								icon: 'none'
+							})
+						})
+					}
+				})
+			},
+			// 修改姓名
+			blur(e){
+				let value = e.detail.value
+				console.log(value)
+				console.log(this.nickname)
+				if(value !== this.nickname){
+					this.resetUserInfo('nickname',value)
+				}
+			},
+			// 修改头像或昵称
+			resetUserInfo(key, value) {
+				let data ={
+					key:key,
+					value:value
+				}
+				resetUserInfo(data).then(res=>{
+					uni.showToast({
+						title: res,
+						icon: 'none'
+					})
+					this.getUserInfo()
+				}).catch(err => {
+					uni.showToast({
+						title: err.message,
+						icon: 'none'
+					})
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		background-color: #F8F8F8;
+	}
+
+	.Mine {
+		width: 100%;
+		height: 100%;
+		position: relative;
+		background-color: #fff;
+
+		// 更多管理
+		.list {
+			display: flex;
+			flex-direction: column;
+			align-items: flex-start;
+			justify-content: flex-start;
+			box-sizing: border-box;
+			position: relative;
+			top: -10rpx;
+			border-radius: 20rpx;
+			margin: 0 40rpx;
+			padding: 30rpx 0;
+			width: calc(100% - 80rpx);
+
+			button::after {
+				border: none;
+				background-color: none;
+			}
+
+			button {
+				position: relative;
+				display: block;
+				margin-left: auto;
+				margin-right: auto;
+				padding-left: 0;
+				padding-right: 0;
+				box-sizing: border-box;
+				font-size: $title-size *0.9;
+				text-align: center;
+				text-decoration: none;
+				line-height: 1;
+				border-radius: 5px;
+				-webkit-tap-highlight-color: transparent;
+				overflow: hidden;
+				color: #333;
+				background-color: #fff;
+			}
+
+			.list-item {
+				width: 100%;
+				display: flex;
+				flex-direction: row;
+				align-items: center;
+				justify-content: space-between;
+				padding: 40rpx 0;
+				border-bottom: solid 1rpx #f7f7f7;
+				box-sizing: border-box;
+
+				.avatar {
+					display: flex;
+					flex-direction: row;
+					align-items: center;
+					justify-content: center;
+					box-sizing: border-box;
+
+					image {
+						width: 100rpx;
+						height: 100rpx;
+						border-radius: 50%;
+						margin-right: 20rpx;
+					}
+				}
+
+				.input {
+					display: flex;
+					flex-direction: row;
+					align-items: center;
+					justify-content: center;
+					box-sizing: border-box;
+					text-align: right;
+					flex: 1;
+
+					input {
+						padding-right: 30rpx;
+						width: 100%;
+					}
+				}
+
+				.list-item-left {
+					display: flex;
+					flex-direction: row;
+					align-items: center;
+					justify-content: flex-start;
+					box-sizing: border-box;
+
+					image {
+						width: 40rpx;
+					}
+
+					span {
+						margin-left: 20rpx;
+					}
+				}
+			}
+		}
+
+		// 底部轮播图跳转到其他app
+		.mine-banner {
+			position: relative;
+			width: calc(100% - 80rpx);
+			top: -20rpx;
+			margin: 0 40rpx;
+			box-sizing: border-box;
+			margin-top: $margin*2;
+		}
+	}
+
+	.loginOut {
+		margin: 30rpx 50rpx;
+		background-color: #fff;
+		box-shadow: 0 0 20rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
+		text-align: center;
+		padding: 20rpx;
+		border-radius: 10rpx;
+		color: #353535;
+	}
+</style>