| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169 |
- <!DOCTYPE html>
- <html>
- <head>
- <#include "/head-file.htm" />
- </head>
- <body>
- <#include "/head.htm" />
- <div class="ms-content" id="pa-change-vue">
- <div class="ms-content-main">
- <div class="ms-content-left">
- <div class="ms-content-left-info">
- <img :src="'{ms:global.host/}/'+peopleInfo.puIcon" onerror='this.src="http://cdn.mingsoft.net/global/images/msheader.png"'>
- <div style="display: none;" v-show="peopleInfo.puNickname!='' && peopleInfo.puNickname != undefined" v-if="peopleInfo.puNickname!='' && peopleInfo.puNickname != undefined" v-text="peopleInfo.puNickname"></div>
- <div v-else v-text="'暂无昵称'"></div>
- </div>
- <div class="ms-content-left-list">
- <div class="ms-content-left-list-info">
- <a href="{ms:global.host/}/people/center.do">基本资料</a>
- </div>
- <div class="ms-content-left-list-pass">
- <a class='active' href="{ms:global.host/}/people/password-change.do">修改密码</a>
- </div>
- </div>
- </div>
- <div class="ms-content-right">
- <div class="ms-content-right-title">修改密码</div>
- <div class="ms-content-right-form">
- <form>
- <div class="ms-content-old-password">
- <span class="ms-content-old-password span">当前密码</span>
- <input @keyup="chanageBackgroundColor" type="password" v-model="peopleOldPassword" name="peopleOldPassword" placeholder="必填,请填写旧密码">
- <img class="ms-error-hide" src="{ms:global.host/}/{ms:global.style/}/images/error.png" :class="{'ms-error-show':errorText[0] != ''}" />
- <span class="ms-error-hide" v-text="errorText[0]" :class="{'ms-error-show':errorText[0] != ''}"></span>
- </div>
- <div class="ms-content-old-password">
- <span class="ms-content-new-password span">新密码</span>
- <input @keyup="chanageBackgroundColor" type="password" v-model="peoplePassword" name="peoplePassword" placeholder="必填,6-20位,不能与旧密码相同">
- <img class="ms-error-hide" src="{ms:global.host/}/{ms:global.style/}/images/error.png" :class="{'ms-error-show':errorText[1] != ''}" />
- <span class="ms-error-hide" v-text="errorText[1]" :class="{'ms-error-show':errorText[1] != ''}"></span>
- </div>
- <div class="ms-content-old-password">
- <span class="ms-content-old-password span">确认密码</span>
- <input @keyup="chanageBackgroundColor" type="password" v-model="rePeoplePassword" name="rePeoplePassword" placeholder="必填,6-20位,与新密码一致">
- <img class="ms-error-hide" src="{ms:global.host/}/{ms:global.style/}/images/error.png" :class="{'ms-error-show':errorText[2] != ''}" />
- <span class="ms-error-hide" v-text="errorText[2]" :class="{'ms-error-show':errorText[2] != ''}"></span>
- </div>
- </form>
- <div class="ms-content-click ms-content-click-password" :disabled="butText != '确认'" :class="{'ms-but-disabled':butText != '确认'}" @click="changePassword">确认</div>
- </div>
- </div>
- </div>
- </div>
- <#include "/footer.htm" />
- </body>
- </html>
- <script type="text/javascript">
- // $(function() {
- // $(".head-menu-list-li").hover(function() {
- // $(this).find(".head-menu-son-list").fadeToggle();
- // });
- // });
- ms.load(["ms", "ms.people", "ms.upload"], function(ms, mpeople, upload) {
- var paChangeVue = new Vue({
- el: "#pa-change-vue",
- data: {
- peopleInfo: {}, //用户信息
- peopleOldPassword: "", //用户旧密码
- peoplePassword: "", //用户密码
- rePeoplePassword: "", //确认密码
- butText: "确认", //按钮文字
- errorText: ['', '',''], //错误信息
- },
- methods: {
- //修改密码
- changePassword: function() {
- var target = this;
- if(!validator.isLength(this.peopleOldPassword, {
- min: 6,
- max: 20
- })) {
- this.showPrompt("旧密码必须6-20位字符", 1000, 0);
- return;
- }
- if(this.peopleOldPassword.indexOf(" ") >= 0) {
- this.showPrompt("旧密码不能包含空格", 1000, 0);
- return;
- }
- if(!validator.isLength(this.peoplePassword, {
- min: 6,
- max: 20
- })) {
- this.showPrompt("新密码必须6-20位字符", 1000, 1);
- return;
- }
- if(this.peoplePassword.indexOf(" ") >= 0) {
- this.showPrompt("新密码不能包含空格", 1000, 1);
- return;
- }
- if(!validator.isLength(this.rePeoplePassword, {
- min: 6,
- max: 20
- })) {
- this.showPrompt("确认密码必须6-20位字符", 1000, 2);
- return;
- }
- if(this.rePeoplePassword.indexOf(" ") >= 0) {
- this.showPrompt("确认密码不能包含空格", 1000, 2);
- return;
- }
- if(this.peoplePassword != this.rePeoplePassword) {
- this.showPrompt("确认密码与密码不一致", 1000, 2);
- return;
- }
- if(this.peopleOldPassword == this.peoplePassword) {
- this.showPrompt("新密码与旧密码输入一致", 1000, 1);
- } else {
- target.butText = "提交中..."
- ms.people.changePassword($("form").serialize(), function(returnJson) {
- if(returnJson.result) {
- alert("密码修改成功,请重新登录")
- $.ajax({
- type: "POST",
- url: "{ms:global.host/}/people/quit.do",
- success: function(msg) {
- }
- })
- location.href = "{ms:global.host/}/login.do";
- } else {
- target.showPrompt("旧密码错误", 1000, 0);
- target.butText = "确认"
- };
- target.butText = "确认"
- })
- }
- },
- //显示提示
- showPrompt: function(text, date, type) {
- var target = this;
- this.errorText[type] = text;
- this.errorText = [this.errorText[0], this.errorText[1], this.errorText[2]];
- setTimeout(
- function() {
- target.errorText[type] = '';
- target.errorText = [target.errorText[0], target.errorText[1], this.errorText[2]];
- }, date
- )
- },
- chanageBackgroundColor: function(){
- if($('input[name="peopleOldPassword"]').val().length >= 6 && $('input[name="peoplePassword"]').val().length >= 6 && $('input[name="rePeoplePassword"]').val().length >= 6){
- $('.ms-content-click-password').css("background-color", "#009aff");
- $('.ms-content-click-password').css("pointer-events", 'visible');
- $('.ms-content-click-password').css("color", "#fff");
- }else{
- $('.ms-content-click-password').css("background-color", "#fafafa");
- $('.ms-content-click-password').css('pointer-events', "none");
- $('.ms-content-click-password').css("color", "#ddd");
- }
- },
- },
- mounted: function() {
- //获取个人信息
- var target = this;
- ms.people.user.info(function(returnJson) {
- target.peopleInfo = returnJson;
- })
- }
- })
- })
- </script>
|