Delete icon backend

app/Http/Controllers/IconController.php

@@ -11,7 +11,7 @@
 class IconController extends Controller
 {
    /**
-     * Handle uploaded qr code image
+     * Handle uploaded icon image
      *
      * @param  \Illuminate\Http\Request  $request
      * @return \Illuminate\Http\Response
@@ -25,8 +25,27 @@ public function upload(Request $request)
 
             return response()->json('storage/' . pathinfo($path)['basename'], 201);
         }
-        else {
+        else
+        {
             return response()->json('no file in $request', 204);
         }
     }
+
+
+   /**
+     * delete an icon
+     *
+     * @param  \Illuminate\Http\Request  $request
+     * @return \Illuminate\Http\Response
+     */
+    public function delete($icon)
+    {
+
+        if( Storage::exists('public/' . $icon) ) {
+
+            Storage::delete('public/' . $icon); 
+        }
+
+        return response()->json(null, 204);
+    }
 }

resources/js/views/Create.vue

@@ -65,7 +65,7 @@
                             </label>
                             <span class="tag is-black is-large" v-if="twofaccount.icon.length > 0">
                                 <img class="icon-preview" :src="twofaccount.icon" >
-                                <button class="delete is-small"></button>
+                                <button class="delete is-small" @click="deleteIcon"></button>
                             </span>
                         </div>
                     </div>
@@ -154,11 +154,12 @@
                  let files = this.$refs.iconInput.files
 
                  if (!files.length) {
-                     console.log('no files');
                      return false;
                  }
-                 else {
+
-                    console.log(files.length + ' file(s) found');
+                 // clean possible already uploaded icon
+                 if( this.twofaccount.icon ) {
+                    this.deleteIcon()
                  }
 
                 let imgdata = new FormData();
@@ -176,6 +177,22 @@
                         this.twofaccount.icon = response.data;
                     }
                 )
+            },
+
+            deleteIcon(event) {
+
+                let token = localStorage.getItem('jwt')
+
+                axios.defaults.headers.common['Content-Type'] = 'application/json'
+                axios.defaults.headers.common['Authorization'] = 'Bearer ' + token
+
+                axios.delete('/api/icon/delete/' + this.twofaccount.icon.replace('storage/', '')).then(response => {
+                        this.twofaccount.icon = ''
+                    }
+                )
+                
+
+
             }
         },
 

routes/api.php

@@ -23,4 +23,5 @@
     Route::get('twofaccounts/{twofaccount}/totp', 'TwoFAccountController@generateTOTP')->name('twofaccounts.generateTOTP');
     Route::post('qrcode/decode', 'QrCodeController@decode');
     Route::post('icon/upload', 'IconController@upload');
+    Route::delete('icon/delete/{icon}', 'IconController@delete');
 });