Commit 65c53cb5 authored by Grégor JOUET's avatar Grégor JOUET 🔧
Browse files

Add circular progress on gcode upload

parent 9d67273b
Loading
Loading
Loading
Loading
Loading
+10 −0
Original line number Diff line number Diff line
@@ -46,6 +46,7 @@
                      <v-layout row>
                        <v-btn disabled><v-progress-circular indeterminate></v-progress-circular><v-icon>mdi-help-network</v-icon>Recherche d'un Slicer en ligne</v-btn>
                        <v-file-input @change="gcode_changed" id="file" justify="left" prepend-icon="mdi-upload-network"  dense small placeholder="Upload GCODE"></v-file-input>
                        <v-progress-circular :value="gcode_upload_progress" :v-show="is_uploading_gcode">{{ gcode_upload_progress }}</v-progress-circular>
                      </v-layout>
                    </v-container>
                  <!-- <v-btn color="primary" @click="e1 = 3">remove this button</v-btn> -->
@@ -252,15 +253,22 @@ export default {
    stepper_color (s) {
      return this.stepper_step > s ? 'green' : 'blue'
    },
    
    gcode_changed () {
      this.is_uploading_gcode = true
      let req_id = parseInt(this.id)
      var formData = new FormData();
      formData.append("file", document.querySelector('#file').files[0]);
      axios.post(`/files/gcode/upload/${req_id}`, formData, {
          headers: {
            'Content-Type': 'multipart/form-data'
          },
          onUploadProgress: function(progressEvent) {
            var percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total)
            this.gcode_upload_progress = percentCompleted
          }
      }).then((resp) => {
        this.is_uploading_gcode = false
        this.$store.dispatch('reload_request', this.id).then(() => {
          this.reload()
          console.log(resp)
@@ -278,6 +286,8 @@ export default {
    return {
      queue: null,

      gcode_upload_progress: 0,
      is_uploading_gcode: false,
      position: -1,
      title: '',
      fullname: '',