eam-pda/pages/mine/changePassword.vue

<template>
    <view>
        <view class="box">
            <view class="item">
                <!-- <image src="../../static/icon/user_password_icon_blue.png"></image> -->
                <view class="item2 padd35">
                    <input type="text" v-model="old_password" placeholder="请输入原密码" />
                </view>
            </view>
            <view class="item">
                <!-- <image src="../../static/icon/user_password_icon_red.png"></image> -->
                <view class="item2 padd35">
                    <input type="text" v-model="newpassword" placeholder="请输入新密码" />
                </view>
            </view>
            <view class="item">
                <!-- <image src="../../static/icon/user_password_icon.png"></image> -->
                <view class="item2 padd35">
                    <input type="text" v-model="confirmpassword" placeholder="请确认新密码" />
                </view>
            </view>
        </view>
        <view class="btn" @click="submit">确认</view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                newpassword: "",
                old_password: "",
                confirmpassword: "",
            }
        },

        onLoad() {

        },
        onShow() {

        },
        methods: {
            submit() {
                if(!this.old_password){
                    this.$toast('请输入原密码');
                    return;
                }
                if(!this.newpassword){
                    this.$toast('请输入新密码');
                    return;
                }
                if(!this.confirmpassword){
                    this.$toast('请确认新密码');
                    return;
                }
                if(this.confirmpassword != this.newpassword){
                    this.$toast('两次输入的密码不一致，请重新输入');
                    return;
                }
                this.$ajax('editpassword', {
                    userToken: this.$getSync('userToken'),
                    newpassword:this.newpassword,
                    old_password:this.old_password,
                    confirmpassword:this.confirmpassword,
                }).then(ret => {
                    this.$closeLoading()
                    if (ret.status == 0) {
                        this.$alert('修改成功',()=>{
                            this.$backT()
                        })
                    } else {
                        this.$toast(ret.message);
                    }
                });
            },
        }
    }
</script>

<style lang="scss">
    page {
        background-color: #f8f9fb;
    }

    .box {
        width: 94vw;
        margin: 20rpx auto;
        border-radius: 20rpx;
        overflow: hidden;
    }

    .item {
        background-color: #FFFFFF;
        padding: 0rpx 30rpx;
        display: flex;
        align-items: center;

        image {
            width: 44rpx;
            height: 44rpx;
            margin-right: 30rpx;
        }

        .item2 {
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex: 1;
            border-bottom: 1rpx solid #efefef;
            padding: 25rpx 0rpx;

            input {
                font-size: 28rpx;
            }

            view {
                color: #1a4f9f;
                border: 1rpx solid #1a4f9f;
                font-size: 30rpx;
                border-radius: 50rpx;
                padding: 10rpx 18rpx;
            }
        }

    }

    .btn {
        width: calc(100vw - 80rpx);
        position: fixed;
        bottom: 200rpx;
        left: 40rpx;
        background-color: rgb(64, 158, 255);
        color: #FFFFFF;
        height: 90rpx;
        line-height: 90rpx;
        text-align: center;
        border-radius: 50rpx;
        font-size: 32rpx;
    }

    .noborder {
        border-bottom: none !important;
    }

    .padd35 {
        padding: 35rpx 0 !important;
    }
</style>