diancan_uni/pages/staff/password/index.vue

<template>
    <!-- pages/staff/password/index.wxml -->
    <view class="container">
        <view class="user-cell">
            <view class="user-title">原密码</view>
            <input class="user_input" type="password" :value="oldPW" placeholder-class="phcolor" placeholder="请输入原密码" @input="oldPWInput" />
        </view>
        <view class="sepline" />
        <view class="user-cell">
            <view class="user-title">新密码</view>
            <input class="user_input" type="password" :value="newPW" placeholder-class="phcolor" placeholder="请输入新密码" @input="newPWInput" />
        </view>
        <view class="sepline" />
        <view class="user-cell">
            <view class="user-title">确认新密码</view>
            <input class="user_input" type="password" :value="againPW" placeholder-class="phcolor" placeholder="请再次输入新密码" @input="againPWInput" />
        </view>
        <view class="sepline" />
        <view class="password-commit" @tap="changePassword">提交</view>
        <van-toast id="van-toast" />
    </view>
</template>

<script>
// pages/password/index.js
let myPro = require('../../../utils/wxRequest.js');

let util = require('../../../utils/util.js');

var app = getApp();
export default {
    data() {
        return {
            oldPW: '',
            newPW: '',
            againPW: ''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        oldPWInput(e) {
            this.setData({
                oldPW: e.detail.value
            });
        },

        newPWInput(e) {
            this.setData({
                newPW: e.detail.value
            });
        },

        againPWInput(e) {
            this.setData({
                againPW: e.detail.value
            });
        },

        changePassword() {
            if (this.oldPW == null || this.oldPW == undefined || this.oldPW == '') {
                Toast('请输入原密码');
                return;
            }

            if (this.newPW == null || this.newPW == undefined || this.newPW == '') {
                Toast('请输入新密码');
                return;
            }

            if (this.againPW == null || this.againPW == undefined || this.againPW == '') {
                Toast('请再次输入新密码');
                return;
            }

            if (this.newPW == this.oldPW) {
                Toast('原密码和新密码相同，请检查');
                return;
            }

            if (this.newPW != this.againPW) {
                Toast('两次输入的密码不一致，请检查');
                return;
            }

            uni.showLoading({
                mask: true
            });
            var that = this;
            var params = {
                token: app.globalData.token,
                old_pwd: this.oldPW,
                new_pwd: this.newPW
            };
            myPro
                .wxRequest('staff/login', 'POST', params)
                .then((res) => {
                    uni.hideLoading();
                    var res = res.data;

                    if (res.code == 200) {
                        Toast('修改密码成功，请重新登录');
                        setTimeout(function () {
                            uni.reLaunch({
                                url: '/pages/login/index'
                            });
                        }, 1000);
                    } else {
                        if (res.code == 401) {
                            Toast('登录失效');
                            setTimeout(function () {
                                uni.reLaunch({
                                    url: '/pages/login/index'
                                });
                            }, 1000);
                        } else {
                            Toast(res.msg);
                        }
                    }
                })
                .catch((err) => {
                    uni.hideLoading();
                    console.log(err);
                });
        }
    }
};
</script>
<style>
/* pages/staff/password/index.wxss */
.user-cell {
    width: 100%;
    height: 100rpx;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.user-title {
    width: 130rpx;
    font-size: 26rpx;
    color: #525666;
    margin-left: 32rpx;
}

.user_input {
    width: 374rpx;
    height: 48rpx;
    font-size: 26rpx;
    padding-left: 20rpx;
}
.sepline {
    margin-left: 32rpx;
    margin-right: 32rpx;
    height: 2rpx;
    background-color: #e6e6e6;
}

.password-commit {
    margin-top: 60rpx;
    text-align: center;
    font-size: 30rpx;
    color: white;
    background-color: #558de0;
    height: 80rpx;
    margin-left: 32rpx;
    margin-right: 32rpx;
    border-radius: 12rpx;
    line-height: 80rpx;
}
</style>