bonus
/
devicesmgt
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化登录页面问题

This commit is contained in:
BianLzhaoMin 2024-05-30 18:04:30 +08:00
parent eae0491788
commit 05f15fcd5d
11 changed files with 110 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
sgzb-ui/.env.production
View File

@ -5,5 +5,5 @@ VUE_APP_TITLE = 施工装备管理系统
ENV = 'production' ENV = 'production'
# 若依管理系统/生产环境 # 若依管理系统/生产环境
VUE_APP_BASE_API = '/sgzbgl-api' VUE_APP_BASE_API = '/gl/dev-api'

BIN
sgzb-ui/dist01.rar Normal file
View File

Binary file not shown.

2
sgzb-ui/public/index.html
View File

@ -6,7 +6,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit"> <meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="favicon.ico">
<title> <title>
<%= webpackConfig.name %> <%= webpackConfig.name %>
</title> </title>

1
sgzb-ui/src/layout/components/Navbar.vue
View File

@ -107,6 +107,7 @@ export default {
// location.href = '/gl/login'; // location.href = '/gl/login';
location.href = process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login' location.href = process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login'
// next({ path: process.env.NODE_ENV === 'production' ? '/gl/login' : '/login' })
}) })
}) })
.catch(() => {}) .catch(() => {})

1
sgzb-ui/src/permission.js
View File

@ -37,6 +37,7 @@ router.beforeEach((to, from, next) => {
// next({ path: '/gl/login' }) // next({ path: '/gl/login' })
next({ path: process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login' }) next({ path: process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login' })
// next({ path: process.env.NODE_ENV === 'production' ? '/gl/login' : '/login' })
}) })
}) })
} else { } else {

1
sgzb-ui/src/router/index.js
View File

@ -207,6 +207,7 @@ export default new Router({
scrollBehavior: () => ({ y: 0 }), scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes, routes: constantRoutes,
base: process.env.NODE_ENV === 'production' ? '/sgzbgl' : '' base: process.env.NODE_ENV === 'production' ? '/sgzbgl' : ''
// base: process.env.NODE_ENV === 'production' ? '/gl' : ''
}) })

2
sgzb-ui/src/utils/globalUrl.js
View File

@ -5,7 +5,7 @@
// const qrUrl = 'https://z.csgmall.com.cn/gl/qrCode/qrCodePage?qrCode='; //南网 // const qrUrl = 'https://z.csgmall.com.cn/gl/qrCode/qrCodePage?qrCode='; //南网
const qrUrl = process.env.NODE_ENV === 'production' ? 'https://test-cc.zhgkxt.com/qrCode/qrCodePage?qrCode=' : 'http://192.168.0.14:18866/qrCode/qrCodePage?qrCode=' const qrUrl = process.env.NODE_ENV === 'production' ? 'https://test-cc.zhgkxt.com/sgzbgl/qrCode/qrCodePage?qrCode=' : 'http://192.168.0.14:18866/qrCode/qrCodePage?qrCode='
export default { export default {
qrUrl, qrUrl,
} }

1
sgzb-ui/src/utils/request.js
View File

