added filter for TaskList

This commit is contained in:
Marvin Zhang
2019-04-17 21:50:30 +08:00
parent 6b30ad22ab
commit aa6f414e42
3 changed files with 59 additions and 34 deletions

View File

@@ -2,20 +2,22 @@
<div class="app-container">
<!--filter-->
<div class="filter">
<el-input prefix-icon="el-icon-search"
:placeholder="$t('Search')"
class="filter-search"
v-model="filter.keyword"
@change="onSearch">
</el-input>
<div class="right">
<div class="left">
<el-select class="filter-select" v-model="filter.node_id" :placeholder="$t('Node')" filterable clearable>
<el-option v-for="op in nodeList" :key="op._id" :value="op._id" :label="op.name"></el-option>
</el-select>
<el-select class="filter-select" v-model="filter.spider_id" :placeholder="$t('Spider')" filterable clearable>
<el-option v-for="op in spiderList" :key="op._id" :value="op._id" :label="op.name"></el-option>
</el-select>
<el-button type="success"
icon="el-icon-refresh"
icon="el-icon-search"
class="refresh"
@click="onRefresh">
{{$t('Refresh')}}
{{$t('Search')}}
</el-button>
</div>
<!--<div class="right">-->
<!--</div>-->
</div>
<!--table list-->
@@ -102,26 +104,31 @@ export default {
return {
isEditMode: false,
dialogVisible: false,
filter: {
keyword: ''
},
// tableData,
columns: [
{ name: 'create_ts', label: 'Create Time', width: '150' },
{ name: 'start_ts', label: 'Start Time', width: '150' },
{ name: 'finish_ts', label: 'Finish Time', width: '150' },
{ name: 'duration', label: 'Duration (sec)', width: '80' },
{ name: 'spider_name', label: 'Spider', width: '160' },
{ name: 'node_id', label: 'Node', width: '160' },
{ name: 'status', label: 'Status', width: '160', sortable: true }
{ name: 'status', label: 'Status', width: '80' }
]
}
},
computed: {
...mapState('task', [
'filter',
'taskList',
'taskListTotalCount',
'taskForm'
]),
...mapState('spider', [
'spiderList'
]),
...mapState('node', [
'nodeList'
]),
pageNum: {
get () {
return this.$store.state.task.pageNum
@@ -200,6 +207,8 @@ export default {
},
created () {
this.$store.dispatch('task/getTaskList')
this.$store.dispatch('spider/getSpiderList')
this.$store.dispatch('node/getNodeList')
}
}
</script>
@@ -215,6 +224,13 @@ export default {
display: flex;
justify-content: space-between;
.left {
.filter-select {
width: 180px;
margin-right: 10px;
}
}
.filter-search {
width: 240px;
}