From 0828f8a7aaae65ed673632689833fa17af7b8097 Mon Sep 17 00:00:00 2001
From: Fine0830 <fine0830@outlook.com>
Date: Tue, 14 Jun 2022 11:26:53 +0800
Subject: [PATCH] fix: update query conditions for the browser logs (#106)

---
 src/locales/lang/en.ts                     |  2 +-
 src/locales/lang/es.ts                     |  2 +-
 src/router/alarm.ts                        |  4 +-
 src/views/Alarm.vue                        |  2 +-
 src/views/dashboard/related/log/Header.vue | 63 ++++++++++++++--------
 src/views/dashboard/related/log/data.ts    | 26 +++++++++
 6 files changed, 72 insertions(+), 27 deletions(-)
 create mode 100644 src/views/dashboard/related/log/data.ts

diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts
index 7749d634..8c62373e 100644
--- a/src/locales/lang/en.ts
+++ b/src/locales/lang/en.ts
@@ -161,7 +161,7 @@ const msg = {
   dashboard: "Dashboard",
   topology: "Topology",
   trace: "Trace",
-  alarm: "Alarms",
+  alarm: "Alerting",
   auto: "Auto",
   reload: "Reload",
   version: "Version",
diff --git a/src/locales/lang/es.ts b/src/locales/lang/es.ts
index c5c8a58e..794980e0 100644
--- a/src/locales/lang/es.ts
+++ b/src/locales/lang/es.ts
@@ -161,7 +161,7 @@ const msg = {
   dashboard: "Panel",
   topology: "Topología",
   trace: "Traza",
-  alarm: "Alarmas",
+  alarm: "Recordatorio en curso",
   auto: "Auto",
   reload: "Recargar",
   version: "Versión",
diff --git a/src/router/alarm.ts b/src/router/alarm.ts
index 6880e099..debaa61a 100644
--- a/src/router/alarm.ts
+++ b/src/router/alarm.ts
@@ -30,13 +30,13 @@ export const routesAlarm: Array<RouteRecordRaw> = [
     component: Layout,
     children: [
       {
-        path: "/alarm",
+        path: "/alerting",
         name: "Alarm",
         meta: {
           exact: false,
         },
         component: () =>
-          import(/* webpackChunkName: "alarms" */ "@/views/Alarm.vue"),
+          import(/* webpackChunkName: "alerting" */ "@/views/Alarm.vue"),
       },
     ],
   },
diff --git a/src/views/Alarm.vue b/src/views/Alarm.vue
index 87a33ef5..88c00fe9 100644
--- a/src/views/Alarm.vue
+++ b/src/views/Alarm.vue
@@ -24,7 +24,7 @@ import Header from "./alarm/Header.vue";
 import Content from "./alarm/Content.vue";
 
 const appStore = useAppStoreWithOut();
-appStore.setPageTitle("Alarm");
+appStore.setPageTitle("Alerting");
 </script>
 <style lang="scss" scoped>
 .alarm {
diff --git a/src/views/dashboard/related/log/Header.vue b/src/views/dashboard/related/log/Header.vue
index fdafdb34..ee86a4b3 100644
--- a/src/views/dashboard/related/log/Header.vue
+++ b/src/views/dashboard/related/log/Header.vue
@@ -50,6 +50,16 @@ limitations under the License. -->
         @query="searchEndpoints"
       />
     </div>
+    <div class="mr-5" v-if="isBrowser">
+      <span class="grey mr-5"> {{ t("category") }}: </span>
+      <Selector
+        size="small"
+        :value="state.category.value"
+        :options="ErrorCategory"
+        placeholder="Select a category"
+        @change="changeField('category', $event)"
+      />
+    </div>
     <el-button
       class="search-btn"
       size="small"
@@ -59,14 +69,14 @@ limitations under the License. -->
       {{ t("search") }}
     </el-button>
   </div>
-  <div class="flex-h row">
-    <div class="mr-5 traceId" v-show="!isBrowser">
+  <div class="flex-h row" v-show="!isBrowser">
+    <div class="mr-5 traceId">
       <span class="grey mr-5">{{ t("traceID") }}:</span>
       <el-input v-model="traceId" class="inputs-max" size="small" />
     </div>
     <ConditionTags :type="'LOG'" @update="updateTags" />
   </div>
-  <div class="row tips">
+  <div class="row tips" v-show="!isBrowser">
     <b>{{ t("conditionNotice") }}</b>
   </div>
   <div class="flex-h" v-show="!isBrowser">
@@ -130,6 +140,7 @@ import { useSelectorStore } from "@/store/modules/selectors";
 import ConditionTags from "@/views/components/ConditionTags.vue";
 import { ElMessage } from "element-plus";
 import { EntityType } from "../../data";
+import { ErrorCategory } from "./data";
 
 const { t } = useI18n();
 const appStore = useAppStoreWithOut();
@@ -148,6 +159,7 @@ const state = reactive<any>({
   instance: { value: "0", label: "All" },
   endpoint: { value: "0", label: "All" },
   service: { value: "", label: "" },
+  category: { value: "ALL", label: "All" },
 });
 
 init();
@@ -219,25 +231,32 @@ function searchLogs() {
   if (dashboardStore.entity === EntityType[3].value) {
     instance = selectorStore.currentPod.id;
   }
-  logStore.setLogCondition({
-    serviceId: selectorStore.currentService
-      ? selectorStore.currentService.id
-      : state.service.id,
-    endpointId: endpoint || state.endpoint.id || undefined,
-    serviceInstanceId: instance || state.instance.id || undefined,
-    queryDuration: appStore.durationTime,
-    keywordsOfContent:
-      dashboardStore.layerId === "BROWSER"
-        ? undefined
-        : keywordsOfContent.value,
-    excludingKeywordsOfContent:
-      dashboardStore.layerId === "BROWSER"
-        ? undefined
-        : excludingKeywordsOfContent.value,
-    tags: tagsMap.value.length ? tagsMap.value : undefined,
-    paging: { pageNum: 1, pageSize: 15 },
-    relatedTrace: traceId.value ? { traceId: traceId.value } : undefined,
-  });
+  if (dashboardStore.layerId === "BROWSER") {
+    logStore.setLogCondition({
+      serviceId: selectorStore.currentService
+        ? selectorStore.currentService.id
+        : state.service.id,
+      pagePathId: endpoint || state.endpoint.id || undefined,
+      serviceVersionId: instance || state.instance.id || undefined,
+      paging: { pageNum: 1, pageSize: 15 },
+      queryDuration: appStore.durationTime,
+      category: state.category.value,
+    });
+  } else {
+    logStore.setLogCondition({
+      serviceId: selectorStore.currentService
+        ? selectorStore.currentService.id
+        : state.service.id,
+      endpointId: endpoint || state.endpoint.id || undefined,
+      serviceInstanceId: instance || state.instance.id || undefined,
+      queryDuration: appStore.durationTime,
+      keywordsOfContent: keywordsOfContent.value,
+      excludingKeywordsOfContent: excludingKeywordsOfContent.value,
+      tags: tagsMap.value.length ? tagsMap.value : undefined,
+      paging: { pageNum: 1, pageSize: 15 },
+      relatedTrace: traceId.value ? { traceId: traceId.value } : undefined,
+    });
+  }
   queryLogs();
 }
 async function queryLogs() {
diff --git a/src/views/dashboard/related/log/data.ts b/src/views/dashboard/related/log/data.ts
new file mode 100644
index 00000000..ec454837
--- /dev/null
+++ b/src/views/dashboard/related/log/data.ts
@@ -0,0 +1,26 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export const ErrorCategory = [
+  { label: "All", value: "ALL" },
+  { label: "AJAX", value: "AJAX" },
+  { label: "Resource", value: "RESOURCE" },
+  { label: "Vue", value: "VUE" },
+  { label: "Promise", value: "PROMISE" },
+  { label: "JS", value: "JS" },
+  { label: "Unknown", value: "UNKNOWN" },
+];