Merge branch 'master' of http://222.71.165.188:3000/yunxi/ningxiaWeb
LI-CCONG\李聪聪
8 months ago
commit
24c0d71d94
@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<div class="JNPF-common-reister">
|
||||
<el-dialog
|
||||
title="找回密码"
|
||||
width="60%"
|
||||
:show-close="false"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
:visible="dialogVisible">
|
||||
<div class="cont">
|
||||
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="160px" class="demo-ruleForm">
|
||||
<el-form-item label="账号" prop="people">
|
||||
<el-input v-model="ruleForm.iphone"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="短信验证码" prop="code">
|
||||
<el-input v-model="ruleForm.code"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="输入新密码" prop="name">
|
||||
<el-input v-model="ruleForm.name"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="dialogVisible = false">确认修改</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<div class="foot">Copyright © 上海长江云息数字科技有限公司 © 2012 - 2023 All Rights Reserved 专业的数字信息解决方案专家</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'login-resiter',
|
||||
mixins: [],
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: true,
|
||||
active: 1,
|
||||
ruleForm: {
|
||||
|
||||
},
|
||||
rules: {
|
||||
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
download(row) {
|
||||
this.downloadFormVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.downloadForm.init(row.tables, row.id, 0, row.hasPackage)
|
||||
})
|
||||
},
|
||||
pre(row) {
|
||||
this.active -= 1
|
||||
},
|
||||
next() {
|
||||
this.active += 1
|
||||
},
|
||||
complete() {
|
||||
this.$router.push({
|
||||
path: '/login',
|
||||
query: ''
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.JNPF-common-reister {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
background: linear-gradient(90deg, #9064FF 3%, #5996FD 97%);
|
||||
padding: 40px;
|
||||
|
||||
>>>.el-dialog {
|
||||
.el-dialog__body {
|
||||
height: 400px;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.cont {}
|
||||
|
||||
.foot {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
bottom: 40px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,421 @@
|
||||
.login-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.login-container .login-version {
|
||||
position: fixed;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 82px;
|
||||
height: 82px;
|
||||
background: url("../../assets/images/login_version.png") no-repeat center;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.login-container .login-version .login-version-text {
|
||||
width: 82px;
|
||||
height: 82px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.login-container .login-left {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
background: #4393FA;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.login-container .login-left .login-company-logo {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 93px;
|
||||
display: block;
|
||||
height: 76px;
|
||||
padding-top: 18px;
|
||||
padding-left: 40px;
|
||||
width: 806px;
|
||||
max-width: 100%;
|
||||
margin-bottom: 82px;
|
||||
background: linear-gradient(270deg, rgba(67, 147, 250, 0.5) 0%, rgba(133, 182, 252, 0.5) 100%);
|
||||
}
|
||||
|
||||
.login-container .login-left .login-company-logo .login-company-logo-img {
|
||||
height: 40px;
|
||||
position: fixed;
|
||||
left: 40px;
|
||||
top: 111px;
|
||||
}
|
||||
|
||||
.login-container .login-left .login-banner {
|
||||
display: block;
|
||||
width: 682px;
|
||||
height: 464px;
|
||||
}
|
||||
|
||||
.login-container .login-left .login-left-txt {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 80px;
|
||||
}
|
||||
|
||||
.login-container .login-left .title1 {
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
color: #F8F8F8;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.login-container .login-left .title2 {
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
color: #BCD7FA;
|
||||
margin: 12px 0 30px;
|
||||
}
|
||||
|
||||
.login-container .login-left .link {
|
||||
margin: 30px auto 0;
|
||||
display: block;
|
||||
color: #fff;
|
||||
width: 88px;
|
||||
height: 40px;
|
||||
border: 1px solid #FFFFFF;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
line-height: 38px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.login-container .login-content {
|
||||
width: 700px;
|
||||
height: 100%;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.login-container .login-content .copyright {
|
||||
color: #a0acb7;
|
||||
font-size: 12px;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-container .login-content .login-cap {
|
||||
font-size: 26px;
|
||||
line-height: 38px;
|
||||
margin-bottom: 26px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.login-container .login-content .sso-login-btn {
|
||||
width: 100%;
|
||||
font-size: 16px;
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
.login-container .login-form {
|
||||
height: 530px;
|
||||
width: 400px;
|
||||
padding: 50px 0;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.login-container .login-form .sms-input {
|
||||
width: 260px;
|
||||
}
|
||||
|
||||
.login-container .login-form .sms-right {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.login-container .login-form .sms-right.code-right {
|
||||
height: 40px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-container .login-form .sms-right #imgcode {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.login-container .login-form .sms-right .smsBtn {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-logo {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-tab {
|
||||
height: 58px;
|
||||
margin-bottom: 30px;
|
||||
position: relative;
|
||||
border-bottom: 1px solid #DCDFE6;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-tab::after {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 50%;
|
||||
height: 2px;
|
||||
content: '';
|
||||
display: block;
|
||||
bottom: -1px;
|
||||
background-color: #1890ff;
|
||||
z-index: 100;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-tab.active1::after {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-tab.active2::after {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-tab .item {
|
||||
position: relative;
|
||||
width: 50%;
|
||||
font-size: 20px;
|
||||
line-height: 58px;
|
||||
color: #666;
|
||||
display: inline-block;
|
||||
height: 58px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-tab .item.active {
|
||||
color: #1890ff;
|
||||
}
|
||||
|
||||
.login-container .login-form .rule-tip {
|
||||
color: #a0acb7;
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.login-container .login-form .rule-tip > > > .el-form-item__content {
|
||||
line-height: 12px;
|
||||
}
|
||||
|
||||
.login-container .login-form .el-divider__text {
|
||||
color: #a0acb7;
|
||||
}
|
||||
|
||||
.login-container .login-form .other-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.login-container .login-form .other-list .other-item {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.login-container .login-form .other-list .other-item i {
|
||||
font-size: 20px;
|
||||
color: #a0acb7;
|
||||
}
|
||||
|
||||
.login-container .login-form .other-list .other-item:hover {
|
||||
background-color: #1890ff;
|
||||
}
|
||||
|
||||
.login-container .login-form .other-list .other-item:hover i {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.login-container .login-form .el-form input:-webkit-autofill {
|
||||
box-shadow: 0 0 0px 1000px #fff inset !important;
|
||||
-webkit-text-fill-color: #606266 !important;
|
||||
}
|
||||
|
||||
.login-container .login-form .el-form input::-webkit-input-placeholder {
|
||||
color: #a0acb7;
|
||||
}
|
||||
|
||||
.login-container .login-form .el-form .login-btn {
|
||||
width: 100%;
|
||||
font-size: 16px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.login-container .login-form .el-form .foot {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
color: #188ae2;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.login-container .login-form .el-form .foot .register, .login-container .login-form .el-form .foot .forget {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-container .login-form .el-form .foot .line {
|
||||
background-color: #999A9F;
|
||||
width: 1px;
|
||||
height: 12px;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-form-QRCode {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-form-QRCode .qrcode-img {
|
||||
position: relative;
|
||||
margin-bottom: 18px;
|
||||
width: 220px;
|
||||
height: 220px;
|
||||
}
|
||||
|
||||
.login-container .login-form .login-form-QRCode .qrcode-tip {
|
||||
color: #334d65;
|
||||
line-height: 22px;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-container .login-foot {
|
||||
position: absolute;
|
||||
width: 1060px;
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
left: 31%;
|
||||
text-align: left;
|
||||
margin-left: 110px;
|
||||
}
|
||||
|
||||
.login-container .other-login-dialog > > > .el-dialog__header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.login-container .other-login-dialog > > > .el-dialog__body {
|
||||
width: 100%;
|
||||
height: 450px;
|
||||
overflow: hidden;
|
||||
background: url("../../assets/images/other-login-dialog.png") no-repeat center !important;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.login-container .divider__text {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.login-container .divider__text > > > .el-divider__text {
|
||||
padding: 0px 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.login-container .other-login-card {
|
||||
border-radius: 5px;
|
||||
border-left: 5px solid #9DC8FA;
|
||||
font-size: 12px;
|
||||
margin-bottom: 15px;
|
||||
background-color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-container .other-login-card:hover {
|
||||
border-color: #1890ff;
|
||||
}
|
||||
|
||||
.login-container .other-login-card:hover i {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.login-container .other-login-des {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-top: 15px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.login-container .other-body {
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.login-container .other-title {
|
||||
display: flex;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.login-container .other-title .other-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
border: 2px solid #1890ff;
|
||||
}
|
||||
|
||||
.login-container .other-title .other-icon i {
|
||||
font-size: 16px;
|
||||
color: #1890ff;
|
||||
}
|
||||
|
||||
.login-container .other-title .other-text {
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
font-size: 18px;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.login-container .other-body {
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.JNPF-dialog-sso > > > .el-dialog__body {
|
||||
padding: 0 !important;
|
||||
height: 600px !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
Loading…
Reference in new issue