yicangzongtai_app_240321/pages/research/setup/management.vue

<template>
	<view class="management">
		<navbar ref="navbar" :config="config" backColor="#666"></navbar>
		<view class="top" @click="goToEdit">
			<view class="image">

				<image v-if="userInfo.head_photo" :src="userInfo.head_photo" mode=""></image>
				<image v-else :src="imgUrl+'/head-on.png'" mode=""></image>
			</view>
			<view class="name-and-num">
				<div>
					<view class="name">
						{{userInfo.real_name}}
					</view>
					<view class="num u-text1">
						{{userInfo.mobile}}
					</view>
				</div>
				<view class="iconfont">
					&#xe6c7;
				</view>
			</view>

		</view>
		<view class="distance">

		</view>
		<view class="content">
			<!-- 			<view class="modify" @click="goToModifyPass">
				<view class="password">
					修改密码
				</view>
				<view class="modif-name">

					<text class="iconfont">&#xe6c7;</text>
				</view>
			</view>
			<view class="modify" @click="goToForgetPass">
				<view class="password">
					忘记密码
				</view>
				<view class="modif-name">

					<text class="iconfont">&#xe6c7;</text>
				</view>
			</view> -->
		</view>
		<view class="distance">

		</view>
		<view class="address">
			<view class="item" @click="goToReplacePhone">
				<view class="my-address">
					更换手机号
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		</view>
		<view class="address" @click="goPayPassword()">
			<view class="item">
				<view class="my-address">
					设置支付密码
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		
		</view>
    <!-- <view class="address" @click="addBamks()">
    	<view class="item">
    		<view class="my-address">
    			管理银行卡
    		</view>
    		<view class="iconfont">&#xe6c7;</view>
    	</view>
    
    </view> -->
		<!-- <view class="address">
			<view class="item" @click="goToAddressList">
				<view class="my-address">
					我的地址
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>

		</view> -->
		<view class="address" @click="goAgreement()">
			<view class="item">
				<view class="my-address">
					关于我们
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>

		</view>
		<view class="address" @click="goLogout()">
			<view class="item">
				<view class="my-address">
					注销账户
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		</view>
		<view class="address">
			<!-- <view class="item" @click="swithcWeChat">
				<view class="my-address">
					绑定微信
				</view>
				<view class="u-flex">
					<view class="c_gary" v-if="userInfo.bind_wechat">已绑定</view>
					<view class="iconfont">&#xe6c7;</view>
				</view>
			</view>
			<view class="item" @click="switchAlipay()">
				<view class="my-address">
					绑定支付宝
				</view>
				<view class="u-flex">
					<view class="c_gary" v-if="userInfo.bind_alipay">已绑定</view>
					<view class="iconfont">&#xe6c7;</view>
				</view>
			</view> -->
			<view class="item" @click="getUserInfo('examine')">
				<view class="my-address">
					检测更新
				</view>
				<view class="u-flex">
					<view class="c_blue" v-if="userInfo.check_latest_ver">有新版本</view>
					<view class="" v-else>{{userInfo.ver}}</view>
					<view class="iconfont">&#xe6c7;</view>
				</view>
			</view>
		</view>
		<!-- <view class="address">
			<view class="item" @click="goAboutLd">
				<view class="my-address">
					加入我们
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
			<view class="item" @click="goAboutUs">
				<view class="my-address">
					关于松河生活平台
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		</view> -->
		<!-- <view class="footer">
		<view>
		Copyright@2021-2030	</view>
		<view>广东松河生活平台生物科技有限公司 版权所有
		</view>
		</view> -->
		<view class="sign">
			<view class="sign-out" @click="logOut">
				退出登录
			</view>
		</view>
		<u-modal v-model="show" content="确定解除绑定？" show-cancel-button @confirm="unbinding"></u-modal>
	</view>
</template>

