master
sgjj
6 years ago
parent
5b77df26f8
commit
b6cbc7fece
1 changed files with 135 additions and 0 deletions
@ -0,0 +1,135 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html> |
||||||
|
<head> |
||||||
|
<meta charset="UTF-8"> |
||||||
|
<title>登录</title> |
||||||
|
<#include "/include/head-file.ftl"/> |
||||||
|
<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script> |
||||||
|
<link rel="stylesheet" href="${base}/static/css/login.css"> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<div id="app"> |
||||||
|
<el-container> |
||||||
|
<el-header class="ms-header" height="100px"> |
||||||
|
<img src="${base}/static/images/logo.png"> |
||||||
|
<p>铭飞科技</p> |
||||||
|
<em></em> |
||||||
|
<span>欢迎登录</span> |
||||||
|
</el-header> |
||||||
|
<el-main class="ms-body"> |
||||||
|
<div class="ms-login"> |
||||||
|
<div class="ms-login-tab"> |
||||||
|
<span @click="loginActive='1'" :class="{'active':loginActive=='1'}">账号登录</span> |
||||||
|
<em></em> |
||||||
|
<span @click="loginActive='2'" :class="{'active':loginActive=='2'}">扫码登录</span> |
||||||
|
</div> |
||||||
|
<!--账号登录--> |
||||||
|
<el-form ref="form" :model="form" :rules="loginFormRule" label-width="0px" v-if="loginActive=='1'"> |
||||||
|
<el-form-item prop="username"> |
||||||
|
<el-input type="text" v-model="form.username" placeholder="用户名"> |
||||||
|
<template slot="append">@qq.com</template> |
||||||
|
</el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item prop="password"> |
||||||
|
<el-input type="password" v-model="form.password" placeholder="密码"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" width="100%" @click="login()" class="ms-login-but">登录</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<!--扫码登录--> |
||||||
|
<div v-show="loginActive=='2'" class="ms-login-code" id="login_container"> |
||||||
|
<img src="${base}/static/images/code.png"/> |
||||||
|
<span>请使用微信扫码二维码登录</span> |
||||||
|
<a>" 铭飞MS平台 "</a> |
||||||
|
</div> |
||||||
|
|
||||||
|
<!--扫码登录成功--> |
||||||
|
<div v-if="loginActive=='3'" class="ms-login-code-success"> |
||||||
|
<img class="phone" src="${base}/static/images/phone.png" /> |
||||||
|
<img class="success" src="${base}/static/images/success.png" /> |
||||||
|
<span>扫码成功!</span> |
||||||
|
<span>请在手机上确认登录</span> |
||||||
|
<a @click="loginActive='2'">返回二维码</a> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</el-main> |
||||||
|
<el-footer class="ms-footer"> |
||||||
|
<div> |
||||||
|
<span>关于我们</span> |
||||||
|
<em></em> |
||||||
|
<span>发展历程</span> |
||||||
|
<em></em> |
||||||
|
<span>联系我们</span> |
||||||
|
</div> |
||||||
|
<div> |
||||||
|
版权所有 ©铭飞科技有限公司2012-2019 保留一切权利。 |
||||||
|
</div> |
||||||
|
</el-footer> |
||||||
|
</el-container> |
||||||
|
</div> |
||||||
|
</body> |
||||||
|
</html> |
||||||
|
<script> |
||||||
|
new Vue({ |
||||||
|
el: "#app", |
||||||
|
data: { |
||||||
|
form: { |
||||||
|
username: "", |
||||||
|
password: "", |
||||||
|
}, |
||||||
|
loginActive: "1", //登录方式选中 |
||||||
|
loginFormRule: { |
||||||
|
username: [{ |
||||||
|
required: true, |
||||||
|
message: '请输入用户名', |
||||||
|
trigger: 'change' |
||||||
|
}, ], |
||||||
|
password: [{ |
||||||
|
required: true, |
||||||
|
message: '请输入密码', |
||||||
|
trigger: 'change' |
||||||
|
}, ], //表单验证 |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//点击登录 |
||||||
|
login: function() { |
||||||
|
var that = this; |
||||||
|
//调用表单验证 |
||||||
|
this.$refs.form.validate(function(valid) { |
||||||
|
if(valid) { |
||||||
|
//验证成功 |
||||||
|
var people = { |
||||||
|
username : that.form.username + "@qq.com", |
||||||
|
password : that.form.password |
||||||
|
} |
||||||
|
ms.http.post(ms.base + "/sso/login.do", people) |
||||||
|
.then(function(json) { |
||||||
|
if(json.result){ |
||||||
|
window.location.href=decodeURIComponent(ms.util.getParameter("backurl")); |
||||||
|
}else{ |
||||||
|
alert("登陆失败，\n1、账号或密码错\n2、或账号没有设置密码，请先扫描登陆后设置密码后重试"); |
||||||
|
} |
||||||
|
}), function(err) { |
||||||
|
console.log(err) |
||||||
|
} |
||||||
|
} else { |
||||||
|
//验证失败 |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted: function(){ |
||||||
|
var obj = new WxLogin({ |
||||||
|
id:"login_container", |
||||||
|
appid: "wx8c96aa3db4611395", |
||||||
|
scope: "snsapi_login", |
||||||
|
redirect_uri: "http%3A%2F%2Fms.mingsoft.net%2Fsso%2Fweixin.do%3Fbackurl%3D"+decodeURIComponent(ms.util.getParameter("backurl")), |
||||||
|
state:"", |
||||||
|
style: "black", |
||||||
|
href: "" |
||||||
|
}); |
||||||
|
} |
||||||
|
}) |
||||||
|
</script> |
||||||
Loading…
Reference in new issue