!33 czh-20260612-增加新的部门选人组件，支持多选，默认跳转到当前用户所在的部门
Merge pull request !33 from 陈志浩/feature/deptUserSelect
This commit is contained in:
陈志浩
@@ -0,0 +1,158 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-row class="j-select-row" type="flex" :gutter="8">
|
||||
<a-col class="left">
|
||||
<a-select
|
||||
:value="selectDisplayValue"
|
||||
:placeholder="'请选择人员'"
|
||||
:disabled="disabled"
|
||||
:open="false"
|
||||
mode="multiple"
|
||||
:maxTagCount="3"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</a-col>
|
||||
<a-col class="right">
|
||||
<a-button type="primary" @click="openModal()" :disabled="disabled">选择</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-modal
|
||||
:width="1200"
|
||||
title="选择人员"
|
||||
v-model:open="visible"
|
||||
centered
|
||||
:confirm-loading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
:mask-closable="false"
|
||||
>
|
||||
<SzDeptUserSelect
|
||||
:checkedUser="tempSelectedUsers"
|
||||
@update:checkedUser="handleTempUsersChange"
|
||||
:secLevel="secLevel"
|
||||
:departId="innerDepartId"
|
||||
:role="role"
|
||||
:isSpecial="isSpecial"
|
||||
:multi="multi"
|
||||
/>
|
||||
<template #footer>
|
||||
<a-button @click="handleCancel">取消</a-button>
|
||||
<a-button type="primary" :loading="confirmLoading" @click="handleOk">确定</a-button>
|
||||
</template>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, watch } from 'vue';
|
||||
import { defHttp } from '/@/utils/http/axios';
|
||||
import { useUserStore } from '/@/store/modules/user';
|
||||
import SzDeptUserSelect from './SzDeptUserSelect.vue';
|
||||
import SzDeptUserSelectedList from './SzDeptUserSelectedList.vue';
|
||||
import type { UserItem } from './types';
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
value?: string;
|
||||
departId?: string;
|
||||
secLevel?: any;
|
||||
role?: string | number;
|
||||
isSpecial?: number;
|
||||
disabled?: boolean;
|
||||
multi?: boolean;
|
||||
}>(),
|
||||
{
|
||||
value: '',
|
||||
departId: '',
|
||||
secLevel: 0,
|
||||
role: 1,
|
||||
isSpecial: 0,
|
||||
disabled: false,
|
||||
multi: true,
|
||||
}
|
||||
);
|
||||
|
||||
const emit = defineEmits(['update:value', 'change']);
|
||||
|
||||
const userStore = useUserStore();
|
||||
const visible = ref(false);
|
||||
const confirmLoading = ref(false);
|
||||
const innerSelectedUsers = ref<UserItem[]>([]);
|
||||
const tempSelectedUsers = ref<UserItem[]>([]);
|
||||
|
||||
const innerDepartId = computed(() => {
|
||||
return props.departId || userStore.getUserInfo?.orgCode || '';
|
||||
});
|
||||
|
||||
const selectDisplayValue = computed(() => {
|
||||
return innerSelectedUsers.value.map((u) => u.realname);
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.value,
|
||||
(newVal) => {
|
||||
if (newVal) {
|
||||
loadUsersByUsernames(newVal);
|
||||
} else {
|
||||
innerSelectedUsers.value = [];
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
async function loadUsersByUsernames(usernames: string) {
|
||||
try {
|
||||
const res: any = await defHttp.get({
|
||||
url: '/sys/user/queryUserComponentData',
|
||||
params: { username: usernames, isMultiTranslate: 'true', pageNo: 1, pageSize: 9999 },
|
||||
});
|
||||
innerSelectedUsers.value = [...(res.records || res)];
|
||||
} catch {
|
||||
innerSelectedUsers.value = [];
|
||||
}
|
||||
}
|
||||
|
||||
function openModal() {
|
||||
if (props.disabled) return;
|
||||
tempSelectedUsers.value = [...innerSelectedUsers.value];
|
||||
visible.value = true;
|
||||
}
|
||||
|
||||
function handleTempUsersChange(users: UserItem[]) {
|
||||
tempSelectedUsers.value = [...users];
|
||||
}
|
||||
|
||||
function clearTemp() {
|
||||
tempSelectedUsers.value = [];
|
||||
}
|
||||
|
||||
function handleOk() {
|
||||
innerSelectedUsers.value = [...tempSelectedUsers.value];
|
||||
const usernames = innerSelectedUsers.value.map((u) => u.username).join(',');
|
||||
emit('update:value', usernames);
|
||||
emit('change', usernames);
|
||||
visible.value = false;
|
||||
}
|
||||
|
||||
function handleCancel() {
|
||||
visible.value = false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.j-select-row {
|
||||
@width: 82px;
|
||||
|
||||
.left {
|
||||
width: calc(100% - @width - 8px);
|
||||
}
|
||||
|
||||
.right {
|
||||
width: @width;
|
||||
}
|
||||
|
||||
:deep(.ant-select-search__field) {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,389 @@
|
||||
<template>
|
||||
<a-row :gutter="0" style="height: 556px">
|
||||
<!-- 部门树 -->
|
||||
<a-col :span="6" style="height: 100%; border-right: 1px solid #e8e8e8; padding: 0 12px; display: flex; flex-direction: column">
|
||||
<a-input-search v-model:value="searchDepartValue" style="margin-bottom: 12px; margin-top: 0" placeholder="请输入部门名称" />
|
||||
<a-directory-tree
|
||||
selectable
|
||||
v-model:selectedKeys="selectedDepIds"
|
||||
:check-strictly="true"
|
||||
:dropdown-style="{ maxHeight: '200px', overflow: 'auto' }"
|
||||
:tree-data="filterDepartTreeData"
|
||||
:expand-action="false"
|
||||
v-model:expandedKeys="expandedKeys"
|
||||
@select="onDepSelect"
|
||||
style="height: 500px; overflow: auto"
|
||||
/>
|
||||
</a-col>
|
||||
<!-- 人员表格 -->
|
||||
<a-col :span="10" style="height: 100%; padding: 0 12px; border-right: 1px solid #e8e8e8; display: flex; flex-direction: column">
|
||||
<div style="margin-bottom: 12px; margin-top: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap">
|
||||
<a-input-search
|
||||
style="flex: 1; min-width: 120px"
|
||||
placeholder="输入姓名"
|
||||
v-model:value="queryParam.realname"
|
||||
@search="onSearch"
|
||||
/>
|
||||
<a-button @click="searchReset(1)">重置</a-button>
|
||||
<a-button type="primary" @click="selectAll">全选</a-button>
|
||||
<a-button type="danger" @click="unselectAll">清空</a-button>
|
||||
</div>
|
||||
<div style="flex: 1; min-height: 0; overflow: auto">
|
||||
<a-empty v-if="selectedDepIds.length === 0" description="请先选择部门！" />
|
||||
<a-table
|
||||
v-else
|
||||
:scroll="{ y: 430 }"
|
||||
size="middle"
|
||||
row-key="id"
|
||||
:columns="columns"
|
||||
:data-source="dataSource"
|
||||
:pagination="ipagination"
|
||||
:row-selection="{ selectedRowKeys: selectedRowKeys, onSelectAll: onSelectAll, onSelect: onSelect, type: getType }"
|
||||
:loading="loading"
|
||||
@change="handleTableChange"
|
||||
:custom-row="customRow"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
<!-- 已选列表 -->
|
||||
<a-col :span="8" style="height: 100%; padding: 0 12px; display: flex; flex-direction: column">
|
||||
<div style="margin-bottom: 12px; margin-top: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap">
|
||||
<span style="font-weight: 500">已选 ({{ selectedRows.length }})</span>
|
||||
<a-button type="danger" @click="clearSelected">清空</a-button>
|
||||
</div>
|
||||
<div style="flex: 1; overflow: auto; min-height: 0">
|
||||
<SzDeptUserSelectedList
|
||||
:selectedUsers="selectedRows"
|
||||
@update:selectedUsers="(users) => emit('update:checkedUser', users)"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, computed, watch, onMounted } from 'vue';
|
||||
import { queryTreeList } from '/@/api/common/api';
|
||||
import { defHttp } from '/@/utils/http/axios';
|
||||
import { filterObj } from '/@/utils/common/compUtils';
|
||||
import { deleteIfExist, pushIfNotExist, filterDepartTree, recurTree } from './types';
|
||||
import type { UserItem, DepartTreeNode } from './types';
|
||||
import SzDeptUserSelectedList from './SzDeptUserSelectedList.vue';
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
secLevel: any;
|
||||
checkedUser?: UserItem[];
|
||||
departId: string;
|
||||
role: string | number;
|
||||
isSpecial?: number;
|
||||
multi?: boolean;
|
||||
}>(),
|
||||
{
|
||||
checkedUser: () => [],
|
||||
isSpecial: 0,
|
||||
multi: true,
|
||||
}
|
||||
);
|
||||
|
||||
const emit = defineEmits(['update:checkedUser']);
|
||||
|
||||
const searchDepartValue = ref('');
|
||||
const queryParam = reactive<Record<string, any>>({ realname: '' });
|
||||
const dataSource = ref<UserItem[]>([]);
|
||||
const allUserList = ref<UserItem[]>([]);
|
||||
const selectedDepIds = ref<string[]>([]);
|
||||
const selectedRows = ref<UserItem[]>([]);
|
||||
const departTree = ref<DepartTreeNode[]>([]);
|
||||
const fullDepartTree = ref<DepartTreeNode[]>([]);
|
||||
const loading = ref(false);
|
||||
const expandedKeys = ref<string[]>([]);
|
||||
|
||||
function findDepartIdByOrgCode(tree: DepartTreeNode[], orgCode: string): string | null {
|
||||
for (const node of tree) {
|
||||
if (node.orgCode === orgCode) {
|
||||
return node.id;
|
||||
}
|
||||
if (node.children && node.children.length > 0) {
|
||||
const found = findDepartIdByOrgCode(node.children, orgCode);
|
||||
if (found) return found;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function resolveDepartId(departIdOrOrgCode: string): string {
|
||||
if (!departIdOrOrgCode) return departIdOrOrgCode;
|
||||
const uuidPattern = /^[0-9a-f]{32}$/i;
|
||||
if (uuidPattern.test(departIdOrOrgCode.replace(/-/g, ''))) return departIdOrOrgCode;
|
||||
const realId = findDepartIdByOrgCode(fullDepartTree.value, departIdOrOrgCode);
|
||||
if (realId) return realId;
|
||||
return departIdOrOrgCode;
|
||||
}
|
||||
|
||||
const columns = [
|
||||
{ title: '用户姓名', align: 'center' as const, dataIndex: 'realname' },
|
||||
{ title: '人员密级', align: 'center' as const, dataIndex: 'userSecurityLevel_dictText' },
|
||||
];
|
||||
|
||||
const ipagination = reactive({
|
||||
current: 1,
|
||||
pageSize: 7,
|
||||
showQuickJumper: true,
|
||||
total: 0,
|
||||
});
|
||||
|
||||
const isorter = reactive({
|
||||
column: 'createTime',
|
||||
order: 'desc',
|
||||
});
|
||||
|
||||
const url = {
|
||||
pageUserDepart: '/sys/user/queryUserComponentData',
|
||||
listUserDepart: '/sys/user/queryUserComponentData',
|
||||
};
|
||||
|
||||
const getType = computed(() => (props.multi ? 'checkbox' : 'radio'));
|
||||
const selectedRowKeys = computed(() => selectedRows.value.map((item) => item.id));
|
||||
|
||||
const filterDepartTreeData = computed(() => {
|
||||
if (!searchDepartValue.value) return departTree.value;
|
||||
return filterDepartTree(departTree.value, searchDepartValue.value);
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.checkedUser,
|
||||
() => {
|
||||
selectedRows.value = [...(props.checkedUser || [])];
|
||||
}
|
||||
);
|
||||
|
||||
watch(
|
||||
() => props.departId,
|
||||
() => {
|
||||
queryDepartTree();
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
watch(
|
||||
() => props.role,
|
||||
() => {
|
||||
queryDepartTree();
|
||||
}
|
||||
);
|
||||
|
||||
watch(
|
||||
() => props.secLevel,
|
||||
() => {
|
||||
if (selectedDepIds.value.length > 0) {
|
||||
getAllUsersInDepart();
|
||||
loadData();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
function initData() {
|
||||
const depId = props.departId;
|
||||
if (depId) {
|
||||
const resolvedId = resolveDepartId(depId);
|
||||
selectedDepIds.value = [resolvedId];
|
||||
getAllUsersInDepart();
|
||||
loadData();
|
||||
}
|
||||
if (props.checkedUser) {
|
||||
selectedRows.value = [...props.checkedUser];
|
||||
}
|
||||
}
|
||||
|
||||
async function loadData(arg?: number) {
|
||||
if (selectedDepIds.value.length > 0) {
|
||||
if (arg === 1) {
|
||||
ipagination.current = 1;
|
||||
}
|
||||
const params = getQueryParams();
|
||||
loading.value = true;
|
||||
try {
|
||||
const res: any = await defHttp.get({ url: url.pageUserDepart, params });
|
||||
dataSource.value = (res.records || []).filter((user: UserItem) => {
|
||||
const userLevel = user.userSecurityLevel;
|
||||
const docLevel = props.secLevel;
|
||||
return userLevel !== null && userLevel > docLevel;
|
||||
});
|
||||
ipagination.total = res.total;
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function getQueryParams() {
|
||||
const param = Object.assign({}, queryParam, isorter);
|
||||
param.searchSecurityLevel = props.secLevel;
|
||||
param.field = getQueryField();
|
||||
param.pageNo = ipagination.current;
|
||||
param.pageSize = ipagination.pageSize;
|
||||
param.departId = selectedDepIds.value.join(',');
|
||||
param.isSpecial = props.isSpecial;
|
||||
return filterObj(param);
|
||||
}
|
||||
|
||||
function getQueryField() {
|
||||
let str = 'id,';
|
||||
for (let a = 0; a < columns.length; a++) {
|
||||
str += ',' + columns[a].dataIndex;
|
||||
}
|
||||
return str;
|
||||
}
|
||||
|
||||
function searchReset(num?: number) {
|
||||
if (num !== 0) {
|
||||
queryParam.realname = '';
|
||||
loadData(1);
|
||||
}
|
||||
}
|
||||
|
||||
function handleTableChange(pagination: any, _filters: any, sorter: any) {
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
isorter.column = sorter.field;
|
||||
isorter.order = sorter.order === 'ascend' ? 'asc' : 'desc';
|
||||
}
|
||||
Object.assign(ipagination, pagination);
|
||||
loadData();
|
||||
}
|
||||
|
||||
async function getAllUsersInDepart() {
|
||||
if (selectedDepIds.value.length === 0 || (selectedDepIds.value.length === 1 && !selectedDepIds.value[0])) {
|
||||
allUserList.value = [];
|
||||
return;
|
||||
}
|
||||
const param = Object.assign({}, queryParam);
|
||||
param.searchSecurityLevel = props.secLevel;
|
||||
param.field = getQueryField();
|
||||
param.departId = selectedDepIds.value.join(',');
|
||||
param.isSpecial = props.isSpecial;
|
||||
param.pageNo = 1;
|
||||
param.pageSize = 9999;
|
||||
const filteredParam = filterObj(param);
|
||||
try {
|
||||
const res: any = await defHttp.get({ url: url.listUserDepart, params: filteredParam });
|
||||
allUserList.value = (res.records || res).filter((user: UserItem) => {
|
||||
const userLevel = user.userSecurityLevel;
|
||||
const docLevel = props.secLevel;
|
||||
return userLevel !== null && userLevel > docLevel;
|
||||
});
|
||||
} catch (e) {
|
||||
allUserList.value = [];
|
||||
}
|
||||
}
|
||||
|
||||
function onDepSelect(keys: string[]) {
|
||||
if (keys.length > 0 && keys[0] != null) {
|
||||
selectedDepIds.value = [keys[0]];
|
||||
loadData(1);
|
||||
getAllUsersInDepart();
|
||||
}
|
||||
}
|
||||
|
||||
function onSelect(record: UserItem, selected: boolean) {
|
||||
if (selected) {
|
||||
pushIfNotExist(selectedRows.value, record, 'id');
|
||||
} else {
|
||||
deleteIfExist(selectedRows.value, record, 'id');
|
||||
}
|
||||
selectedRows.value.sort((a, b) => (a.sortno || 0) - (b.sortno || 0));
|
||||
emit('update:checkedUser', selectedRows.value);
|
||||
}
|
||||
|
||||
function onSelectAll(selected: boolean, selectedRecords: UserItem[], changeRecords: UserItem[]) {
|
||||
if (selected) {
|
||||
selectedRecords.forEach((item) => {
|
||||
pushIfNotExist(selectedRows.value, item, 'id');
|
||||
});
|
||||
} else {
|
||||
const rowsToRemove = changeRecords && changeRecords.length > 0 ? changeRecords : dataSource.value;
|
||||
rowsToRemove.forEach((item) => {
|
||||
deleteIfExist(selectedRows.value, item, 'id');
|
||||
});
|
||||
}
|
||||
selectedRows.value.sort((a, b) => (a.sortno || 0) - (b.sortno || 0));
|
||||
emit('update:checkedUser', selectedRows.value);
|
||||
}
|
||||
|
||||
function onSearch() {
|
||||
loadData(1);
|
||||
}
|
||||
|
||||
async function queryDepartTree() {
|
||||
expandedKeys.value = [];
|
||||
departTree.value = [];
|
||||
try {
|
||||
const res: any = await queryTreeList();
|
||||
const arr = [...res];
|
||||
fullDepartTree.value = [...arr];
|
||||
|
||||
if (props.role === 1 || props.role === '1') {
|
||||
departTree.value = [...arr];
|
||||
} else {
|
||||
const resolvedDepartId = resolveDepartId(props.departId);
|
||||
const tree = recurTree(arr, (node) => {
|
||||
if (node.id === resolvedDepartId) return [node];
|
||||
return [];
|
||||
});
|
||||
departTree.value = [...tree];
|
||||
}
|
||||
departTree.value.forEach((item) => {
|
||||
expandedKeys.value.push(item.key);
|
||||
});
|
||||
await initData();
|
||||
} catch (e) {
|
||||
console.error('queryDepartTree error:', e);
|
||||
}
|
||||
}
|
||||
|
||||
function selectAll() {
|
||||
allUserList.value.forEach((item) => {
|
||||
pushIfNotExist(selectedRows.value, item, 'id');
|
||||
});
|
||||
selectedRows.value.sort((a, b) => (a.sortno || 0) - (b.sortno || 0));
|
||||
emit('update:checkedUser', selectedRows.value);
|
||||
}
|
||||
|
||||
function unselectAll() {
|
||||
allUserList.value.forEach((item) => {
|
||||
deleteIfExist(selectedRows.value, item, 'id');
|
||||
});
|
||||
emit('update:checkedUser', selectedRows.value);
|
||||
}
|
||||
|
||||
function clearSelected() {
|
||||
selectedRows.value = [];
|
||||
emit('update:checkedUser', selectedRows.value);
|
||||
}
|
||||
|
||||
function customRow(record: UserItem) {
|
||||
return {
|
||||
onClick: (_event: Event) => {
|
||||
const clickRowKey = record.id;
|
||||
if (selectedRowKeys.value.includes(clickRowKey)) {
|
||||
deleteIfExist(selectedRows.value, record, 'id');
|
||||
} else {
|
||||
pushIfNotExist(selectedRows.value, record, 'id');
|
||||
}
|
||||
selectedRows.value.sort((a, b) => (a.sortno || 0) - (b.sortno || 0));
|
||||
emit('update:checkedUser', selectedRows.value);
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await queryDepartTree();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<div style="margin-left: 1px">
|
||||
<a-empty v-if="selectedUsers.length === 0" />
|
||||
<div v-else>
|
||||
<a-button-group
|
||||
v-for="(user, index) in selectedUsers"
|
||||
:key="'user-' + user.id + '-' + index"
|
||||
class="small-space"
|
||||
>
|
||||
<a-button class="btn-green" size="small">
|
||||
<UserOutlined />
|
||||
{{ user.realname }}
|
||||
</a-button>
|
||||
<a-button v-if="!disabled" class="btn-green" size="small" @click="deleteUser(index)">
|
||||
<CloseOutlined />
|
||||
</a-button>
|
||||
</a-button-group>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { UserOutlined, CloseOutlined } from '@ant-design/icons-vue';
|
||||
import type { UserItem } from './types';
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
disabled?: boolean;
|
||||
selectedUsers: UserItem[];
|
||||
}>(),
|
||||
{
|
||||
disabled: false,
|
||||
selectedUsers: () => [],
|
||||
}
|
||||
);
|
||||
|
||||
const emit = defineEmits(['update:selectedUsers']);
|
||||
|
||||
function deleteUser(index: number) {
|
||||
const arr = [...props.selectedUsers];
|
||||
arr.splice(index, 1);
|
||||
emit('update:selectedUsers', arr);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.small-space {
|
||||
margin: 2px;
|
||||
}
|
||||
.btn-green {
|
||||
background-color: #52c41a;
|
||||
color: #fff;
|
||||
border-color: #52c41a;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,68 @@
|
||||
export interface UserItem {
|
||||
id: string;
|
||||
username: string;
|
||||
realname: string;
|
||||
orgCodeTxt?: string;
|
||||
userSecurityLevel?: number;
|
||||
userSecurityLevel_dictText?: string;
|
||||
sex_dictText?: string;
|
||||
sortno?: number;
|
||||
departId?: string;
|
||||
departName?: string;
|
||||
}
|
||||
|
||||
export interface DepartTreeNode {
|
||||
id: string;
|
||||
key: string;
|
||||
value: string;
|
||||
title: string;
|
||||
isLeaf?: boolean;
|
||||
departType?: string | number;
|
||||
distributable?: number;
|
||||
disableCheckbox?: boolean;
|
||||
children?: DepartTreeNode[];
|
||||
description?: string;
|
||||
parentId?: string;
|
||||
orgCode?: string;
|
||||
}
|
||||
|
||||
export function deleteIfExist<T extends Record<string, any>>(array: T[], value: T, key: string): void {
|
||||
const idx = array.findIndex((item) => item[key] === value[key]);
|
||||
if (idx >= 0) {
|
||||
array.splice(idx, 1);
|
||||
}
|
||||
}
|
||||
|
||||
export function pushIfNotExist<T extends Record<string, any>>(array: T[], value: T, key: string): void {
|
||||
const idx = array.findIndex((item) => item[key] === value[key]);
|
||||
if (idx < 0) {
|
||||
array.push(value);
|
||||
}
|
||||
}
|
||||
|
||||
export function filterDepartTree<T extends Record<string, any>>(departTree: T[], searchValue: string): T[] {
|
||||
let filtered: T[] = [];
|
||||
departTree.forEach((item) => {
|
||||
if (item.title && item.title.includes(searchValue)) {
|
||||
filtered.push(Object.assign({}, item, { children: null, isLeaf: true }));
|
||||
}
|
||||
if (item.children) {
|
||||
const result = filterDepartTree(item.children, searchValue);
|
||||
if (result.length > 0) {
|
||||
filtered = filtered.concat(result);
|
||||
}
|
||||
}
|
||||
});
|
||||
return filtered;
|
||||
}
|
||||
|
||||
export function recurTree<T extends Record<string, any>, R>(tree: T[], callback: (node: T) => R[]): R[] {
|
||||
let res: R[] = [];
|
||||
tree.forEach((item) => {
|
||||
res = res.concat(callback(item));
|
||||
if (item.children) {
|
||||
res = res.concat(recurTree(item.children, callback));
|
||||
}
|
||||
});
|
||||
return res;
|
||||
}
|
||||
Reference in New Issue
Block a user