update time

src/layout/components/AppMain.vue

@@ -21,6 +21,19 @@ limitations under the License. -->
     </router-view>
   </section>
 </template>
+<script lang="ts" setup>
+import { ElMessage } from "element-plus";
+import { useAppStoreWithOut } from "@/store/modules/app";
+
+const appStore = useAppStoreWithOut();
+if (!appStore.utc) {
+  const res = appStore.queryOAPTimeInfo();
+
+  if (res.errors) {
+    ElMessage.error(res.errors);
+  }
+}
+</script>
 <style lang="scss" scoped>
 .app-main {
   height: calc(100% - 40px);

src/locales/lang/en.ts

@@ -102,6 +102,8 @@ const msg = {
   setNormal: "Set this to normal",
   export: "Export Dashboard Templates",
   import: "Import Dashboard Templates",
+  yes: "Yes",
+  no: "No",
   hourTip: "Select Hour",
   minuteTip: "Select Minute",
   secondTip: "Select Second",
@@ -337,8 +339,6 @@ const msg = {
   conditionNotice:
     "Notice: Please press Enter after inputting a tag, key of content, exclude key of content(key=value).",
   cacheModalTitle: "Clear cache reminder",
-  yes: "Yes",
-  no: "No",
   cacheReminderContent:
     "SkyWalking detected dashboard template updates, do you want to update?",
   language: "Language",

src/locales/lang/zh.ts

@@ -102,6 +102,8 @@ const msg = {
   setNormal: "设置成为普通",
   export: "导出仪表板模板",
   import: "导入仪表板模板",
+  yes: "是",
+  no: "否",
   hourTip: "选择小时",
   minuteTip: "选择分钟",
   secondTip: "选择秒数",
@@ -338,8 +340,6 @@ const msg = {
   conditionNotice:
     "请输入一个标签、内容关键词或者内容不包含的关键词(key=value)之后回车",
   cacheModalTitle: "清除缓存提醒",
-  yes: "是的",
-  no: "不",
   cacheReminderContent: "SkyWalking检测到仪表板模板更新，是否需要更新？",
   language: "语言",
 };

src/main.ts

@@ -23,15 +23,11 @@ import i18n from "./locales";
 import "element-plus/dist/index.css";
 import "./styles/index.scss";
 import ElementPlus from "element-plus";
-import { useAppStoreWithOut } from "@/store/modules/app";
 
-const appStore = useAppStoreWithOut();
 const app = createApp(App);
 
 app.use(ElementPlus, { size: "small", zIndex: 3000 });
 app.use(components);
 app.use(i18n);
 app.use(store);
-appStore.queryOAPTimeInfo().then(() => {
-  app.use(router).mount("#app");
-});
+app.use(router).mount("#app");

src/store/modules/dashboard.ts

@@ -20,15 +20,6 @@ import { LayoutConfig } from "@/types/dashboard";
 import graphql from "@/graphql";
 import query from "@/graphql/fetch";
 import { DashboardItem } from "@/types/dashboard";
-// import {
-//   ServiceLayout,
-//   AllLayout,
-//   EndpointLayout,
-//   InstanceLayout,
-//   ServiceRelationLayout,
-//   InstanceRelationLayout,
-//   EndpointRelationLayout,
-// } from "@/constants/templates";
 import { useAppStoreWithOut } from "@/store/modules/app";
 import { useSelectorStore } from "@/store/modules/selectors";
 import { NewControl } from "../data";
@@ -300,18 +291,6 @@ export const dashboardStore = defineStore({
       if (res.data.errors) {
         return res.data;
       }
-      // const data = [
-      //   ServiceLayout,
-      //   AllLayout,
-      //   EndpointLayout,
-      //   InstanceLayout,
-      //   ServiceRelationLayout,
-      //   InstanceRelationLayout,
-      //   EndpointRelationLayout,
-      // ].map((t: any) => {
-      //   t.configuration = JSON.stringify(t.configuration);
-      //   return t;
-      // });
       const data = res.data.data.getAllTemplates;
       const list = [];
       for (const t of data) {

src/views/dashboard/List.vue

@@ -46,7 +46,11 @@ limitations under the License. -->
         <el-table-column fixed prop="name" label="Name" />
         <el-table-column prop="layer" label="Layer" width="200" />
         <el-table-column prop="entity" label="Entity" width="200" />
-        <el-table-column prop="isRoot" label="Root" width="100" />
+        <el-table-column prop="isRoot" label="Root" width="100">
+          <template #default="scope">
+            {{ scope.row.isRoot ? t("yes") : t("no") }}
+          </template>
+        </el-table-column>
         <el-table-column label="Operations">
           <template #default="scope">
             <el-button size="small" @click="handleView(scope.row)">
@@ -112,11 +116,15 @@ import { useDashboardStore } from "@/store/modules/dashboard";
 import router from "@/router";
 import { DashboardItem } from "@/types/dashboard";
 import { saveFile, readFile } from "@/utils/file";
-import { is } from "@/utils/is";
 
+const { t } = useI18n();
 const appStore = useAppStoreWithOut();
 const dashboardStore = useDashboardStore();
-appStore.setPageTitle("Dashboard List");
+const dashboards = ref<DashboardItem[]>([]);
+const searchText = ref<string>("");
+const loading = ref<boolean>(false);
+const multipleTableRef = ref<InstanceType<typeof ElTable>>();
+const multipleSelection = ref<DashboardItem[]>([]);
 //  # - os-linux
 //  # - k8s
 //  # - general(agent-installed)
@@ -128,13 +136,7 @@ appStore.setPageTitle("Dashboard List");
 //  # - cache
 //  # - browser
 //  # - skywalking
-const { t } = useI18n();
-const dashboards = ref<DashboardItem[]>([]);
-const searchText = ref<string>("");
-const loading = ref<boolean>(false);
-const multipleTableRef = ref<InstanceType<typeof ElTable>>();
-const multipleSelection = ref<DashboardItem[]>([]);
-
+appStore.setPageTitle("Dashboard List");
 const handleSelectionChange = (val: DashboardItem[]) => {
   multipleSelection.value = val;
 };