updated SiteList

This commit is contained in:
Marvin Zhang
2019-05-22 22:33:43 +08:00
parent 967981d3e3
commit f63b58906e
5 changed files with 158 additions and 52 deletions

View File

@@ -137,6 +137,7 @@ export default {
'Domain': '域名',
'Category': '类别',
'Select': '请选择',
'Select Main Category': '请选择主类别',
'Select Category': '请选择类别',
'Spider Count': '爬虫数',
'Robots Protocol': 'Robots 协议',

View File

@@ -1,10 +1,18 @@
import request from '../../api/request'
const state = {
// site list
siteList: [],
// main category list
mainCategoryList: [],
// (sub) category list
categoryList: [],
// filter
filter: {
mainCategory: undefined,
category: undefined
},
keyword: '',
@@ -32,6 +40,12 @@ const mutations = {
},
SET_TOTAL_COUNT (state, value) {
state.totalCount = value
},
SET_MAIN_CATEGORY_LIST (state, value) {
state.mainCategoryList = value
},
SET_CATEGORY_LIST (state, value) {
state.categoryList = value
}
}
@@ -48,6 +62,7 @@ const actions = {
page_size: state.pageSize,
keyword: state.keyword || undefined,
filter: {
main_category: state.filter.mainCategory || undefined,
category: state.filter.category || undefined
}
})
@@ -55,6 +70,20 @@ const actions = {
commit('SET_SITE_LIST', response.data.items)
commit('SET_TOTAL_COUNT', response.data.total_count)
})
},
getMainCategoryList ({ state, commit }) {
return request.get('/sites/get/get_main_category_list')
.then(response => {
commit('SET_MAIN_CATEGORY_LIST', response.data.items)
})
},
getCategoryList ({ state, commit }) {
return request.get('/sites/get/get_category_list', {
'main_category': state.filter.mainCategory || undefined
})
.then(response => {
commit('SET_CATEGORY_LIST', response.data.items)
})
}
}

View File

