feat: create global actions for setting page title and auto refresh pages (#13)

* fix: update heat map

* feat: update servicelist

* fix: update list

* feat: update page with changing times

* feat: set auto fresh

* feat: set page titles

src/layout/components/NavBar.vue

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License. -->
 <template>
   <div class="nav-bar flex-h" :class="{ dark: theme === 'dark' }">
-    <div class="title">{{ t(pageName) }}</div>
+    <div class="title">{{ appStore.pageTitle || t(pageName) }}</div>
     <div class="app-config">
       <span class="red" v-show="timeRange">{{ t("timeTips") }}</span>
       <TimePicker
@@ -27,9 +27,9 @@ limitations under the License. -->
         UTC{{ utcHour >= 0 ? "+" : ""
         }}{{ `${appStore.utcHour}:${appStore.utcMin}` }}
       </span>
-      <!-- <span @click="handleReload" title="refresh">
-        <Icon icon="retry" :loading="auto" class="middle" />
-      </span> -->
+      <span title="refresh" class="ghost ml-5 cp" @click="handleReload">
+        <Icon iconName="retry" :loading="appStore.autoRefresh" class="middle" />
+      </span>
     </div>
   </div>
 </template>
@@ -66,6 +66,12 @@ const time = computed(() => [
   appStore.durationRow.start,
   appStore.durationRow.end,
 ]);
+const handleReload = () => {
+  const gap =
+    appStore.duration.end.getTime() - appStore.duration.start.getTime();
+  const time: Date[] = [new Date(new Date().getTime() - gap), new Date()];
+  appStore.setDuration(timeFormat(time));
+};
 function changeTimeRange(val: Date[]) {
   timeRange.value =
     val[1].getTime() - val[0].getTime() > 60 * 24 * 60 * 60 * 1000 ? 1 : 0;