<script>
	import {
		myInfo,
		logout
	} from "@/api/login.js"
	export default {
		data() {
			return {
				config: {
					back: true, //false是tolbar页面 是则不写
					title: '设置',
					color: '#1A1A1A',
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					backgroundColor: [1, "#fff"],
					statusBarFontColor: '#1A1A1A',
				},

				userInfo: {}, //个人信息
				imgUrl: this.$mConfig.staticUrl,
				code: null,
				AlipayCode: null,
				versionCode: 0, //版本号
				show: false,
				type: null,
				AlipayType: 1, //2获取支付宝code  1不获取 
			}
		},
		onShow() {
			// #ifdef APP-PLUS
			plus.runtime.getProperty(plus.runtime.appid, (info) => {
				this.versionCode = info.versionCode;
				this.getUserInfo()
				this.getAlipay()
			})
			// #endif
			// #ifndef APP-PLUS
			this.getUserInfo()
			// #endif
			this.getToken()
		},
		methods: {
			// 支付宝授权回调
			getAlipay() {
				var args = plus.runtime.arguments;
				let argsUrl = decodeURIComponent(args.split('?')[1]).split('=')[1];
				if (argsUrl && !this.userInfo.bind_alipay && this.AlipayType == 2) {
					// 处理args参数，如直达到某新页面等    
					// plus.runtime.arguments = {};
					// uni.redirectTo({
					// 	url: "/pages/login/login?code=" + argsUrl.code
					// });
					this.AlipayType = 1
					this.code = argsUrl
					this.binding(1)
				}
			},
			getToken() {
				let token = uni.getStorageSync("apiToken")
				if (!token) {
					uni.redirectTo({
						url: "../../index/personal"
					})
				}
			},
			goAboutUs() {
				uni.navigateTo({
					url: "../homepage/about-us-list"
				})
			},
			goAboutLd() {
				uni.navigateTo({
					url: "../homepage/aboutLida"
				})
			},
			goLogout(){
				uni.navigateTo({
					url: "/pages/research/setup/logout"
				})
			},
			// 跳转协议
			goAgreement() {
				uni.navigateTo({
					url: "/pages/protocol/index?code=about-us"
				})
			},
			// 绑定/解绑 微信
			swithcWeChat() {
				if (this.userInfo.bind_wechat) {
					this.show = true;
					this.type = 0;
					return
				}
				let that = this;
				// uni.getProvider({
				// 	service: 'oauth',
				// 	success: function (res) {
				// 		console.log(res.provider)
				// 	}
				// });
				uni.login({
					provider: 'weixin',
					onlyAuthorize: true,
					success: function(loginRes) {
						that.code = loginRes.code
						that.binding(0)
					},
					complete(e) {
						console.log(e)
					}
				});
			},
			// 绑定 支付宝
			switchAlipay() {
				if (this.userInfo.bind_alipay) {
					this.show = true;
					this.type = 1;
					return
				}
				this.code = null;
				// let urls =
				// 	`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=${this.$mConfig.AlipayAppid}&scope=auth_userinfo&redirect_uri=${this.$mConfig.redirect_uri}/pages/login`;
				// urls = encodeURIComponent(urls); //将地址编码成浏览器访问的格式
				// this.AlipayType = 2
				// // 判断平台
				// if (plus.os.name == 'Android') {
				// 	plus.runtime.openURL(
				// 		'alipays://platformapi/startapp?appId=20000067&url=' + urls,
				// 		res => {
				// 			//这里写打开URL地址失败后的处理
				// 			uni.showModal({
				// 				content: '本机未检测到对应客户端，是否打开浏览器访问页面？',
				// 				success: function(res) {
				// 					if (res.confirm) {
				// 						//plus.runtime.openURL();
				// 					}
				// 				}
				// 			});
				// 		},
				// 		'com.eg.android.AlipayGphone'
				// 	);

				// } else if (plus.os.name == 'iOS') {
					// plus.runtime.openURL(
					// 	'alipay://platformapi/startapp?appId=20000067&url=' + urls,
					// 	res => {
					// 		console.log(res);
					// 		uni.showModal({
					// 			content: '本机未检测到对应客户端，是否打开浏览器访问页面？',
					// 			success: function(res) {
					// 				if (res.confirm) {
					// 					//plus.runtime.openURL(url);
					// 				}
					// 			}
					// 		});
					// 	},
					// 	'com.eg.android.AlipayGphone'
					// );
				// }
				let str=encodeURIComponent('apiname=com.alipay.account.auth&app_id=2021003145626363&app_name=mc&auth_type=AUTHACCOUNT&biz_type=openservice&method=alipay.open.auth.sdk.code.get&pid=2088441816745635&product_id=APP_FAST_LOGIN&scope=kuaijie&sign_type=RSA2&target_id=lvzv2022')
				let alipayLogin = uni.requireNativePlugin("henter-alipay-login")
				alipayLogin.login({
						authInfo: 'apiname=com.alipay.account.auth&app_id=2021003145626363&app_name=mc&auth_type=AUTHACCOUNT&biz_type=openservice&method=alipay.open.auth.sdk.code.get&pid=2088441816745635&product_id=APP_FAST_LOGIN&scope=kuaijie&sign_type=RSA2&target_id=lvzv2022&sign='+str,
						appScheme: 'lmzc'
					},
					(r) => {
						console.log(r)
						if (r.resultStatus == 9000) {
							let arr = r.result.split("&");
							for (let i = 0; i < arr.length; i++) {
								let pair = arr[i].split("=");
								if (pair[0] == 'auth_code') {
									this.code = pair[1]
									this.binding(1)
								}
							}
						}
					}
				)
			},
			// 绑定
			binding(type) {
				let param = {
					third_type: type,
					code: this.code
				}
				this.$http.post('/account/userthirdidentity/binding', param).then(res => {
					console.log(res)
					if (res && res.code == 200) {
						uni.showToast({
							title: '绑定成功！',
							duration: 2000
						});
						this.getUserInfo()
					}
				}).catch(e => {
					console.log(e)
				})
			},
			// 解绑
			unbinding() {
				let param = {
					third_type: this.type,
				}
				this.$http.post('/account/userthirdidentity/unbind', param).then(res => {
					if (res && res.code == 200) {
						uni.showToast({
							title: '解绑成功！',
							duration: 2000
						});
						this.getUserInfo()
					}
				})
			},
			//退出登录
			logOut() {
				let that = this
				let userInfo = uni.getStorageSync("apiToken")
				uni.showModal({
					title: '你确定要退出吗？',
					success: function(res) {
						if (res.confirm) {
							that.$http.post(logout)
								.then(res => {
									if (res && res.code == 200) {
										uni.removeStorageSync('token');
										that.$mUtil.toast("退出成功")
										uni.navigateTo({
											url: "../register/login"
										})
									}
								})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					},
				});
			},
			//获取个人信息
			getUserInfo(type) {
				// myInfo
				// /account/center/setting/info
				this.$http.get('/account/center/setting/info', {
					number: this.versionCode
				}).then(res => {
					if (res.code == 200) {
						this.userInfo = res.data;
						if (type && this.userInfo.check_latest_ver) {
							uni.navigateTo({
								url: "/pages/protocol/versionUpgrade"
							})
						} else if (type && !this.userInfo.check_latest_ver) {
							uni.showToast({
								icon: "none",
								title: '已是最新版本！',
								duration: 2000
							});
						}
					}
				})
			},
			// //获取更新信息
			// getUpdataInfo(){
			// 	this.$http.get('')
			// },
			//跳转设置页
			goToEdit() {
				uni.navigateTo({
					url: "./edit"
				})
			},
			//忘记密码
			goToForgetPass() {
				uni.navigateTo({
					url: "./forgetPass"
				})

			},
			//跳转我的地址
			goToAddressList() {
				uni.navigateTo({
					url: "../../user/address/addressList"
				})
			},
			//修改密码
			goToModifyPass() {
				uni.navigateTo({
					url: "./modifyPass"
				})
			},
			goToReplacePhone() {
				uni.navigateTo({
					url: "../register/replacePhone"
				})
			},
			goPayPassword(){
				uni.navigateTo({
					url: "../pay-password"
				})
			},
      addBamks() {
        uni.navigateTo({
          url: '/pages/order/banks/list'
        })
      }
		}
	}
</script>

<style lang="scss" scoped>
	.footer {
		margin-top: 500rpx;
		text-align: center;
	}

	.management {
		position: relative;
	}

	.sign {
		display: flex;
		justify-content: center;

		.sign-out {
			margin-top: 400rpx;
			font-size: 36rpx;
			color: #ffffff;
			font-weight: 400;
			padding: 18rpx 272rpx;
			background-color: #3D93FC;
			border-radius: 43rpx;

		}
	}


	.address {
		padding: 0 30rpx;

		.item {
			display: flex;
			justify-content: space-between;
			border-bottom: 1rpx solid #E6E6E6;
			padding-bottom: 30rpx;
			padding-top: 23rpx;
			font-size: 28rpx;
			color: #1A1A1A;
			font-weight: 400;
		}

	}

	.content {
		padding: 0 30rpx;

		.modify:last-child {
			border-bottom: none;
		}

		.modify {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 22rpx;
			padding-bottom: 30rpx;
			border-bottom: 1rpx solid #E6E6E6;

			.password {
				font-size: 28rpx;
				color: #1A1A1A;
				font-weight: 400;
			}

			.modif-name {
				font-size: 28rpx;
				font-weight: 400;
				color: #1A1A1A;

				.iconfont {
					margin-left: 14rpx;
				}
			}
		}
	}

	.distance {
		height: 10rpx;
		background-color: #F5F5F5;
	}

	.top {
		display: flex;
		align-items: center;
		padding: 0 30rpx;
		margin: 45rpx 0 40rpx 0;

		.image {
			image {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
			}
		}

		.name-and-num {
			margin-left: 18rpx;
			flex: 1;
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: 572rpx;

			.name {
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
				width: 300rpx;
				font-size: 28rpx;
				color: #1A1A1A;
				font-weight: 400;
			}

			.num {
				font-size: 24rpx;
				color: #999999;
				font-weight: 500;

			}
		}
	}

	.c_gary {
		color: #808080;
	}

	.c_blue {
		color: #0071E2;
	}
</style>