@ -91,6 +91,7 @@ service.interceptors.response.use(res => {
// location.href = '/gl/login'; // location.href = '/gl/login';
location.href = process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login' location.href = process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login'
// location.href = process.env.NODE_ENV === 'production' ? '/gl/login' : '/login'
}) })
}).catch(() => { }).catch(() => {
isRelogin.show = false; isRelogin.show = false;

178
sgzb-ui/src/views/newLogin.vue
View File

@ -6,7 +6,13 @@
<el-tabs v-model="activeName" style="width: 400px; padding: 25px 25px 5px 25px"> <el-tabs v-model="activeName" style="width: 400px; padding: 25px 25px 5px 25px">
<el-tab-pane label="账号登录" name="account"> <el-tab-pane label="账号登录" name="account">
<!-- 账户密码登录 --> <!-- 账户密码登录 -->
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form"> <el-form
ref="loginForm"
:model="loginForm"
:rules="loginRules"
class="login-form"
v-if="activeName === 'account'"
>
<el-form-item prop="username"> <el-form-item prop="username">
<el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号"> <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" /> <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
@ -34,7 +40,7 @@
<div <div
class="login-code-img" class="login-code-img"
style="border: 1px solid rgb(220, 223, 230)" style="border: 1px solid rgb(220, 223, 230)"
v-show="showNew === 1" v-if="showNew === 1"
@click="getTextCodeNew" @click="getTextCodeNew"
> >
获取验证码 获取验证码
@ -45,7 +51,7 @@
<div <div
class="login-code-img" class="login-code-img"
style="border: 1px solid rgb(220, 223, 230)" style="border: 1px solid rgb(220, 223, 230)"
v-show="showNew === 3" v-if="showNew === 3"
@click="getTextCodeNew" @click="getTextCodeNew"
> >
重发 重发
@ -85,54 +91,30 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="手机登录" name="phone"> <el-tab-pane label="手机登录" name="phone">
<!-- 手机验证码登录 --> <!-- 手机验证码登录 -->
<el-form ref="phoneLoginFormRef" :model="phoneLoginParams" :rules="phoneLoginRules" class="login-form"> <el-form
ref="phoneLoginFormRef"
:model="phoneLoginParams"
:rules="phoneLoginRules"
class="login-form"
v-if="activeName === 'phone'"
>
<el-form-item prop="phone"> <el-form-item prop="phone">
<el-input <el-input
v-model="phoneLoginParams.phone" v-model="phoneLoginParams.phone"
type="text"
:readonly="readonlyFlag" :readonly="readonlyFlag"
@focus="handleInputClick" @focus="handleInputClick"
auto-complete="off"
placeholder="手机号" placeholder="手机号"
> >
<svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon" /> <svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon" />
</el-input> </el-input>
</el-form-item> </el-form-item>
<!-- 5.27 新增发送短信验证时 增加图形验证码校验 暂时注释 因为放在表单内显得暧昧 先模仿南网注册页面使用弹框提示图形验证码 -->
<!-- <el-form-item
prop="code"
v-if="captchaEnabled"
class="code-container"
>
<el-input
v-model="phoneLoginParams.code"
auto-complete="off"
placeholder="图形验证码"
@keyup.enter.native="textLogin"
style="width: 63%"
>
<svg-icon
slot="prefix"
icon-class="validCode"
class="el-input__icon input-icon"
/>
</el-input>
<div class="login-code">
<img
:src="phoneCodeUrl"
@click="getCode(2)"
class="login-code-img"
style="width: 100%"
/>
</div>
</el-form-item> -->
<el-form-item prop="textCode" class="code-container"> <el-form-item prop="textCode" class="code-container">
<el-input <el-input
v-model="phoneLoginParams.textCode" v-model="phoneLoginParams.textCode"
auto-complete="off"
placeholder="短信验证码" placeholder="短信验证码"
style="width: 63%" style="width: 63%"
@focus="handleInputClick"
@input="inputChangeTextCode"
> >
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" /> <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input> </el-input>
@ -142,18 +124,18 @@
class="login-code-img" class="login-code-img"
style="border: 1px solid rgb(220, 223, 230)" style="border: 1px solid rgb(220, 223, 230)"
v-show="show === 1" v-show="show === 1"
@click="getTextCode" @click.prevent="getTextCode"
> >
获取验证码 获取验证码
</div> </div>
<div class="login-code-img" style="border: 1px solid rgb(220, 223, 230)" v-show="show === 2"> <div class="login-code-img" style="border: 1px solid rgb(220, 223, 230)" v-if="show === 2">
{{ count }} s {{ count }} s
</div> </div>
<div <div
class="login-code-img" class="login-code-img"
style="border: 1px solid rgb(220, 223, 230)" style="border: 1px solid rgb(220, 223, 230)"
v-show="show === 3" v-if="show === 3"
@click="getTextCode" @click.prevent="getTextCode"
> >
重发 重发
</div> </div>
@ -272,10 +254,6 @@ export default {
textCode: '', textCode: '',
uuid: '', uuid: '',
}, },
// 获取短信验证码参数
phoneLoginParams: {
code: '',
},
// 账户密码登录时的校验规则 // 账户密码登录时的校验规则
loginRules: { loginRules: {
username: [ username: [
@ -376,8 +354,17 @@ export default {
activeName: { activeName: {
handler(newVal) { handler(newVal) {
// this.$refs['loginForm'].clearValidate() // this.$refs['loginForm'].clearValidate()
this.resetForm('loginForm') // this.$refs['phoneLoginFormRef'].clearValidate()
this.resetForm('phoneLoginFormRef')
if (newVal) {
console.log(this.phoneLoginParams.phone, ' this.phoneLoginParams.phone ', this.phoneLoginParams.textCode)
this.phoneLoginParams.phone = ''
this.phoneLoginParams.textCode = ''
this.loginForm.username = ''
this.loginForm.password = ''
this.loginForm.textCode = ''
this.loginForm.code = ''
}
// 切换登录方式时 根据切换方式 自动获取新的图形验证码 // 切换登录方式时 根据切换方式 自动获取新的图形验证码
if (newVal === 'account') { if (newVal === 'account') {
this.getCode(1) this.getCode(1)
@ -410,6 +397,12 @@ export default {
this.getCookie() this.getCookie()
}, },
methods: { methods: {
inputChangePhone() {
this.$forceUpdate()
},
inputChangeTextCode() {
this.$forceUpdate()
},
getCode(type) { getCode(type) {
getCodeImg().then(res => { getCodeImg().then(res => {
/* 根据 type 判断当前获取的图形验证码如何赋值 1 账号登录 2 手机验证码登录 */ /* 根据 type 判断当前获取的图形验证码如何赋值 1 账号登录 2 手机验证码登录 */
@ -434,7 +427,7 @@ export default {
}, },
//获取短信验证码 //获取短信验证码
getTextCode() { getTextCode() {
this.$refs.phoneLoginFormRef.validateField('phone', valid => { this.$refs.phoneLoginFormRef.validateField(['phone'], valid => {
if (!valid) { if (!valid) {
this.getCode(2) this.getCode(2)
this.dialogCodeVisible = true this.dialogCodeVisible = true
@ -444,41 +437,66 @@ export default {
// 登录用户为admin 时获取短信验证码按钮 // 登录用户为admin 时获取短信验证码按钮
getTextCodeNew() { getTextCodeNew() {
this.getCode(3) // this.getCode(3)
this.dialogCodeVisibleNew = true // this.dialogCodeVisibleNew = true
this.phoneLoginParamsNew.username = this.loginForm.username
sendCodeNew(this.phoneLoginParamsNew)
.then(res => {
if (res.code == 200) {
this.$modal.msgSuccess('发送成功')
const TIME_COUNT = 60
if (!this.timerNew) {
this.countNew = TIME_COUNT
this.showNew = 2
this.timerNew = setInterval(() => {
if (this.countNew > 0 && this.countNew <= TIME_COUNT) {
this.countNew--
} else {
this.showNew = 3
clearInterval(this.timerNew)
this.timerNew = null
}
}, 1000)
}
this.dialogCodeVisibleNew = false
}
})
.catch(err => {
console.log(err)
})
}, },
submitSendCodeNew() { // submitSendCodeNew() {
this.$refs.phoneLoginCodeFormNewRef.validate(valid => { // this.$refs.phoneLoginCodeFormNewRef.validate(valid => {
if (valid) { // if (valid) {
this.phoneLoginParamsNew.username = this.loginForm.username // this.phoneLoginParamsNew.username = this.loginForm.username
sendCodeNew(this.phoneLoginParamsNew) // sendCodeNew(this.phoneLoginParamsNew)
.then(res => { // .then(res => {
if (res.code == 200) { // if (res.code == 200) {
this.$modal.msgSuccess('发送成功') // this.$modal.msgSuccess('发送成功')
const TIME_COUNT = 60 // const TIME_COUNT = 60
if (!this.timerNew) { // if (!this.timerNew) {
this.countNew = TIME_COUNT // this.countNew = TIME_COUNT
this.showNew = 2 // this.showNew = 2
this.timerNew = setInterval(() => { // this.timerNew = setInterval(() => {
if (this.countNew > 0 && this.countNew <= TIME_COUNT) { // if (this.countNew > 0 && this.countNew <= TIME_COUNT) {
this.countNew-- // this.countNew--
} else { // } else {
this.showNew = 3 // this.showNew = 3
clearInterval(this.timerNew) // clearInterval(this.timerNew)
this.timerNew = null // this.timerNew = null
} // }
}, 1000) // }, 1000)
} // }
this.dialogCodeVisibleNew = false // this.dialogCodeVisibleNew = false
} // }
}) // })
.catch(err => { // .catch(err => {
console.log(err) // console.log(err)
}) // })
} // }
}) // })
}, // },
/* 图形验证码弹框中确定按钮 */ /* 图形验证码弹框中确定按钮 */
submitSendCode() { submitSendCode() {

6
sgzb-ui/src/views/resetPassword.vue
View File

@ -100,7 +100,8 @@ export default {
// location.href = '/login'; // location.href = '/login';
// location.href = '/gl/login'; // location.href = '/gl/login';
location.href = process.env.NODE_ENV === 'production-nw' ? '/sgzbgl/login' : '/login' location.href = process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login'
// location.href = process.env.NODE_ENV === 'production-nw' ? '/gl/login' : '/login'
}) })
}) })
} }
@ -111,7 +112,8 @@ export default {
// location.href = '/login'; // location.href = '/login';
// location.href = '/gl/login'; // location.href = '/gl/login';
location.href = process.env.NODE_ENV === 'production-nw' ? '/sgzbgl/login' : '/login' location.href = process.env.NODE_ENV === 'production' ? '/sgzbgl/login' : '/login'
// location.href = process.env.NODE_ENV === 'production-nw' ? '/gl/login' : '/login'
}) })
}, },
}, },

2
sgzb-ui/vue.config.js
View File

@ -19,7 +19,7 @@ module.exports = {
// 部署生产环境和开发环境下的URL。 // 部署生产环境和开发环境下的URL。
// 默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上 // 默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上
// 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。 // 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。
publicPath: process.env.NODE_ENV === 'production' ? '/' : '/', ///gl/ publicPath: process.env.NODE_ENV === 'production' ? '/gl' : '/', ///gl/
// 在npm run build 或 yarn build 时 ，生成文件的目录名称（要和baseUrl的生产环境路径一致）（默认dist） // 在npm run build 或 yarn build 时 ，生成文件的目录名称（要和baseUrl的生产环境路径一致）（默认dist）
outputDir: 'dist', outputDir: 'dist',
// 用于放置生成的静态资源 (js、css、img、fonts) 的；（项目打包之后，静态资源会放在这个文件夹下） // 用于放置生成的静态资源 (js、css、img、fonts) 的；（项目打包之后，静态资源会放在这个文件夹下）