@{ Layout = null; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>ChangePwd</title> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=1" name="viewport" /> <link rel="stylesheet" href="~/web/css/base.css"> <link rel="stylesheet" href="~/web/css/loyalty.css"> <script src="~/web/js/jquery-1.11.3.min.js"></script> <script src="~/web/js/font.js"></script> <script src="~/vue/vue.js"></script> <script src="~/vue/axios.min.js"></script> <script src="~/vue/storage.js"></script> <script src="~/vue/jquery.validate.js"></script> <script src="~/layer/layer.js"></script> </head> <body> <div data-role="page"> <div data-role="header" data-position="fixed" data-tap-toggle="false"> <header class="head"> <div class="header"> <div class="headerTop topcenter"> <div class="boxflex topcenter"> <a href="/home/main" data-rel="back" data-ajax="false" data-role="none" class="backMenuBtn"><img src="~/web/images/icon_back.png" alt="" class="backImg"></a> <div class="headertit boxflex">Change Password</div> </div> </div> </div> </header> </div> <div data-role="main" id="app"> <div class="loyalty_sign_box"> <form action="" class="loyalty_sign_form loyalty_form" data-ajax="false" id="commentForm" method="post" novalidate="novalidate" validate-event="false"> <div class="loyalty_sign_block"> <div class="loyalty_sign_block_name">Original Password</div> <input type="text" name="oldPwd" id="oldPwd" class="loyaltyInput" data-role="none" placeholder="original password" v-model="oldPwd"> </div> <div class="loyalty_sign_block"> <div class="loyalty_sign_block_name">New Password</div> <input type="text" name="newPwd" id="newPwd" class="loyaltyInput" data-role="none" placeholder="new password:5-10 characters" v-model="newPwd"> </div> <div class="loyalty_sign_block"> <div class="loyalty_sign_block_name">New Password</div> <input type="text" name="confirmPwd" id="confirmPwd" class="loyaltyInput" data-role="none" placeholder="retype new password" v-model="confirmPwd"> </div> <div class="loyalty_btn_box"> <input type="button" value="Modify" data-role="none" class="radius_btn green_btn" id="btn" v-on:click="submitForm"> </div> </form> </div> </div> </div> <script> $(function () { $("#commentForm").validate({ onclick: true, onfocusout: false, onkeyup: false, onkeyup: false, onsubmit: false, errorPlacement: function (error, element) { layer.tips(error.html(), '#' + element[0].id, { tips: 3, tipsMore: true }); }, rules: { oldPwd: { required: true }, newPwd: { required: true }, confirmPwd: { equalTo: "#newPwd" } }, messages: { oldPwd: { required: "請輸入舊密碼！" }, newPwd: { required: "請輸入新密碼！" }, confirmPwd: { equalTo: "密碼不一致！" }, } }); }); var vm = new Vue({ el: '#app', data: { oldPwd: "", newPwd: "", confirmPwd: "", }, methods: { submitForm() { var flag = $("#commentForm").valid(); if (!flag) { return; } else { axios({ method: 'post', url: '/Home/ChangePwdJson', // 自定義請求頭 headers: { 'Content-Type': 'application/json;charset=utf-8', 'token': storage.get("token") }, // timeout: 1000, // 默認值是 `0` (永不超時) data: { old_pwd: this.oldPwd, new_pwd: this.newPwd, confirm_pwd: this.confirmPwd } }).then(res => { if (res.data.Code == 100) { location.href = "/home/main"; } else { if (res.data.Code == 104) { location.href = "/home/login"; } else { alert(res.data.Msg); } } }).catch(function (error) { // 請求失敗處理 console.log('error' + error); }); } } } }); </script> </body> </html>
