huoran
/
FE_huoran_data
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

fix

Browse Source
master
yujialong 4 months ago
parent 3bf5c1b98a
commit 7f18b99801
5 changed files with 493 additions and 496 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 13
      src/layouts/footer/index.vue
  2. 167
      src/pages/account/login/index.vue
  3. 46
      src/plugins/requests/index.js
  4. 4
      src/setting.js
  5. 3
      vue.config.js

13
src/layouts/footer/index.vue
Unescape View File

@ -9,11 +9,12 @@
<div class="footer">
<div class="info">
<!-- <span class="m-r-20">客服邮箱：service@huorantech.cn</span> -->
<span>联系人：郭经理 17671782660</span>
<span>联系人：金经理 15218726836</span>
</div>
<div class="copyright">
<span>© Copyright 2021 Dataforward 数据前瞻</span>
<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">粤ICP备20072679号</a>
<a href="https://beian.miit.gov.cn/#/Integrated/index"
target="_blank">粤ICP备20072679号</a>
</div>
</div>
</template>
@ -36,12 +37,12 @@ export default {
.footer {
padding: 17px 0 9px;
text-align: center;
background-color: #0F1D2E;
background-color: #0f1d2e;
.info {
margin-bottom: 7px;
font-size: 14px;
line-height: 20px;
color: #D7DFE7;
color: #d7dfe7;
}
.copyright {
font-size: 12px;
@ -49,10 +50,10 @@ export default {
line-height: 17px;
span {
margin-right: 20px;
color: #757F8A;
color: #757f8a;
}
a {
color:#757F8A;
color: #757f8a;
font-size: 12px;
&:hover {
color: #c7c7c7;

167
src/pages/account/login/index.vue
Unescape View File

@ -4,63 +4,42 @@
<div class="form">
<h6 class="title">欢迎使用请登录</h6>
<ul class="tab">
<li v-for="(item,index) in tabList"
:key="index"
:class="{active: form.distinguish == item.id}"
<li v-for="(item, index) in tabList" :key="index" :class="{ active: form.distinguish == item.id }"
@click="typeClick(item)">{{ item.label }}</li>
</ul>
<el-form :model="form"
:rules="rules"
ref="form"
style="margin-top: 20px">
<el-form :model="form" :rules="rules" ref="form" style="margin-top: 20px">
<!-- 学号工号 -->
<div v-show="!form.distinguish">
<el-form-item class="school-select"
prop="schoolId">
<el-form-item class="school-select" prop="schoolId">
<label class="label school"></label>
<el-select v-model="form.schoolId"
clearable
filterable
placeholder="请选择学校">
<el-option v-for="(item, i) in schoolList"
:key="i"
:label="item.schoolName"
<el-select v-model="form.schoolId" clearable filterable placeholder="请选择学校">
<el-option v-for="(item, i) in schoolList" :key="i" :label="item.schoolName"
:value="item.schoolId"></el-option>
</el-select>
</el-form-item>
<el-form-item class="flex-1"
prop="workNumber">
<el-form-item class="flex-1" prop="workNumber">
<label class="label account"></label>
<el-input v-model.trim="form.workNumber"
:placeholder="'请输入学号/工号'"
<el-input v-model.trim="form.workNumber" :placeholder="'请输入学号/工号'"
@keyup.enter.native="submit"></el-input>
</el-form-item>
</div>
<!-- 手机号登录 -->
<el-form-item v-show="form.distinguish === 1"
prop="account">
<el-form-item v-show="form.distinguish === 1" prop="account">
<label class="label account"></label>
<el-input v-model.trim="form.account"
placeholder="请输入账号"
@keyup.enter.native="submit"></el-input>
<el-input v-model.trim="form.account" placeholder="请输入账号" @keyup.enter.native="submit"></el-input>
</el-form-item>
<template v-if="form.distinguish === 2">
<el-form-item prop="account">
<label class="label account"></label>
<el-input v-model.trim="form.account"
placeholder="请输入手机号/邮箱"
@keyup.enter.native="submit"></el-input>
<el-input v-model.trim="form.account" placeholder="请输入手机号/邮箱" @keyup.enter.native="submit"></el-input>
</el-form-item>
<el-form-item prop="code">
<label class="label code"></label>
<div class="ver-code">
<el-input v-model="form.code"
placeholder="请输入验证码"
maxlength="6"
<el-input v-model="form.code" placeholder="请输入验证码" maxlength="6"
@keyup.enter.native="submit"></el-input>
<el-button type="text"
@click="sendPhoneCodeLogin"
:disabled="phoneDisabledLogin">{{ phoneBtnTextLogin }}
<el-button type="text" @click="sendPhoneCodeLogin" :disabled="phoneDisabledLogin">{{ phoneBtnTextLogin
}}
</el-button>
</div>
</el-form-item>
@ -68,88 +47,54 @@
<template v-if="form.distinguish !== 2">
<el-form-item prop="password">
<label class="password label"></label>
<el-input type="password"
placeholder="请输入密码"
v-model.trim="form.password"
@keyup.enter.native="submit">
<el-input type="password" placeholder="请输入密码" v-model.trim="form.password" @keyup.enter.native="submit">
</el-input>
</el-form-item>
<el-form-item prop="code">
<label class="label code"></label>
<el-input placeholder="请输入验证码"
v-model.trim="form.code"
@keyup.enter.native="submit">
<el-input placeholder="请输入验证码" v-model.trim="form.code" @keyup.enter.native="submit">
</el-input>
<img @click="getVerImg"
:src="verificationIMG"
class="ver-img"
alt="">
<img @click="getVerImg" :src="verificationIMG" class="ver-img" alt="">
</el-form-item>
</template>
<div v-show="!form.distinguish"
class="default-check">
<div v-show="!form.distinguish" class="default-check">
<el-checkbox v-model="setDefault">设置为默认学校</el-checkbox>
</div>
<el-button class="submit"
type="primary"
@click="submit">登录</el-button>
<el-button class="submit" type="primary" @click="submit">登录</el-button>
</el-form>
</div>
</div>
<el-dialog title="绑定手机号"
:visible.sync="phoneVisible"
:close-on-click-modal="false"
width="576px">
<el-dialog title="绑定手机号" :visible.sync="phoneVisible" :close-on-click-modal="false" width="576px">
<p class="tips">依据国家政策法规，需绑定手机号进行网络实名才可登录使用本平台</p>
<el-form label-width="60px">
<el-form-item label="手机号">
<el-input placeholder="请输入手机号"
v-model="phone"
maxlength="11"
@change="phoneChange"></el-input>
<el-input placeholder="请输入手机号" v-model="phone" maxlength="11" @change="phoneChange"></el-input>
</el-form-item>
<el-form-item label="验证码">
<div class="ver-code">
<el-input v-model="phoneCode"
placeholder="请输入验证码"
maxlength="6"></el-input>
<el-button style="top: 1px"
type="text"
@click="sendPhoneCode(1)"
<el-input v-model="phoneCode" placeholder="请输入验证码" maxlength="6"></el-input>
<el-button style="top: 1px" type="text" @click="sendPhoneCode(1)"
:disabled="binding === '' || phoneDisabled">{{ phoneBtnText }}</el-button>
</div>
</el-form-item>
</el-form>
<span slot="footer"
class="dialog-footer">
<el-button size="small"
@click="phoneVisible = false">取 消</el-button>
<el-button size="small"
type="primary"
@click="phoneSubmit">确 定</el-button>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="phoneVisible = false">取 消</el-button>
<el-button size="small" type="primary" @click="phoneSubmit">确 定</el-button>
</span>
</el-dialog>
<el-dialog title="请选择您要登录的用户"
:visible.sync="userVisible"
:close-on-click-modal="false"
custom-class="user-dia"
<el-dialog title="请选择您要登录的用户" :visible.sync="userVisible" :close-on-click-modal="false" custom-class="user-dia"
width="500px">
<p class="tips">该手机号已绑定以下用户信息</p>
<ul class="users">
<li :class="{isEnable: !user.isEnable}"
v-for="(user, i) in users"
:key="i"
@click="chooseUser(user)">
<li :class="{ isEnable: !user.isEnable }" v-for="(user, i) in users" :key="i" @click="chooseUser(user)">
<span>{{ user.schoolName }}，{{ user.userName }}，{{ user.workNumber }}{{ user.isEnable ? '' : '（已禁用）' }}</span>
<i class="el-icon-right"></i>
</li>
</ul>
</el-dialog>
<el-dialog :visible.sync="infoVisible"
:close-on-click-modal="false"
:show-close="false"
custom-class="info-dia"
<el-dialog :visible.sync="infoVisible" :close-on-click-modal="false" :show-close="false" custom-class="info-dia"
width="400px">
<div class="info-header">
<i class="el-icon-warning"></i>
@ -158,26 +103,20 @@
<div class="info-wrap">
<p class="tips">该手机号已与以下用户绑定</p>
<ul class="users">
<li v-for="(user, i) in infos"
:key="i">
<li v-for="(user, i) in infos" :key="i">
<span>{{ user.userName }}（{{ user.schoolName }}）</span>
</li>
</ul>
<div class="info-footer">
<el-button size="small"
type="primary"
@click="bindPhone">是本人，继续绑定</el-button>
<el-button class="unbind"
size="small"
@click="unbindPhone">不是本人，解绑以上用户并绑定新用户</el-button>
<el-button size="small" type="primary" @click="bindPhone">是本人，继续绑定</el-button>
<el-button class="unbind" size="small" @click="unbindPhone">不是本人，解绑以上用户并绑定新用户</el-button>
</div>
</div>
</el-dialog>
<div class="footer">
<div class="copyright">
<a href="https://beian.miit.gov.cn/#/Integrated/index"
target="_blank">粤ICP备20072679号</a>
<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">粤ICP备20072679号</a>
</div>
</div>
</div>
@ -540,14 +479,17 @@ export default {
min-height: 100%;
background-color: #f3f6fa;
}
.ver-code {
position: relative;
.el-button {
position: absolute;
top: 10px;
right: 10px;
}
}
.login {
min-height: calc(100vh - 70px);
padding-top: calc((100vh - 611px) / 2);
@ -557,12 +499,14 @@ export default {
url(../../../assets/img/shapes/shape4.png) (right 50%) / auto no-repeat,
url(../../../assets/img/shapes/shape5.png) (right 80%) / auto no-repeat,
url(../../../assets/img/shapes/shape6.png) (right bottom) / auto no-repeat;
.tab {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 24px;
border-bottom: 2px solid #e1e6f2;
li {
padding: 18px 0;
margin-bottom: -1px;
@ -570,25 +514,30 @@ export default {
color: #555;
cursor: pointer;
border-bottom: 4px solid transparent;
&:last-child {
margin-right: 0;
}
&.active {
color: $main-color;
border-bottom-color: $main-color;
}
}
}
.items {
display: flex;
align-items: center;
}
.form {
width: 436px;
padding: 38px 38px 60px;
margin: 0 auto 0;
border-radius: 6px;
background-color: #fff;
.title {
margin-bottom: 25px;
font-size: 26px;
@ -596,9 +545,11 @@ export default {
letter-spacing: 4px;
}
}
/deep/.el-form-item {
margin-bottom: 20px;
}
/deep/.el-input__inner {
position: relative;
height: 52px;
@ -608,12 +559,15 @@ export default {
border: 1px solid #e1e6f2;
border-radius: 4px !important;
}
.default-check {
text-align: right;
}
.el-select {
width: 100%;
}
.label {
z-index: 1;
position: absolute;
@ -623,32 +577,39 @@ export default {
height: 18px;
background: url(../../../assets/img/login/account.png) 0 0/100% 100% no-repeat;
}
.school {
background-image: url(../../../assets/img/login/school.png);
}
.workNumber {
width: 17px;
background-image: url(../../../assets/img/login/workNumber.png);
}
.password {
top: 18px;
background-image: url(../../../assets/img/login/password.png);
}
.code {
top: 18px;
background-image: url(../../../assets/img/login/code.png);
}
.ver-img {
position: absolute;
top: 1px;
right: 1px;
}
/deep/.el-form-item__error {
top: 105%;
left: auto;
right: 0;
color: #ffa94e;
}
.submit {
width: 100%;
height: 48px;
@ -661,31 +622,37 @@ export default {
border: 0;
}
}
.copyright {
padding: 18px 0;
font-size: 12px;
text-align: center;
background-color: #f3f6fa;
a {
color: #b1b4b8;
font-size: 12px;
&:hover {
opacity: 0.8;
}
}
}
.tips {
margin: 0 0 10px 5px;
font-size: 14px;
text-align: center;
color: #666;
}
/deep/.user-dia {
.tips {
margin-bottom: 20px;
text-align: center;
color: #666;
}
.users {
li {
display: flex;
@ -697,27 +664,33 @@ export default {
font-size: 14px;
background-color: #ebeef5;
cursor: pointer;
&.isEnable {
color: #c0c4cc;
background-color: #f5f7fa;
cursor: not-allowed;
}
&:last-child {
margin-bottom: 0;
}
&:hover {
background-color: #d3e0ff;
}
i {
font-size: 16px;
}
}
}
}
/deep/.info-dia {
.el-dialog__header {
border-bottom: 0;
}
.info-header {
position: absolute;
top: 20px;
@ -726,38 +699,46 @@ export default {
font-size: 16px;
color: #333;
}
.el-icon-warning {
margin-right: 10px;
color: #e6a23c;
font-size: 24px;
}
.info-wrap {
padding: 10px 33px;
}
.users {
max-height: 125px;
margin-top: 20px;
overflow: auto;
li {
margin: 5px;
font-size: 14px;
color: #333;
}
}
.info-footer {
display: flex;
justify-content: space-between;
// align-items: center;
margin-top: 20px;
}
.el-button {
width: 142px;
}
.unbind {
white-space: normal;
line-height: 1.6;
}
}
@media (max-height: 680px) {
.wrap .login {
padding: 40px 0;

46
src/plugins/requests/index.js
Unescape View File

@ -1,5 +1,5 @@
import axios from 'axios'
import util from '@/libs/util'
import Util from '@/libs/util'
import router from '@/router/index'
import Setting from '@/setting'
import store from '@/store'
@ -18,17 +18,17 @@ let check = true
let checkTimer = null
// 检测账号是否被禁用，如果禁用则提示并退出登录
function checkDisabled () {
const token = util.local.get(Setting.tokenKey)
const token = Util.local.get(Setting.tokenKey)
if (!token) return false
check = false
axios.get(baseURL + api.accountIsDisabled + '?token=' + token, {
token: util.local.get(Setting.tokenKey),
token: Util.local.get(Setting.tokenKey),
headers: {
token
}
}).then(res => {
if (res.data) {
util.errorMsg('账号被禁用，已强制退出，有疑问请联系管理员')
Util.errorMsg('账号被禁用，已强制退出，有疑问请联系管理员')
setTimeout(() => {
store.dispatch('user/logout')
}, 1500)
@ -37,7 +37,7 @@ function checkDisabled () {
}
// 请求拦截器
service.interceptors.request.use(config => {
let token = util.local.get(Setting.tokenKey)
let token = Util.local.get(Setting.tokenKey)
if (token) config.headers.token = token
let storeSchoolId = store.state.user.schoolId
let routeSchoolId = router.app._route.query.schoolId
@ -51,7 +51,7 @@ service.interceptors.request.use(config => {
}, 2000)
return config
}, err => {
util.errorMsg({
Util.errorMsg({
message: '退出登陆',
onClose: function () {
router.push({ name: '/login' })
@ -66,6 +66,20 @@ service.interceptors.response.use(
const res = response.data
if (res.status == 200) {
return Promise.resolve(res).catch(e => { })
} else if (res.code === 401) {
// 账号互踢
if (!logouted) {
Util.local.remove(Setting.storeKey)
Util.local.remove(Setting.tokenKey)
Util.errorMsg(res.msg.includes('顶') ? '您的账号已在其他设备登录，您已被迫下线！' : '登录过期，请重新登录！')
setTimeout(() => {
router.replace({
path: '/login'
})
logouted = 0
}, 1500)
logouted = 1
}
} else if (res.status == 30001) {
return Promise.resolve(res).catch(e => { })
} else if (!res.status) {
@ -78,7 +92,7 @@ service.interceptors.response.use(
})
return Promise.reject(res)
} else {
util.errorMsg(res.message)
Util.errorMsg(res.message)
res.message === '该账号无权限！' && setTimeout(() => {
store.dispatch('user/logout')
}, 1500)
@ -93,9 +107,9 @@ service.interceptors.response.use(
// 未登录则跳转登录页面，并携带当前页面的路径
// 在登录成功后返回当前页面，这一步需要在登录页操作。
case 401:
util.local.remove(Setting.storeKey)
util.local.remove(Setting.tokenKey)
util.errorMsg('登录过期，请重新登录')
Util.local.remove(Setting.storeKey)
Util.local.remove(Setting.tokenKey)
Util.errorMsg('登录过期，请重新登录')
setTimeout(() => {
router.replace({
path: '/login'
@ -103,16 +117,16 @@ service.interceptors.response.use(
}, 1000)
break
case 500:
util.errorMsg('网络错误')
Util.errorMsg('网络错误')
break
// 403 token过期
// 登录过期对用户进行提示
// 清除本地token和清空vuex中token对象
// 跳转登录页面
case 403:
util.local.remove(Setting.storeKey)
util.local.remove(Setting.tokenKey)
util.errorMsg('登录过期，请重新登录')
Util.local.remove(Setting.storeKey)
Util.local.remove(Setting.tokenKey)
Util.errorMsg('登录过期，请重新登录')
// 清除token
// store.commit('loginSuccess', null);
// 跳转登录页面，并将要浏览的页面fullPath传过去，登录成功后跳转需要访问的页面
@ -127,11 +141,11 @@ service.interceptors.response.use(
break
// 404请求不存在
case 404:
util.errorMsg('网络请求不存在!')
Util.errorMsg('网络请求不存在!')
break
// 其他错误，直接抛出错误提示
default:
util.errorMsg(error.response.data.message)
Util.errorMsg(error.response.data.message)
Promise.reject(res)
}
return Promise.reject(error.response)

4
src/setting.js
Unescape View File

@ -11,8 +11,8 @@ const url = location.host
const dev = process.env.NODE_ENV === 'development' // 本地
let host = `${location.origin}/`
if (dev) {
host = 'http://121.37.12.51/'
host = 'http://192.168.31.217:9000/'
host = 'https://www.dataforward.cn/'
// host = 'http://192.168.31.217:9000/'
}
const Setting = {

3
vue.config.js
Unescape View File

@ -14,5 +14,6 @@ module.exports = {
  assetsDir: Setting.assetsDir,
devServer: {
port: 8092
}
},
productionSourceMap: false,
}
Write Preview
Loading…
Cancel
Save