123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284 |
- <template>
- <div class="view-product" style="overflow-y: hidden;">
- <div>
- <div class="ibox-content" style="padding-top: 20px">
- <layui-form v-if="step == 1">
- <template>
- <layui-item style="text-align: center;">
- <layui-inline-select
- label="修改方式"
- v-model="type"
- required="required"
- :items="types"></layui-inline-select>
- </layui-item>
- </template>
- </layui-form>
- <layui-form v-if="step == 2" style="text-align: center;">
- <layui-item v-if="type == 1">
- <layui-inline-input
- label="旧密码"
- type="password"
- placeholder="旧密码"
- lay-verify="required"
- v-model='originalPwd'
- ></layui-inline-input>
- </layui-item>
- <div v-if="type == 2" class="layui-form layui-form-pane">
- <div class="layui-form-item" style="padding-left: 102px;">
- <div class="layui-inline">
- <label title="验证码" class="layui-form-label layui-required">{{ '短信验证码' }}</label>
- <div class="layui-input-block">
- <input
- v-model="code"
- lay-verify="required"
- autocomplete="off"
- placeholder="验证码"
- class="layui-input"
- style="width: 192px;margin-right: 8px;"
- >
- </div>
- </div>
- <button
- @click="getCode"
- class="layui-btn layui-btn-primary btn_yz"
- style="float: right;margin-right: 12px;display: block;width: 90px;">{{ getMobileCodeText() }}</button>
- </div>
- </div>
- <layui-item>
- <layui-inline-input
- label="新密码"
- placeholder="新密码"
- type="password"
- lay-verify="required"
- v-model='newPwd'
- ></layui-inline-input>
- </layui-item>
- <layui-item>
- <layui-inline-input
- label="确认新密码"
- type="password"
- placeholder="确认新密码"
- lay-verify="required"
- v-model='surePwd'
- ></layui-inline-input>
- </layui-item>
- <hr class="layui-bg-blue" style="margin-bottom: 8px">
- <div>
- <ul class="pwd-rule">
- <li style="font-weight: bold;">密码规则:</li>
- <li>1. 密码长度:8-20位;</li>
- <li>2. 密码格式:必须包含大写字母、小写字母和数字,并且符合安全规定。</li>
- <li></li>
- </ul>
- </div>
- <!-- <layui-inline :style="{width:'100%'}" class="layui-footer">
- <div style="text-align:center;padding: 4px 0px;">
- <button class="layui-btn layui-btn-lg layui-btn-blue" @click="saveUpatePwd()" ><i class="fa fa-save"></i> 保存</button>
- <button class="layui-btn layui-btn-lg layui-btn-red" @click="closeUpdateFrame()"><i class="fa fa-times"></i> 关闭</button>
- </div>
- </layui-inline> -->
- </layui-form>
- </div>
- </div>
- <layui-inline class="btn-group-center step_1 layui-footer">
- <button v-if="step == 1" @click.stop="nextStep" class="layui-btn layui-btn-lg layui-btn-blue"><i class="fa fa-arrow-right"></i> 下一步</button>
- <button v-if="step == 2" class="layui-btn layui-btn-lg layui-btn-blue" @click="saveUpatePwd()" ><i class="fa fa-save"></i> 保存</button>
- <button @click="close" class="layui-btn layui-btn-lg layui-btn-red"><i class="fa fa-times"></i> 关闭</button>
- </layui-inline>
- </div>
- </template>
- <script>
- import { getDicts } from '@/api/dict'
- import { updatePwd, updatePwdLogout, getSmsCode, resetPwd } from '@/api/user'
- import {formatDate} from "@/utils/formatUtils";
- //import jssha from 'jssha';
- var jsSHA = require("jssha");
- import BaseModal from '@/views/base/BaseModal';
- export default {
- extends: BaseModal,
- data() {
- return {
- originalPwd:null,
- newPwd:null,
- surePwd:null,
- step: 1,
- type: 1,
- types: [
- {
- label: '旧密码',
- value: 1
- },
- {
- label: '短信验证码',
- value: 2
- }
- ],
- code: '',
- wait_timer: false,
- }
- },
- computed: {
-
- },
- mounted() {
- this.initData();
- },
- methods: {
- nextStep: function() {
- if (!this.type) {
- msg("请先选择修改方式");
- return;
- }
- this.step++;
- },
- initData: function () {
- var vParent = this.$parent;
- },
- closeUpdateFrame:function(){
- this.$layer.close(this.layerid);
- },
- saveUpatePwd: function() {
- if(this.type == 1 && (this.originalPwd=="" || this.originalPwd==null)){
- alert("旧密码不能为空");
- return;
- }
- if(this.newPwd=="" || this.newPwd==null){
- alert("新密码不能为空");
- return;
- }
- if(this.surePwd=="" || this.surePwd==null){
- alert("确认密码不能为空");
- return;
- }
- if(this.originalPwd==this.newPwd){
- alert("新密码和旧密码不能一样");
- return;
- }
- if(this.surePwd!=this.newPwd){
- alert("新密码和确认密码不一致");
- return;
- }
- if (this.type == 2) {
- let curUser = this.curUser || {};
- resetPwd(curUser.username, this.newPwd, this.surePwd, this.code).then(res => {
- alert("密码修改成功,请使用新密码重新登录系统!");
- var interval= setInterval(() => {
- updatePwdLogout().then(() => {
- location.reload();
- }).catch(() => { })
- clearInterval(interval);
- }, 2000);
- }).catch(error => {
-
- });
- return;
- }
- this.submitHandler((token) => {
- var originalPwd=this.originalPwd;
- var newPwd = this.newPwd;
- var surePwd = this.surePwd;
- var salt= token;
- var shaObj = new jsSHA("SHA-1", "TEXT");
- shaObj.update(originalPwd);
- originalPwd = shaObj.getHash("B64");
- originalPwd = "{SHA}"+originalPwd+salt;
- var shaObj2 = new jsSHA("SHA-1", "TEXT");
- shaObj2.update(originalPwd);
- originalPwd="{SHA}" + shaObj2.getHash("B64");
- var params = {originalPwd:originalPwd,newPwd:newPwd,surePwd:surePwd};
- updatePwd(params, token).then(result => {
- var router = this.$router;
- alert("密码修改成功,请使用新密码重新登录系统!");
- var interval= setInterval(() => {
- updatePwdLogout().then(() => {
- location.reload();
- }).catch(() => { })
- clearInterval(interval);
- }, 2000);
- }).catch((error) => {
- this.resetToken(error);
- });
- });
- },
- getCode: function() {
- // 加载层-风格4
- var layId = layer.msg("验证码获取中", {
- icon: 16,
- shade: 0.01,
- time: 0
- });
- let curUser = this.curUser || {};
- getSmsCode(this.account || curUser.username, 'Tx').then(res => {
- layer.close(layId);
- alert(res.msg);
- // 验证码倒计时
- var that = this;
- this.wait_timer = 120;
- var timer_interval = setInterval(function() {
- if (that.wait_timer > 0) {
- that.wait_timer--;
- } else {
- clearInterval(timer_interval);
- }
- }, 1000);
- }).catch(error => {
- // alert("获取验证码超时,获取失败。");
- layer.close(layId);
- });
- },
- // 验证码倒计时显示内容
- getMobileCodeText: function() {
- if (this.wait_timer > 0) {
- $('.btn_yz').addClass('layui-btn-disabled').attr('disabled',"true");
- return this.wait_timer + "s后获取";
- }
- if (this.wait_timer === 0) {
- $('.btn_yz').removeClass('layui-btn-disabled').removeAttr('disabled',"false");
- return "重新获取";
- }
- if (this.wait_timer === false) {
- return "获取验证码";
- }
- }
- },
- filters: {
- formatDate(dateTime) {
- let date = new Date(dateTime);
- return formatDate(date, 'YYYY-MM-DD HH:mm:ss')
- },
- formatDate1(dateTime) {
- let date = new Date(dateTime);
- return formatDate(date, 'YYYY')
- },
- },
- watch: {},
- }
- </script>
- <style scoped>
- .pwd-rule {
- text-align: left;
- }
- .pwd-rule li {
- padding-bottom: 4px;
- }
- .layui-footer {
- width: 100%;
- text-align: center;
- position: fixed;
- bottom: 0;
- height: 44px;
- line-height: 44px;
- padding: 0 15px;
- background-color: #eee;
- }
- </style>
|