|
|
@@ -0,0 +1,235 @@
|
|
|
+<template>
|
|
|
+ <view class="content">
|
|
|
+ <view class="row1">
|
|
|
+ <text class="tit">头像</text>
|
|
|
+ <view class="background-img" @click="upload"><image class="background-img" v-model="avatar" :src="avatar" mode="aspectFill"></image></view>
|
|
|
+ </view>
|
|
|
+ <view class="row">
|
|
|
+ <text class="tit">昵称</text>
|
|
|
+ <input class="input" type="button" v-model="name" placeholder-class="placeholder" />
|
|
|
+ </view>
|
|
|
+ <view class="row">
|
|
|
+ <text class="tit">修改密码</text>
|
|
|
+ <input class="input" type="text" v-model="password" placeholder-class="placeholder" />
|
|
|
+ </view>
|
|
|
+ <view class="row">
|
|
|
+ <text class="tit">请输入手机号</text>
|
|
|
+ <input class="input" type="text" v-model="account" placeholder-class="placeholder" />
|
|
|
+ </view>
|
|
|
+ <view class="row">
|
|
|
+ <text class="tit">验证码</text>
|
|
|
+ <input class="input" type="text" v-model="captcha" placeholder-class="placeholder" />
|
|
|
+ <view class="code" @click="verification">{{ countDown == 0 ? $t('password.a7') : countDown }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="row">
|
|
|
+ <text class="tit">账号</text>
|
|
|
+ <input class="input" disabled type="text" v-model="phone" placeholder-class="placeholder" />
|
|
|
+ </view>
|
|
|
+ <button class="add-btn" @click="confirm">修改</button>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { mapState,mapMutations } from 'vuex';
|
|
|
+import { userEdit,logout } from '@/api/set.js';
|
|
|
+import { upload } from '@/api/order.js'
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ name: '', // 昵称
|
|
|
+ password:'', //修改密码
|
|
|
+ captcha:'', //验证码
|
|
|
+ account:'', //请输入手机号
|
|
|
+ phone:'',
|
|
|
+ avatar: '',
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState('user',['userInfo']),
|
|
|
+ startDate() {
|
|
|
+ console.log('start');
|
|
|
+ },
|
|
|
+ endDate() {
|
|
|
+ console.log('end');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow(option) {
|
|
|
+ console.log('111',this.userInfo);
|
|
|
+ this.name = this.userInfo.nickname + '';
|
|
|
+ this.password = '',
|
|
|
+ this.captcha = '',
|
|
|
+ this.account = '',
|
|
|
+ this.avatar = this.userInfo.avatar || '';
|
|
|
+ this.phone = this.userInfo.phone || '';
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapMutations('user', ['logout']),
|
|
|
+ // 上传头像
|
|
|
+ upload() {
|
|
|
+ console.log("111111")
|
|
|
+ upload({
|
|
|
+ filename: ''
|
|
|
+ }).then(data => {
|
|
|
+ this.avatar = data[0].url;
|
|
|
+ console.log(this.avatar, 'tup')
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.hideLoading()
|
|
|
+ }, 500)
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ confirm() {
|
|
|
+ userEdit({
|
|
|
+ nickname: this.name,
|
|
|
+ avatar: this.avatar,
|
|
|
+ password: this.password,
|
|
|
+ captcha: this.captcha,
|
|
|
+ account: this.account
|
|
|
+ }).then(e => {
|
|
|
+ this.$api.msg('修改成功');
|
|
|
+ // 清空输入框
|
|
|
+ this.password = '',
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/user/user'
|
|
|
+ });
|
|
|
+ }, 1000);
|
|
|
+ console.log(e);
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ console.log(e);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //发送验证码
|
|
|
+ verification() {
|
|
|
+ let obj = this;
|
|
|
+ if (this.account == '') {
|
|
|
+ this.$api.msg('请输入电话号码');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (this.account.length < 11) {
|
|
|
+ this.$api.msg('请输入正确的手机号');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 判断是否在倒计时
|
|
|
+ if (obj.countDown > 0) {
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ obj.countDown = 60;
|
|
|
+ obj.time = setInterval(() => {
|
|
|
+ obj.countDown--;
|
|
|
+ }, 1000);
|
|
|
+ //调用验证码接口
|
|
|
+ verify({
|
|
|
+ account: obj.account,
|
|
|
+ type: 'login'
|
|
|
+ })
|
|
|
+ .then(({ data }) => {})
|
|
|
+ .catch(err => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // loginout() {
|
|
|
+ // let obj = this;
|
|
|
+ // uni.showModal({
|
|
|
+ // content: '确定要退出登录么',
|
|
|
+ // success: e => {
|
|
|
+ // if (e.confirm) {
|
|
|
+ // uni.removeStorageSync('canChange')
|
|
|
+ // logout({}).then()
|
|
|
+ // uni.navigateBack();
|
|
|
+ // obj.logout();
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ loginout() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/switch/switch'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.content {
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.row1 {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ position: relative;
|
|
|
+ padding: 0 30upx;
|
|
|
+ height: 110upx;
|
|
|
+ background: #fff;
|
|
|
+ .tit {
|
|
|
+ flex-shrink: 0;
|
|
|
+ width: 120upx;
|
|
|
+ font-size: $font-lg;
|
|
|
+ }
|
|
|
+ .background-img {
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: #f2f2f2;
|
|
|
+ }
|
|
|
+}
|
|
|
+.row {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ position: relative;
|
|
|
+ padding: 0 30upx;
|
|
|
+ height: 110upx;
|
|
|
+ background: #fff;
|
|
|
+
|
|
|
+ .tit {
|
|
|
+ flex-shrink: 0;
|
|
|
+ font-size: $font-lg;
|
|
|
+ color: $font-color-dark;
|
|
|
+ }
|
|
|
+ .tit1 {
|
|
|
+ flex-shrink: 0;
|
|
|
+ width: 150upx;
|
|
|
+ font-size: $font-lg;
|
|
|
+ color: $font-color-dark;
|
|
|
+
|
|
|
+ }
|
|
|
+ .input {
|
|
|
+ text-align: right;
|
|
|
+ flex: 1;
|
|
|
+ font-size: $font-base;
|
|
|
+ color: $color-gray;
|
|
|
+ }
|
|
|
+ .iconlocation {
|
|
|
+ font-size: 36upx;
|
|
|
+ color: $font-color-light;
|
|
|
+ }
|
|
|
+}
|
|
|
+.add-btn {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 560upx;
|
|
|
+ height: 80upx;
|
|
|
+ margin: 60upx auto;
|
|
|
+ font-size: $font-lg;
|
|
|
+ color: #fff;
|
|
|
+ background: $base-color;
|
|
|
+ border-radius: 40upx;
|
|
|
+}
|
|
|
+.loginout {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 560upx;
|
|
|
+ height: 80upx;
|
|
|
+ margin: 60upx auto;
|
|
|
+ font-size: $font-lg;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+</style>
|
