update & cleanup

Author: aaronksaunders

package-lock.json

@@ -8,7 +8,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@ionic/vue": "0.0.4",
+    "@ionic/vue": "0.0.9",
     "ionic": "5.0.2",
     "vue": "^2.5.22",
     "vue-router": "3.0.6",

package.json

@@ -5,11 +5,6 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
     <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
-    <!-- <link
-      href="https://unpkg.com/@ionic/core@4.4.2/css/ionic.bundle.css"
-      rel="stylesheet"
-    />
-    <script src="https://unpkg.com/@ionic/core@4.4.2/dist/ionic.js"></script> -->
 
     <title>Ionic View SideMenu</title>
   </head>

public/index.html

@@ -20,9 +20,9 @@ console.log(window.Ionic);
 
 const privateRoute = (to, from, next) => {
   let userStore = store.state.user;
-  let isAuthenticated = userStore !== null;
-
+  let isAuthenticated = userStore.user !== null;
   console.log("isAuthenticated:" + isAuthenticated);
+  
   if (!isAuthenticated) {
     next({ name: "login" });
   } else {

src/main.js

@@ -28,6 +28,12 @@
           <ion-label>Mushrooms</ion-label>
           <ion-checkbox slot="end" value="mushrooms"/>
         </ion-item>
+
+       <ion-item>
+        <ion-label>on-input-vue test</ion-label>
+        <ion-input-vue type="text" id="theOne" v-model="user.custom" required=true maxlength="2"> </ion-input-vue>
+       </ion-item>
+
       </ion-list>
       <ion-button @click="$router.push('/about/help')">Help</ion-button>
     </ion-content>
@@ -36,6 +42,17 @@
 
 <script>
 export default {
-  name: "about"
-};
+  name: "about",
+  data() {
+    return {
+      user: { custom: "" }
+    };
+  }
+}
 </script>
+<style scoped>
+ion-input#theOne :invalid {
+  background-color:  red !important;
+  }
+
+</style>

src/views/About.vue

@@ -15,9 +15,9 @@
     <ion-content padding>
 <form>
   <ion-label position="stacked">Email</ion-label>
-  <ion-input @ionChange="(_event)=> email = _event.detail.value" type="text"></ion-input>
+  <ion-input-vue type="text" v-model="email" ></ion-input-vue>
   <ion-label position="stacked">Password</ion-label>
-  <ion-input @ionChange="(_event)=> password = _event.detail.value" type="password"></ion-input>
+  <ion-input-vue type="password" v-model="password" ></ion-input-vue>  
   <ion-button @click="doLogin()">Login</ion-button>
 </form>
     </ion-content>
@@ -29,12 +29,14 @@ export default {
   name: "Login",
 methods: {
   async doLogin() {
-    await this.$store.dispatch("user/login", {
+    let result = await this.$store.dispatch("user/login", {
       email: this.email,
       password: this.password
     });
-    console.log(this.$store.state);
-    this.$router.push("/");
+    if (true) {
+      console.log(this.$store.state);
+      this.$router.push("/");
+    }
   }
 },
 data() {
@@ -46,7 +48,7 @@ data() {
   mounted() {
     console.log("mounted");
     const menuCtrl = document.querySelector("ion-menu-controller");
-    menuCtrl.enable(false);
+    // menuCtrl.enable(false);
   }
 };
 </script>