139 lines
4.3 KiB
Vue
139 lines
4.3 KiB
Vue
<template>
|
||
<Modal v-model="show" :mask-closable="false" width="720" title="推送日志详情" @on-visible-change="onVisibleChange">
|
||
<Form :label-width="110" class="push-log-detail-form">
|
||
<FormItem label="日志ID：">
|
||
<span>{{ row?.id ?? '-' }}</span>
|
||
</FormItem>
|
||
<FormItem label="应用：">
|
||
<span>{{ row?.appName ?? '-' }}</span>
|
||
<span class="sub-text">（appKey {{ row?.subscriberAppKey ?? '-' }}）</span>
|
||
</FormItem>
|
||
<FormItem label="接口：">
|
||
<span>{{ row?.interfaceLabel ?? '-' }}</span>
|
||
<span class="sub-text">{{ row?.interfacePath ?? '' }}</span>
|
||
</FormItem>
|
||
<FormItem label="请求地址：">
|
||
<span class="break-all">{{ row?.requestUrl || '-' }}</span>
|
||
</FormItem>
|
||
<FormItem label="调用结果：">
|
||
<span :class="resultClass">{{ resultText }}</span>
|
||
</FormItem>
|
||
<FormItem label="触发类型：">
|
||
<span>{{ triggerText }}</span>
|
||
</FormItem>
|
||
<FormItem label="HTTP状态：">
|
||
<span :class="row?.httpStatus === 200 ? 'text-success' : 'text-error'">{{ row?.httpStatus ?? '-' }}</span>
|
||
</FormItem>
|
||
<FormItem label="业务码：">
|
||
<span>{{ row?.respCode ?? '-' }}</span>
|
||
</FormItem>
|
||
<FormItem label="业务消息：">
|
||
<span class="break-all">{{ row?.respMsg || '-' }}</span>
|
||
</FormItem>
|
||
<FormItem label="重试次数：">
|
||
<span>第 {{ row?.attemptNo ?? 1 }} 次</span>
|
||
</FormItem>
|
||
<FormItem label="耗时：">
|
||
<span>{{ row?.costMs != null ? row.costMs + ' ms' : '-' }}</span>
|
||
</FormItem>
|
||
<FormItem label="签名时间 t：">
|
||
<span>{{ row?.signT || '-' }}</span>
|
||
</FormItem>
|
||
<FormItem label="创建时间：">
|
||
<span>{{ formatTime(row?.createdAt) }}</span>
|
||
</FormItem>
|
||
<FormItem label="请求体：">
|
||
<a v-if="row?.id" href="javascript:;" class="download-link" @click.prevent="handleDownload">下载请求体</a>
|
||
<span v-else>-</span>
|
||
</FormItem>
|
||
</Form>
|
||
<template #footer>
|
||
<Button type="primary" @click="show = false">确定</Button>
|
||
</template>
|
||
</Modal>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { computed } from 'vue';
|
||
import useCurrentInstance from '@/utils/hook/useCurrentInstance';
|
||
import Utils from '@/utils';
|
||
|
||
interface Props {
|
||
modelValue: boolean;
|
||
row?: Record<string, any> | null;
|
||
}
|
||
|
||
const props = withDefaults(defineProps<Props>(), { row: null });
|
||
const emit = defineEmits(['update:modelValue']);
|
||
|
||
const show = computed({
|
||
get: () => props.modelValue,
|
||
set: val => emit('update:modelValue', val),
|
||
});
|
||
|
||
const resultText = computed(() => (props.row?.success === 1 ? '成功' : '失败'));
|
||
const resultClass = computed(() => (props.row?.success === 1 ? 'text-success' : 'text-error'));
|
||
|
||
const triggerMap: Record<string, string> = {
|
||
manual: '手动测试',
|
||
auto: '自动触发',
|
||
retry: '失败重试',
|
||
};
|
||
const triggerText = computed(() => (props.row?.triggerType ? (triggerMap[props.row.triggerType] || props.row.triggerType) : '-'));
|
||
|
||
function onVisibleChange(val: boolean) {
|
||
if (!val) emit('update:modelValue', false);
|
||
}
|
||
|
||
const { $conf } = useCurrentInstance();
|
||
|
||
function handleDownload() {
|
||
if (!props.row?.id) return;
|
||
location.href = `${$conf.serviceHost}/api/push/Download/${props.row.id}`;
|
||
}
|
||
|
||
function formatTime(val: any): string {
|
||
if (!val) return '-';
|
||
return Utils.dateFormat(val, 'yyyy-MM-dd HH:mm:ss');
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.push-log-detail-form {
|
||
:deep(.ivu-form-item) {
|
||
margin-bottom: 14px;
|
||
}
|
||
|
||
:deep(.ivu-form-item-label) {
|
||
color: #515a6e;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.text-success {
|
||
color: #19be6b;
|
||
}
|
||
|
||
.text-error {
|
||
color: #ed4014;
|
||
}
|
||
|
||
.sub-text {
|
||
margin-left: 8px;
|
||
color: #999;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.break-all {
|
||
word-break: break-all;
|
||
}
|
||
|
||
.download-link {
|
||
color: #577afb;
|
||
|
||
&:hover {
|
||
color: #3d5afe;
|
||
}
|
||
}
|
||
}
|
||
</style>
|