update web ui (#2318)

* fix(web ui): profiler * chore(web ui):perf proxy config * perf(web ui):update style * chore(web ui):update deps * perf(web ui):fix monitor category * fix(web ui):fix style of table and monitor rt chart * refactor(web ui):refactor config * feat(web ui):support debug http api with console
2024-04-21 10:21:39 +00:00 · 2022-10-25 17:51:50 +08:00
parent f6fe8b9134
commit aa2526075b
47 changed files with 1377 additions and 858 deletions
@@ -0,0 +1,2 @@
+# NODE_ENV=production
+VITE_AGENT=true
@@ -0,0 +1,2 @@
+# NODE_ENV=production
+VITE_AGENT=false
@@ -3,8 +3,10 @@
  "private": false,
  "version": "0.1.4",
  "scripts": {
-    "dev": "vite --port 8000",
-    "build": "vue-tsc --noEmit && vite build",
+    "dev": "vite --port 8000 --mode ui",
+    "dev:tunnel": "vite --port 8000 --mode tunnel",
+    "build": "vue-tsc --noEmit && vite build --mode ui",
+    "build:tunnel": "vue-tsc --noEmit && vite build --mode tunnel",
    "preview": "vite preview"
  },
  "dependencies": {
@@ -31,6 +33,6 @@
    "tailwindcss": "^3.1.4",
    "typescript": "^4.7.4",
    "vite": "^2.9.9",
-    "vue-tsc": "^0.34.7"
+    "vue-tsc": "1.0.8"
  }
 }
@@ -2,7 +2,7 @@
 import { onMounted, ref } from "vue";
 import { Terminal } from "xterm"
 import { FitAddon } from 'xterm-addon-fit';
-import {WebglAddon} from "xterm-addon-webgl"
+import { WebglAddon } from "xterm-addon-webgl"

 let ws: WebSocket | undefined;

@@ -14,9 +14,11 @@ const ip = ref("")
 const port = ref('')
 const iframe = ref(true)
 const fullSc = ref(true)
+const agentID = ref('')
+const isTunnel = import.meta.env.VITE_AGENT === 'true'
 const fitAddon = new FitAddon();
 const webglAddon = new WebglAddon();
