Installupdate (#53)

Added auto service install and jar file upgrade from the ui

chameleon-client/src/views/Settings.vue

@@ -11,7 +11,7 @@
                     <component :is="selectedComponent" @update="$emit('save')"/>
                 </div>
             </v-col>
-            <v-col class="colsClass" v-show="selectedTab === 1 || selectedTab === 2">
+            <v-col class="colsClass" v-show="selectedTab === 1">
                 <div class="videoClass">
                     <img :src="streamAddress" alt="Camera Stream">
                 </div>
@@ -34,18 +34,13 @@
         data() {
             return {
                 selectedTab: 0,
+                tabList:[General, Cameras]
             }
         },
         computed: {
             selectedComponent: {
                 get() {
-                    switch (this.selectedTab) {
-                        case 0:
-                            return "General";
-                        case 1:
-                            return "Cameras";
-                    }
-                    return "";
+                    return this.tabList[this.selectedTab];
                 }
             },
             streamAddress: {

chameleon-client/src/views/SettingsViewes/General.vue

@@ -1,5 +1,9 @@
 <template>
     <div>
+        <div style="margin-top: 15px">
+            <span>General Settings:</span>
+            <v-divider color="white"></v-divider>
+        </div>
         <CVnumberinput v-model="settings.teamNumber" name="Team Number"/>
         <CVradio v-model="settings.connectionType" :list="['DHCP','Static']"/>
         <v-divider color="white"/>
@@ -9,6 +13,30 @@
         <v-divider color="white"/>
         <CVinput name="Hostname" v-model="settings.hostname"/>
         <v-btn style="margin-top:10px" small color="#4baf62" @click="sendGeneralSettings">Save General Settings</v-btn>
+        <div style="margin-top: 20px">
+            <span>Install or Update:</span>
+            <v-divider color="white"></v-divider>
+        </div>
+        <div v-if="!isLoading">
+            <v-row dense align="center">
+                <v-col :cols="3">
+                    <span>Choose a newer version: </span>
+                </v-col>
+                <v-col :cols="6">
+                    <v-file-input accept=".jar" dark v-model="file"></v-file-input>
+                </v-col>
+            </v-row>
+            <v-btn small @click="installOrUpdate">{{fileUploadText}}</v-btn>
+        </div>
+        <div v-else style="text-align: center; margin-top: 20px">
+            <v-progress-circular color="white" :indeterminate="true" size="32"
+                                 width="4"></v-progress-circular>
+            <br>
+            <span>Please wait this may take a while</span>
+        </div>
+        <v-snackbar v-model="snack" top :color="snackbar.color">
+            <span>{{snackbar.text}}</span>
+        </v-snackbar>
     </div>
 </template>
 
@@ -25,26 +53,64 @@
             CVinput
         },
         data() {
-            return {}
+            return {
+                file: undefined,
+                snackbar: {
+                    color: "success",
+                    text: ""
+                },
+                snack: false,
+                isLoading: false
+            }
         },
         methods: {
             sendGeneralSettings() {
                 const self = this;
                 this.axios.post("http://" + this.$address + "/api/settings/general", this.settings).then(
                     function (response) {
-                        if (response.status === 200){
+                        if (response.status === 200) {
                             self.$store.state.saveBar = true;
                         }
                     }
                 )
+            },
+            installOrUpdate() {
+                let formData = new FormData();
+                formData.append('file', this.file);
+                if (this.file !== undefined) {
+                    this.isLoading = true;
+                }
+                this.axios.post("http://" + this.$address + "/api/install", formData, {
+                    headers: {
+                        'Content-Type': 'multipart/form-data'
+                    }
+                }).then(() => {
+                    this.snackbar = {
+                        color: "success",
+                        text: "Installation successful"
+                    };
+                    this.isLoading = false;
+                    this.snack = true;
+                }).catch(error => {
+                    this.snackbar = {
+                        color: "error",
+                        text: error.response.data
+                    };
+                    this.isLoading = false;
+                    this.snack = true;
+                })
             }
         },
         computed: {
-            isDisabled() {
-                if (this.settings.connectionType === 0) {
-                    return true;
+            fileUploadText() {
+                if (this.file !== undefined) {
+                    return "Install and update"
+                } else {
+                    return "Install current version"
                 }
-                return false;
+            },
+            isDisabled() {
+                return this.settings.connectionType === 0;
             },
             settings: {
                 get() {