前端添加调试隐藏菜单

src/components/AdvancedDebugDialog.vue

@@ -0,0 +1,110 @@
+<template>
+  <q-dialog
+    persistent
+    v-model="show_dialog"
+    @before-hide="resetData"
+    @keydown="
+      (evt) => {
+        if (!loading && evt.keyCode == 27) {
+          show_dialog = false;
+        }
+      }
+    "
+  >
+    <q-card class="overflow-hidden" style="overflow-y: scroll; max-width: 35vw">
+      <q-form @submit="onSubmit">
+        <q-card-section class="q-ma-none q-pa-sm">
+          <div class="row">
+            <div class="col-auto text-h6">AdvancedDebug</div>
+            <q-space />
+            <div>
+              <q-btn
+                :loading="loading"
+                flat
+                round
+                icon="close"
+                color="red"
+                v-close-popup
+              >
+                <q-tooltip>
+                  {{ $t("close") }}
+                </q-tooltip>
+              </q-btn>
+            </div>
+          </div>
+        </q-card-section>
+
+        <q-separator />
+
+        <q-card-section style="max-height: 50vh; width: 35vw" class="scroll">
+          <q-list>
+            <q-item>
+              <q-item-section>
+                <q-btn @click="restartDevice"> Restart </q-btn>
+              </q-item-section>
+            </q-item>
+          </q-list>
+        </q-card-section>
+
+        <q-separator />
+
+        <q-card-actions align="right">
+          <q-btn
+            :loading="loading"
+            flat
+            :label="$t('Cancel')"
+            color="primary"
+            v-close-popup
+          />
+          <q-btn
+            ref="accept"
+            flat
+            :label="$t('Accept')"
+            :loading="loading"
+            type="submit"
+            color="primary"
+          />
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style scoped></style>
+
+<script lang="ts">
+import { defineComponent, ref, watch, computed } from "vue";
+import { useStore } from "src/store";
+import { useQuasar } from "quasar";
+import { useI18n } from "vue-i18n";
+import GlobalData from "src/common/GlobalData";
+
+export default defineComponent({
+  name: "ComponentAdvancedDebugDialog",
+
+  setup() {
+    let $store = useStore();
+    let $q = useQuasar();
+    let $t = useI18n();
+
+    let show_dialog = ref(false);
+    let loading = ref(false);
+
+    return {
+      show_dialog,
+      loading,
+
+      showDialog() {
+        show_dialog.value = true;
+      },
+      resetData() {
+        loading.value = false;
+      },
+
+      restartDevice() {
+        GlobalData.getInstance().getCurrentClient()?.restartDevice();
+      },
+    };
+  },
+});
+</script>

src/pad/TopToolbar.vue

@@ -151,6 +151,17 @@
               {{ $t("CN/EN switch") }}
             </q-item-section>
           </q-item>
+          <q-item
+            v-if="$store.state.advanced_debug"
+            clickable
+            v-close-popup
+            @click="$refs.advanced_debug_dialog.showDialog()"
+          >
+            <q-item-section avatar>
+              <q-icon name="bug_report" color="accent" />
+            </q-item-section>
+            <q-item-section> AdvancedDebug </q-item-section>
+          </q-item>
         </q-list>
       </q-popup-proxy>
     </q-btn>
@@ -170,6 +181,7 @@
   <background-image-dialog ref="background_image_dialog" />
   <file-manage-dialog ref="file_manage_dialog" />
   <center-control-dialog ref="center_control_dialog" />
+  <advanced-debug-dialog ref="advanced_debug_dialog" />
 </template>
 
 <script lang="ts">
@@ -180,6 +192,7 @@ import { useStore } from "src/store";
 import BackgroundImageDialog from "src/components/BackgroundImageDialog.vue";
 import FileManageDialog from "src/components/FileManageDialog.vue";
 import CenterControlDialog from "src/components/CenterControlDialog.vue";
+import AdvancedDebugDialog from "src/components/AdvancedDebugDialog.vue";
 
 import GlobalData from "src/common/GlobalData";
 
@@ -189,6 +202,7 @@ export default defineComponent({
     BackgroundImageDialog,
     FileManageDialog,
     CenterControlDialog,
+    AdvancedDebugDialog,
   },
   setup() {
     const $store = useStore();

src/pages/TopToolBar.vue

@@ -307,6 +307,17 @@
               {{ $t("about") }}
             </q-item-section>
           </q-item>
+          <q-item
+            v-if="$store.state.advanced_debug"
+            clickable
+            v-close-popup
+            @click="$refs.advanced_debug_dialog.showDialog()"
+          >
+            <q-item-section avatar>
+              <q-icon name="bug_report" />
+            </q-item-section>
+            <q-item-section> AdvancedDebug </q-item-section>
+          </q-item>
         </q-list>
       </q-btn-dropdown>
 
@@ -334,6 +345,7 @@
   <edge-blending-dialog ref="edge_blending_dialog" />
   <register-dialog ref="register_dialog" />
   <center-control-dialog ref="center_control_dialog" />
+  <advanced-debug-dialog ref="advanced_debug_dialog" />
 </template>
 
 <style scoped>
@@ -367,6 +379,7 @@ import AboutDialog from "src/components/AboutDialog.vue";
 import EdgeBlendingDialog from "src/components/EdgeBlendingDialog.vue";
 import RegisterDialog from "src/components/RegisterDialog.vue";
 import CenterControlDialog from "src/components/CenterControlDialog.vue";
+import AdvancedDebugDialog from "src/components/AdvancedDebugDialog.vue";
 
 import EventBus, { EventNamesDefine } from "src/common/EventBus";
 import { Protocol } from "src/entities/WSProtocol";
@@ -399,6 +412,7 @@ export default defineComponent({
     EdgeBlendingDialog,
     RegisterDialog,
     CenterControlDialog,
+    AdvancedDebugDialog,
   },
 
   setup() {

src/store/index.ts

@@ -35,6 +35,7 @@ export interface StateInterface {
   // example: ExampleStateInterface;
   // Declared as unknown to avoid linting issue. Best to strongly type as per the line above.
   initialized: boolean;
+  advanced_debug: boolean;
   signal_source_tree: SignalSourceTreeItemEntity[];
   polling_tree: PollingTreeItemEntity[];
   mode_tree: ModeTreeItemEntity[];
@@ -281,6 +282,7 @@ export default store(function (/* { ssrContext } */) {
     state: {
       // state
       initialized: false,
+      advanced_debug: window.location.href.indexOf("advanced_debug=1") != -1,
       signal_source_tree: [],
       polling_tree: [],
       mode_tree: [],