webapp/admin/src/views/login.vue

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<template>
  <div>
    <div class="container loginIn" style="backgroundImage: url(http://localhost:8080/ershoushangpinjiaoyi/front/pages/login/1.jpg)">

      <div :class="2 == 1 ? 'left' : 2 == 2 ? 'left center' : 'left right'" style="backgroundColor: rgba(255, 255, 255, 0.2)">
        <el-form class="login-form" label-position="left" :label-width="2 == 3 ? '56px' : '0px'">
          <div class="title-container"><h3 class="title" style="color: rgba(0, 150, 136, 1)">校园二手物品交易平台登录</h3></div>
          <el-form-item :label="2 == 3 ? '用户名' : ''" :class="'style'+2">
            <span v-if="2 != 3" class="svg-container" style="color:rgba(0, 150, 136, 1);line-height:44px"><svg-icon icon-class="user" /></span>
            <el-input placeholder="请输入用户名" name="username" type="text" v-model="rulesForm.username" />
          </el-form-item>
          <el-form-item :label="2 == 3 ? '密码' : ''" :class="'style'+2">
            <span v-if="2 != 3" class="svg-container" style="color:rgba(0, 150, 136, 1);line-height:44px"><svg-icon icon-class="password" /></span>
            <el-input placeholder="请输入密码" name="password" type="password" v-model="rulesForm.password" />
          </el-form-item>
          <el-form-item v-if="0 == '1'" class="code" :label="2 == 3 ? '验证码' : ''" :class="'style'+2">
            <span v-if="2 != 3" class="svg-container" style="color:rgba(0, 150, 136, 1);line-height:44px"><svg-icon icon-class="code" /></span>
            <el-input placeholder="请输入验证码" name="code" type="text" v-model="rulesForm.code" />
            <div class="getCodeBt" @click="getRandCode(4)" style="height:44px;line-height:44px">
              <span v-for="(item, index) in codes" :key="index" :style="{color:item.color,transform:item.rotate,fontSize:item.size}">{{ item.num }}</span>
            </div>
          </el-form-item>
          <el-form-item label="角色" prop="loginInRole" class="role">
            <el-radio
              v-for="item in menus"
	      v-if="item.hasBackLogin=='是'"
              v-bind:key="item.roleName"
              v-model="rulesForm.role"
              :label="item.roleName"
            >{{item.roleName}}</el-radio>
          </el-form-item>
          <el-button type="primary" @click="login()" class="loginInBt" style="padding:0;font-size:16px;border-radius:4px;height:44px;line-height:44px;width:100%;backgroundColor:rgba(0, 150, 136, 1); borderColor:rgba(0, 150, 136, 1); color:rgba(255, 255, 255, 1)">{{'1' == '1' ? '登录' : 'login'}}</el-button>
          <el-form-item class="setting">
                                                                                                                                                                                                                                                                                                                                                                        <!-- <div style="color:rgba(0, 150, 136, 1)" class="reset">修改密码</div> -->
          </el-form-item>
        </el-form>
      </div>

    </div>
  </div>
</template>
<script>
import menu from "@/utils/menu";
export default {
  data() {
    return {
      rulesForm: {
        username: "",
        password: "",
        role: "",
        code: '',
      },
      menus: [],
      tableName: "",
      codes: [{
        num: 1,
        color: '#000',
        rotate: '10deg',
        size: '16px'
      },{