From fc1f22df5322aa89ffcf60040b01eff0451df3a3 Mon Sep 17 00:00:00 2001
From: WX <1377869194@qq.com>
Date: 星期三, 07 六月 2023 17:56:05 +0800
Subject: [PATCH] 页面样式调整，功能调整
---
src/views/login.vue | 71 +++++++++++++++++------------------
1 files changed, 34 insertions(+), 37 deletions(-)
diff --git a/src/components/login.vue b/src/views/login.vue
similarity index 75%
rename from src/components/login.vue
rename to src/views/login.vue
index 66a38c8..228f626 100644
--- a/src/components/login.vue
+++ b/src/views/login.vue
@@ -1,7 +1,7 @@
<template>
<div class="loginBox">
<!-- 绮掑瓙鐗规晥 -->
- <vue-particles
+ <!-- <vue-particles
color="#dedede"
:particleOpacity="0.7"
:particlesNumber="80"
@@ -18,7 +18,7 @@
:clickEffect="true"
clickMode="push"
>
- </vue-particles>
+ </vue-particles> -->
<div class="loginEarth">
<iframe
id="ifream"
@@ -28,25 +28,21 @@
v-bind:src="reportUrl"
></iframe>
</div>
+ <div class="title_img">
+ <h3>鏈堢悆澶ф暟鎹湴鐞嗙┖闂村垎鏋愬睍绀哄钩鍙�</h3>
+ </div>
<div class="loginMenu">
<div class="login_title">
<span>鐢ㄦ埛鐧诲綍</span>
</div>
- <el-form
- ref="loginForm"
- class="loginForm"
- >
+ <el-form ref="loginForm" class="loginForm">
<el-form-item prop="uid">
<el-input
placeholder="杈撳叆鐧诲綍璐﹀彿"
class="nobr"
- size="meddle"
autocomplete="off"
+ :prefix-icon="User"
>
- <i
- slot="prefix"
- class="el-icon-user"
- ></i>
</el-input>
</el-form-item>
@@ -56,11 +52,8 @@
placeholder="璇疯緭鍏ョ櫥褰曞瘑鐮�"
class="nobr"
autocomplete="off"
+ :prefix-icon="Lock"
>
- <i
- slot="prefix"
- class="el-icon-lock"
- ></i>
</el-input>
</el-form-item>
@@ -74,32 +67,24 @@
</el-form-item>
</el-col>
- <el-col
- :span="6"
- align="right"
- >
+ <el-col :span="6" align="right"> </el-col>
+ </el-form-item>
- </el-col>
- </el-form-item>
- <el-form-item>
- <img alt="" /><span style="color: black">璇佷功瀹夎涓庢坊鍔犱俊浠荤珯鐐�</span>
- </el-form-item>
- <el-form-item>
- <img alt="" /><span style="color: black">浣跨敤甯姪鏂囨。</span>
- </el-form-item>
<el-form-item>
<el-button
type="primary"
- class="nobr loginbtn"
+ class="nobr loginbtn btnbox"
@click="setLogin()"
- >鐧诲綍</el-button>
+ >鐧诲綍</el-button
+ >
</el-form-item>
</el-form>
</div>
</div>
</template>
-<script setup lang='ts'>
+<script setup lang="ts">
import router from "@/router";
+import { User, Lock } from "@element-plus/icons-vue";
import {
ref,
onMounted,
@@ -113,7 +98,7 @@
reportUrl.value = "/mapscreen/index.html";
};
const setLogin = () => {
- router.push("/index");
+ router.push("/");
};
onMounted(() => {
@@ -136,16 +121,18 @@
}
.loginMenu {
position: absolute;
- right: 12%;
- top: 20%;
+ right: 16%;
+ top: 50%;
+ transform: translateY(-50%);
padding: 40px;
- background: rgba(255, 255, 255, 0.2);
+ background: rgba(7, 8, 14, 0.8);
+ border: 1px solid #d6e4ff;
border-radius: 8px;
.login_title {
font-size: 25px;
font-family: Microsoft YaHei;
font-weight: bold;
- color: #3b4d6e;
+ color: #689cff;
}
.loginForm {
@@ -170,8 +157,18 @@
.loginbtn {
width: 384px;
height: 50px;
- background: #3b4d6e;
- border-radius: 5px;
+ }
+ }
+ .title_img {
+ position: absolute;
+ left: 15%;
+ top: 8%;
+ width: 20%;
+ /* transform: translateX(-50%); */
+ h3 {
+ color: #fff;
+ font-size: 40px;
+ white-space: nowrap;
}
}
}
--
Gitblit v1.9.3