token失效，进入登录页

.history/src/views/login_20210803095432.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        name: "admin",
-        password: 123456,
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208170849.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="6"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "密码长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        name: "admin",
-        password: admin123,
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208170904.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="6"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "密码长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        name: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208172238.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="6"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        name: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208172317.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        name: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208173528.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        name: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208173534.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208175329.vue

@@ -1,288 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      var user = {
-        username: "admin",
-        password: "admin123",
-      };
-      this.login_api(user);
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208175348.vue

@@ -1,288 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      var user = {
-        username: "admin",
-        password: "admin123",
-      };
-      this.login_api(user);
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api({ query }).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208175357.vue

@@ -1,288 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      var user = {
-        username: "admin",
-        password: "admin123",
-      };
-      this.login_api(user);
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208175430.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208180211.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      await this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208180226.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211208180749.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209113354.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({data:{
-        username: "admin",
-        password: "admin123",
-      }});
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209113425.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209114330.vue

@@ -1,284 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api("admin", "admin123" );
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209114342.vue

@@ -1,284 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api("admin", "admin123");
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209114417.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209135331.vue

@@ -1,288 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log('this.loginData');
-          console.log(this.loginData);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209135552.vue

@@ -1,291 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      loginData: "",
-
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          this.loginData = requset.data;
-          console.log('this.loginData');
-          console.log(this.loginData);
-
-          localStorage.setItem('assToken',requset.data)
-
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209135632.vue

@@ -1,287 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-   
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-     
-          localStorage.setItem('assToken',requset.data)
-
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209135918.vue

@@ -1,295 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-   
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-     
-          localStorage.setItem('assToken',requset.data)
-
-          setTimeout(function(){
-
-            console.log('获取token')
-            console.log(localStorage.getItem('assToken'))
-
-          },1000)
-         
-
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209142840.vue

@@ -1,284 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          localStorage.setItem("assToken", requset.data);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209143025.vue

