Files
ruoyi-plus-soybean/src/views/monitor/operlog/modules/oper-log-view-drawer.vue

73 lines
2.8 KiB
Vue

<script setup lang="tsx">
import { NDescriptions, NDescriptionsItem, NTag } from 'naive-ui';
import { getRequestMethodTagType } from '@/utils/icon-tag-format';
import { $t } from '@/locales';
import DictTag from '@/components/custom/dict-tag.vue';
defineOptions({
name: 'OperLogViewDrawer'
});
interface Props {
/** the edit row data */
rowData: Api.Monitor.OperLog | null;
}
const props = defineProps<Props>();
const visible = defineModel<boolean>('visible', {
default: false
});
const title = '操作日志详情';
function closeDrawer() {
visible.value = false;
}
</script>
<template>
<NDrawer v-model:show="visible" :title="title" display-directive="show" :width="800" class="max-w-90%">
<NDrawerContent :title="title" :native-scrollbar="false" closable>
<NDescriptions label-class="min-w-100px" :column="1" size="small" bordered label-placement="left">
<NDescriptionsItem label="日志编号">{{ props.rowData?.operId }}</NDescriptionsItem>
<NDescriptionsItem label="操作状态">
<DictTag size="small" :value="props.rowData?.status" dict-code="sys_common_status" />
</NDescriptionsItem>
<NDescriptionsItem label="系统模块">
<NSpace>
<NTag class="m-1" size="small" type="primary">{{ props.rowData?.title }}模块</NTag>
<DictTag size="small" :value="props.rowData?.businessType" dict-code="sys_oper_type" />
</NSpace>
</NDescriptionsItem>
<NDescriptionsItem label="操作信息">
{{ props.rowData?.operName }} | {{ props.rowData?.deptName }} | {{ props.rowData?.operIp }} |
{{ props.rowData?.operLocation }}
</NDescriptionsItem>
<NDescriptionsItem label="请求信息">
<NSpace>
<NTag size="small" :type="getRequestMethodTagType(props.rowData?.requestMethod ?? '')">
{{ `${props.rowData?.requestMethod?.toUpperCase()}请求` }}
</NTag>
{{ props.rowData?.operUrl }}
</NSpace>
</NDescriptionsItem>
<NDescriptionsItem label="操作时间">{{ props.rowData?.operTime }}</NDescriptionsItem>
<NDescriptionsItem label="请求参数">
<JsonPreview :code="props.rowData?.operParam" />
</NDescriptionsItem>
<NDescriptionsItem label="返回参数">
<JsonPreview :code="props.rowData?.jsonResult" />
</NDescriptionsItem>
<NDescriptionsItem label="消耗时间">
{{ `${props.rowData?.costTime} ms` }}
</NDescriptionsItem>
<NDescriptionsItem label="错误消息">{{ props.rowData?.errorMsg }}</NDescriptionsItem>
</NDescriptions>
<template #footer>
<NSpace :size="16">
<NButton @click="closeDrawer">{{ $t('common.close') }}</NButton>
</NSpace>
</template>
</NDrawerContent>
</NDrawer>
</template>