From 0bbc5abeab6a1cb504b36bcd620fcb55e496d989 Mon Sep 17 00:00:00 2001
From: Your Name <123456>
Date: 星期一, 21 三月 2022 10:32:50 +0800
Subject: [PATCH] '登录页'
---
src/views/login/index.vue | 202 ++++++++++++++++++++------------------------------
1 files changed, 80 insertions(+), 122 deletions(-)
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index f1194f9..d35ac25 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,41 +1,36 @@
<template>
- <div :class="logincontainer">
- <div v-title :data-title="titleName" class="main"/>
- <el-row>
- <el-col :xs="24" :sm="24" :lg="12">
- <div class="login-logo">
- <div>
- <i class="el-icon-logo" />
- </div>
- </div>
- <div class="login-font">
- <div v-if="isSafe">
- <span>
- {{ safeLoginTitle }}
- </span>
- </div>
- <div v-else>
- <span>
- 特殊作业综合监管平台
- </span>
- </div>
- </div>
- </el-col>
- <el-col :xs="24" :sm="24" :lg="12">
- <div class="left-container">
- <div v-if="action==='login'" class="login-component">
- <login-form
- @on-success-valid="handleLogin"
- />
- </div>
- </div>
- </el-col>
- </el-row>
- <el-col :xs="24" :sm="24" :lg="12">
- <div class="bottom-container">
- <span>Copyright©2017 中国科学院苏州纳米技术与纳米仿生研究所 苏ICP备10220403号-6</span>
+ <div class="login-container">
+ <div class="title-one">
+ <span>拜城县众泰煤焦化有限公司</span>
+ </div>
+ <div class="title-two">
+ <span>智能化安全管理技术平台</span>
+ </div>
+ <div class="login-main">
+ <div class="login-main-pic"></div>
+ <div class="login-main-form">
+ <login-form
+ @on-success-valid="handleLogin"
+ />
</div>
- </el-col>
+ </div>
+ <div class="bottom-container">
+ <span style="text-align: center">Copyright©2022 新疆阿克苏拜城众泰煤焦化有限公司 版权所有</span>
+ </div>
+<!-- <el-row>-->
+<!-- <el-col :xs="24" :sm="24" :lg="12">-->
+<!-- <div class="left-container">-->
+<!-- <div v-if="action==='login'" class="login-component">-->
+
+<!-- </div>-->
+<!-- </div>-->
+<!-- </el-col>-->
+<!-- </el-row>-->
+<!-- <el-col :xs="24" :sm="24" :lg="12">-->
+<!-- <div class="bottom-container">-->
+<!-- <span>Copyright©2017 中国科学院苏州纳米技术与纳米仿生研究所 苏ICP备10220403号-6</span>-->
+<!-- </div>-->
+<!-- </el-col>-->
</div>
</template>
@@ -138,7 +133,7 @@
_this.$store.commit('SET_USER_TYPE', data.type)
// 加载菜单
initRouter(_this)
- _this.$router.replace('/mapManage/mapManage/map/index')
+ _this.$router.replace('/')
} else {
_this.$message({
showClose: true,
@@ -172,100 +167,63 @@
.login-container {
min-height: 100%;
width: 100%;
- background: url("../../assets/bg_pic.png") center no-repeat;
+ background: url("../../assets/bg_login.png") center no-repeat;
//background-size: auto 100%;
- background-size: cover;
- background-position: center;
- position: relative;
- background-color: #fff;
// background-color: #2d3a4b;
overflow: hidden;
- .login-logo {
- position: relative;
- color: #fff;
- text-align: center;
- padding: 0 35px 0 35px;
- margin: 0 auto;
- margin-top: 25%;
- margin-left: -100px;
- }
- .login-font {
- position: relative;
- text-align: center;
- margin-left: -10%;
- margin-top: -20%;
- }
-
- .login-font span {
- display: inline-block;
- width: 500px;
- height: 72px;
- font-size: 45px;
- font-family: PingFangSC-Semibold;
+ background-size:cover;
+ .title-one{
+ width: 360px;
+ height: 42px;
+ font-size: 30px;
+ font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
- color: white;
- line-height: 60px;
- vertical-align: middle;
- margin-top:50px;
- //padding: 20px 0; /* 撑开高度 */
- }
- .login-logo span {
- display: inline-block;
- width: 500px;
- height: 72px;
- font-size: 45px;
- font-family: PingFangSC-Semibold;
- font-weight: 600;
- color: rgba(51, 51, 51, 1);
- line-height: 60px;
- vertical-align: middle;
- margin-top: 50px;
- //padding: 20px 0; /* 撑开高度 */
- }
- //使用图片来替换
- //before属性中的content文本是用来占位的,必须有
- //可以设置字体大小来确定大小
- //使用visibility: hidden;来隐藏文字
- .el-icon-logo {
- /*background: url("../../assets/logo.png") center no-repeat;*/
- background-size: cover;
- height: 10px;
- width: 128px;
- color: #fff;
- vertical-align: middle;
- }
- .el-icon-logo:before {
- content: "替";
- font-size: 25px;
- visibility: hidden;
- }
- .left-container {
+ color: #FFFFFF;
+ line-height: 42px;
+ text-shadow: 0px 8px 10px rgba(16, 57, 193, 0.3);
margin: 0 auto;
- margin-top: 8%;
- .login-component {
- background-color: white;
- position: relative;
- width: 600px;
- max-width: 100%;
- padding: 40px 35px 0 30px;
- margin: 0 auto;
- margin-top: 25%;
- overflow: hidden;
+ margin-top: 120px;
+ }
+ .title-two{
+ width: 473px;
+ height: 61px;
+ font-size: 43px;
+ font-family: PingFangSC-Semibold, PingFang SC;
+ font-weight: 600;
+ color: #FFFFFF;
+ line-height: 61px;
+ text-shadow: 0px 8px 10px rgba(16, 57, 193, 0.3);
+ margin: 0 auto;
+ margin-top: 5px;
+ }
+ .login-main{
+ display: flex;
+ background: linear-gradient(270deg, #FFFFFF 0%, #FFFFFF 100%);
+ box-shadow: 0px 20px 40px 0px rgba(34, 0, 255, 0.7);
+ width:1036px;
+ min-height: 474px;
+ margin:0 auto;
+ margin-top: 60px;
+ .login-main-pic{
+ display: inline-block;
+ height: 474px;
+ width: 572px;
+ background: url("../../assets/img_bg_login.png") center no-repeat;
}
- .register-component {
- position: relative;
- width: 600px;
- max-width: 100%;
- padding: 40px 35px 0 35px;
- margin: 0 auto;
- overflow: hidden;
- background-color: #fff;
+ .login-main-form{
+ display: inline-block;
+ height:100%;
+ width:464px;
}
}
.bottom-container{
- position: absolute;
- bottom: 0;
- left: 30%;
+ width:600px;
+ height: 42px;
+ font-family: PingFangSC-Semibold, PingFang SC;
+ line-height: 42px;
+ text-shadow: 0px 8px 10px rgba(16, 57, 193, 0.3);
+ margin: 0 auto;
+ margin-top: 150px;
}
}
--
Gitblit v1.9.2