-let xterm = new Terminal({allowProposedApi: true})
+let xterm = new Terminal({ allowProposedApi: true })

 onMounted(() => {
  ip.value = getUrlParam('ip') ?? window.location.hostname;
@@ -27,7 +29,7 @@ onMounted(() => {
  startConnect(true);
  window.addEventListener('resize', function () {
    if (ws !== undefined && ws !== null) {
-      const {cols, rows} = fitAddon.proposeDimensions()!
+      const { cols, rows } = fitAddon.proposeDimensions()!
      ws.send(JSON.stringify({ action: 'resize', cols, rows: rows }));
      fitAddon.fit();
    }
@@ -56,7 +58,7 @@ function initWs(silent: boolean) {

    let scrollback = getUrlParam('scrollback') ?? '0';

-    const {cols, rows} = initXterm(scrollback)
+    const { cols, rows } = initXterm(scrollback)
    xterm.onData(function (data) {
      ws?.send(JSON.stringify({ action: 'read', data: data }))
    });
@@ -85,7 +87,7 @@ function initXterm(scrollback: string) {
    scrollback: isValidNumber(scrollNumber) ? scrollNumber : DEFAULT_SCROLL_BACK
  });
  xterm.loadAddon(fitAddon)
-  
+
  xterm.open(document.getElementById('terminal')!);

  xterm.loadAddon(webglAddon)
@@ -136,8 +138,8 @@ function disconnect() {
 function xtermFullScreen() {
  var ele = document.getElementById('terminal-card')!;
  requestFullScreen(ele);
-  ele.onfullscreenchange = (e:Event)=>{
-      fitAddon.fit()
+  ele.onfullscreenchange = (e: Event) => {
+    fitAddon.fit()
  }
 }

@@ -162,8 +164,8 @@ function requestFullScreen(element: HTMLElement) {
  <div class="flex flex-col h-[100vh] resize-none">
    <nav v-if="iframe" class="navbar bg-base-100 flex-row">
      <div class="flex-1">
-        <a href="https://github.com/alibaba/arthas" target="_blank" title="" class="mr-2 w-20"><img
-            src="/arthas.png" alt="Arthas" title="Welcome to Arthas web console" class=""></a>
+        <a href="https://github.com/alibaba/arthas" target="_blank" title="" class="mr-2 w-20"><img src="/arthas.png"
+            alt="Arthas" title="Welcome to Arthas web console" class=""></a>
        <ul class="menu menu-horizontal p-0">
          <li>
            <a class="hover:text-sky-500 dark:hover:text-sky-400 text-sm" href="https://arthas.aliyun.com/doc"
@@ -200,7 +202,7 @@ function requestFullScreen(element: HTMLElement) {
          <button
            class="btn btn-sm bg-secondary hover:bg-secondary-focus border-none text-secondary-content focus:bg-secondary-focus normal-case"
            @click.prevent="disconnect">Disconnect</button>
-          <a class="btn btn-sm bg-secondary hover:bg-secondary-focus border-none text-secondary-content focus:bg-secondary-focus normal-case"
+          <a v-if="!isTunnel" class="btn btn-sm bg-secondary hover:bg-secondary-focus border-none text-secondary-content focus:bg-secondary-focus normal-case"
            href="arthas-output/" target="_blank">Arthas Output</a>
        </div>
      </form>
@@ -4,4 +4,11 @@ declare module '*.vue' {
  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
  const component: DefineComponent<{}, {}, any>
  export default component
-}
+}
+interface ImportMetaEnv {
+  readonly VITE_AGENT:string
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}
@@ -1,11 +1,9 @@
-<script setup lang="ts">
-import NavAside from "@/components/routeTo/NavAside.vue";
+ <script setup lang="ts">
+// import NavAside from "@/components/routeTo/NavAside.vue";
 import NavHeader from "@/components/NavHeader.vue";
 import ErrDialog from "@/components/dialog/ErrDialog.vue";
 import SuccessDialog from "@/components/dialog/SuccessDialog.vue";
 import { onBeforeUnmount } from "vue";
-import machine from "./machines/consoleMachine";
-import { interpret } from "xstate";
 import { fetchStore } from "./stores/fetch";
 import InputDialog from "./components/dialog/InputDialog.vue";
 import { publicStore } from "./stores/public";
@@ -13,24 +11,16 @@ import WarnDialog from "./components/dialog/WarnDialog.vue";
 const fetchS = fetchStore()
 const publicS = publicStore()
 onBeforeUnmount(() => {
-  const actor = interpret(machine)
-  actor.start()
-  actor.send("INIT")
-  actor.send({
-    type: "SUBMIT",
-    value: {
-      action: "interrupt_job",
-    } as AsyncReq
-  })
+  fetchS.interruptJob()
 })
 </script>
-
+<!-- dialog用v-if方便触发hooks -->
 <template>
  <div class=" h-screen flex flex-col">
    <nav-header class="h-[10vh]"></nav-header>
    <div class=" flex-auto h-[90vh] overflow-auto">
      <div class="flex flex-row h-full">
-        <nav-aside ></nav-aside>
+        <!-- <nav-aside ></nav-aside> -->
        <div class="flex-auto overflow-auto h-[90vh] w-[90vw]">
          <router-view>
          </router-view>
@@ -1,4 +1,3 @@
-
 type SessionAction =
  | "join_session"
  | "init_session"
@@ -68,7 +67,7 @@ type AsyncReq = SessionId<
    } | {
      command: StringInclude<"stack", 3>;
    } | {
-      command: `monitor -c ${number} ${string} ${string}`;
+      command: `monitor ${string} ${string} ${string} ${string}`;
    } | {
      command: `trace ${string} ${string}`;
    } | {
@@ -88,6 +87,7 @@ type CommandReq = CommonAction<
      | "sysenv"
      | "version"
      | "sysprop"
+      | `sysprop ${string} ${string}`
      | "pwd"
      | "jvm"
      | "memory"
@@ -114,6 +114,8 @@ type CommandReq = CommonAction<
      | `profiler ${"list" | "status" | "stop" | "resume" | "getSamples"}`
      | `profiler ${string}`
      | `stop`
+      | `options`
+      | `options ${string} ${string}`
      | `ognl ${string}`;
  } | {
    command: StringInclude<"vmoption" | "thread", 2>;
@@ -362,6 +364,12 @@ type TimeFragment = {
  "throwExp": string;
  "timestamp": string;
 };
+type Perfcounter = {
+  name: string;
+  units: string;
+  value: string | number;
+  variability: string;
+};
 type MonitorData = {
  className: string;
  cost: number;
@@ -369,6 +377,15 @@ type MonitorData = {
  methodName: number;
  success: number;
  total: number;
+  timestamp: string;
+};
+type GlobalOptions = {
+  "description": string;
+  "level": number;
+  "name": string;
+  "summary": string;
+  "type": string;
+  "value": string;
 };
 type CommandResult = {
  type: "command";
@@ -402,6 +419,14 @@ type CommandResult = {
  threadStats: never;
  busyThreads: never;
  type: "thread";
+} | {
+  options: GlobalOptions[];
+  changeResult: {
+    "afterValue": unknown,
+    "beforeValue": unknown,
+    "name": string
+};
+  type: "options";
 } | {
  all: boolean;
  threadStateCount: never;
@@ -416,43 +441,23 @@ type CommandResult = {
  memoryInfo: MemoryInfo;
  type: "memory";
 } | {
-  perfCounters: {
-    name: string;
-    units: string;
-    value: string | number;
-    variability: string;
-  }[];
+  perfCounters: Perfcounter[];
  type: "perfcounter";
-  } | {
-    "classLoaderStats": Record<string,Record<"loadedCount"|"numberOfInstance",number>>
-    urlStats: never;
-    urls:never;
-    tree:never;
-    type: "classloader";
 } | {
-  type: "classloader";
+  "classLoaderStats": Record<
+    string,
+    Record<"loadedCount" | "numberOfInstance", number>
+  >;
  urlStats: {
    [x: `{hash":${string},"name:${string}}`]: {
      unUsedUrls: string[];
      usedUrls: string[];
    };
  };
-  "classLoaderStats":never;
-  urls: never;
-  tree: never;
-} | {
-  type: "classloader";
-  urls: never;
-  "classLoaderStats";
-  urlStats:never;
+  urls: string[];
  classLoaders: ClassLoaderNode[];
  tree: boolean;
-} | {
  type: "classloader";
-  urls: string[];
-  urlStats:never;
-  "classLoaderStats":never;
-  tree: never;
 } | {
  classInfo: ClassInfo;
  detailed: true;
@@ -1,12 +1,14 @@
 <script setup lang="ts">
 import { useMachine } from '@xstate/vue';
-import { onBeforeMount, Ref, ref, watchEffect } from 'vue';
+import { computed, onBeforeMount, Ref, ref, watchEffect } from 'vue';
 import { RefreshIcon, LogoutIcon, LoginIcon, MenuIcon, XCircleIcon } from '@heroicons/vue/outline';
 import { fetchStore } from '@/stores/fetch';
 import machine from "@/machines/consoleMachine"
 import { publicStore } from '@/stores/public';
 import { interpret } from 'xstate';
-import { Menu, MenuButton, MenuItems, MenuItem } from '@headlessui/vue'
+import { PuzzleIcon, TerminalIcon, ViewGridIcon } from "@heroicons/vue/outline"
+import { DesktopComputerIcon } from "@heroicons/vue/solid"
+import { useRoute, useRouter } from 'vue-router';
 import permachine from '@/machines/perRequestMachine';
 const fetchM = useMachine(machine)
 const publicS = publicStore()
@@ -22,8 +24,9 @@ const vCmd: CommandReq = {
 const restBtnclass: Ref<'animate-spin-rev-pause' | 'animate-spin-rev-running'> = ref('animate-spin-rev-pause')
 publicS.getCommonResEffect(fetchM, body => {
  const result = body.results[0]
-  if (result.type === "version") version.value = result.version
-})
+  if (result.type === "version") {
+    version.value = result.version
+  }})

 watchEffect(() => {
  if (!fetchS.wait) restBtnclass.value = "animate-spin-rev-pause"
@@ -36,6 +39,7 @@ onBeforeMount(() => {
    value: vCmd
  })
  sessionM.send("INIT")
+  // fetchS.baseSubmit()
 })
 // 手动重来
 const reset = () => {
@@ -72,7 +76,6 @@ const logout = async () => {
  })
  restBtnclass.value = "animate-spin-rev-pause"
 }
-
 const login = async () => {
  sessionM.send("SUBMIT", {
    value: {
@@ -99,59 +102,103 @@ const resetAllClass = () => {
  }).then(response => {
    const result = (response as CommonRes).body.results[0]
    if (result.type === "reset") {
-      publicS.isSuccess=true
-    publicS.SuccessMessage = JSON.stringify(result.affect)
+      publicS.isSuccess = true
+      publicS.SuccessMessage = JSON.stringify(result.affect)
    }

  })
 }
-const tools:[string,()=>void][] = [
+const tabs = [
+  {
+    name: 'dashboard',
+    url: "/dashboard",
+    icon: DesktopComputerIcon
+  },
+  {
+    name: 'immediacy',
+    url: '/synchronize',
+    icon: ViewGridIcon
+  }, {
+    name: "real time",
+    url: '/asynchronize',
+    icon: ViewGridIcon
+  },
+  {
+    name: 'option',
+    url: '/config',
+    icon: PuzzleIcon
+  },
+  {
+    name: 'console',
+    url: '/console',
+    icon: TerminalIcon
+  },
+  {
+    name:'terminal',
+    url:'terminal',
+    icon:TerminalIcon
+  }
+]
+
+const tools: [string, () => void][] = [
  ["forceGc", forceGc],
  ["shutdown", shutdown],
  ["reset class", resetAllClass]
 ]
+const router = useRouter()
+const routePath = computed(() => useRoute().path)
+const toNext = (url: string) => {
+  if(url === "terminal") {
+    window.open("/","_blank")
+  } else router.push(url)
+}
 </script>

 <template>
-  <nav class=" h-[10vh] flex justify-between items-center min-h-max border-b-2 shadow-orange-300">
-    <a class="w-40 flex items-center justify-center" href="https://arthas.aliyun.com/doc/commands.html" target="_blank">
-      <img src="/arthas.png" alt="logo" class=" w-3/4" />
-    </a>
-
-    <div class="flex items-center h-20">
-      <div class=" mr-4 bg-info text-info-content h-12 rounded-full flex justify-center items-center font-bold p-2">
-        sessionId: {{fetchS.sessionId}}</div>
-      <div class=" mr-4 bg-info text-info-content h-12 p-2 rounded-full flex justify-center items-center font-bold">
-        version:{{ version }}
-      </div>
+  <nav class=" h-[10vh] border-b-2 navbar">
+    <div class=" navbar-start flex items-stretch ">
+      <!-- <div class=" indicator mx-3"> -->
+        <a class="flex items-center justify-center mx-2" href="https://arthas.aliyun.com/doc/commands.html"
+          target="_blank">
+          <img src="/arthas.png" alt="logo" class="w-32" />
+        </a>
+        <span class="badge badge-ghost self-end text-sm">v{{version}}</span>
+      <!-- </div> -->
+    </div>
+    <div class="navbar-center">
+      <ul class="menu menu-horizontal p-0">
+        <li v-for="(tab, idx) in tabs" :key="idx" @click="toNext(tab.url)">
+          <a class="break-all" :class="{ 'bg-primary text-primary-content': routePath.includes(tab.url), }">
+            <component :is="tab.icon" class="w-4 h-4" />
+            {{
+            tab.name
+            }}
+          </a>
+        </li>
+      </ul>
+    </div>
+    <div class="flex items-center h-20 navbar-end">
      <button v-if="fetchS.jobRunning" @click.prevent="interruptEvent"
-        class="btn-error btn rounded-full h-1/2 p-2 transition mr-4">interrupt</button>
-      <button class=" rounded-full btn btn-info btn-circle h-12 w-12 flex justify-center items-center mr-4 " @click="reset">
-        <refresh-icon class="h-3/4 w-3/4" :class="restBtnclass" />
+        class="btn-error btn h-1/2 p-2">interrupt</button>
+      <div class="dropdown dropdown-end mr-2">
+        <label tabindex="0" class="btn btn-ghost m-1">
+          <MenuIcon class=" w-6 h-6"></MenuIcon>
+        </label>
+        <ul tabindex="0" class="menu dropdown-content p-2 shadow-xl bg-base-200 rounded-box w-40">
+          <li class="" v-for="(v,i) in tools" :key="i">
+            <a @click.prevent="v[1]">{{v[0]}}</a>
+          </li>
+        </ul>
+      </div>
+      <button class=" btn btn-ghost"
+        :class="{ 'btn-primary': !fetchS.online, 'btn-error': fetchS.online }">
+        <LogoutIcon class="h-6 w-6" @click="logout" v-if="fetchS.online" />
+        <login-icon class="h-6 w-6" @click="login" v-else />
      </button>
-      <button class="hover:opacity-50 h-12 w-12 grid place-items-center  rounded-full mr-2 transition-all"
-        :class="{ 'bg-primary': !fetchS.online, 'bg-error': fetchS.online }">
-        <LogoutIcon class="h-1/2 w-1/2 text-error-content" @click="logout" v-if="fetchS.online" />
-        <login-icon class="h-1/2 w-1/2 text-primary-content" @click="login" v-else />
+      <button class="btn-ghost btn"
+        @click="reset">
+        <refresh-icon class="h-6 w-6" :class="restBtnclass" />
      </button>
-      <Menu as="div" class="relative mr-4">
-        <MenuButton
-          class="w-12 h-12 input-btn-style grid place-items-center rounded-full bg-primary transition">
-          <MenuIcon class="h-3/4 w-3/4 text-primary-content"></MenuIcon>
-          <!-- <XCirleIcon class="h-3/4 w-3/4"></XCirleIcon> -->
-        </MenuButton>
-        <MenuItems class="absolute right-0 top-full input-btn-style mt-4 bg-white px-0 z-10 w-40">
-          <MenuItem v-slot="{ active }" v-for="(v,i) in tools" :key="i">
-          <div :class='{ "bg-blue-500 text-primary-content": active }' class="px-4 py-2">
-            <button @click.prevent="v[1]">{{v[0]}}</button>
-          </div>
-
-          </MenuItem>
-        </MenuItems>
-      </Menu>
    </div>
  </nav>
-</template>
-<style scoped>
-
-</style>
+</template>
@@ -24,9 +24,9 @@ onBeforeMount(()=>{fetchStore().curPolling.close()})
    <Dialog @close="setIsOpen" class="min-w-max z-20">
      <TransitionChild enter="transition-opacity duration-300" enter-from="opacity-0" enter-to="opacity-100"
        leave="transition-opacity duration-300" leave-from="opacity-100" leave-to="opacity-0">
-        <div class="fixed inset-0 bg-black bg-opacity-25" />
+        <div class="fixed inset-0 bg-black bg-opacity-25 z-20" />
      </TransitionChild>
-      <div class="fixed inset-0 grid place-items-center min-w-max">
+      <div class="fixed inset-0 grid place-items-center min-w-max z-30">
        <TransitionChild as="template" enter="duration-300 ease-out" enter-from="opacity-0 scale-95"
          enter-to="opacity-100 scale-100" leave="duration-200 ease-in" leave-from="opacity-100 scale-100"
          leave-to="opacity-0 scale-95">
@@ -8,9 +8,8 @@ import {
  TransitionChild,
  TransitionRoot
 } from '@headlessui/vue'
-import { onMounted, ref, onBeforeMount } from 'vue';
+import { onMounted, ref } from 'vue';
 const store = publicStore()
-const debug = (e: any) => console.log(e)

 const inputV = ref("")
 onMounted(() => {
@@ -20,10 +19,11 @@ onMounted(() => {

 function setIsOpen() {
  store.inputVal = inputV.value
-  console.log(store.inputVal, inputV.value)
+  store.inputE = true
  store.isInput = false
 }
 function setIsOpenCancel() {
+  store.inputE = false
  store.isInput = false
 }
 </script>
@@ -33,9 +33,9 @@ function setIsOpenCancel() {
    <Dialog @close="setIsOpenCancel" class="min-w-max z-20">
      <TransitionChild enter="transition-opacity duration-300" enter-from="opacity-0" enter-to="opacity-100"
        leave="transition-opacity duration-300" leave-from="opacity-100" leave-to="opacity-0">
-        <div class="fixed inset-0 bg-black bg-opacity-25" />
+        <div class="fixed inset-0 bg-black bg-opacity-25 z-20" />
      </TransitionChild>
-      <div class="fixed inset-0 grid place-items-center min-w-max">
+      <div class="fixed inset-0 grid place-items-center min-w-max z-30">
        <TransitionChild as="template" enter="duration-300 ease-out" enter-from="opacity-0 scale-95"
          enter-to="opacity-100 scale-100" leave="duration-200 ease-in" leave-from="opacity-100 scale-100"
          leave-to="opacity-0 scale-95">
@@ -22,9 +22,9 @@ function setIsOpen(value: boolean) {
    <Dialog @close="setIsOpen" class="min-w-max z-20">
      <TransitionChild enter="transition-opacity duration-300" enter-from="opacity-0" enter-to="opacity-100"
        leave="transition-opacity duration-300" leave-from="opacity-100" leave-to="opacity-0">
-        <div class="fixed inset-0 bg-black bg-opacity-25" />
+        <div class="fixed inset-0 bg-black bg-opacity-25 z-20" />
      </TransitionChild>
-      <div class="fixed inset-0 grid place-items-center min-w-max">
+      <div class="fixed inset-0 grid place-items-center min-w-max z-30">
        <TransitionChild as="template" enter="duration-300 ease-out" enter-from="opacity-0 scale-95"
          enter-to="opacity-100 scale-100" leave="duration-200 ease-in" leave-from="opacity-100 scale-100"
          leave-to="opacity-0 scale-95">
@@ -29,9 +29,9 @@
      <Dialog @close="setIsOpenCancel" class="min-w-max min-h-max z-20">
        <TransitionChild enter="transition-opacity duration-300" enter-from="opacity-0" enter-to="opacity-100"
          leave="transition-opacity duration-300" leave-from="opacity-100" leave-to="opacity-0">
-          <div class="fixed inset-0 bg-black bg-opacity-25" />
+          <div class="fixed inset-0 bg-black bg-opacity-25 z-20" />
        </TransitionChild>
-        <div class="fixed inset-0 grid place-items-center min-w-max">
+        <div class="fixed inset-0 grid place-items-center min-w-max z-30">
          <TransitionChild as="template" enter="duration-300 ease-out" enter-from="opacity-0 scale-95"
            enter-to="opacity-100 scale-100" leave="duration-200 ease-in" leave-from="opacity-100 scale-100"
            leave-to="opacity-0 scale-95">
@@ -91,7 +91,7 @@ const blurF = (event:Event)=>{
            'bg-blue-600 text-white': selected,
            'text-gray-900': !active && !selected,
          }">
-            <span class="block truncate"
+            <span class="block"
              :class="{ 'font-medium': selected, 'font-normal': !selected, 'text-white': active, 'text-teal-600': !active && !selected }">
              {{ item.name }}
            </span>
@@ -84,7 +84,7 @@ const setExpress = publicStore().inputDialogFactory(
  raw => raw,
  _ => _.value
 )
-
+const { increase, decrease } = publicStore().numberCondition(autoStop, { min: 0, max: 100 })

 const filterfn = (_: any, item: Item) => true
 </script>
@@ -95,9 +95,16 @@ const filterfn = (_: any, item: Item) => true
    <AutoComplete label="method" :option-items="optionMethod"
      :input-fn="(value: string) => changeMethod(slotClass.selectItem.value as string, value)" :filter-fn="filterfn"
      v-slot="slotMethod">
-      <button v-if="nexpress" class="btn btn-sm btn-outline ml-2" @click="setExpress">express:{{express}}</button>
-      <button v-if="ncondition" class="btn btn-sm btn-outline ml-2" @click="setConditon">condition:{{conditon}}</button>
-      <button v-if="ncount" class="btn btn-sm btn-outline ml-2" @click="setCount">count:{{autoStop}}</button>
+      <button v-if="nexpress" class="btn btn-sm btn-outline ml-2"
+        @click.prevent="setExpress">express: <span class="normal-case">{{express}}</span></button>
+      <button v-if="ncondition" class="btn btn-sm btn-outline ml-2"
+        @click.prevent="setConditon">condition: <span class="normal-case">{{conditon}}</span></button>
+      <div class="btn-group ml-2" v-if="ncount">
+        <button class="btn btn-sm btn-outline" @click.prevent="decrease">-</button>
+        <button class="btn btn-sm btn-outline border-x-0" @click.prevent="setCount">count:{{autoStop}}</button>
+        <button class="btn btn-sm btn-outline" @click.prevent="increase">+</button>
+      </div>
+
      <slot name="others" :methodItem="slotMethod.selectItem" :classItem="slotClass.selectItem"></slot>
      <button @click.prevent="submitF({
      classItem: slotClass.selectItem, 
@@ -1,57 +0,0 @@
-<script setup lang="ts">
-import { computed, reactive, ref } from 'vue';
-import { PuzzleIcon, TerminalIcon, ViewGridIcon } from "@heroicons/vue/outline"
-import { DesktopComputerIcon } from "@heroicons/vue/solid"
-import { useRoute, useRouter } from 'vue-router';
-const tabs = [
-  {
-    name: 'dashboard',
-    url: "/dashboard",
-    icon: DesktopComputerIcon
-  },
-  {
-    name: 'immediacy',
-    url: '/synchronize',
-    icon: ViewGridIcon
-  }, {
-    name: "real time",
-    url: '/asynchronize',
-    icon: ViewGridIcon
-  },
-  {
-    name: 'option',
-    url: '/config',
-    icon: PuzzleIcon
-  },
-  // {
-  //   name: 'console',
-  //   url: '/console',
-  //   icon: TerminalIcon
-  // },
-
-]
-const router = useRouter()
-const routePath = computed(() => useRoute().path)
-const toNext = (url: string) => {
-  router.push(url)
-}
-const a: StatusResult = { type: "status", message: "", statusCode: 0 }
-</script>
-
-<template>
-  <ul class="menu bg-base-200 w-[10vw] menu-compact">
-    <li v-for="(tab, idx) in tabs" :key="idx" 
-      @click="toNext(tab.url)" class="pl-2" >
-      <a class="break-all" :class="{ 'bg-primary text-primary-content': routePath.includes(tab.url), }">
-        <component :is="tab.icon" class="w-4 h-4" />
-        {{
-        tab.name
-        }}
-      </a>
-    </li>
-  </ul>
-</template>
-
-<style scoped>
-
-</style>
@@ -11,7 +11,7 @@ const routePath = computed(() => route.path)
 </script>

 <template>
-  <ul class=" w-[10vw] menu bg-base-300 menu-compact">
+  <ul class=" w-[10vw] menu bg-base-200 menu-compact">
    <li v-for="(v, i) in routes" :key="i">
      <a @click="() => router.push(v.url)" :class='{"bg-secondary text-secondary-content":routePath.includes(v.url)}'>
        {{ v.cmd }}
@@ -19,7 +19,9 @@ if (result.type === "enhancer") {
        <div class="stat-title">{{kv[0]}}</div>
        <div class="stat-value">{{kv[1]}}</div>
      </div>
+      <slot name="otherStat">

+      </slot>
    </div>
 </template>

@@ -406,8 +406,19 @@ const machine =
                  result.message ===
                    "all consumers are unhealthy, current job was interrupted."
                ) {
+                  
                  return false;
                }
+                if (
+                  result.type === "options" &&
+                  Object.hasOwn(result, "changeResult") &&
+                  result.changeResult.afterValue === result.changeResult.beforeValue &&
+                  (result.changeResult.afterValue as string).toString() !== (context.inputValue as CommandReq).command.split(" ")[2]
+                ) {
+                  console.log("?????")
+                  // arthas 本身不会对 options抛错，得手动抛错
+                  return false
+                }
                return true;
              });
            } else {
@@ -276,8 +276,8 @@ const permachine = createMachine({
          isErr: true,
          ErrMessage: context.err,
        });
-      } else{
-        console.error(context.err)
+      } else {
+        console.error(context.err);
      }
      return {
        err: "",
@@ -302,14 +302,13 @@ const permachine = createMachine({
      };
    }),
    needReportSuccess: (context, e) => {
-      
      if (context.inputValue?.action === "close_session") {
        context.fetchStore.$patch({
          sessionId: "",
          consumerId: "",
          online: false,
        });
-        if(context.publicStore.ignore) return;
+        if (context.publicStore.ignore) return;
        context.publicStore.$patch({
          isSuccess: true,
          SuccessMessage: `close session success!`,
@@ -323,7 +322,7 @@ const permachine = createMachine({
          consumerId: response.consumerId,
          online: true,
        });
-        if(context.publicStore.ignore) return;
+        if (context.publicStore.ignore) return;
        context.publicStore.$patch({
          isSuccess: true,
          SuccessMessage: `init_session success!`,
@@ -391,7 +390,27 @@ const permachine = createMachine({
        if (Object.hasOwn(event.data, "body")) {
          if (Object.hasOwn(event.data.body, "results")) {
            return (event.data as CommonRes).body.results.every((result) => {
-              return result.type === "status" ? result.statusCode === 0 : true;
+              if (result.type === "status" && result.statusCode !== 0) {
+                return false;
+              }
+              if (
+                result.type === "message" &&
+                result.message ===
+                  "all consumers are unhealthy, current job was interrupted."
+              ) {
+                return false;
+              }
+              if (
+                result.type === "options" &&
+                Object.hasOwn(result, "changeResult") &&
+                (result.changeResult.afterValue as string).toString() !==
+                  (context.inputValue as CommandReq).command.split(" ")[2]
+              ) {
+                // console.warn("?????");
+                // arthas 本身不会对 options抛错，得手动抛错
+                return false;
+              }
+              return true;
            });
          } else {
            return ["READY", "TERMINATED"].includes(
@@ -8,11 +8,31 @@ const routes: RouteRecordRaw[] = [
  {
    path: "/config",
    component: () => import("@/views/Config.vue"),
+    children:[
+      {
+        path:"",
+        redirect:"/config/perCounter"
+      },  {
+        path: "perCounter",
+        component:()=>import("@/views/config/PerCounter.vue")
+      },{
+        path:"sysenv",
+        component:()=>import("@/views/config/Sysenv.vue")
+      },{
+        path:"sysprop",
+        component:()=>import("@/views/config/Sysprop.vue")
+      },{
+        path:"jvm",
+        component:()=>import("@/views/config/Jvm.vue")
+      },{
+        path:"vmoption",
+        component:()=>import("@/views/config/Vmoption.vue")
+      },{
+        path:"options",
+        component:()=>import("@/views/config/Options.vue")
+      }
+    ]
  },
-  // {
-  //   path: "/console",
-  //   component: () => import("@/views/Console.vue"),
-  // },
  {
    path: "/dashboard",
    component: () => import("@/views/DashBoard.vue"),
@@ -29,18 +49,15 @@ const routes: RouteRecordRaw[] = [
        path: "thread",
        component: () => import("@/views/sync/Thread.vue"),
      },
-      // {
-      //   path: "memory",
-      //   component: () => import("@/views/sync/Memory.vue"),
-      // },
      {
        path: "jad",
        component: () => import("@/views/sync/Jad.vue"),
      },
-      {
-        path: "retransform",
-        component: () => import("@/views/sync/Retransform.vue"),
-      },
+      
+      // {
+      //   path: "retransform",
+      //   component: () => import("@/views/sync/Retransform.vue"),
+      // },
      {
        path: "mbean",
        component: () => import("@/views/sync/Mbean.vue"),
@@ -110,6 +127,9 @@ const routes: RouteRecordRaw[] = [
        component: ()=>import("@/views/async/Profiler.vue")
      }
    ],
-  },
+  },{
+    path:"/console",
+    component:()=>import("@/views/Console.vue")
+  }
 ];
 export default routes;
@@ -51,6 +51,8 @@ export const fetchStore = defineStore("fetch", {
    jobIdSet: new Set<string>(),
    //由于轮询只会轮询一个命令，可以直接挂载当前的轮询机
    curPolling: nullLoop,
+    //获取osName 通过dashboard
+    osName:""
  }),
  getters: {
    getRequest: (state) =>
@@ -23,6 +23,10 @@ export const publicStore = defineStore("public", { // Public项目唯一id
     */
    isInput: false,
    inputVal: "",
+    /**
+     * inputE是输入事件，true代表导入输入，false代表不导入输入
+     */
+    inputE: false,
    ErrMessage: "bug!!!",
    isSuccess: false,
    SuccessMessage: "bug!!!",
@@ -59,10 +63,9 @@ export const publicStore = defineStore("public", { // Public项目唯一id
      });
    },
    /**
-     * 
     * @param inputRef 组件提供的值的存储区
-     * @param getVal 从inputRef到全局缓冲区的处理流程
-     * @param setVal 冲缓冲区到inputRef的处理流程
+     * @param getVal 从缓冲区到inputRef的处理流程
+     * @param setVal 从inputRef到全局缓冲区的处理流程
     * @returns 独占缓冲区函数
     */
    inputDialogFactory<T = string>(
@@ -75,14 +78,18 @@ export const publicStore = defineStore("public", { // Public项目唯一id
      // 发布订阅模式，把函数的闭包里的mutex和缓冲区的锁注册到vue上
      watchEffect(() => {
        if (mutex.value && !this.isInput) {
-          //先上锁，防止再次触发该副作用           
+          //先上锁，防止再次触发该副作用
          mutex.value = false;
          // 把缓冲区的值输入到需要使用的组件里
-          inputRef.value = getVal(this.inputVal);
+          // 触发确认输入事件再输入
+          if(this.inputE) inputRef.value = getVal(this.inputVal);
+          // reset
+          this.inputE = false;
          // 清空缓冲区
          this.inputVal = "";
        }
      });
+
      return () => {
        this.$patch({
          // 打开缓冲区
@@ -94,6 +101,19 @@ export const publicStore = defineStore("public", { // Public项目唯一id
        mutex.value = true;
      };
    },
+    numberCondition(
+      raw: Ref<number>,
+      scope: { min?: number; max?: number },
+    ) {
+      return {
+        increase() {
+          (scope.max === undefined || raw.value < scope.max) && raw.value++;
+        },
+        decrease() {
+          (scope.min === undefined || raw.value > scope.min) && raw.value--;
+        },
+      };
+    },
    nanoToMillis(nanoSeconds: number): number {
      return nanoSeconds / 1000000;
    },
@@ -1,168 +1,35 @@
 <script setup lang="ts">
-import machine from '@/machines/consoleMachine';
-import { useInterpret, useMachine } from '@xstate/vue';
-import { onBeforeMount, reactive, ref, watchEffect } from 'vue';
-import OptionConfigMenu from '@/components/show/OptionConfigMenu.vue';
-import SwitchInput from '@/components/input/SwitchInput.vue';
-import { publicStore } from '@/stores/public';
-import CmdResMenu from '@/components/show/CmdResMenu.vue';
-import { fetchStore } from '@/stores/fetch';
-import permachine from '@/machines/perRequestMachine';
-const fetchS = fetchStore()
-const sysEnvMap = reactive(new Map<string, string[]>())
-const sysPropMap = reactive(new Map<string, string[]>())
-const perfcounterMap = reactive(new Map<string, string[]>())
-const vmOptionM = useMachine(machine)
-const pwd = ref("?")
-const vmOptionMTree = reactive([] as VmOption[])
+import SelectCmd from '@/components/routeTo/SelectCmd.vue';
 // 初始化
-onBeforeMount(() => {
-  fetchS.baseSubmit(useInterpret(permachine), {
-    action: "exec",
-    command: "pwd"
-  }).then(
-    res => {
-      const result = (res as CommonRes).body.results[0]
-      if (result.type == "pwd") {
-        pwd.value = result.workingDir
-      }
-    }
-  )
-
-  vmOptionM.send("INIT")
-  vmOptionM.send({
-    type: "SUBMIT",
-    value: {
-      action: "exec",
-      command: "vmoption"
-    }
-  })
-})
-
-
-// 处理展示的树形数据
-const handleTree = (data: Record<string, string | boolean | number>, map: Map<string, string[]>): string[] => {
-  map.clear()
-  let res: string[] = []
-  Object.entries(data).forEach(([k, v]) => {
-    res.push(k)
-    if (typeof v === "boolean") v = v.toString()
-    if (typeof v === "number") v = v.toString()
-    if (k.toLowerCase().includes("path")) {
-      map.set(k, v.split(":").filter(v => v.trim() !== ''))
-    } else if (v.includes(";")) {
-      map.set(k, v.split(";").filter(v => v.trim() !== ''))
-    } else {
-      map.set(k, [v])
-    }
-  })
-  return res
-}
-
-const handleEnvTree = (data: Record<string, string>) => handleTree(data, sysEnvMap)
-
-const handlePropTree = (data: Record<string, string>) => handleTree(data, sysPropMap)
-
-
-watchEffect(() => {
-  const response = vmOptionM.state.value.context.response
-  if (response) {
-    if (Object.hasOwn(response, "body")) {
-      console.log(response, "vmoption")
-      const result = (response as CommonRes).body.results[0]
-
-      if (result.type == "vmoption") {
-        // 先clear一下之前的东西
-        vmOptionMTree.length = 0
-        console.log(result.vmOptions, "watchEffect!!!")
-        result.vmOptions.forEach(v => {
-          vmOptionMTree.push(v)
-        })
-      }
-    }
+const routes: { cmd: string, url: string }[] = [
+  {
+    cmd: "JVM",
+    url: "jvm"
+  },{
+    cmd:"system property",
+    url:"sysprop"
+  },{
+    cmd:"system environment variables",
+    url:"sysenv"
+  },{
+    cmd:"JVM Perf Counter information",
+    url:"PerCounter"
+  },{
+    cmd:"JVM diagnostic options",
+    url:"vmoption"
+  },{
+    cmd:"global options",
+    url:"options"
  }
-})
-const vmOptionSend = (pre: string) => (v: { key: string, value: boolean | string }) => {
-  if (pre === "HeapDumpPath" && v.value === "") {
-    publicStore().$patch({ ErrMessage: "HeapDumpPath can't be set \"\" ", isErr: true })
-    return
-  } vmOptionM.send({
-    type: 'SUBMIT', value: {
-      action: "exec",
-      command: `vmoption ${pre} ${v.value === "" ? '\"\"' : v.value}`
-    }
-  })
-}
-
-const jvmMap = reactive(new Map<string, string[]>())
-
-const getJvm = () => fetchS.baseSubmit(useInterpret(permachine), {
-  action: "exec",
-  command: "jvm"
-}).then(res => {
-  const result = (res as CommonRes).body.results[0]
-  if (result.type === "jvm") {
-    jvmMap.clear()
-    Object.entries(result.jvmInfo).forEach(([k, v]) => {
-      jvmMap.set(k, v.map(v => `${v.name} : ${v.value}`))
-    })
-  }
-})
-const getSysenv = () => fetchS.baseSubmit(useInterpret(permachine), {
-  action: "exec",
-  command: "sysenv",
-}).then(res => {
-  let result = (res as CommonRes).body.results[0]
-  if (result.type == "sysenv") {
-    handleEnvTree(result.env)
-  }
-})
-const getSysprop = () => fetchS.baseSubmit(useInterpret(permachine), {
-  action: "exec",
-  command: "sysprop",
-}).then(res => {
-  let result = (res as CommonRes).body.results[0]
-  if (result.type == "sysprop") {
-    handlePropTree(result.props)
-  }
-})
-
-
-const getPerCounter = () => fetchS.baseSubmit(useInterpret(permachine), { action: "exec", command: "perfcounter -d" }).then(res => {
-  const result = (res as CommonRes).body.results[0]
-  if (result.type === "perfcounter") {
-    const perfcounters = result.perfCounters
-    perfcounterMap.clear()
-    perfcounters.forEach(v => {
-      perfcounterMap.set(v.name, Object.entries(v).filter(v => v[0] !== "name").map(([key, value]) => `${key} : ${value}`))
-    })
-  }
-})
+]
 </script>

 <template>
-  <div class="p-2 h-[90vh] overflow-y-scroll">
-    <article>
-      <div class="flex items-center">
-        <div class="btn-info btn my-2 btn-sm normal-case">workingDir</div>
-        <div class="bg-base-200 w-full text-base-content pl-2"> {{ pwd }}</div>
-      </div>
-      <CmdResMenu title="sysenv" :map="sysEnvMap" @click="getSysenv" />
-      <CmdResMenu title="sysprop" :map="sysPropMap" @click="getSysprop" />
-      <option-config-menu title="vmOption" :list="vmOptionMTree" title-key-name="name">
-        <template #item="{ kv, itemTitle, idx }">
-          <switch-input :send="vmOptionSend(itemTitle)" :data="{ key: kv[0], value: kv[1] }" v-if="kv[0] === 'value'"
-            :class="{ 'border-t-4': (idx > 0), 'border-base-100': (idx > 0) }">
-          </switch-input>
-          <div v-else class="flex " :class="{ 'border-t-4': (idx > 0), 'border-base-100': (idx > 0) }">
-            <div class="bg-blue-200 w-1/5 p-1">{{ kv[0] }}</div>
-            <div class="grid place-items-center w-3/5">{{ kv[1] }}</div>
-          </div>
-        </template>
-      </option-config-menu>
-      <CmdResMenu title="jvm" :map="jvmMap" class="w-full" @click="getJvm" />
-      <CmdResMenu title="perfcounter" :map="perfcounterMap" @click="getPerCounter" />
-    </article>
+  <div class="h-[90vh] overflow-auto flex">
+  <SelectCmd :routes="routes"></SelectCmd>
+    <div class="overflow-auto py-2 w-full flex flex-col flex-1 pointer-events-auto">
+      <RouterView></RouterView>
+    </div>
  </div>
 </template>

@@ -15,14 +15,12 @@ onBeforeMount(()=>{
 })

 const submitCommand = ()=>{
-  console.log('别报错了')
  fetchM.send({ type: 'SUBMIT', value: val.value})
 }
-
 </script>

 <template>
-  <div class="flex flex-col p-2">
+  <div class="flex flex-col ">
    <form class="h-[10vh] flex items-center border shadow" @submit.prevent="submitCommand">
      <label for="command-input" class=" m-2 ">command:</label>
      <div class=" flex-auto grid place-items-start">
@@ -47,4 +45,4 @@ const submitCommand = ()=>{
 </template>

 <style scoped>
-</style>·
+</style>
@@ -181,6 +181,7 @@ const setPri = publiC.inputDialogFactory(
  },
  (input) => input.value.toString(),
 )
+const { increase, decrease } = publiC.numberCondition(pri, { min: 1 })
 const transformRuntimeInfo = (result: ArthasResResult) => {
  if (result.type !== "dashboard") return;
  for (const key in result.runtimeInfo as RuntimeInfo) {
@@ -457,23 +458,30 @@ onBeforeUnmount(async () => {
      <div id="nonheapMemory" class="w-80 h-80 flex-1 input-btn-style mr-4"></div>
      <div id="bufferPoolMemory" class="w-80 h-80 flex-1 input-btn-style"></div>
    </div>
+
    <div class="w-full flex justify-start items-start flex-1">
      <div id="gc-info" class="w-[40rem] h-80 input-btn-style p-2 mr-4"></div>
-      <div class="input-btn-style overflow-auto flex-1 h-80">
+      <div class="input-btn-style flex-1 h-80 overflow-auto w-0">
        <div class="flex justify-end mb-2">
-
-          <button class="btn btn-sm btn-outline" @click="setPri">limit:{{pri}}</button>
+          <div class="btn-group">
+            <button class="btn btn-sm btn-outline" @click="decrease">-</button>
+            <button class="btn btn-sm btn-outline border-x-0" @click="setPri">limit:{{pri}}</button>
+            <button class="btn btn-sm btn-outline" @click="increase">+</button>
+          </div>
        </div>
        <div class="overflow-x-auto">
-          <table class="table table-compact w-full group">
+          <table class="table table-compact w-full">
            <thead>
              <tr>
-                <th class="border-slate-300" v-for="(v,i) in keyList" :key="i" :class="{'group-first:z-0':i==0}">{{v}}</th>
+                <th></th>
+                <th v-for="(v,i) in keyList" :key="i" class="normal-case">{{v}}
+                </th>
              </tr>
            </thead>
-            <tbody class="">
-              <tr v-for="(map, i) in tableResults" :key="i">
-                <td class="border border-slate-300" v-for="(key,j) in keyList" :key="j">
+            <tbody>
+              <tr v-for="(map, i) in tableResults" :key="i" class="hover">
+                <th>{{i + 1}}</th>
+                <td v-for="(key,j) in keyList" :key="j">
                  {{map.get(key)}}
                </td>
              </tr>
@@ -16,9 +16,9 @@ const routes: { cmd: string, url: string }[] = [
  }, {
    cmd: "jad",
    url: "jad"
-  }, {
-    cmd: "retransform",
-    url: "retransform"
+  // }, {
+  //   cmd: "retransform",
+  //   url: "retransform"
  }, {
    cmd: "mbean",
    url: "mbean"
@@ -40,7 +40,7 @@ import {
 import {
  SVGRenderer
 } from 'echarts/renderers';
-import { ECharts} from 'echarts/core';
+import { ECharts } from 'echarts/core';

 echarts.use(
  [TitleComponent, ToolboxComponent, TooltipComponent, GridComponent, LegendComponent, DataZoomComponent, BarChart, LineChart, SVGRenderer, UniversalTransition]
@@ -63,12 +63,16 @@ const modelist: { name: string, value: string }[] = [
 ]
 const mode = ref(modelist[1])

+const averageRT = ref({
+  totalCost: 0,
+  totalCount: 0,
+})

 const chartContext: {
  count: number,
  myChart?: ECharts,
  costChart?: ECharts,
-  categories: number[],
+  categories: string[],
  data: number[],
  cur: number,
  max: number,
@@ -85,7 +89,7 @@ const chartContext: {
  successData: [],
  failureData: [],
 }
-for (let i = 0; i < chartContext.count; i++) { chartContext.categories[i] = i + 1 }
+// for (let i = 0; i < chartContext.count; i++) { chartContext.categories[i] = i + 1 }

 const chartOption = {
  tooltip: {
@@ -107,8 +111,12 @@ const chartOption = {
  xAxis: [
    {
      type: 'category',
-      boundaryGap: true,
-      data: chartContext.categories
+      data: chartContext.categories,
+      axisLabel: {
+        formatter(value: string) {
+          return value.split(" ")[1]
+        }
+      }
    }
  ],
  yAxis: [{
@@ -154,23 +162,26 @@ const costOption = {
  xAxis: [
    {
      type: 'category',
-      boundaryGap: true,
-      data: chartContext.categories
+      data: chartContext.categories,
+      axisLabel: {
+        formatter(value: string) {
+          return value.split(" ")[1]
+        }
+      }
    }
  ],
  yAxis: [
    {
      type: 'value',
      scale: true,
-      name: 'cost(ms)',
+      name: 'rt(ms)',
      min: 0,
-      boundaryGap: [0.2, 0.2]
    }
  ],
  series: [
    {
-      name: 'cost',
-      type: 'bar',
+      name: 'rt',
+      type: 'line',
      data: chartContext.data
    }
  ]
@@ -180,11 +191,13 @@ const updateChart = (data: MonitorData) => {
    chartContext.data.shift()
    chartContext.successData.shift()
    chartContext.failureData.shift()
+    chartContext.categories.shift()
    chartContext.cur--
  }
-  chartContext.data.push(data.cost)
+  chartContext.data.push(data.cost / data.total)
  chartContext.failureData.push(data.failed)
  chartContext.successData.push(data.success)
+  chartContext.categories.push(data.timestamp)
  chartContext.cur++

  chartContext.myChart!.setOption<EChartsOption>({
@@ -286,15 +299,16 @@ onBeforeUnmount(() => {
 const submit = async (data: { classItem: Item, methodItem: Item, conditon: string }) => {
  enhancer.value = undefined
  // tableResults.length = 0
-
+  averageRT.value.totalCost =0
+  averageRT.value.totalCount = 0
  let condition = data.conditon.trim() == "" ? "" : `'${data.conditon.trim()}'`
  let cycle = `-c ${cycleV.value}`
  fetchS.baseSubmit(fetchM, {
    action: "async_exec",
-    command: `monitor -c 5 ${data.classItem.value} ${data.methodItem.value} ${condition}`,
+    command: `monitor ${cycle} ${data.classItem.value as string} ${data.methodItem.value} ${condition}`,
    sessionId: undefined
  }).then(
-    res => loop.open()
+    _res => loop.open()
  )
 }
 </script>
@@ -321,7 +335,9 @@ const submit = async (data: { classItem: Item, methodItem: Item, conditon: strin
      <button class="btn btn-sm btn-outline" @click="changeCycle">cycle time:{{cycleV}}</button>
    </template>
  </MethodInput>
-  <Enhancer :result="enhancer" v-if="enhancer" class="mb-4"></Enhancer>
+  <Enhancer :result="enhancer" v-if="enhancer" class="mb-4">
+
+  </Enhancer>
  <div id="monitorchart" class="input-btn-style h-60 w-full pointer-events-auto transition mb-2"></div>
  <div id="monitorchartcost" class="input-btn-style h-60 w-full pointer-events-auto transition"></div>

@@ -19,7 +19,7 @@ let eventList = reactive([] as string[]);
 let selectEvent = ref("cpu")
 let includesVal = reactive(new Set<string>())
 let excludesVal = reactive(new Set<string>())
-let framebuf = ref(1000000)
+let framebuf = ref(1_000_000)
 let duration = ref(300)
 let profilerStatus = ref({
  is: false,
@@ -29,6 +29,7 @@ let outputPath = ref("")
 let samples = ref(0)
 const support = ref(false)
 let fileformat = ref("%t-%p.html")
+
 const getStatusLoop = fetchS.getPollingLoop(() => {
  const statusM = interpret(permachine)
  fetchS.baseSubmit(statusM, {
@@ -55,7 +56,8 @@ const getStatusLoop = fetchS.getPollingLoop(() => {
 }, {
  step: 2000,
 })
-
+const handleFramebuf = publicS.numberCondition(framebuf, {})
+const handleduration = publicS.numberCondition(duration, {})
 const getSampleLoop = fetchS.getPollingLoop(() => {
  let statusM = interpret(permachine)
  fetchS.baseSubmit(statusM, {
@@ -227,8 +229,16 @@ onBeforeUnmount(() => {
          </ListboxOptions>
        </div>
      </Listbox>
-      <button class="btn btn-sm btn-outline mr-2" @click="changeDuration">duration :{{duration}}</button>
-      <button class="btn btn-sm btn-outline mr-2" @click="changeFramebuf">framebuf :{{framebuf}}</button>
+      <div class="btn-group mr-2">
+        <button class="btn btn-sm btn-outline" @click.prevent="handleduration.decrease">-</button>
+        <button class="btn btn-sm btn-outline border-x-0" @click.prevent="changeDuration">duration :{{duration}}</button>
+        <button class="btn btn-sm btn-outline" @click.prevent="handleduration.increase">+</button>
+      </div>
+      <div class="btn-group mr-2">
+        <button class="btn btn-sm btn-outline" @click.prevent="handleFramebuf.decrease">-</button>
+        <button class="btn btn-sm btn-outline border-x-0" @click.prevent="changeFramebuf">framebuf :{{framebuf}}</button>
+        <button class="btn btn-sm btn-outline" @click.prevent="handleFramebuf.increase">+</button>
+      </div>
      <button class="btn btn-sm btn-outline mr-2" @click="changeFile">file :<span
          class="normal-case">{{fileformat}}</span></button>
      <TodoList title="include" :val-set="includesVal" class=" mr-2"></TodoList>
@@ -91,16 +91,18 @@ const submit = async (data: { classItem: Item, methodItem: Item, conditon: strin
  <MethodInput :submit-f="submit" ncondition ncount></MethodInput>

    <Enhancer :result="enhancer" v-if="enhancer"></Enhancer>
-    <div class="w-full flex justify-center items-center mt-4">
-      <table class="table w-full table-compact group">
+    <div class="mt-4 overflow-x-auto w-full">
+      <table class="table w-full table-compact">
        <thead>
          <tr>
-            <th class="border border-slate-300" v-for="(v,i) in keyList" :key="i" :class="{'group-first:z-0':i===0}">{{v}}</th>
+            <th></th>
+            <th v-for="(v,i) in keyList" :key="i">{{v}}</th>
          </tr>
        </thead>
        <tbody class="">
          <tr v-for="(map, i) in tableResults" :key="i">
-            <td class="border border-slate-300" v-for="(key,j) in keyList" :key="j">
+            <th>{{i + 1}}</th>
+            <td v-for="(key,j) in keyList" :key="j">
              <template v-if="key!== 'stackTrace'">
                {{map.get(key)}}
              </template>
@@ -113,6 +115,12 @@ const submit = async (data: { classItem: Item, methodItem: Item, conditon: strin
            </td>
          </tr>
        </tbody>
+        <tfoot>
+          <tr>
+            <th></th>
+            <th v-for="(v,i) in keyList" :key="i">{{v}}</th>
+          </tr>
+        </tfoot>
      </table>
    </div>

@@ -126,7 +126,7 @@ const submit = (data: { classItem: Item, methodItem: Item, conditon: string, cou
  <MethodInput :submit-f="submit" class="mb-2" ncondition ncount>
    <template #others>

-      <label class="label cursor-pointer btn-sm border border-neutral ml-2">
+      <label class="label cursor-pointer btn-sm ml-2">
          <span class="label-text uppercase font-bold mr-1">skip JDK Method</span>
          <input v-model="enabled" type="checkbox" class="toggle"/>
        </label>
@@ -173,7 +173,7 @@ const transform = (tf: TimeFragment) => {
    } else {
      val = (tf[k as tfkey].toString())
    }
-    
+
    map.set(k, val)
  })
  updateChart(tf)
@@ -187,9 +187,9 @@ getPullResultsEffect(
        console.log(tf.index)
        // if(!timeFragmentSet.has(tf.index)){
        //   timeFragmentSet.add(tf.index)
-          tableResults.unshift(transform(tf))
+        tableResults.unshift(transform(tf))
        // }
-        
+
      })
    }
    if (result.type == "enhancer") {
@@ -291,7 +291,7 @@ const searchTt = () => {
        tableResults.unshift(transform(tf))
      })
    }
-  }).catch(err=>{
+  }).catch(err => {
    console.error(err)
  })
 }
@@ -327,35 +327,42 @@ const searchTt = () => {
        </template>
      </CmdResMenu>
    </div>
-      <Enhancer :result="enhancer" v-if="enhancer"></Enhancer>
-      <div class="w-full flex justify-center items-center overflow-auto flex-1">
-        <table class="table table-compact group w-full">
-          <thead>
-            <tr>
-              <th class="border group-first:z-0" v-for="(v,i) in keyList" :key="i">{{v}}</th>
-              <th class="border">invoke</th>
-            </tr>
-          </thead>
-          <tbody class="">
-            <tr v-for="(map, i) in tableResults" :key="i">
-              <td class="border" v-for="(key,j) in keyList" :key="j">
-                <template v-if=" key !== 'params'">
-                  {{map.get(key)}}
-                </template>
+    <Enhancer :result="enhancer" v-if="enhancer">
+    </Enhancer>
+    <div class="overflow-x-auto w-full">
+      <table class="table table-compact w-full">
+        <thead>
+          <tr>
+            <th></th>
+            <th class="normal-case" v-for="(v,i) in keyList" :key="i">{{v}}</th>
+          </tr>
+        </thead>
+        <tbody class="">
+          <tr v-for="(map, i) in tableResults" :key="i">
+            <th class="">
+              <button class="btn btn-primary btn-sm btn-outline" @click="reTrigger(map.get('index')!)">invoke</button>
+            </th>
+            <td class="" v-for="(key,j) in keyList" :key="j">
+              <template v-if=" key !== 'params'">
+                {{map.get(key)}}
+              </template>

-                <div class="flex flex-col" v-else>
-                  <div v-for="(row, k) in map.get(key)" :key="k">
-                    {{row}}
-                  </div>
+              <div class="flex flex-col" v-else>
+                <div v-for="(row, k) in map.get(key)" :key="k">
+                  {{row}}
                </div>
-              </td>
-              <td class="border">
-                <button class="btn btn-primary btn-sm btn-outline" @click="reTrigger(map.get('index')!)">invoke</button>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
+              </div>
+            </td>
+          </tr>
+        </tbody>
+        <tfoot>
+          <tr>
+            <th></th>
+            <th class="normal-case" v-for="(v,i) in keyList" :key="i">{{v}}</th>
+          </tr>
+        </tfoot>
+      </table>
+    </div>
  </div>

 </template>
@@ -18,6 +18,7 @@ const pollResults = reactive([] as [string, Map<string, string[]>, TreeNode][])
 const enhancer = ref(undefined as EnchanceResult | undefined)
 const depth = ref(1)
 const tableResults = reactive([] as Map<string, string | TreeNode>[])
+const { increase, decrease } = publiC.numberCondition(depth, { min: 1, max: 6 })
 const keyList = [
  "ts",
  "accessPoint",
@@ -150,7 +151,8 @@ const submit = async (data: { classItem: Item, methodItem: Item, conditon: strin
    <template #others>
      <div class="relative group ml-2">
        <div class="btn btn-sm btn-outline">watching point</div>
-        <div class="h-0 group-hover:h-auto group-focus-within:h-auto absolute overflow-clip transition z-10 top-full pt-2">
+        <div
+          class="h-0 group-hover:h-auto group-focus-within:h-auto absolute overflow-clip transition z-10 top-full pt-2">

          <label class="label cursor-pointer btn-sm border border-neutral ml-2 bg-base-100"
            v-for="(mode,i) in modereflist" :key="i">
@@ -161,33 +163,36 @@ const submit = async (data: { classItem: Item, methodItem: Item, conditon: strin
        </div>

      </div>
-      <button class="btn btn-sm btn-outline ml-2" @click="setDepth">depth:{{depth}}</button>
+      <div class="btn-group ml-2">
+        <button class="btn btn-sm btn-outline" @click.prevent="decrease">-</button>
+        <button class="btn btn-sm btn-outline border-x-0" @click.prevent="setDepth">depth:{{depth}}</button>
+        <button class="btn btn-sm btn-outline" @click.prevent="increase">+</button>
+      </div>
    </template>
  </MethodInput>
  <Enhancer :result="enhancer" v-if="enhancer"></Enhancer>
-  <div class="flex justify-center mt-4 overflow-auto">
-    <table class="table w-full group">
+  <div class="overflow-x-auto w-full mt-4">
+    <table class="table w-full table-compact">
      <thead>
        <tr>
-          <th class="border border-slate-300" v-for="(v,i) in keyList" :key="i" :class="{'group-first:z-0':i===0}">{{v}}
+          <th></th>
+          <th class="0" v-for="(v,i) in keyList" :key="i">{{v}}
          </th>
        </tr>
      </thead>
      <tbody>
-        <tr v-for="(map, i) in tableResults" :key="i">
-          <td class="border border-slate-300" v-for="(key,j) in keyList" :key="j">
+        <tr v-for="(map, i) in tableResults" :key="i" class="hover">
+          <th>{{i+1}}</th>
+          <td class="" v-for="(key,j) in keyList" :key="j">
            <div v-if=" key !== 'value'">
              {{map.get(key)}}
            </div>
-
            <div class="flex flex-col" v-else>
              <Tree :root="(map.get('value') as TreeNode)" class="mt-2" button-class=" ">
                <template #meta="{ data, active }">
-                  <div 
-                    class="bg-info  px-2 rounded-r rounded-br mr-2 text-info-content" :class='{
-                  "hover:opacity-50":active
-                }'
-                    >
+                  <div class="bg-info  px-2 rounded-r rounded-br mr-2 text-info-content" :class='{
+                    "hover:opacity-50":active
+                  }'>
                    {{data}}
                  </div>
                </template>
@@ -196,6 +201,14 @@ const submit = async (data: { classItem: Item, methodItem: Item, conditon: strin
          </td>
        </tr>
      </tbody>
+      <tfoot>
+        <tr>
+          <th></th>
+          <th class="0" v-for="(v,i) in keyList" :key="i">{{v}}
+          </th>
+        </tr>
+      </tfoot>
    </table>
+
  </div>
 </template>
@@ -0,0 +1,67 @@
+<script setup lang="ts">
+import permachine from '@/machines/perRequestMachine';
+import { fetchStore } from '@/stores/fetch';
+import { onBeforeMount, reactive } from 'vue';
+import { interpret } from 'xstate';
+const fetchS = fetchStore();
+type ResultType = { "key": string, "value": string};
+const tableResultList: ResultType[] = reactive([])
+// 尝试转化为tree，不过分表可能会合理一些
+const transformToString: <T=Record<string,unknown>>(obj:T)=>T = (obj)=>{
+  type Out = typeof obj
+  let output = {} as Out
+  for (const key in obj) {
+    if (Object.prototype.hasOwnProperty.call(obj, key)) {
+      const element = obj[key];
+      if( typeof element === "object") {
+        output[key] = transformToString(element as Record<string,unknown>) as Out[Extract<keyof Out, string>]
+      } else {
+        output[key] = (element as (string|number|boolean)).toString() as Out[Extract<keyof Out, string>]
+      }
+    }
+  }
+  return output
+}
+const getJvm = () => fetchS.baseSubmit(interpret(permachine), {
+  action: "exec",
+  command: "jvm"
+}).then(res => {
+  const result = (res as CommonRes).body.results[0]
+  if (result.type === "jvm") {
+    tableResultList.length = 0
+    Object.entries(result.jvmInfo).forEach(([key, value]) => {
+      let row = {
+        key,
+        value:JSON.stringify(value)
+      }
+      tableResultList.push(row)
+    })
+  }
+})
+onBeforeMount(() => {
+  getJvm()
+})
+</script>
+
+<template>
+  <table class="table w-full table-compact">
+    <thead>
+      <tr>
+        <th>key</th>
+        <th>value</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr v-for="(map, i) in tableResultList" :key="i" class="hover">
+        <th>{{map.key}}</th>
+        <td>{{map.value}}</td>
+      </tr>
+    </tbody>
+    <tfoot>
+      <tr>
+        <th>key</th>
+        <th>value</th>
+      </tr>
+    </tfoot>
+  </table>
+</template>
@@ -0,0 +1,102 @@
+<script setup lang="ts">
+import permachine from '@/machines/perRequestMachine';
+import { fetchStore } from '@/stores/fetch';
+import { publicStore } from '@/stores/public';
+import { onBeforeMount, reactive, ref, Ref } from 'vue';
+import { interpret } from 'xstate';
+const fetchS = fetchStore();
+const publicS = publicStore()
+type ResultType = MergeObj<Omit<GlobalOptions, "value">, {
+  value: Ref<string>, changeValue: null | (() => void)
+}>
+
+const tableResultList: ResultType[] = reactive([])
+const keyList: (keyof GlobalOptions)[] = [
+  "level",
+  "name",
+  "type",
+  "value",
+  "summary",
+  "description",
+]
+const setVmoption = (key: string, value: string) => fetchS.baseSubmit(interpret(permachine), {
+  action: "exec",
+  command: `options ${key} ${value}`
+})
+
+const getVmoption = () => fetchS.baseSubmit(interpret(permachine), {
+  action: "exec",
+  command: "options",
+}).then(res => {
+  let result = (res as CommonRes).body.results[0]
+  if (result.type == "options") {
+    tableResultList.length = 0;
+    result.options.forEach((option) => {
+      let rows: ResultType[] = []
+      // 用来绑定读写
+
+      let _raw = ref(option.value)
+      let changeValue = null
+      changeValue = publicS.inputDialogFactory(_raw,
+        (raw) => {
+          setVmoption(option.name, raw.trim())
+            .then(res =>{
+              let result = (res as CommonRes).body.results[0]
+              if(result.type === "options") _raw.value = (result.changeResult.afterValue as string).toString()
+            })
+            .catch(err => {
+              // 失败就回退
+              _raw.value = option.value
+            })
+          return raw.trim()
+        },
+        (input) => input.value)
+      rows.push({
+        ...option,
+        value: _raw,
+        changeValue,
+      })
+      tableResultList.push(...rows)
+    })
+    tableResultList.sort((a, b) => {
+      if(a.level != b.level) return a.level - b.level
+      else {
+        return a.name > b.name ? 1 :-1
+      }
+    })
+  }
+})
+onBeforeMount(() => {
+  getVmoption()
+})
+</script>
+
+<template>
+  <table class="table w-full table-compact">
+    <thead>
+      <tr>
+
+        <th></th>
+        <th v-for="(k, i) in keyList" :key="i">{{ k }}</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr v-for="(map, i) in tableResultList" :key="i" class="hover">
+        <th>
+          <button class="btn btn-outline btn-xs btn-primary" @click.prevent="map.changeValue"
+            v-if="map.changeValue !== null">edit</button>
+        </th>
+        <template v-for="(k, j) in keyList" :key="j">
+          <th v-if="k === 'name' || k === 'level'">{{ map[k] }}</th>
+          <td v-else class="break-words"> {{ map[k] }}</td>
+        </template>
+      </tr>
+    </tbody>
+    <tfoot>
+      <tr>
+        <th></th>
+        <th v-for="(k, i) in keyList" :key="i">{{ k }}</th>
+      </tr>
+    </tfoot>
+  </table>
+</template>
@@ -0,0 +1,69 @@
+<script setup lang="ts">
+import permachine from '@/machines/perRequestMachine';
+import { fetchStore } from '@/stores/fetch';
+import { onBeforeMount, reactive } from 'vue';
+import { interpret } from 'xstate';
+const fetchS = fetchStore();
+type ResultType = MergeObj<Perfcounter,{rowspan:number}>
+const perfcounterList: ResultType[] = reactive([])
+let keyList: (keyof Perfcounter)[] = [
+  "name",
+  "units",
+  "variability",
+  "value",
+]
+const getPerCounter = () => fetchS.baseSubmit(interpret(permachine), { action: "exec", command: "perfcounter -d" }).then(res => {
+  const result = (res as CommonRes).body.results[0]
+  if (result.type === "perfcounter") {
+    const perfcounters = result.perfCounters
+    perfcounterList.length = 0;
+    perfcounters.forEach(perfcouter => {
+      let result = {...perfcouter,rowspan:1}
+      result.value = result.value.toString()
+      perfcounterList.push(result)
+    })
+    perfcounterList.sort((a, b) => a.name > b.name ? 1 : -1)
+  }
+})
+
+onBeforeMount(() => {
+  getPerCounter()
+})
+</script>
+
+<template>
+  <table class="table w-full table-compact">
+    <thead>
+      <tr>
+        <th v-for="(v,i) in keyList" :key="i">{{v}}</th>
+      </tr>
+    </thead>
+    <tbody class="">
+      <tr v-for="(map, i) in perfcounterList" :key="i" class="hover">
+        <template v-for="(key,j) in keyList" :key="j">
+          <!-- 展示合并的单元格且定住name -->
+          <th v-if="key == 'name' && map.rowspan > 0" :rowspan="map.rowspan">
+            {{map[key]}}
+          </th>
+          <!-- 只有value才会裂变 -->
+          <td v-else-if="key === 'value'" >
+            <div class="break-all">{{map[key]}}</div>
+          </td>
+          <!-- 展示合并的单元格 -->
+          <td v-else-if="map.rowspan > 0" :rowspan="map.rowspan">
+            {{map[key]}}
+          </td>
+        </template>
+      </tr>
+    </tbody>
+    <tfoot>
+      <tr>
+        <th v-for="(v,i) in keyList" :key="i" class="break-words">{{v}}</th>
+      </tr>
+    </tfoot>
+  </table>
+</template>
+
+<style scoped>
+
+</style>
@@ -0,0 +1,52 @@
+<script setup lang="ts">
+import permachine from '@/machines/perRequestMachine';
+import { fetchStore } from '@/stores/fetch';
+import { onBeforeMount, reactive } from 'vue';
+import { interpret } from 'xstate';
+const fetchS = fetchStore();
+type ResultType = { "key": string, "value": string, rowspan: number };
+const tableResultList: ResultType[] = reactive([])
+const getSysenv = () => fetchS.baseSubmit(interpret(permachine), {
+  action: "exec",
+  command: "sysenv",
+}).then(res => {
+  tableResultList.length = 0
+  let result = (res as CommonRes).body.results[0]
+  if (result.type == "sysenv") {
+    Object.entries(result.env).forEach(([key, value]) => {
+      let rows: ResultType[] = []
+        rows.push({
+          key, value, rowspan: 1
+        })
+      tableResultList.push(...rows)
+    })
+    tableResultList.sort((a, b) => a.key > b.key ? 1 : -1)
+  }
+})
+onBeforeMount(() => {
+  getSysenv()
+})
+</script>
+
+<template>
+  <table class="table w-full table-compact">
+    <thead>
+      <tr>
+        <th>key</th>
+        <th>value</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr v-for="(map, i) in tableResultList" :key="i" class="hover">
+        <th v-if="map.rowspan > 0" :rowspan="map.rowspan">{{map.key}}</th>
+        <td>{{map.value}}</td>
+      </tr>
+    </tbody>
+    <tfoot>
+      <tr>
+        <th>key</th>
+        <th>value</th>
+      </tr>
+    </tfoot>
+  </table>
+</template>
@@ -0,0 +1,78 @@
+<script setup lang="ts">
+import permachine from '@/machines/perRequestMachine';
+import { fetchStore } from '@/stores/fetch';
+import { publicStore } from '@/stores/public';
+import { onBeforeMount, reactive, ref, Ref } from 'vue';
+import { interpret } from 'xstate';
+const fetchS = fetchStore();
+const publicS = publicStore()
+type ResultType = { "key": string, "value": Ref<string>, rowspan: number, changeValue:()=>void};
+const tableResultList: ResultType[] = reactive([])
+
+const setSysprop = (key:string,value:string) => fetchS.baseSubmit(interpret(permachine),{
+  action: "exec",
+  command:`sysprop ${key} ${value}`
+})
+
+const getSysprop = () => fetchS.baseSubmit(interpret(permachine), {
+  action: "exec",
+  command: "sysprop",
+}).then(res => {
+  let result = (res as CommonRes).body.results[0]
+  if (result.type == "sysprop") {
+    tableResultList.length = 0;
+    Object.entries(result.props).forEach(([key, value]) => {
+      let rows: ResultType[] = []
+      // 用来绑定读写
+      let _raw = ref(value)
+      const changeValue = publicS.inputDialogFactory(_raw,
+        (raw) => {
+          setSysprop(key, raw.trim()).then(res=>{
+          },err=>{
+            // 失败就回退
+            _raw.value = value
+          })
+          return raw.trim()
+        },
+        (input) => input.value)
+        rows.push({
+          key, value:_raw, rowspan: 1, changeValue
+        })
+      tableResultList.push(...rows)
+    })
+    tableResultList.sort((a, b) => a.key > b.key ? 1 : -1)
+  }
+})
+onBeforeMount(() => {
+  getSysprop()
+})
+</script>
+
+<template>
+  <table class="table w-full table-compact">
+    <thead>
+      <tr>
+        
+        <th></th>
+        <th>key</th>
+        <th>value</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr v-for="(map, i) in tableResultList" :key="i" class="hover">
+        <th v-if="map.rowspan > 0" :rowspan="map.rowspan">
+          <button class="btn btn-outline btn-xs btn-primary" @click.prevent="map.changeValue">edit</button>
+        </th>
+        <th v-if="map.rowspan > 0" :rowspan="map.rowspan">{{map.key}}</th>
+        <td>{{map.value}}</td>
+      </tr>
+    </tbody>
+    <tfoot>
+      <tr>
+        <th></th>
+        <th>key</th>
+        <th>value</th>
+      </tr>
+    </tfoot>
+  </table>
+</template>
@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import permachine from '@/machines/perRequestMachine';
+import { fetchStore } from '@/stores/fetch';
+import { publicStore } from '@/stores/public';
+import { onBeforeMount, reactive, ref, Ref } from 'vue';
+import { interpret } from 'xstate';
+const fetchS = fetchStore();
+const publicS = publicStore()
+type ResultType = { name: string, origin: string, value: Ref<string>, writeable: string, changeValue: null|(() => void)
+};
+const tableResultList: ResultType[] = reactive([])
+const keyList: (keyof VmOption)[] = [
+  "name",
+  "origin",
+  "writeable",
+  "value",
+]
+const setVmoption = (key: string, value: string) => fetchS.baseSubmit(interpret(permachine), {
+  action: "exec",
+  command: `vmoption ${key} ${value}`
+})
+
+const getVmoption = () => fetchS.baseSubmit(interpret(permachine), {
+  action: "exec",
+  command: "vmoption",
+}).then(res => {
+  let result = (res as CommonRes).body.results[0]
+  if (result.type == "vmoption") {
+    tableResultList.length = 0;
+    result.vmOptions.forEach((vmoption) => {
+      let rows: ResultType[] = []
+      // 用来绑定读写
+      
+      let _raw = ref(vmoption.value)
+      let changeValue = null
+      if(vmoption.writeable===true) {
+        changeValue = publicS.inputDialogFactory(_raw,
+        (raw) => {
+          setVmoption(vmoption.name, raw.trim()).then(res => {
+          }, err => {
+            // 失败就回退
+            _raw.value = vmoption.value
+          })
+          return raw.trim()
+        },
+        (input) => input.value)
+      }
+      rows.push({
+        name: vmoption.name,
+        value: _raw,
+        changeValue,
+        writeable: vmoption.writeable.toString(),
+        origin: vmoption.origin
+      })
+      tableResultList.push(...rows)
+    })
+    tableResultList.sort((a, b) => a.name > b.name ? 1 : -1)
+  }
+})
+onBeforeMount(() => {
+  getVmoption()
+})
+</script>
+
+<template>
+  <table class="table w-full table-compact">
+    <thead>
+      <tr>
+
+        <th></th>
+        <th v-for="(k, i) in keyList" :key="i">{{k}}</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr v-for="(map, i) in tableResultList" :key="i" class="hover">
+        <th >
+          <button class="btn btn-outline btn-xs btn-primary" @click.prevent="map.changeValue" v-if="map.changeValue !== null">edit</button>
+        </th>
+        <template v-for="(k,j) in keyList" :key="j">
+          <th v-if="k==='name'">{{map[k]}}</th>
+          <td v-else class="break-words"> {{map[k]}}</td>
+        </template>
+      </tr>
+    </tbody>
+    <tfoot>
+      <tr>
+        <th></th>
+        <th v-for="(k, i) in keyList" :key="i">{{k}}</th>
+      </tr>
+    </tfoot>
+  </table>
+</template>
@@ -15,30 +15,7 @@ const classFields = reactive(new Map<string, string[]>())
 const classMethodMap = reactive(new Map<string, string[]>())
 const dumpMap = reactive(new Map<string, string[]>())
 const { getCommonResEffect } = publicStore()
-const publicS = publicStore()
 const fetchS = fetchStore()
-// getCommonResEffect(classInfoM, body => {
-//   const result = body.results[0]
-//   if (result.type === "sc" && result.detailed === true && result.withField === true) {
-
-//     classDetailMap.clear()
-//     classFields.clear()
-
-//     Object.entries(result.classInfo).filter(([k, v]) => k !== "fields").forEach(([k, v]) => {
-//       let value: string[] = []
-//       if (!["interfaces", "annotations", "classloader", "superClass"].includes(k)) value.push(v.toString())
-//       else value = v as string[]
-//       classDetailMap.set(k, value)
-//     })
-
-//     result.classInfo.fields.forEach(field => {
-//       classFields.set(field.name, Object.entries(field).filter(([k, v]) => k !== "name").map(([k, v]) => {
-//         if (k === "value") v = JSON.stringify(v)
-//         return `${k}: ${v}`
-//       }))
-//     })
-//   }
-// })
 getCommonResEffect(classMethodInfoM, body => {
  classMethodMap.clear()
  body.results.forEach(result => {
@@ -140,9 +140,9 @@ const getCategorizedByClassType = () => {

      for (const name in result.classLoaderStats) {
        const map = new Map()
-        for (const key in result.classLoaderStats[name]) {
-          map.set(key, result.classLoaderStats[name][key])
-        }
+        map.set("loadedCount", result.classLoaderStats[name].loadedCount)
+        map.set("numberOfInstance", result.classLoaderStats[name].numberOfInstance)
+        // "loadedCount"|"numberOfInstance"
        map.set("name", name)
        tableResults.push(map)
      }
@@ -250,7 +250,8 @@ const resetClassloader = () => {
                    </span>
                  </div>
                  <!-- <div class="">count:{{data[0]}}</div> -->
-                  <button @click="selectClassLoader({name:data[1],hash:data[2],count:data[0]})" class="btn btn-primary btn-xs btn-outline opacity-0 group-hover:opacity-100"
+                  <button @click="selectClassLoader({name:data[1],hash:data[2],count:data[0]})"
+                    class="btn btn-primary btn-xs btn-outline opacity-0 group-hover:opacity-100"
                    v-if="data[2]!== 'null'">
                    select classloader
                  </button>
@@ -260,13 +261,12 @@ const resetClassloader = () => {
          </div>
        </div>
      </div>
-      
-      <div class="w-1/3 ml-2 overflow-y-scroll transition-all duration-500" :class='{
+
+      <div class=" ml-2 overflow-y-scroll transition-all duration-500" :class='{
        "w-0":loaderCache.hash === "",
-        "input-btn-style":loaderCache.hash !==""
+        "input-btn-style w-1/3":loaderCache.hash !==""
      }'>

-        <!-- <div class="overflow-auto h-full"> -->
        <div class="mb-2">
          <div class="overflow-auto">
            <span class="bg-primary-focus px-2 rounded-l text-primary-content border border-primary-focus">
@@ -293,7 +293,6 @@ const resetClassloader = () => {
            </span>
          </div>
        </div>
-        
        <template v-if="loaderCache.hash.trim() !== ''">
          <div class="flex mb-2 w-full">
            <div class=" cursor-default 
@@ -351,20 +350,26 @@ const resetClassloader = () => {
              <button class="btn btn-primary btn-sm" @click="getCategorizedByClassType">refresh</button>
            </div>
            <div class="overflow-auto">
-            <table class="table w-full group table-compact">
-              <thead>
-                <tr>
-                  <th class="border border-slate-300 p-2" v-for="(v,i) in keyList" :key="i" :class="{'group-first:z-0':i==0}">{{v}}</th>
-                </tr>
-              </thead>
-              <tbody class="">
-                <tr v-for="(map, i) in tableResults" :key="i">
-                  <td class="border border-slate-300 p-2" v-for="(key,j) in keyList" :key="j">
-                    {{map.get(key)}}
-                  </td>
-                </tr>
-              </tbody>
-            </table>
+              <table class="table w-full table-compact">
+                <thead>
+                  <tr>
+                    <th></th>
+                    <th class=" normal-case" v-for="(v,i) in keyList" :key="i" :class="{'group-first:z-0':i==0}">{{v}}
+                    </th>
+                  </tr>
+                </thead>
+                <tbody class="">
+                  <tr v-for="(map, i) in tableResults" :key="i">
+                    <th>{{i + 1}}</th>
+                    <template v-for="(key, j) in keyList">
+                      <td class="">
+                        {{map.get(key)}}
+                      </td>
+                    </template>
+
+                  </tr>
+                </tbody>
+              </table>
            </div>
          </div>
        </div>
@@ -46,10 +46,10 @@ const submitCommand = (e: Event) => {
          class="w-full border-none py-2 pl-3 pr-10 leading-5 text-gray-900 focus-visible:outline-none">
      </div>

-      <label class="label cursor-pointer btn-sm border border-neutral mr-2">
-      <span class="label-text uppercase font-bold mr-1">only live object</span>
-      <input v-model="enabled" type="checkbox" class="toggle" />
-    </label>
+      <label class="label cursor-pointer btn-sm mr-2">
+        <span class="label-text uppercase font-bold mr-1">only live object</span>
+        <input v-model="enabled" type="checkbox" class="toggle" />
+      </label>
    </label>

    <button @click.prevent="submitCommand"
@@ -23,6 +23,7 @@ const setDepth = publiC.inputDialogFactory(
  },
  (input) => input.value.toString(),
 )
+const {increase, decrease} = publiC.numberCondition(depth,{min:1})
 const setHash = publiC.inputDialogFactory(
  hashcode,
  (raw) => raw,
@@ -67,7 +68,11 @@ const getSource = () => {
        <input type="text" v-model="express"
          class="w-full border-none py-2 pl-3 pr-10 leading-5 text-gray-900 focus-visible:outline-none">
      </div>
-      <button class="btn btn-sm btn-outline mr-2" @click.prevent="setDepth">depth:{{depth}}</button>
+      <div class="btn-group mr-2">
+        <button class="btn btn-outline btn-sm" @click.prevent="decrease">-</button>
+        <button class="btn btn-outline btn-sm border-x-0" @click.prevent="setDepth">depth:{{depth}}</button>
+        <button class="btn btn-outline btn-sm" @click.prevent="increase">+</button>
+      </div>
      <button class="btn btn-sm btn-outline mr-2" @click.prevent="setClassLoader" v-if="hashcode === ''">ClassLoaderClass:{{classloaderName}}</button>
      <button class="btn btn-sm btn-outline mr-2" @click.prevent="setHash" v-if="classloaderName === ''">hashcode:{{hashcode}}</button>
    </label>
@@ -69,7 +69,7 @@ const openList = () => {
          class="w-full border-none py-2 pl-3 pr-10 leading-5 text-gray-900 focus-visible:outline-none">
      </div>
    </label>
-    <label class="label cursor-pointer btn-sm border border-neutral mr-2">
+    <label class="label cursor-pointer btn-sm mr-2">
      <span class="label-text uppercase font-bold mr-1">explicitly trigger</span>
      <input v-model="enabled" type="checkbox" class="toggle" />
    </label>
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 // import machine from '@/machines/consoleMachine';
 import { useInterpret, } from '@xstate/vue';
-import { onBeforeMount, reactive, ref } from 'vue';
+import { onBeforeMount, reactive, ref, computed } from 'vue';
 import { fetchStore } from '@/stores/fetch';
 import { publicStore } from '@/stores/public';
 import TodoList from '@/components/input/TodoList.vue';
@@ -10,7 +10,7 @@ import {
 } from '@headlessui/vue';
 import { transfromStore } from "@/stores/resTransform"
 import permachine from '@/machines/perRequestMachine';
-import { computed } from '@vue/reactivity';
+import { watch } from 'fs';

 const fetchS = fetchStore()
 const FetchService = useInterpret(permachine)
@@ -43,7 +43,8 @@ const keyList: thkey[] = [
  "blockedCount",
  "blockedTime",
 ]
-const statsList: (keyof ThreadStats)[] = ["id",
+const statsList: (keyof ThreadStats)[] = [
+  "id",
  "name",
  "cpu",
  "daemon",
@@ -62,9 +63,15 @@ const infoCount = ref({
  TERMINATED: 0
 } as ThreadStateCount)
 const tableResults = reactive([] as Map<string, string>[])
+const limitResults = tableResults
+// watchEffect(()=>{
+//   if(count.value > 0) {
+//     tableResults.length = count.value
+//   }
+// })
 const tableFilter = computed(() => {
  // 原本的数组
-  let res = tableResults
+  let res = count.value > 0 ? tableResults.filter((v, i)=>i < count.value) : tableResults
  if (includesVal.size === 0) return res;
  // 导入过滤条件
  includesVal.forEach((v1) => {
@@ -106,8 +113,9 @@ onBeforeMount(() => {
 })
 const getThreads = () => {
  let i = leastTime.value > 0 ? "-i " + leastTime.value : ""
-  let n = count.value > 0 ? "-n " + count.value : ""
-  const b = isBlock.value ? "-b" : ""
+  // 在block时用这个参数会暴毙
+  let n = count.value > 0 && !isBlock ? "-n " + count.value : ""
+  const b = isBlock.value ? "-b --lockedMonitors  --lockedSynchronizers" : ""
  let state = threadState.value.value === "" ? "" : `--state ${threadState.value.value}`
  tableResults.length = 0
  for (const key in infoCount.value) {
@@ -173,12 +181,12 @@ const setleast = publiC.inputDialogFactory(
  },
  (input) => input.value.toString(),
 )
-
+const {increase, decrease} = publiC.numberCondition(count,{min:0})
 const getSpecialThreads = (threadid: number = -1) => {
  let threadName = threadid > 0 ? `${threadid}` : ""
  fetchS.baseSubmit(FetchService, {
    action: "exec",
-    command: `thread ${threadName}`
+    command: `thread ${threadName} `
  }).then(res => {
    const result = (res as CommonRes).body.results[0]
    if (result.type === "thread") {
@@ -195,12 +203,12 @@ const getSpecialThreads = (threadid: number = -1) => {
    <div class="flex justify-end items-center h-[10vh]">

      <TodoList title="filter" :val-set="includesVal" class=" mr-2"></TodoList>
-        <label class="label cursor-pointer btn-sm border border-neutral ">
-          <span class="label-text uppercase font-bold mr-1">is blocking:</span>
-          <input v-model="isBlock" type="checkbox" class="toggle"/>
-        </label>
      <button class="btn ml-2 btn-sm btn-outline" @click="setleast">sample interval:{{leastTime}}</button>
-      <button v-show="!isBlock" class="btn ml-2 btn-sm btn-outline" @click="setlimit"> top n threads:{{count}}</button>
+      <div class="btn-group ml-2" v-show="!isBlock">
+        <button class="btn btn-outline btn-sm" @click.prevent="decrease">-</button>
+        <button class="btn btn-outline btn-sm border-x-0" @click.prevent="setlimit">top threads:{{count}}</button>
+        <button class="btn btn-outline btn-sm" @click.prevent="increase">+</button>
+      </div>
      <Listbox v-model="threadState">
        <div class=" relative mx-2 ">
          <ListboxButton class="btn w-40 btn-sm btn-outline">state {{ threadState.name }}</ListboxButton>
@@ -217,7 +225,11 @@ const getSpecialThreads = (threadid: number = -1) => {
          </ListboxOptions>
        </div>
      </Listbox>
-      <button class="btn btn-primary btn-sm btn-outline" @click="getThreads"> get threads</button>
+      <label class="label cursor-pointer btn-sm ">
+        <span class="label-text uppercase font-bold mr-1">is blocking:</span>
+        <input v-model="isBlock" type="checkbox" class="toggle" />
+      </label>
+      <button class="btn btn-primary btn-sm btn-outline" @click="getThreads"> get threads </button>
    </div>
    <div class="w-full h-[50vh] input-btn-style my-2 p-4 flex flex-col">
      <div class="flex h-[8vh] flex-wrap flex-auto">
@@ -231,31 +243,31 @@ const getSpecialThreads = (threadid: number = -1) => {
        </div>
      </div>
      <div class="overflow-auto h-[40vh] w-full">
-        <table class="table w-full group">
+        <table class="table w-full">
          <thead>
            <tr>
-              <th class="border border-slate-300 p-2 group-first:z-0">get stackTrace</th>
-              <template v-if="count===0">
-                <th class="border border-slate-300 p-2" v-for="(v,i) in keyList" :key="i">{{v}}</th>
+              <th class=""></th>
+              <template v-if="count === 0">
+                <th class="normal-case" v-for="(v,i) in keyList" :key="i">{{v}}</th>
              </template>
              <template v-else>
-                <th class="border border-slate-300 p-2" v-for="(v,i) in statsList" :key="i">{{v}}</th>
+                <th class="normal-case" v-for="(v,i) in statsList" :key="i">{{v}}</th>
              </template>
            </tr>
          </thead>
          <tbody>
            <tr v-for="(map, i) in tableFilter" :key="i">
-              <td class="border border-slate-300 p-2"><button class="btn-outline btn-primary btn btn-sm"
+              <th class="2"><button class="btn-outline btn-primary btn btn-sm"
                  @click="getSpecialThreads(parseInt(map.get('id')!))" v-if="map.get('id')!=='-1'">
                  get stackTrace
-                </button></td>
+                </button></th>
              <template v-if="count === 0">
-                <td class="border border-slate-300 p-2" v-for="(key,j) in keyList" :key="j">
+                <td class="" v-for="(key,j) in keyList" :key="j">
                  {{map.get(key)}}
                </td>
              </template>
              <template v-else>
-                <td class="border border-slate-300 p-2" v-for="(key,j) in statsList" :key="j">
+                <td class="" v-for="(key,j) in statsList" :key="j">
                  {{map.get(key)}}
                </td>
              </template>
@@ -11,6 +11,7 @@ const gcMachine = useInterpret(permachine)
 const fetchS = fetchStore()
 const publicS = publicStore()
 const depth = ref(1)
+const {increase, decrease} = publicS.numberCondition(depth,{min:1})
 const setDepth = publicS.inputDialogFactory(
  depth,
  (raw) => {
@@ -87,7 +88,11 @@ const getInstance = (data:{classItem:Item}) => {

  <ClassInput :submit-f="getInstance" class="mb-4" >
    <template #others>
-      <button class="ml-2 btn btn-outline btn-sm" @click="setDepth">depth:{{depth}}</button>
+      <div class="btn-group ml-2">
+        <button class="btn btn-outline btn-sm" @click.prevent="decrease">-</button>
+        <button class="btn btn-outline btn-sm border-x-0" @click.prevent="setDepth">depth:{{depth}}</button>
+        <button class="btn btn-outline btn-sm" @click.prevent="increase">+</button>
+      </div>
    </template>
  </ClassInput>
  <template v-if="pollResults.length > 0">
@@ -5,8 +5,25 @@ import * as path from "path";
 // https://vitejs.dev/config/
 export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd(), "");
-  const proxyTarget =`${env.VITE_ARTHAS_PROXY_IP}:${env.VITE_ARTHAS_PROXY_PORT}`;
+  const proxyTarget =
+    `${env.VITE_ARTHAS_PROXY_IP}:${env.VITE_ARTHAS_PROXY_PORT}`;
+
  console.log("Arthas proxy :", proxyTarget);
+  let outDir, input
+  console.log(env.VITE_AGENT)
+  if (env.VITE_AGENT === "true") {
+    outDir = `./dist/tunnel`
+    input = {
+      tunnel: path.resolve(__dirname, "index.html")
+    }
+  } else {
+    outDir = `./dist`
+    input = {
+      main: path.resolve(__dirname, "index.html"),
+      ui: path.resolve(__dirname, "ui/index.html"),
+    }
+  }
+
  return {
    plugins: [vue({
      reactivityTransform: true,
@@ -18,12 +35,10 @@ export default defineConfig(({ mode }) => {
    },
    build: {
      emptyOutDir: true,
+      outDir,
      minify: "esbuild",
      rollupOptions: {
-        input: {
-          main: path.resolve(__dirname, "index.html"),
-          ui: path.resolve(__dirname, "ui/index.html"),
-        },
+        input,
        output: {
          chunkFileNames: "static/js/[name]-[hash].js",
          entryFileNames: "static/js/[name]-[hash].js",
@@ -43,7 +58,7 @@ export default defineConfig(({ mode }) => {
        "/api": {
          target: `http://${proxyTarget}`,
          changeOrigin: true,
-        }
+        },
      },
    },
  };
@@ -3,14 +3,19 @@


 "@babel/parser@^7.16.4":
-  version "7.18.9"
-  resolved "https://registry.npmmirror.com/@babel/parser/-/parser-7.18.9.tgz"
-  integrity sha512-9uJveS9eY9DJ0t64YbIBZICtJy8a5QrDEVdiLCG97fVLpDTpGX7t8mMSb6OWw6Lrnjqj4O8zwjELX3dhoMgiBg==
+  version "7.19.4"
+  resolved "https://registry.npmmirror.com/@babel/parser/-/parser-7.19.4.tgz#03c4339d2b8971eb3beca5252bafd9b9f79db3dc"
+  integrity sha512-qpVT7gtuOLjWeDTKLkJ6sryqLliBaFpAtGeqw5cs5giLldvh+Ch0plqnUMKoVAUS6ZEueQQiZV+p5pxtPitEsA==
+
+"@esbuild/linux-loong64@0.14.54":
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/@esbuild/linux-loong64/-/linux-loong64-0.14.54.tgz#de2a4be678bd4d0d1ffbb86e6de779cde5999028"
+  integrity sha512-bZBrLAIX1kpWelV0XemxBZllyRmM6vgFQQG2GdNb+r3Fkp0FOh1NJSvekXDs7jq70k4euu1cryLMfU+mTXlEpw==

 "@headlessui/vue@^1.6.6":
-  version "1.6.7"
-  resolved "https://registry.npmmirror.com/@headlessui/vue/-/vue-1.6.7.tgz"
-  integrity sha512-5sTCBpkUoFE7zhANn/6Z+pf3PUA7MD6BBaTsJcQybq9E4fnNiMM9agOJI9meXbtcawE6Dm8EeB5A8HAJEnZCbQ==
+  version "1.7.3"
+  resolved "https://registry.npmmirror.com/@headlessui/vue/-/vue-1.7.3.tgz#116d13391552436ea1e9e88c69f0e9d7d2585c45"
+  integrity sha512-Is4iakKts9u9E0+jEZNzoJpBjwq2SamwEIoEl2RlyYSu6Zco536GsPXaQEfg/o7Eyc1GUUlcL+dJd4Rt7qyf7A==

 "@heroicons/vue@^1.0.6":
  version "1.0.6"
@@ -44,143 +49,154 @@
    fastq "^1.6.0"

 "@types/node@^18.7.2":
-  version "18.7.2"
-  resolved "https://registry.npmmirror.com/@types/node/-/node-18.7.2.tgz"
-  integrity sha512-ce7MIiaYWCFv6A83oEultwhBXb22fxwNOQf5DIxWA4WXvDQ7K+L0fbWl/YOfCzlR5B/uFkSnVBhPcOfOECcWvA==
+  version "18.11.2"
+  resolved "https://registry.npmmirror.com/@types/node/-/node-18.11.2.tgz#c59b7641832531264fda3f1ba610362dc9a7dfc8"
+  integrity sha512-BWN3M23gLO2jVG8g/XHIRFWiiV4/GckeFIqbU/C4V3xpoBBWSMk4OZomouN0wCkfQFPqgZikyLr7DOYDysIkkw==

 "@vitejs/plugin-vue@^2.3.3":
-  version "2.3.3"
-  resolved "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-2.3.3.tgz"
-  integrity sha512-SmQLDyhz+6lGJhPELsBdzXGc+AcaT8stgkbiTFGpXPe8Tl1tJaBw1A6pxDqDuRsVkD8uscrkx3hA7QDOoKYtyw==
+  version "2.3.4"
+  resolved "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-2.3.4.tgz#966a6279060eb2d9d1a02ea1a331af071afdcf9e"
+  integrity sha512-IfFNbtkbIm36O9KB8QodlwwYvTEsJb4Lll4c2IwB3VHc2gie2mSPtSzL0eYay7X2jd/2WX02FjSGTWR6OPr/zg==

-"@volar/code-gen@0.34.17":
-  version "0.34.17"
-  resolved "https://registry.npmmirror.com/@volar/code-gen/-/code-gen-0.34.17.tgz"
-  integrity sha512-rHR7BA71BJ/4S7xUOPMPiB7uk6iU9oTWpEMZxFi5VGC9iJmDncE82WzU5iYpcbOBCVHsOjMh0+5CGMgdO6SaPA==
+"@volar/language-core@1.0.8":
+  version "1.0.8"
+  resolved "https://registry.npmmirror.com/@volar/language-core/-/language-core-1.0.8.tgz#ed923e13d626102db6f82be03cfad22b0e5fdeae"
+  integrity sha512-uxYSOqBk8ZFSzGjUIPOBEFPOg8F3CE6cLO5meK95DODGIlUlPytGiy9sy8QZ9w7RpUH4XMOX3MH/G48SLgP07A==
  dependencies:
-    "@volar/source-map" "0.34.17"
+    "@volar/source-map" "1.0.8"
+    "@vue/reactivity" "^3.2.40"
+    muggle-string "^0.1.0"

-"@volar/source-map@0.34.17":
-  version "0.34.17"
-  resolved "https://registry.npmmirror.com/@volar/source-map/-/source-map-0.34.17.tgz"
-  integrity sha512-3yn1IMXJGGWB/G817/VFlFMi8oh5pmE7VzUqvgMZMrppaZpKj6/juvJIEiXNxRsgWc0RxIO8OSp4htdPUg1Raw==
-
-"@volar/vue-code-gen@0.34.17":
-  version "0.34.17"
-  resolved "https://registry.npmmirror.com/@volar/vue-code-gen/-/vue-code-gen-0.34.17.tgz"
-  integrity sha512-17pzcK29fyFWUc+C82J3JYSnA+jy3QNrIldb9kPaP9Itbik05ZjEIyEue9FjhgIAuHeYSn4LDM5s6nGjxyfhsQ==
+"@volar/source-map@1.0.8":
+  version "1.0.8"
+  resolved "https://registry.npmmirror.com/@volar/source-map/-/source-map-1.0.8.tgz#3e1a6f9ae652b665e6f3eef7c6291b48ac1aa6e6"
+  integrity sha512-uKMe+alyfl1Abs5SviKejFoe7x9g6jDPVpVt63Tet4qn1Ziy7tFsvtCpM2Y1Ko5qw2nLIeloLslPqm9/gmbBLQ==
  dependencies:
-    "@volar/code-gen" "0.34.17"
-    "@volar/source-map" "0.34.17"
-    "@vue/compiler-core" "^3.2.36"
-    "@vue/compiler-dom" "^3.2.36"
-    "@vue/shared" "^3.2.36"
+    muggle-string "^0.1.0"

-"@volar/vue-typescript@0.34.17":
-  version "0.34.17"
-  resolved "https://registry.npmmirror.com/@volar/vue-typescript/-/vue-typescript-0.34.17.tgz"
-  integrity sha512-U0YSVIBPRWVPmgJHNa4nrfq88+oS+tmyZNxmnfajIw9A/GOGZQiKXHC0k09SVvbYXlsjgJ6NIjhm9NuAhGRQjg==
+"@volar/typescript@1.0.8":
+  version "1.0.8"
+  resolved "https://registry.npmmirror.com/@volar/typescript/-/typescript-1.0.8.tgz#45674506471c3ee8cfabb0d98f75f8e2b2f18936"
+  integrity sha512-2oY1Apvzcs/5tAn7p1tRlDxNgal5ezaK0h9cutcWALeimsaQBAEE2NAirCrLMHl8DneuDce0tzJqHaQeHw9RmQ==
  dependencies:
-    "@volar/code-gen" "0.34.17"
-    "@volar/source-map" "0.34.17"
-    "@volar/vue-code-gen" "0.34.17"
-    "@vue/compiler-sfc" "^3.2.36"
-    "@vue/reactivity" "^3.2.36"
+    "@volar/language-core" "1.0.8"

-"@vue/compiler-core@3.2.37", "@vue/compiler-core@^3.2.36":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.2.37.tgz"
-  integrity sha512-81KhEjo7YAOh0vQJoSmAD68wLfYqJvoiD4ulyedzF+OEk/bk6/hx3fTNVfuzugIIaTrOx4PGx6pAiBRe5e9Zmg==
+"@volar/vue-language-core@1.0.8":
+  version "1.0.8"
+  resolved "https://registry.npmmirror.com/@volar/vue-language-core/-/vue-language-core-1.0.8.tgz#2f888309aee80b6853ba5181f82b772e21f3b13e"
+  integrity sha512-cXb7oTybxcm1vpz003agdYQHyxij7UAaSub60d7W1aMWpqb2iaCbVaq9izgQFlrpC4/JnVs+cJPb/Q6fAUVxBg==
+  dependencies:
+    "@volar/language-core" "1.0.8"
+    "@volar/source-map" "1.0.8"
+    "@vue/compiler-dom" "^3.2.40"
+    "@vue/compiler-sfc" "^3.2.40"
+    "@vue/reactivity" "^3.2.40"
+    "@vue/shared" "^3.2.40"
+    minimatch "^5.1.0"
+    vue-template-compiler "^2.7.10"
+
+"@volar/vue-typescript@1.0.8":
+  version "1.0.8"
+  resolved "https://registry.npmmirror.com/@volar/vue-typescript/-/vue-typescript-1.0.8.tgz#34cc253b65d5992cb411d110db56c55037c49956"
+  integrity sha512-6jBvA7iwBkRqS2VQx2gLJgfLcF3hcODyJ6Lmiw2tN8D/LVfFCovvzJgPvIQb9Y4i+rha1Y0cpsYOUt9XW2Z7ZA==
+  dependencies:
+    "@volar/typescript" "1.0.8"
+    "@volar/vue-language-core" "1.0.8"
+
+"@vue/compiler-core@3.2.41":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.2.41.tgz#fb5b25f23817400f44377d878a0cdead808453ef"
+  integrity sha512-oA4mH6SA78DT+96/nsi4p9DX97PHcNROxs51lYk7gb9Z4BPKQ3Mh+BLn6CQZBw857Iuhu28BfMSRHAlPvD4vlw==
  dependencies:
    "@babel/parser" "^7.16.4"
-    "@vue/shared" "3.2.37"
+    "@vue/shared" "3.2.41"
    estree-walker "^2.0.2"
    source-map "^0.6.1"

-"@vue/compiler-dom@3.2.37", "@vue/compiler-dom@^3.2.36":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.2.37.tgz"
-  integrity sha512-yxJLH167fucHKxaqXpYk7x8z7mMEnXOw3G2q62FTkmsvNxu4FQSu5+3UMb+L7fjKa26DEzhrmCxAgFLLIzVfqQ==
+"@vue/compiler-dom@3.2.41", "@vue/compiler-dom@^3.2.40":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.2.41.tgz#dc63dcd3ce8ca8a8721f14009d498a7a54380299"
+  integrity sha512-xe5TbbIsonjENxJsYRbDJvthzqxLNk+tb3d/c47zgREDa/PCp6/Y4gC/skM4H6PIuX5DAxm7fFJdbjjUH2QTMw==
  dependencies:
-    "@vue/compiler-core" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/compiler-core" "3.2.41"
+    "@vue/shared" "3.2.41"

-"@vue/compiler-sfc@3.2.37", "@vue/compiler-sfc@^3.2.36":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.2.37.tgz"
-  integrity sha512-+7i/2+9LYlpqDv+KTtWhOZH+pa8/HnX/905MdVmAcI/mPQOBwkHHIzrsEsucyOIZQYMkXUiTkmZq5am/NyXKkg==
+"@vue/compiler-sfc@3.2.41", "@vue/compiler-sfc@^3.2.40":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.2.41.tgz#238fb8c48318408c856748f4116aff8cc1dc2a73"
+  integrity sha512-+1P2m5kxOeaxVmJNXnBskAn3BenbTmbxBxWOtBq3mQTCokIreuMULFantBUclP0+KnzNCMOvcnKinqQZmiOF8w==
  dependencies:
    "@babel/parser" "^7.16.4"
-    "@vue/compiler-core" "3.2.37"
-    "@vue/compiler-dom" "3.2.37"
-    "@vue/compiler-ssr" "3.2.37"
-    "@vue/reactivity-transform" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/compiler-core" "3.2.41"
+    "@vue/compiler-dom" "3.2.41"
+    "@vue/compiler-ssr" "3.2.41"
+    "@vue/reactivity-transform" "3.2.41"
+    "@vue/shared" "3.2.41"
    estree-walker "^2.0.2"
    magic-string "^0.25.7"
    postcss "^8.1.10"
    source-map "^0.6.1"

-"@vue/compiler-ssr@3.2.37":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.2.37.tgz"
-  integrity sha512-7mQJD7HdXxQjktmsWp/J67lThEIcxLemz1Vb5I6rYJHR5vI+lON3nPGOH3ubmbvYGt8xEUaAr1j7/tIFWiEOqw==
+"@vue/compiler-ssr@3.2.41":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.2.41.tgz#344f564d68584b33367731c04ffc949784611fcb"
+  integrity sha512-Y5wPiNIiaMz/sps8+DmhaKfDm1xgj6GrH99z4gq2LQenfVQcYXmHIOBcs5qPwl7jaW3SUQWjkAPKMfQemEQZwQ==
  dependencies:
-    "@vue/compiler-dom" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/compiler-dom" "3.2.41"
+    "@vue/shared" "3.2.41"

-"@vue/devtools-api@^6.1.4", "@vue/devtools-api@^6.2.1":
-  version "6.2.1"
-  resolved "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.2.1.tgz"
-  integrity sha512-OEgAMeQXvCoJ+1x8WyQuVZzFo0wcyCmUR3baRVLmKBo1LmYZWMlRiXlux5jd0fqVJu6PfDbOrZItVqUEzLobeQ==
+"@vue/devtools-api@^6.1.4", "@vue/devtools-api@^6.4.4":
+  version "6.4.4"
+  resolved "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.4.4.tgz#0b024fc8ca91bb4b6035abaf53c5aecc17119b3b"
+  integrity sha512-Ku31WzpOV/8cruFaXaEZKF81WkNnvCSlBY4eOGtz5WMSdJvX1v1WWlSMGZeqUwPtQ27ZZz7B62erEMq8JDjcXw==

-"@vue/reactivity-transform@3.2.37":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/reactivity-transform/-/reactivity-transform-3.2.37.tgz"
-  integrity sha512-IWopkKEb+8qpu/1eMKVeXrK0NLw9HicGviJzhJDEyfxTR9e1WtpnnbYkJWurX6WwoFP0sz10xQg8yL8lgskAZg==
+"@vue/reactivity-transform@3.2.41":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/reactivity-transform/-/reactivity-transform-3.2.41.tgz#9ff938877600c97f646e09ac1959b5150fb11a0c"
+  integrity sha512-mK5+BNMsL4hHi+IR3Ft/ho6Za+L3FA5j8WvreJ7XzHrqkPq8jtF/SMo7tuc9gHjLDwKZX1nP1JQOKo9IEAn54A==
  dependencies:
    "@babel/parser" "^7.16.4"
-    "@vue/compiler-core" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/compiler-core" "3.2.41"
+    "@vue/shared" "3.2.41"
    estree-walker "^2.0.2"
    magic-string "^0.25.7"

-"@vue/reactivity@3.2.37", "@vue/reactivity@^3.2.36":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.2.37.tgz"
-  integrity sha512-/7WRafBOshOc6m3F7plwzPeCu/RCVv9uMpOwa/5PiY1Zz+WLVRWiy0MYKwmg19KBdGtFWsmZ4cD+LOdVPcs52A==
+"@vue/reactivity@3.2.41", "@vue/reactivity@^3.2.40":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.2.41.tgz#0ad3bdf76d76822da1502dc9f394dafd02642963"
+  integrity sha512-9JvCnlj8uc5xRiQGZ28MKGjuCoPhhTwcoAdv3o31+cfGgonwdPNuvqAXLhlzu4zwqavFEG5tvaoINQEfxz+l6g==
  dependencies:
-    "@vue/shared" "3.2.37"
+    "@vue/shared" "3.2.41"

-"@vue/runtime-core@3.2.37":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.2.37.tgz"
-  integrity sha512-JPcd9kFyEdXLl/i0ClS7lwgcs0QpUAWj+SKX2ZC3ANKi1U4DOtiEr6cRqFXsPwY5u1L9fAjkinIdB8Rz3FoYNQ==
+"@vue/runtime-core@3.2.41":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.2.41.tgz#775bfc00b3fadbaddab77138f23322aee3517a76"
+  integrity sha512-0LBBRwqnI0p4FgIkO9q2aJBBTKDSjzhnxrxHYengkAF6dMOjeAIZFDADAlcf2h3GDALWnblbeprYYpItiulSVQ==
  dependencies:
-    "@vue/reactivity" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/reactivity" "3.2.41"
+    "@vue/shared" "3.2.41"

-"@vue/runtime-dom@3.2.37":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.2.37.tgz"
-  integrity sha512-HimKdh9BepShW6YozwRKAYjYQWg9mQn63RGEiSswMbW+ssIht1MILYlVGkAGGQbkhSh31PCdoUcfiu4apXJoPw==
+"@vue/runtime-dom@3.2.41":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.2.41.tgz#cdf86be7410f7b15c29632a96ce879e5b4c9ab92"
+  integrity sha512-U7zYuR1NVIP8BL6jmOqmapRAHovEFp7CSw4pR2FacqewXNGqZaRfHoNLQsqQvVQ8yuZNZtxSZy0FFyC70YXPpA==
  dependencies:
-    "@vue/runtime-core" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/runtime-core" "3.2.41"
+    "@vue/shared" "3.2.41"
    csstype "^2.6.8"

-"@vue/server-renderer@3.2.37":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.2.37.tgz"
-  integrity sha512-kLITEJvaYgZQ2h47hIzPh2K3jG8c1zCVbp/o/bzQOyvzaKiCquKS7AaioPI28GNxIsE/zSx+EwWYsNxDCX95MA==
+"@vue/server-renderer@3.2.41":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.2.41.tgz#ca64552c05878f94e8d191ac439141c06c0fb2ad"
+  integrity sha512-7YHLkfJdTlsZTV0ae5sPwl9Gn/EGr2hrlbcS/8naXm2CDpnKUwC68i1wGlrYAfIgYWL7vUZwk2GkYLQH5CvFig==
  dependencies:
-    "@vue/compiler-ssr" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/compiler-ssr" "3.2.41"
+    "@vue/shared" "3.2.41"

-"@vue/shared@3.2.37", "@vue/shared@^3.2.36":
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/@vue/shared/-/shared-3.2.37.tgz"
-  integrity sha512-4rSJemR2NQIo9Klm1vabqWjD8rs/ZaJSzMxkMNeJS6lHiUjjUeYFbooN19NgFjztubEKh3WlZUeOLVdbbUWHsw==
+"@vue/shared@3.2.41", "@vue/shared@^3.2.40":
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/@vue/shared/-/shared-3.2.41.tgz#fbc95422df654ea64e8428eced96ba6ad555d2bb"
+  integrity sha512-W9mfWLHmJhkfAmV+7gDjcHeAWALQtgGT3JErxULl0oz6R6+3ug91I7IErs93eCFhPCZPHBs4QJS7YWEV7A3sxw==

 "@xstate/vue@^2.0.0":
  version "2.0.0"
@@ -220,22 +236,34 @@ arg@^5.0.2:
  integrity sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==

 autoprefixer@^10.4.7:
-  version "10.4.8"
-  resolved "https://registry.npmmirror.com/autoprefixer/-/autoprefixer-10.4.8.tgz"
-  integrity sha512-75Jr6Q/XpTqEf6D2ltS5uMewJIx5irCU1oBYJrWjFenq/m12WRRrz6g15L1EIoYvPLXTbEry7rDOwrcYNj77xw==
+  version "10.4.12"
+  resolved "https://registry.npmmirror.com/autoprefixer/-/autoprefixer-10.4.12.tgz#183f30bf0b0722af54ee5ef257f7d4320bb33129"
+  integrity sha512-WrCGV9/b97Pa+jtwf5UGaRjgQIg7OK3D06GnoYoZNcG1Xb8Gt3EfuKjlhh9i/VtT16g6PYjZ69jdJ2g8FxSC4Q==
  dependencies:
-    browserslist "^4.21.3"
-    caniuse-lite "^1.0.30001373"
+    browserslist "^4.21.4"
+    caniuse-lite "^1.0.30001407"
    fraction.js "^4.2.0"
    normalize-range "^0.1.2"
    picocolors "^1.0.0"
    postcss-value-parser "^4.2.0"

+balanced-match@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
+  integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
+
 binary-extensions@^2.0.0:
  version "2.2.0"
  resolved "https://registry.npmmirror.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
  integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==

+brace-expansion@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-2.0.1.tgz#1edc459e0f0c548486ecf9fc99f2221364b9a0ae"
+  integrity sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==
+  dependencies:
+    balanced-match "^1.0.0"
+
 braces@^3.0.2, braces@~3.0.2:
  version "3.0.2"
  resolved "https://registry.npmmirror.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
@@ -243,25 +271,25 @@ braces@^3.0.2, braces@~3.0.2:
  dependencies:
    fill-range "^7.0.1"

-browserslist@^4.21.3:
-  version "4.21.3"
-  resolved "https://registry.npmmirror.com/browserslist/-/browserslist-4.21.3.tgz"
-  integrity sha512-898rgRXLAyRkM1GryrrBHGkqA5hlpkV5MhtZwg9QXeiyLUYs2k00Un05aX5l2/yJIOObYKOpS2JNo8nJDE7fWQ==
+browserslist@^4.21.4:
+  version "4.21.4"
+  resolved "https://registry.npmmirror.com/browserslist/-/browserslist-4.21.4.tgz#e7496bbc67b9e39dd0f98565feccdcb0d4ff6987"
+  integrity sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw==
  dependencies:
-    caniuse-lite "^1.0.30001370"
-    electron-to-chromium "^1.4.202"
+    caniuse-lite "^1.0.30001400"
+    electron-to-chromium "^1.4.251"
    node-releases "^2.0.6"
-    update-browserslist-db "^1.0.5"
+    update-browserslist-db "^1.0.9"

 camelcase-css@^2.0.1:
  version "2.0.1"
  resolved "https://registry.npmmirror.com/camelcase-css/-/camelcase-css-2.0.1.tgz#ee978f6947914cc30c6b44741b6ed1df7f043fd5"
  integrity sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==

-caniuse-lite@^1.0.30001370, caniuse-lite@^1.0.30001373:
-  version "1.0.30001373"
-  resolved "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001373.tgz"
-  integrity sha512-pJYArGHrPp3TUqQzFYRmP/lwJlj8RCbVe3Gd3eJQkAV8SAC6b19XS9BjMvRdvaS8RMkaTN8ZhoHP6S1y8zzwEQ==
+caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001407:
+  version "1.0.30001421"
+  resolved "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001421.tgz#979993aaacff5ab72a8d0d58c28ddbcb7b4deba6"
+  integrity sha512-Sw4eLbgUJAEhjLs1Fa+mk45sidp1wRn5y6GtDpHGBaNJ9OCDJaVh2tIaWWUnGfuXfKf1JCBaIarak3FkVAvEeA==

 chokidar@^3.5.3:
  version "3.5.3"
@@ -320,9 +348,9 @@ cssesc@^3.0.0:
  integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==

 csstype@^2.6.8:
-  version "2.6.20"
-  resolved "https://registry.npmmirror.com/csstype/-/csstype-2.6.20.tgz"
-  integrity sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==
+  version "2.6.21"
+  resolved "https://registry.npmmirror.com/csstype/-/csstype-2.6.21.tgz#2efb85b7cc55c80017c66a5ad7cbd931fda3a90e"
+  integrity sha512-Z1PhmomIfypOpoMjRQB70jfvy/wxT50qW08YXO5lMIJkrdq4yOTR+AW7FqutScmB9NkLwxo+jU+kZLbofZZq/w==

 daisyui@^2.31.0:
  version "2.31.0"
@@ -334,10 +362,15 @@ daisyui@^2.31.0:
    postcss-js "^4.0.0"
    tailwindcss "^3"

+de-indent@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.npmmirror.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
+  integrity sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==
+
 defined@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.npmmirror.com/defined/-/defined-1.0.0.tgz#c98d9bcef75674188e110969151199e39b1fa693"
-  integrity sha512-Y2caI5+ZwS5c3RiNDJ6u53VhQHv+hHKwhkI1iHvceKUHw9Df6EK2zRLfjejRgMuCuxK7PfSWIMwWecceVvThjQ==
+  version "1.0.1"
+  resolved "https://registry.npmmirror.com/defined/-/defined-1.0.1.tgz#c0b9db27bfaffd95d6f61399419b893df0f91ebf"
+  integrity sha512-hsBd2qSVCRE+5PmNdHt1uzyrFu5d3RwmFDKzyNZMFq/EwDNJF7Ee5+D5oEKF0hU6LhtoUF1macFvOe4AskQC1Q==

 detective@^5.2.1:
  version "5.2.1"
@@ -359,152 +392,153 @@ dlv@^1.1.3:
  integrity sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==

 echarts@^5.3.3:
-  version "5.3.3"
-  resolved "https://registry.npmmirror.com/echarts/-/echarts-5.3.3.tgz"
-  integrity sha512-BRw2serInRwO5SIwRviZ6Xgm5Lb7irgz+sLiFMmy/HOaf4SQ+7oYqxKzRHAKp4xHQ05AuHw1xvoQWJjDQq/FGw==
+  version "5.4.0"
+  resolved "https://registry.npmmirror.com/echarts/-/echarts-5.4.0.tgz#a9a8e5367293a397408d3bf3e2638b869249ce04"
+  integrity sha512-uPsO9VRUIKAdFOoH3B0aNg7NRVdN7aM39/OjovjO9MwmWsAkfGyeXJhK+dbRi51iDrQWliXV60/XwLA7kg3z0w==
  dependencies:
    tslib "2.3.0"
-    zrender "5.3.2"
+    zrender "5.4.0"

-electron-to-chromium@^1.4.202:
-  version "1.4.206"
-  resolved "https://registry.npmmirror.com/electron-to-chromium/-/electron-to-chromium-1.4.206.tgz"
-  integrity sha512-h+Fadt1gIaQ06JaIiyqPsBjJ08fV5Q7md+V8bUvQW/9OvXfL2LRICTz2EcnnCP7QzrFTS6/27MRV6Bl9Yn97zA==
+electron-to-chromium@^1.4.251:
+  version "1.4.284"
+  resolved "https://registry.npmmirror.com/electron-to-chromium/-/electron-to-chromium-1.4.284.tgz#61046d1e4cab3a25238f6bf7413795270f125592"
+  integrity sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA==

-esbuild-android-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-android-64/-/esbuild-android-64-0.14.51.tgz#414a087cb0de8db1e347ecca6c8320513de433db"
-  integrity sha512-6FOuKTHnC86dtrKDmdSj2CkcKF8PnqkaIXqvgydqfJmqBazCPdw+relrMlhGjkvVdiiGV70rpdnyFmA65ekBCQ==
+esbuild-android-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-android-64/-/esbuild-android-64-0.14.54.tgz#505f41832884313bbaffb27704b8bcaa2d8616be"
+  integrity sha512-Tz2++Aqqz0rJ7kYBfz+iqyE3QMycD4vk7LBRyWaAVFgFtQ/O8EJOnVmTOiDWYZ/uYzB4kvP+bqejYdVKzE5lAQ==

-esbuild-android-arm64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-android-arm64/-/esbuild-android-arm64-0.14.51.tgz#55de3bce2aab72bcd2b606da4318ad00fb9c8151"
-  integrity sha512-vBtp//5VVkZWmYYvHsqBRCMMi1MzKuMIn5XDScmnykMTu9+TD9v0NMEDqQxvtFToeYmojdo5UCV2vzMQWJcJ4A==
+esbuild-android-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-android-arm64/-/esbuild-android-arm64-0.14.54.tgz#8ce69d7caba49646e009968fe5754a21a9871771"
+  integrity sha512-F9E+/QDi9sSkLaClO8SOV6etqPd+5DgJje1F9lOWoNncDdOBL2YF59IhsWATSt0TLZbYCf3pNlTHvVV5VfHdvg==

-esbuild-darwin-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-darwin-64/-/esbuild-darwin-64-0.14.51.tgz#4259f23ed6b4cea2ec8a28d87b7fb9801f093754"
-  integrity sha512-YFmXPIOvuagDcwCejMRtCDjgPfnDu+bNeh5FU2Ryi68ADDVlWEpbtpAbrtf/lvFTWPexbgyKgzppNgsmLPr8PA==
+esbuild-darwin-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-darwin-64/-/esbuild-darwin-64-0.14.54.tgz#24ba67b9a8cb890a3c08d9018f887cc221cdda25"
+  integrity sha512-jtdKWV3nBviOd5v4hOpkVmpxsBy90CGzebpbO9beiqUYVMBtSc0AL9zGftFuBon7PNDcdvNCEuQqw2x0wP9yug==

-esbuild-darwin-arm64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.51.tgz#d77b4366a71d84e530ba019d540b538b295d494a"
-  integrity sha512-juYD0QnSKwAMfzwKdIF6YbueXzS6N7y4GXPDeDkApz/1RzlT42mvX9jgNmyOlWKN7YzQAYbcUEJmZJYQGdf2ow==
+esbuild-darwin-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.54.tgz#3f7cdb78888ee05e488d250a2bdaab1fa671bf73"
+  integrity sha512-OPafJHD2oUPyvJMrsCvDGkRrVCar5aVyHfWGQzY1dWnzErjrDuSETxwA2HSsyg2jORLY8yBfzc1MIpUkXlctmw==

-esbuild-freebsd-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.51.tgz#27b6587b3639f10519c65e07219d249b01f2ad38"
-  integrity sha512-cLEI/aXjb6vo5O2Y8rvVSQ7smgLldwYY5xMxqh/dQGfWO+R1NJOFsiax3IS4Ng300SVp7Gz3czxT6d6qf2cw0g==
+esbuild-freebsd-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.54.tgz#09250f997a56ed4650f3e1979c905ffc40bbe94d"
+  integrity sha512-OKwd4gmwHqOTp4mOGZKe/XUlbDJ4Q9TjX0hMPIDBUWWu/kwhBAudJdBoxnjNf9ocIB6GN6CPowYpR/hRCbSYAg==

-esbuild-freebsd-arm64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.51.tgz#63c435917e566808c71fafddc600aca4d78be1ec"
-  integrity sha512-TcWVw/rCL2F+jUgRkgLa3qltd5gzKjIMGhkVybkjk6PJadYInPtgtUBp1/hG+mxyigaT7ib+od1Xb84b+L+1Mg==
+esbuild-freebsd-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.54.tgz#bafb46ed04fc5f97cbdb016d86947a79579f8e48"
+  integrity sha512-sFwueGr7OvIFiQT6WeG0jRLjkjdqWWSrfbVwZp8iMP+8UHEHRBvlaxL6IuKNDwAozNUmbb8nIMXa7oAOARGs1Q==

-esbuild-linux-32@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-32/-/esbuild-linux-32-0.14.51.tgz#c3da774143a37e7f11559b9369d98f11f997a5d9"
-  integrity sha512-RFqpyC5ChyWrjx8Xj2K0EC1aN0A37H6OJfmUXIASEqJoHcntuV3j2Efr9RNmUhMfNE6yEj2VpYuDteZLGDMr0w==
+esbuild-linux-32@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-32/-/esbuild-linux-32-0.14.54.tgz#e2a8c4a8efdc355405325033fcebeb941f781fe5"
+  integrity sha512-1ZuY+JDI//WmklKlBgJnglpUL1owm2OX+8E1syCD6UAxcMM/XoWd76OHSjl/0MR0LisSAXDqgjT3uJqT67O3qw==

-esbuild-linux-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-64/-/esbuild-linux-64-0.14.51.tgz#5d92b67f674e02ae0b4a9de9a757ba482115c4ae"
-  integrity sha512-dxjhrqo5i7Rq6DXwz5v+MEHVs9VNFItJmHBe1CxROWNf4miOGoQhqSG8StStbDkQ1Mtobg6ng+4fwByOhoQoeA==
+esbuild-linux-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-64/-/esbuild-linux-64-0.14.54.tgz#de5fdba1c95666cf72369f52b40b03be71226652"
+  integrity sha512-EgjAgH5HwTbtNsTqQOXWApBaPVdDn7XcK+/PtJwZLT1UmpLoznPd8c5CxqsH2dQK3j05YsB3L17T8vE7cp4cCg==

-esbuild-linux-arm64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.51.tgz#dac84740516e859d8b14e1ecc478dd5241b10c93"
-  integrity sha512-D9rFxGutoqQX3xJPxqd6o+kvYKeIbM0ifW2y0bgKk5HPgQQOo2k9/2Vpto3ybGYaFPCE5qTGtqQta9PoP6ZEzw==
+esbuild-linux-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.54.tgz#dae4cd42ae9787468b6a5c158da4c84e83b0ce8b"
+  integrity sha512-WL71L+0Rwv+Gv/HTmxTEmpv0UgmxYa5ftZILVi2QmZBgX3q7+tDeOQNqGtdXSdsL8TQi1vIaVFHUPDe0O0kdig==

-esbuild-linux-arm@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-arm/-/esbuild-linux-arm-0.14.51.tgz#b3ae7000696cd53ed95b2b458554ff543a60e106"
-  integrity sha512-LsJynDxYF6Neg7ZC7748yweCDD+N8ByCv22/7IAZglIEniEkqdF4HCaa49JNDLw1UQGlYuhOB8ZT/MmcSWzcWg==
+esbuild-linux-arm@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-arm/-/esbuild-linux-arm-0.14.54.tgz#a2c1dff6d0f21dbe8fc6998a122675533ddfcd59"
+  integrity sha512-qqz/SjemQhVMTnvcLGoLOdFpCYbz4v4fUo+TfsWG+1aOu70/80RV6bgNpR2JCrppV2moUQkww+6bWxXRL9YMGw==

-esbuild-linux-mips64le@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.51.tgz#dad10770fac94efa092b5a0643821c955a9dd385"
-  integrity sha512-vS54wQjy4IinLSlb5EIlLoln8buh1yDgliP4CuEHumrPk4PvvP4kTRIG4SzMXm6t19N0rIfT4bNdAxzJLg2k6A==
+esbuild-linux-mips64le@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.54.tgz#d9918e9e4cb972f8d6dae8e8655bf9ee131eda34"
+  integrity sha512-qTHGQB8D1etd0u1+sB6p0ikLKRVuCWhYQhAHRPkO+OF3I/iSlTKNNS0Lh2Oc0g0UFGguaFZZiPJdJey3AGpAlw==

-esbuild-linux-ppc64le@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.51.tgz#b68c2f8294d012a16a88073d67e976edd4850ae0"
-  integrity sha512-xcdd62Y3VfGoyphNP/aIV9LP+RzFw5M5Z7ja+zdpQHHvokJM7d0rlDRMN+iSSwvUymQkqZO+G/xjb4/75du8BQ==
+esbuild-linux-ppc64le@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.54.tgz#3f9a0f6d41073fb1a640680845c7de52995f137e"
+  integrity sha512-j3OMlzHiqwZBDPRCDFKcx595XVfOfOnv68Ax3U4UKZ3MTYQB5Yz3X1mn5GnodEVYzhtZgxEBidLWeIs8FDSfrQ==

-esbuild-linux-riscv64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.51.tgz#608a318b8697123e44c1e185cdf6708e3df50b93"
-  integrity sha512-syXHGak9wkAnFz0gMmRBoy44JV0rp4kVCEA36P5MCeZcxFq8+fllBC2t6sKI23w3qd8Vwo9pTADCgjTSf3L3rA==
+esbuild-linux-riscv64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.54.tgz#618853c028178a61837bc799d2013d4695e451c8"
+  integrity sha512-y7Vt7Wl9dkOGZjxQZnDAqqn+XOqFD7IMWiewY5SPlNlzMX39ocPQlOaoxvT4FllA5viyV26/QzHtvTjVNOxHZg==

-esbuild-linux-s390x@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.51.tgz#c9e7791170a3295dba79b93aa452beb9838a8625"
-  integrity sha512-kFAJY3dv+Wq8o28K/C7xkZk/X34rgTwhknSsElIqoEo8armCOjMJ6NsMxm48KaWY2h2RUYGtQmr+RGuUPKBhyw==
+esbuild-linux-s390x@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.54.tgz#d1885c4c5a76bbb5a0fe182e2c8c60eb9e29f2a6"
+  integrity sha512-zaHpW9dziAsi7lRcyV4r8dhfG1qBidQWUXweUjnw+lliChJqQr+6XD71K41oEIC3Mx1KStovEmlzm+MkGZHnHA==

-esbuild-netbsd-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.51.tgz#0abd40b8c2e37fda6f5cc41a04cb2b690823d891"
-  integrity sha512-ZZBI7qrR1FevdPBVHz/1GSk1x5GDL/iy42Zy8+neEm/HA7ma+hH/bwPEjeHXKWUDvM36CZpSL/fn1/y9/Hb+1A==
+esbuild-netbsd-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.54.tgz#69ae917a2ff241b7df1dbf22baf04bd330349e81"
+  integrity sha512-PR01lmIMnfJTgeU9VJTDY9ZerDWVFIUzAtJuDHwwceppW7cQWjBBqP48NdeRtoP04/AtO9a7w3viI+PIDr6d+w==

-esbuild-openbsd-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.51.tgz#4adba0b7ea7eb1428bb00d8e94c199a949b130e8"
-  integrity sha512-7R1/p39M+LSVQVgDVlcY1KKm6kFKjERSX1lipMG51NPcspJD1tmiZSmmBXoY5jhHIu6JL1QkFDTx94gMYK6vfA==
+esbuild-openbsd-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.54.tgz#db4c8495287a350a6790de22edea247a57c5d47b"
+  integrity sha512-Qyk7ikT2o7Wu76UsvvDS5q0amJvmRzDyVlL0qf5VLsLchjCa1+IAvd8kTBgUxD7VBUUVgItLkk609ZHUc1oCaw==

-esbuild-sunos-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-sunos-64/-/esbuild-sunos-64-0.14.51.tgz#4b8a6d97dfedda30a6e39607393c5c90ebf63891"
-  integrity sha512-HoHaCswHxLEYN8eBTtyO0bFEWvA3Kdb++hSQ/lLG7TyKF69TeSG0RNoBRAs45x/oCeWaTDntEZlYwAfQlhEtJA==
+esbuild-sunos-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-sunos-64/-/esbuild-sunos-64-0.14.54.tgz#54287ee3da73d3844b721c21bc80c1dc7e1bf7da"
+  integrity sha512-28GZ24KmMSeKi5ueWzMcco6EBHStL3B6ubM7M51RmPwXQGLe0teBGJocmWhgwccA1GeFXqxzILIxXpHbl9Q/Kw==

-esbuild-windows-32@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-windows-32/-/esbuild-windows-32-0.14.51.tgz#d31d8ca0c1d314fb1edea163685a423b62e9ac17"
-  integrity sha512-4rtwSAM35A07CBt1/X8RWieDj3ZUHQqUOaEo5ZBs69rt5WAFjP4aqCIobdqOy4FdhYw1yF8Z0xFBTyc9lgPtEg==
+esbuild-windows-32@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-windows-32/-/esbuild-windows-32-0.14.54.tgz#f8aaf9a5667630b40f0fb3aa37bf01bbd340ce31"
+  integrity sha512-T+rdZW19ql9MjS7pixmZYVObd9G7kcaZo+sETqNH4RCkuuYSuv9AGHUVnPoP9hhuE1WM1ZimHz1CIBHBboLU7w==

-esbuild-windows-64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-windows-64/-/esbuild-windows-64-0.14.51.tgz"
-  integrity sha512-HoN/5HGRXJpWODprGCgKbdMvrC3A2gqvzewu2eECRw2sYxOUoh2TV1tS+G7bHNapPGI79woQJGV6pFH7GH7qnA==
+esbuild-windows-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-windows-64/-/esbuild-windows-64-0.14.54.tgz#bf54b51bd3e9b0f1886ffdb224a4176031ea0af4"
+  integrity sha512-AoHTRBUuYwXtZhjXZbA1pGfTo8cJo3vZIcWGLiUcTNgHpJJMC1rVA44ZereBHMJtotyN71S8Qw0npiCIkW96cQ==

-esbuild-windows-arm64@0.14.51:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.51.tgz#0220d2304bfdc11bc27e19b2aaf56edf183e4ae9"
-  integrity sha512-JQDqPjuOH7o+BsKMSddMfmVJXrnYZxXDHsoLHc0xgmAZkOOCflRmC43q31pk79F9xuyWY45jDBPolb5ZgGOf9g==
+esbuild-windows-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.54.tgz#937d15675a15e4b0e4fafdbaa3a01a776a2be982"
+  integrity sha512-M0kuUvXhot1zOISQGXwWn6YtS+Y/1RT9WrVIOywZnJHo3jCDyewAc79aKNQWFCQm+xNHVTq9h8dZKvygoXQQRg==

 esbuild@^0.14.27:
-  version "0.14.51"
-  resolved "https://registry.npmmirror.com/esbuild/-/esbuild-0.14.51.tgz"
-  integrity sha512-+CvnDitD7Q5sT7F+FM65sWkF8wJRf+j9fPcprxYV4j+ohmzVj2W7caUqH2s5kCaCJAfcAICjSlKhDCcvDpU7nw==
+  version "0.14.54"
+  resolved "https://registry.npmmirror.com/esbuild/-/esbuild-0.14.54.tgz#8b44dcf2b0f1a66fc22459943dccf477535e9aa2"
+  integrity sha512-Cy9llcy8DvET5uznocPyqL3BFRrFXSVqbgpMJ9Wz8oVjZlh/zUSNbPRbov0VX7VxN2JH1Oa0uNxZ7eLRb62pJA==
  optionalDependencies:
-    esbuild-android-64 "0.14.51"
-    esbuild-android-arm64 "0.14.51"
-    esbuild-darwin-64 "0.14.51"
-    esbuild-darwin-arm64 "0.14.51"
-    esbuild-freebsd-64 "0.14.51"
-    esbuild-freebsd-arm64 "0.14.51"
-    esbuild-linux-32 "0.14.51"
-    esbuild-linux-64 "0.14.51"
-    esbuild-linux-arm "0.14.51"
-    esbuild-linux-arm64 "0.14.51"
-    esbuild-linux-mips64le "0.14.51"
-    esbuild-linux-ppc64le "0.14.51"
-    esbuild-linux-riscv64 "0.14.51"
-    esbuild-linux-s390x "0.14.51"
-    esbuild-netbsd-64 "0.14.51"
-    esbuild-openbsd-64 "0.14.51"
-    esbuild-sunos-64 "0.14.51"
-    esbuild-windows-32 "0.14.51"
-    esbuild-windows-64 "0.14.51"
-    esbuild-windows-arm64 "0.14.51"
+    "@esbuild/linux-loong64" "0.14.54"
+    esbuild-android-64 "0.14.54"
+    esbuild-android-arm64 "0.14.54"
+    esbuild-darwin-64 "0.14.54"
+    esbuild-darwin-arm64 "0.14.54"
+    esbuild-freebsd-64 "0.14.54"
+    esbuild-freebsd-arm64 "0.14.54"
+    esbuild-linux-32 "0.14.54"
+    esbuild-linux-64 "0.14.54"
+    esbuild-linux-arm "0.14.54"
+    esbuild-linux-arm64 "0.14.54"
+    esbuild-linux-mips64le "0.14.54"
+    esbuild-linux-ppc64le "0.14.54"
+    esbuild-linux-riscv64 "0.14.54"
+    esbuild-linux-s390x "0.14.54"
+    esbuild-netbsd-64 "0.14.54"
+    esbuild-openbsd-64 "0.14.54"
+    esbuild-sunos-64 "0.14.54"
+    esbuild-windows-32 "0.14.54"
+    esbuild-windows-64 "0.14.54"
+    esbuild-windows-arm64 "0.14.54"

 escalade@^3.1.1:
  version "3.1.1"
-  resolved "https://registry.npmmirror.com/escalade/-/escalade-3.1.1.tgz"
+  resolved "https://registry.npmmirror.com/escalade/-/escalade-3.1.1.tgz#d8cfdc7000965c5a0174b4a82eaa5c0552742e40"
  integrity sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==

 estree-walker@^2.0.2:
  version "2.0.2"
-  resolved "https://registry.npmmirror.com/estree-walker/-/estree-walker-2.0.2.tgz"
+  resolved "https://registry.npmmirror.com/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac"
  integrity sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==

 fast-glob@^3.2.11:
@@ -539,7 +573,7 @@ fill-range@^7.0.1:

 fraction.js@^4.2.0:
  version "4.2.0"
-  resolved "https://registry.npmmirror.com/fraction.js/-/fraction.js-4.2.0.tgz"
+  resolved "https://registry.npmmirror.com/fraction.js/-/fraction.js-4.2.0.tgz#448e5109a313a3527f5a3ab2119ec4cf0e0e2950"
  integrity sha512-MhLuK+2gUcnZe8ZHlaaINnQLl0xRIGRfcGk2yl8xoQAfHrSsL3rYu6FCmBdkdbhc9EPlwyGHewaRsvwRMJtAlA==

 fsevents@~2.3.2:
@@ -573,6 +607,11 @@ has@^1.0.3:
  dependencies:
    function-bind "^1.1.1"

+he@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.npmmirror.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
+  integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
+
 highlight.js@^11.6.0:
  version "11.6.0"
  resolved "https://registry.npmmirror.com/highlight.js/-/highlight.js-11.6.0.tgz"
@@ -591,9 +630,9 @@ is-binary-path@~2.1.0:
    binary-extensions "^2.0.0"

 is-core-module@^2.9.0:
-  version "2.9.0"
-  resolved "https://registry.npmmirror.com/is-core-module/-/is-core-module-2.9.0.tgz"
-  integrity sha512-+5FPy5PnwmO3lvfMb0AsoPaBG+5KHUI0wYFXOtYPnVVVspTFUuMZNfNaNVRt3FZadstu2c8x23vykRW/NBoU6A==
+  version "2.11.0"
+  resolved "https://registry.npmmirror.com/is-core-module/-/is-core-module-2.11.0.tgz#ad4cb3e3863e814523c96f3f58d26cc570ff0144"
+  integrity sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==
  dependencies:
    has "^1.0.3"

@@ -621,7 +660,7 @@ lilconfig@^2.0.5, lilconfig@^2.0.6:

 magic-string@^0.25.7:
  version "0.25.9"
-  resolved "https://registry.npmmirror.com/magic-string/-/magic-string-0.25.9.tgz"
+  resolved "https://registry.npmmirror.com/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c"
  integrity sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==
  dependencies:
    sourcemap-codec "^1.4.8"
@@ -639,19 +678,31 @@ micromatch@^4.0.4:
    braces "^3.0.2"
    picomatch "^2.3.1"

+minimatch@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.npmmirror.com/minimatch/-/minimatch-5.1.0.tgz#1717b464f4971b144f6aabe8f2d0b8e4511e09c7"
+  integrity sha512-9TPBGGak4nHfGZsPBohm9AWg6NoT7QTCehS3BIJABslyZbzxfV78QM2Y6+i741OPZIafFAaiiEMh5OyIrJPgtg==
+  dependencies:
+    brace-expansion "^2.0.1"
+
 minimist@^1.2.6:
-  version "1.2.6"
-  resolved "https://registry.npmmirror.com/minimist/-/minimist-1.2.6.tgz"
-  integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==
+  version "1.2.7"
+  resolved "https://registry.npmmirror.com/minimist/-/minimist-1.2.7.tgz#daa1c4d91f507390437c6a8bc01078e7000c4d18"
+  integrity sha512-bzfL1YUZsP41gmu/qjrEk0Q6i2ix/cVeAhbCbqH9u3zYutS1cLg00qhrD0M2MVdCcx4Sc0UpP2eBWo9rotpq6g==
+
+muggle-string@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.npmmirror.com/muggle-string/-/muggle-string-0.1.0.tgz#1fda8a281c8b27bb8b70466dbc9f27586a8baa6c"
+  integrity sha512-Tr1knR3d2mKvvWthlk7202rywKbiOm4rVFLsfAaSIhJ6dt9o47W4S+JMtWhd/PW9Wrdew2/S2fSvhz3E2gkfEg==

 nanoid@^3.3.4:
  version "3.3.4"
-  resolved "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.4.tgz"
+  resolved "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab"
  integrity sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==

 node-releases@^2.0.6:
  version "2.0.6"
-  resolved "https://registry.npmmirror.com/node-releases/-/node-releases-2.0.6.tgz"
+  resolved "https://registry.npmmirror.com/node-releases/-/node-releases-2.0.6.tgz#8a7088c63a55e493845683ebf3c828d8c51c5503"
  integrity sha512-PiVXnNuFm5+iYkLBNeq5211hvO38y63T0i2KKh2KnUs3RpzJ+JtODFjkD8yjLwnDkTYF1eKXheUwdssR+NRZdg==

 normalize-path@^3.0.0, normalize-path@~3.0.0:
@@ -661,7 +712,7 @@ normalize-path@^3.0.0, normalize-path@~3.0.0:

 normalize-range@^0.1.2:
  version "0.1.2"
-  resolved "https://registry.npmmirror.com/normalize-range/-/normalize-range-0.1.2.tgz"
+  resolved "https://registry.npmmirror.com/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942"
  integrity sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==

 object-hash@^3.0.0:
@@ -690,11 +741,11 @@ pify@^2.3.0:
  integrity sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==

 pinia@^2.0.15:
-  version "2.0.17"
-  resolved "https://registry.npmmirror.com/pinia/-/pinia-2.0.17.tgz"
-  integrity sha512-AtwLwEWQgIjofjgeFT+nxbnK5lT2QwQjaHNEDqpsi2AiCwf/NY78uWTeHUyEhiiJy8+sBmw0ujgQMoQbWiZDfA==
+  version "2.0.23"
+  resolved "https://registry.npmmirror.com/pinia/-/pinia-2.0.23.tgz#570f5f82160b656b412602789683faa95502d227"
+  integrity sha512-N15hFf4o5STrxpNrib1IEb1GOArvPYf1zPvQVRGOO1G1d74Ak0J0lVyalX/SmrzdT4Q0nlEFjbURsmBmIGUR5Q==
  dependencies:
-    "@vue/devtools-api" "^6.2.1"
+    "@vue/devtools-api" "^6.4.4"
    vue-demi "*"

 postcss-import@^14.1.0:
@@ -742,9 +793,9 @@ postcss-value-parser@^4.0.0, postcss-value-parser@^4.2.0:
  integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==

 postcss@^8.1.10, postcss@^8.4.13, postcss@^8.4.14:
-  version "8.4.14"
-  resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.14.tgz"
-  integrity sha512-E398TUmfAYFPBSdzgeieK2Y1+1cpdxJx8yXbK/m57nRhKSmk1GB2tO4lbLBtlkfPQTDKfe4Xqv1ASWPpayPEig==
+  version "8.4.18"
+  resolved "https://registry.npmmirror.com/postcss/-/postcss-8.4.18.tgz#6d50046ea7d3d66a85e0e782074e7203bc7fbca2"
+  integrity sha512-Wi8mWhncLJm11GATDaQKobXSNEYGUHeQLiQqDFG1qQ5UTDPTEvKw0Xt5NsTpktGTwLps3ByrWsBrG0rB8YQ9oA==
  dependencies:
    nanoid "^3.3.4"
    picocolors "^1.0.0"
@@ -776,7 +827,7 @@ readdirp@~3.6.0:

 resolve@^1.1.7, resolve@^1.22.0, resolve@^1.22.1:
  version "1.22.1"
-  resolved "https://registry.npmmirror.com/resolve/-/resolve-1.22.1.tgz"
+  resolved "https://registry.npmmirror.com/resolve/-/resolve-1.22.1.tgz#27cb2ebb53f91abb49470a928bba7558066ac177"
  integrity sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==
  dependencies:
    is-core-module "^2.9.0"
@@ -788,10 +839,10 @@ reusify@^1.0.4:
  resolved "https://registry.npmmirror.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
  integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==

-rollup@^2.59.0:
-  version "2.77.2"
-  resolved "https://registry.npmmirror.com/rollup/-/rollup-2.77.2.tgz"
-  integrity sha512-m/4YzYgLcpMQbxX3NmAqDvwLATZzxt8bIegO78FZLl+lAgKJBd1DRAOeEiZcKOIOPjxE6ewHWHNgGEalFXuz1g==
+"rollup@>=2.59.0 <2.78.0":
+  version "2.77.3"
+  resolved "https://registry.npmmirror.com/rollup/-/rollup-2.77.3.tgz#8f00418d3a2740036e15deb653bed1a90ee0cc12"
+  integrity sha512-/qxNTG7FbmefJWoeeYJFbHehJ2HNWnjkAFRKzWN/45eNBBF/r8lo992CwcJXEzyVxs5FmfId+vTSTQDb+bxA+g==
  optionalDependencies:
    fsevents "~2.3.2"

@@ -811,17 +862,17 @@ simple-swizzle@^0.2.2:

 source-map-js@^1.0.2:
  version "1.0.2"
-  resolved "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.0.2.tgz"
+  resolved "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==

 source-map@^0.6.1:
  version "0.6.1"
-  resolved "https://registry.npmmirror.com/source-map/-/source-map-0.6.1.tgz"
+  resolved "https://registry.npmmirror.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==

 sourcemap-codec@^1.4.8:
  version "1.4.8"
-  resolved "https://registry.npmmirror.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz"
+  resolved "https://registry.npmmirror.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
  integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==

 supports-preserve-symlinks-flag@^1.0.0:
@@ -829,7 +880,7 @@ supports-preserve-symlinks-flag@^1.0.0:
  resolved "https://registry.npmmirror.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
  integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==

-tailwindcss@^3:
+tailwindcss@^3, tailwindcss@^3.1.4:
  version "3.1.8"
  resolved "https://registry.npmmirror.com/tailwindcss/-/tailwindcss-3.1.8.tgz#4f8520550d67a835d32f2f4021580f9fddb7b741"
  integrity sha512-YSneUCZSFDYMwk+TGq8qYFdCA3yfBRdBlS7txSq0LUmzyeqRe3a8fBQzbz9M3WS/iFT4BNf/nmw9mEzrnSaC0g==
@@ -857,34 +908,6 @@ tailwindcss@^3:
    quick-lru "^5.1.1"
    resolve "^1.22.1"

-tailwindcss@^3.1.4:
-  version "3.1.7"
-  resolved "https://registry.npmmirror.com/tailwindcss/-/tailwindcss-3.1.7.tgz"
-  integrity sha512-r7mgumZ3k0InfVPpGWcX8X/Ut4xBfv+1O/+C73ar/m01LxGVzWvPxF/w6xIUPEztrCoz7axfx0SMdh8FH8ZvRQ==
-  dependencies:
-    arg "^5.0.2"
-    chokidar "^3.5.3"
-    color-name "^1.1.4"
-    detective "^5.2.1"
-    didyoumean "^1.2.2"
-    dlv "^1.1.3"
-    fast-glob "^3.2.11"
-    glob-parent "^6.0.2"
-    is-glob "^4.0.3"
-    lilconfig "^2.0.6"
-    normalize-path "^3.0.0"
-    object-hash "^3.0.0"
-    picocolors "^1.0.0"
-    postcss "^8.4.14"
-    postcss-import "^14.1.0"
-    postcss-js "^4.0.0"
-    postcss-load-config "^3.1.4"
-    postcss-nested "5.0.6"
-    postcss-selector-parser "^6.0.10"
-    postcss-value-parser "^4.2.0"
-    quick-lru "^5.1.1"
-    resolve "^1.22.1"
-
 to-regex-range@^5.0.1:
  version "5.0.1"
  resolved "https://registry.npmmirror.com/to-regex-range/-/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4"
@@ -894,77 +917,86 @@ to-regex-range@^5.0.1:

 tslib@2.3.0:
  version "2.3.0"
-  resolved "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz"
+  resolved "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz#803b8cdab3e12ba581a4ca41c8839bbb0dacb09e"
  integrity sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==

 typescript@^4.7.4:
-  version "4.7.4"
-  resolved "https://registry.npmmirror.com/typescript/-/typescript-4.7.4.tgz"
-  integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==
+  version "4.8.4"
+  resolved "https://registry.npmmirror.com/typescript/-/typescript-4.8.4.tgz#c464abca159669597be5f96b8943500b238e60e6"
+  integrity sha512-QCh+85mCy+h0IGff8r5XWzOVSbBO+KfeYrMQh7NJ58QujwcE22u+NUSmUxqF+un70P9GXKxa2HCNiTTMJknyjQ==

-update-browserslist-db@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.npmmirror.com/update-browserslist-db/-/update-browserslist-db-1.0.5.tgz"
-  integrity sha512-dteFFpCyvuDdr9S/ff1ISkKt/9YZxKjI9WlRR99c180GaztJtRa/fn18FdxGVKVsnPY7/a/FDN68mcvUmP4U7Q==
+update-browserslist-db@^1.0.9:
+  version "1.0.10"
+  resolved "https://registry.npmmirror.com/update-browserslist-db/-/update-browserslist-db-1.0.10.tgz#0f54b876545726f17d00cd9a2561e6dade943ff3"
+  integrity sha512-OztqDenkfFkbSG+tRxBeAnCVPckDBcvibKd35yDONx6OU8N7sqgwc7rCbkJ/WcYtVRZ4ba68d6byhC21GFh7sQ==
  dependencies:
    escalade "^3.1.1"
    picocolors "^1.0.0"

 util-deprecate@^1.0.2:
  version "1.0.2"
-  resolved "https://registry.npmmirror.com/util-deprecate/-/util-deprecate-1.0.2.tgz"
+  resolved "https://registry.npmmirror.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
  integrity sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==

 vite@^2.9.9:
-  version "2.9.14"
-  resolved "https://registry.npmmirror.com/vite/-/vite-2.9.14.tgz"
-  integrity sha512-P/UCjSpSMcE54r4mPak55hWAZPlyfS369svib/gpmz8/01L822lMPOJ/RYW6tLCe1RPvMvOsJ17erf55bKp4Hw==
+  version "2.9.15"
+  resolved "https://registry.npmmirror.com/vite/-/vite-2.9.15.tgz#2858dd5b2be26aa394a283e62324281892546f0b"
+  integrity sha512-fzMt2jK4vQ3yK56te3Kqpkaeq9DkcZfBbzHwYpobasvgYmP2SoAr6Aic05CsB4CzCZbsDv4sujX3pkEGhLabVQ==
  dependencies:
    esbuild "^0.14.27"
    postcss "^8.4.13"
    resolve "^1.22.0"
-    rollup "^2.59.0"
+    rollup ">=2.59.0 <2.78.0"
  optionalDependencies:
    fsevents "~2.3.2"

 vue-demi@*:
-  version "0.13.6"
-  resolved "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.13.6.tgz"
-  integrity sha512-02NYpxgyGE2kKGegRPYlNQSL1UWfA/+JqvzhGCOYjhfbLWXU5QQX0+9pAm/R2sCOPKr5NBxVIab7fvFU0B1RxQ==
+  version "0.13.11"
+  resolved "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.13.11.tgz#7d90369bdae8974d87b1973564ad390182410d99"
+  integrity sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A==

 vue-router@4:
-  version "4.1.3"
-  resolved "https://registry.npmmirror.com/vue-router/-/vue-router-4.1.3.tgz"
-  integrity sha512-XvK81bcYglKiayT7/vYAg/f36ExPC4t90R/HIpzrZ5x+17BOWptXLCrEPufGgZeuq68ww4ekSIMBZY1qdUdfjA==
+  version "4.1.5"
+  resolved "https://registry.npmmirror.com/vue-router/-/vue-router-4.1.5.tgz#256f597e3f5a281a23352a6193aa6e342c8d9f9a"
+  integrity sha512-IsvoF5D2GQ/EGTs/Th4NQms9gd2NSqV+yylxIyp/OYp8xOwxmU8Kj/74E9DTSYAyH5LX7idVUngN3JSj1X4xcQ==
  dependencies:
    "@vue/devtools-api" "^6.1.4"

-vue-tsc@^0.34.7:
-  version "0.34.17"
-  resolved "https://registry.npmmirror.com/vue-tsc/-/vue-tsc-0.34.17.tgz"
-  integrity sha512-jzUXky44ZLHC4daaJag7FQr3idlPYN719/K1eObGljz5KaS2UnVGTU/XSYCd7d6ampYYg4OsyalbHyJIxV0aEQ==
+vue-template-compiler@^2.7.10:
+  version "2.7.13"
+  resolved "https://registry.npmmirror.com/vue-template-compiler/-/vue-template-compiler-2.7.13.tgz#1520a5aa6d1af51dd0622824e79814f6e8cb7058"
+  integrity sha512-jYM6TClwDS9YqP48gYrtAtaOhRKkbYmbzE+Q51gX5YDr777n7tNI/IZk4QV4l/PjQPNh/FVa/E92sh/RqKMrog==
  dependencies:
-    "@volar/vue-typescript" "0.34.17"
+    de-indent "^1.0.2"
+    he "^1.2.0"
+
+vue-tsc@1.0.8:
+  version "1.0.8"
+  resolved "https://registry.npmmirror.com/vue-tsc/-/vue-tsc-1.0.8.tgz#6f24e082878d1f4960dd89fe66fe3b70f6cc2ed5"
+  integrity sha512-+0sJ+QVH7SHLt8mV/uIw4xlHDk1mWigZkMFugfZTv8rlHpM3S2tCVZ0BWEGclT/0rKdO8j+St+mljpvhWPN/eQ==
+  dependencies:
+    "@volar/vue-language-core" "1.0.8"
+    "@volar/vue-typescript" "1.0.8"

 vue@^3.2.25:
-  version "3.2.37"
-  resolved "https://registry.npmmirror.com/vue/-/vue-3.2.37.tgz"
-  integrity sha512-bOKEZxrm8Eh+fveCqS1/NkG/n6aMidsI6hahas7pa0w/l7jkbssJVsRhVDs07IdDq7h9KHswZOgItnwJAgtVtQ==
+  version "3.2.41"
+  resolved "https://registry.npmmirror.com/vue/-/vue-3.2.41.tgz#ed452b8a0f7f2b962f055c8955139c28b1c06806"
+  integrity sha512-uuuvnrDXEeZ9VUPljgHkqB5IaVO8SxhPpqF2eWOukVrBnRBx2THPSGQBnVRt0GrIG1gvCmFXMGbd7FqcT1ixNQ==
  dependencies:
-    "@vue/compiler-dom" "3.2.37"
-    "@vue/compiler-sfc" "3.2.37"
-    "@vue/runtime-dom" "3.2.37"
-    "@vue/server-renderer" "3.2.37"
-    "@vue/shared" "3.2.37"
+    "@vue/compiler-dom" "3.2.41"
+    "@vue/compiler-sfc" "3.2.41"
+    "@vue/runtime-dom" "3.2.41"
+    "@vue/server-renderer" "3.2.41"
+    "@vue/shared" "3.2.41"

 xstate@^4.32.1:
-  version "4.32.1"
-  resolved "https://registry.npmmirror.com/xstate/-/xstate-4.32.1.tgz"
-  integrity sha512-QYUd+3GkXZ8i6qdixnOn28bL3EvA++LONYL/EMWwKlFSh/hiLndJ8YTnz77FDs+JUXcwU7NZJg7qoezoRHc4GQ==
+  version "4.33.6"
+  resolved "https://registry.npmmirror.com/xstate/-/xstate-4.33.6.tgz#9e23f78879af106f1de853aba7acb2bc3b1eb950"
+  integrity sha512-A5R4fsVKADWogK2a43ssu8Fz1AF077SfrKP1ZNyDBD8lNa/l4zfR//Luofp5GSWehOQr36Jp0k2z7b+sH2ivyg==

 xtend@^4.0.2:
  version "4.0.2"
-  resolved "https://registry.npmmirror.com/xtend/-/xtend-4.0.2.tgz"
+  resolved "https://registry.npmmirror.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
  integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==

 xterm-addon-fit@^0.6.0:
@@ -987,9 +1019,9 @@ yaml@^1.10.2:
  resolved "https://registry.npmmirror.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
  integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==

-zrender@5.3.2:
-  version "5.3.2"
-  resolved "https://registry.npmmirror.com/zrender/-/zrender-5.3.2.tgz"
-  integrity sha512-8IiYdfwHj2rx0UeIGZGGU4WEVSDEdeVCaIg/fomejg1Xu6OifAL1GVzIPHg2D+MyUkbNgPWji90t0a8IDk+39w==
+zrender@5.4.0:
+  version "5.4.0"
+  resolved "https://registry.npmmirror.com/zrender/-/zrender-5.4.0.tgz#d4f76e527b2e3bbd7add2bdaf27a16af85785576"
+  integrity sha512-rOS09Z2HSVGFs2dn/TuYk5BlCaZcVe8UDLLjj1ySYF828LATKKdxuakSZMvrDz54yiKPDYVfjdKqcX8Jky3BIA==
  dependencies:
    tslib "2.3.0"