|
|
|
|
@ -68,6 +68,18 @@ |
|
|
|
|
<el-button size="small" type="primary" @click="phoneSubmit">确 定</el-button> |
|
|
|
|
</span> |
|
|
|
|
</el-dialog> |
|
|
|
|
<el-dialog title="请选择" :visible.sync="selectVisible" :close-on-click-modal="false" custom-class="select-dia" width="643px"> |
|
|
|
|
<ul class="port"> |
|
|
|
|
<li :class="{active: selectedRole === 1}" @click="selectRole(1)"> |
|
|
|
|
<img src="@/assets/img/login/male.png" alt=""> |
|
|
|
|
<p>学生端</p> |
|
|
|
|
</li> |
|
|
|
|
<li :class="{active: selectedRole === 2}" @click="selectRole(2)"> |
|
|
|
|
<img src="@/assets/img/login/female.png" alt=""> |
|
|
|
|
<p>教师管理端</p> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
</el-dialog> |
|
|
|
|
<v-footer ref="footer"></v-footer> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
@ -77,6 +89,7 @@ import vFooter from "@/layouts/footer"; |
|
|
|
|
import { mapActions } from "vuex"; |
|
|
|
|
import util from "@/libs/util"; |
|
|
|
|
import Setting from "@/setting"; |
|
|
|
|
import axios from "axios" |
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
data: function() { |
|
|
|
|
@ -110,7 +123,10 @@ export default { |
|
|
|
|
phoneCode: "", |
|
|
|
|
phoneDisabled: false, |
|
|
|
|
phoneTimer: null, |
|
|
|
|
phoneBtnText: "发送验证码" |
|
|
|
|
phoneBtnText: "发送验证码", |
|
|
|
|
selectVisible: false, |
|
|
|
|
selectedRole: '', |
|
|
|
|
token: '' |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
components: { |
|
|
|
|
@ -128,36 +144,69 @@ export default { |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
...mapActions("user", [ |
|
|
|
|
"login" |
|
|
|
|
"setInfo" |
|
|
|
|
]), |
|
|
|
|
getVerImg() { // 获取验证码图片 |
|
|
|
|
this.form.random = Math.floor(Math.random() * 999999999); |
|
|
|
|
this.verificationIMG = this.api.verification + "?random=" + `${this.form.random}`; |
|
|
|
|
}, |
|
|
|
|
typeClick(tab) { // 切换标签 |
|
|
|
|
console.log(tab) |
|
|
|
|
this.form.distinguish = tab.id |
|
|
|
|
this.form.account = ""; |
|
|
|
|
this.$refs.form.clearValidate(); |
|
|
|
|
this.loginRules.account[0].message = tab.id === "1" ? "请输入账号" : "请输入手机号/邮箱"; |
|
|
|
|
}, |
|
|
|
|
// 处理登录成功 |
|
|
|
|
setLogin() { |
|
|
|
|
util.local.set(Setting.tokenKey, this.token, Setting.tokenExpires) |
|
|
|
|
util.successMsg('登录成功') |
|
|
|
|
const redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : "/station" |
|
|
|
|
this.$router.replace(redirect) |
|
|
|
|
}, |
|
|
|
|
submitFormLogin() { // 提交登录 |
|
|
|
|
this.$refs.form.validate(valid => { |
|
|
|
|
if (valid) { |
|
|
|
|
this.form.distinguish = Number(this.form.distinguish); |
|
|
|
|
this.login(this.form).then(() => { |
|
|
|
|
let redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : "/station"; |
|
|
|
|
this.$router.replace(redirect); |
|
|
|
|
this.$post(this.api.logins, this.form).then((res) => { |
|
|
|
|
if (res.status == 200) { |
|
|
|
|
this.token = res.data.token |
|
|
|
|
console.log(11, res) |
|
|
|
|
// 查询是否是客户，如果是客户，则弹出选择端的页面去选择跳转到哪个端 |
|
|
|
|
axios.get(this.api.isClient, { |
|
|
|
|
headers: { |
|
|
|
|
token: res.data.token |
|
|
|
|
} |
|
|
|
|
}).then(res => { |
|
|
|
|
// 如果是客户 |
|
|
|
|
if (res.data.customer) { |
|
|
|
|
this.selectVisible = true |
|
|
|
|
} else { |
|
|
|
|
this.setLogin() |
|
|
|
|
} |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
} else { |
|
|
|
|
util.errorMsg(res.message) |
|
|
|
|
} |
|
|
|
|
}).catch(res => { |
|
|
|
|
if (res && res.status == 30001) { |
|
|
|
|
this.phoneVisible = true; |
|
|
|
|
} |
|
|
|
|
this.getVerImg(); |
|
|
|
|
this.form.code = ""; |
|
|
|
|
}); |
|
|
|
|
this.form.code = '' |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// 选择端 |
|
|
|
|
selectRole(val) { |
|
|
|
|
this.selectedRole = val |
|
|
|
|
if (val === 1) { |
|
|
|
|
this.setLogin() |
|
|
|
|
} else { |
|
|
|
|
location.href = `${location.origin}/admin/#/redirect?auth=${window.btoa(this.token)}` |
|
|
|
|
// location.href = 'http://192.168.31.125:8081/#/redirect?auth=' + btoa(this.token) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
phoneCountdown() { |
|
|
|
|
let count = 60; |
|
|
|
|
if (!this.phoneTimer) { |
|
|
|
|
@ -373,4 +422,37 @@ export default { |
|
|
|
|
text-align: center; |
|
|
|
|
color: #666; |
|
|
|
|
} |
|
|
|
|
.port { |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
padding: 60px 0; |
|
|
|
|
li { |
|
|
|
|
text-align: center; |
|
|
|
|
cursor: pointer; |
|
|
|
|
&:first-child { |
|
|
|
|
margin-right: 86px; |
|
|
|
|
} |
|
|
|
|
&:hover img { |
|
|
|
|
opacity: .9; |
|
|
|
|
} |
|
|
|
|
&.active span { |
|
|
|
|
background-color: #9278ff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
img { |
|
|
|
|
width: 122px; |
|
|
|
|
margin-bottom: 20px; |
|
|
|
|
} |
|
|
|
|
p { |
|
|
|
|
width: 88px; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
line-height: 21px; |
|
|
|
|
color: #fff; |
|
|
|
|
background-color: #e8e3ff; |
|
|
|
|
border-radius: 4px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/deep/.select-dia { |
|
|
|
|
margin-top: calc((100vh - 383px) / 2) !important; |
|
|
|
|
} |
|
|
|
|
</style> |
