修改密码

pages/tabbar/mine/changePassword/index.js

@@ -1,16 +1,100 @@
-// pages/tabbar/mine/changePassword/index.js
+const md5 = require("../../../../utils/md5");
+const _Http = getApp().globalData.http;
+import Toast from '@vant/weapp/toast/toast';
 Page({
-
     /**
      * 页面的初始数据
      */
-    data: {},
+    data: {
+        from: {
+            password: "", //原密码
+            newPassword: "", //新密码
+            verifyNewPassword: "" //确认密码
+        },
+        disabled: true,
+        loading: false,
+        confirmPassword: "",
+    },
 
     /**
      * 生命周期函数--监听页面加载
      */
     onLoad(options) {
 
+    },
+    /* 修改密码 */
+    changePassword() {
+        if (this.data.disabled || this.data.loading) return;
+        if (this.data.confirmPassword != true) return Toast({
+            message: '请检查新密码与确认密码',
+            position: 'bottom'
+        });
+        let from = this.data.from;
+        this.setData({
+            loading: true
+        })
+        _Http.basic({
+            "classname": "common.usercenter.usercenter",
+            "method": "changePassWord",
+            "content": {
+                "password": md5.hexMD5(from.password),
+                "newpassword": md5.hexMD5(from.newPassword)
+            }
+        }).then(res => {
+            console.log(res)
+            this.setData({
+                loading: false
+            })
+            if (res.msg != '成功') return Toast({
+                message: res.data,
+                position: 'bottom'
+            });
+            this.setData({
+                disabled: true
+            })
+            wx.showToast({
+                title: '修改成功!',
+            })
+            setTimeout(() => {
+                wx.navigateBack({
+                    delta: 0
+                })
+            }, 300)
+        })
+    },
+    /* 表单输入 */
+    formInput(e) {
+        let v = e.detail.value.trim(),
+            name = e.currentTarget.dataset.name;
+        this.setData({
+            [`from.${name}`]: v
+        });
+        let disabled = false,
+            from = this.data.from;
+        for (let i in from) {
+            if (from[i] == '') disabled = true;
+        }
+        this.setData({
+            disabled
+        })
+    },
+    /* 验证确认密码 */
+    passwordBlur() {
+        let {
+            from
+        } = this.data,
+            confirmPassword = from.newPassword == from.verifyNewPassword;
+        if (from.newPassword == '' || from.verifyNewPassword == '') confirmPassword = ""
+        this.setData({
+            confirmPassword
+        })
+    },
+    /* 清除确认密码 */
+    clearNewPassword() {
+        this.setData({
+            ['from.verifyNewPassword']: '',
+            confirmPassword: ""
+        })
     },
     /**
      * 生命周期函数--监听页面初次渲染完成

pages/tabbar/mine/changePassword/index.scss

@@ -33,6 +33,16 @@
         color: #3874F6;
         border-left: 1rpx solid #EEE;
     }
+
+    .errmsg {
+        font-size: 24rpx;
+        font-family: PingFang SC-Regular, PingFang SC;
+        color: #FF3B30;
+        .iconfont{
+            padding-left: 10rpx;
+            color: #BBBBBB;
+        }
+    }
 }
 
 .but-style {

pages/tabbar/mine/changePassword/index.wxml

@@ -1,28 +1,26 @@
 <My_card custom-class='input-field'>
     <view class="icon-box">
-        <text class="iconfont icon-hujiao" />
-    </view>
-    <input class="input" type="number" placeholder='请填写手机号码' />
-</My_card>
-<My_card custom-class='input-field'>
-    <view class="icon-box">
-        <text class="iconfont icon-hujiao" />
+        <text class="iconfont icon-a-wodemima" />
     </view>
-    <input class="input" type="number" placeholder='请填写验证码' />
-    <view class="auth-code">获取验证码</view>
+    <input class="input" type="number" bindinput="inputNumber" password bindinput="formInput" data-name="password" placeholder='请填写原密码' />
 </My_card>
 <My_card custom-class='input-field'>
     <view class="icon-box">
         <text class="iconfont icon-a-wodemima" />
     </view>
-    <input class="input" password placeholder='请设置6-20位新密码' />
+    <input class="input" password bindinput="formInput" bindblur='passwordBlur' data-name="newPassword" placeholder='请设置6-20位新密码' />
 </My_card>
 <My_card custom-class='input-field'>
     <view class="icon-box">
         <text class="iconfont icon-a-wodemima" />
     </view>
-    <input class="input" password placeholder='请确认新密码' />
+    <input class="input" password bindinput="formInput" value="{{from.verifyNewPassword}}" bindblur='passwordBlur' data-name="verifyNewPassword" placeholder='请确认新密码' />
+    <view wx:if="{{confirmPassword===false}}" class="errmsg">两次密码不一致
+        <van-icon class="iconfont" name="clear" bind:click="clearNewPassword" />
+    </view>
 </My_card>
 <view style="width: 100%; text-align: center;margin-top: 100rpx;">
-    <van-button type="primary" custom-class='but-style'>确定修改</van-button>
-</view>
+    <van-button type="primary" disabled='{{disabled}}' loading='{{loading}}' bindtap="changePassword" loading-text="修改中..." custom-class='but-style'>确定修改</van-button>
+</view>
+
+<van-toast id="van-toast" />