@@ -26,7 +26,10 @@ const state = {
dailyStats: [],
// spider node stats
nodeStats: []
nodeStats: [],
// filters
filterSite: ''
}
const getters = {}
@@ -55,12 +58,20 @@ const mutations = {
},
SET_NODE_STATS (state, value) {
state.nodeStats = value
},
SET_FILTER_SITE (state, value) {
state.filterSite = value
}
}
const actions = {
getSpiderList ({ state, commit }) {
return request.get('/spiders', {})
let params = {}
if (state.filterSite) {
params.site = state.filterSite
}
console.log(params)
return request.get('/spiders', params)
.then(response => {
commit('SET_SPIDER_LIST', response.data.items)
})

View File

@@ -7,11 +7,15 @@
class="filter-search"
v-model="keyword">
</el-input>
<el-select v-model="filter.mainCategory" class="filter-category" :placeholder="$t('Select Main Category')"
clearable>
<el-option v-for="op in mainCategoryList" :key="op" :value="op" :label="op"></el-option>
</el-select>
<el-select v-model="filter.category" class="filter-category" :placeholder="$t('Select Category')" clearable>
<el-option v-for="op in categoryList" :key="op" :value="op" :label="op"></el-option>
</el-select>
<el-button type="success"
icon="el-icon-refresh"
icon="el-icon-search"
class="btn refresh"
@click="onSearch">
{{$t('Search')}}
@@ -25,24 +29,24 @@
:header-cell-style="{background:'rgb(48, 65, 86)',color:'white'}"
border>
<template v-for="col in columns">
<el-table-column v-if="col.name === 'category'"
:key="col.name"
:label="$t(col.label)"
:width="col.width"
:align="col.align">
<template slot-scope="scope">
<el-select v-model="scope.row[col.name]"
:placeholder="$t('Select')"
@change="onRowChange(scope.row)">
<el-option v-for="op in categoryList"
:key="op"
:value="op"
:label="op">
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column v-else-if="col.name === 'domain'"
<!--<el-table-column v-if="col.name === 'category'"-->
<!--:key="col.name"-->
<!--:label="$t(col.label)"-->
<!--:width="col.width"-->
<!--:align="col.align">-->
<!--<template slot-scope="scope">-->
<!--<el-select v-model="scope.row[col.name]"-->
<!--:placeholder="$t('Select')"-->
<!--@change="onRowChange(scope.row)">-->
<!--<el-option v-for="op in categoryList"-->
<!--:key="op"-->
<!--:value="op"-->
<!--:label="op">-->
<!--</el-option>-->
<!--</el-select>-->
<!--</template>-->
<!--</el-table-column>-->
<el-table-column v-if="col.name === 'domain'"
:key="col.name"
:label="$t(col.label)"
:width="col.width"
@@ -150,25 +154,26 @@ export default {
name: 'SiteList',
data () {
return {
categoryList: [
'新闻',
'搜索引擎',
'综合',
'金融',
'购物',
'社交',
'视频',
'音乐',
'资讯',
'政企官网',
'其他'
],
// categoryList: [
// '新闻',
// '搜索引擎',
// '综合',
// '金融',
// '购物',
// '社交',
// '视频',
// '音乐',
// '资讯',
// '政企官网',
// '其他'
// ],
columns: [
{ name: 'rank', label: 'Rank', align: 'center', width: '80' },
{ name: 'name', label: 'Name', align: 'left', width: 'auto' },
{ name: 'domain', label: 'Domain', align: 'left', width: '150' },
// { name: 'description', label: 'Description', align: 'left', width: 'auto' },
{ name: 'category', label: 'Category', align: 'center', width: '180' },
{ name: 'main_category', label: 'Main Category', align: 'center', width: '100' },
{ name: 'category', label: 'Category', align: 'center', width: '100' },
{ name: 'spider_count', label: 'Spider Count', align: 'center', width: '60' },
{ name: 'has_robots', label: 'Robots Protocol', align: 'center', width: '65' },
{ name: 'home_response_time', label: 'Home Page Response Time (sec)', align: 'right', width: '80' },
@@ -180,6 +185,8 @@ export default {
...mapState('site', [
'filter',
'siteList',
'mainCategoryList',
'categoryList',
'totalCount'
]),
keyword: {
@@ -205,6 +212,18 @@ export default {
set (value) {
this.$store.commit('site/SET_PAGE_SIZE', value)
}
},
mainCategory () {
return this.filter.mainCategory
}
},
watch: {
mainCategory () {
// reset category
this.filter.category = undefined
// get category list
this.$store.dispatch('site/getCategoryList')
}
},
methods: {
@@ -248,7 +267,7 @@ export default {
cls.push('status')
if (row.home_http_status === undefined) {
cls.push('info')
} else if (row.home_http_status === 200) {
} else if (row.home_http_status >= 200 && row.home_http_status < 300) {
cls.push('success')
} else {
cls.push('danger')
@@ -272,6 +291,10 @@ export default {
},
created () {
this.$store.dispatch('site/getSiteList')
this.$store.dispatch('site/getMainCategoryList')
this.$store.dispatch('site/getCategoryList')
}
}
</script>

View File

@@ -29,12 +29,20 @@
<!--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>
<!--<el-input prefix-icon="el-icon-search"-->
<!--:placeholder="$t('Search')"-->
<!--class="filter-search"-->
<!--v-model="filter.keyword"-->
<!--@change="onSearch">-->
<!--</el-input>-->
<div class="left">
<el-autocomplete v-model="filterSite"
:placeholder="$t('Site')"
clearable
:fetch-suggestions="fetchSiteSuggestions"
@select="onSiteSelect">
</el-autocomplete>
</div>
<div class="right">
<el-button type="primary" icon="fa fa-cloud" @click="onDeployAll">
{{$t('Deploy All')}}
@@ -179,16 +187,31 @@ export default {
'spiderForm'
]),
filteredTableData () {
return this.spiderList.filter(d => {
if (!this.filter.keyword) return true
for (let i = 0; i < this.columns.length; i++) {
const colName = this.columns[i].name
if (d[colName] && d[colName].toLowerCase().indexOf(this.filter.keyword.toLowerCase()) > -1) {
return true
return this.spiderList
.filter(d => {
if (this.filterSite) {
return d.site === this.filterSite
}
}
return false
})
return true
})
// .filter(d => {
// if (!this.filter.keyword) return true
// for (let i = 0; i < this.columns.length; i++) {
// const colName = this.columns[i].name
// if (d[colName] && d[colName].toLowerCase().indexOf(this.filter.keyword.toLowerCase()) > -1) {
// return true
// }
// }
// return false
// })
},
filterSite: {
get () {
return this.$store.state.spider.filterSite
},
set (value) {
this.$store.commit('spider/SET_FILTER_SITE', value)
}
}
},
methods: {
@@ -324,13 +347,32 @@ export default {
return false
}
return true
},
fetchSiteSuggestions (keyword, callback) {
this.$request.get('/sites', {
keyword: keyword,
page_num: 1,
page_size: 100
}).then(response => {
const data = response.data.items.map(d => {
d.value = `${d.name} | ${d.domain}`
return d
})
callback(data)
})
},
onSiteSelect (item) {
this.$store.commit('spider/SET_FILTER_SITE', item._id)
}
},
created () {
// take site from params to filter
this.$store.commit('spider/SET_FILTER_SITE', this.$route.params.domain)
// fetch spider list
this.$store.dispatch('spider/getSpiderList')
},
mounted () {
console.log(this.$route.params.domain)
}
}
</script>