Allow URL config fetch and File upload

mms-gianni · Oct 21, 2021 · 2090e06 · 2090e06
1 parent c7a58f3
commit 2090e06
Show file tree

Hide file tree

Showing 3 changed files with 83 additions and 21 deletions.
diff --git a/client/src/App.vue b/client/src/App.vue
@@ -65,7 +65,12 @@ export default {
             });
     },
     data: () => ({
-        status: {},
+      status: {
+        swarmversion: "",
+        kubeVersion: {
+          gitVersion: ""
+        }
+      }
     }),
 };
 </script>
diff --git a/client/src/components/config_form.vue b/client/src/components/config_form.vue
@@ -31,15 +31,47 @@
                 ></v-text-field>
               </v-col>
 
-              <v-col
-                cols="12"
-              >
-                <v-textarea
-                  filled
-                  name="input-7-4"
-                  v-model="locustfile"
-                  label="Locustfile.py*"
-                ></v-textarea>
+              <v-col cols="12">
+                <v-tabs v-model="tab">
+                  <v-tab
+                    v-for="item in items"
+                    :key="item"
+                  >
+                    {{ item }}
+                  </v-tab>
+                </v-tabs>
+                <v-tabs-items v-model="tab">
+                  <v-tab-item>
+                    <v-card flat>
+                      <v-textarea
+                        filled
+                        name="input-7-4"
+                        v-model="locustfile"
+                        label="Locustfile.py*"
+                        rows="20"
+                      ></v-textarea>
+                    </v-card>
+                  </v-tab-item>
+                  <v-tab-item>
+                    <v-card flat>
+                      <v-text-field
+                        label="URL"
+                        v-model="locustfile_url"
+                      ></v-text-field>
+                    </v-card>
+                  </v-tab-item>
+                  <v-tab-item>
+                    <v-card flat>
+                      <v-file-input
+                        truncate-length="15"
+                        accept=".py,.txt"
+                        show-size
+                        v-model="locustfile_file"
+                      ></v-file-input>
+                    </v-card>
+                  </v-tab-item>
+                </v-tabs-items>
+
               </v-col>
             </v-row>
           </v-container>
@@ -76,25 +108,50 @@ export default {
       dialog: false,
       name: '',
       locustfile: '',
+      locustfile_url: '',
+      locustfile_file: {},
+      tab: null,
+      items: [
+        'Editor', 'URL', 'File Upload'
+      ],
     }),
     methods: {
-      saveForm () {
-        console.log(this.name);
-        console.log(this.locustfile);
-        axios.post(`/api/locustfile/${this.name}`, {
-          name: this.name,
-          content: this.locustfile,
-        }).then(response => {
+      submitData(name, content) {
+        axios.post(`/api/locustfile/${name}`, {
+          name: name,
+          content: content
+        })
+        .then(response => {
           this.dialog = false;
           this.name = '';
           this.locustfile = '';
+          this.locustfile_url = '';
+          this.locustfile_file = {};
+          this.tab = null;
           console.log(response);
-
           this.$parent.getConfigList();
-        }).catch(error => {
+        })
+        .catch(error => {
           console.log(error);
         });
       },
+      saveForm () {
+        switch (this.tab) {
+          case 0:
+            this.submitData(this.name, this.locustfile);
+            break;
+          case 1:
+            axios.get(this.locustfile_url).then(response => {
+              this.submitData(this.name, response.data);
+            });
+            break;
+          case 2:
+            this.locustfile_file.text().then(content => {
+              this.submitData(this.name, content);
+            });
+            break;
+        }
+      },
     },
 }
 </script>
diff --git a/client/src/components/config_list.vue b/client/src/components/config_list.vue
@@ -89,7 +89,7 @@ export default {
         removeConfig(item) {
             axios.delete(`/api/locustfile/${item.name}`)
             .then(response => {
-                console.log(response);
+                console.log(response.statusText);
                 const index = this.locustfiles.indexOf(item);
                 this.locustfiles.splice(index, 1);
             }).catch(error => {
@@ -104,7 +104,7 @@ export default {
                 .then(response => {
                     let configslist = response.data.locustfiles.response.body.items;
                     configslist.forEach(element => {
-                        console.log(element.metadata.name);
+                        //console.log(element.metadata.name);
                         this.locustfiles.push({
                             name: element.metadata.name,
                             namespace: element.metadata.namespace,