Edit pic add job

resources/js/views/Addjob.vue

 <template>
     <div>
-        
         <v-layout row wrap class="border-div pa-0 my-3">
             <v-flex xs12 sm12 class="pa-3">
                 <h2 class="font-weight-bold red--text">ข้อมูลบริษัท</h2>
             </v-flex>
+            <form enctype="multipart/form-data" >
             <v-flex sm12>
                 <v-layout row wrap class="borderbottom pa-3">                           
                     <v-flex sm3 xs12>
                         <v-layout align-center justify-center fill-height>
-                            <img src="https://asianinteriorservices.com/wp-content/uploads/2018/04/noImg.png" alt="" width="180">
+                            <input type="file" accept="image/*" class="input-file" ref="inputFile" @change="selectFile">
+                            <v-tooltip right>
+                                <template v-slot:activator="{ on }">
+                                    <img v-on="on" class="img" @click="$refs.inputFile.click()" :src="srcImage" alt="" width="180">
+                                </template>
+                                <span>{{ status }}</span>
+                            </v-tooltip>
                         </v-layout>
                     </v-flex>
                     <v-flex sm9 xs12>
@@ -178,12 +184,50 @@
                         <v-btn color="red accent-4" dark>บันทึกข้อมูล</v-btn>
                     </v-layout>
                 </v-layout>
-                
             </v-flex>
+            </form>
         </v-layout>
     </div>
 </template>
 
+<script>
+export default {
+    data () {
+        return {
+            status: 'ยังไม่ได้เลือกไฟล์',
+            srcImage: 'https://asianinteriorservices.com/wp-content/uploads/2018/04/noImg.png'
+        }
+    },
+    methods: {
+        selectFile (e) {
+            const file = e.target.files
+            if (!file.length) {
+                return
+            }
+            this.status = file[0].name
+            this.showImage(file[0])
+            this.getBlob(file[0], file[0].type)
+        },
+        showImage (file) {
+            const reader = new FileReader()
+            reader.onload = e => {
+                this.srcImage = e.target.result
+            }
+            reader.readAsDataURL(file)
+        },
+        getBlob (file, type) {
+            const reader = new FileReader()
+            reader.onloadend = e => {
+                let imgBlob = new Blob([e.target.result], { type: type })
+                console.log(imgBlob)
+            }
+            reader.readAsArrayBuffer(file)
+        }
+    }
+}
+</script>
+
+
 <style lang="scss" scoped>
     .detail {
         color: #276f86;
@@ -293,5 +337,14 @@
     display: block;
     width: 100%;
     }
+
+    .img {
+        cursor: pointer;
+        border: 1px solid;
+    }
+
+    .input-file {
+        display: none;
+    }
 </style>