fixed upload bug

README-zh.md

@@ -59,7 +59,7 @@ Crawlab的架构包括了一个主节点（Master Node）和多个工作节点
 
 前端应用向主节点请求数据，主节点通过MongoDB和Redis来执行任务派发调度以及部署，工作节点收到任务之后，开始执行爬虫任务，并将任务结果储存到MongoDB。架构相对于`v0.3.0`之前的Celery版本有所精简，去除了不必要的节点监控模块Flower，节点监控主要由Redis完成。
 
-### 主节点 Master Node
+### 主节点
 
 主节点是整个Crawlab架构的核心，属于Crawlab的中控系统。
 

frontend/src/components/ScrollView/LogItem.vue

@@ -23,17 +23,28 @@ export default {
 
 <style scoped>
   .log-item {
-    display: flex;
+    display: table;
+  }
+
+  .log-item:first-child .line-no {
+    padding-top: 10px;
   }
 
   .log-item .line-no {
-    margin-right: 10px;
+    display: table-cell;
+    color: #A9B7C6;
+    background: #313335;
+    padding-right: 10px;
     text-align: right;
     flex-basis: 40px;
+    width: 70px;
   }
 
   .log-item .line-content {
-    display: inline-block;
+    padding-left: 10px;
+    display: table-cell;
+    /*display: inline-block;*/
+    word-break: break-word;
     flex-basis: calc(100% - 50px);
   }
 </style>

frontend/src/components/ScrollView/LogView.vue

@@ -1,6 +1,7 @@
 <template>
   <virtual-list
-    :size="18"
+    class="log-view"
+    :size="6"
     :remain="100"
     :item="item"
     :itemcount="logData.length"
@@ -60,19 +61,12 @@ export default {
 
 <style scoped>
   .log-view {
+    margin-top: 0!important;
     min-height: 100%;
     overflow-y: scroll;
     list-style: none;
-  }
-
-  .log-view .log-line {
-    display: flex;
-  }
-
-  .log-view .log-line:nth-child(odd) {
-  }
-
-  .log-view .log-line:nth-child(even) {
+    color: #A9B7C6;
+    background: #2B2B2B;
   }
 
 </style>

frontend/src/i18n/zh.js

@@ -175,6 +175,7 @@ export default {
   'Create Time': '创建时间',
   'Start Time': '开始时间',
   'Finish Time': '结束时间',
+  'Update Time': '更新时间',
 
   // 部署
   'Time': '时间',

frontend/src/store/modules/user.js

@@ -25,6 +25,9 @@ const user = {
       const userInfoStr = window.localStorage.getItem('user_info')
       if (!userInfoStr) return {}
       return JSON.parse(userInfoStr)
+    },
+    token () {
+      return window.localStorage.getItem('token')
     }
   },
 

frontend/src/views/spider/SpiderList.vue

@@ -84,7 +84,9 @@
       <el-form :model="spiderForm" ref="addConfigurableForm" inline-message>
         <el-form-item :label="$t('Upload Zip File')" label-width="120px" name="site">
           <el-upload
-            :action="$request.baseUrl + '/spiders/manage/upload'"
+            :action="$request.baseUrl + '/spiders'"
+            :headers="{Authorization:token}"
+            :on-change="onUploadChange"
             :on-success="onUploadSuccess"
             :file-list="fileList">
             <el-button type="primary" icon="el-icon-upload">{{$t('Upload')}}</el-button>
@@ -229,7 +231,8 @@
 
 <script>
 import {
-  mapState
+  mapState,
+  mapGetters
 } from 'vuex'
 import dayjs from 'dayjs'
 import CrawlConfirmDialog from '../../components/Common/CrawlConfirmDialog'
@@ -258,11 +261,13 @@ export default {
       // tableData,
       columns: [
         { name: 'name', label: 'Name', width: '180', align: 'left' },
-        { name: 'site_name', label: 'Site', width: '140', align: 'left' },
+        // { name: 'site_name', label: 'Site', width: '140', align: 'left' },
         { name: 'type', label: 'Spider Type', width: '120' },
         // { name: 'cmd', label: 'Command Line', width: '200' },
         // { name: 'lang', label: 'Language', width: '120', sortable: true },
-        { name: 'last_run_ts', label: 'Last Run', width: '160' }
+        { name: 'last_run_ts', label: 'Last Run', width: '160' },
+        { name: 'create_ts', label: 'Create Time', width: '160' },
+        { name: 'update_ts', label: 'Update Time', width: '160' }
         // { name: 'last_7d_tasks', label: 'Last 7-Day Tasks', width: '80' },
         // { name: 'last_5_errors', label: 'Last 5-Run Errors', width: '80' }
       ],
@@ -278,6 +283,9 @@ export default {
       'spiderList',
       'spiderForm'
     ]),
+    ...mapGetters('user', [
+      'token'
+    ]),
     filteredTableData () {
       return this.spiderList
         .filter(d => {
@@ -469,6 +477,8 @@ export default {
         }
       })
     },
+    onUploadChange () {
+    },
     onUploadSuccess () {
       // clear fileList
       this.fileList = []