refactor: update

This commit is contained in:
Fine 2023-11-01 16:49:53 +08:00
parent d2eae87957
commit b994842ecd
4 changed files with 20 additions and 35 deletions

View File

@ -42,7 +42,7 @@ limitations under the License. -->
@closed="showDetail = false"
:title="t('logDetail')"
>
<LogDetail :currentLog="currentLog" :columns="columns" />
<LogDetail :currentLog="currentLog" />
</el-dialog>
</div>
</template>
@ -90,13 +90,14 @@ limitations under the License. -->
width: 390px;
}
.content,
.tags {
width: 300px;
.content {
width: 1000px;
}
.tags {
width: 320px;
}
.serviceInstanceName,
.endpointName,
.serviceName {
width: 200px;
}

View File

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License. -->
<template>
<div class="log-detail">
<div class="mb-10 clear rk-flex" v-for="(item, index) in columns" :key="index">
<div class="mb-10 clear rk-flex" v-for="(item, index) in ServiceLogDetail" :key="index">
<span class="g-sm-4 grey">{{ t(item.value) }}:</span>
<span v-if="['timestamp', 'time'].includes(item.label)" class="g-sm-8 mb-10">
{{ dateFormat(currentLog[item.label]) }}
@ -36,14 +36,13 @@ limitations under the License. -->
import { computed } from "vue";
import type { PropType } from "vue";
import { useI18n } from "vue-i18n";
import type { Option } from "@/types/app";
import { dateFormat } from "@/utils/dateFormat";
import { formatJson } from "@/utils/formatJson";
import { ServiceLogDetail } from "./data";
/*global defineProps */
const props = defineProps({
currentLog: { type: Object as PropType<any>, default: () => ({}) },
columns: { type: Array as PropType<Option[]>, default: () => [] },
});
const { t } = useI18n();
const logTags = computed(() => {

View File

@ -88,7 +88,7 @@ limitations under the License. -->
cursor: pointer;
.traceId {
width: 390px;
width: 260px;
cursor: pointer;
span {
@ -102,20 +102,21 @@ limitations under the License. -->
}
}
.content,
.tags {
width: 300px;
width: 320px;
}
.content {
width: 1000px;
}
.serviceInstanceName,
.endpointName,
.serviceName {
width: 200px;
}
}
.log-item:hover {
background: rgba(0, 0, 0, 0.04);
background: rgb(0 0 0 / 4%);
}
.log-item > div {

View File

@ -16,26 +16,14 @@
*/
export const ServiceLogConstants = [
{
label: "content",
value: "content",
},
{
label: "serviceName",
value: "service",
},
{
label: "serviceInstanceName",
value: "instance",
},
{
label: "endpointName",
value: "endpoint",
},
{
label: "timestamp",
value: "time",
},
{
label: "contentType",
value: "contentType",
},
{
label: "tags",
value: "tags",
@ -44,10 +32,6 @@ export const ServiceLogConstants = [
label: "traceId",
value: "traceID",
},
{
label: "content",
value: "content",
},
];
export const ServiceLogDetail = [
{