From dc6e82b8df8264b633a6b4e525cef0430d284555 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Sat, 29 Mar 2025 11:43:13 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/router/page/index.js | 6
src/assets/images/login/big-title.png | 0
src/page/login/index.vue | 43 +------
src/assets/images/login/username.png | 0
src/assets/images/login/password.png | 0
src/assets/images/login/bg.png | 0
src/styles/login.scss | 158 +++++++++++++++++++++++---
src/assets/images/login/login-btn.png | 0
src/page/login/userlogin.vue | 115 +++++++++++--------
src/assets/images/login/left-logo.png | 0
src/assets/images/login/right-login-info.png | 0
11 files changed, 217 insertions(+), 105 deletions(-)
diff --git a/src/assets/images/login/bg.png b/src/assets/images/login/bg.png
new file mode 100644
index 0000000..097e99b
--- /dev/null
+++ b/src/assets/images/login/bg.png
Binary files differ
diff --git a/src/assets/images/login/big-title.png b/src/assets/images/login/big-title.png
new file mode 100644
index 0000000..14d4965
--- /dev/null
+++ b/src/assets/images/login/big-title.png
Binary files differ
diff --git a/src/assets/images/login/left-logo.png b/src/assets/images/login/left-logo.png
new file mode 100644
index 0000000..96efe84
--- /dev/null
+++ b/src/assets/images/login/left-logo.png
Binary files differ
diff --git a/src/assets/images/login/login-btn.png b/src/assets/images/login/login-btn.png
new file mode 100644
index 0000000..aa88096
--- /dev/null
+++ b/src/assets/images/login/login-btn.png
Binary files differ
diff --git a/src/assets/images/login/password.png b/src/assets/images/login/password.png
new file mode 100644
index 0000000..079cc9f
--- /dev/null
+++ b/src/assets/images/login/password.png
Binary files differ
diff --git a/src/assets/images/login/right-login-info.png b/src/assets/images/login/right-login-info.png
new file mode 100644
index 0000000..8910002
--- /dev/null
+++ b/src/assets/images/login/right-login-info.png
Binary files differ
diff --git a/src/assets/images/login/username.png b/src/assets/images/login/username.png
new file mode 100644
index 0000000..3547562
--- /dev/null
+++ b/src/assets/images/login/username.png
Binary files differ
diff --git a/src/page/login/index.vue b/src/page/login/index.vue
index dcd20a5..e3f5770 100644
--- a/src/page/login/index.vue
+++ b/src/page/login/index.vue
@@ -1,43 +1,14 @@
<template>
<div class="login-container" @keyup.enter="handleLogin">
- <div class="login-time">
+ <!-- <div class="login-time">
{{ time }}
+ </div> -->
+ <div class="login-header">
+ <div class="title">中图智飞低空智能感知网平台</div>
</div>
- <div class="login-weaper">
- <div class="login-left animate__animated animate__fadeInLeft">
- <img class="img" src="/img/logo.png" alt="" />
- <p class="title">{{ login.info }}</p>
- </div>
- <div class="login-border animate__animated animate__fadeInRight">
- <div class="login-main">
- <p class="login-title">
- {{ $t('login.title') }}{{ website.title }}
- <top-lang></top-lang>
- </p>
- <userLogin v-if="activeName === 'user'"></userLogin>
- <!-- <codeLogin v-else-if="activeName === 'code'"></codeLogin>
- <thirdLogin v-else-if="activeName === 'third'"></thirdLogin>
- <registerLogin v-else-if="activeName === 'register'"></registerLogin>
- <div class="login-menu">
- <el-link href="#" @click.stop="activeName = 'user'">{{
- $t('login.userLogin')
- }}</el-link>
- <el-link href="#" @click.stop="activeName = 'code'">{{
- $t('login.phoneLogin')
- }}</el-link>
- <el-link href="#" @click.stop="activeName = 'third'">{{
- $t('login.thirdLogin')
- }}</el-link>
- <el-link
- :href="
- website.oauth2.ssoBaseUrl + website.oauth2.ssoAuthUrl + website.oauth2.redirectUri
- "
- >{{ $t('login.ssoLogin') }}</el-link
- >
- </div> -->
- </div>
- </div>
- </div>
+ <div class="login-left-title-new">中国图强 智领飞跃</div>
+ <div class="login-left-new"></div>
+ <userLogin v-if="activeName === 'user'"></userLogin>
</div>
</template>
<script>
diff --git a/src/page/login/userlogin.vue b/src/page/login/userlogin.vue
index 87cf1f6..5cbbd12 100644
--- a/src/page/login/userlogin.vue
+++ b/src/page/login/userlogin.vue
@@ -1,4 +1,6 @@
<template>
+ <div class="login-right-new">
+ <div class="user-login">用户登录</div>
<el-form
class="login-form"
status-icon
@@ -7,30 +9,20 @@
:model="loginForm"
label-width="0"
>
- <!-- <el-form-item v-if="tenantMode" prop="tenantId">
- <el-input
- @keyup.enter="handleLogin"
- v-model="loginForm.tenantId"
- auto-complete="off"
- :placeholder="$t('login.tenantId')"
- >
- <template #prefix>
- <i class="icon-quanxian" />
- </template>
- </el-input>
- </el-form-item> -->
- <el-form-item prop="username">
+ <div class="username">
+ <div>
+ <el-form-item prop="username">
<el-input
@keyup.enter="handleLogin"
v-model="loginForm.username"
autocomplete="off"
:placeholder="$t('login.username')"
>
- <template #prefix>
- <i class="icon-yonghu" />
- </template>
</el-input>
</el-form-item>
+ </div>
+ </div>
+ <div class="password">
<el-form-item prop="password">
<el-input
@keyup.enter="handleLogin"
@@ -39,47 +31,27 @@
autocomplete="off"
:placeholder="$t('login.password')"
>
- <template #suffix>
+ <!-- <template #suffix>
<i class="el-icon-view el-input__icon" @click="showPassword" />
</template>
<template #prefix>
<i class="icon-mima" />
- </template>
+ </template> -->
</el-input>
</el-form-item>
- <!-- <el-form-item prop="code" class="login-code" v-if="captchaMode">
- <el-input
- @keyup.enter="handleLogin"
- v-model="loginForm.code"
- auto-complete="off"
- :placeholder="$t('login.code')"
- >
- <template #prefix>
- <i class="icon-yanzhengma"></i>
- </template>
- <template #append>
- <div class="login-code-box">
- <img :src="loginForm.image" class="login-code-img" @click="refreshCode" />
- </div>
- </template>
- </el-input>
- </el-form-item> -->
+ </div>
+ <div class="forgot-password">忘记密码</div>
+ <div class="">
<el-form-item>
- <el-button type="primary" @click.prevent="handleLogin" class="login-submit"
- >{{ $t('login.submit') }}
+ <el-button type="primary" @click.prevent="handleLogin" class="login-submit">
+ {{ $t('login.submit') }}
</el-button>
- <!-- <el-button
- v-if="this.registerMode"
- type="danger"
- @click.prevent="handleRegister"
- class="register-submit"
- >{{ $t('login.register') }}
- </el-button> -->
</el-form-item>
- <!-- <el-dialog title="请选择身份信息后登录" append-to-body v-model="userBox" width="400px">
- <avue-form :option="userOption" v-model="userForm" @submit="submitLogin" />
- </el-dialog> -->
+ </div>
</el-form>
+
+
+ </div>
</template>
<script>
@@ -296,4 +268,51 @@
};
</script>
-<style></style>
+<style lang="scss" scoped>
+.login-right-new {
+ .login-form {
+ :deep(.el-form-item) {
+ width: 300px;
+ margin: 15px 0px 0px 86px;
+ }
+
+ :deep(.el-input) {
+ width: 100%;
+ .el-input__wrapper {
+ background: rgba(17, 64, 136, 0.1);
+ box-shadow: 0 0 0 1px rgba(17, 64, 136, 0.2);
+ height: 42px;
+ }
+
+ .el-input__inner {
+ color: #fff;
+ &::placeholder {
+ color: rgba(255, 255, 255, 0.6);
+ }
+ }
+ }
+ :deep(.el-button) {
+ position: absolute;
+ width: 390px;
+ height: 48px;
+ top: 320px;
+ left: -26px;
+ background: linear-gradient( 270deg, rgba(103,209,251,0.8) 0%, rgba(0,82,248,0.58) 100%);
+ box-shadow: 0px 6px 10px 0px rgba(0,0,0,0.3);
+ border: none;
+ font-size: 16px;
+
+ &:hover {
+ background: linear-gradient(270deg, #0070FF 0%, rgba(0,112,255,0.5) 100%);
+ }
+ }
+ }
+
+ .username, .password {
+ margin-bottom: 20px;
+ }
+ .login-click {
+ margin-top: 30px;
+ }
+}
+</style>
diff --git a/src/router/page/index.js b/src/router/page/index.js
index b2706fc..a937446 100644
--- a/src/router/page/index.js
+++ b/src/router/page/index.js
@@ -5,7 +5,7 @@
path: '/login',
name: '登录页',
component: () =>
- Store.getters.isMacOs ? import('@/mac/login.vue') : import('@/page/login/index.vue'),
+ import('@/page/login/index.vue'),
meta: {
keepAlive: true,
isTab: false,
@@ -16,7 +16,7 @@
path: '/oauth/redirect/:source',
name: '第三方登录',
component: () =>
- Store.getters.isMacOs ? import('@/mac/login.vue') : import('@/page/login/index.vue'),
+ import('@/page/login/index.vue'),
meta: {
keepAlive: true,
isTab: false,
@@ -27,7 +27,7 @@
path: '/lock',
name: '锁屏页',
component: () =>
- Store.getters.isMacOs ? import('@/mac/lock.vue') : import('@/page/lock/index.vue'),
+ import('@/page/lock/index.vue'),
meta: {
keepAlive: true,
isTab: false,
diff --git a/src/styles/login.scss b/src/styles/login.scss
index 4421443..798d2d1 100644
--- a/src/styles/login.scss
+++ b/src/styles/login.scss
@@ -1,26 +1,148 @@
.login-container {
+ background: url('../assets/images/login/bg.png') no-repeat center / 100% 100%;
position: relative;
- display: flex;
- align-items: center;
width: 100%;
height: 100%;
- // background-color: #fff;
- background: linear-gradient(110deg, rgb(2, 40, 85) 0%, rgb(44, 119, 241) 50%, rgb(255,255,255) 50%, rgb(240,240,240) 100%);
- overflow: hidden;
- &::before{
- // content:' ';
+ // position: relative;
+ // display: flex;
+ // align-items: center;
+ // width: 100%;
+ // height: 100%;
+ // // background-color: #fff;
+ // background: linear-gradient(110deg, rgb(2, 40, 85) 0%, rgb(44, 119, 241) 50%, rgb(255,255,255) 50%, rgb(240,240,240) 100%);
+ // overflow: hidden;
+ // &::before{
+ // position: absolute;
+ // top: 0;
+ // left: 0;
+ // width: 100%;
+ // height: 100%;
+ // margin-left: -48%;
+ // background-image: url(/img/login-bg.svg);
+ // background-position: 100%;
+ // background-repeat: no-repeat;
+ // background-size: auto 100%;
+ // }
+}
+.login-header {
+ background: url('../assets/images/login/big-title.png') no-repeat center / 100% 100%;
+ width: 100%;
+ height: 102px;
+ position: relative;
+ .title {
position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- margin-left: -48%;
- background-image: url(/img/login-bg.svg);
- background-position: 100%;
- background-repeat: no-repeat;
- background-size: auto 100%;
+ left: 637px;
+ top: 22px;
+ width: 646px;
+ height: 58px;
+ font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
+ font-weight: 400;
+ font-size: 54px;
+ line-height: 58px;
+ // text-shadow: 0px 2px 6px #0C3D79;
+ text-align: center;
+ font-style: normal;
+ text-transform: none;
+ color: #fff;
+ // background: linear-gradient(90deg, #FFFFFF 0%, #B2D5FF 100%);
}
}
+.login-left-title-new {
+ position: absolute;
+ left: 147px;
+ top: 263px;
+ width: 926px;
+ height: 42px;
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: bold;
+ font-size: 28px;
+ line-height: 33px;
+ letter-spacing: 30px;
+ // text-shadow: 0px 4px 6px rgba(0,0,0,0.72);
+ color: #fff;
+ text-align: center;
+ font-style: normal;
+ text-transform: none;
+ // background: linear-gradient(90.00000000000004deg, #FFFFFF 0%, #E3FEFF 63%, #88BAFF 100%);
+}
+.login-left-new {
+ position: absolute;
+ top: 334px;
+ left: 147px;
+ width: 926px;
+ height: 540px;
+ background: url('../assets/images/login/left-logo.png') no-repeat center / 100% 100%;
+}
+
+.login-right-new {
+ position: absolute;
+ top: 305px;
+ right: 291px;
+ width: 488px;
+ height: 508px;
+ background: url('../assets/images/login/right-login-info.png') no-repeat center / 100% 100%;
+ .user-login {
+ position: absolute;
+ top: 72px;
+ left: 180px;
+ width: 118px;
+ height: 26px;
+ font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
+ font-weight: 400;
+ font-size: 32px;
+ // color: #D1E0F9;
+ color: #fff;
+ line-height: 26px;
+ text-align: center;
+ }
+ .username {
+ position: absolute;
+ top: 127px;
+ left: 46px;
+ width: 394px;
+ height: 72px;
+ background: url('../assets/images/login/username.png') no-repeat center / 100% 100%;
+ // :deep(.el-form-item) {
+ // width: 120px;
+ // }
+ }
+ .password {
+ position: absolute;
+ top: 208px;
+ left: 46px;
+ width: 394px;
+ height: 72px;
+ background: url('../assets/images/login/password.png') no-repeat center / 100% 100%;
+ }
+ .forgot-password {
+ position: absolute;
+ width: 64px;
+ height: 24px;
+ top: 289px;
+ right: 58px;
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: 500;
+ font-size: 16px;
+ color: #D1E0F9;
+ line-height: 19px;
+ }
+ .login-click {
+ position: absolute;
+ bottom: 106px;
+ left: 44px;
+ width: 391px;
+ height: 61px;
+ background: url('../assets/images/login/login-btn.png') no-repeat center / 100% 100%;
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: 500;
+ font-size: 24px;
+ line-height: 50px;
+ text-align: center;
+ color: #fff;
+ }
+}
+
+
.login-weaper {
margin: 0 auto;
width:100%;
@@ -112,9 +234,9 @@
letter-spacing: 2px;
font-weight: 300;
cursor: pointer;
- margin-top: 30px;
+ // margin-top: 30px;
transition: 0.25s;
- background-color: #2C77F1;
+ // background-color: #2C77F1;
}
.register-submit {
width: 100%;
--
Gitblit v1.9.3