修复默认皮肤

src/main/webapp/api/ms.people.min.js

@@ -0,0 +1,882 @@
+/**
+ * 用户基础信息
+ */
+(function () {
+    /**
+    *退出
+    ------
+    * @callmethod people.quit(function(){...});
+    * @param  {{type:function,have:true}}  回调方法 无返回值
+    * @examples 
+    * ...
+    * <a href="#" class="quitLogin">退出</a>
+    * ...
+    * ...
+    * @function 
+    * 无返回值
+    * @return {{type:none}} 无返回值
+    */
+    function quit(func) {
+        ms.http.get(ms.base + "/people/quit.do", {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+    /**
+    * 设置密码
+    ------
+    * @callmethod people.resetPassword(data,function(returnJson){...});
+    * @param {{type:String,have:true}} peoplePassword 用户密码
+    * @param {{type:function}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * ...
+    * @function 
+    * {"resultMsg":"","result":true}
+    * @return {{type:resultMsg}} 提示信息
+    * @return {{type:result}} true成功、false失败
+    */
+    function resetPassword(data, func) {
+        if (validator.isEmpty(data + "")) {
+            alert("数据不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.peoplePassword + "")) {
+            alert("密码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/people/resetPassword.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 验证用户接收的验证码
+    ------
+    * @callmethod people.checkPeopleCode(peopleCode,function(returnJson){...});
+    * @param {{type:string,have:true}} peopleCode 短信、邮箱验证码 
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * ...
+    * @function
+    * {code:"模块编码",result:true}
+    * @return {{type:code}} 编码
+    * @return {{type:result}} true成功、false失败
+    */
+    function checkPeopleCode(peopleCode, func) {
+        if (validator.isEmpty(peopleCode + "")) {
+            return;
+        }
+        ms.http.post(ms.base + "/people/checkPeopleCode.do", peopleCode, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 获取用户基本信息
+    ------
+    * @callmethod people.info(function(returnJson){...});
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * ...
+    * @function
+    * {
+    *	"peopleAutoLogin":0,
+    *	"peopleName":"mstest",
+    *	"peopleDateTime":"2016-05-08 13:14:00",
+    *	"peopleId":5201314,
+    * }
+    * @return {{type:peopleAutoLogin}} 自动登录多少天
+    * @return {{type:peopleName}} 用户名
+    * @return {{type:peopleDateTime}} 用户登录时间
+    * @return {{type:peopleId}} 用户编号
+    */
+    function info(func) {
+        ms.http.get(ms.base + "/people/info.do")
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 修改密码
+    ------
+    * 如果修改密码，在输入新密码后需要再次填入确认密码，需要前端自行判断新密码与再次确认密码是否一致，接口未做判断
+    * @callmethod people.changePassword(data,function(returnJson){...});
+    * @param {{type:string,have:true}} peopleOldPassword 原密码
+    * @param {{type:string,have:true}} peoplePassword 新密码
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * ...
+    * @function
+    * {code:"模块编码",result:true,resultMsg:""}
+    * @return {{type:code}} 模块编码
+    * @return {{type:result}} true成功、false失败
+    * @return {{type:resultMsg}} 错误信息
+    */
+    function changePassword(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if (validator.isEmpty(data.peopleOldPassword + "")) {
+            alert("原密码不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.peoplePassword + "")) {
+            alert("新密码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/people/changePassword.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+     * 验证用户名，手机号或邮箱
+     * @param data
+     * @returns
+     */
+    function checkValidator(data) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if ((validator.isEmpty(data.peopleName + "") || typeof (data.peopleName) == "undefined") &&
+            (validator.isEmpty(data.peoplePhone + "") || typeof (data.peoplePhone) == "undefined") &&
+            (validator.isEmpty(data.peopleMail + "") || typeof (data.peopleMail) == "undefined")) {
+            alert("用户名，手机号，邮箱必须有一个不为空");
+            return;
+        }
+        if (!validator.isEmpty(data.peoplePhone + "") && typeof (data.peoplePhone) != "undefined") {
+            if (!validator.isMobilePhone(data.peoplePhone, 'zh-CN')) {
+                alert("请输入正确的手机号");
+                return;
+            }
+        }
+        if (!validator.isEmpty(data.peopleMail + "") && typeof (data.peopleMail) != "undefined") {
+            if (!validator.isEmail(data.peopleMail)) {
+                alert("请输入正确的邮箱");
+                return;
+            }
+        }
+        if (validator.isEmpty(data.peoplePassword + "")) {
+            alert("密码不能为空");
+            return;
+        }
+    }
+    /**
+    * 注册
+    - -----
+    * 用户可以用名称、手机号、邮箱三者之一进行注册
+    * 几种注册流程的形式：
+    * 1、普通用户名称、登录密码，优先用户名注册,登录密码最长度范围3～30个字符；
+    * 2、邮箱、邮箱验证码、登录密码(邮箱必须是可接收验证码)；
+    * 3、手机号、短信验证码、登录密码；
+    * 注意： 1、注册页面必须存在图片验证码
+    * 2、如果需要接收验证码操作，需要使用“发送验证码”配合使用才能完成注册流程
+    * @callmethod register(data,function(returnJson){...});
+    * @param {{type:string}} peoplePhone 手机号
+    * @param {{type:string}} peopleName 用名称 用户名长度在3～30个字符之间，只能是字母数字混合
+    * @param {{type:string}} peopleMail 邮箱
+    * @param {{type:string,have:true}} peoplePassword 注册密码 
+    * @param {{type:strings,have:true}} rand_code 验证码
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="registe">
+    *	<input type="text" name="peopleName" /> <!--注册用户名-->
+    *	<input type="password" name="peoplePassword"/> <!--注册密码-->
+    *	<input type="password" name="rePassword"/> <!--确认注册密码，需要做前端验证，此接口不提供验证-->
+    *	<input type="text"  name="rand_code" /> <!--验证码-->
+    *  	<img id="registeCode"/> 
+    * </form>
+    * ...
+    * ...
+    * @function 
+    * {"resultMsg":"注册成功","result":true,"code":"07010100"}
+    * @return {{type:resultMsg}} 提示信息
+    * @return {{type:code}} 错误编码
+    * @return {{type:result}} true成功、false失败
+    */
+    function register(data, func) {
+        checkValidator(data); //验证表单信息
+        ms.http.post(ms.base + "/register.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err);
+        })
+    }
+    /**
+    *登录
+    ------
+    * 登录验证,登录必须存在验证码 
+    * @callmethod checkLogin(data,function(returnJson){...});
+    * @param {{type:string,have:true}} peopleName 用户名
+    * @param {{type:string,have:true}} peoplePassword 登录密码
+    * @param {{type:string,have:true}} rand_code 验证码
+    * @param {{type:string}} peopleAutoLogin 自动登录 如果大于0表示开启自动登录，1表示自动登录保留1天
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="login">
+    *	<input type="text" name="peopleName" /> <!--登录用户名，手机号或邮箱-->
+    *	<input type="password" name="peoplePassword"/> <!--登录密码-->
+    *	<input type="text"  name="rand_code" /> <!--验证码-->
+    *  	<img id="loginCode"/> 
+    * ...
+    * </form>
+    * ...
+    * ...
+    * @function 
+    * {"resultMsg":"{
+    *	\"peopleAppId\":0,
+    *	\"peopleAutoLogin\":0,
+    *	\"peopleId\":9020,
+    *	\"peopleMailCheck\":0,
+    *	\"peopleName\":\"mstest\",
+    *	\"peoplePhoneCheck\":0,
+    *	\"peopleState\":0}",
+    * "result":true,
+    * "code":"07010200"}
+    * @return {{type:code}} 错误编码
+    * @return {{type:result}} true成功、false失败
+    * @return {{type:resultMsg}} 提示信息
+    * @return {{type:resultData}} {"peopleAutoLogin":自动登录多少天,"peopleName":用户,"peopleId":用户编号,"peopleMail ":用户邮箱}
+    */
+    function checkLogin(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if (validator.isEmpty(data.peopleName + "")) {
+            alert("用户名不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.peoplePassword + "")) {
+            alert("密码不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.rand_code + "")) {
+            alert("验证码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/checkLogin.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+    /**
+    *验证登录状态
+    ------
+    * @callmethod checkLoginStatus(function(returnJson){...});
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * @function 
+    * {result:"false"}
+    * @return {{type:result}} true成功、false失败
+    */
+    function checkLoginStatus(func) {
+        ms.http.post(ms.base + "/checkLoginStatus.do")
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 发送验证码
+    ------
+    * 用户发送验证码，可以通过邮箱或手机发送
+    * @callmethod sendCode(data,function(returnJson){...});
+    * @param {{type:string,have:true}} receive  接收地址，只能是邮箱或手机号，邮箱需要使用邮箱插件，手机号需要短信插件
+    * @param {{type:string,have:true}} modelCode 对应邮件插件的模块编号
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="sendEmailCode">
+    *	<input type="text" name="receive" /> <!--接收地址，本案例为邮箱-->
+    *	<input type="text" name="modelCode" type="hidden" value="后台邮件插件模块编号"/>
+    * ...
+    * </form>
+    * ...
+    * ...
+    * @function 
+    * {result:"true"}
+    * @return {{type:result}} true成功、false失败
+    */
+    function sendCode(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if (validator.isEmpty(data.receive + "")) {
+            alert("接收地址不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.modelCode + "")) {
+            alert("对应邮件插件的模块编号不能为空");
+            return;
+        }
+        ms.http.get(ms.base + "/sendCode.do", data).then(func, (err) => {
+            console.log(err)
+        })
+    }
+    /**
+    * 验证用户接收的验证码
+    ------
+    * 验证用户输入的系统发送邮件或者短信验证码是否正确
+    * @callmethod checkSendCode(data,function(returnJson){...});
+    * @param {{type:string,have:true}} receive  接收地址，只能是邮箱或手机号，邮箱需要使用邮箱插件，手机号需要短信插件
+    * @param {{type:string,have:true}} code 对应接收的验证码
+    * @param  {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="sendEmailCode">
+    *	<input type="text" name="receive" /> <!--接收地址，本案例为邮箱-->
+    *	<input type="text" name="modelCode" type="hidden" value="后台邮件插件模块编号"/>
+    * ...
+    *	<input type="text" name="code" />
+    * ...
+    * </form>
+    * ...
+    * @function 
+    * {result:"true"}
+    * @return {{type:result}} true成功、false失败
+    */
+    function checkSendCode(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if (validator.isEmpty(data.receive + "")) {
+            alert("接收地址不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.code + "")) {
+            alert("接收的验证码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/checkSendCode.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 解绑邮箱验证用户接收的验证码
+    ------
+    * 解绑邮箱时，验证用户输入的系统发送邮件或者短信验证码是否正确
+    * @callmethod cancelBind(data,function(returnJson){...});
+    * @param {{type:string,have:true}} receive  接收地址，只能是邮箱或手机号，邮箱需要使用邮箱插件，手机号需要短信插件
+    * @param {{type:string,have:true}} code 对应接收的验证码
+    * @param  {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="sendEmailCode">
+    *	<input type="text" name="receive" /> <!--接收地址，本案例为邮箱-->
+    *	<input type="text" name="modelCode" type="hidden" value="后台邮件插件模块编号"/>
+    * ...
+    *	<input type="text" name="code" />
+    * ...
+    * </form>
+    * ...
+    * @function 
+    * {result:"true"}
+    * @return {{type:result}} true成功、false失败
+    */
+    function cancelBind(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if (validator.isEmpty(data.receive + "")) {
+            alert("接收的验证码不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.code + "")) {
+            alert("接收的验证码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/cancelBind.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+    /**
+    * 验证已保存用户
+    ------
+    * 验证用户名、手机号、邮箱是否已保存，同一时间只能判断一种，优先用户名称 
+    * 适用场景:
+    * 1、用户注册是对用户名、邮箱或手机号唯一性判断 
+    * 2、用户取回密码是判断账号是否存在
+    * @callmethod check(data,function(returnJson){...});
+    * @param  {{type:string}}  peopleName 用户名称验证
+    * @param  {{type:string}}  peopleMail 用户邮箱验证
+    * @param  {{type:string}}  peoplePhone 用户手机验证
+    * @param  {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    *...
+    * <form>
+    * ...
+    *	<input type="text" name="peopleName" /> <!--接收地址，本案例为用户名判断-->
+    * ...
+    * </form>
+    * ...
+    * @function 
+    * {result:"true"}
+    * @return {{type:code}} 模块编码
+    * @return {{type:result}} true存在｜false不存在或错误
+    * @return {{type:resultMsg}} 错误信息
+    */
+    function check(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        checkValidator(data); //验证表单
+        ms.http.post(ms.base + "/check.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 验证已绑定用户
+    ------
+    * 验证用户名、手机号、邮箱是否已保存并绑定，同一时间只能判断一种，优先用户名称 
+    * 适用场景:
+    * 1、用户注册是对用户名、邮箱或手机号唯一性判断 
+    * 2、用户取回密码是判断账号是否存在
+    * 3、用户绑定邮箱或者手机号验证，邮箱或手机号是否存在并已绑定
+    * @callmethod isExists(data,function(returnJson){...});
+    * @param  {{type:string}}  peopleName 用户名称验证
+    * @param  {{type:string}}  peopleMail 用户邮箱验证，注意：只验证绑定成功的邮箱 
+    * @param  {{type:string}}  peoplePhone 用户手机验证，注意：只验证绑定成功的手机  
+    * @param  {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form>
+    * ...
+    *	<input type="text" name="peopleName" /> <!--接收地址，本案例为用户名判断-->
+    * ...
+    * </form>
+    * ...
+    * super.load(["super.people"],function(mpeople){
+    *	mpeople.isExists($("form").serialize(),function(returnJson){
+    *		alert(JSON.stringify(returnJson));
+    *	});
+    * })
+    * @function 
+    * {result:"true"}
+    * @return {{type:code}} 模块编码
+    * @return {{type:result}} true存在｜false不存在或错误
+    * @return {{type:resultMsg}} 错误信息
+    */
+    function isExists(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        checkValidator(data); //验证表单信息
+        ms.http.post(ms.base + "/isExists.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+    /**
+    *验证图片验证码
+    ------
+    *例如流程需要短信验证或邮箱验证，为有效防止恶意发送验证码。提供给ajax异步请求使用 
+    *注意：页面提交对验证码表单属性名称必须是rand_code，否则无效
+    * @callmethod checkCode(rand_code,function(returnJson){...});
+    * @param {{type:strings,have:true}} rand_code 验证码
+    * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="picCode">
+    *	<input type="text"  name="rand_code" /> <!--填写验证码-->
+    *  	<img id="picCode"/> <!--图片验证码-->
+    * </form>
+    *...
+    * @function 
+    * {code:"错误编码",result:"true成功、false失败",resultMsg: "提示信息"}
+    * @return {{type:code}} 错误编码
+    * @return {{type:result}} true成功、false失败
+    * @return {{type:resultMsg}} 提示信息
+    */
+    function checkCode(rand_code, func) {
+        if (validator.isEmpty(rand_code + "")) {
+            alert("接收的验证码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/checkCode.do", rand_code, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 重置密码
+    ------
+    * 当用户忘记登录密码时可以通过注册绑定的邮箱或绑定的手机号进行取回，操作过程中需要通过邮件模块与短信模块发送验证码给用户
+    * 业务场景：用户输入手机号(邮箱)，点击发送验证码,发送间隔时间为60秒,用户将接收到的验证码输入提交,此接口不会对用户再次输入新密码进行判断，需要开发者做前端判断
+    * @callmethod resetPassword(data,function(returnJson){...});
+    * @param {{type:string,have:true}} peoplePassword 用户新密码 
+    * @param {{type:string,have:true}} rand_code  验证码
+    * @param  {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="resetPassword">
+    * ...
+    *	<input type="text" name="peoplePassword"/>
+    *	<input type="text"  name="peopleCode" /> <!--短信验证码验证码-->
+    *	<input type="text"  name="rand_code" /> <!--验证码-->
+    *  	<img id="resetPasswordCode"/> 
+    * ...
+    * </form>
+    * ...
+    * ...
+    * @function 
+    * {code:"0777700",result:true,resultMsg: "提示信息"}
+    * @return {{type:code}} 错误编码
+    * @return {{type:result}} true成功、false失败
+    * @return {{type:resultMsg}} 提示信息
+    */
+    function resetPassword(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if (validator.isEmpty(data.peoplePassword + "")) {
+            alert("用户新密码不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.peopleCode + "")) {
+            alert("接收的验证码不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.rand_code + "")) {
+            alert("图片验证码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/resetPassword.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+    * 验证重置密码收到的验证码
+    ------
+    * 忘记密码时需要将第一步验证用户时的接收验证码作为重置密码的验证码
+    * @callmethod checkResetPasswordCode(data,function(returnJson){...});
+    * @param {{type:string,have:true}} peopleCode  短信、邮箱验证码 
+    * @param {{type:string,have:true}} rand_code  验证码，可能会传递经过多个流程，具体根据业务确定
+    * @param  {{type:function,have:true}}  回调方法 返回值(returnJson)
+    * @examples 
+    * ...
+    * <form name="resetPassword">
+    * ...
+    *	<input type="text" name="peopleCode"/>
+    *	<input type="text"  name="rand_code" /> <!--验证码-->
+    *  	<img id="checkResetPasswordCodeCode"/> 
+    * ...
+    * </form>
+    * ...
+    * @function 
+    * {result:"true"}
+    * @return {{type:result}} true成功、false失败
+    */
+    function checkResetPasswordCode(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if (validator.isEmpty(data.peopleCode + "")) {
+            alert("接收的验证码不能为空");
+            return;
+        }
+        if (validator.isEmpty(data.rand_code + "")) {
+            alert("图片验证码不能为空");
+            return;
+        }
+        ms.http.post(ms.base + "/checkResetPasswordCode.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+    let people = {
+        quit: quit,
+        resetPassword: resetPassword,
+        checkPeopleCode: checkPeopleCode,
+        info: info,
+        changePassword: changePassword,
+        register: register,
+        sendCode: sendCode,
+        checkLogin: checkLogin,
+        checkLoginStatus: checkLoginStatus,
+        checkSendCode: checkSendCode,
+        cancelBind: cancelBind,
+        check: check,
+        isExists: isExists,
+        checkCode: checkCode,
+        resetPassword: resetPassword,
+        checkResetPasswordCode: checkResetPasswordCode,
+    }
+    window.ms.people = people;
+}());
+/**
+ * 用户基础信息
+ */
+(function () {
+    /**
+     * 获取用户详情
+     ------
+     * @callmethod people.info(function(returnJson){...});
+     * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+     * @examples 
+     * ...
+     * ...
+     * @function
+     * {
+     *	"peopleAutoLogin":0,
+     *	"peopleName":"mstest",
+     *	"peopleDateTime":"2016-05-08 13:14:00",
+     *	"peopleId":5201314,
+     * }
+     * @return {{type:peopleAutoLogin}} 自动登录多少天
+     * @return {{type:peopleName}} 用户名
+     * @return {{type:peopleDateTime}} 用户登录时间
+     * @return {{type:peopleId}} 用户编号
+     */
+    function info(func) {
+        ms.http.get(ms.base + "/people/user/info.do")
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    /**
+     * 更新手机号或邮箱
+     ------
+     * 更新用户信息中保存的手机号或者邮箱号，二者必须存在一个
+     * @callmethod people.update(data,function(returnJson){...});
+     * @param {{type:string,have:true}} peopleMail 邮箱 
+     * @param {{type:string}} peoplePhone 手机号 
+     * @param {{type:function,have:true}}  回调方法 返回值(returnJson)
+     * @examples 
+     * ...
+     * <form name="update">
+     * ...
+     *	<input type="text" name="peoplePhone"/>
+     * ...
+     * </form>
+     * ..
+     * ...
+     * @function
+     * {code:"模块编码",result:true,resultMsg:""}
+     * @return {{type:code}} 模块编码
+     * @return {{type:result}} true成功、false失败
+     * @return {{type:resultMsg}} 错误信息
+     */
+    function update(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        if ((validator.isEmpty(data.peoplePhone + "") || typeof (data.peoplePhone) == "undefined") &&
+            (validator.isEmpty(data.peopleMail + "") || typeof (data.peopleMail) == "undefined")) {
+            alert("用户名，手机号，邮箱必须有一个不为空");
+            return;
+        }
+        if (!validator.isEmpty(data.peoplePhone + "") && typeof (data.peoplePhone) != "undefined") {
+            if (!validator.isMobilePhone(data.peoplePhone, 'zh-CN')) {
+                alert("请输入正确的手机号");
+                return;
+            }
+        }
+        if (!validator.isEmpty(data.peopleMail + "") && typeof (data.peopleMail) != "undefined") {
+            if (!validator.isEmail(data.peopleMail)) {
+                alert("请输入正确的邮箱");
+                return;
+            }
+        }
+        ms.http.post(ms.base + "/people/user/update.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+
+    function saveUserIcon(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        ms.http.post(ms.base + "/people/user/saveUserIcon.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+
+    function updateUserIcon(data, func) {
+        if (validator.isEmpty(data + "")) {
+            return;
+        }
+        ms.http.post(ms.base + "/people/user/updateUserIcon.do", data, {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            })
+            .then(func, (err) => {
+                console.log(err)
+            })
+    }
+    let user = {
+        info: info,
+        update: update,
+        saveUserIcon: saveUserIcon,
+        updateUserIcon: updateUserIcon
+    }
+    window.ms.people.user = user;
+}());
+/**
+ * 普通用户收货地址信息
+ */
+(function () {
+    /**
+     * 用户收货地址列表
+     * @param data
+     * @param func
+     * @returns
+     */
+    function list(data, func) {
+        ms.http.get(ms.base + "/people/address/list.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+
+    /**
+     * 保存用户收货地址
+     * @param data
+     * @param func
+     * @returns
+     */
+    function save(data, func) {
+        ms.http.post(ms.base + "/people/address/save.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+
+    /**
+     *  更新用户收货地址
+     * @param data
+     * @param func
+     * @returns
+     */
+    function update(data, func) {
+        ms.http.post(ms.base + "/people/address/update.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+
+
+    /**
+     * 设置默认地址
+     * @param data
+     * @param func
+     * @returns
+     */
+    function setDefault(data, func) {
+        ms.http.post(ms.base + "/people/address/setDefault.do", data, {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }).then(func, (err) => {
+            console.log(err)
+        })
+    }
+
+    /**
+     * 通过peopleAddressId查询用户收货地址实体
+     * @param data
+     * @param func
+     * @returns
+     */
+    function get(data, func) {
+        ms.http.get(ms.base + "/people/address/get.do", data).then(func, (err) => {
+            console.log(err)
+        })
+    }
+
+
+    /**
+     * 根据收货地址id删除收货信息
+     * @param data
+     * @param func
+     * @returns
+     */
+    function del(data, func) {
+        ms.http.get(ms.base + "/people/address/delete.do", data).then(func, (err) => {
+            console.log(err)
+        })
+    }
+    let address = {
+        list: list,
+        save: save,
+        update: update,
+        setDefault: setDefault,
+        get: get,
+        del: del
+    }
+    window.ms.people.address = address;
+}());

src/main/webapp/templets/1/default/footer.htm

@@ -31,7 +31,6 @@ $(function(){
     $(".head-menu-list-li").hover(function(){
         $(this).find(".head-menu-son-list").fadeToggle();
     });
-    
     $('.ms-footer-right-img-weixin').hover(function(){
     	$('.ms-footer-right-weixin').toggle();
     });

src/main/webapp/templets/1/default/head-file.htm

@@ -13,14 +13,23 @@
 <script src="{ms:global.host/}/{ms:global.style/}/js/slider.js"></script>
 <script src="{ms:global.host/}/static/plugins/less/3.9.0/less.min.js"></script>
 <!--vue-懒加载-表单验证-->
-<script src="{ms:global.host/}/plugins/vue/2.3.3/vue.min.js"></script>
-<script src="{ms:global.host/}/plugins/validator/5.5.0/validator.min.js"></script>
+<script src="{ms:global.host/}/plugins/vue/2.6.9/vue.min.js"></script>
+<script src="{ms:global.host/}/plugins/validator/10.8.0/validator.min.js"></script>
+<!-- Element -->
+<link rel="stylesheet" href="{ms:global.host/}/plugins/element-ui/2.8.2/index.css">
+<script src="{ms:global.host/}/plugins/element-ui/2.8.2/index.js"></script>
 
 <link rel="stylesheet" type="text/css" href="{ms:global.host/}/{ms:global.style/}/css/animate.css">
 <script src="{ms:global.host/}/static/plugins/axios/0.18.0/axios.min.js"></script>
 <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.js"></script>
 <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.http.js"></script>
 <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.util.js"></script>
-<script type="text/javascript">
+<script src="{ms:global.host/}/api/ms.people.min.js"></script>
+<script src="{ms:global.host/}/static/plugins/plupload/plupload.full.min.js"></script>
+<script src="{ms:global.host/}/static/plugins/qs/6.6.0/qs.min.js"></script>
+<script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.upload.js"></script>
+<script>
 	window.http = ms.http;
-</script>
+	ms.base = "{ms:global.host/}";
+	ms.login = '{ms:global.host/}';
+</script>

src/main/webapp/templets/1/default/head.htm

@@ -68,7 +68,7 @@
                 </span>
                 <div class="topbar-info J_userInfo loginSuccess hide-default" v-show="isLogin" style="display: none;">
                     <a class="user-name" href="{ms:global.host/}/people/center.do">
-                        <img :src="'{ms:global.host/}'+ peopleInfo.puIcon" class="loginImg user_icon" onerror="this.src='http://cdn.mingsoft.net/global/images/msheader.png'">
+                        <img :src="'{ms:global.host/}/'+peopleInfo.puIcon" class="loginImg user_icon" onerror="this.src='http://cdn.mingsoft.net/global/images/msheader.png'">
                         <b class="userName ms-userName" v-text="peopleInfo.puNickname"></b>
                     </a>
                     <a href="javascript:;" class="quitLogin" @click="quitLogin">退出</a>
@@ -83,7 +83,9 @@
         data: {
             isLogin: "", //登录状态
             peopleInfo: "", //个人信息
+            imgUrl:"",
         },
+        
         mounted: function() {
             //获取个人信息
             var target = this;
@@ -91,13 +93,13 @@
                 type: "POST",
                 url: "{ms:global.host/}/checkLoginStatus.do",
                 success: function(msg) {
-                    target.isLogin = msg.result;
+                    target.isLogin = msg.result;  //判断用户是否登录，如登录，则target.isLogin===true
                     if(msg.result) {
                         $.ajax({
                             type: "GET",
                             url: "{ms:global.host/}/people/user/info.do",
                             success: function(msg) {
-                                target.peopleInfo = msg;
+                                target.peopleInfo = msg;  //target.peopleInfo为当前登录用户的基本信息
                             }
                         })
                     }

src/main/webapp/templets/1/default/people/center.htm

@@ -1,132 +1,206 @@
 <!DOCTYPE html>
 <html>
-    <head>
-         <#include "/head-file.htm" />
-        <script src="{ms:global.host/}/static/plugins/plupload/plupload.full.min.js"></script>
-        <script src="{ms:global.host/}/static/plugins/axios/0.18.0/axios.min.js"></script>
-        <script src="{ms:global.host/}/static/plugins/validator/10.8.0/validator.min.js"></script>
-        <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.js"></script>
-        <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.http.js"></script>
-        <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.util.js"></script>
-        <script src="{ms:global.host/}/static/plugins/ms/1.0.0/ms.upload.js"></script>
-        <script src="{ms:global.host/}/api/ms.people.min.js"></script>
-        <script>
-        	ms.base = "{ms:global.host/}";
-        	ms.login = '{ms:global.host/}';
-		</script>
-    </head>
-    <body>
-         <#include "/head.htm" />
-        <div class="ms-content" id="center-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="puNickname!='' && puNickname != undefined" v-if="puNickname!='' && puNickname != undefined" v-text="puNickname"></div>
-                        <div v-else v-text="'暂无昵称'"></div>
+<head>
+    <#include "/head-file.htm" />
+</head>
+
+<body>
+    <#include "/head.htm" />
+    <div class="ms-content" id="center-vue">
+        <div class="ms-content-main">
+            <div class="ms-content-left">
+                <div class="ms-content-left-info">
+                    <el-upload class="avatar-uploader" action="{ms:global.host/}/file/upload.do" :show-file-list="false"
+                        :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
+                    </el-upload>
+                    <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 class='active' href="{ms:global.host/}/people/center.do">基本资料</a>
                     </div>
-                    <div class="ms-content-left-list">
-                        <div class="ms-content-left-list-info">
-                            <a class='active' href="{ms:global.host/}/people/center.do">基本资料</a>
-                        </div>
-                        <div class="ms-content-left-list-pass">
-                            <a href="{ms:global.host/}/people/password-change.do">修改密码</a>
-                        </div>
+                    <div class="ms-content-left-list-pass">
+                        <a href="{ms:global.host/}/people/password-change.do">修改密码</a>
                     </div>
                 </div>
-                <div class="ms-content-right">
-                    <div class="ms-content-right-title">基本资料</div>
-                    <div class="ms-content-right-form">
-                        <form id="ms-center-form">
-                             <div class="ms-content-data">
-                                <span class="ms-content-nickname span">手机号</span>
-                                <input @keyup="chanageBackgroundColor" type="text" name="peoplePhone" v-model="peopleInfo.peoplePhone">
-                                <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-data">
-                                <span class="ms-content-nickname span">昵称</span>
-                                <input @keyup="chanageBackgroundColor" type="text" name="puNickname" v-model="peopleInfo.puNickname">
-                                <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-data">
-                                <span class="ms-content-mailbox span">邮箱</span>
-                                <input @keyup="chanageBackgroundColor" type="text" name="peopleMail" v-model="peopleInfo.peopleMail">
-                                <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>
-                        </form>
-                        <div class="ms-content-click" :disabled="butState != '确认'" :class="{'ms-but-disabled':butState != '确认'}" v-text="butState" @click="updateInfo">确认</div>
-                    </div>
+            </div>
+            <div class="ms-content-right">
+                <div class="ms-content-right-title">基本资料</div>
+                <div id="form" style="padding-top: 30px;width: 60%;">
+                    <el-form :model="peopleInfo" :rules="rules" ref="peopleInfo" label-width="100px"
+                        class="demo-peopleInfo" status-icon>
+                        <el-form-item label="手机号" prop="peoplePhone">
+                            <el-input v-model="peopleInfo.peoplePhone" placeholder="请输入 11 位手机号码" @blur="validate"></el-input>
+                        </el-form-item>
+                        <el-form-item label="昵称" prop="puNickname">
+                            <el-input v-model="peopleInfo.puNickname" placeholder="输入昵称，3~5位字符" @blur="validate"></el-input>
+                        </el-form-item>
+                        <el-form-item label="邮箱" prop="peopleMail">
+                            <el-input v-model="peopleInfo.peopleMail" placeholder="输入昵称，3~请输入您的邮箱" @blur="validate"></el-input>
+                        </el-form-item>
+                        <el-button style="margin-left: 100px;" type="primary" @click="updateInfo('peopleInfo')" :disabled="flag" v-text="submit">
+                        </el-button>
+                    </el-form>
                 </div>
             </div>
         </div>
-         <#include "/footer.htm" />
-    </body>
+    </div>
+    </div>
+    <#include "/footer.htm" />
+</body>
+
 </html>
 <script type="text/javascript">
-        var centerVue = new Vue({
-            el: "#center-vue",
-            data: {
-                peopleInfo: "", //个人信息
-                puNickname: "", //昵称
-                peoplePhone: "", //手机号
-                butState: "确认", //按钮文字
-                errorText: ['', ''], //错误信息
+    new Vue({
+        el: '#center-vue',
+        data: {
+            peopleInfo: "",
+            submit:"确认",
+            flag:true,
+            rules: {
+                peoplePhone: [{
+                        required: true,
+                        message: '请输入手机号码',
+                        trigger: 'blur'
+                    },
+                    {
+                        pattern: /^1[34578]\d{9}$/,
+                        message: '请输入正确的手机号码',
+                        trigger: 'blur'
+                    }
+                ],
+                puNickname: [{
+                        required: true,
+                        message: '请输入昵称',
+                        trigger: 'blur'
+                    },
+                    {
+                        min: 3,
+                        max: 5,
+                        message: '长度在 3 到 5 个字符',
+                        trigger: 'blur'
+                    }
+                ],
+                peopleMail: [{
+                        required: true,
+                        message: '请输入邮箱',
+                        trigger: 'blur'
+                    },
+                    {
+                        pattern: /^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/,
+                        message: '请输入正确的邮箱',
+                        trigger: 'blur'
+                    }
+                ],
             },
-            methods: {
-                //修改信息
-                updateInfo: function() {
-                   var target = this;
-                   this.butState = '提交中...';
-                   ms.people.user.update(target.data, function(returnJson) { //更新用户信息
-                        if(returnJson.result) {
-                            alert("修改成功");
-                            location.reload();
-                            //target.getPeopleInfo();
-                        } else {
-                            alert(returnJson.resultMsg);
-                        }
-                        target.butState = '确认';
-                    });
-                },
-                //获取个人信息
-                getPeopleInfo: function() {
-                    var target = this;
-                   ms.people.user.info(function(returnJson) {
-                        target.peopleInfo = returnJson;
-                        target.puNickname = returnJson.puNickname;
-                    })
-                },
-                //显示提示
-                showPrompt: function(text, date, type) {
-                    var target = this;
-                    this.errorText[type] = text;
-                    this.errorText = [this.errorText[0], this.errorText[1]];
-                    setTimeout(
-                        function() {
-                            target.errorText[type] = '';
-                            target.errorText = [target.errorText[0], target.errorText[1]];
-                        }, date
-                    )
-                },
-                chanageBackgroundColor: function() {
-                    if($('input[name="puNickname"]').val().length > 0 && 　$('input[name="peopleMail"]').val().length > 0) {
-                        $('.ms-content-click').css("background-color", "#009aff");
-                        $('.ms-content-click').css("pointer-events", 'visible');
-                        $('.ms-content-click').css("color", "#fff");
+        },
+
+        methods: {
+            updateInfo: function (formName) {
+                this.submit="提交中...";
+                var params = {
+                    peoplePhone: this.peopleInfo.peoplePhone,
+                    puNickname: this.peopleInfo.puNickname,
+                    peopleMail: this.peopleInfo.peopleMail,
+                    puIcon: this.peopleInfo.puIcon
+                }
+                ms.people.user.update(params, function (returnJson) {
+                    //更新用户信息
+                    if (returnJson.result) {
+                        alert("修改成功");
+                        location.reload();
                     } else {
-                        $('.ms-content-click').css("background-color", "#fafafa");
-                        $('.ms-content-click').css('pointer-events', "none");
-                        $('.ms-content-click').css("color", "#ddd");
+                        alert(returnJson.resultMsg);
+                        this.flag=true;
                     }
-                },
-
+                });
             },
-            mounted: function() {
-                this.getPeopleInfo();
+            validate() {
+                this.$refs.peopleInfo.validate((valid) => {
+                    if (valid) {
+                        this.flag=false;
+                    }
+                    else{
+                        this.flag=true;
+                    }
+                });
+            },
+            submitForm(formName) {
+                this.$refs[formName].validate((valid) => {
+                    if (!valid) {
+                        console.log('error submit!!');
+                        die;
+                    }
+                });
+            },
+            resetForm(formName) {
+                this.$refs[formName].resetFields();
+            },
+            //获取个人信息
+            getPeopleInfo: function () {
                 var target = this;
+                ms.people.user.info(function (returnJson) {
+                    target.peopleInfo = returnJson;
+                })
             },
-        })
-</script>
+            //上传头像成功后，更新用户信息
+            handleAvatarSuccess(res, file) {
+                this.peopleInfo.puIcon = file.response;
+                var params = {
+                    peopleMail: this.peopleInfo.peopleMail,
+                    puIcon: this.peopleInfo.puIcon
+                }
+                ms.people.user.update(params, function (returnJson) {
+                    //更新用户信息
+                    if (returnJson.result) {
+                        alert("头像修改成功");
+                        location.reload();
+                    } else {
+                        alert(returnJson.resultMsg);
+                    }
+                });
+            },
+            beforeAvatarUpload(file) {
+                const isJPG = file.type === 'image/jpeg';
+                const isLt2M = file.size / 1024 / 1024 < 2;
+
+                if (!isJPG) {
+                    this.$message.error('上传头像图片只能是 JPG 格式!');
+                }
+                if (!isLt2M) {
+                    this.$message.error('上传头像图片大小不能超过 2MB!');
+                }
+                return isJPG && isLt2M;
+            }
+        },
+        mounted: function () {
+            this.getPeopleInfo();
+            var target = this;
+        }
+    })
+</script>
+
+<style type="text/css">
+    .avatar-uploader .el-upload {
+        border: none !important;
+        cursor: pointer;
+        position: absolute;
+        z-index: 100;
+        width: 100px;
+        height: 100px;
+        padding: 0 !important;
+        left: 29%;
+        top: calc(50% - 10px);
+        transform: translateY(-50%);
+    }
+
+    .ms-content-left-info {
+        position: relative;
+    }
+</style>

src/main/webapp/templets/1/default/people/login.htm

@@ -1,202 +1,228 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <title>登录</title>
-        <meta charset="utf-8">
-        <link rel="stylesheet/less" type="text/css" href="{ms:global.host/}/{ms:global.style/}/less/login.less">
-        <link rel="stylesheet/less" type="text/css" href="{ms:global.host/}/{ms:global.style/}/less/base.less">
-				<script src="{ms:global.host/}/plugins/jquery/1.9.1/jquery-1.9.1.js"></script>
-        <script src="{ms:global.host/}/static/plugins/vue/2.3.3/vue.min.js"></script>
-        <script src="{ms:global.host/}/static/plugins/validator/5.5.0/validator.min.js"></script>
-        <script src="{ms:global.host/}/static/plugins/less/3.9.0/less.min.js"></script>
-    </head>
-    <body>
-        <div id="login">
-            <div class="ms-head">
-                <a href="{ms:global.host/}"><img src="{ms:global.host/}/{ms:global.style/}/images/logo.png" /></a>
-                <span class="ms-head-line"></span>
-                <span class="ms-head-welcome-login">欢迎登录</span>
-            </div>
-            <div class="ms-content">
-                <div class="ms-content-form" :class="{'ms-none':show == 'weixin'}">
-                    <div class="ms-login-title">
-                        <span class="ms-login-chinese-title">账号登录 /</span>
-                        <span class="ms-login-english-title">User login</span>
-                    </div>
-                    <div class="ms-login-error-text">
-                        <img src="{ms:global.host/}/{ms:global.style/}/images/error.png" style="display: none;" v-show="errorText != ''" />
-                        <span v-text="errorText" v-show="errorText != ''"></span>
-                    </div>
-                    <form id="ms-login-form">
-                        <input @keyup="chanageBackgroundColor" maxlength="20" @keyup.enter="login" type="text" class="ms-login-people-name" :class="{'ms-error':error == 'peopleName'}" name="peopleName" v-model="peopleName" placeholder="必填，6-20个字符" @blur="checkPeopleName" />
-                        <input @keyup="chanageBackgroundColor" maxlength="20" @keyup.enter="login" type="password" class="ms-login-people-name" :class="{'ms-error':error == 'peoplePassword'}" name="peoplePassword" v-model="peoplePassword" placeholder="必填，6-20个字符" @blur="checkPeoplePassword" />
-                        <div class="login-code">
-                            <input @keyup="chanageBackgroundColor" maxlength="4" @keyup.enter="login" type="text" class="login-code-input ms-login-float" name="rand_code" placeholder="必填，4个字符" v-model="peopleCode" :class="{'ms-error':error == 'peopleCode'}" @blur="checkPeopleCode" />
-                            <img src="{ms:global.host/}/{ms:global.style/}/images/code.jpg" class="login-code-img ms-login-float" @click="code">
-                            <p class="ms-login-float login-code-text">
-                                <span class="login-code-rompt">看不清?</span>
-                                <br/>
-                                <spna class="login-code-change" @click="code">换一张</span>
-                            </p>
-                        </div>
-                        <div class="ms-login-button" @click="login" :disabled="butState != '登录'" :class="{'ms-but-disabled':butState != '登录'}" v-text="butState"></div>
-                    </form>
+
+<head>
+    <title>登录</title>
+    <meta charset="utf-8">
+    <link rel="stylesheet/less" type="text/css" href="{ms:global.host/}/{ms:global.style/}/less/login.less">
+    <link rel="stylesheet/less" type="text/css" href="{ms:global.host/}/{ms:global.style/}/less/base.less">
+    <script src="{ms:global.host/}/plugins/jquery/1.9.1/jquery-1.9.1.js"></script>
+    <script src="{ms:global.host/}/static/plugins/vue/2.3.3/vue.min.js"></script>
+    <script src="{ms:global.host/}/static/plugins/validator/5.5.0/validator.min.js"></script>
+    <script src="{ms:global.host/}/static/plugins/less/3.9.0/less.min.js"></script>
+</head>
+
+<body>
+    <div id="login">
+        <div class="ms-head">
+            <a href="{ms:global.host/}"><img src="{ms:global.host/}/{ms:global.style/}/images/logo.png" /></a>
+            <span class="ms-head-line"></span>
+            <span class="ms-head-welcome-login">欢迎登录</span>
+        </div>
+        <div class="ms-content">
+            <div class="ms-content-form" :class="{'ms-none':show == 'weixin'}">
+                <div class="ms-login-title">
+                    <span class="ms-login-chinese-title">账号登录 /</span>
+                    <span class="ms-login-english-title">User login</span>
                 </div>
+                <div class="ms-login-error-text">
+                    <img src="{ms:global.host/}/{ms:global.style/}/images/error.png" style="display: none;"
+                        v-show="errorText != ''" />
+                    <span v-text="errorText" v-show="errorText != ''"></span>
+                </div>
+                <form id="ms-login-form">
+                    <input @keyup="chanageBackgroundColor" maxlength="20" @keyup.enter="login" type="text"
+                        class="ms-login-people-name" :class="{'ms-error':error == 'peopleName'}" name="peopleName"
+                        v-model="peopleName" placeholder="必填，6-20个字符" @blur="checkPeopleName" />
+                    <input @keyup="chanageBackgroundColor" maxlength="20" @keyup.enter="login" type="password"
+                        class="ms-login-people-name" :class="{'ms-error':error == 'peoplePassword'}"
+                        name="peoplePassword" v-model="peoplePassword" placeholder="必填，6-20个字符"
+                        @blur="checkPeoplePassword" />
+                    <div class="login-code">
+                        <input @keyup="chanageBackgroundColor" maxlength="4" @keyup.enter="login" type="text"
+                            class="login-code-input ms-login-float" name="rand_code" placeholder="必填，4个字符"
+                            v-model="peopleCode" :class="{'ms-error':error == 'peopleCode'}" @blur="checkPeopleCode" />
+                        <img src="{ms:global.host/}/{ms:global.style/}/images/code.jpg"
+                            class="login-code-img ms-login-float" @click="code">
+                        <p class="ms-login-float login-code-text">
+                            <span class="login-code-rompt">看不清?</span>
+                            <br />
+                            <spna class="login-code-change" @click="code">换一张</span>
+                        </p>
+                    </div>
+                    <div class="ms-login-button" @click="login" :disabled="butState != '登录'"
+                        :class="{'ms-but-disabled':butState != '登录'}" v-text="butState"></div>
+                </form>
             </div>
-            <div class="ms-footer">
-                <p>
-                    <span>
-                        <a href='{ms:global.url/}/53/index.html'>关于我们</a>
-                    </span>
-                    <span>|</span>
-                    <span>
-                        <a target="_blank" href='http://mingsoft.net/html/1//5527/index.html#faz'>发展历程</a>
-                    </span>
-                    <span>|</span>
-                    <span>
-                        <a target="_blank" href='{ms:global.url/}/19/index.html'>联系我们</a>
-                    </span>
-                </p>
-                <p>版权所有 @铭飞科技有限公司2012-2018保留一切权利</p>
-            </div>
         </div>
-    </body>
-    <script>
-        var loginVue = new Vue({
-            el: '#login',
-            data: {
-                show: "form", //切换显示的内容
-                errorText: "", //错误提示
-                error: "", //输入框错误的显示
-                peopleName: "", //用户名输入框
-                peoplePassword: "", //密码输入框
-                peopleCode:"",//验证码输入框
-                butState: "登录", //按钮文字
+        <div class="ms-footer">
+            <p>
+                <span>
+                    <a href='{ms:global.url/}/53/index.html'>关于我们</a>
+                </span>
+                <span>|</span>
+                <span>
+                    <a target="_blank" href='http://mingsoft.net/html/1//5527/index.html#faz'>发展历程</a>
+                </span>
+                <span>|</span>
+                <span>
+                    <a target="_blank" href='{ms:global.url/}/19/index.html'>联系我们</a>
+                </span>
+            </p>
+            <p>版权所有 @铭飞科技有限公司2012-2018保留一切权利</p>
+        </div>
+    </div>
+</body>
+<script>
+    var loginVue = new Vue({
+        el: '#login',
+        data: {
+            show: "form", //切换显示的内容
+            errorText: "", //错误提示
+            error: "", //输入框错误的显示
+            peopleName: "", //用户名输入框
+            peoplePassword: "", //密码输入框
+            peopleCode: "", //验证码输入框
+            butState: "登录", //按钮文字
+        },
+        watch: {
+            peopleName: function () {
+                var pattern = /[^\w\u4E00-\u9FA5]/ig;
+                if (!validator.isNull(this.peopleName) && this.peopleName.indexOf(" ") < 0 && validator
+                    .isLength(this.peopleName, {
+                        min: 6,
+                        max: 20
+                    }) && pattern.test(this.peopleName) == false && this.error == 'peopleName') {
+                    this.errorText = "";
+                    this.error = "";
+                }
             },
-            watch: {
-                peopleName: function() {
-                    var pattern = /[^\w\u4E00-\u9FA5]/ig;
-                    if(!validator.isNull(this.peopleName) && this.peopleName.indexOf(" ") < 0 && validator.isLength(this.peopleName, {
-                            min: 6,
-                            max: 20
-                        }) && pattern.test(this.peopleName) == false && this.error == 'peopleName') {
-                        this.errorText = "";
-                        this.error = "";
-                    }
-                },
-                peoplePassword: function() {
-                    if(!validator.isNull(this.peoplePassword) && this.peoplePassword.indexOf(" ") < 0 && validator.isLength(this.peoplePassword, {
-                            min: 6,
-                            max: 20
-                        }) && this.error == 'peoplePassword') {
-                        this.errorText = "";
-                        this.error = "";
-                    }
-                },
-                peopleCode: function() {
-                    if(!validator.isNull(this.peopleCode) && this.peopleCode.indexOf(" ") < 0 && this.peopleCode != 4 && this.error == 'peopleCode') {
-                        this.errorText = "";
-                        this.error = "";
-                    }
-                },
+            peoplePassword: function () {
+                if (!validator.isNull(this.peoplePassword) && this.peoplePassword.indexOf(" ") < 0 &&
+                    validator.isLength(this.peoplePassword, {
+                        min: 6,
+                        max: 20
+                    }) && this.error == 'peoplePassword') {
+                    this.errorText = "";
+                    this.error = "";
+                }
             },
-            methods: {
-                errorShow: function(msg, type) {
-                    this.errorText = msg;
-                    this.error = type;
-                },
-                //判断用户名
-                checkPeopleName: function() {
-                    var pattern = /[^\w\u4E00-\u9FA5]/ig;
-                    if(validator.isNull(this.peopleName)) {
-                        this.errorShow("用户名不能为空", 'peopleName');
-                        return false;
-                    } else if(this.peopleName.indexOf(" ") >= 0) {
-                        this.errorShow("用户名不能包含空格", 'peopleName');
-                        return false;
-                    } else if(!validator.isLength(this.peopleName, {
-                            min: 6,
-                            max: 20
-                        })) {
-                        this.errorShow("用户名为6~20个字符", 'peopleName');
-                        return false;
-                    } else if(pattern.test(this.peopleName)) {
-                        this.errorShow("用户名不能包含特殊字符", 'peopleName');
-                        return false;
-                    }
-                    return true;
-                },
-                //判断密码
-                checkPeoplePassword: function() {
-                    if(validator.isNull(this.peoplePassword)) {
-                        this.errorShow("密码不能为空", 'peoplePassword');
-                        return false;
-                    } else if(!validator.isLength(this.peoplePassword, {
-                            min: 6,
-                            max: 20
-                        })) {
-                        this.errorShow("密码长度在6~20位之间!", 'peoplePassword');
-                        return;
-                    } else if(this.peoplePassword.indexOf(" ") >= 0) {
-                        this.errorShow("密码是不能包含空格", 'peoplePassword');
-                        return false;
-                    }
-                    return true;
-                },
-                 //判断验证码
-                checkPeopleCode: function() {
-                    if(validator.isNull(this.peopleCode)) {
-                        this.errorShow("验证码不能为空", 'peopleCode');
-                        return false;
-                    } else if(this.peopleCode.length != 4) {
-                        this.errorShow("验证码为4位字符", 'peopleCode');
-                        return false;
-                    } else if(this.peopleCode.indexOf(" ") >= 0) {
-                        this.errorShow("验证码不能包括空格", 'peopleCode');
-                        return false;
-                    }
-                    return true;
-                },
-                //登录
-                login: function() {
-                    var target = this;
-                    if(this.checkPeoplePassword() && this.checkPeopleName() && this.checkPeopleCode) {
-                   			target.butState = '登录中...';
-                        $.ajax({
-                            type: "post",
-                            data: $("#ms-login-form").serialize(),
-                            url: "{ms:global.host/}/checkLogin.do",
-                            success: function(msg) {
-                                if(msg.result != true) {
-                                    alert(msg.resultMsg);
-                                    target.code();
-                                } else {
-                                    $("body").append("<form action='{ms:global.host/}/people/center.do' id='goForm'></form>");
-                                    $("#goForm").submit();
-                                }
-                                target.butState = '登录';
+            peopleCode: function () {
+                if (!validator.isNull(this.peopleCode) && this.peopleCode.indexOf(" ") < 0 && this
+                    .peopleCode != 4 && this.error == 'peopleCode') {
+                    this.errorText = "";
+                    this.error = "";
+                }
+            },
+        },
+        methods: {
+            errorShow: function (msg, type) {
+                this.errorText = msg;
+                this.error = type;
+            },
+            //判断用户名
+            checkPeopleName: function () {
+                var pattern = /[^\w\u4E00-\u9FA5]/ig;
+                if (validator.isNull(this.peopleName)) {
+                    this.errorShow("用户名不能为空", 'peopleName');
+                    return false;
+                } else if (this.peopleName.indexOf(" ") >= 0) {
+                    this.errorShow("用户名不能包含空格", 'peopleName');
+                    return false;
+                } else if (!validator.isLength(this.peopleName, {
+                        min: 6,
+                        max: 20
+                    })) {
+                    this.errorShow("用户名为6~20个字符", 'peopleName');
+                    return false;
+                } else if (pattern.test(this.peopleName)) {
+                    this.errorShow("用户名不能包含特殊字符", 'peopleName');
+                    return false;
+                }
+                return true;
+            },
+            //判断密码
+            checkPeoplePassword: function () {
+                if (validator.isNull(this.peoplePassword)) {
+                    this.errorShow("密码不能为空", 'peoplePassword');
+                    return false;
+                } else if (!validator.isLength(this.peoplePassword, {
+                        min: 6,
+                        max: 20
+                    })) {
+                    this.errorShow("密码长度在6~20位之间!", 'peoplePassword');
+                    return;
+                } else if (this.peoplePassword.indexOf(" ") >= 0) {
+                    this.errorShow("密码是不能包含空格", 'peoplePassword');
+                    return false;
+                }
+                return true;
+            },
+            //判断验证码
+            checkPeopleCode: function () {
+                if (validator.isNull(this.peopleCode)) {
+                    this.errorShow("验证码不能为空", 'peopleCode');
+                    return false;
+                } else if (this.peopleCode.length != 4) {
+                    this.errorShow("验证码为4位字符", 'peopleCode');
+                    return false;
+                } else if (this.peopleCode.indexOf(" ") >= 0) {
+                    this.errorShow("验证码不能包括空格", 'peopleCode');
+                    return false;
+                }
+                return true;
+            },
+            //登录
+            login: function () {
+                var target = this;
+                if (this.checkPeoplePassword() && this.checkPeopleName() && this.checkPeopleCode) {
+                    target.butState = '登录中...';
+                    $.ajax({
+                        type: "post",
+                        data: $("#ms-login-form").serialize(),
+                        url: "{ms:global.host/}/checkLogin.do",
+                        success: function (msg) {
+                            if (msg.result != true) {
+                                alert(msg.resultMsg);
+                                target.code();
+                            } else {
+                                $("body").append(
+                                    "<form action='{ms:global.host/}/people/center.do' id='goForm'></form>"
+                                );
+                                $("#goForm").submit();
                             }
-                        })
-                    }
-                },
-                code: function() {
-                    $(".login-code-img").attr("src", "{ms:global.host/}/code?t=" + (new Date).getTime())
-                },
-                chanageBackgroundColor: function(){
-                    if($('input[name="peopleName"]').val().length >= 6 &&　$('input[name="peoplePassword"]').val().length >= 6 && $('input[name="rand_code"]').val().length == 4){
-                      	$('.ms-login-button').css("background-color", "#009aff");
-                        $('.ms-login-button').css("pointer-events", 'visible');
-                        $('.ms-login-button').css("color", "#fff");
-                    }else{
-                      	$('.ms-login-button').css("background-color", "#fafafa");
-                        $('.ms-login-button').css('pointer-events', "none");
-                        $('.ms-login-button').css("color", "#ddd");
-                    }
-                 },
+                            target.butState = '登录';
+                        }
+                    })
+                }
             },
-            mounted: function() {
+            code: function () {
                 $(".login-code-img").attr("src", "{ms:global.host/}/code?t=" + (new Date).getTime())
+            },
+            chanageBackgroundColor: function () {
+                if ($('input[name="peopleName"]').val().length >= 6 && $('input[name="peoplePassword"]')
+                    .val().length >= 6 && $('input[name="rand_code"]').val().length == 4) {
+                    $('.ms-login-button').css("background-color", "#009aff");
+                    $('.ms-login-button').css("pointer-events", 'visible');
+                    $('.ms-login-button').css("color", "#fff");
+                } else {
+                    $('.ms-login-button').css("background-color", "#fafafa");
+                    $('.ms-login-button').css('pointer-events', "none");
+                    $('.ms-login-button').css("color", "#ddd");
+                }
+            },
+        },
+        mounted: function () {
+            $(".login-code-img").attr("src", "{ms:global.host/}/code?t=" + (new Date).getTime())
+            if (document.referrer == "http://localhost:8282/people/password-change.do") {
+                history.pushState(null, null, document.URL);
+                window.addEventListener('popstate', function () {
+                    history.pushState(null, null, document.URL);
+                });
+
             }
-        })
-    </script>
+        }
+    })
+</script>
+
 </html>

src/main/webapp/templets/1/default/people/password-change.htm

@@ -1,169 +1,285 @@
 <!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>
+
+<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">
+                        <el-upload class="avatar-uploader" action="{ms:global.host/}/file/upload.do" :show-file-list="false"
+                        :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
+                    </el-upload>
+                    <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">
-                        <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 class="ms-content-left-list-pass">
+                        <a class='active' href="{ms:global.host/}/people/password-change.do">修改密码</a>
                     </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>
+            <div class="ms-content-right">
+                <div class="ms-content-right-title">修改密码</div>
+                <div class="ms-content-right-form" style="width: 60%;padding-top: 30px;">
+                    <el-form :model="form" :rules="rules" ref="form" label-width="100px"
+                        class="demo-form" status-icon style="margin-left: 15px;">
+                        <el-form-item label="当前密码" prop="peopleOldPassword">
+                            <el-input v-model="form.peopleOldPassword" placeholder="必填，6~20位字符" @blur="validate">
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="新密码" prop="peoplePassword">
+                            <el-input v-model="form.peoplePassword" placeholder="必填，6~20位字符" @blur="validate">
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="确认密码" prop="rePeoplePassword">
+                            <el-input v-model="form.rePeoplePassword" placeholder="请再次输入新密码" @blur="validate">
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="验证码" prop="rand_code" style="position: relative;">
+                            <el-input v-model="form.rand_code" placeholder="必填，4位字符" @blur="validate"></el-input>
+                            <div id="code">
+                                <img :src="codeSrc" class="login-code-img" @click="code" />
+                                <div>
+                                    <span>看不清?</span>
+                                    <span class="img-code" @click="code" ref="imgCode">换一张</span>
+                                </div>
                             </div>
-                        </form>
-                        <div class="ms-content-click ms-content-click-password" :disabled="butText != '确认'" :class="{'ms-but-disabled':butText != '确认'}" @click="changePassword">确认</div>
-                    </div>
+                        </el-form-item>
+                        <el-button style="margin-left: 100px;" type="primary" @click="changePassword('form')"
+                            :disabled="flag" v-text="submit">
+                        </el-button>
+                    </el-form>
                 </div>
             </div>
         </div>
-        <#include "/footer.htm" />
-    </body>
+    </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: {}, //用户信息
+    var validatePass2 = (rule, value, callback) => {
+        if (value === '') {
+            callback(new Error('请再次输入密码'));
+        } else if (value !== V.form.peoplePassword) {
+            callback(new Error('两次输入密码不一致!'));
+        } else {
+            callback();
+        }
+    };
+    var V = new Vue({
+        el: "#pa-change-vue",
+        data: {
+            // 用户信息
+            peopleInfo:"",
+            //提交信息
+            form: {
                 peopleOldPassword: "", //用户旧密码
                 peoplePassword: "", //用户密码
                 rePeoplePassword: "", //确认密码
-                butText: "确认", //按钮文字
-                errorText: ['', '',''], //错误信息
+                rand_code: ""
             },
-            methods: {
-                //修改密码
-                changePassword: function() {
-                    var target = this;
-                    if(!validator.isLength(this.peopleOldPassword, {
-                            min: 6,
-                            max: 20
-                        })) {
-                        this.showPrompt("旧密码必须6-20位字符", 1000, 0);
-                        return;
+            flag: true,
+            submit: "确认",
+            codeSrc:"{ms:global.host/}/code",
+            rules: {
+                peopleOldPassword: [{
+                        required: true,
+                        message: '请输入旧密码',
+                        trigger: 'blur'
+                    },
+                    {
+                        min: 6,
+                        max: 20,
+                        message: '密码长度在 6 到 20 个字符',
+                        trigger: 'blur'
+
                     }
-                    if(this.peopleOldPassword.indexOf(" ") >= 0) {
-                        this.showPrompt("旧密码不能包含空格", 1000, 0);
-                        return;
+                ],
+                peoplePassword: [{
+                        required: true,
+                        message: '请输入新密码',
+                        trigger: 'blur'
+                    },
+                    {
+                        min: 6,
+                        max: 20,
+                        message: '密码长度在 6 到 20 个字符',
+                        trigger: 'blur'
                     }
-                    if(!validator.isLength(this.peoplePassword, {
-                            min: 6,
-                            max: 20
-                        })) {
-                        this.showPrompt("新密码必须6-20位字符", 1000, 1);
-                        return;
+                ],
+                rePeoplePassword: [{
+                        required: true,
+                        message: '请输入新密码',
+                        trigger: 'blur'
+                    },
+                    {
+                        validator: validatePass2,
+                        trigger: 'blur'
                     }
-                    if(this.peoplePassword.indexOf(" ") >= 0) {
-                        this.showPrompt("新密码不能包含空格", 1000, 1);
-                        return;
+                ],
+                rand_code: [{
+                        required: true,
+                        message: '请输入验证码',
+                        trigger: 'blur'
+                    },
+                    {
+                        min: 4,
+                        max: 4,
+                        message: '输入验证码位数错误',
+                        trigger: 'blur'
                     }
-                    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;
+                ]
+            },
+        },
+        methods: {
+            test: function () {
+                alert(1);
+            },
+            //更改验证码
+            code: function () {
+                this.codeSrc="{ms:global.host/}/code?t=" + (new Date).getTime();
+            },
+            //修改密码
+            changePassword: function (formName) {
+                this.submitForm(formName);
+                var target = this;
+                var params = {
+                    peopleOldPassword: this.form.peopleOldPassword,
+                    peoplePassword: this.form.peoplePassword,
+                    rePeoplePassword: this.form.rePeoplePassword,
+                    rand_code: this.form.rand_code
+                }
+                ms.people.changePassword(params, function (returnJson) {
+                    if (returnJson.result) {
+                        target.submit = "提交中..."
+                        setTimeout(function () {                            
+                            alert("密码修改成功，请重新登录")
+                            http.post("{ms:global.host/}/people/quit.do")
+                            location.href = "{ms:global.host/}/mcms/login.do";
+                        }, 500)
+
+                    } else if (returnJson.resultMsg == "密码错误!") {
+                        alert('原密码错误！');
+                        this.flag = true;
+                    } else if (returnJson.resultMsg == "验证码错误!") {
+                        alert("验证码错误！");
+                        target.$refs.imgCode.click();
+                        target.form.rand_code="",
+                        this.flag = true;
                     }
-                    if(this.peoplePassword != this.rePeoplePassword) {
-                        this.showPrompt("确认密码与密码不一致", 1000, 2);
-                        return;
+                })
+            },
+            submitForm(formName) {
+                this.$refs[formName].validate((valid) => {
+                    if (!valid) {
+                        console.log('error submit!!');
+                        die;
                     }
-                    if(this.peopleOldPassword == this.peoplePassword) {
-                        this.showPrompt("新密码与旧密码输入一致", 1000, 1);
+                });
+            },
+            validate() {
+                this.$refs.form.validate((valid) => {
+                    if (valid) {
+                        this.flag = false;
                     } 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 = "确认"
-                        })
+                        this.flag = true;
                     }
-                },
-                //显示提示
-                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");
+                });
+            },
+            handleAvatarSuccess(res, file) {
+                this.peopleInfo.puIcon = file.response;
+                var params = {
+                    peopleMail: this.peopleInfo.peopleMail,
+                    puIcon: this.peopleInfo.puIcon,
+                }
+                ms.people.user.update(params, function (returnJson) {
+                    //更新用户信息
+                    if (returnJson.result) {
+                        alert("头像修改成功");
+                        location.reload();
+                    } else {
+                        alert(returnJson.resultMsg);
                     }
-                 },
+                });
             },
-            mounted: function() {
-                //获取个人信息
-                var target = this;
-               ms.people.user.info(function(returnJson) {
-                    target.peopleInfo = returnJson;
-                })
+            beforeAvatarUpload(file) {
+                const isJPG = file.type === 'image/jpeg';
+                const isLt2M = file.size / 1024 / 1024 < 2;
+
+                if (!isJPG) {
+                    this.$message.error('上传头像图片只能是 JPG 格式!');
+                }
+                if (!isLt2M) {
+                    this.$message.error('上传头像图片大小不能超过 2MB!');
+                }
+                return isJPG && isLt2M;
             }
-        })
+        },
+
+
+        mounted: function () {
+            //获取个人信息
+            var target = this;
+            ms.people.user.info(function (returnJson) {
+                target.peopleInfo = returnJson;
+            })
+        }
     })
-</script>
+</script>
+<style type="text/css">
+    #code {
+        position: absolute;
+        right: -150px;
+        top: 0;
+        height: 40px;
+    }
+
+    #code>.login-code-img {
+        height: 40px;
+    }
+
+    #code>div {
+        font-size: 15px;
+        display: inline-block;
+        vertical-align: top;
+    }
+
+    #code>div>span {
+        display: block;
+        line-height: 1.4;
+    }
+
+    #code>div>.img-code {
+        cursor: pointer;
+        color: #00A5FF;
+    }
+    .avatar-uploader .el-upload {
+        border: none !important;
+        cursor: pointer;
+        position: absolute;
+        z-index: 100;
+        width: 100px;
+        height: 100px;
+        padding: 0 !important;
+        left: 29%;
+        top: calc(50% - 10px);
+        transform: translateY(-50%);
+    }
+
+    .ms-content-left-info {
+        position: relative;
+    }
+</style>

src/main/webapp/templets/1/default/search.htm

@@ -27,10 +27,10 @@
                     </ul>
                 </div>
                 <div class="ms-content-main-page">
-	              	 <a class="ms-content-main-page-first" href="{ms:page.index/}">首页</a>
-		             <a class="ms-content-main-page-upper" href="{ms:page.pre/}">上一页</a>
-		             <a class="ms-content-main-page-next" href="{ms:page.next/}">下一页</a>
-		             <a class="ms-content-main-page-last" href="{ms:page.last/}">末页</a>
+	              	 <a class="ms-content-main-page-first" href="{ms:global.url/}{ms:page.index/}">首页</a>
+		             <a class="ms-content-main-page-upper" href="{ms:global.url/}{ms:page.pre/}">上一页</a>
+		             <a class="ms-content-main-page-next" href="{ms:global.url/}{ms:page.next/}">下一页</a>
+		             <a class="ms-content-main-page-last" href="{ms:global.url/}{ms:page.last/}">末页</a>
 	            </div>
             </div>
         </div>