123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383 |
- (function() {
- Vue.component('login-form', {
- template: `<div><div class="container-fluid">
- <div class="container" id="head">
- <div class="ptb15 top-banner">
- <img src="../../images/LOGO.png" class="hlogo" />
- <span class="qr-container">
- <img src="../../images/qr_code.png" class="qr_code" />
- <p class="c-f12 text-center">下载APP</p>
- </span>
- </div>
- </div>
- </div>
- <div class="container-fluid chahua-bg">
- <div class="chahua container">
- <div class="loginForm fr" :class="{'loginForm-active':!registerFlag}">
- <div class="tabs-container no-borders mtb20 plr30">
- <ul class="nav nav-tabs c-border-b">
- <li :class="{'active': type==1}" @click="changeType(1)">
- <a style="padding:10px 0px;margin-left:35px;margin-right: 35px;font-size: 20px;">密码登录</a>
- </li>
- <li :class="{'active': type==2}" @click="changeType(2)">
- <a style="padding:10px 0px;margin-left:25px;margin-right: 25px;font-size: 20px;">验证码登录</a>
- </li>
- </ul>
- <div class="tab-content">
- <div class="tab-pane" :class="{'active': type==1}">
- <div class="panel-body no-borders" style="padding: 0px;">
- <form id="form1" class="m-t" role="form" onsubmit="return false;">
- <div class="form-group">
- <input class="form-control" type="text" v-model="account" placeholder="请输入身份证号或者手机号码">
- </div>
- <div class="form-group">
- <input class="form-control" type="password" v-model="password" placeholder="请输入密码">
- </div>
- <div class="text-right c-323232" style="margin-top:-10px;">忘记密码</div>
- <button type="submit" class="btn btn-theme block full-width m-b" @click="login">登 录</button>
- <a type="button" class="btn btn-default block full-width m-b" @click="toggleRegister">注 册</a>
- </form>
- </div>
- </div>
- <div class="tab-pane" :class="{'active': type==2}">
- <div class="panel-body no-borders" style="padding: 0px;">
- <form id="form2" class="m-t" role="form" onsubmit="return false;">
- <div class="form-group">
- <input class="form-control" type="text" maxlength="11" v-model="mobile" placeholder="请输入手机号码">
- </div>
- <div class="form-group">
- <input class="form-control" type="text" v-model="imgcaptcha" placeholder="请输入图形验证码">
- <a class="getCaptcha" :class="{'disabled': countdown}" @click="getCaptcha">{{infoText}}</a>
- </div>
- <div class="form-group">
- <input class="form-control" type="text" v-model="captcha" placeholder="请输入短信验证码">
- <a class="getCaptcha" :class="{'disabled': countdown}" @click="getCaptcha">{{infoText}}</a>
- </div>
- <button type="submit" class="btn btn-theme block full-width m-b" @click="login">登 录</button>
- <a type="button" class="btn btn-default block full-width m-b" @click="toggleRegister">注 册</a>
- </form>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="registerForm fr" :class="{'registerForm-active':registerFlag}">
- <div class="ptb10 plr30 c-border-b c-f26">注册<span class="fr c-909090 c-f14 fhdl" @click="toggleRegister">返回登录</span></div>
- <form id="form" class="m-t plr30" role="form" onsubmit="return false;">
- <div class="form-group">
- <select class="form-control codeType" v-model="codeType">
- <option value="1">身份证</option>
- <option value="2">手机</option>
- </select>
- </div>
- <div class="form-group">
- <input class="form-control" type="text" :maxlength="maxLength" placeholder="请输入身份证号" v-model="idCardNo" id="IDCard">
- </div>
- <div class="form-group">
- <input class="form-control" placeholder="请输入登录密码" v-model="rPassword" type="password" minlength="6" maxlength="16">
- </div>
- <div class="form-group">
- <input class="form-control" placeholder="请确认登录密码" v-model="confirmPassword" type="password" minlength="6" maxlength="16">
- </div>
- <p class="c-909090" style="margin-top:-10px;">密码格式为6-16位,不允许有空格</p>
- <div class="checkbox">
- <label><input type="checkbox"
- v-model="toggle"> 阅读并接受<a href="#" target="_blank">《健康之路用户协议》</a>及<a href="#" target="_blank">《健康之路隐私保护声明》</a></label>
- </div>
- <button type="submit" class="btn btn-theme block full-width m-b" :class="{'disabled':!toggle}" @click="register">完成注册并登录</button>
- </form>
- </div>
- </div>
- </div>
- <div id="foot">
- <p>主办方:上饶市卫生与计划生育委员会 技术支持:健康之路(中国)信息技术有限公司 备案号登记号:赣ICP98273877号-1</p>
- <p>上饶市卫生信息中心 Copyright <span class="glyphicon glyphicon-copyright-mark"></span> 2009-2017 All Rights Reserved</p>
- </div></div>`,
- props: [],
- data: function() {
- return {
- type: 1, //记录选择的登录方式,1-手机号登录,2-验证码登录
- account: '17500000001',
- mobile: '',
- password: '123456',
- imgcaptcha: '',
- captcha: '',
- infoText: '获取验证码',
- countdown: false ,//是否在倒计时
- codeType: 1,
- idCardNo: "350526199501142015",
- rPassword: 'a123123',
- confirmPassword: "a123123",
- toggle: true,
- registerFlag:false,
- maxLength:18,
- }
- },
- methods: {
- changeType: function(val) {
- this.type = val;
- },
- getCaptcha: function() {
- //先校验手机号码是否正确
- var isMobile = isMobilePhone(this.mobile);
- if(!isMobile) {
- alert('请输入正确的手机号码!');
- return false;
- }
- setTimer(this);
- //发送请求
- // sendToGetCaptcha(this);
- },
- login: function() {
- var vm = this
- if(this.type == 1) {
- if(!vm.account) {
- console.log("账号不能为空!");
- return false;
- }
- if(!vm.password) {
- console.log("登录密码不能为空!");
- return false;
- }
- console.log(httpRequest)
- var data={
- grant_type: httpRequest.grant_type,
- client_id: httpRequest.client_id,
- username: vm.account,
- password: vm.password
- }
- console.log(data)
- loginAPI.accessToken(data).then(function(oauthInfo) {
- storage.setItem("oauthInfo", JSON.stringify(oauthInfo));
- var data1={
- userName:oauthInfo.user,
- accessToken: oauthInfo.accessToken
- }
- loginAPI.getUserInfo(data1).then(function(res) {
- console.log("登录成功");
- loginedList = [res.telephone]
- storage.setItem("loginedList", JSON.stringify(loginedList));
- storage.setItem("userAgent", JSON.stringify(res));
- vm.getJueSeData(res);
- }), function error(xhr, type, errorThrown) {
- if(type == "timeout" || type == "abort" || type == "error") {
- console.log("账号或密码错误");
- }
- }
- }).catch(function(e) {
- console.log("账号或密码错误")
- })
- } else {
- if(!vm.mobile) {
- console.log("手机号不能为空!");
- return false;
- }
- if(!vm.imgcaptcha) {
- console.log("图形验证码不能为空!");
- return false;
- }
- if(!vm.captcha) {
- console.log("手机验证码不能为空!");
- return false;
- }
- }
- },
- getJueSeData: function(userAgent) {
- var vm = this;
- //获取居民权限接口
- loginAPI.findByUserId({
- userId: userAgent.id
- }).then(function(data) {
- storage.setItem("roleList",JSON.stringify(data.detailModelList));//缓存角色列表
- // app.openWebviewExtras("../../home/html/home.html");//跳转到主页面
- })
- },
- register: function() {
- var vm = this
- if(!isCardNo(vm.idCardNo, vm.codeType)) {
- return
- }
- if(!vm.rPassword) {
- alert("登录密码不能为空!");
- return false;
- }
- if(!vm.confirmPassword) {
- alert("确认密码不能为空!");
- return false;
- }
- if(vm.rPassword.length < 6 && vm.rPassword.length > 16) {
- alert("登录密码需6-16位");
- return false;
- }
- if(vm.confirmPassword.length < 6 && vm.confirmPassword.length > 16) {
- alert("确认密码需6-16位");
- return false;
- }
- if(vm.rPassword != vm.confirmPassword) {
- alert("新密码和确认密码必须一致");
- return false;
- }
- if(!vm.toggle) {
- alert("未确认是否阅读并接受条款");
- return false;
- }
- // location.href = "../login/login.html"
- //连接注册后台接口
- var data={
- demographicId: vm.idCardNo,
- codeType:vm.codeType,
- telephone: vm.tel,
- password: vm.password,
- }
- var params = {
- userJsonData:JSON.stringify(data),
- appId: httpRequest.client_id
- }
- loginAPI.registe(params).then(function (res) {
- if (res.successFlg) {
- alert("注册成功");
- vm.login();
- } else {
- alert(res.errorMsg);
- }
- }).catch(function (err) {
- alert(err.errorMsg);
- })
-
- },
- toggleRegister:function(){
- var vm=this;
- vm.registerFlag=!vm.registerFlag
- }
- },
- watch: {
- Password: function(newVal, oldVal) {
- var val = newVal.toString();
- var reg = /\s+/g; //去除空格
- if(reg.test(val)) {
- this.Password = oldVal;
- }
- },
- confirmPassword: function(newVal, oldVal) {
- var val = newVal.toString();
- var reg = /\s+/g; //去除空格
- if(reg.test(val)) {
- this.confirmPassword = oldVal;
- }
- },
- codeType: function(newVal) {
- var vm=this;
- var val = newVal.toString();
- if(val == 1) {
- $("#IDCard").attr("placeholder", "请输入身份证号")
- vm.maxLength=18
- } else if(val == 2) {
- $("#IDCard").attr("placeholder", "请输入手机号码")
- vm.maxLength=11
- }
- }
- }
- })
- //验证码定时
- function setTimer(vm) {
- var seconds = 59;
- vm.countdown = true;
- timer = setInterval(function() {
- if(seconds == 0) {
- clearInterval(timer);
- timer = null;
- seconds = 59;
- vm.infoText = "获取验证码";
- vm.countdown = false;
- return;
- }
- seconds--;
- vm.infoText = seconds + "s后重新获取";
- }, 1000)
- }
- function isCardNo(card, codeType) {
- var isidcard = false
- if(codeType == 1) { // 身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,最后一位是校验位,可能为数字或字符X
- var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
- if(!reg.test(card)) {
- alert("身份证号输入不合法");
- } else {
- isidcard = true
- }
- }else{
- var reg = /0?(13|14|15|18|17)[0-9]{9}/;
- if(!reg.test(card)) {
- alert("手机号码输入不合法");
- } else {
- isidcard = true
- }
- }
- return isidcard
- }
- function sendToGetCaptcha(vm) {
- var url = "common/captcha",
- params = {
- mobile: vm.mobile,
- type: 5,
- captchaToken: 5
- };
- httpRequest.post(url, {
- data: params
- }).then(function(res) {
- if(res.status == 200) {
- tip('发送成功', 'add');
- } else {
- tip('获取验证码失败');
- }
- });
- }
- function getPublicKey(vm) {
- var url = "login/public_key";
- httpRequest.post(url).then(function(res) {
- if(res.status) {
- var mod = res.data.modulus;
- var exp = res.data.exponent;
- key = RSAUtils.getKeyPair(exp, "", mod);
- if(key) {
- encryedPwd = RSAUtils.encryStr(key, vm.password);
- login({
- mobile: vm.mobile,
- password: encryedPwd,
- platform: 4
- })
- } else {
- tip("获取数据失败")
- $submit.removeAttr('disabled')
- }
- } else {
- tip(res.msg);
- }
- })
- }
- function login(data) {
- httpRequest.post('login/doctor', {
- data: data
- }).then(function(res) {
- if(res.status == 200) {
- var docInfo = res.data;
- localoginlStorage.setItem(httpRequest.agentName, JSON.stringify({
- id: docInfo.id,
- uid: docInfo.uid,
- token: docInfo.token,
- imei: localStorage.getItem('WLYY_IMEI'),
- platform: 4
- }));
- //将用户的角色信息单独存储在localstorage中
- localStorage.setItem("userRole", JSON.stringify(docInfo.userRole));
- window.location.href = "../home/html/index.html";
- } else {
- tip(res.msg);
- }
- });
- }
- })()
|