refactor: update

src/views/dashboard/related/log/LogTable/Index.vue

@@ -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,
+    .content {
-    .tags {
+      width: 1000px;
-      width: 300px;
+    }
+
+    .tags {
+      width: 320px;
     }
 
-    .serviceInstanceName,
-    .endpointName,
     .serviceName {
       width: 200px;
     }

src/views/dashboard/related/log/LogTable/LogDetail.vue

@@ -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(() => {

src/views/dashboard/related/log/LogTable/LogService.vue

@@ -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 {

src/views/dashboard/related/log/LogTable/data.ts

@@ -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 = [
   {