Merge branch 'main' of http://47.122.43.22:3000/wjn/mh-sms-web
This commit is contained in:
wyw
commit
c0f3a193e8
File diff suppressed because it is too large
Load Diff
@ -1,8 +1,10 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 4299634 */
|
||||
src: url('iconfont.woff2?t=1700789582875') format('woff2'),
|
||||
url('iconfont.woff?t=1700789582875') format('woff'),
|
||||
url('iconfont.ttf?t=1700789582875') format('truetype');
|
||||
/* Color fonts */
|
||||
src:
|
||||
url('iconfont.woff2?t=1709515058835') format('woff2'),
|
||||
url('iconfont.woff?t=1709515058835') format('woff'),
|
||||
url('iconfont.ttf?t=1709515058835') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
@ -13,35 +15,159 @@
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-zhankaiquanpingkuozhan:before {
|
||||
content: "\e7b0";
|
||||
.icon-Mark:before {
|
||||
content: "\e632";
|
||||
}
|
||||
|
||||
.icon-a-zu185:before {
|
||||
content: "\e626";
|
||||
}
|
||||
|
||||
.icon-a-zu249:before {
|
||||
content: "\e627";
|
||||
}
|
||||
|
||||
.icon-a-zu74:before {
|
||||
content: "\e613";
|
||||
}
|
||||
|
||||
.icon-a-zu83:before {
|
||||
content: "\e614";
|
||||
}
|
||||
|
||||
.icon-a-zu198:before {
|
||||
content: "\e615";
|
||||
}
|
||||
|
||||
.icon-a-zu238:before {
|
||||
content: "\e616";
|
||||
}
|
||||
|
||||
.icon-a-zu164:before {
|
||||
content: "\e617";
|
||||
}
|
||||
|
||||
.icon-a-zu181:before {
|
||||
content: "\e618";
|
||||
}
|
||||
|
||||
.icon-a-zu65:before {
|
||||
content: "\e619";
|
||||
}
|
||||
|
||||
.icon-a-zu266:before {
|
||||
content: "\e61a";
|
||||
}
|
||||
|
||||
.icon-a-zu67:before {
|
||||
content: "\e61b";
|
||||
}
|
||||
|
||||
.icon-a-zu76:before {
|
||||
content: "\e61c";
|
||||
}
|
||||
|
||||
.icon-a-zu137:before {
|
||||
content: "\e61d";
|
||||
}
|
||||
|
||||
.icon-a-zu108:before {
|
||||
content: "\e61e";
|
||||
}
|
||||
|
||||
.icon-a-zu196:before {
|
||||
content: "\e61f";
|
||||
}
|
||||
|
||||
.icon-a-zu203:before {
|
||||
content: "\e620";
|
||||
}
|
||||
|
||||
.icon-a-zu208:before {
|
||||
content: "\e621";
|
||||
}
|
||||
|
||||
.icon-a-zu261:before {
|
||||
content: "\e622";
|
||||
}
|
||||
|
||||
.icon-a-zu253:before {
|
||||
content: "\e623";
|
||||
}
|
||||
|
||||
.icon-a-zu131:before {
|
||||
content: "\e624";
|
||||
}
|
||||
|
||||
.icon-a-zu57:before {
|
||||
content: "\e601";
|
||||
}
|
||||
|
||||
.icon-a-zu18:before {
|
||||
content: "\e602";
|
||||
}
|
||||
|
||||
.icon-a-zu286:before {
|
||||
content: "\e603";
|
||||
}
|
||||
|
||||
.icon-a-zu81:before {
|
||||
content: "\e605";
|
||||
}
|
||||
|
||||
.icon-a-zu73:before {
|
||||
content: "\e607";
|
||||
}
|
||||
|
||||
.icon-a-zu150:before {
|
||||
content: "\e608";
|
||||
}
|
||||
|
||||
.icon-a-zu284:before {
|
||||
content: "\e609";
|
||||
}
|
||||
|
||||
.icon-a-zu3:before {
|
||||
content: "\e60a";
|
||||
}
|
||||
|
||||
.icon-a-zu133:before {
|
||||
content: "\e60b";
|
||||
}
|
||||
|
||||
.icon-a-zu291:before {
|
||||
content: "\e60c";
|
||||
}
|
||||
|
||||
.icon-a-zu112:before {
|
||||
content: "\e60d";
|
||||
}
|
||||
|
||||
.icon-a-zu63:before {
|
||||
content: "\e60e";
|
||||
}
|
||||
|
||||
.icon-a-zu126:before {
|
||||
content: "\e60f";
|
||||
}
|
||||
|
||||
.icon-a-zu110:before {
|
||||
content: "\e610";
|
||||
}
|
||||
|
||||
.icon-a-zu116:before {
|
||||
content: "\e612";
|
||||
}
|
||||
|
||||
.icon-a-zu4:before {
|
||||
content: "\e600";
|
||||
}
|
||||
|
||||
.icon-24gl-expand2:before {
|
||||
content: "\eb6c";
|
||||
}
|
||||
|
||||
.icon-kuangshan:before {
|
||||
content: "\e6a6";
|
||||
}
|
||||
|
||||
.icon-shengchanqiye:before {
|
||||
content: "\e732";
|
||||
}
|
||||
|
||||
.icon-shengchandanyuanxinxi:before {
|
||||
content: "\e606";
|
||||
}
|
||||
|
||||
.icon-caidan1:before {
|
||||
content: "\e640";
|
||||
}
|
||||
|
||||
.icon-line-108:before {
|
||||
content: "\e76e";
|
||||
}
|
||||
|
||||
.icon-caidan:before {
|
||||
content: "\e689";
|
||||
}
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -6,11 +6,263 @@
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "688141",
|
||||
"name": "展开 全屏 扩展",
|
||||
"font_class": "zhankaiquanpingkuozhan",
|
||||
"unicode": "e7b0",
|
||||
"unicode_decimal": 59312
|
||||
"icon_id": "39402403",
|
||||
"name": "Mark",
|
||||
"font_class": "Mark",
|
||||
"unicode": "e632",
|
||||
"unicode_decimal": 58930
|
||||
},
|
||||
{
|
||||
"icon_id": "39402081",
|
||||
"name": "组 185",
|
||||
"font_class": "a-zu185",
|
||||
"unicode": "e626",
|
||||
"unicode_decimal": 58918
|
||||
},
|
||||
{
|
||||
"icon_id": "39402079",
|
||||
"name": "组 249",
|
||||
"font_class": "a-zu249",
|
||||
"unicode": "e627",
|
||||
"unicode_decimal": 58919
|
||||
},
|
||||
{
|
||||
"icon_id": "39402101",
|
||||
"name": "组 74",
|
||||
"font_class": "a-zu74",
|
||||
"unicode": "e613",
|
||||
"unicode_decimal": 58899
|
||||
},
|
||||
{
|
||||
"icon_id": "39402102",
|
||||
"name": "组 83",
|
||||
"font_class": "a-zu83",
|
||||
"unicode": "e614",
|
||||
"unicode_decimal": 58900
|
||||
},
|
||||
{
|
||||
"icon_id": "39402092",
|
||||
"name": "组 198",
|
||||
"font_class": "a-zu198",
|
||||
"unicode": "e615",
|
||||
"unicode_decimal": 58901
|
||||
},
|
||||
{
|
||||
"icon_id": "39402100",
|
||||
"name": "组 238",
|
||||
"font_class": "a-zu238",
|
||||
"unicode": "e616",
|
||||
"unicode_decimal": 58902
|
||||
},
|
||||
{
|
||||
"icon_id": "39402086",
|
||||
"name": "组 164",
|
||||
"font_class": "a-zu164",
|
||||
"unicode": "e617",
|
||||
"unicode_decimal": 58903
|
||||
},
|
||||
{
|
||||
"icon_id": "39402088",
|
||||
"name": "组 181",
|
||||
"font_class": "a-zu181",
|
||||
"unicode": "e618",
|
||||
"unicode_decimal": 58904
|
||||
},
|
||||
{
|
||||
"icon_id": "39402099",
|
||||
"name": "组 65",
|
||||
"font_class": "a-zu65",
|
||||
"unicode": "e619",
|
||||
"unicode_decimal": 58905
|
||||
},
|
||||
{
|
||||
"icon_id": "39402095",
|
||||
"name": "组 266",
|
||||
"font_class": "a-zu266",
|
||||
"unicode": "e61a",
|
||||
"unicode_decimal": 58906
|
||||
},
|
||||
{
|
||||
"icon_id": "39402098",
|
||||
"name": "组 67",
|
||||
"font_class": "a-zu67",
|
||||
"unicode": "e61b",
|
||||
"unicode_decimal": 58907
|
||||
},
|
||||
{
|
||||
"icon_id": "39402096",
|
||||
"name": "组 76",
|
||||
"font_class": "a-zu76",
|
||||
"unicode": "e61c",
|
||||
"unicode_decimal": 58908
|
||||
},
|
||||
{
|
||||
"icon_id": "39402090",
|
||||
"name": "组 137",
|
||||
"font_class": "a-zu137",
|
||||
"unicode": "e61d",
|
||||
"unicode_decimal": 58909
|
||||
},
|
||||
{
|
||||
"icon_id": "39402094",
|
||||
"name": "组 108",
|
||||
"font_class": "a-zu108",
|
||||
"unicode": "e61e",
|
||||
"unicode_decimal": 58910
|
||||
},
|
||||
{
|
||||
"icon_id": "39402083",
|
||||
"name": "组 196",
|
||||
"font_class": "a-zu196",
|
||||
"unicode": "e61f",
|
||||
"unicode_decimal": 58911
|
||||
},
|
||||
{
|
||||
"icon_id": "39402093",
|
||||
"name": "组 203",
|
||||
"font_class": "a-zu203",
|
||||
"unicode": "e620",
|
||||
"unicode_decimal": 58912
|
||||
},
|
||||
{
|
||||
"icon_id": "39402082",
|
||||
"name": "组 208",
|
||||
"font_class": "a-zu208",
|
||||
"unicode": "e621",
|
||||
"unicode_decimal": 58913
|
||||
},
|
||||
{
|
||||
"icon_id": "39402089",
|
||||
"name": "组 261",
|
||||
"font_class": "a-zu261",
|
||||
"unicode": "e622",
|
||||
"unicode_decimal": 58914
|
||||
},
|
||||
{
|
||||
"icon_id": "39402085",
|
||||
"name": "组 253",
|
||||
"font_class": "a-zu253",
|
||||
"unicode": "e623",
|
||||
"unicode_decimal": 58915
|
||||
},
|
||||
{
|
||||
"icon_id": "39402084",
|
||||
"name": "组 131",
|
||||
"font_class": "a-zu131",
|
||||
"unicode": "e624",
|
||||
"unicode_decimal": 58916
|
||||
},
|
||||
{
|
||||
"icon_id": "39402116",
|
||||
"name": "组 57",
|
||||
"font_class": "a-zu57",
|
||||
"unicode": "e601",
|
||||
"unicode_decimal": 58881
|
||||
},
|
||||
{
|
||||
"icon_id": "39402115",
|
||||
"name": "组 18",
|
||||
"font_class": "a-zu18",
|
||||
"unicode": "e602",
|
||||
"unicode_decimal": 58882
|
||||
},
|
||||
{
|
||||
"icon_id": "39402114",
|
||||
"name": "组 286",
|
||||
"font_class": "a-zu286",
|
||||
"unicode": "e603",
|
||||
"unicode_decimal": 58883
|
||||
},
|
||||
{
|
||||
"icon_id": "39402113",
|
||||
"name": "组 81",
|
||||
"font_class": "a-zu81",
|
||||
"unicode": "e605",
|
||||
"unicode_decimal": 58885
|
||||
},
|
||||
{
|
||||
"icon_id": "39402110",
|
||||
"name": "组 73",
|
||||
"font_class": "a-zu73",
|
||||
"unicode": "e607",
|
||||
"unicode_decimal": 58887
|
||||
},
|
||||
{
|
||||
"icon_id": "39402112",
|
||||
"name": "组 150",
|
||||
"font_class": "a-zu150",
|
||||
"unicode": "e608",
|
||||
"unicode_decimal": 58888
|
||||
},
|
||||
{
|
||||
"icon_id": "39402087",
|
||||
"name": "组 284",
|
||||
"font_class": "a-zu284",
|
||||
"unicode": "e609",
|
||||
"unicode_decimal": 58889
|
||||
},
|
||||
{
|
||||
"icon_id": "39402105",
|
||||
"name": "组 3",
|
||||
"font_class": "a-zu3",
|
||||
"unicode": "e60a",
|
||||
"unicode_decimal": 58890
|
||||
},
|
||||
{
|
||||
"icon_id": "39402109",
|
||||
"name": "组 133",
|
||||
"font_class": "a-zu133",
|
||||
"unicode": "e60b",
|
||||
"unicode_decimal": 58891
|
||||
},
|
||||
{
|
||||
"icon_id": "39402107",
|
||||
"name": "组 291",
|
||||
"font_class": "a-zu291",
|
||||
"unicode": "e60c",
|
||||
"unicode_decimal": 58892
|
||||
},
|
||||
{
|
||||
"icon_id": "39402106",
|
||||
"name": "组 112",
|
||||
"font_class": "a-zu112",
|
||||
"unicode": "e60d",
|
||||
"unicode_decimal": 58893
|
||||
},
|
||||
{
|
||||
"icon_id": "39402108",
|
||||
"name": "组 63",
|
||||
"font_class": "a-zu63",
|
||||
"unicode": "e60e",
|
||||
"unicode_decimal": 58894
|
||||
},
|
||||
{
|
||||
"icon_id": "39402097",
|
||||
"name": "组 126",
|
||||
"font_class": "a-zu126",
|
||||
"unicode": "e60f",
|
||||
"unicode_decimal": 58895
|
||||
},
|
||||
{
|
||||
"icon_id": "39402104",
|
||||
"name": "组 110",
|
||||
"font_class": "a-zu110",
|
||||
"unicode": "e610",
|
||||
"unicode_decimal": 58896
|
||||
},
|
||||
{
|
||||
"icon_id": "39402091",
|
||||
"name": "组 116",
|
||||
"font_class": "a-zu116",
|
||||
"unicode": "e612",
|
||||
"unicode_decimal": 58898
|
||||
},
|
||||
{
|
||||
"icon_id": "39401777",
|
||||
"name": "组 4",
|
||||
"font_class": "a-zu4",
|
||||
"unicode": "e600",
|
||||
"unicode_decimal": 58880
|
||||
},
|
||||
{
|
||||
"icon_id": "7597941",
|
||||
@ -19,47 +271,12 @@
|
||||
"unicode": "eb6c",
|
||||
"unicode_decimal": 60268
|
||||
},
|
||||
{
|
||||
"icon_id": "3758785",
|
||||
"name": "矿山",
|
||||
"font_class": "kuangshan",
|
||||
"unicode": "e6a6",
|
||||
"unicode_decimal": 59046
|
||||
},
|
||||
{
|
||||
"icon_id": "14656272",
|
||||
"name": "生产企业",
|
||||
"font_class": "shengchanqiye",
|
||||
"unicode": "e732",
|
||||
"unicode_decimal": 59186
|
||||
},
|
||||
{
|
||||
"icon_id": "37507407",
|
||||
"name": "生产单元信息",
|
||||
"font_class": "shengchandanyuanxinxi",
|
||||
"unicode": "e606",
|
||||
"unicode_decimal": 58886
|
||||
},
|
||||
{
|
||||
"icon_id": "18863151",
|
||||
"name": "菜单",
|
||||
"font_class": "caidan1",
|
||||
"unicode": "e640",
|
||||
"unicode_decimal": 58944
|
||||
},
|
||||
{
|
||||
"icon_id": "24551787",
|
||||
"name": "菜单",
|
||||
"font_class": "line-108",
|
||||
"unicode": "e76e",
|
||||
"unicode_decimal": 59246
|
||||
},
|
||||
{
|
||||
"icon_id": "6337586",
|
||||
"name": "菜单",
|
||||
"font_class": "caidan",
|
||||
"unicode": "e689",
|
||||
"unicode_decimal": 59017
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
src/assets/home/1x.png
Normal file
BIN
src/assets/home/1x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
BIN
src/assets/home/2x.png
Normal file
BIN
src/assets/home/2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
BIN
src/assets/home/3x.png
Normal file
BIN
src/assets/home/3x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.7 KiB |
BIN
src/assets/login/111.png
Normal file
BIN
src/assets/login/111.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
src/assets/login/back1.png
Normal file
BIN
src/assets/login/back1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
src/assets/login/下载 (1).png
Normal file
BIN
src/assets/login/下载 (1).png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
BIN
src/assets/login/切片 1.png
Normal file
BIN
src/assets/login/切片 1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 728 KiB |
BIN
src/assets/logo-slider.jpg
Normal file
BIN
src/assets/logo-slider.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
@ -73,7 +73,8 @@ class HM123ShowPrint extends React.Component {
|
||||
DealMeasuresStr:item.DealMeasuresStr,
|
||||
AUDIT_LEVEL:item.AUDIT_LEVEL,
|
||||
Nav_WorkPermitType:item.Nav_WorkPermitType,
|
||||
Nav_Files:item.Nav_Files
|
||||
Nav_Files:item.Nav_Files,
|
||||
CYCLE_TYPE:item.CYCLE_TYPE
|
||||
}
|
||||
detailTemp.push(objIdentifying);
|
||||
})
|
||||
@ -90,7 +91,8 @@ class HM123ShowPrint extends React.Component {
|
||||
DealMeasuresStr:item.DealMeasuresStr,
|
||||
Nav_WorkPermitType:item.Nav_WorkPermitType,
|
||||
AUDIT_LEVEL:item.AUDIT_LEVEL,
|
||||
Nav_Files:item.Nav_Files
|
||||
Nav_Files:item.Nav_Files,
|
||||
CYCLE_TYPE:item.CYCLE_TYPE
|
||||
}
|
||||
detailTemp.push(objIdentifying);
|
||||
})
|
||||
@ -107,7 +109,8 @@ class HM123ShowPrint extends React.Component {
|
||||
DealMeasuresStr:item.DealMeasuresStr,
|
||||
Nav_WorkPermitType:item.Nav_WorkPermitType,
|
||||
AUDIT_LEVEL:item.AUDIT_LEVEL,
|
||||
Nav_Files:item.Nav_Files
|
||||
Nav_Files:item.Nav_Files,
|
||||
CYCLE_TYPE:item.CYCLE_TYPE
|
||||
}
|
||||
detailTemp.push(objIdentifying);
|
||||
})
|
||||
|
||||
@ -277,7 +277,7 @@ const NavOpton = (props) => {
|
||||
{/* <Icon type='bars' className='header__right-icon'></Icon> */}
|
||||
<IconFont
|
||||
type="icon-line-108"
|
||||
style={{ fontSize: "22px", color: "#333333", cursor: "pointer" }}
|
||||
style={{ fontSize: "22px", color: "#606266", cursor: "pointer" }}
|
||||
></IconFont>
|
||||
</div>
|
||||
<Modal
|
||||
@ -313,7 +313,7 @@ function Header(props) {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={`header ${props.matchLogin ? "login" : ""}`}>
|
||||
<div className={`header ${props.matchLogin ? "login" : "nologin"}`}>
|
||||
<div className="header__left">
|
||||
<PictureThumb
|
||||
thumbCodes={thumbCode ? [thumbCode] : []}
|
||||
@ -331,7 +331,7 @@ function Header(props) {
|
||||
}`}
|
||||
>
|
||||
矿山安全生产标准化系统
|
||||
<span style={{ color: "#c99d03" }}>（SPS）</span>
|
||||
<span style={{ color: "#c99d03" }}>（SMS）</span>
|
||||
{baseConfig.SYS_NAME}{" "}
|
||||
</span>
|
||||
)}
|
||||
|
||||
@ -1,66 +1,69 @@
|
||||
:global {
|
||||
@main-bg : #ffffff;//#033C67 #f5f5f5
|
||||
@opacity-bg : rgba(72, 133, 255, 0.2);
|
||||
@main-bg: #f4f7ff; //#033C67 #f5f5f5
|
||||
@opacity-bg: rgba(72, 133, 255, 0.2);
|
||||
@header-prefix: header;
|
||||
.headerModal {
|
||||
|
||||
.ant-modal-footer {
|
||||
display: none;
|
||||
}
|
||||
.ant-modal-footer {
|
||||
display: none;
|
||||
}
|
||||
.ant-modal-body {
|
||||
max-height: 90vh;
|
||||
}
|
||||
|
||||
}
|
||||
.ant-modal {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
|
||||
.@{header-prefix} {
|
||||
width : 100%;
|
||||
height : 100%;
|
||||
padding : 0 24px;
|
||||
background-color: @main-bg;
|
||||
box-shadow : 0 0 10px rgba(0, 0, 0, 0.25);//rgba(250, 246, 246, 0.25)
|
||||
transition : background-color .2s ease;
|
||||
// width: 100%;
|
||||
height: 100%;
|
||||
padding: 0 24px;
|
||||
margin: 0px 10px;
|
||||
// background-color: @main-bg;
|
||||
// box-shadow : 0 0 10px rgba(0, 0, 0, 0.25);//rgba(250, 246, 246, 0.25)
|
||||
transition: background-color 0.2s ease;
|
||||
|
||||
&.login {
|
||||
background-color: @opacity-bg;
|
||||
// background-color: @opacity-bg;
|
||||
}
|
||||
&.nologin {
|
||||
// background-color: @opacity-bg;
|
||||
background-color: @main-bg;
|
||||
// box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); //rgba(250, 246, 246, 0.25)
|
||||
}
|
||||
|
||||
&__left,
|
||||
&__right {
|
||||
height : 100%;
|
||||
display : flex;
|
||||
flex-direction : row;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items : center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__left {
|
||||
float: left;
|
||||
|
||||
&-logo {
|
||||
width : auto;
|
||||
height : 52px;
|
||||
width: auto;
|
||||
height: 52px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
&-slogan {
|
||||
font-size : 16px;
|
||||
font-size: 16px;
|
||||
font-weight: bolder;
|
||||
color : #333333;//#f3eded
|
||||
color: #606266; //#f3eded
|
||||
}
|
||||
&-sloganLogin {
|
||||
font-size : 16px;
|
||||
font-size: 16px;
|
||||
font-weight: bolder;
|
||||
color : #ffffffdc;//#f3eded
|
||||
color: #ffffffdc; //#f3eded
|
||||
}
|
||||
&-slogan-mobile {
|
||||
font-size : 11px;
|
||||
font-size: 11px;
|
||||
font-weight: bolder;
|
||||
color : #333333;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
@ -69,18 +72,18 @@
|
||||
|
||||
&-icon {
|
||||
font-size: 22px !important;
|
||||
color : #333333 !important;//f3eded
|
||||
cursor : pointer;
|
||||
color: #606266 !important; //f3eded
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&-datav {
|
||||
font-size : 0;
|
||||
font-size: 0;
|
||||
margin-right: 36px;
|
||||
}
|
||||
|
||||
&-user {
|
||||
font-size : 0;
|
||||
margin-left : 36px;
|
||||
font-size: 0;
|
||||
margin-left: 36px;
|
||||
margin-right: 26;
|
||||
}
|
||||
}
|
||||
|
||||
2156
src/routes/Home1.js
Normal file
2156
src/routes/Home1.js
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,415 +1,497 @@
|
||||
// 核心库
|
||||
import React from 'react'
|
||||
import { connect } from 'dva'
|
||||
import React from "react";
|
||||
import { connect } from "dva";
|
||||
// 组件库
|
||||
import { Button, Checkbox, Form, Icon, Input, TreeSelect, message, notification } from 'antd'
|
||||
import {
|
||||
Button,
|
||||
Checkbox,
|
||||
Form,
|
||||
Icon,
|
||||
Input,
|
||||
TreeSelect,
|
||||
message,
|
||||
notification,
|
||||
Divider,
|
||||
} from "antd";
|
||||
// 工具库
|
||||
import MD5 from 'md5'
|
||||
import storage from '../utils/storage'
|
||||
import { guid } from '../utils/common'
|
||||
import config from '../config'
|
||||
import MD5 from "md5";
|
||||
import storage from "../utils/storage";
|
||||
import { guid } from "../utils/common";
|
||||
import config from "../config";
|
||||
// 样式
|
||||
import './login.less'
|
||||
import "./login.less";
|
||||
|
||||
const openNotificationPass = placement => {
|
||||
const openNotificationPass = (placement) => {
|
||||
notification.info({
|
||||
duration: null,
|
||||
message: `密码修改提示：`,
|
||||
description:
|
||||
'您的登录密码过于简单，请尽快修改您的登录密码！',
|
||||
description: "您的登录密码过于简单，请尽快修改您的登录密码！",
|
||||
placement,
|
||||
});
|
||||
};
|
||||
|
||||
const openNotificationMobile = placement => {
|
||||
const openNotificationMobile = (placement) => {
|
||||
notification.info({
|
||||
//duration: null,
|
||||
message: `浏览友情提示：`,
|
||||
description:
|
||||
'您当前用的是手机在访问，为更好使用体验，建议用电脑访问！',
|
||||
description: "您当前用的是手机在访问，为更好使用体验，建议用电脑访问！",
|
||||
placement,
|
||||
});
|
||||
};
|
||||
|
||||
class LoginPage extends React.Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
super(props);
|
||||
this.state = {
|
||||
treeData: [],
|
||||
tokenData: {},
|
||||
formData: {
|
||||
orgId: undefined,
|
||||
username: '',
|
||||
password: '',
|
||||
verifyCode: '',
|
||||
phoneCode: ''
|
||||
username: "",
|
||||
password: "",
|
||||
verifyCode: "",
|
||||
phoneCode: "",
|
||||
},
|
||||
verify: {
|
||||
orgId: '',
|
||||
username: '',
|
||||
password: '',
|
||||
verifyCode: '',
|
||||
phoneCode: ''
|
||||
orgId: "",
|
||||
username: "",
|
||||
password: "",
|
||||
verifyCode: "",
|
||||
phoneCode: "",
|
||||
},
|
||||
// 图片验证码
|
||||
verifyCodeApi: config.serviceHost('api/UT/VerificationCode/Number'),
|
||||
verifyCodeApi: config.serviceHost("api/UT/VerificationCode/Number"),
|
||||
verifyRandomCode: guid(),
|
||||
// 手机验证码
|
||||
hasCheckPhoneCode: storage('lacal').getItem('verifyPhoneCode').val,
|
||||
hasCheckPhoneCode: storage("lacal").getItem("verifyPhoneCode").val,
|
||||
isCheckPhoneCode: null,
|
||||
// 重发验证码倒计时
|
||||
checkTime: 60,
|
||||
// 登陆错误提示
|
||||
loginError: ''
|
||||
}
|
||||
this.timer = -1
|
||||
loginError: "",
|
||||
};
|
||||
this.timer = -1;
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
if (window.navigator.userAgent.indexOf("Windows") < 1) {
|
||||
window.location.replace(config.guideH5Host)
|
||||
window.location.replace(config.guideH5Host);
|
||||
//alert('手机');
|
||||
}
|
||||
// if (window.navigator.userAgent.indexOf("Windows") < 1) openNotificationMobile('bottomRight');
|
||||
this.removeRequestKey()
|
||||
this.getOrgList()
|
||||
this.removeRequestKey();
|
||||
this.getOrgList();
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
clearInterval(this.timer)
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
|
||||
removeRequestKey = () => {
|
||||
const { localStorage } = window
|
||||
const { localStorage } = window;
|
||||
for (let i = 0; i < localStorage.length; i++) {
|
||||
const key = localStorage.key(i)
|
||||
key.indexOf('_requestKey') > -1 && localStorage.removeItem(key)
|
||||
const key = localStorage.key(i);
|
||||
key.indexOf("_requestKey") > -1 && localStorage.removeItem(key);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
recurseData = (data) => {
|
||||
data.forEach(item => {
|
||||
const { Node = item, Children } = item
|
||||
item.title = `${Node.NAME}(${Node.CODE})`
|
||||
item.key = Node.ID
|
||||
item.value = Node.ID
|
||||
Children && Children.length && this.recurseData(Children)
|
||||
})
|
||||
}
|
||||
data.forEach((item) => {
|
||||
const { Node = item, Children } = item;
|
||||
item.title = `${Node.NAME}(${Node.CODE})`;
|
||||
item.key = Node.ID;
|
||||
item.value = Node.ID;
|
||||
Children && Children.length && this.recurseData(Children);
|
||||
});
|
||||
};
|
||||
|
||||
getOrgList = () => {
|
||||
this.props.dispatch({
|
||||
type: 'login/getOrg',
|
||||
payload: {
|
||||
Sort: 'CODE',
|
||||
Order: 0,
|
||||
Parameter10: window.location.host,
|
||||
Parameter11: '0'
|
||||
}
|
||||
}).then(res => {
|
||||
if (res && res.Data) {
|
||||
this.recurseData(res.Data)
|
||||
this.setState({
|
||||
treeData: res.Data,
|
||||
formData: {
|
||||
...this.state.formData,
|
||||
orgId: storage('lacal').getItem('webOrgId').val ? storage('lacal').getItem('webOrgId').val : res.Data[0].Node.ORG_ID,
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
this.props
|
||||
.dispatch({
|
||||
type: "login/getOrg",
|
||||
payload: {
|
||||
Sort: "CODE",
|
||||
Order: 0,
|
||||
Parameter10: window.location.host,
|
||||
Parameter11: "0",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res && res.Data) {
|
||||
this.recurseData(res.Data);
|
||||
this.setState({
|
||||
treeData: res.Data,
|
||||
formData: {
|
||||
...this.state.formData,
|
||||
orgId: storage("lacal").getItem("webOrgId").val
|
||||
? storage("lacal").getItem("webOrgId").val
|
||||
: res.Data[0].Node.ORG_ID,
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
handleFormChange = (type, val) => {
|
||||
this.setState({
|
||||
formData: {
|
||||
...this.state.formData,
|
||||
[type]: val
|
||||
[type]: val,
|
||||
},
|
||||
verify: {
|
||||
...this.state.verify,
|
||||
[type]: val ? '' : 'error'
|
||||
}
|
||||
})
|
||||
}
|
||||
[type]: val ? "" : "error",
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
startCountDown = () => {
|
||||
this.timer = setInterval(() => {
|
||||
const { checkTime } = this.state
|
||||
const { checkTime } = this.state;
|
||||
if (checkTime > 0) {
|
||||
this.setState({ checkTime: checkTime - 1 })
|
||||
this.setState({ checkTime: checkTime - 1 });
|
||||
} else {
|
||||
clearInterval(this.timer)
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
}, 1000);
|
||||
};
|
||||
|
||||
getPhoneCode = () => {
|
||||
const { tokenData, formData } = this.state
|
||||
this.props.dispatch({
|
||||
type: 'app/getDataByGet',
|
||||
url: 'PF/VerifyPhone/PhoneVerifyCode',
|
||||
payload: {
|
||||
uid: tokenData.userid,
|
||||
orgId: formData.orgId
|
||||
},
|
||||
onlyData: false
|
||||
}).then(res => {
|
||||
if (res) {
|
||||
if (!res.IsSuccessful) {
|
||||
message.error(res.ErrorMessage)
|
||||
this.setState({ isCheckPhoneCode: null })
|
||||
return
|
||||
const { tokenData, formData } = this.state;
|
||||
this.props
|
||||
.dispatch({
|
||||
type: "app/getDataByGet",
|
||||
url: "PF/VerifyPhone/PhoneVerifyCode",
|
||||
payload: {
|
||||
uid: tokenData.userid,
|
||||
orgId: formData.orgId,
|
||||
},
|
||||
onlyData: false,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res) {
|
||||
if (!res.IsSuccessful) {
|
||||
message.error(res.ErrorMessage);
|
||||
this.setState({ isCheckPhoneCode: null });
|
||||
return;
|
||||
}
|
||||
this.setState({ checkTime: tokenData.second }, this.startCountDown);
|
||||
}
|
||||
this.setState({ checkTime: tokenData.second }, this.startCountDown)
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
toLogin = (requestCode = false) => {
|
||||
const { tokenData, formData } = this.state
|
||||
const { orgId, username, password, phoneCode } = formData
|
||||
const { tokenData, formData } = this.state;
|
||||
const { orgId, username, password, phoneCode } = formData;
|
||||
this.props.dispatch({
|
||||
type: 'app/getDataByPost',
|
||||
url: 'BI/BIController/getVersion',
|
||||
type: "app/getDataByPost",
|
||||
url: "BI/BIController/getVersion",
|
||||
onComplete: (ret) => {
|
||||
if (ret > config.version) {
|
||||
window.localStorage.clear()
|
||||
message.success('清除成功，即将重新加载页面', 2, () => {
|
||||
setTimeout(() => window.location.reload(true), 500)
|
||||
})
|
||||
window.localStorage.clear();
|
||||
message.success("清除成功，即将重新加载页面", 2, () => {
|
||||
setTimeout(() => window.location.reload(true), 500);
|
||||
});
|
||||
} else {
|
||||
this.props.dispatch({
|
||||
type: 'login/toLogin',
|
||||
payload: {
|
||||
Parameter1: username,
|
||||
Parameter2: MD5(password),
|
||||
Parameter4: orgId,
|
||||
Parameter5: storage('lacal').getItem('formConfigVersion').val,
|
||||
Parameter6: requestCode,
|
||||
Parameter7: phoneCode
|
||||
},
|
||||
loginPayload: {
|
||||
username: username,
|
||||
password: MD5(password),
|
||||
accessToken: tokenData.access_token,
|
||||
refreshToken: tokenData.refreshToken,
|
||||
expiresIn: tokenData.expiresIn,
|
||||
userid: tokenData.userid
|
||||
}
|
||||
}).then(validRes => {
|
||||
if (validRes) {
|
||||
storage('lacal').setItem('verifyPhoneCode', tokenData.userid)
|
||||
this.props.dispatch({
|
||||
type: 'app/getAllEnum',
|
||||
})
|
||||
//if (window.navigator.userAgent.indexOf("Windows") < 1) openNotificationMobile('topRight');
|
||||
//暂时先取消
|
||||
//if(password == '123456' || password == '1234' || password == '123' || password == '111111' || password == '12345678' || password == '888888') openNotificationPass('topRight');
|
||||
if (window.navigator.userAgent.indexOf("Windows") < 1) {
|
||||
// window.location.replace('http://localhost:8000/#/HomeMobileTask')
|
||||
window.location.replace(config.guideH5Host)
|
||||
// this.props.history.push({ pathname: '/HomeMobileNew' })
|
||||
} else {
|
||||
this.props.history.push({ pathname: '/home' })
|
||||
this.props
|
||||
.dispatch({
|
||||
type: "login/toLogin",
|
||||
payload: {
|
||||
Parameter1: username,
|
||||
Parameter2: MD5(password),
|
||||
Parameter4: orgId,
|
||||
Parameter5: storage("lacal").getItem("formConfigVersion").val,
|
||||
Parameter6: requestCode,
|
||||
Parameter7: phoneCode,
|
||||
},
|
||||
loginPayload: {
|
||||
username: username,
|
||||
password: MD5(password),
|
||||
accessToken: tokenData.access_token,
|
||||
refreshToken: tokenData.refreshToken,
|
||||
expiresIn: tokenData.expiresIn,
|
||||
userid: tokenData.userid,
|
||||
},
|
||||
})
|
||||
.then((validRes) => {
|
||||
if (validRes) {
|
||||
storage("lacal").setItem("verifyPhoneCode", tokenData.userid);
|
||||
this.props.dispatch({
|
||||
type: "app/getAllEnum",
|
||||
});
|
||||
//if (window.navigator.userAgent.indexOf("Windows") < 1) openNotificationMobile('topRight');
|
||||
//暂时先取消
|
||||
//if(password == '123456' || password == '1234' || password == '123' || password == '111111' || password == '12345678' || password == '888888') openNotificationPass('topRight');
|
||||
if (window.navigator.userAgent.indexOf("Windows") < 1) {
|
||||
// window.location.replace('http://localhost:8000/#/HomeMobileTask')
|
||||
window.location.replace(config.guideH5Host);
|
||||
// this.props.history.push({ pathname: '/HomeMobileNew' })
|
||||
} else {
|
||||
this.props.history.push({ pathname: "/home" });
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
preLogin = () => {
|
||||
const { formData, verifyRandomCode } = this.state
|
||||
const { orgId, username, password, verifyCode } = formData
|
||||
this.props.dispatch({
|
||||
type: 'login/getToken',
|
||||
payload: {
|
||||
orgId,
|
||||
username,
|
||||
password: MD5(password),
|
||||
grant_type: 0,
|
||||
random: verifyRandomCode,
|
||||
verificationCode: verifyCode
|
||||
}
|
||||
}).then(res => {
|
||||
// this.setState({
|
||||
// formData: {
|
||||
// ...this.state.formData,
|
||||
// orgId: res.orgId,
|
||||
// }
|
||||
// })
|
||||
if (res) {
|
||||
if (res.error) {
|
||||
this.setState({ loginError: res.error_description })
|
||||
return
|
||||
const { formData, verifyRandomCode } = this.state;
|
||||
const { orgId, username, password, verifyCode } = formData;
|
||||
this.props
|
||||
.dispatch({
|
||||
type: "login/getToken",
|
||||
payload: {
|
||||
orgId,
|
||||
username,
|
||||
password: MD5(password),
|
||||
grant_type: 0,
|
||||
random: verifyRandomCode,
|
||||
verificationCode: verifyCode,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
// this.setState({
|
||||
// formData: {
|
||||
// ...this.state.formData,
|
||||
// orgId: res.orgId,
|
||||
// }
|
||||
// })
|
||||
if (res) {
|
||||
if (res.error) {
|
||||
this.setState({ loginError: res.error_description });
|
||||
return;
|
||||
}
|
||||
const { isCheckPhoneCode, userid } = res;
|
||||
const { hasCheckPhoneCode } = this.state;
|
||||
if (
|
||||
isCheckPhoneCode &&
|
||||
(!hasCheckPhoneCode || hasCheckPhoneCode.indexOf(userid) === -1)
|
||||
) {
|
||||
// 需要进行验证码验证
|
||||
this.setState(
|
||||
{
|
||||
isCheckPhoneCode: true,
|
||||
tokenData: res,
|
||||
},
|
||||
this.getPhoneCode
|
||||
);
|
||||
} else {
|
||||
// 不需要进行验证码验证，则直接登录
|
||||
this.setState({ tokenData: res }, this.toLogin);
|
||||
}
|
||||
}
|
||||
const { isCheckPhoneCode, userid } = res
|
||||
const { hasCheckPhoneCode } = this.state
|
||||
if (isCheckPhoneCode && (!hasCheckPhoneCode || hasCheckPhoneCode.indexOf(userid) === -1)) {
|
||||
// 需要进行验证码验证
|
||||
this.setState({
|
||||
isCheckPhoneCode: true,
|
||||
tokenData: res
|
||||
}, this.getPhoneCode)
|
||||
} else {
|
||||
// 不需要进行验证码验证，则直接登录
|
||||
this.setState({ tokenData: res }, this.toLogin)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
formFieldInvalid = () => {
|
||||
const { formData, isCheckPhoneCode } = this.state
|
||||
const { orgId, username, password, verifyCode, phoneCode } = formData
|
||||
const phoneCodeVerify = !isCheckPhoneCode || (isCheckPhoneCode === true && phoneCode)
|
||||
const { formData, isCheckPhoneCode } = this.state;
|
||||
const { orgId, username, password, verifyCode, phoneCode } = formData;
|
||||
const phoneCodeVerify =
|
||||
!isCheckPhoneCode || (isCheckPhoneCode === true && phoneCode);
|
||||
this.setState({
|
||||
verify: {
|
||||
//orgId: orgId ? '' : 'error',
|
||||
username: username ? '' : 'error',
|
||||
password: password ? '' : 'error',
|
||||
verifyCode: verifyCode ? '' : 'error',
|
||||
phoneCode: phoneCodeVerify ? '' : 'error'
|
||||
}
|
||||
})
|
||||
username: username ? "" : "error",
|
||||
password: password ? "" : "error",
|
||||
verifyCode: verifyCode ? "" : "error",
|
||||
phoneCode: phoneCodeVerify ? "" : "error",
|
||||
},
|
||||
});
|
||||
//return !orgId || !username || !password || !verifyCode || !phoneCodeVerify
|
||||
return !username || !password || !verifyCode || !phoneCodeVerify
|
||||
|
||||
}
|
||||
return !username || !password || !verifyCode || !phoneCodeVerify;
|
||||
};
|
||||
|
||||
handleLogin = () => {
|
||||
if (this.formFieldInvalid()) return
|
||||
if (this.formFieldInvalid()) return;
|
||||
|
||||
const { isCheckPhoneCode } = this.state
|
||||
!isCheckPhoneCode ? this.preLogin() : this.toLogin(true)
|
||||
}
|
||||
const { isCheckPhoneCode } = this.state;
|
||||
!isCheckPhoneCode ? this.preLogin() : this.toLogin(true);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { loading } = this.props
|
||||
const { tokenData, formData, treeData, verify, verifyCodeApi, verifyRandomCode, isCheckPhoneCode, checkTime, loginError } = this.state
|
||||
const { orgId, username, password, verifyCode, phoneCode } = verify
|
||||
const { loading } = this.props;
|
||||
const {
|
||||
tokenData,
|
||||
formData,
|
||||
treeData,
|
||||
verify,
|
||||
verifyCodeApi,
|
||||
verifyRandomCode,
|
||||
isCheckPhoneCode,
|
||||
checkTime,
|
||||
loginError,
|
||||
} = this.state;
|
||||
const { orgId, username, password, verifyCode, phoneCode } = verify;
|
||||
|
||||
return (
|
||||
<div className='login-page'>
|
||||
<div className='login-page__main'>
|
||||
<div className='login-page__slogan'>
|
||||
<div className="login-page">
|
||||
<div className="login-page__main">
|
||||
<div className="login-page__slogan">
|
||||
{/* <p>人人讲安全</p>
|
||||
<p>安全为人人</p>
|
||||
<img src={require('../assets/login/product.png')} alt='product' /> */}
|
||||
</div>
|
||||
<div className='login-page__login'>
|
||||
<p className='login-page__login-cn'>用户登录</p>
|
||||
<div className="login-page__login">
|
||||
<p className="login-page__login-cn">欢迎登录SMS</p>
|
||||
<p className="login-page__login-cne">WELCOME!</p>
|
||||
{/* <span className='login-page__login-en'>LOGIN</span> */}
|
||||
<div className='login-page__login-box'>
|
||||
<div className={`login-page__login-formWrap ${isCheckPhoneCode === true ? 'showPhoneCode' : ''}`}>
|
||||
<Form className='login-page__login-form'>
|
||||
<Form.Item validateStatus={orgId} style={{display:"none"}}>
|
||||
<div className="login-page__login-box">
|
||||
<div
|
||||
className={`login-page__login-formWrap ${
|
||||
isCheckPhoneCode === true ? "showPhoneCode" : ""
|
||||
}`}
|
||||
>
|
||||
<Form className="login-page__login-form">
|
||||
<Form.Item validateStatus={orgId} style={{ display: "none" }}>
|
||||
<TreeSelect
|
||||
treeDefaultExpandAll
|
||||
treeData={treeData}
|
||||
value={formData.orgId}
|
||||
onChange={val => this.handleFormChange('orgId', val)}
|
||||
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
|
||||
placeholder='请选择组织'
|
||||
onChange={(val) => this.handleFormChange("orgId", val)}
|
||||
dropdownStyle={{ maxHeight: 400, overflow: "auto" }}
|
||||
placeholder="请选择组织"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item validateStatus={username} style={{marginTop:"40px"}}>
|
||||
<Form.Item
|
||||
validateStatus={username}
|
||||
style={{ marginTop: "20px" }}
|
||||
>
|
||||
<Input
|
||||
onChange={evt => this.handleFormChange('username', evt.target.value)}
|
||||
onChange={(evt) =>
|
||||
this.handleFormChange("username", evt.target.value)
|
||||
}
|
||||
onPressEnter={this.handleLogin}
|
||||
prefix={<Icon type='user' />}
|
||||
prefix={
|
||||
<div style={{ marginRight: "10px" }}>
|
||||
<Icon type="user" style={{ color: "#7485be" }} />
|
||||
<Divider
|
||||
type="vertical"
|
||||
style={{ backgroundColor: "#d4d9e5" }}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
placeholder="请输入用户名"
|
||||
className='login-page__login-input'
|
||||
className="login-page__login-input"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item validateStatus={password}>
|
||||
<Input
|
||||
type='password'
|
||||
onChange={evt => this.handleFormChange('password', evt.target.value)}
|
||||
type="password"
|
||||
onChange={(evt) =>
|
||||
this.handleFormChange("password", evt.target.value)
|
||||
}
|
||||
onPressEnter={this.handleLogin}
|
||||
prefix={<Icon type='lock' />}
|
||||
placeholder='请输入密码'
|
||||
className='login-page__login-input'
|
||||
prefix={
|
||||
<div style={{ marginRight: "10px" }}>
|
||||
<Icon type="lock" style={{ color: "#7485be" }} />
|
||||
<Divider
|
||||
type="vertical"
|
||||
style={{ backgroundColor: "#d4d9e5" }}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
placeholder="请输入密码"
|
||||
className="login-page__login-input"
|
||||
/>
|
||||
</Form.Item>
|
||||
<div className='login-page__login-pwd'>
|
||||
<div className="login-page__login-pwd">
|
||||
<Checkbox defaultChecked>记住密码</Checkbox>
|
||||
{/* <a>忘记密码？</a> */}
|
||||
</div>
|
||||
<Form.Item validateStatus={verifyCode}>
|
||||
<Form.Item validateStatus={verifyCode} style={{ marginBottom: "20px" }}>
|
||||
<Input
|
||||
onChange={evt => this.handleFormChange('verifyCode', evt.target.value)}
|
||||
onChange={(evt) =>
|
||||
this.handleFormChange("verifyCode", evt.target.value)
|
||||
}
|
||||
onPressEnter={this.handleLogin}
|
||||
prefix={<Icon type='safety' />}
|
||||
prefix={
|
||||
<div style={{ marginRight: "10px" }}>
|
||||
<Icon type="safety" style={{ color: "#7485be" }} />
|
||||
<Divider
|
||||
type="vertical"
|
||||
style={{ backgroundColor: "#d4d9e5" }}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
suffix={
|
||||
<img
|
||||
key={verifyRandomCode}
|
||||
src={`${verifyCodeApi}?random=${verifyRandomCode}`}
|
||||
alt='验证码'
|
||||
onClick={() => this.setState({ verifyRandomCode: guid() })}
|
||||
className='login-page__login-verifyCode'
|
||||
alt="验证码"
|
||||
onClick={() =>
|
||||
this.setState({ verifyRandomCode: guid() })
|
||||
}
|
||||
className="login-page__login-verifyCode"
|
||||
/>
|
||||
}
|
||||
placeholder='验证码'
|
||||
className='login-page__login-input'
|
||||
placeholder="验证码"
|
||||
className="login-page__login-input"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
<Form className='login-page__login-form'>
|
||||
<Form className="login-page__login-form">
|
||||
<Form.Item>
|
||||
<Input
|
||||
disabled
|
||||
value={`验证码已发送：${tokenData.phoneNumber}`}
|
||||
prefix={<Icon type='phone' />}
|
||||
className='login-page__login-input'
|
||||
prefix={<Icon type="phone" />}
|
||||
className="login-page__login-input"
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item validateStatus={phoneCode}>
|
||||
<Input
|
||||
onChange={evt => this.handleFormChange('phoneCode', evt.target.value)}
|
||||
onChange={(evt) =>
|
||||
this.handleFormChange("phoneCode", evt.target.value)
|
||||
}
|
||||
onPressEnter={this.handleLogin}
|
||||
prefix={<Icon type='message' />}
|
||||
prefix={<Icon type="message" />}
|
||||
suffix={
|
||||
<Button
|
||||
disabled={checkTime > 0}
|
||||
size='small'
|
||||
type='primary'
|
||||
size="small"
|
||||
type="primary"
|
||||
onClick={this.getPhoneCode}
|
||||
className='login-page__login-verifyCode'
|
||||
>{`${checkTime > 0 ? checkTime + 's后' : ''}再次发送`}</Button>
|
||||
className="login-page__login-verifyCode"
|
||||
>{`${
|
||||
checkTime > 0 ? checkTime + "s后" : ""
|
||||
}再次发送`}</Button>
|
||||
}
|
||||
placeholder='请输入短信验证码'
|
||||
className='login-page__login-input'
|
||||
placeholder="请输入短信验证码"
|
||||
className="login-page__login-input"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
<Button
|
||||
type='primary'
|
||||
className='login-page__login-btn'
|
||||
disabled={loading.effects['login/getOrg']}
|
||||
loading={!!loading.effects['login/toLogin']}
|
||||
type="primary"
|
||||
className="login-page__login-btn"
|
||||
disabled={loading.effects["login/getOrg"]}
|
||||
loading={!!loading.effects["login/toLogin"]}
|
||||
onClick={this.handleLogin}
|
||||
>登录</Button>
|
||||
{loginError ? <div className='login-page__login-error'>{loginError}</div> : null}
|
||||
>
|
||||
立即登录
|
||||
</Button>
|
||||
{loginError ? (
|
||||
<div className="login-page__login-error">{loginError}</div>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
<div className='login-page__footer'>
|
||||
<div className="login-page__footer">
|
||||
{/* <img src={require('../assets/login/footer_logo.png')} alt='OPT' /> */}
|
||||
<div className='login-page__footer-copyright'>
|
||||
<div className="login-page__footer-copyright">
|
||||
<p>Copyright ©2022-2023 厦门鸣鹤管理咨询股份有限公司</p>
|
||||
</div>
|
||||
<div className='login-page__footer-qrcode'>
|
||||
<div className="login-page__footer-qrcode">
|
||||
{/* <img src={require('../assets/login/footer_qrcode.png')} alt='二维码' />
|
||||
<p>访问移动端</p> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default connect(({ login, loading }) => ({ login, loading }))(LoginPage)
|
||||
export default connect(({ login, loading }) => ({ login, loading }))(LoginPage);
|
||||
|
||||
@ -2,36 +2,37 @@
|
||||
@login-page: login-page;
|
||||
|
||||
.@{login-page} {
|
||||
position : relative;
|
||||
width : 100%;
|
||||
height : 100%;
|
||||
display : flex;
|
||||
flex-direction : column;
|
||||
justify-content : center;
|
||||
align-items : center;
|
||||
background : url('../assets/login/bg.png') center no-repeat;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: end;
|
||||
background: url("../assets/login/111.png") no-repeat;
|
||||
background-color: #d8ebff;
|
||||
background-size : cover;
|
||||
overflow : hidden;
|
||||
padding-bottom : 80px;
|
||||
background-size: cover;
|
||||
overflow: hidden;
|
||||
// padding-bottom: 80px;
|
||||
//padding-right : 80px;
|
||||
|
||||
&__main {
|
||||
width : 100%;
|
||||
display : flex;
|
||||
flex-direction : row;
|
||||
width: 40%;
|
||||
// margin-right: 5%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items : center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__slogan {
|
||||
margin-right: 1%; //登录背景框的
|
||||
margin-right: 1%; //登录背景框的
|
||||
|
||||
p {
|
||||
margin : 0 0 0 34px;
|
||||
font-size : 30px;
|
||||
margin: 0 0 0 34px;
|
||||
font-size: 30px;
|
||||
line-height: 38px;
|
||||
color : #1458BD;
|
||||
color: #1458bd;
|
||||
|
||||
&:nth-child(2) {
|
||||
margin-left: 68px;
|
||||
@ -39,49 +40,57 @@
|
||||
}
|
||||
|
||||
img {
|
||||
width : 460px;
|
||||
height : auto;
|
||||
width: 460px;
|
||||
height: auto;
|
||||
margin-top: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
&__login {
|
||||
width : 403px;
|
||||
height : 450px;
|
||||
padding : 0 58px;
|
||||
background : url('../assets/login/login_box.png') center no-repeat;
|
||||
background-size: contain;
|
||||
background-position: -4px;
|
||||
display : flex;
|
||||
flex-direction : column;
|
||||
width: 403px;
|
||||
height: 450px;
|
||||
padding: 0 58px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items : center;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
border-radius: 25px;
|
||||
box-shadow: 0px 0px 50px 0px #8bacff;
|
||||
|
||||
&-cn {
|
||||
font-size : 20px;
|
||||
font-size: 22px;
|
||||
line-height: 1;
|
||||
margin : 32px 0 16px 0;
|
||||
color : #1458BD;
|
||||
margin: 32px 0 16px 0;
|
||||
color: #02112b;
|
||||
font-weight: bold;
|
||||
}
|
||||
&-cne {
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
// margin: 32px 0 16px 0;
|
||||
color: #02112b;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
&-en {
|
||||
font-size : 12px;
|
||||
line-height : 1;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
margin-bottom: 16px;
|
||||
color : #9EADC5;
|
||||
display : inline-block;
|
||||
color: #9eadc5;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
&-box {
|
||||
width : 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
&-formWrap {
|
||||
display : flex;
|
||||
width : 200%;
|
||||
overflow : hidden;
|
||||
transition: all .2s ease;
|
||||
display: flex;
|
||||
width: 200%;
|
||||
overflow: hidden;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
&.showPhoneCode {
|
||||
transform: translateX(-50%);
|
||||
@ -102,23 +111,33 @@
|
||||
}
|
||||
|
||||
&-input {
|
||||
::placeholder {
|
||||
color: #98a0b8 !important;
|
||||
}
|
||||
|
||||
.ant-input {
|
||||
padding-left: 36px !important;
|
||||
padding-left: 46px !important;
|
||||
background-color: #f5f9fe !important;
|
||||
border: 1px solid #b3d2fb !important;
|
||||
color: #677ada;
|
||||
}
|
||||
.ant-input:focus {
|
||||
box-shadow: 0 0 0 2px #b3d2fb;
|
||||
}
|
||||
|
||||
.ant-input-suffix {
|
||||
height: 80%;
|
||||
right : 4px;
|
||||
right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
&-pwd {
|
||||
display : flex;
|
||||
flex-direction : row;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items : center;
|
||||
font-size : 14px;
|
||||
margin-bottom : 18px;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
&-verifyCode {
|
||||
@ -127,49 +146,58 @@
|
||||
}
|
||||
|
||||
&-btn {
|
||||
width : 100%;
|
||||
height : 42px;
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
font-size : 16px;
|
||||
margin-top : 18px;
|
||||
font-size: 16px;
|
||||
margin-top: 18px;
|
||||
background-color: #2a82e4;
|
||||
}
|
||||
|
||||
&-error {
|
||||
width : 100%;
|
||||
color : #f04134;
|
||||
font-size : 12px;
|
||||
padding-top : 6px;
|
||||
text-align : center;
|
||||
overflow : hidden;
|
||||
width: 100%;
|
||||
color: #f04134;
|
||||
font-size: 12px;
|
||||
padding-top: 6px;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space : nowrap;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
&__footer {
|
||||
position : absolute;
|
||||
bottom : 8px;
|
||||
display : flex;
|
||||
flex-direction : row;
|
||||
justify-content: center;
|
||||
align-items : center;
|
||||
position: absolute;
|
||||
bottom: 8px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
img {
|
||||
width : auto;
|
||||
height : 50px;
|
||||
width: auto;
|
||||
height: 50px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
&-copyright {
|
||||
height : 50px;
|
||||
line-height : 25px;
|
||||
padding-left: 12px;
|
||||
margin-right: 24px;
|
||||
border-left : 1px solid #1446aa;
|
||||
// height: 50px;
|
||||
width: 40%;
|
||||
line-height: 25px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
// padding-right: 50%;
|
||||
// padding-left: 12px;
|
||||
// margin-right: 24px;
|
||||
// border-left: 1px solid #1446aa;
|
||||
|
||||
p {
|
||||
margin-top: 30px;
|
||||
color : #fff;
|
||||
// margin-top: 30px;
|
||||
padding: 10px 20px;
|
||||
color: #fff;
|
||||
background-color: rgba(72, 133, 255, 0.2);
|
||||
border-radius: 10px;
|
||||
|
||||
&:first-child {
|
||||
font-size: 12px;
|
||||
@ -177,23 +205,23 @@
|
||||
|
||||
&:last-child {
|
||||
font-size: 14px;
|
||||
color : #fff;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-qrcode {
|
||||
img {
|
||||
width : 60px;
|
||||
height : auto;
|
||||
width: 60px;
|
||||
height: auto;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size : 12px;
|
||||
color : #FFFFFF;
|
||||
font-size: 12px;
|
||||
color: #ffffff;
|
||||
line-height: 1;
|
||||
margin : 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user