免登录处理

shuishen

2025-02-12 1ef6cfda35c7c5776fa5f6f1f839caf92455df95

免登录处理

 src/pages/sign.vue

New file
@@ -0,0 +1,131 @@
<template>
  <!-- <div class="box">
    <div class="login">
      <div class="logintitle">
        新干化工园区“一园一策一图”VR平台
      </div>
      <div class="getingo">
        <p class="title">用户登录</p>
        <el-input type="text" class="input username" v-model="loginForm.username" />
        <el-input type="password" class="input password" v-model="loginForm.password" />
        <el-button class="loginto" type="primary" @click="login">登录</el-button>
      </div>
    </div>
  </div> -->
</template>

<script setup>
import { useRouter, useRoute } from 'vue-router'
let router = useRouter()
import { ElLoading } from 'element-plus'
import { useLogin } from 'store/login'
const store = useLogin()

const loginForm = reactive({
  //租户ID
  tenantId: '000000',
  //部门ID
  deptId: '',
  //角色ID
  roleId: '',
  //用户名
  username: 'admin',
  //密码
  password: 'rcgyy@2024',
  //账号类型
  type: 'account',
  //验证码的值
  code: '',
  //验证码的索引
  key: '',
  //预加载白色背景
  image:
    'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7',
  flag: 1,
})

store.LoginByUsername(loginForm).then(res => {
  router.push({
    path: '/layout'
  })
}).catch(() => {
})
</script>

<style lang="scss" scoped>
.box {
  width: 100vw;
  height: 100vh;
  box-sizing: border-box;

  .login {
    width: 100%;
    height: 100%;
    background: url('../assets/images/login-bg.png');
    background-size: 100% 100%;
    position: relative;

    .logintitle {
      position: absolute;
      top: 18%;
      right: 25%;
      transform: translateX(50%);
      font-size: 40px;
      color: #00afe9;
    }

    .getingo {
      width: 500px;
      position: absolute;
      text-align: center;
      top: 45%;
      right: 25%;
      transform: translateY(-40%) translateX(50%);
      color: #ffffff;
      padding: 30px;
      background: url('../assets/images/login-content-bg.png'),
        url('../assets/images/left-top.png') no-repeat left top,
        url('../assets/images/left-bottom.png') no-repeat left bottom,
        url('../assets/images/right-top.png') no-repeat right top,
        url('../assets/images/right-bottom.png') no-repeat right bottom;
      background-repeat: no-repeat;
      background-size: 100% 100%, 25px, 25px, 25px, 25px;

      .title {
        font-size: 20px;
      }

      :deep().el-input__inner {
        padding: 0px;
      }

      .input {
        margin: 30px 0;
        width: 300px;
        padding: 10px 10px 10px 40px;
        background-color: rgba(0, 0, 0, 0);
        color: #ffffff;
        border-width: 0px;
        font-size: 18px;
      }

      .username {
        background: url('../assets/images/login-input.png') no-repeat,
          url('../assets/images/user-icon.png') no-repeat 10px center;
        background-size: 100% 100%, 20px;
      }

      .password {
        background: url('../assets/images/login-input.png') no-repeat,
          url('../assets/images/password-icon.png') no-repeat 10px center;
        background-size: 100% 100%, 20px;
      }

      .loginto {
        width: 300px;
        margin: 30px 0;
      }
    }
  }
}
</style>

 src/router/index.js

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2024-10-25 16:35:31
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2025-01-07 18:55:42
 * @LastEditTime: 2025-02-11 14:39:11
 * @FilePath: \bigScreen\src\router\index.js
 * @Description: 
 * 
@@ -35,10 +35,22 @@
      isAuth: false,
    },
  },

  {
    path: '/sign',
    name: '免登录',
    component: () => import('@/pages/sign.vue'),
    meta: {
      keepAlive: true,
      isTab: false,
      isAuth: false,
    },
  },

  {
    path: '/layout',
    name: 'layout',
    redirect: '/layout/map/main/survey',
    redirect: '/layout/map/main/default',
    component: layout,
    children: [
      {
@@ -51,6 +63,14 @@
            name: 'main',
            component: mainLayout,
            children: [
              {
                path: 'default',
                meta: {
                  title: '首页'
                },
                component: () => import('@/views/default/index.vue')
              },

              {
                path: 'survey',
                meta: {
@@ -79,13 +99,13 @@
                },
                component: () => import('@/views/pac/index.vue')
              },
              // {
              //   path: 'pd',
              //   meta: {
              //     title: '突发事件模拟'
              //   },
              //   component: () => import('@/views/pd/index.vue')
              // },
              {
                path: 'pd',
                meta: {
                  title: '突发事件模拟'
                },
                component: () => import('@/views/pd/index.vue')
              },
            ]
          },