@@ -1,284 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-export default {
-  data() {
-    return {
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          sessionStorage.setItem("assToken", requset.data);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209143445.vue

@@ -1,285 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-import { setToken } from '@/utils/auth'
-export default {
-  data() {
-    return {
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          sessionStorage.setItem("assToken", requset.data);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209143516.vue

@@ -1,285 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-import { setToken } from "@/utils/auth";
-export default {
-  data() {
-    return {
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          setToken(requset.data);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

.history/src/views/login_20211209143536.vue

@@ -1,285 +0,0 @@
-<template>
-  <div class="loginBox">
-    <div class="loginInnerBox">
-      <h2 class="bigTit">智慧用电监控平台</h2>
-      <p class="loginTitle">用户登录</p>
-
-      <el-form
-        :label-position="labelPosition"
-        :model="loginForm"
-        :rules="rules"
-        ref="loginForm"
-        class="demo-loginForm"
-      >
-        <el-form-item prop="username" class="oneSec">
-          <img class="icon" src="../assets/images/userIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.username"
-            max="6"
-            placeholder="请输入登录ID"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item prop="password" class="oneSec">
-          <img class="icon" src="../assets/images/passwordIcon.png" alt="" />
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            placeholder="请输入密码"
-            maxlength="9"
-            auto-complete="new-password"
-            clearable
-            autocomplete="off"
-          ></el-input>
-        </el-form-item>
-        <div class="remember">
-          <el-checkbox label="记住密码" v-model="isChecked"></el-checkbox>
-        </div>
-        <el-form-item>
-          <el-button @click="submitForm" class="submitBox">登录</el-button>
-          <!-- <el-button @click="resetForm">重置</el-button> -->
-        </el-form-item>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script>
-import * as api from "../api/login/user.js";
-import { ElMessage } from "element-plus";
-import { setToken } from "@/utils/auth";
-export default {
-  data() {
-    return {
-      labelPosition: "right",
-
-      loginForm: {
-        username: "",
-        password: "",
-      },
-
-      rules: {
-        username: [
-          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
-          { required: true, message: "请输入用户名", trigger: "blur" },
-          {
-            min: 3,
-            max: 6,
-            message: "用户名长度在 3 到 6 个字符",
-            trigger: "blur",
-          },
-        ],
-        password: [
-          { required: true, message: "请输密码", trigger: "blur" },
-          {
-            min: 3,
-            max: 9,
-            message: "密码长度在 3 到 9 个字符",
-            trigger: "blur",
-          },
-        ],
-      },
-
-      isChecked: true, // 记住密码
-    };
-  },
-  mounted() {
-    this.getCookie();
-    this.loginFree();
-  },
-
-  methods: {
-    loginFree() {
-      this.login_api({
-        username: "admin",
-        password: "admin123",
-      });
-      sessionStorage.setItem("userInfo", "admin");
-    },
-    //登录数据对接
-    login_api(query = {}) {
-      api.login_api(query).then((requset) => {
-        if (requset.status === "SUCCESS") {
-          setToken(requset.data);
-          this.$router.push({ path: "/home" });
-        } else {
-          ElMessage.error(requset.msg);
-        }
-      });
-    },
-
-    submitForm() {
-      // ref 用在组件中，就表示当前组件  通过 $refs.xxx可以拿到所有ref的集合
-      // this.$refs.loginForm  //当前的表单对象
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          //valid成功为ture，失败为false
-          //发送请求 ，调用登录接口
-
-          this.login_api({
-            name: this.loginForm.username,
-            password: this.loginForm.password,
-          });
-          sessionStorage.setItem("userInfo", this.loginForm.username);
-          // alert('submit!');
-        } else {
-          console.log("校验失败");
-          return false;
-        }
-      });
-
-      if (this.isChecked) {
-        // 记住密码
-        this.setCookie(this.loginForm.username, this.loginForm.password, 30); // 保存期限为30天
-      } else {
-        this.clearCookie(); // 清空 Cookie
-      }
-    },
-
-    // 设置Cookie
-    setCookie(username, password, exdays) {
-      // 用户名, 密码, 保存天数
-      let exdate = new Date(); // 获取时间
-      exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
-      // 字符串拼接cookie
-      window.document.cookie =
-        "userName=" + username + ";path=/;expires=" + exdate.toGMTString();
-      window.document.cookie =
-        "userPwd=" + password + ";path=/;expires=" + exdate.toGMTString();
-    },
-    // 读取Cookie
-    getCookie() {
-      // console.log(document.cookie);
-      if (document.cookie.length > 0) {
-        let arr = document.cookie.split("; "); // 这里显示的格式需要切割一下自己可输出看下
-        for (let i = 0; i < arr.length; i++) {
-          let arr2 = arr[i].split("="); // 再次切割
-          // 判断查找相对应的值
-          if (arr2[0] == "userName") {
-            this.loginForm.usernameText = arr2[1]; // 保存到保存数据的地方
-          } else if (arr2[0] == "userPwd") {
-            this.loginForm.passwordText = arr2[1];
-          }
-        }
-      }
-    },
-    // 清除Cookie
-    clearCookie() {
-      this.setCookie("", "", -1); // 修改2值都为空，天数为负1天就好了
-    },
-    // resetForm() {
-    //   //表单重置
-    //   this.$refs.loginForm.resetFields();
-    // },
-  },
-};
-</script>
-
-<style lang="scss">
-.bigTit {
-  position: absolute;
-  top: -90px;
-  left: 7px;
-  text-align: center;
-  width: 100%;
-  color: #00e1eb;
-  font-size: 0.625rem;
-
-  //   margin-left:-0.775rem;
-  font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
-  font-weight: bold;
-  letter-spacing: 17px;
-}
-.loginBox {
-  background-image: url(../assets/images/login-bg.png) !important;
-  background-repeat: no-repeat;
-  background-size: cover;
-  width: 100%;
-  height: 100vh;
-  min-width: 1024px;
-  min-height: 600px;
-  background-position: center center;
-  display: block;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: red;
-
-  .loginInnerBox {
-    position: relative;
-    width: 8.3875rem;
-    height: 5.8rem;
-    background-image: url(../assets/images/loginIn-bg.png) !important;
-    background-size: cover;
-    padding: 0.45rem 0.775rem;
-    // text-align: center;
-    .loginTitle {
-      font-size: 0.45rem;
-      color: #00e1eb;
-      text-align: center;
-      letter-spacing: 12px;
-    }
-    .oneSec {
-      text-align: left;
-      width: 6.85rem;
-      height: 0.7375rem;
-      line-height: 0.7375rem;
-      background: rgba(11, 161, 248, 0.4);
-      border: 1px solid #0ba1f8;
-      margin-top: 0.4875rem;
-      position: relative;
-      .icon {
-        position: absolute;
-        top: 0.2rem;
-        left: 0.2rem;
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      input {
-        background: transparent;
-        border: 0;
-        -webkit-appearance: none;
-        border-radius: 0;
-        // padding: 12px 5px 12px 0;
-        color: #fff;
-        height: 47px;
-        caret-color: #fff;
-        outline: none;
-        font-size: 0.325rem;
-        padding-left: 0.85rem;
-        line-height: 0.7375rem;
-        height: 0.7375rem;
-      }
-    }
-    .remember {
-      margin: 0.275rem 0;
-      .el-checkbox__inner {
-        width: 0.3rem;
-        height: 0.3rem;
-      }
-      .el-checkbox__label {
-        font-size: 0.325rem;
-        font-weight: 300;
-      }
-      .el-checkbox__inner::after {
-        top: 0.07rem;
-        width: 0.0625rem;
-        left: 0.1125rem;
-      }
-      .el-checkbox {
-        color: #fff;
-      }
-    }
-    .submitBox {
-      width: 6.85rem;
-      // height: 0.7375rem;
-      opacity: 1;
-      background: #00e1eb;
-      color: #001a2b;
-      font-size: 0.45rem;
-      text-align: center;
-      // line-height: 0.7375rem;
-      cursor: pointer;
-    }
-  }
-}
-</style>

public/static/config.js

@@ -3,9 +3,9 @@ var PLATFROM_CONFIG = {};
 // PLATFROM_CONFIG.baseUrl = "http://172.16.120.229:8010/" //杨强本地
 // PLATFROM_CONFIG.baseUrl = "http://172.16.1.196:8010/"  //超博本地
 
-PLATFROM_CONFIG.baseUrl = "http://172.16.120.104:8010/" //杨强本地
+// PLATFROM_CONFIG.baseUrl = "http://172.16.120.104:8010/" //杨强本地
 
-// PLATFROM_CONFIG.baseUrl = "https://qhome.usky.cn/fivapi/" //线上
+PLATFROM_CONFIG.baseUrl = "https://qhome.usky.cn/fivapi/" //线上
 PLATFROM_CONFIG.fileUrl = "https://qhome.usky.cn/file/" //xlsx文件访问路径
 
 // 本地json文件请求路径

src/main.js

@@ -21,7 +21,7 @@ import 'echarts/lib/component/tooltip';
 import 'echarts/lib/component/title';
 import 'echarts/lib/component/legend';
 // import { ElMessage } from "element-plus";
-import { removeToken, getToken } from './utils/auth';
+import { removeToken } from './utils/auth';
 
 const app = createApp(App);
 
@@ -40,15 +40,6 @@ router.beforeEach((to, from, next) => {
         document.title = to.meta.title
     }
 
-    const hasToken = getToken()
-    hasToken
-    alert(hasToken)
-    if (!hasToken) {
-        alert(1)
-            // next({ path: '/' })
-    }
-
-
     //如果目标路由为登陆时,恢复用户原始状态
     if (to.path === '/') {
         removeToken()

src/utils/request.js

@@ -1,8 +1,9 @@
 import axios from 'axios'
 import { ElMessage } from 'element-plus'
 // import store from '@/store'
-import { getToken } from '@/utils/auth'
+import { getToken, removeToken } from '@/utils/auth'
 import qs from 'qs'
+import router from '@/router'
 
 // create an axios instance
 
@@ -11,6 +12,27 @@ let baseURL = window.PLATFROM_CONFIG.baseUrl
     // alert(baseURL)
     // alert(process.env.VUE_APP_BASE_URL)
 
+
+/**
+ * @description 处理code异常
+ * @param {*} code
+ * @param {*} msg
+ */
+const handleCode = (code, msg) => {
+    msg
+    switch (code) {
+        case '401':
+            // ElMessage({
+            //     message: '登录失效',
+            //     type: 'error',
+            //     duration: 2 * 1000
+            // })
+            router.replace({ path: "/" });
+            removeToken()
+            return;
+    }
+}
+
 const service = axios.create({
         baseURL: baseURL,
         // baseURL: process.env.NODE_ENV !== "development" ? baseURL : process.env.VUE_APP_BASE_URL,
@@ -77,45 +99,22 @@ service.interceptors.response.use(
      */
     response => {
         const res = response.data
+        handleCode(res.code, res.msg)
 
-        // console.log(res)
 
 
         return res
 
-        // if the custom code is not 20000, it is judged as an error.
-        // if (res.code !== 200) {
-        //     Message({
-        //         message: res.message || 'Error',
-        //         type: 'error',
-        //         duration: 5 * 1000
-        //     })
-
-        //     // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
-        //     if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
-        //         // to re-login
-        //         MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
-        //             confirmButtonText: 'Re-Login',
-        //             cancelButtonText: 'Cancel',
-        //             type: 'warning'
-        //         }).then(() => {
-        //             store.dispatch('user/resetToken').then(() => {
-        //                 location.reload()
-        //             })
-        //         })
-        //     }
-        //     return Promise.reject(new Error(res.message || 'Error'))
-        // } else {
-        //     return res
-        // }
     },
     error => {
         // console.log('err' + error.response.data.msg) // for debug
-        ElMessage({
-            message: error.response.config.url === '/user/login?' ? error.response.data.msg : error.message,
-            type: 'error',
-            duration: 5 * 1000
-        })
+        handleCode(error.code, error.msg)
+        ElMessage
+        // ElMessage({
+        //     message: error.response.config.url === '/user/login?' ? error.response.data.msg : error.message,
+        //     type: 'error',
+        //     duration: 5 * 1000
+        // })
         return Promise.reject(error)
     }
 

src/views/home/components/triangleChart.vue

@@ -33,9 +33,9 @@ export default {
       var option;
 
       var arr = [
-        { name: "重载运行", reaVal: this.frtAnalogData.heavyLoad*100+'%' },
-        { name: "轻载运行", reaVal: this.frtAnalogData.easyLoad*100+'%' },
-        { name: "正常运行", reaVal: this.frtAnalogData.norMalLoad*100+'%' },
+        { name: "重载运行", reaVal: (this.frtAnalogData.heavyLoad*100).toFixed(2)+'%' },
+        { name: "轻载运行", reaVal: (this.frtAnalogData.easyLoad*100).toFixed(2)+'%' },
+        { name: "正常运行", reaVal: (this.frtAnalogData.norMalLoad*100).toFixed(2)+'%' },
       ];
 
       arr.sort((a, b) => a.reaVal - b.reaVal);

src/views/login.vue

@@ -85,6 +85,8 @@ export default {
   mounted() {
     this.getCookie();
     this.loginFree();
+   
+   
   },
 
   methods: {
@@ -101,6 +103,12 @@ export default {
         if (requset.status === "SUCCESS") {
           setToken(requset.data);
           this.$router.push({ path: "/home" });
+          
+           ElMessage({
+                message: '登录成功',
+                type: 'success',
+                duration: 5 * 1000
+            })
         } else {
           ElMessage.error(requset.msg);
         }