How to use cookies to remember passwords for 7 days on the vue login page

      <el-form
       ref="form"
       :model="form"
       label-width="80px"
       label-position="top"
       @submit.native.prevent
      >
       <el-form-item label="Username/Account">
        <div class="userError">
         <el-input
          size="mini"
          v-model.trim="form.userName"
          clearable
         ></el-input>
        </div>
       </el-form-item>
       <el-form-item label="Password">
        <div class="pwdError">
         <el-input
          size="mini"
          v-model.trim="form.loginPwd"
          clearable
          show-password
         ></el-input>
        </div>
       </el-form-item>
       <el-checkbox label="Remember account" v-model="isRemember"></el-checkbox>
       <el-button native-type="submit" size="mini" @click="loginPage"
        >Login</el-button
       >
      </el-form>

export default {
 name: "login",
 data() {
  return {
   form: {
    userName: '',
    loginPwd: '',
   },
   isRemember: false,
  };
 },
 mounted() {
  // Step 1, when the page is loaded, first check if there is a username and password in the cookie. This can be used with this.getCookie();
 },
 methods: {
  /* Step 3, when the user logs in, first check whether the username and password are correct. If not, prompt a login error. If correct, check whether the user has checked the remember password. If not, clear the cookie in time and return to the initial state. If checked, save the username and password in the cookie and set a 7-day validity period for use (of course, it may also be the cookie time before the update)
  */
  async loginPage() {
   // Send a request to see if the username and password entered by the user are correct const res = await this.$api.loginByUserName(this.form)
   if(res.isSuccess == false){
    this.$message.error("Login error")
   }
   else{
    const self = this;
    // Step 4, if the checkbox is checked, call the set cookie method to save the current username, password and expiration time to the cookie if (self.isRemember === true) {
     // Pass in the account name, password, and number of days to save (expiration time) as three parameters // 1/24/60 The test can be tested for one minute, which will be more obvious self.setCookie(this.form.userName, this.form.loginPwd, 1/24/60);
     // self.setCookie(this.form.userName, this.form.loginPwd, 7); // This will expire in 7 days} 
    // If it is not checked, clear the cookie in time, because this cookie may be the last unexpired cookie, so it should be cleared in time else {
     self.clearCookie();
    }
    // Of course, regardless of whether the user has checked the cookie, the route will still be redirected this.$router.push({
     name: "project",
    });
   }
  },
  // Set cookies
  setCookie(username, password, exdays) {
   var exdate = new Date(); // Get the current login timeexdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays); // Add seven days to the current login time to get the cookie expiration time, which is the number of days to save. // String concatenation cookies, because cookies are stored in the form of name=valuewindow.document.cookie = "userName" + "=" + username + ";path=/;expires=" + exdate.toGMTString();
   window.document.cookie = "userPwd" + "=" + password + ";path=/;expires=" + exdate.toGMTString();
   window.document.cookie = "isRemember" + "=" + this.isRemember + ";path=/;expires=" + exdate.toGMTString();
  },
  // Step 2, if there is a username and password in the cookie, it will be cut twice and saved in the form for use. If not, there will be no getCookie: function () {
   if (document.cookie.length > 0) {
    var arr = document.cookie.split("; "); //Because it is an array, it needs to be cut. Print it and you will know // console.log(arr,"cut");
    for (var i = 0; i < arr.length; i++) {
     var arr2 = arr[i].split("="); // Split again // console.log(arr2,"Split 2");
     // // Check the corresponding value if (arr2[0] === "userName") {
      this.form.userName = arr2[1]; // Save a copy of the username and password} else if (arr2[0] === "userPwd") {
      this.form.loginPwd = arr2[1]; // decryptable} else if (arr2[0] === "isRemember") {
      this.isRemember = Boolean(arr2[1]);
     }
    }
   }
  },
  // Clear cookies
  clearCookie: fu![image](/img/bVcOHhz)
   this.setCookie("", "", -1); // Clear and set the number of days to negative 1 day},
 },
};