Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
C
CivWeb
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
ReactWeb5
CivWeb
Commits
a1fc4dec
Commit
a1fc4dec
authored
Nov 05, 2024
by
李纪文
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 广州节水增加验证码登录
parent
fa6eb9e9
Pipeline
#93668
waiting for manual action with stages
Changes
5
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
288 additions
and
26 deletions
+288
-26
reducer.js
src/containers/App/store/reducer.js
+1
-0
login.js
src/pages/user/login/login.js
+104
-0
FormLogin.js
src/pages/user/login/template/energy_GZ/FormLogin.js
+72
-8
index.js
src/pages/user/login/template/energy_GZ/index.js
+3
-5
index.less
src/pages/user/login/template/energy_GZ/index.less
+108
-13
No files found.
src/containers/App/store/reducer.js
View file @
a1fc4dec
...
...
@@ -94,6 +94,7 @@ const appReducer = (state = initialState, action) => {
window
.
__INITIAL_STATE__
.
menu
=
'banner-left'
;
const
temp
=
AppConfig
(
window
.
__INITIAL_STATE__
)
temp
.
displayMode
=
window
.
__INITIAL_STATE__
?.
displayMode
||
''
temp
.
isVerification
=
action
.
data
.
isVerification
||
''
;
window
.
globalConfig
=
temp
;
...
...
src/pages/user/login/login.js
View file @
a1fc4dec
...
...
@@ -1460,6 +1460,93 @@ class Login {
}
}
loginValidate
(
usr
,
pwd
,
userPhone
,
isRememberPWD
,
mode
=
SERVICE_APP_LOGIN_MODE
.
password
,
validateCode
=
''
)
{
this
.
globalConfig
=
getGlobalConfig
();
const
self
=
this
;
if
(
window
.
globalConfig
&&
window
.
globalConfig
.
hasGateWay
)
{
usr
=
userPhone
?
userPhone
:
usr
;
appService
.
authorizationToken
({
loginName
:
usr
,
// password: pwd ? (params.getParams('generateType') ? pwd : sha1(pwd).toUpperCase()) : '',
password
:
pwd
?
params
.
getParams
(
'generateType'
)
?
pwd
:
encipher
(
pwd
,
this
.
globalConfig
.
encrypt
).
toUpperCase
()
:
''
,
vCode
:
validateCode
,
type
:
mode
,
generateType
:
params
.
getParams
(
'generateType'
)
||
''
,
})
.
then
(
res
=>
{
if
(
res
.
code
===
0
)
{
const
data
=
res
.
data
;
self
.
updateConfig
&&
self
.
updateConfig
(
Object
.
assign
({},
self
.
globalConfig
,
{
access_token
:
data
.
access_token
,
token
:
data
.
user_token
,
}),
);
if
(
res
.
msg
===
'密码过期'
)
{
localStorage
.
setItem
(
'password_needChange'
,
true
);
}
else
{
localStorage
.
removeItem
(
'password_needChange'
);
}
return
data
;
}
else
{
message
.
error
({
duration
:
3
,
content
:
`授权失败:
${
res
.
msg
}
`
,
});
self
.
hasTry
=
true
;
self
.
handleLoginError
();
self
.
events
.
emit
(
'loginError'
,
res
.
msg
);
return
Promise
.
reject
(
res
);
}
})
.
then
(
res
=>
{
self
.
transformLoginHander
(
res
,
isRememberPWD
,
pwd
);
});
}
else
{
appService
.
generateToken
({
f
:
'json'
,
expiration
:
this
.
globalConfig
.
expiration
,
// token过期时间(单位:秒)
client
:
'referer'
,
username
:
usr
,
// password: pwd ? (params.getParams('generateType') ? pwd : sha1(pwd).toUpperCase()) : '',
password
:
pwd
?
params
.
getParams
(
'generateType'
)
?
pwd
:
encipher
(
pwd
,
this
.
globalConfig
.
encrypt
).
toUpperCase
()
:
''
,
vCode
:
validateCode
,
referer
:
this
.
globalConfig
.
client
,
skipMenuTest
:
1
,
userPhone
,
'request.preventCache'
:
Date
.
now
(),
ignoreSite
:
true
,
loginName
:
usr
,
generateType
:
params
.
getParams
(
'generateType'
)
||
''
,
})
.
then
(
response
=>
{
if
(
response
?.
msg
===
'密码过期'
)
{
localStorage
.
setItem
(
'password_needChange'
,
true
);
}
else
{
localStorage
.
removeItem
(
'password_needChange'
);
}
self
.
transformLoginHander
(
response
,
isRememberPWD
,
pwd
);
})
.
catch
(
error
=>
{
self
.
hasTry
=
true
;
self
.
handleLoginError
();
self
.
events
.
emit
(
'loginError'
,
error
.
message
);
message
.
error
(
'登录服务异常'
);
});
}
}
loginHandler
(
user
,
pwd
,
userPhone
,
isRememberPWD
,
ref
)
{
const
self
=
this
;
if
(
user
&&
pwd
)
{
...
...
@@ -1474,6 +1561,23 @@ class Login {
}
}
}
loginHandlerValidate
(
user
,
pwd
,
userPhone
,
isRememberPWD
,
ref
,
validateCode
=
''
)
{
const
self
=
this
;
if
(
this
.
globalConfig
?.
isVerification
==
1
)
return
self
.
loginValidate
(
user
,
pwd
,
userPhone
,
isRememberPWD
,
''
,
validateCode
);
if
(
user
&&
pwd
)
{
if
(
self
.
loginFailed
&&
self
.
captchaObj
)
{
self
.
captchaObj
.
verify
();
}
else
if
(
self
.
hasTry
)
{
self
.
slideVerify
(
ref
,
()
=>
{
self
.
login
(
user
,
pwd
,
userPhone
,
isRememberPWD
);
});
}
else
{
self
.
login
(
user
,
pwd
,
userPhone
,
isRememberPWD
);
}
}
}
loginHandlerJiangXi
(
user
,
pwd
,
userPhone
,
isRememberPWD
,
ref
)
{
const
self
=
this
;
if
(
user
&&
pwd
)
{
...
...
src/pages/user/login/template/energy_GZ/FormLogin.js
View file @
a1fc4dec
/* eslint-disable */
import
{
Checkbox
}
from
'antd'
;
import
React
from
'react'
;
import
React
,
{
useEffect
,
useState
}
from
'react'
;
import
{
useIntl
}
from
'@wisdom-utils/components'
;
import
LoginForm
from
'../../components/Login'
;
import
{
Form
}
from
'antd'
;
import
{
Form
,
Input
}
from
'antd'
;
import
{
FieldNumberOutlined
,
ReloadOutlined
,
LoadingOutlined
}
from
'@ant-design/icons'
;
import
LoginMessage
from
'../../js/loginMessage'
;
import
LoginContext
from
'../../components/Login/LoginContext'
;
import
styles
from
'./index.less'
;
const
{
UserName
,
Password
,
Submit
}
=
LoginForm
;
const
ValidateCode
=
props
=>
{
const
[
count
,
setCount
]
=
useState
(
0
);
useEffect
(()
=>
{
window
.
share
.
event
.
on
(
'loginError'
,
handError
);
return
()
=>
{
window
.
share
.
event
.
removeListener
(
'loginError'
,
handError
);
};
},
[]);
const
handError
=
()
=>
{
setCount
(
Date
.
now
());
};
const
handeRefresh
=
()
=>
{
setCount
(
Date
.
now
());
};
const
handChange
=
value
=>
{
props
?.
onChange
?.(
value
);
};
return
(
<
div
className
=
{
styles
.
validate_view
}
>
<
Input
size
=
{
'large'
}
prefix
=
{
<
FieldNumberOutlined
/>
}
className
=
{
styles
.
validate_input
}
value
=
{
props
.
value
||
''
}
placeholder
=
"请输入验证码"
onChange
=
{
handChange
}
/
>
<
div
className
=
{
styles
.
validate_img
}
>
<
img
src
=
{
`/PandaCore/GCK/BussinessAuth/GetVerificationCode?time=
${
count
}
`
}
// key={count}
/
>
<
div
className
=
{
styles
.
validate_refresh
}
onClick
=
{
handeRefresh
}
>
<
ReloadOutlined
/>
<
/div
>
<
/div
>
<
/div
>
);
};
const
FormLogin
=
props
=>
(
<
div
className
=
{
styles
.
form_login
}
>
<
LoginContext
.
Provider
>
...
...
@@ -54,12 +100,30 @@ const FormLogin = props => (
},
]}
/
>
{
window
?.
globalConfig
?.
isVerification
==
1
?
(
<
Form
.
Item
shouldUpdate
noStyle
>
{({
getFieldValue
,
validateFields
})
=>
(
<
Form
.
Item
name
=
"validateCode"
rules
=
{[
{
required
:
true
,
message
:
'请输入验证码'
,
},
]}
>
<
ValidateCode
/>
<
/Form.Item
>
)}
<
/Form.Item
>
)
:
null
}
<
div
className
=
{
styles
.
checkbox_wrap
}
>
{
// <Checkbox checked={props.autoLogin} onChange={e => props.setAutoLogin(e.target.checked)}>
// {'记住密码'}
// </Checkbox>
// <a href="#">忘记密码?</a>
}
{
// <Checkbox checked={props.autoLogin} onChange={e => props.setAutoLogin(e.target.checked)}>
// {'记住密码'}
// </Checkbox>
// <a href="#">忘记密码?</a>
}
<
/div
>
<
Submit
loading
=
{
props
.
submitting
}
>
{
useIntl
().
formatMessage
({
id
:
'pages.login.submit'
})}
<
/Submit
>
<
/Form
>
...
...
src/pages/user/login/template/energy_GZ/index.js
View file @
a1fc4dec
...
...
@@ -15,6 +15,7 @@ import { actionCreators } from '@/containers/App/store';
import
LoginAction
from
'../../login'
;
import
styles
from
'./index.less'
;
import
{
defaultApp
}
from
'@/micro'
;
import
classNames
from
'classnames'
;
import
{
log
}
from
'kit_utils'
;
let
big
=
'广州大.png'
let
bigNew
=
''
...
...
@@ -23,7 +24,6 @@ let slogan = ''
class
HuaNongLogin
extends
Component
{
constructor
(
props
)
{
super
(
props
);
console
.
log
(
props
);
this
.
state
=
{
time
:
'16:00'
,
week
:
'星期一'
,
...
...
@@ -60,7 +60,7 @@ class HuaNongLogin extends Component {
const
{
action
,
type
,
autoLogin
}
=
this
.
state
;
action
&&
(
type
===
'Account'
?
action
.
loginHandler
(
values
.
userName
,
values
.
password
,
null
,
autoLogin
,
this
.
sliVerify
)
?
action
.
loginHandler
Validate
(
values
.
userName
,
values
.
password
,
null
,
autoLogin
,
this
.
sliVerify
,
values
.
validateCode
)
:
type
===
'Mobile'
?
action
.
phoneLoginFormHandler
(
values
.
mobile
,
values
.
captcha
)
:
null
);
...
...
@@ -219,8 +219,6 @@ class HuaNongLogin extends Component {
.
toUpperCase
();
}
componentDidMount
()
{
console
.
log
(
this
.
props
,
this
.
props
.
global
.
logo
,
this
.
props
.
global
.
transformDevAssetsBaseURL
(
'assets/images/广州/背景.png'
));
console
.
log
(
this
);
this
.
onActinoChange
(
this
.
state
.
action
);
this
.
getCurrentTime
(
this
.
showTime
);
/* request(urlUtils.getUrl(
...
...
@@ -260,7 +258,7 @@ class HuaNongLogin extends Component {
<
/div
>
<
/div
>
<
div
className
=
{
styles
.
wrap_content
}
>
<
div
className
=
{
styles
.
from
}
>
<
div
className
=
{
classNames
(
styles
.
from
,
this
.
props
.
global
.
isVerification
==
1
?
styles
.
from_validate
:
''
)
}
>
<
div
className
=
{
styles
.
slogan
}
>
<
div
className
=
{
styles
.
slogan_back
}
style
=
{{
background
:
`url(
${
!
slogan
?
require
(
"@/assets/images/login/节水/建桥宣传语.png"
)
:
this
.
props
.
global
.
transformDevAssetsBaseURL
(
slogan
)}
) center no-repeat`
}}
/
>
<
/div
>
...
...
src/pages/user/login/template/energy_GZ/index.less
View file @
a1fc4dec
@import '~antd/es/style/themes/default.less';
/* 0.5px */
.borderSlender(@color) {
position: absolute;
...
...
@@ -11,14 +12,16 @@
transform: scaleY(0.5);
content: '';
}
.quota {
position: relative;
width: 100%;
height: 100%;
// background: url('@/assets/images/login/节水/广州大.png') no-repeat;
// background: url('@/assets/images/login/节水/广州大.png') no-repeat;
background-size: cover;
background-size:100% 100% !important;
background-attachment:fixed;
background-size: 100% 100% !important;
background-attachment: fixed;
.head {
position: absolute;
top: 0;
...
...
@@ -27,6 +30,7 @@ background-attachment:fixed;
display: flex;
justify-content: space-between;
z-index: 10;
.title {
padding-left: 20px;
font-size: 24px;
...
...
@@ -35,15 +39,18 @@ background-attachment:fixed;
text-shadow: 0px 0px 2px rgba(2, 49, 21, 0.51);
line-height: 66px;
}
.imgs{
.imgs {
width: 44px;
margin-bottom: 7px;
margin-right: 10px;
}
.time_and_date {
padding-right: 50px;
display: flex;
align-items: center;
.time {
padding: 5px;
font-size: 34px;
...
...
@@ -51,6 +58,7 @@ background-attachment:fixed;
color: #FFFFFF;
text-shadow: 0px 0px 2px rgba(2, 49, 21, 0.8);
}
.date {
padding: 5px;
font-size: 16px;
...
...
@@ -63,13 +71,16 @@ background-attachment:fixed;
}
}
}
.head::after {
.borderSlender(@color: rgb(255, 255, 255, 0.32));
}
.wrap_content {
position: relative;
width: 100%;
height: 100%;
.from {
position: absolute;
top: -94px !important;
...
...
@@ -85,16 +96,23 @@ background-attachment:fixed;
// background: rgba(255, 255, 255, 0.8);
background: #FFFFFF;
border-radius: 15px;
&.from_validate {
height: 500px;
}
.slogan {
height: 118px;
background: linear-gradient(0deg,rgba(9,128,238,1) 0%,rgba(0,182,251,1) 100%);
.slogan_back{
background: linear-gradient(0deg, rgba(9, 128, 238, 1) 0%, rgba(0, 182, 251, 1) 100%);
.slogan_back {
width: 100%;
height: 100%;
background: url('@/assets/images/login/节水/建桥宣传语.png') no-repeat;
background-position: center;
background-position: center;
}
}
.login {
// flex: 1;
height: calc(100% - 118px);
...
...
@@ -107,46 +125,113 @@ background-attachment:fixed;
.form_login {
width: 100%;
height: 100%;
.checkbox_wrap {
margin-bottom: @margin-md;
color: #0599F4;
a {
float: right;
}
}
.validate_view {
display: flex;
align-items: center;
}
.validate_input {
flex: 1;
margin-right: 20px;
}
.validate_img {
width: 102px;
height: 42px;
flex: none;
position: relative;
cursor: pointer;
border: 1px solid #0599F4;
border-radius: 4px;
&:hover {
.validate_refresh {
opacity: 1;
background-color: rgba(238, 238, 238, 0.7);
}
}
img {
width: 100%;
height: 100%;
object-fit: contain;
}
.validate_refresh {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
display: flex;
opacity: 0;
align-items: center;
justify-content: center;
cursor: pointer;
color: #666666;
}
}
:global {
.panda-console-base-input-affix-wrapper:focus, .panda-console-base-input-affix-wrapper-focused {
.panda-console-base-input-affix-wrapper:focus,
.panda-console-base-input-affix-wrapper-focused {
box-shadow: none;
}
.panda-console-base-form-item{
.panda-console-base-form-item {
margin-bottom: 46px;
}
.panda-console-base-form-item-with-help {
margin-bottom: 24px;
}
.panda-console-base-input-affix-wrapper {
color: #0599F4;
background: none;
}
.panda-console-base-input {
background: none;
}
.panda-console-base-input-affix-wrapper-status-error:not(.panda-console-base-input-affix-wrapper-disabled):not(.panda-console-base-input-affix-wrapper-borderless).panda-console-base-input-affix-wrapper:focus, .panda-console-base-input-affix-wrapper-status-error:not(.panda-console-base-input-affix-wrapper-disabled):not(.panda-console-base-input-affix-wrapper-borderless).panda-console-base-input-affix-wrapper-focused {
.panda-console-base-input-affix-wrapper-status-error:not(.panda-console-base-input-affix-wrapper-disabled):not(.panda-console-base-input-affix-wrapper-borderless).panda-console-base-input-affix-wrapper:focus,
.panda-console-base-input-affix-wrapper-status-error:not(.panda-console-base-input-affix-wrapper-disabled):not(.panda-console-base-input-affix-wrapper-borderless).panda-console-base-input-affix-wrapper-focused {
box-shadow: none;
}
.panda-console-base-input-affix-wrapper:focus .panda-console-base-input-affix-wrapper-lg {
border-color: #0599F4 !important;
}
.panda-console-base-input-affix-wrapper:not(.panda-console-base-input-affix-wrapper-disabled):hover {
z-index: 1;
border-color: #0599F4;
border-right-width: 1px;
}
.panda-console-base-input-affix-wrapper-status-error:not(.panda-console-base-input-affix-wrapper-disabled):not(.panda-console-base-input-affix-wrapper-borderless).panda-console-base-input-affix-wrapper,
.panda-console-base-input-affix-wrapper-status-error:not(.panda-console-base-input-affix-wrapper-disabled):not(.panda-console-base-input-affix-wrapper-borderless).panda-console-base-input-affix-wrapper:hover {
border-color: #ff4d4f;
}
.panda-console-base-input-affix-wrapper-focused,
.panda-console-base-input-affix-wrapper:focus {
z-index: 0;
}
.panda-console-base-input-affix-wrapper-lg {
background-color: none;
border: none;
...
...
@@ -154,41 +239,50 @@ background-attachment:fixed;
border-bottom-width: 1px;
border-bottom-style: solid;
}
.panda-console-base-input-affix-wrapper > input.panda-console-base-input {
.panda-console-base-input-affix-wrapper>input.panda-console-base-input {
background-color: none;
}
.panda-console-base-form {
width: 100%;
height: 100%;
}
.panda-console-base-checkbox-wrapper {
color: #0599F4;
}
.panda-console-base-checkbox-wrapper:hover .panda-console-base-checkbox::after {
border-color: #0599F4;
}
.panda-console-base-checkbox-wrapper:hover .panda-console-base-checkbox-inner,
.panda-console-base-checkbox:hover .panda-console-base-checkbox-inner,
.panda-console-base-checkbox-input:focus
+
.panda-console-base-checkbox-inner {
.panda-console-base-checkbox-input:focus
+
.panda-console-base-checkbox-inner {
border-color: #0599F4;
}
.panda-console-base-checkbox-wrapper {
.panda-console-base-checkbox-checked .panda-console-base-checkbox-inner {
background-color: #0599F4;
border-color: #0599F4;
}
.panda-console-base-checkbox-inner {
border-color: #0599F4;
border-radius: 50%;
}
}
.panda-console-base-btn-lg {
width: 100%;
}
.panda-console-base-btn-primary {
background: #0599F4;
border-color: #0599F4;
border-radius: 23px;
}
}
}
}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment