OA/pages/oaLogin/editpwd.vue

264 lines
5.7 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="login">
<!-- <image class="bg-iamge" src="../../static/img/login/login_back_img.png"></image> -->
<hx-lottie :options="options" ref="lottie"
style="width: 100vw;height: 100vh;transform: scale(1.3);background-color: #3274F9;" />
<u-navbar v-if="uniMP" @leftClick="leftClick" bgColor="rgba(0,0,0,0)" leftIconColor=" #fff" :autoBack="false">
</u-navbar>
<!-- #ifdef APP-PLUS||H5 -->
<!-- <view style="height: var(--status-bar-height)"></view> -->
<!-- #endif -->
<view class="body">
<view class="title">欢迎进入OA</view>
<view class="login-card">
<view class="top">
<view class="text item">
<u-tabs :list="tabList" @click="changeTabs" lineColor="#3274F9"
itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;font-size: 32rpx;"></u-tabs>
</view>
<input class="mobile item" v-model="formData.old_pwd" maxlength="26" placeholder="输入旧密码" password
type="safe-password" />
<input class="mobile item" v-model="formData.pwd" maxlength="26" placeholder="输入新密码" password
type="safe-password" />
<input class="mobile item" v-model="formData.pwd_confirm" maxlength="26" placeholder="确认密码" password
type="safe-password" />
</view>
<button class="edit_btn" @click="login">修改密码</button>
</view>
</view>
</view>
</template>
<script>
import {
changePassword,
} from "@/api/oaUser.js"
import {
Toast
} from "../../libs/uniApi";
export default {
data() {
return {
options: {
data: '',
},
uniMP: false,
APP_token: '',
tabList: [{
name: '密码修改'
},
// {name:'手机登录'},
],
current: 0,
formData: {
pwd_confirm: '',
pwd: '',
old_pwd: '',
},
};
},
onLoad() {
this.APP_token = uni.getStorageSync('APP_token');
},
onShow() {
if (uni.getStorageSync('uniMP')) this.uniMP = true;
},
methods: {
changeTabs(e) {
this.current = e.index;
this.formData.scene = e.index + 1;
},
leftClick(e) {
uni.sendHostEvent('closeApp', e, (ret) => {
//发送消息成功回调
//console.log('关闭应用' + JSON.stringify(ret));
});
},
async login() {
//console.log(this.formData)
if (this.formData.scene == 1 && !this.formData.old_pwd) return Toast('旧密码不能为空');
if (this.formData.scene == 1 && !this.formData.pwd) return Toast('新密码不能为空');
if (this.formData.scene == 1 && !this.formData.pwd_confirm) return Toast('确认密码不能为空');
if (this.formData.scene == 1 && !this.formData.old_pwd == this.formData.pwd && !this.formData.pwd == this.formData.pwd_confirm &&
!this.formData.old_pwd == this.formData.pwd_confirm) return Toast('密码不一致,请确认后重新输入');
// 密码验证不通过,给出错误提示或其他处理
uni.showLoading({
title: '正在修改中'
})
let res = await changePassword(this.formData);
// //console.log(res, '11111111')
Toast(res.msg)
if(res.code==0){
uni.switchTab({
url:'/pages/user/user'
})
}
uni.hideLoading()
},
},
}
</script>
<style lang="scss">
.login {
width: 100vw;
height: 100vh;
position: relative;
overflow: hidden;
background-color: $theme-oa-color;
/* #ifdef H5 */
// background-image: url("../../static/img/login/login_back_img.png");
background-color: $theme-oa-color;
/* #endif */
// .bg-iamge {
// width: 100vw;
// height: 100vh;
// position: absolute;
// z-index: -99;
// }
.body {
position: absolute;
top: 45%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
align-items: center;
.title {
width: 694rpx;
height: 74rpx;
margin-top: 200rpx;
margin-bottom: 51rpx;
font-size: 53rpx;
font-weight: 500;
color: #ffffff;
line-height: 68rpx;
-webkit-background-clip: text;
}
::v-deep uni-input {
min-height: 0 !important;
}
.login-card {
width: 694rpx;
height: 723rpx;
background: #ffffff;
border-radius: 21rpx 21rpx 21rpx 21rpx;
opacity: 1;
box-sizing: border-box;
padding: 38.5rpx 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
.top {
display: flex;
justify-content: space-evenly;
flex-direction: column;
.item {
margin-bottom: 35rpx;
}
.text {
font-size: 32rpx;
font-weight: 500;
color: rgba(0, 0, 0, 0.8);
line-height: 35rpx;
}
.mobile,
.code {
width: 613rpx;
height: 112rpx;
background: #f5f5f5;
border-radius: 56rpx 56rpx 56rpx 56rpx;
opacity: 1;
padding: 0 45.56rpx;
box-sizing: border-box;
font-size: 28rpx;
font-weight: 400;
color: #333;
line-height: 35rpx;
}
.code {
display: flex;
justify-content: space-between;
align-items: center;
input {
font-size: 28rpx;
}
.get-code {
color: $theme-oa-color;
}
}
.btn {
display: flex;
justify-content: space-between;
}
}
.submit_btn {
width: 613rpx;
height: 112rpx;
background: $theme-oa-color;
border-radius: 56rpx 56rpx 56rpx 56rpx;
opacity: 1;
text-align: center;
line-height: 112rpx;
color: #ffffff;
font-size: 35rpx;
font-weight: 500;
}
.edit_btn {
width: 613rpx;
height: 112rpx;
background: #f5f5f5;
border-radius: 56rpx 56rpx 56rpx 56rpx;
opacity: 1;
text-align: center;
line-height: 112rpx;
color: #333;
font-size: 35rpx;
font-weight: 500;
}
}
}
}
</style>