马宇豪
2025-03-07 db905ecd14f63dba9337b4f4715584ef2d7e8c7e
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 {