Skip to content

Commit

Permalink
vipshop#676 Console在切换域后，搜索条件恢复默认
Browse files Browse the repository at this point in the history
  • Loading branch information
gier.cai committed Feb 18, 2020
1 parent 733afa6 commit 6a7b581
Show file tree
Hide file tree
Showing 3 changed files with 68 additions and 50 deletions.
21 changes: 1 addition & 20 deletions saturn-console-web/src/components/common/filterPageList.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,13 @@
</template>
<script>
export default {
props: ['getData', 'data', 'total', 'orderBy', 'filters'],
props: ['data', 'total', 'orderBy', 'filters'],
data() {
return {
pageSize: 25,
currentPage: 1,
orderby: this.orderBy,
orderKey: undefined,
order: undefined,
pageData: [],
filtered: [],
};
Expand All @@ -35,21 +34,6 @@ export default {
paramsResult.size = this.pageSize;
paramsResult.page = this.currentPage;
paramsResult.orderKey = this.orderKey;
paramsResult.order = this.order;
if (this.filters) {
Object.entries(this.filters).forEach((item) => {
if (Array.isArray(item[1].value)) {
if (item[1].value.length > 0) {
paramsResult[item[0]] = item[1].value;
}
} else {
// eslint-disable-next-line no-lonely-if
if (item[1].value !== '' && item[1].value !== undefined) {
paramsResult[item[0]] = item[1].value;
}
}
});
}
return paramsResult;
},
totalRecords() {
Expand All @@ -74,8 +58,6 @@ export default {
getDataByParams() {
if (this.data) {
this.buildCurrentPage();
} else if (this.getData) {
this.getData(this.params);
}
},
buildCurrentPage() {
Expand Down Expand Up @@ -132,7 +114,6 @@ export default {
this.orderby = `${sort.prop}`;
}
// this.orderKey = sort.prop;
this.order = sort.order;
this.getDataByParams();
},
onCurrentChange(page) {
Expand Down
87 changes: 62 additions & 25 deletions saturn-console-web/src/pages/job_list/job_overview.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,41 +19,40 @@
</el-row>
</div>
<div class="page-container">
<FilterPageList ref="pageListRef" :get-data="getJobList" :total="total" :order-by="orderBy" :filters="filters" v-loading="tableLoading" element-loading-text="请稍等···">
<template slot-scope="scope">
<div>
<el-form :inline="true" class="table-filter">
<el-form-item label="">
<el-select style="width: 250px;" placeholder="请选择分组" multiple collapse-tags v-model="filters.groups.value" @change="scope.search">
<el-select style="width: 250px;" placeholder="请选择分组" multiple collapse-tags v-model="filters.groups" @change="getJobList">
<el-option v-for="item in groupList" :label="item" :value="item" :key="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-select style="width: 140px;" v-model="filters.status.value" @change="scope.search">
<el-select style="width: 140px;" v-model="filters.status" @change="getJobList">
<el-option label="全部状态" value=""></el-option>
<el-option v-for="item in $option.jobStatusTypes" :label="item.label" :value="item.value" :key="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-select style="width: 140px;" v-model="filters.jobType.value" @change="scope.search">
<el-select style="width: 140px;" v-model="filters.jobType" @change="getJobList">
<el-option label="全部作业类型" value=""></el-option>
<el-option v-for="item in $option.jobTypes" :label="item.label" :value="item.value" :key="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-input :placeholder="filterColumnPlaceholder" v-model.trim="filters[selectColumn].value" @keyup.enter.native="scope.search">
<el-input :placeholder="filterColumnPlaceholder" v-model.trim="filters[selectColumn]" @keyup.enter.native="getJobList">
<el-select style="width: 120px;" slot="prepend" v-model="selectColumn" @change="selectColumnChange">
<el-option v-for="item in $option.jobOverviewInputFilters" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="scope.search">查询</el-button>
<el-button type="primary" icon="el-icon-search" @click="getJobList">查询</el-button>
</el-form-item>
</el-form>
<div class="page-table" v-loading="loading" element-loading-text="请稍等···">
<div class="page-table-header">
<div class="page-table-header-title"><i class="fa fa-list"></i>作业列表
<el-button type="text" @click="scope.search"><i class="fa fa-refresh"></i></el-button>
<el-button type="text" @click="getJobList"><i class="fa fa-refresh"></i></el-button>
</div>
<div class="page-table-header-separator"></div>
<div>
Expand All @@ -70,7 +69,7 @@
<el-button @click="handleArrangeLayout()"><i class="fa fa-line-chart text-btn"></i>作业依赖图</el-button>
</div>
</div>
<el-table stripe border ref="multipleTable" @selection-change="handleSelectionChange" :data="jobList" @sort-change="scope.onSortChange" style="width: 100%">
<el-table stripe border ref="multipleTable" @selection-change="handleSelectionChange" :data="jobList" @sort-change="sortChange" style="width: 100%">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="jobName" label="作业名" sortable="custom">
<template slot-scope="scope">
Expand Down Expand Up @@ -99,8 +98,8 @@
</el-table-column>
<el-table-column prop="groups" label="分组">
<template slot-scope="scope">
<el-tag v-if="scope.row.groups === ''" type="success" size="mini">未分组</el-tag>
<el-tag v-else type="success" size="mini" style="margin-right: 3px;margin-bottom: 3px;" v-for="item in $array.strToArray(scope.row.groups)" :key="item">{{item}}</el-tag>
<el-tag v-if="scope.row.groups === ''" type="" size="mini">未分组</el-tag>
<el-tag v-else type="" size="mini" style="margin-right: 3px;margin-bottom: 3px;" v-for="item in $array.strToArray(scope.row.groups)" :key="item">{{item}}</el-tag>
</template>
</el-table-column>
<el-table-column prop="shardingTotalCount" label="分片数" width="70px"></el-table-column>
Expand Down Expand Up @@ -128,8 +127,16 @@
</el-table-column>
</el-table>
</div>
</template>
</FilterPageList>
<el-pagination
@current-change="onCurrentChange"
@size-change="onPageSize"
:current-page="currentPage"
:page-sizes="[10, 25, 50, 100, 200, '所有']"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
<div v-if="isJobInfoVisible">
<job-info-dialog :domain-name="domainName" :job-info="jobInfo" :job-info-title="jobInfoTitle" :job-info-operation="jobInfoOperation" @job-info-success="jobInfoSuccess" @close-dialog="closeDialog"></job-info-dialog>
</div>
Expand Down Expand Up @@ -159,7 +166,6 @@ export default {
data() {
return {
loading: false,
tableLoading: false,
isJobInfoVisible: false,
jobInfoTitle: '',
jobInfoOperation: '',
Expand All @@ -182,6 +188,8 @@ export default {
},
filters: this.$option.jobOverviewFilters,
jobList: [],
pageSize: 25,
currentPage: 1,
total: 0,
orderBy: '',
groupList: [],
Expand All @@ -198,6 +206,22 @@ export default {
};
},
methods: {
onCurrentChange(page) {
this.currentPage = page;
this.getJobList();
},
onPageSize(pageSize) {
if (JSON.stringify(pageSize) === 'null') {
this.pageSize = this.total;
} else {
this.pageSize = pageSize;
}
this.getJobList();
},
sortChange(sort) {
this.order = sort.order;
this.getJobList();
},
batchGroup() {
this.batchOperation('分组', (arr) => {
this.jobGroups = arr.map((obj) => {
Expand Down Expand Up @@ -246,7 +270,7 @@ export default {
},
selectColumnChange() {
this.$option.jobOverviewInputFilters.forEach((ele) => {
this.filters[ele.value].value = '';
this.filters[ele.value] = '';
});
},
toAbnormalJobPage() {
Expand Down Expand Up @@ -469,23 +493,37 @@ export default {
})
.catch(() => { this.$http.buildErrorHandler('获取作业总数失败！'); });
},
getJobList(filterParams) {
const params = JSON.parse(JSON.stringify(filterParams));
getJobList() {
const filtersParams = Object.create(null);
Object.entries(this.filters).forEach((item) => {
if (Array.isArray(item[1])) {
if (item[1].length > 0) {
filtersParams[item[0]] = item[1];
}
} else {
// eslint-disable-next-line no-lonely-if
if (item[1] !== '' && item[1] !== undefined) {
filtersParams[item[0]] = item[1];
}
}
});
const params = {
size: this.pageSize,
page: this.currentPage,
order: this.order,
...filtersParams,
};
if (params.groups && params.groups.length > 0) {
this.$set(params, 'groups', params.groups.join(','));
}
this.tableLoading = true;
this.$http.get(`/console/namespaces/${this.domainName}/jobs`, params).then((data) => {
return this.$http.get(`/console/namespaces/${this.domainName}/jobs`, params).then((data) => {
this.jobList = data.jobs;
this.total = data.totalNumber;
if (this.jobList) {
this.getShardings();
}
})
.catch(() => { this.$http.buildErrorHandler('获取作业列表请求失败！'); })
.finally(() => {
this.tableLoading = false;
});
.catch(() => { this.$http.buildErrorHandler('获取作业列表请求失败！'); });
},
getGroupList() {
return this.$http.get(`/console/namespaces/${this.domainName}/jobs/groups`).then((data) => {
Expand All @@ -495,12 +533,11 @@ export default {
},
init() {
this.loading = true;
Promise.all([this.getJobTotal(), this.getGroupList()]).then(() => {
Promise.all([this.getJobTotal(), this.getJobList(), this.getGroupList()]).then(() => {
this.loading = false;
});
},
refreshPage() {
this.$refs.pageListRef.search();
this.init();
},
},
Expand Down
10 changes: 5 additions & 5 deletions saturn-console-web/src/utils/option.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,11 +28,11 @@ export default {
return jobType === 'MSG_JOB' || jobType === 'VSHELL';
},
jobOverviewFilters: {
jobName: { value: '' },
groups: { value: [] },
status: { value: '', precise: true },
jobType: { value: '', precise: true },
description: { value: '' },
jobName: '',
groups: [],
status: '',
jobType: '',
description: '',
},
jobOverviewInputFilters: [{
label: '作业名',
Expand Down

0 comments on commit 6a7b581

Please sign in to comment.