diff --git a/frontend/src/store/modules/task.js b/frontend/src/store/modules/task.js
index 9de29000..95153be5 100644
--- a/frontend/src/store/modules/task.js
+++ b/frontend/src/store/modules/task.js
@@ -12,7 +12,8 @@ const state = {
   // filter
   filter: {
     node_id: '',
-    spider_id: ''
+    spider_id: '',
+    status: ''
   },
   // pagination
   pageNum: 1,
@@ -89,7 +90,8 @@ const actions = {
       page_num: state.pageNum,
       page_size: state.pageSize,
       node_id: state.filter.node_id || undefined,
-      spider_id: state.filter.spider_id || undefined
+      spider_id: state.filter.spider_id || undefined,
+      status: state.filter.status || undefined
     })
       .then(response => {
         commit('SET_TASK_LIST', response.data.data || [])
diff --git a/frontend/src/views/layout/components/Navbar.vue b/frontend/src/views/layout/components/Navbar.vue
index 786e4f60..52960c21 100644
--- a/frontend/src/views/layout/components/Navbar.vue
+++ b/frontend/src/views/layout/components/Navbar.vue
@@ -8,9 +8,6 @@
         <i class="el-icon-arrow-down el-icon--right"></i>
       </span>
       <el-dropdown-menu slot="dropdown" class="user-dropdown">
-<!--        <el-dropdown-item>-->
-<!--          <span style="display:block;">v0.4.1</span>-->
-<!--        </el-dropdown-item>-->
         <el-dropdown-item>
           <span style="display:block;" @click="logout">{{$t('Logout')}}</span>
         </el-dropdown-item>
diff --git a/frontend/src/views/task/TaskList.vue b/frontend/src/views/task/TaskList.vue
index becc7d0b..a90d917e 100644
--- a/frontend/src/views/task/TaskList.vue
+++ b/frontend/src/views/task/TaskList.vue
@@ -4,6 +4,29 @@
       <!--filter-->
       <div class="filter">
         <div class="left">
+          <el-form model="filter" label-width="100px" label-position="right" inline>
+            <el-form-item prop="node_id" :label="$t('Node')">
+              <el-select v-model="filter.node_id" size="small" :placeholder="$t('Node')" @change="onFilterChange">
+                <el-option value="" :label="$t('All')"/>
+                <el-option v-for="node in nodeList" :key="node._id" :value="node._id" :label="node.name"/>
+              </el-select>
+            </el-form-item>
+            <el-form-item prop="spider_id" :label="$t('Spider')">
+              <el-select v-model="filter.spider_id" size="small" :placeholder="$t('Spider')" @change="onFilterChange">
+                <el-option value="" :label="$t('All')"/>
+                <el-option v-for="spider in spiderList" :key="spider._id" :value="spider._id" :label="spider.name"/>
+              </el-select>
+            </el-form-item>
+            <el-form-item prop="status" :label="$t('Status')">
+              <el-select v-model="filter.status" size="small" :placeholder="$t('Status')" @change="onFilterChange">
+                <el-option value="" :label="$t('All')"></el-option>
+                <el-option value="finished" :label="$t('Finished')"></el-option>
+                <el-option value="running" :label="$t('Running')"></el-option>
+                <el-option value="error" :label="$t('Error')"></el-option>
+                <el-option value="cancelled" :label="$t('Cancelled')"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-form>
         </div>
         <div class="right">
           <el-button @click="onRemoveMultipleTask" size="small" type="danger">
@@ -310,6 +333,9 @@ export default {
     },
     onSelectionChange (val) {
       this.multipleSelection = val
+    },
+    onFilterChange () {
+      this.$store.dispatch('task/getTaskList')
     }
   },
   created () {