登录页面修改

zhanghua

2024-09-12 aeb2269b65863fcda25f13937a01a7ff3237ee50

登录页面修改

 .env.development

@@ -2,4 +2,4 @@
ENV = 'development'

# base api
VUE_APP_BASE_API = 'http://192.168.3.87:18081/dream'
VUE_APP_BASE_API = 'https://www.9village.cn/dream_test'

 .env.production

@@ -2,5 +2,5 @@
ENV = 'production'

# base api
VUE_APP_BASE_API = '/prod-api'
VUE_APP_BASE_API = '/dream_test'


 src/assets/login_backgroup.png

 src/utils/graphql.js

@@ -6,7 +6,7 @@

// export default apolloClient;
// 定义不同请求地址
const EFORMURI = "http://192.168.3.87:18081/dream/graphql";
const EFORMURI = "https://www.9village.cn/dream_test/graphql";
const IOTURI = "https://www.9village.cn/dream_test" + "/graphql";
// import ApolloClient from 'apollo-boost' //引入apollo-boost插件
import { ApolloClient } from "apollo-client";

 src/views/login/index.vue

@@ -1,67 +1,5 @@
<template>
  <div class="login-container">
    <!-- <el-form
      ref="loginForm"
      :model="loginForm"
      :rules="loginRules"
      class="login-form"
      auto-complete="on"
      label-position="left"
    >
      <div class="title-container">
        <h3 class="title">Login Form</h3>
      </div>

      <el-form-item prop="username">
        <span class="svg-container">
          <svg-icon icon-class="user" />
        </span>
        <el-input
          ref="username"
          v-model="loginForm.username"
          placeholder="Username"
          name="username"
          type="text"
          tabindex="1"
          auto-complete="on"
        />
      </el-form-item>

      <el-form-item prop="password">
        <span class="svg-container">
          <svg-icon icon-class="password" />
        </span>
        <el-input
          :key="passwordType"
          ref="password"
          v-model="loginForm.password"
          :type="passwordType"
          placeholder="Password"
          name="password"
          tabindex="2"
          auto-complete="on"
          @keyup.enter.native="handleLogin"
        />
        <span class="show-pwd" @click="showPwd">
          <svg-icon
            :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"
          />
        </span>
      </el-form-item>

      <el-button
        :loading="loading"
        type="primary"
        style="width: 100%; margin-bottom: 30px"
        @click.native.prevent="handleLogin"
        >Login</el-button
      >

      <div class="tips">
        <span style="margin-right: 20px">username: admin</span>
        <span> password: any</span>
      </div>
    </el-form> -->
    <div class="wxLogin">
      <el-card class="main_wx">
        <wxlogin
@@ -71,7 +9,6 @@
          :href="href"
          :state="state"
        ></wxlogin>
        <!-- <el-button @click="handleLogin">开发环境专用偷渡按钮</el-button> -->
      </el-card>
    </div>
  </div>
@@ -191,8 +128,14 @@

/* reset element-ui css */
.login-container {
  // background-image: url('https://s1.locimg.com/2024/09/12/891ab39f72938.png');
    background-image: url('../../assets/login_backgroup.png');
  // background-size: contain;
    background-size: auto 100%;
    background-position: center center;
    /* 背景图不平铺 */
    background-repeat: no-repeat;
    /* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 */
    background-attachment: fixed;
  display: flex;
  align-items: center;
  justify-content: center;