Skip to content

Commit

Permalink
feat: 多条件查询 TencentBlueKing#73
Browse files Browse the repository at this point in the history
  • Loading branch information
v_yutyi committed Jan 18, 2022
1 parent 33f2fdb commit e27124f
Show file tree
Hide file tree
Showing 4 changed files with 86 additions and 28 deletions.
2 changes: 1 addition & 1 deletion src/pages/src/language/lang/en.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -388,5 +388,5 @@ export default {
请输入数字: 'Please enter a number',
蓝鲸用户管理字段: 'Blue Whale User management field',
对应: 'The corresponding',
目录字段: 'Category field'
目录字段: 'Category field',
};
4 changes: 4 additions & 0 deletions src/pages/src/store/modules/organization.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -118,5 +118,9 @@ export default {
const { id } = params;
return http.post(`/api/v2/profiles/${id}/restoration/`);
},
// 多条件查询
getMultiConditionQuery(context, params, config = {}) {
return http.get(`api/v3/profiles/?${params}`);
},
},
};
106 changes: 80 additions & 26 deletions src/pages/src/views/organization/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -149,17 +149,14 @@
</div>
<div class="table-actions-right-container">
<!-- 用户搜索框 -->
<bk-input
v-model="tableSearchKey"
<bk-search-select
class="king-input-search"
style="width: 280px;margin-right: 20px;"
:placeholder="$t('输入用户名/中文名，按Enter搜索')"
:clearable="true"
:left-icon="'bk-icon icon-search'"
@clear="handleClear"
@left-icon-click="handleTableSearch"
@enter="handleTableSearch">
</bk-input>
:data="searchFilterList"
:show-condition="false"
v-model="tableSearchKey"
@change="handleTableSearch" />
<!-- 设置列表字段 -->
<div class="set-table-field" v-bk-tooltips.top="$t('设置列表字段')" @click="setFieldList">
<i class="icon icon-user-cog"></i>
Expand All @@ -170,17 +167,14 @@
<template v-else>
<div class="table-actions-left-container">
<!-- 用户搜索框 -->
<bk-input
v-model="tableSearchKey"
<bk-search-select
class="king-input-search"
style="width: 360px;margin-right: 20px;"
style="width: 280px;margin-right: 20px;"
:placeholder="$t('输入用户名/中文名，按Enter搜索')"
:clearable="true"
:left-icon="'bk-icon icon-search'"
@clear="handleClear"
@left-icon-click="handleTableSearch"
@enter="handleTableSearch">
</bk-input>
:data="searchFilterList"
:show-condition="false"
v-model="tableSearchKey"
@change="handleTableSearch" />
<!-- 仅显示本级组织成员 -->
<p class="filter-current">
<bk-checkbox
Expand Down Expand Up @@ -434,12 +428,40 @@ export default {
isShow: false,
tags: [],
},
tableSearchKey: '',
tableSearchKey: [],
// 记录搜索过的关键字，blur 的时候如果和当前关键字不一样就刷新表格
tableSearchedKey: '',
tableSearchedKey: [],
isDropdownShowAdd: false,
isDropdownShowMore: false,
setDepartmentTop: (window.document.body.offsetHeight - 519) / 2,
tableData: [],
searchDataList: [
{ name: '用户名', id: 'username', key: 'username' },
{ name: '全名', id: 'display_name', key: 'display_name' },
{ name: '手机号', id: 'telephone', key: 'telephone' },
{ name: '邮箱', id: 'email', key: 'email' },
{ name: '账户状态', id: 'status', key: 'status', children: [
{ name: '正常', id: 'NORMAL', status: 'NORMAL' },
{ name: '被禁用', id: 'DISABLED', status: 'DISABLED' },
{ name: '已删除', id: 'DELETED', status: 'DELETED' },
{ name: '已冻结', id: 'LOCKED', status: 'LOCKED' },
] },
{ name: '在职状态', id: 'staff_status', key: 'staff_status', children: [
{ name: '在职', id: 'IN', staff_status: 'IN' },
{ name: '离职', id: 'OUT', staff_status: 'OUT' },
] },
{ name: '最近登录', id: 'last_login_time', children: [
{ name: '1个月', id: '1m' },
{ name: '2个月', id: '2m' },
{ name: '3个月', id: '3m' },
] },
{ name: '最近未登录', id: 'update_time', children: [
{ name: '1个月', id: '1m' },
{ name: '2个月', id: '2m' },
{ name: '3个月', id: '3m' },
] },
],
searchFilterList: [],
};
},
computed: {
Expand All @@ -463,6 +485,21 @@ export default {
this.currentCategoryId = val.type ? val.id : this.findCategoryId(val);
this.currentCategoryType = val.type ? val.type : this.findCategoryType(val);
},
'tableSearchKey'(val) {
this.searchFilterList = this.searchDataList;
if (val.length) {
val.filter((item) => {
if (!item.key) {
return;
}
this.searchFilterList = this.searchFilterList.filter((k) => {
if (!item.key.includes(k.key)) {
return k;
}
});
});
}
},
},
async mounted() {
// 初始化tree、用户信息title
Expand Down Expand Up @@ -697,15 +734,32 @@ export default {
},

handleClear() {
if (this.tableSearchedKey !== '') {
if (this.tableSearchedKey !== []) {
this.handleTableSearch();
}
},
handleTableSearch() {
if (!this.basicLoading) {
this.paginationConfig.current = 1;
this.getTableData();
}
// 搜索table
handleTableSearch(list) {
const valueList = [];
list.forEach((item) => {
if (item.key) {
const key = item.key;
const value = item.values[0].id;
valueList.push(`${key}=${value}`);
}
});
const params = valueList.join('&');
this.$store.dispatch('organization/getMultiConditionQuery', params).then((res) => {
if (res.result) {
this.filterUserData(res.data.results);
}
})
.catch((e) => {
console.warn(e);
})
.finally(() => {
this.clickSecond = false;
});
},
// 搜索结果： 1.展开tree 找到对应的node 加载用户信息列表
async handleSearchTree(searchResult) {
Expand Down Expand Up @@ -1208,7 +1262,7 @@ export default {
this.closeMenu(item);
});
if (this.tableSearchKey) {
this.tableSearchKey = '';
this.tableSearchKey = [];
}
this.currentParam.item = item;
this.$set(item, 'showBackground', true);
Expand Down
2 changes: 1 addition & 1 deletion src/pages/src/views/organization/table/UserTable.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -243,7 +243,7 @@ export default {
.join(';');
},
getLeaderString(leader) {
return leader.map((item) => {
return leader && leader.map((item) => {
return item.username;
}).join(';');
},
Expand Down

0 comments on commit e27124f

Please sign in to comment.