[WIP] Добавил инпуты, кнопку и чекбокс на LoginPage

src/pages/login/TheLogin.vue

@@ -11,14 +11,15 @@
         .flex.flex-col.gap-y-5
           .flex.flex-col.gap-y-6px
             .flex Логин
-            base-input(placeholder="Введите ваш логин")
-          .flex.flex-col.gap-y-6px
+            base-input.h-12(v-model:value="user.login" type="text" placeholder="Введите ваш логин")
+          .flex.flex-col.gap-y-6px.relative
             .flex Пароль
-            base-input(type="password" placeholder="Введите ваш пароль")
+            base-input.h-12(v-model:value="user.password" :type="changeType" placeholder="Введите ваш пароль")
+            img.absolute.z-10.right-4.bottom-14px.cursor-pointer(:src="changeIcon" alt="eyePassword" @click="changeView")
           .flex.items-center.gap-x-11px
-            input.w-4.h-4.checkbox.cursor-pointer(type="checkbox" @change="(e) => check(e)")
+            input.w-4.h-4.checkbox.cursor-pointer(@click="persist" type="checkbox")
             .flex Запомнить меня
-        base-button.font-semibold(:size="48") Войти в аккаунт
+        base-button.font-semibold(:disabled="disabledButton" :size="48") Войти в аккаунт
       .absolute.left-12.bottom-12 2022 © Астра 
     .right-col.flex.items-center.justify-center.relative
       img.logo-img.absolute.z-10(src="@/assets/images/bigLogo.svg" alt="bigLogo")
@@ -30,14 +31,44 @@
 <script>
 import BaseInput from "@/components/base/BaseInput";
 import BaseButton from "@/components/base/BaseButton";
+import viewPass from "@/assets/icons/eye.svg";
+import notViewPass from "@/assets/icons/openEye.svg";
 export default {
   name: "TheLogin",
   components: { BaseInput, BaseButton },
   data() {
     return {
       colorUnderText: "var(--font-grey-color)",
+      isView: false,
+      img: viewPass,
+      notimg: notViewPass,
+      user: { login: "", password: "" },
     };
   },
+  computed: {
+    changeIcon() {
+      return !this.isView ? this.img : this.notimg;
+    },
+    changeType() {
+      return !this.isView ? "password" : "text";
+    },
+    disabledButton() {
+      return this.user.login && this.user.password ? false : true;
+    },
+  },
+  methods: {
+    changeView() {
+      this.isView = !this.isView;
+    },
+    persist() {
+      localStorage.login = this.user.login;
+      localStorage.password = this.user.password;
+    },
+  },
+  mounted() {
+    if (localStorage.login) this.user.login = localStorage.login;
+    if (localStorage.password) this.user.password = localStorage.password;
+  },
 };
 </script>