add validate posts

pages/categories/index.vue

@@ -389,7 +389,7 @@ export default {
         v => (v && v.length <= 255) || 'Name must be less than 255 characters'
       ],
       requiredRules: [
-        v => !!v || 'This field is required',
+        v => !!v || 'This field is required'
       ],
       numberRules: [
         v => !!v || 'This field is required',

pages/login.vue

@@ -109,10 +109,15 @@ export default {
       this.password = ''
       this.checkbox = false
     },
-    async login() {
+    async login () {
       try {
-        const resp = await this.$axios.post('/login',
-          {
+        const resp = await fetch('http://127.0.0.1:8000/api/login', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            Accept: 'application/json'
+          },
+          body: JSON.stringify({
             email: this.email,
             password: this.password,
             status: this.status
@@ -132,13 +137,13 @@ export default {
           this.$router.push('home')
         }
       } catch (e) {
-        this.$toast.error("Username or Password not valid", {
-          duration: 2000,
-        });
-        this.$router.push("/login");
+        this.$toast.error('Username or Password not valid', {
+          duration: 2000
+        })
+        this.$router.push('/login')
+      }
     }
   }
-}
 }
 </script>
 <style scoped>

pages/posts/index.vue

@@ -68,9 +68,9 @@
               </v-col>
               <v-col cols="12">
                 <!-- <v-col v-for="(image, index) in sImages" :key="index" cols="12">
-                  <v-img :src="image"/> -->
+                  <v-img :src="image"/> </v-col> -->
                 <v-img
-                  v-if="typeof sImages === 'string'"
+                  v-if="typeof sImages == 'string'"
                   :src="sImages"
                 />
               </v-col>
@@ -95,6 +95,7 @@
       v-model="dialog"
       persistent
       max-width="600px"
+      lazy-validation
     >
       <v-card>
         <v-card-title>
@@ -111,6 +112,7 @@
                 <v-text-field
                   v-model="eTitle"
                   label="Title*"
+                  :rules="requiredRules"
                   required
                 />
               </v-col>
@@ -123,6 +125,7 @@
                   item-text="name"
                   item-value="id"
                   label="Category"
+                  :rules="requiredRules"
                 />
               </v-col>
               <v-col cols="12">
@@ -130,6 +133,7 @@
                   v-model="eContent"
                   label="Content"
                   required
+                  :rules="requiredRules"
                 />
               </v-col>
               <v-col
@@ -141,6 +145,7 @@
                   item-text="name"
                   item-value="id"
                   label="Status"
+                  :rules="requiredRules"
                 />
               </v-col>
               <v-col cols="12">
@@ -204,11 +209,13 @@
             <v-divider class="mx-4" inset vertical />
             <v-spacer />
             <v-toolbar-title>
+              <!-- modal-create -->
               <v-dialog
                 v-model="dialog1"
                 persistent
                 max-width="600px"
                 enctype="multipart/form-data"
+                lazy-validation
               >
                 <template #activator="{ on, attrs }">
                   <v-btn
@@ -235,6 +242,7 @@
                           <v-text-field
                             v-model="title"
                             label="Title*"
+                            :rules="requiredRules"
                             required
                           />
                         </v-col>
@@ -247,12 +255,14 @@
                             item-text="name"
                             item-value="id"
                             label="Category"
+                            :rules="requiredRules"
                           />
                         </v-col>
                         <v-col cols="12">
                           <v-textarea
                             v-model="content"
                             label="Content"
+                            :rules="requiredRules"
                             required
                           />
                         </v-col>
@@ -265,6 +275,7 @@
                             item-text="name"
                             item-value="id"
                             label="Status"
+                            :rules="requiredRules"
                           />
                         </v-col>
                         <v-col cols="12">
@@ -275,6 +286,7 @@
                             dense
                             accept="image/*"
                             prepend-icon="mdi-camera"
+                            :rules="requiredRules"
                             @change="fileSelected"
                           />
                         </v-col>
@@ -428,7 +440,18 @@ export default {
         status: '',
         created_at: '',
         updated_at: ''
-      }
+      },
+      requiredRules: [
+        v => !!v || 'This field is required'
+      ],
+      numberRules: [
+        v => !!v || 'This field is required',
+        v => v > 0 || 'value must be a positive integer'
+      ],
+      imageRules: [
+        v => !!v || 'Images is required',
+        v => (v && v.length > 0) || 'Images is required'
+      ]
     }
   },
   computed: {
@@ -618,6 +641,7 @@ export default {
       this.eCategoryId = item.category_id
       this.eContent = item.content
       this.eStatus = item.status
+      this.eImages = []
       this.editedIndex = this.posts.indexOf(item)
       console.log(this.editedIndex)
       this.dialog = true
@@ -628,9 +652,10 @@ export default {
       fd.append('title', this.eTitle)
       fd.append('category_id', this.eCategoryId)
       fd.append('content', this.eContent)
-      fd.append('images', this.eImages)
       fd.append('status', this.eStatus)
-
+      if (typeof this.eImages !== 'string' && this.eImages != null) {
+        fd.append('images', this.eImages)
+      }
       const currentPostIndex = this.editedIndex
       this.$axios
         .post(