From db905ecd14f63dba9337b4f4715584ef2d7e8c7e Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: Fri, 07 Mar 2025 14:45:00 +0800
Subject: [PATCH] 修改
---
src/views/login.vue | 56 +++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 41 insertions(+), 15 deletions(-)
diff --git a/src/views/login.vue b/src/views/login.vue
index c9f0f31..01727f8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -1,7 +1,13 @@
<template>
<el-row class="login">
<el-col :sm="24" :md="12" class="login-name">
- 新疆维吾尔自治区特种作业<br/>安全生产知识和管理能力考核平台
+ <div class="bigName">
+ <span>新疆维吾尔自治区</span>
+ <br/>安全生产知识和管理能力考核平台
+ </div>
+ <div class="smallName">
+ 数据存档 / 远程监巡考 / 特种作业缴费 / 网络培训监管
+ </div>
</el-col>
<el-col :sm="24" :md="12" class="login-box">
<div class="login-card">
@@ -43,7 +49,11 @@
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
</div>
</el-form-item>
- <el-checkbox v-model="loginForm.rememberMe" style="margin:0 0 25px 0;color: #ccc">记住密码</el-checkbox>
+ <div style="display: flex;justify-content: space-between;align-items: center;margin-bottom: 25px">
+ <el-checkbox v-model="loginForm.rememberMe" style="color: #ccc">记住密码</el-checkbox>
+ <span style="color: yellow;cursor: pointer" @click="toPay">特种作业缴费助手</span>
+ </div>
+
<div style="display: flex;justify-content: space-between;align-items: center">
<div style="width: 100%">
<el-button
@@ -163,12 +173,16 @@
});
}
});
+ },
+ toPay(){
+ this.$router.push("/singlePage");
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss">
+
@font-face {
font-family: "AliMa";
src: url("../assets/styles/AlimamaShuHeiTi-Bold.ttf");
@@ -198,18 +212,29 @@
.login-name{
display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
opacity: 0;
-webkit-opacity: 0;
animation: floatDown ease 0.6s forwards;
- justify-content: center;
- align-items: center;
- font-family: 'AliMa';
- color: #fff;
- font-size: 3rem;
text-align: center;
- line-height: 1.6;
+ line-height: 1.5;
transform: translateY(-120px);
- text-shadow: -10px 10px 20px rgba(0,0,0,.4);
+ .bigName{
+ font-family: 'AliMa';
+ color: #fff;
+ font-size: clamp(2.25rem, 0.401rem + 2.17vw, 3rem);
+ text-shadow: -10px 10px 20px rgba(0,0,0,.4);
+ span{
+ font-size: clamp(3rem, 0.534rem + 2.89vw, 4rem);
+ }
+ }
+ .smallName{
+ margin-top: 20px;
+ font-size: clamp(1.125rem, 0.2rem + 1.08vw, 1.5rem);
+ color: #fff;
+ }
}
@keyframes floatUp {
@@ -224,20 +249,21 @@
display: flex;
justify-content: center;
align-items: center;
- opacity: 0;
- -webkit-opacity: 0;
- animation: floatUp ease 0.6s forwards;
+
.login-card{
width: 500px;
padding: 30px;
border-radius: 16px;
- background-color: rgba(40,40,40,.5);
- backdrop-filter: blur(8px);
- -webkit-backdrop-filter: blur(8px);
+ background-color: rgba(40,40,40,.4);
+ backdrop-filter: blur(6px);
+ -webkit-backdrop-filter: blur(6px);
border: 1px solid rgba(255,255,255,.6);
max-width: 100%;
box-sizing: border-box;
box-shadow: 0 10px 20px rgba(0,0,0,.05);
+ opacity: 0;
+ -webkit-opacity: 0;
+ animation: floatUp ease 0.6s forwards;
}
.login-form {
width: 100%;
--
Gitblit v1.9.2