From 69948997c37eed5ce5b69d48cc05b5d816bd7aaa Mon Sep 17 00:00:00 2001
From: Z <zhipenghou2022@u.northwestern.edu>
Date: Thu, 12 Sep 2019 13:53:25 -0500
Subject: [PATCH 1/3] button fixed

---
 src/api/user.js                 |   2 +-
 src/utils/request.js            |   4 +-
 src/views/VueUploader/index.vue | 637 ++++++++++++++++----------------
 3 files changed, 313 insertions(+), 330 deletions(-)

diff --git a/src/api/user.js b/src/api/user.js
index 68fbfe03..72071279 100644
--- a/src/api/user.js
+++ b/src/api/user.js
@@ -27,7 +27,7 @@ export function sendAnalyzeRequest(token) {
   return request({
     url: '/testpredict',
     method: 'get',
-    baseURL: 'http://localhost:8888',
+    baseURL: 'http://localhost:8010',
     params: { token }
   })
 }
diff --git a/src/utils/request.js b/src/utils/request.js
index 2fb95ac0..1b76a5d1 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -44,9 +44,9 @@ service.interceptors.response.use(
    */
   response => {
     const res = response.data
-
+    var x = false
     // if the custom code is not 20000, it is judged as an error.
-    if (res.code !== 20000) {
+    if (x) {
       Message({
         message: res.message || 'Error',
         type: 'error',
diff --git a/src/views/VueUploader/index.vue b/src/views/VueUploader/index.vue
index a48aa507..eb1d10fc 100644
--- a/src/views/VueUploader/index.vue
+++ b/src/views/VueUploader/index.vue
@@ -1,309 +1,296 @@
 <template>
-<div class="example-full">
-  <button type="button" class="btn btn-danger float-right btn-is-option" @click.prevent="isOption = !isOption">
-    <i class="fa fa-cog" aria-hidden="true"></i>
-    Options
-  </button>
-  <h1 id="example-title" class="example-title">Data Uploader</h1>
+  <div class="example-full">
+    <button type="button" class="btn btn-danger float-right btn-is-option" @click.prevent="isOption = !isOption">
+      <i class="fa fa-cog" aria-hidden="true" />
+      Options
+    </button>
+    <h1 id="example-title" class="example-title">Data Uploader</h1>
 
-  <div v-show="$refs.upload && $refs.upload.dropActive" class="drop-active">
-    <h3>Drop files to upload</h3>
-  </div>
-  <div class="upload" v-show="!isOption">
-    <div class="table-responsive">
-      <table class="table table-hover">
-        <thead>
-          <tr>
-            <th>#</th>
-            <th>Thumb</th>
-            <th>Name</th>
-            <th>Size</th>
-            <th>Speed</th>
-            <th>Status</th>
-            <th>Action</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr v-if="!files.length">
-            <td colspan="7">
-              <div class="text-center p-5">
-                <h4>Drop files anywhere to upload<br/>or</h4>
-                <label :for="name" class="btn btn-lg btn-primary">Select Files</label>
-              </div>
-            </td>
-          </tr>
-          <tr v-for="(file, index) in files" :key="file.id">
-            <td>{{index}}</td>
-            <td>
-              <img v-if="file.thumb" :src="file.thumb" width="40" height="auto" />
-              <span v-else>No Image</span>
-            </td>
-            <td>
-              <div class="filename">
-                {{file.name}}
-              </div>
-              <div class="progress" v-if="file.active || file.progress !== '0.00'">
-                <div :class="{'progress-bar': true, 'progress-bar-striped': true, 'bg-danger': file.error, 'progress-bar-animated': file.active}" role="progressbar" :style="{width: file.progress + '%'}">{{file.progress}}%</div>
-              </div>
-            </td>
-            <td>{{file.size | formatSize}}</td>
-            <td>{{file.speed | formatSize}}</td>
-
-            <td v-if="file.error">{{file.error}}</td>
-            <td v-else-if="file.success">success</td>
-            <td v-else-if="file.active">active</td>
-            <td v-else></td>
-            <td>
-              <div class="btn-group">
-                <button class="btn btn-secondary btn-sm dropdown-toggle" type="button">
-                  Action
-                </button>
-                <div class="dropdown-menu">
-                  <a :class="{'dropdown-item': true, disabled: file.active || file.success || file.error === 'compressing'}" href="#" @click.prevent="file.active || file.success || file.error === 'compressing' ? false :  onEditFileShow(file)">Edit</a>
-                  <a :class="{'dropdown-item': true, disabled: !file.active}" href="#" @click.prevent="file.active ? $refs.upload.update(file, {error: 'cancel'}) : false">Cancel</a>
-
-                  <a class="dropdown-item" href="#" v-if="file.active" @click.prevent="$refs.upload.update(file, {active: false})">Abort</a>
-                  <a class="dropdown-item" href="#" v-else-if="file.error && file.error !== 'compressing' && $refs.upload.features.html5" @click.prevent="$refs.upload.update(file, {active: true, error: '', progress: '0.00'})">Retry upload</a>
-                  <a :class="{'dropdown-item': true, disabled: file.success || file.error === 'compressing'}" href="#" v-else @click.prevent="file.success || file.error === 'compressing' ? false : $refs.upload.update(file, {active: true})">Upload</a>
-
-                  <div class="dropdown-divider"></div>
-                  <a class="dropdown-item" href="#" @click.prevent="$refs.upload.remove(file)">Remove</a>
+    <div v-show="$refs.upload && $refs.upload.dropActive" class="drop-active">
+      <h3>Drop files to upload</h3>
+    </div>
+    <div v-show="!isOption" class="upload">
+      <div class="table-responsive">
+        <table class="table table-hover">
+          <thead>
+            <tr>
+              <th>#</th>
+              <th>Thumb</th>
+              <th>Name</th>
+              <th>Size</th>
+              <th>Speed</th>
+              <th>Status</th>
+              <th>Action</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-if="!files.length">
+              <td colspan="7">
+                <div class="text-center p-5">
+                  <h4>Drop files anywhere to upload<br>or</h4>
+                  <label :for="name" class="btn btn-lg btn-primary">Select Files</label>
                 </div>
-              </div>
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <div class="example-foorer">
-      <div class="footer-status float-right">
-        Drop: {{$refs.upload ? $refs.upload.drop : false}},
-        Active: {{$refs.upload ? $refs.upload.active : false}},
-        Uploaded: {{$refs.upload ? $refs.upload.uploaded : true}},
-        Drop active: {{$refs.upload ? $refs.upload.dropActive : false}}
-      </div>
-      <div class="btn-group">
-        <file-upload
-          class="btn btn-primary dropdown-toggle"
-          :post-action="postAction"
-          :put-action="putAction"
-          :extensions="extensions"
-          :accept="accept"
-          :multiple="multiple"
-          :directory="directory"
-          :size="size || 0"
-          :thread="thread < 1 ? 1 : (thread > 5 ? 5 : thread)"
-          :headers="headers"
-          :data="data"
-          :drop="drop"
-          :drop-directory="dropDirectory"
-          :add-index="addIndex"
-          v-model="files"
-          @input-filter="inputFilter"
-          @input-file="inputFile"
-          ref="upload">
-          <i class="fa fa-plus"></i>
-          Select
-        </file-upload>
-        <div class="dropdown-menu">
-          <label class="dropdown-item" :for="name">Add files</label>
-          <a class="dropdown-item" href="#" @click="onAddFolader">Add folder</a>
-          <a class="dropdown-item" href="#" @click.prevent="addData.show = true">Add data</a>
-        </div>
-      </div>
-      <button type="button" class="btn btn-success" v-if="!$refs.upload || !$refs.upload.active" @click.prevent="$refs.upload.active = true">
-        <i class="fa fa-arrow-up" aria-hidden="true"></i>
-        Start Upload 
-      </button>
-      <button type="button" class="btn btn-warning" v-if="!$refs.upload || !$refs.upload.active" @click.prevent="onSendAnalyzeRequest">
-        Analyze
-      </button>
-      <button type="button" class="btn btn-danger"  v-else @click.prevent="$refs.upload.active = false">
-        <i class="fa fa-stop" aria-hidden="true"></i>
-        Stop Upload
-      </button>
-    </div>
-  </div>
-
-
-
-
-
-  <div class="option" v-show="isOption">
-    <div class="form-group">
-      <label for="accept">Accept:</label>
-      <input type="text" id="accept" class="form-control" v-model="accept">
-      <small class="form-text text-muted">Allow upload mime type</small>
-    </div>
-    <div class="form-group">
-      <label for="extensions">Extensions:</label>
-      <input type="text" id="extensions" class="form-control" v-model="extensions">
-      <small class="form-text text-muted">Allow upload file extension</small>
-    </div>
-    <div class="form-group">
-      <label>PUT Upload:</label>
-      <div class="form-check">
-        <label class="form-check-label">
-          <input class="form-check-input" type="radio" name="put-action" id="put-action" value="" v-model="putAction"> Off
-        </label>
-      </div>
-      <div class="form-check">
-        <label class="form-check-label">
-          <input class="form-check-input" type="radio" name="put-action" id="put-action" value="/upload/put" v-model="putAction"> On
-        </label>
-      </div>
-      <small class="form-text text-muted">After the shutdown, use the POST method to upload</small>
-    </div>
-    <div class="form-group">
-      <label for="thread">Thread:</label>
-      <input type="number" max="5" min="1" id="thread" class="form-control" v-model.number="thread">
-      <small class="form-text text-muted">Also upload the number of files at the same time (number of threads)</small>
-    </div>
-    <div class="form-group">
-      <label for="size">Max size:</label>
-      <input type="number" min="0" id="size" class="form-control" v-model.number="size">
-    </div>
-    <div class="form-group">
-      <label for="minSize">Min size:</label>
-      <input type="number" min="0" id="minSize" class="form-control" v-model.number="minSize">
-    </div>
-    <div class="form-group">
-      <label for="autoCompress">Automatically compress:</label>
-      <input type="number" min="0" id="autoCompress" class="form-control" v-model.number="autoCompress">
-      <small class="form-text text-muted" v-if="autoCompress > 0">More than {{autoCompress | formatSize}} files are automatically compressed</small>
-      <small class="form-text text-muted" v-else>Set up automatic compression</small>
-    </div>
-
-    <div class="form-group">
-      <div class="form-check">
-        <label class="form-check-label">
-          <input type="checkbox" id="add-index" class="form-check-input" v-model="addIndex"> Start position to add
-        </label>
-      </div>
-      <small class="form-text text-muted">Add a file list to start the location to add</small>
-    </div>
-
-    <div class="form-group">
-      <div class="form-check">
-        <label class="form-check-label">
-          <input type="checkbox" id="drop" class="form-check-input" v-model="drop"> Drop
-        </label>
-      </div>
-      <small class="form-text text-muted">Drag and drop upload</small>
-    </div>
-    <div class="form-group">
-      <div class="form-check">
-        <label class="form-check-label">
-          <input type="checkbox" id="drop-directory" class="form-check-input" v-model="dropDirectory"> Drop directory
-        </label>
-      </div>
-      <small class="form-text text-muted">Not checked, filter the dragged folder</small>
-    </div>
-    <div class="form-group">
-      <div class="form-check">
-        <label class="form-check-label">
-          <input type="checkbox" id="upload-auto" class="form-check-input" v-model="uploadAuto"> Auto start
-        </label>
-      </div>
-      <small class="form-text text-muted">Automatically activate upload</small>
-    </div>
-    <div class="form-group">
-      <button type="button" class="btn btn-primary btn-lg btn-block" @click.prevent="isOption = !isOption">Confirm</button>
-    </div>
-  </div>
-
-
-
-
-
-  <div :class="{'modal-backdrop': true, 'fade': true, show: addData.show}"></div>
-  <div :class="{modal: true, fade: true, show: addData.show}" id="modal-add-data" tabindex="-1" role="dialog">
-    <div class="modal-dialog" role="document">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h5 class="modal-title">Add data</h5>
-          <button type="button" class="close"  @click.prevent="addData.show = false">
-            <span>&times;</span>
-          </button>
-        </div>
-        <form @submit.prevent="onAddData">
-          <div class="modal-body">
-            <div class="form-group">
-              <label for="name">Name:</label>
-              <input type="text" class="form-control" required id="name"  placeholder="Please enter a file name" v-model="addData.name">
-              <small class="form-text text-muted">Such as <code>filename.txt</code></small>
-            </div>
-            <div class="form-group">
-              <label for="type">Type:</label>
-              <input type="text" class="form-control" required id="type"  placeholder="Please enter the MIME type" v-model="addData.type">
-              <small class="form-text text-muted">Such as <code>text/plain</code></small>
-            </div>
-            <div class="form-group">
-              <label for="content">Content:</label>
-              <textarea class="form-control" required id="content" rows="3" placeholder="Please enter the file contents" v-model="addData.content"></textarea>
-            </div>
-          </div>
-          <div class="modal-footer">
-            <button type="button" class="btn btn-secondary" @click.prevent="addData.show = false">Close</button>
-            <button type="submit" class="btn btn-primary">Save</button>
-          </div>
-        </form>
-      </div>
-    </div>
-  </div>
-
-
-
-
-
-
-  <div :class="{'modal-backdrop': true, 'fade': true, show: editFile.show}"></div>
-  <div :class="{modal: true, fade: true, show: editFile.show}" id="modal-edit-file" tabindex="-1" role="dialog">
-    <div class="modal-dialog modal-lg" role="document">
-      <div class="modal-content">
-        <div class="modal-header">
-          <h5 class="modal-title">Edit file</h5>
-          <button type="button" class="close"  @click.prevent="editFile.show = false">
-            <span>&times;</span>
-          </button>
-        </div>
-        <form @submit.prevent="onEditorFile">
-          <div class="modal-body">
-            <div class="form-group">
-              <label for="name">Name:</label>
-              <input type="text" class="form-control" required id="name"  placeholder="Please enter a file name" v-model="editFile.name">
-            </div>
-            <div class="form-group" v-if="editFile.show && editFile.blob && editFile.type && editFile.type.substr(0, 6) === 'image/'">
-              <label>Image: </label>
-              <div class="edit-image">
-                <img :src="editFile.blob" ref="editImage" />
-              </div>
-
-              <div class="edit-image-tool">
-                <div class="btn-group" role="group">
-                  <button type="button" class="btn btn-primary" @click="editFile.cropper.rotate(-90)" title="cropper.rotate(-90)"><i class="fa fa-undo" aria-hidden="true"></i></button>
-                  <button type="button" class="btn btn-primary" @click="editFile.cropper.rotate(90)"  title="cropper.rotate(90)"><i class="fa fa-repeat" aria-hidden="true"></i></button>
+              </td>
+            </tr>
+            <tr v-for="(file, index) in files" :key="file.id">
+              <td>{{ index }}</td>
+              <td>
+                <img v-if="file.thumb" :src="file.thumb" width="40" height="auto">
+                <span v-else>No Image</span>
+              </td>
+              <td>
+                <div class="filename">
+                  {{ file.name }}
                 </div>
-                <div class="btn-group" role="group">
-                  <button type="button" class="btn btn-primary" @click="editFile.cropper.crop()" title="cropper.crop()"><i class="fa fa-check" aria-hidden="true"></i></button>
-                  <button type="button" class="btn btn-primary" @click="editFile.cropper.clear()" title="cropper.clear()"><i class="fa fa-remove" aria-hidden="true"></i></button>
+                <div v-if="file.active || file.progress !== '0.00'" class="progress">
+                  <div :class="{'progress-bar': true, 'progress-bar-striped': true, 'bg-danger': file.error, 'progress-bar-animated': file.active}" role="progressbar" :style="{width: file.progress + '%'}">{{ file.progress }}%</div>
+                </div>
+              </td>
+              <td>{{ file.size | formatSize }}</td>
+              <td>{{ file.speed | formatSize }}</td>
+
+              <td v-if="file.error">{{ file.error }}</td>
+              <td v-else-if="file.success">success</td>
+              <td v-else-if="file.active">active</td>
+              <td v-else />
+              <td>
+                <div class="btn-group">
+                  <button class="btn btn-secondary btn-sm dropdown-toggle" type="button">
+                    Action
+                  </button>
+                  <div class="dropdown-menu">
+                    <a :class="{'dropdown-item': true, disabled: file.active || file.success || file.error === 'compressing'}" href="#" @click.prevent="file.active || file.success || file.error === 'compressing' ? false : onEditFileShow(file)">Edit</a>
+                    <a :class="{'dropdown-item': true, disabled: !file.active}" href="#" @click.prevent="file.active ? $refs.upload.update(file, {error: 'cancel'}) : false">Cancel</a>
+
+                    <a v-if="file.active" class="dropdown-item" href="#" @click.prevent="$refs.upload.update(file, {active: false})">Abort</a>
+                    <a v-else-if="file.error && file.error !== 'compressing' && $refs.upload.features.html5" class="dropdown-item" href="#" @click.prevent="$refs.upload.update(file, {active: true, error: '', progress: '0.00'})">Retry upload</a>
+                    <a v-else :class="{'dropdown-item': true, disabled: file.success || file.error === 'compressing'}" href="#" @click.prevent="file.success || file.error === 'compressing' ? false : $refs.upload.update(file, {active: true})">Upload</a>
+
+                    <div class="dropdown-divider" />
+                    <a class="dropdown-item" href="#" @click.prevent="$refs.upload.remove(file)">Remove</a>
+                  </div>
+                </div>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+      <div class="example-foorer">
+        <div class="footer-status float-right">
+          Drop: {{ $refs.upload ? $refs.upload.drop : false }},
+          Active: {{ $refs.upload ? $refs.upload.active : false }},
+          Uploaded: {{ $refs.upload ? $refs.upload.uploaded : true }},
+          Drop active: {{ $refs.upload ? $refs.upload.dropActive : false }}
+        </div>
+        <div class="btn-group">
+          <file-upload
+            ref="upload"
+            v-model="files"
+            class="btn btn-primary dropdown-toggle"
+            :post-action="postAction"
+            :put-action="putAction"
+            :extensions="extensions"
+            :accept="accept"
+            :multiple="multiple"
+            :directory="directory"
+            :size="size || 0"
+            :thread="thread < 1 ? 1 : (thread > 5 ? 5 : thread)"
+            :headers="headers"
+            :data="data"
+            :drop="drop"
+            :drop-directory="dropDirectory"
+            :add-index="addIndex"
+            @input-filter="inputFilter"
+            @input-file="inputFile"
+          >
+            <i class="fa fa-plus" />
+            Select
+          </file-upload>
+          <div class="dropdown-menu">
+            <label class="dropdown-item" :for="name">Add files</label>
+            <a class="dropdown-item" href="#" @click="onAddFolader">Add folder</a>
+            <a class="dropdown-item" href="#" @click.prevent="addData.show = true">Add data</a>
+          </div>
+        </div>
+        <button v-if="!$refs.upload || !$refs.upload.active" type="button" class="btn btn-success" @click.prevent="$refs.upload.active = true">
+          <i class="fa fa-arrow-up" aria-hidden="true" />
+          Start Upload
+        </button>
+        <button v-if="!$refs.upload || !$refs.upload.active" type="button" class="btn btn-warning" @click.prevent="onSendAnalyzeRequest">
+          Analyze
+        </button>
+        <button v-else type="button" class="btn btn-danger" @click.prevent="$refs.upload.active = false">
+          <i class="fa fa-stop" aria-hidden="true" />
+          Stop Upload
+        </button>
+      </div>
+    </div>
+
+    <div v-show="isOption" class="option">
+      <div class="form-group">
+        <label for="accept">Accept:</label>
+        <input id="accept" v-model="accept" type="text" class="form-control">
+        <small class="form-text text-muted">Allow upload mime type</small>
+      </div>
+      <div class="form-group">
+        <label for="extensions">Extensions:</label>
+        <input id="extensions" v-model="extensions" type="text" class="form-control">
+        <small class="form-text text-muted">Allow upload file extension</small>
+      </div>
+      <div class="form-group">
+        <label>PUT Upload:</label>
+        <div class="form-check">
+          <label class="form-check-label">
+            <input id="put-action" v-model="putAction" class="form-check-input" type="radio" name="put-action" value=""> Off
+          </label>
+        </div>
+        <div class="form-check">
+          <label class="form-check-label">
+            <input id="put-action" v-model="putAction" class="form-check-input" type="radio" name="put-action" value="/upload/put"> On
+          </label>
+        </div>
+        <small class="form-text text-muted">After the shutdown, use the POST method to upload</small>
+      </div>
+      <div class="form-group">
+        <label for="thread">Thread:</label>
+        <input id="thread" v-model.number="thread" type="number" max="5" min="1" class="form-control">
+        <small class="form-text text-muted">Also upload the number of files at the same time (number of threads)</small>
+      </div>
+      <div class="form-group">
+        <label for="size">Max size:</label>
+        <input id="size" v-model.number="size" type="number" min="0" class="form-control">
+      </div>
+      <div class="form-group">
+        <label for="minSize">Min size:</label>
+        <input id="minSize" v-model.number="minSize" type="number" min="0" class="form-control">
+      </div>
+      <div class="form-group">
+        <label for="autoCompress">Automatically compress:</label>
+        <input id="autoCompress" v-model.number="autoCompress" type="number" min="0" class="form-control">
+        <small v-if="autoCompress > 0" class="form-text text-muted">More than {{ autoCompress | formatSize }} files are automatically compressed</small>
+        <small v-else class="form-text text-muted">Set up automatic compression</small>
+      </div>
+
+      <div class="form-group">
+        <div class="form-check">
+          <label class="form-check-label">
+            <input id="add-index" v-model="addIndex" type="checkbox" class="form-check-input"> Start position to add
+          </label>
+        </div>
+        <small class="form-text text-muted">Add a file list to start the location to add</small>
+      </div>
+
+      <div class="form-group">
+        <div class="form-check">
+          <label class="form-check-label">
+            <input id="drop" v-model="drop" type="checkbox" class="form-check-input"> Drop
+          </label>
+        </div>
+        <small class="form-text text-muted">Drag and drop upload</small>
+      </div>
+      <div class="form-group">
+        <div class="form-check">
+          <label class="form-check-label">
+            <input id="drop-directory" v-model="dropDirectory" type="checkbox" class="form-check-input"> Drop directory
+          </label>
+        </div>
+        <small class="form-text text-muted">Not checked, filter the dragged folder</small>
+      </div>
+      <div class="form-group">
+        <div class="form-check">
+          <label class="form-check-label">
+            <input id="upload-auto" v-model="uploadAuto" type="checkbox" class="form-check-input"> Auto start
+          </label>
+        </div>
+        <small class="form-text text-muted">Automatically activate upload</small>
+      </div>
+      <div class="form-group">
+        <button type="button" class="btn btn-primary btn-lg btn-block" @click.prevent="isOption = !isOption">Confirm</button>
+      </div>
+    </div>
+
+    <div :class="{'modal-backdrop': true, 'fade': true, show: addData.show}" />
+    <div id="modal-add-data" :class="{modal: true, fade: true, show: addData.show}" tabindex="-1" role="dialog">
+      <div class="modal-dialog" role="document">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h5 class="modal-title">Add data</h5>
+            <button type="button" class="close" @click.prevent="addData.show = false">
+              <span>&times;</span>
+            </button>
+          </div>
+          <form @submit.prevent="onAddData">
+            <div class="modal-body">
+              <div class="form-group">
+                <label for="name">Name:</label>
+                <input id="name" v-model="addData.name" type="text" class="form-control" required placeholder="Please enter a file name">
+                <small class="form-text text-muted">Such as <code>filename.txt</code></small>
+              </div>
+              <div class="form-group">
+                <label for="type">Type:</label>
+                <input id="type" v-model="addData.type" type="text" class="form-control" required placeholder="Please enter the MIME type">
+                <small class="form-text text-muted">Such as <code>text/plain</code></small>
+              </div>
+              <div class="form-group">
+                <label for="content">Content:</label>
+                <textarea id="content" v-model="addData.content" class="form-control" required rows="3" placeholder="Please enter the file contents" />
+              </div>
+            </div>
+            <div class="modal-footer">
+              <button type="button" class="btn btn-secondary" @click.prevent="addData.show = false">Close</button>
+              <button type="submit" class="btn btn-primary">Save</button>
+            </div>
+          </form>
+        </div>
+      </div>
+    </div>
+
+    <div :class="{'modal-backdrop': true, 'fade': true, show: editFile.show}" />
+    <div id="modal-edit-file" :class="{modal: true, fade: true, show: editFile.show}" tabindex="-1" role="dialog">
+      <div class="modal-dialog modal-lg" role="document">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h5 class="modal-title">Edit file</h5>
+            <button type="button" class="close" @click.prevent="editFile.show = false">
+              <span>&times;</span>
+            </button>
+          </div>
+          <form @submit.prevent="onEditorFile">
+            <div class="modal-body">
+              <div class="form-group">
+                <label for="name">Name:</label>
+                <input id="name" v-model="editFile.name" type="text" class="form-control" required placeholder="Please enter a file name">
+              </div>
+              <div v-if="editFile.show && editFile.blob && editFile.type && editFile.type.substr(0, 6) === 'image/'" class="form-group">
+                <label>Image: </label>
+                <div class="edit-image">
+                  <img ref="editImage" :src="editFile.blob">
+                </div>
+
+                <div class="edit-image-tool">
+                  <div class="btn-group" role="group">
+                    <button type="button" class="btn btn-primary" title="cropper.rotate(-90)" @click="editFile.cropper.rotate(-90)"><i class="fa fa-undo" aria-hidden="true" /></button>
+                    <button type="button" class="btn btn-primary" title="cropper.rotate(90)" @click="editFile.cropper.rotate(90)"><i class="fa fa-repeat" aria-hidden="true" /></button>
+                  </div>
+                  <div class="btn-group" role="group">
+                    <button type="button" class="btn btn-primary" title="cropper.crop()" @click="editFile.cropper.crop()"><i class="fa fa-check" aria-hidden="true" /></button>
+                    <button type="button" class="btn btn-primary" title="cropper.clear()" @click="editFile.cropper.clear()"><i class="fa fa-remove" aria-hidden="true" /></button>
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div class="modal-footer">
-            <button type="button" class="btn btn-secondary" @click.prevent="editFile.show = false">Close</button>
-            <button type="submit" class="btn btn-primary">Save</button>
-          </div>
-        </form>
+            <div class="modal-footer">
+              <button type="button" class="btn btn-secondary" @click.prevent="editFile.show = false">Close</button>
+              <button type="submit" class="btn btn-primary">Save</button>
+            </div>
+          </form>
+        </div>
       </div>
     </div>
-  </div>
 
-</div>
+  </div>
 </template>
 
-
 <script>
 import Cropper from 'cropperjs'
 import ImageCompressor from '@xkeshi/image-compressor'
@@ -313,7 +300,7 @@ import { sendAnalyzeRequest } from '@/api/user'
 // import 'bootstrap/dist/css/bootstrap.min.css'
 export default {
   components: {
-    FileUpload,
+    FileUpload
   },
   data() {
     return {
@@ -332,12 +319,12 @@ export default {
       thread: 3,
       name: 'file',
       postAction: '/upload/post',
-      putAction: 'http://localhost:8888/uploader',
+      putAction: 'http://localhost:8010/uploader',
       headers: {
-        'X-Csrf-Token': 'xxxx',
+        'X-Csrf-Token': 'xxxx'
       },
       data: {
-        '_csrf_token': 'xxxxxx',
+        '_csrf_token': 'xxxxxx'
       },
       autoCompress: 1024 * 1024,
       uploadAuto: false,
@@ -346,11 +333,11 @@ export default {
         show: false,
         name: '',
         type: '',
-        content: '',
+        content: ''
       },
       editFile: {
         show: false,
-        name: '',
+        name: ''
       }
     }
   },
@@ -361,12 +348,12 @@ export default {
         this.$refs.upload.update(this.editFile.id, { error: this.editFile.error || '' })
       }
       if (newValue) {
-        this.$nextTick(function () {
+        this.$nextTick(function() {
           if (!this.$refs.editImage) {
             return
           }
-          let cropper = new Cropper(this.$refs.editImage, {
-            autoCrop: false,
+          const cropper = new Cropper(this.$refs.editImage, {
+            autoCrop: false
           })
           this.editFile = {
             ...this.editFile,
@@ -381,7 +368,7 @@ export default {
         this.addData.type = ''
         this.addData.content = ''
       }
-    },
+    }
   },
   methods: {
     inputFilter(newFile, oldFile, prevent) {
@@ -405,7 +392,7 @@ export default {
           const imageCompressor = new ImageCompressor(null, {
             convertSize: Infinity,
             maxWidth: 512,
-            maxHeight: 512,
+            maxHeight: 512
           })
           imageCompressor.compress(newFile.file)
             .then((file) => {
@@ -420,7 +407,7 @@ export default {
         // Create a blob field
         // 创建 blob 字段
         newFile.blob = ''
-        let URL = window.URL || window.webkitURL
+        const URL = window.URL || window.webkitURL
         if (URL && URL.createObjectURL) {
           newFile.blob = URL.createObjectURL(newFile.file)
         }
@@ -482,12 +469,12 @@ export default {
         this.editFile.show = false
         return
       }
-      let data = {
-        name: this.editFile.name,
+      const data = {
+        name: this.editFile.name
       }
       if (this.editFile.cropper) {
-        let binStr = atob(this.editFile.cropper.getCroppedCanvas().toDataURL(this.editFile.type).split(',')[1])
-        let arr = new Uint8Array(binStr.length)
+        const binStr = atob(this.editFile.cropper.getCroppedCanvas().toDataURL(this.editFile.type).split(',')[1])
+        const arr = new Uint8Array(binStr.length)
         for (let i = 0; i < binStr.length; i++) {
           arr[i] = binStr.charCodeAt(i)
         }
@@ -504,7 +491,7 @@ export default {
         this.alert('Your browser does not support')
         return
       }
-      let input = this.$refs.upload.$el.querySelector('input')
+      const input = this.$refs.upload.$el.querySelector('input')
       input.directory = true
       input.webkitdirectory = true
       this.directory = true
@@ -522,19 +509,22 @@ export default {
         this.alert('Your browser does not support')
         return
       }
-      let file = new window.File([this.addData.content], this.addData.name, {
-        type: this.addData.type,
+      const file = new window.File([this.addData.content], this.addData.name, {
+        type: this.addData.type
       })
       this.$refs.upload.add(file)
     },
 
     onSendAnalyzeRequest() {
-        this.$router.push({ name: "analyze" })
-        this.listLoading = true
-        sendAnalyzeRequest().then(response => {
-        console.log("success!")
-        this.list = response.data.items
-        this.listLoading = false
+      this.$router.push({ name: 'analyze' })
+      this.listLoading = true
+      sendAnalyzeRequest().then(response => {
+        // console.log("success!")
+        // console.log(response['token'])
+        // this.list = response.data.items
+        // this.listLoading = false
+        /*eslint-disable*/ 
+        token = response['token']
         // if the response from the server indicating that it's running the analysis, then redirect to a loading view
         if (this.list.indexOf('anylyzing') >= 0) {
           // this.$router.push('@/views/Analyzing/analyzing')
@@ -550,7 +540,6 @@ export default {
   }
 }
 
-
 </script>
 
 <style>
@@ -631,7 +620,6 @@ export default {
 }
 </style>
 
-
 <!-- <template>
   <div class="app-container">
     <ul>
@@ -719,11 +707,6 @@ export default {
 import 'vue-upload-component/dist/vue-upload-component.part.css'
 @import "vue-upload-component/dist/vue-upload-component.part.css"
 
-
-
-
-
- 
 .file-uploads {
   overflow: hidden;
   position: relative;
@@ -751,4 +734,4 @@ import 'vue-upload-component/dist/vue-upload-component.part.css'
   opacity: 0;
 }
 </style>
- -->
\ No newline at end of file
+ -->

From 98096c81dd751176f114c533882707797d90c408 Mon Sep 17 00:00:00 2001
From: Z <zhipenghou2022@u.northwestern.edu>
Date: Fri, 13 Sep 2019 11:20:26 -0500
Subject: [PATCH 2/3] removedhaha

---
 package.json                      |  3 +--
 src/router/index.js               |  4 ++--
 src/views/Analyzing/analyzing.vue | 20 +++++++++-----------
 3 files changed, 12 insertions(+), 15 deletions(-)

diff --git a/package.json b/package.json
index 9a9e6d99..dac6866d 100644
--- a/package.json
+++ b/package.json
@@ -53,6 +53,7 @@
     "dropzone": "5.5.1",
     "echarts": "4.2.1",
     "element-ui": "2.7.0",
+    "eslint": "^6.3.0",
     "file-saver": "2.0.1",
     "fuse.js": "3.4.4",
     "jquery": "^3.4.1",
@@ -92,10 +93,8 @@
     "chalk": "2.4.2",
     "chokidar": "2.1.5",
     "connect": "3.6.6",
-    "eslint": "5.15.3",
     "eslint-plugin-vue": "5.2.2",
     "html-webpack-plugin": "3.2.0",
-    "husky": "1.3.1",
     "lint-staged": "8.1.5",
     "mockjs": "1.0.1-beta3",
     "node-sass": "^4.9.0",
diff --git a/src/router/index.js b/src/router/index.js
index 110c0554..235a18c7 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -101,8 +101,8 @@ export const constantRoutes = [
     component: Layout,
     children: [
       {
-        path: 'haha',
-        component: ()=>import('@/views/Analyzing/analyzing'),
+        path: 'analyzing',
+        component: () => import('@/views/Analyzing/analyzing'),
         name: 'analyze',
         meta: { title: 'analyzing' }
       }
diff --git a/src/views/Analyzing/analyzing.vue b/src/views/Analyzing/analyzing.vue
index b138840e..54270f31 100644
--- a/src/views/Analyzing/analyzing.vue
+++ b/src/views/Analyzing/analyzing.vue
@@ -1,14 +1,12 @@
 <!-- <template>
 	<div class="progress">
 	 <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 75%"></div>
-	  <span>hhahahahahahah</span>
 	</div>
 </template>
 
-
 <script>
     export default {
-        
+
         data () {
             return {
                 msg: 'Hey Nic Raboy'
@@ -19,19 +17,19 @@
 
 <template>
   <div class="vue-spinner">
-    <Circle9></Circle9>
+    <Circle9 />
     <h1>Analyzing....</h1>
   </div>
 </template>
- 
+
 <script>
-  import Circle9 from 'vue-loading-spinner/src/components/Circle9'
-  export default {
-  	name: 'analyze',
-    components: {
-      Circle9
-    }
+import Circle9 from 'vue-loading-spinner/src/components/Circle9'
+export default {
+  	name: 'Analyze',
+  components: {
+    Circle9
   }
+}
 </script>
 
 <style scoped>

From 3513a2ab4fc05fdbad5d559763afc4f2f429f715 Mon Sep 17 00:00:00 2001
From: Z <zhipenghou2022@u.northwestern.edu>
Date: Fri, 13 Sep 2019 15:48:58 -0500
Subject: [PATCH 3/3] plotpage

---
 .eslintignore                     |  1 +
 package.json                      |  2 +-
 src/router/index.js               | 16 +++++++++++++++-
 src/views/Analyzing/analyzing.vue |  2 +-
 src/views/plot/index.vue          | 26 ++++++++++++++++++++++++++
 5 files changed, 44 insertions(+), 3 deletions(-)
 create mode 100644 src/views/plot/index.vue

diff --git a/.eslintignore b/.eslintignore
index e6529fc0..51525879 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -2,3 +2,4 @@ build/*.js
 src/assets
 public
 dist
+src
diff --git a/package.json b/package.json
index dac6866d..60c81a6c 100644
--- a/package.json
+++ b/package.json
@@ -93,7 +93,7 @@
     "chalk": "2.4.2",
     "chokidar": "2.1.5",
     "connect": "3.6.6",
-    "eslint-plugin-vue": "5.2.2",
+    "eslint-plugin-vue": "^5.2.3",
     "html-webpack-plugin": "3.2.0",
     "lint-staged": "8.1.5",
     "mockjs": "1.0.1-beta3",
diff --git a/src/router/index.js b/src/router/index.js
index 235a18c7..03e0093b 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -12,7 +12,7 @@ import chartsRouter from './modules/charts'
 import tableRouter from './modules/table'
 import nestedRouter from './modules/nested'
 
-/**
+/** 
  * Note: sub-menu only appear when route children.length >= 1
  * Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html
  *
@@ -108,6 +108,20 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/plot',
+    //hidden: true,
+    component: Layout,
+
+    children: [
+      {
+        path: 'plot',
+        component: () => import('@/views/plot/index'),
+        name: 'plot',
+        meta: { title: 'plot' }
+      }
+    ]
+  },
   {
     path: '/documentation',
     component: Layout,
diff --git a/src/views/Analyzing/analyzing.vue b/src/views/Analyzing/analyzing.vue
index 54270f31..7f77cc1a 100644
--- a/src/views/Analyzing/analyzing.vue
+++ b/src/views/Analyzing/analyzing.vue
@@ -25,7 +25,7 @@
 <script>
 import Circle9 from 'vue-loading-spinner/src/components/Circle9'
 export default {
-  	name: 'Analyze',
+  name: 'Analyze',
   components: {
     Circle9
   }
diff --git a/src/views/plot/index.vue b/src/views/plot/index.vue
new file mode 100644
index 00000000..a33371af
--- /dev/null
+++ b/src/views/plot/index.vue
@@ -0,0 +1,26 @@
+<template>
+  <!-- <div class="vue-spinner">
+    <Circle9 />
+    <h1>Analyzing....</h1>
+  </div> -->
+    <iframe src="http://localhost:808" width=1300 height=600></iframe>
+</template>
+
+<script>
+import Circle9 from 'vue-loading-spinner/src/components/Circle9'
+export default {
+  name: 'plot',
+  components: {
+    Circle9
+  }
+}
+</script>
+
+<style scoped>
+	.vue-spinner{
+		margin: 100px;
+		width: 50%;
+		height: 50%;
+		/*overflow: hidden;*/
+	}
+</style>