123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134 |
-
- @{
- Layout = null;
- }
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>中联区卫问题登记</title>
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
- <link href="~/Content/Scripts/plugins/mui/css/mui.css" rel="stylesheet" />
- <script src="~/Content/Scripts/jquery.min.js"></script>
- <script src="~/Content/Scripts/plugins/mui/js/mui.js"></script>
- <script src="~/Content/Scripts/vue.js"></script>
- </head>
- <body>
- <style>
- .mui-bar-nav {
- background-color: #00aaff;
- }
- .mui-btn-positive, .mui-btn-success, .mui-btn-green {
- color: #fff;
- border: 1px solid #00aaff;
- background-color: #00aaff;
- }
- </style>
- <div id="vue">
- <header class="mui-bar mui-bar-nav">
- <a class="mui-action-back mui-icon mui-icon-back mui-pull-left" style="color:white"></a>
- <h1 class="mui-title" style="color:white">修改密码</h1>
- </header>
- <div class="mui-content ">
- <form class="mui-input-group" style="margin-top:2rem">
- <div class="mui-input-row">
- <input v-model="telephone" type="text" class="mui-input-clear" placeholder="请输入手机号码">
- </div>
- <div class="mui-input-row">
- <input v-model="password" type="password" class="mui-input-password" placeholder="请输入密码">
- </div>
- <div class="mui-input-row">
- <input v-model="passwordQ" type="password" class="mui-input-password" placeholder="请输入确认密码">
- </div>
- <div class="mui-input-row">
- <input v-model="Code" type="password" style="width:60%" class="mui-input" placeholder="请输入验证码">
- <button v-on:click="GetSMS" v-bind:disabled="SMS!='获取验证码'" type="button" class="mui-btn mui-btn-success" style="margin-top:5px;margin-right:5px;width:110px">{{SMS}}</button>
- </div>
- <button type="button" style="margin-top: 10px;" class="mui-btn mui-btn-success mui-btn-block btn_2" v-on:click="ModifyPassword">提交</button>
- </form>
- </div>
- </div>
- <script>
- var vm = new Vue({
- el: '#vue',
- data: {
- SMS: '获取验证码',
- telephone: '',
- password: '',
- passwordQ: '',
- Code: ''
- },
- methods: {
- GetSMS: function () {
- var that = this;
- if (!/^(13[0-9]|15[012356789]|17[0-9]|18[0-9]|14[57])[0-9]{8}|(170[059])[0-9]{6}$/i.test(this.telephone)) {
- mui.toast('请输入正确的手机号码', { duration: 'long', type: 'div' });
- this.telephone = '';
- return;
- }
- var validCode = true;
- var time = 60;
- if (validCode) {
- validCode = false;
- var t = setInterval(function () {
- time--;
- that.SMS = '重新获取(' + time + 's)';
- if (time == 0) {
- clearInterval(t);
- that.SMS = '获取验证码';
- validCode = true;
- }
- }, 1000);
- }
- $.post("/MobileAccount/GetSMSCode", { "tele": that.telephone }, function (data) {
- if (data.code == "200") {
- mui.toast('短信发送成功', { duration: 'long', type: 'div' });
- } else {
- mui.toast('短信发送失败', { duration: 'long', type: 'div' });
- }
- }).error(function (xhr, type, errorThrown) {
- mui.toast('系统错误', { duration: 'long', type: 'div' });
- })
- },
- ModifyPassword: function () {
- var that = this;
- if (!this.telephone || !this.password || !this.Code) {
- mui.toast('请填写完整信息', { duration: 'long', type: 'div' });
- return;
- }
- if (this.password != this.passwordQ) {
- mui.toast('两次密码不相等', { duration: 'long', type: 'div' });
- return;
- }
- var t = mui.showLoading("修改中..", "div");
- $.post("/MobileAccount/PasswordModifySubmit", { "telephone": that.telephone, "Code": that.Code, "password": that.password }, function (data) {
- mui.hideLoading(t);
- if (data.code == "200") {
- mui.toast('修改成功,正在跳转...', { duration: 'long', type: 'div' });
- mui.later(function () {
- window.location = "/MobileAccount/MobileProblemLogin?Tele=" + that.telephone;
- }, 1000)
- } else {
- mui.toast(data.msg, { duration: 'long', type: 'div' });
- }
- }).error(function (xhr, type, errorThrown) {
- mui.hideLoading(t);
- mui.toast('系统错误', { duration: 'long', type: 'div' });
- })
- }
- },
- mounted: function () {
- }
- });
- </script>
- </body>
- </html>
|