Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

【检索】开放检索使用1.0优化版 #447

Merged
merged 5 commits into from
Oct 8, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/frontend/src/views/analysis-manage/language/en.js
Original file line number Diff line number Diff line change
Expand Up @@ -136,5 +136,6 @@ export default {
管理空间ID: 'scope id',
取消: 'Cancel',
'取消(No)': 'No',
请输入原始日志: 'Please enter the Raw logs',
},
};
Original file line number Diff line number Diff line change
Expand Up @@ -170,6 +170,11 @@ export default {
// },
// message: '不允许出现特殊字符',
},
log: {
label: '原始日志',
type: 'string',
required: false,
},
query_string: {
label: '查询语句',
type: 'expr',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -97,8 +97,6 @@
IRequestResponsePaginationData,
} from '@utils/request';

import { getOffset } from '@/utils/assist';

interface Props {
columns: InstanceType<typeof Table>['$props']['columns'],
dataSource: (params: any)=> Promise<IRequestResponsePaginationData<any>>,
Expand All @@ -125,7 +123,7 @@
const pagination = reactive<IPagination>({
count: 0,
current: 1,
limit: 10,
limit: 50,
limitList: [10, 20, 50, 100],
align: 'right',
layout: ['total', 'limit', 'list'],
Expand Down Expand Up @@ -211,38 +209,13 @@
emits('clearSearch');
};

const tableHeaderHeight = 42;
const tableRowHeight = 42;
const calcPageLimit = () => {
const windowInnerHeight = window.innerHeight;
const pageOffsetTop = 185;
const tableFooterHeight = 60;
const copyrightHeight = 72;

const tableRowTotalHeight = windowInnerHeight
- pageOffsetTop
- tableHeaderHeight
- tableFooterHeight
- copyrightHeight;

const rowNum = Math.floor(tableRowTotalHeight / tableRowHeight);
const pageLimit = new Set([
...pagination.limitList,
rowNum,
]);
pagination.limit = rowNum;
pagination.limitList = [...pageLimit].sort((a, b) => a - b);
};

const calcTableHeight = _.throttle(() => {
const windowInnerHeight = window.innerHeight;
const { top } = getOffset(rootRef.value);
tableMaxHeight.value = windowInnerHeight - top - 120;
tableMaxHeight.value = windowInnerHeight - 250;
}, 100);

onMounted(() => {
parseURL();
calcPageLimit();
calcTableHeight();
window.addEventListener('resize', calcTableHeight);
const observer = new MutationObserver(() => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@
:columns="tableColumn"
:data-source="dataSource"
@clear-search="handleClearSearch"
@request-success="handleRequestSuccess"
@row-click="handleRowClick">
<template #expandRow="{ row }">
<row-expand-content
Expand Down Expand Up @@ -81,7 +82,8 @@
interface Exposes {
loading: Ref<boolean>,
}
const initColumn:InstanceType<typeof Table>['$props']['columns'] = [

const initColumn: InstanceType<typeof Table>['$props']['columns'] = [
{
label: () => '',
type: 'expand',
Expand All @@ -98,24 +100,33 @@
},
{
label: () => t('操作人'),
field: 'username',
render: ({ data }: {data: SearchModel}) => (
data.username
? <RenderUser key={data.bk_receive_time} data={data}/>
: '--'
),
width: '100px',
filter: {
list: [],
},
},
{
label: () => t('来源系统(ID)'),
field: 'system_info.name',
render: ({ data }: {data: SearchModel}) => (
data.system_id
? <RenderSystem data={data}/>
: '--'
),
minWidth: 140,
filter: {
list: [],
},
},
{
label: () => t('操作事件名(ID)'),
field: 'snapshot_action_info.name',
render: ({ data }: {data: SearchModel}) => {
if (data.action_id) {
if (!_.isEmpty(data.snapshot_action_info)) {
Expand All @@ -126,9 +137,13 @@
return '--';
},
minWidth: 160,
filter: {
list: [],
},
},
{
label: () => t('资源类型(ID)'),
field: 'snapshot_resource_type_info.name',
render: ({ data }: {data: SearchModel}) => {
if (data.resource_type_id) {
if (!_.isEmpty(data.snapshot_resource_type_info)) {
Expand All @@ -139,6 +154,9 @@
return '--';
},
minWidth: 150,
filter: {
list: [],
},
},
{
label: () => t('资源实例(ID)'),
Expand All @@ -165,21 +183,29 @@
},
{
label: () => t('操作结果(Code)'),
field: 'result_code',
minWidth: 160,
render: ({ data }: {data: SearchModel}) => (
data.result_code
? <RenderResult key={data.bk_receive_time} data={data}/>
: '--'
),
filter: {
list: [],
},
},
{
label: () => t('操作途径'),
field: 'access_type',
render: ({ data }: {data: SearchModel}) => (
<span>
{data.access_type || '--'}
</span>
),
minWidth: 120,
filter: {
list: [],
},
},
];
// const fixedColum:InstanceType<typeof Table>['$props']['columns'] = [{
Expand Down Expand Up @@ -220,6 +246,41 @@
manual: true,
});

const getValueFromPath = (obj: any, path: string) => {
// 将路径按点拆分成数组
const keys = path.split('.');

// 遍历路径数组,逐层获取对象的值
return keys.reduce((acc, key) => {
// 如果acc为空或undefined,直接返回undefined
if (acc === undefined) {
return undefined;
}
// 获取当前层级的值
return acc[key];
}, obj);
};

// 根据返回内容生成列筛选项
const handleRequestSuccess = (data: Array<SearchModel>) => {
tableColumn.value = tableColumn.value?.map((item) => {
if (item.filter) {
const values = data.map(obj => getValueFromPath(obj, item.field as string));
const lists = [...new Set(values)].map(value => ({
text: value === undefined ? '--' : value,
value,
}));
// eslint-disable-next-line no-param-reassign
item.filter = {
list: lists,
height: lists.length * 32,
maxHeight: 192,
};
}
return item;
});
};

const handleUpdateField = () => {
fetchCustomFields({
route_path: route.name,
Expand Down
4 changes: 3 additions & 1 deletion src/frontend/src/views/analysis-manage/list/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,9 @@
ref="resultRef"
:filter="searchModel"
@clear-search="handleClearSearch" />
<search-page-footer />
<div style="height: 52px; margin-top: 24px;">
<search-page-footer />
</div>
</div>
</skeleton-loading>
</template>
Expand Down
Loading