<template>
|
<LoadingLayout :loading="isLoading">
|
<AppContainer>
|
<ProTableQueryFilterBar :show-reset-btn="false">
|
<template #query>
|
<QueryFilterItem>
|
<SearchInput
|
v-model="state.traceId"
|
style="width: 260px"
|
placeholder="traceID"
|
@on-click-search="refetch()"
|
>
|
</SearchInput>
|
</QueryFilterItem>
|
</template>
|
</ProTableQueryFilterBar>
|
<ProTabs v-model="state.tabType" hasBorder>
|
<ProTabPane lazy label="资源日志" name="resourceLogs">
|
<ResourceLogsView :resourceLogs="detail.resourceLogs"></ResourceLogsView>
|
</ProTabPane>
|
<ProTabPane lazy label="第三方资源日志" name="threeResourceLogs">
|
<ThreeResourceLogsView
|
:threeResourceLogs="detail.threeResourceLogs"
|
></ThreeResourceLogsView>
|
</ProTabPane>
|
<ProTabPane lazy label="异常日志" name="exceptionLogs">
|
<ExceptionLogsView :exceptionLogs="detail.exceptionLogs"></ExceptionLogsView>
|
</ProTabPane>
|
<ProTabPane lazy label="数据库审计日志" name="dbAuditLogs">
|
<DbAuditLogsView :dbAuditLogs="detail.dbAuditLogs"></DbAuditLogsView>
|
</ProTabPane>
|
</ProTabs>
|
</AppContainer>
|
</LoadingLayout>
|
</template>
|
|
<script setup lang="ts">
|
import {
|
ProTableQueryFilterBar,
|
SearchInput,
|
LoadingLayout,
|
AppContainer,
|
QueryFilterItem,
|
ProTabs,
|
ProTabPane,
|
} from '@bole-core/components';
|
import * as logRecordsServices from '@/services/api/logRecords';
|
import { useQuery } from '@tanstack/vue-query';
|
import ResourceLogsView from './components/ResourceLogsView.vue';
|
import ThreeResourceLogsView from './components/ThreeResourceLogsView.vue';
|
import ExceptionLogsView from './components/ExceptionLogsView.vue';
|
import DbAuditLogsView from './components/DbAuditLogsView.vue';
|
|
defineOptions({
|
name: 'TraceIdLogManageList',
|
});
|
|
const BaseState = {
|
traceId: '',
|
tabType: 'resourceLogs',
|
};
|
|
const state = reactive({ ...BaseState });
|
|
const {
|
isLoading,
|
data: detail,
|
refetch,
|
} = useQuery({
|
queryKey: ['logRecordsServices/getTraceIdLog', state],
|
queryFn: async () => {
|
return await logRecordsServices.getTraceIdLog({ traceId: state.traceId });
|
},
|
placeholderData: () => ({} as API.GetTraceIdLogQueryResult),
|
enabled: computed(() => !!state.traceId),
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
@use '@/style/common.scss' as *;
|
</style>
|
