git-sync/crawlab
1
0
Fork 0
mirror of https://github.com/crawlab-team/crawlab.git synced 2026-01-28 17:50:56 +01:00
Code Issues Packages Projects Releases Wiki Activity

加入爬虫列表排序

Browse Source
This commit is contained in:
marvzhang
2020-01-06 13:18:29 +08:00
parent 550a4e95b3
commit 2c3f440c8e
5 changed files with 100 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
frontend/src/views/spider/SpiderList.vue
View File

@@ -169,67 +169,86 @@
<!--./tabs-->
<!--table list-->
<el-table :data="spiderList"
class="table"
:header-cell-style="{background:'rgb(48, 65, 86)',color:'white'}"
border
@row-click="onRowClick"
<el-table
:data="spiderList"
class="table"
:header-cell-style="{background:'rgb(48, 65, 86)',color:'white'}"
border
@row-click="onRowClick"
@sort-change="onSortChange"
>
<template v-for="col in columns">
<el-table-column v-if="col.name === 'type'"
:key="col.name"
:label="$t(col.label)"
align="left"
:width="col.width">
<el-table-column
v-if="col.name === 'type'"
:key="col.name"
:label="$t(col.label)"
align="left"
:width="col.width"
:sortable="col.sortable"
>
<template slot-scope="scope">
{{$t(scope.row.type)}}
</template>
</el-table-column>
<el-table-column v-else-if="col.name === 'last_5_errors'"
:key="col.name"
:label="$t(col.label)"
:width="col.width"
align="center">
<el-table-column
v-else-if="col.name === 'last_5_errors'"
:key="col.name"
:label="$t(col.label)"
:width="col.width"
:sortable="col.sortable"
align="center"
>
<template slot-scope="scope">
<div :style="{color:scope.row[col.name]>0?'red':''}">
{{scope.row[col.name]}}
</div>
</template>
</el-table-column>
<el-table-column v-else-if="col.name === 'cmd'"
:key="col.name"
:label="$t(col.label)"
:width="col.width"
align="left">
<el-table-column
v-else-if="col.name === 'cmd'"
:key="col.name"
:label="$t(col.label)"
:width="col.width"
:sortable="col.sortable"
align="left"
>
<template slot-scope="scope">
<el-input v-model="scope.row[col.name]"></el-input>
</template>
</el-table-column>
<el-table-column v-else-if="col.name.match(/_ts$/)"
:key="col.name"
:label="$t(col.label)"
:sortable="col.sortable"
:align="col.align"
:width="col.width">
<el-table-column
v-else-if="col.name.match(/_ts$/)"
:key="col.name"
:label="$t(col.label)"
:sortable="col.sortable"
:align="col.align"
:width="col.width"
>
<template slot-scope="scope">
{{getTime(scope.row[col.name])}}
</template>
</el-table-column>
<el-table-column v-else-if="col.name === 'last_status'"
:key="col.name"
:label="$t(col.label)"
align="left" :width="col.width">
<el-table-column
v-else-if="col.name === 'last_status'"
:key="col.name"
:label="$t(col.label)"
align="left"
:width="col.width"
:sortable="col.sortable"
>
<template slot-scope="scope">
<status-tag :status="scope.row.last_status"/>
</template>
</el-table-column>
<el-table-column v-else
:key="col.name"
:property="col.name"
:label="$t(col.label)"
:sortable="col.sortable"
:align="col.align || 'left'"
:width="col.width">
<el-table-column
v-else
:key="col.name"
:property="col.name"
:label="$t(col.label)"
:sortable="col.sortable"
:align="col.align || 'left'"
:width="col.width"
>
</el-table-column>
</template>
<el-table-column :label="$t('Action')" align="left" fixed="right">
@@ -300,10 +319,14 @@ export default {
keyword: '',
type: 'all'
},
sort: {
sortKey: '',
sortDirection: null
},
types: [],
columns: [
{ name: 'display_name', label: 'Name', width: '160', align: 'left' },
{ name: 'type', label: 'Spider Type', width: '120' },
{ name: 'display_name', label: 'Name', width: '160', align: 'left', sortable: true },
{ name: 'type', label: 'Spider Type', width: '120', sortable: true },
{ name: 'last_status', label: 'Last Status', width: '120' },
{ name: 'last_run_ts', label: 'Last Run', width: '140' },
// { name: 'update_ts', label: 'Update Time', width: '140' },
@@ -543,14 +566,21 @@ export default {
onRowClick (row, column, event) {
this.onView(row, event)
},
onSortChange ({ column, prop, order }) {
this.sort.sortKey = order ? prop : ''
this.sort.sortDirection = order
this.getList()
},
onClickTab (tab) {
this.filter.type = tab.name
this.getList()
},
getList () {
let params = {
pageNum: this.pagination.pageNum,
pageSize: this.pagination.pageSize,
page_num: this.pagination.pageNum,
page_size: this.pagination.pageSize,
sort_key: this.sort.sortKey,
sort_direction: this.sort.sortDirection,
keyword: this.filter.keyword,
type: this.filter.type
}