From b88923a1285a82328cb32916a2fd1b0382683bba Mon Sep 17 00:00:00 2001
From: "meilin.huang" <954537473@qq.com>
Date: Sat, 2 Jul 2022 18:59:46 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=95=B0=E6=8D=AE=E5=BA=93=E8=A1=A8?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=94=AF=E6=8C=81=E5=88=86=E9=A1=B5=E6=9F=A5?=
 =?UTF-8?q?=E7=9C=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
 mayfly_go_web/package.json                 |  18 +--
 mayfly_go_web/src/views/ops/db/SqlExec.vue | 142 ++++++++++++++-------
 mayfly_go_web/yarn.lock                    | 117 ++++++++---------
 3 files changed, 158 insertions(+), 119 deletions(-)
diff --git a/mayfly_go_web/package.json b/mayfly_go_web/package.json
index cd95ae06..657a204c 100644
--- a/mayfly_go_web/package.json
+++ b/mayfly_go_web/package.json
@@ -7,25 +7,25 @@
     "lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/"
   },
   "dependencies": {
-    "@element-plus/icons-vue": "^2.0.4",
+    "@element-plus/icons-vue": "^2.0.6",
     "axios": "^0.27.2",
     "codemirror": "^5.65.5",
     "countup.js": "^2.0.7",
     "cropperjs": "^1.5.11",
-    "echarts": "^5.3.2",
-    "element-plus": "^2.2.6",
-    "jsoneditor": "^9.8.0",
+    "echarts": "^5.3.3",
+    "element-plus": "^2.2.8",
+    "jsoneditor": "^9.9.0",
     "lodash": "^4.17.21",
     "mitt": "^3.0.0",
     "nprogress": "^0.2.0",
     "screenfull": "^5.1.0",
     "sortablejs": "^1.13.0",
-    "sql-formatter": "^6.1.2",
+    "sql-formatter": "^7.0.3",
     "vue": "^3.2.37",
     "vue-clipboard3": "^1.0.1",
-    "vue-router": "^4.0.15",
+    "vue-router": "^4.0.16",
     "vuex": "^4.0.2",
-    "xterm": "^4.18.0",
+    "xterm": "^4.19.0",
     "xterm-addon-fit": "^0.5.0"
   },
   "devDependencies": {
@@ -43,8 +43,8 @@
     "prettier": "^2.3.0",
     "sass": "^1.45.1",
     "sass-loader": "^12.4.0",
-    "typescript": "^4.2.4",
-    "vite": "^2.9.10",
+    "typescript": "^4.7.4",
+    "vite": "^2.9.13",
     "vue-eslint-parser": "^8.0.1"
   },
   "browserslist": [
diff --git a/mayfly_go_web/src/views/ops/db/SqlExec.vue b/mayfly_go_web/src/views/ops/db/SqlExec.vue
index bc98f4e9..8217f420 100644
--- a/mayfly_go_web/src/views/ops/db/SqlExec.vue
+++ b/mayfly_go_web/src/views/ops/db/SqlExec.vue
@@ -190,7 +190,7 @@
                         @cell-dblclick="cellClick"
                         @sort-change="onTableSortChange"
                         @selection-change="onDataSelectionChange"
-                        :data="dt.execRes.data"
+                        :data="dt.datas"
                         size="small"
                         :max-height="dataTabsTableHeight"
                         v-loading="dt.loading"
@@ -200,12 +200,12 @@
                         border
                         class="mt5"
                     >
-                        
+                        
                         
                         
                     
+                    
+                        
+                    
                 
             
         
@@ -262,7 +272,7 @@ export default defineComponent({
 
         const state = reactive({
             token: token,
-            defalutLimit: 25, // 默认查询数量
+            defalutLimit: 20, // 默认查询数量
             dbs: [], // 数据库实例列表
             databaseList: [], // 数据库实例拥有的数据库列表,1数据库实例  -> 多数据库
             db: '', // 当前操作的数据库
@@ -270,7 +280,6 @@ export default defineComponent({
             dbId: null, // 当前选中操作的数据库实例
             tableName: '',
             tableMetadata: [],
-            columnMetadata: [],
             sqlName: '', // 当前sql模板名
             sqlNames: [], // 所有sql模板名
             activeName: 'Query',
@@ -355,7 +364,7 @@ export default defineComponent({
         const setHeight = () => {
             // 默认300px
             codemirror.setSize('auto', `${window.innerHeight - 538}px`);
-            state.dataTabsTableHeight = window.innerHeight - 258;
+            state.dataTabsTableHeight = window.innerHeight - 258 - 33;
         };
 
         /**
@@ -645,8 +654,6 @@ export default defineComponent({
             if (tableName == '') {
                 return;
             }
-            state.columnMetadata = (await getColumns(tableName)) as any;
-
             if (!execSelectSql) {
                 return;
             }
@@ -663,40 +670,17 @@ export default defineComponent({
             tab = {
                 label: tableName,
                 name: tableName,
-                execRes: {
-                    tableColumn: [],
-                    data: [],
-                },
-                querySql: getDefaultSelectSql(tableName),
+                datas: [],
+                columnNames: [],
+                pageNum: 1,
+                count: 0,
             };
+            tab.columnNames = await getColumnNames(tableName);
             state.dataTabs[tableName] = tab;
 
-            state.dataTabs[tableName].execRes.tableColumn = [];
-            state.dataTabs[tableName].execRes.data = [];
-
             onRefresh(tableName);
         };
 
-        /**
-         * 获取默认查询语句
-         */
-        const getDefaultSelectSql = (tableName: string, where: string = '', orderBy: string = '') => {
-            return `SELECT * FROM \`${tableName}\` ${where ? 'WHERE ' + where : ''} ${orderBy ? orderBy : ''} LIMIT ${state.defalutLimit}`;
-        };
-
-        const selectByCondition = async (tableName: string, condition: string) => {
-            notEmpty(condition, '条件不能为空');
-            state.dataTabs[tableName].loading = true;
-            try {
-                const colAndData: any = await runSql(getDefaultSelectSql(tableName, condition));
-                state.dataTabs[tableName].execRes.tableColumn = colAndData.colNames;
-                state.dataTabs[tableName].execRes.data = colAndData.res;
-                state.dataTabs[tableName].loading = false;
-            } catch (err) {
-                state.dataTabs[tableName].loading = false;
-            }
-        };
-
         /**
          * 获取表的所有列信息
          */
@@ -720,6 +704,11 @@ export default defineComponent({
             return tableMap.get(tableName);
         };
 
+        const getColumnNames = async (tableName: string) => {
+            const columns = await getColumns(tableName);
+            return columns.map((t: any) => t.columnName);
+        };
+
         /**
          * 条件查询,点击列信息后显示输入对应的值
          */
@@ -745,13 +734,70 @@ export default defineComponent({
         };
 
         const onRefresh = async (tableName: string) => {
+            const dataTab = state.dataTabs[tableName];
             // 查询条件置空
-            state.dataTabs[tableName].condition = '';
-            state.dataTabs[tableName].loading = true;
-            const colAndData: any = await runSql(state.dataTabs[tableName].querySql);
-            state.dataTabs[tableName].execRes.tableColumn = colAndData.colNames;
-            state.dataTabs[tableName].execRes.data = colAndData.res;
-            state.dataTabs[tableName].loading = false;
+            dataTab.condition = '';
+            dataTab.pageNum = 1;
+            setDataTabDatas(dataTab);
+        };
+
+        /**
+         * 数据tab修改页数
+         */
+        const handlePageChange = async (dataTab: any) => {
+            setDataTabDatas(dataTab);
+        };
+
+        /**
+         * 根据条件查询数据
+         */
+        const selectByCondition = async (tableName: string, condition: string) => {
+            notEmpty(condition, '条件不能为空');
+            const dataTab = state.dataTabs[tableName];
+            dataTab.pageNum = 1;
+            setDataTabDatas(dataTab);
+        };
+
+        /**
+         * 设置data tab的表数据
+         */
+        const setDataTabDatas = async (dataTab: any) => {
+            dataTab.loading = true;
+            try {
+                dataTab.count = await getTableCount(dataTab.name, dataTab.condition);
+                if (dataTab.count > 0) {
+                    const colAndData: any = await runSql(getDefaultSelectSql(dataTab.name, dataTab.condition, dataTab.orderBy, dataTab.pageNum));
+                    dataTab.datas = colAndData.res;
+                } else {
+                    dataTab.datas = [];
+                }
+            } finally {
+                dataTab.loading = false;
+            }
+        };
+
+        /**
+         * 获取表的统计数量
+         */
+        const getTableCount = async (tableName: string, condition: string = '') => {
+            const countRes = await runSql(getDefaultCountSql(tableName, condition));
+            return countRes.res[0].count;
+        };
+
+        /**
+         * 获取默认查询语句
+         */
+        const getDefaultSelectSql = (tableName: string, where: string = '', orderBy: string = '', pageNum: number = 1) => {
+            return `SELECT * FROM \`${tableName}\` ${where ? 'WHERE ' + where : ''} ${orderBy ? orderBy : ''} LIMIT ${
+                (pageNum - 1) * state.defalutLimit
+            }, ${state.defalutLimit}`;
+        };
+
+        /**
+         * 获取默认查询统计语句
+         */
+        const getDefaultCountSql = (tableName: string, where: string = '') => {
+            return `SELECT COUNT(*) count FROM \`${tableName}\` ${where ? 'WHERE ' + where : ''}`;
         };
 
         /**
@@ -773,7 +819,8 @@ export default defineComponent({
             const tableName = state.activeName;
             const sortType = sort.order == 'descending' ? 'DESC' : 'ASC';
 
-            state.dataTabs[state.activeName].querySql = getDefaultSelectSql(tableName, '', `ORDER BY \`${sort.prop}\` ${sortType}`);
+            const orderBy = `ORDER BY \`${sort.prop}\` ${sortType}`;
+            state.dataTabs[state.activeName].orderBy = orderBy;
 
             onRefresh(tableName);
         };
@@ -864,7 +911,6 @@ export default defineComponent({
             state.tableName = '';
             state.nowTableName = '';
             state.tableMetadata = [];
-            state.columnMetadata = [];
             state.dataTabs = {};
             setCodermirrorValue('');
             state.sqlNames = [];
@@ -899,10 +945,7 @@ export default defineComponent({
 
             promptExeSql(sql, null, () => {
                 if (!queryTab) {
-                    state.dataTabs[state.activeName].execRes.data = state.dataTabs[state.activeName].execRes.data.filter(
-                        (d: any) => !(deleteDatas.findIndex((x: any) => x[primaryKeyColumnName] == d[primaryKeyColumnName]) != -1)
-                    );
-                    state.dataTabs[state.activeName].selectionDatas = [];
+                    onRefresh(state.activeName);
                 } else {
                     state.queryTab.execRes.data = state.queryTab.execRes.data.filter(
                         (d: any) => !(deleteDatas.findIndex((x: any) => x[primaryKeyColumnName] == d[primaryKeyColumnName]) != -1)
@@ -1079,6 +1122,7 @@ export default defineComponent({
             formatSql,
             onBeforeChange,
             onRefresh,
+            handlePageChange,
             selectByCondition,
             onCommit,
             addRow,
diff --git a/mayfly_go_web/yarn.lock b/mayfly_go_web/yarn.lock
index c940ed78..5ddcfb01 100644
--- a/mayfly_go_web/yarn.lock
+++ b/mayfly_go_web/yarn.lock
@@ -12,15 +12,10 @@
   resolved "https://registry.npmmirror.com/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz#75b4c27948c81e88ccd3a8902047bcd797f38d32"
   integrity sha512-ej5oVy6lykXsvieQtqZxCOaLT+xD4+QNarq78cIYISHmZXshCvROLudpQN3lfL8G0NL7plMSSK+zlyvCaIJ4Iw==
 
-"@element-plus/icons-vue@^2.0.4":
-  version "2.0.4"
-  resolved "https://registry.npmmirror.com/@element-plus/icons-vue/-/icons-vue-2.0.4.tgz#98fb9680c814a2a4f231b8bdabc8cd59b1b79d86"
-  integrity sha512-UeBVBU3fuBsYa9mzM7DgkRztQ1Aftw3sMTI/1gZsqXq2NWiCOi16ZYXXGIc0jFDIu+k6SojzdlxOjv+rN/Y6FQ==
-
-"@element-plus/icons-vue@^2.0.5":
-  version "2.0.5"
-  resolved "https://registry.npmmirror.com/@element-plus/icons-vue/-/icons-vue-2.0.5.tgz#8eb4143a7b5e4d8468d2e72af99eefee446f5ea0"
-  integrity sha512-jvNWyKcdvPvMDLTWjghrPY+bYHKqh7hbAFIPe+HWR073zilzt33csREzmKx3VwhdlJUW5u0nCqN+0rwI8jlH+w==
+"@element-plus/icons-vue@^2.0.6":
+  version "2.0.6"
+  resolved "https://registry.npmmirror.com/@element-plus/icons-vue/-/icons-vue-2.0.6.tgz#8490e7a3193c17515d10c3be0544d800afe6a228"
+  integrity sha512-lPpG8hYkjL/Z97DH5Ei6w6o22Z4YdNglWCNYOPcB33JCF2A4wye6HFgSI7hEt9zdLyxlSpiqtgf9XcYU+m5mew==
 
 "@eslint/eslintrc@^1.0.5":
   version "1.0.5"
@@ -42,7 +37,7 @@
   resolved "https://registry.npmmirror.com/@floating-ui/core/-/core-0.7.3.tgz#d274116678ffae87f6b60e90f88cc4083eefab86"
   integrity sha512-buc8BXHmG9l82+OQXOFU3Kr2XQx9ys01U/Q9HMIrZ300iLc8HLMgh7dcCqgYzAzf4BkoQvDcXf5Y+CuEZ5JBYg==
 
-"@floating-ui/dom@^0.5.3":
+"@floating-ui/dom@^0.5.4":
   version "0.5.4"
   resolved "https://registry.npmmirror.com/@floating-ui/dom/-/dom-0.5.4.tgz#4eae73f78bcd4bd553ae2ade30e6f1f9c73fe3f1"
   integrity sha512-419BMceRLq0RrmTSDxn8hf9R3VCJv2K9PUfugh5JyEFmdjzDo+e8U5EdR8nzKq8Yj1htzLm3b6eQEEam3/rrtg==
@@ -369,7 +364,7 @@
   resolved "https://registry.npmmirror.com/@vue/shared/-/shared-3.2.37.tgz#8e6adc3f2759af52f0e85863dfb0b711ecc5c702"
   integrity sha512-4rSJemR2NQIo9Klm1vabqWjD8rs/ZaJSzMxkMNeJS6lHiUjjUeYFbooN19NgFjztubEKh3WlZUeOLVdbbUWHsw==
 
-"@vueuse/core@^8.6.0":
+"@vueuse/core@^8.7.5":
   version "8.7.5"
   resolved "https://registry.npmmirror.com/@vueuse/core/-/core-8.7.5.tgz#e74a888251ea11a9d432068ce18cbdfc4f810251"
   integrity sha512-tqgzeZGoZcXzoit4kOGLWJibDMLp0vdm6ZO41SSUQhkhtrPhAg6dbIEPiahhUu6sZAmSYvVrZgEr5aKD51nrLA==
@@ -391,10 +386,10 @@
   dependencies:
     vue-demi "*"
 
-ace-builds@^1.5.3:
-  version "1.5.3"
-  resolved "https://registry.npmmirror.com/ace-builds/-/ace-builds-1.5.3.tgz#05f81d3464a9ea19696e5e6fd0f924d37dab442f"
-  integrity sha512-WN5BKR2aTSuBmisO8jo3Fytk6sOmJGki82v/Boeic81IgYN8pFHNkXq2anDF0XkmfDWMqLbRoW9sjc/GtKzQbQ==
+ace-builds@^1.6.0:
+  version "1.7.1"
+  resolved "https://registry.npmmirror.com/ace-builds/-/ace-builds-1.7.1.tgz#be796fbd98610dda5e138aed98d309cac2ab0872"
+  integrity sha512-1mcbP5kXvr729sJ9dA/8tul0pjuvKbma0LF/ZMRwPEwjoNWNpe/x0OXpaPJo36aRpZCjRZMl5zsME3hAKTiaNw==
 
 acorn-jsx@^5.3.1:
   version "5.3.2"
@@ -451,10 +446,10 @@ array-union@^2.1.0:
   resolved "https://registry.npm.taobao.org/array-union/download/array-union-2.1.0.tgz?cache=0&sync_timestamp=1614624262896&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Farray-union%2Fdownload%2Farray-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d"
   integrity sha1-t5hCCtvrHego2ErNii4j0+/oXo0=
 
-async-validator@^4.1.1:
-  version "4.1.1"
-  resolved "https://registry.npmmirror.com/async-validator/-/async-validator-4.1.1.tgz#3cd1437faa2de64743f7d56649dd904c946a18fe"
-  integrity sha512-p4DO/JXwjs8klJyJL8Q2oM4ks5fUTze/h5k10oPPKMiLe1fj3G1QMzPHNmN1Py4ycOk7WlO2DcGXv1qiESJCZA==
+async-validator@^4.2.5:
+  version "4.2.5"
+  resolved "https://registry.npmmirror.com/async-validator/-/async-validator-4.2.5.tgz#c96ea3332a521699d0afaaceed510a54656c6339"
+  integrity sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==
 
 asynckit@^0.4.0:
   version "0.4.0"
@@ -630,27 +625,27 @@ dotenv@^10.0.0:
   resolved "https://registry.nlark.com/dotenv/download/dotenv-10.0.0.tgz#3d4227b8fb95f81096cdd2b66653fb2c7085ba81"
   integrity sha1-PUInuPuV+BCWzdK2ZlP7LHCFuoE=
 
-echarts@^5.3.2:
-  version "5.3.2"
-  resolved "https://registry.npmmirror.com/echarts/-/echarts-5.3.2.tgz#0a7b3be8c48a48b2e7cb1b82121df0c208d42d2c"
-  integrity sha512-LWCt7ohOKdJqyiBJ0OGBmE9szLdfA9sGcsMEi+GGoc6+Xo75C+BkcT/6NNGRHAWtnQl2fNow05AQjznpap28TQ==
+echarts@^5.3.3:
+  version "5.3.3"
+  resolved "https://registry.npmmirror.com/echarts/-/echarts-5.3.3.tgz#df97b09c4c0e2ffcdfb44acf518d50c50e0b838e"
+  integrity sha512-BRw2serInRwO5SIwRviZ6Xgm5Lb7irgz+sLiFMmy/HOaf4SQ+7oYqxKzRHAKp4xHQ05AuHw1xvoQWJjDQq/FGw==
   dependencies:
     tslib "2.3.0"
-    zrender "5.3.1"
+    zrender "5.3.2"
 
-element-plus@^2.2.6:
-  version "2.2.6"
-  resolved "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.6.tgz#60b9e91a2159526123d1b950263de37947153433"
-  integrity sha512-N9G4yWSxDt1YtreCJgt7UaSsXKuR4Fzb3ThzlBjbGDYDhcHijsrLL3qkdLZgeoSB13LRyr9pgP1ljNXdaYGa+g==
+element-plus@^2.2.8:
+  version "2.2.8"
+  resolved "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.8.tgz#6bba6285c20d8bea42247977d8f605611fc2da93"
+  integrity sha512-+cubFh1rgeGcc2LeBm7hv/1BKFJre/LIIdRntm9OLaIhysCxigjEwcxk9gbVT4KsbcjmoqZUr4/mwhIhQV6mvw==
   dependencies:
     "@ctrl/tinycolor" "^3.4.1"
-    "@element-plus/icons-vue" "^2.0.5"
-    "@floating-ui/dom" "^0.5.3"
+    "@element-plus/icons-vue" "^2.0.6"
+    "@floating-ui/dom" "^0.5.4"
     "@popperjs/core" "npm:@sxzz/popperjs-es@^2.11.7"
     "@types/lodash" "^4.14.182"
     "@types/lodash-es" "^4.17.6"
-    "@vueuse/core" "^8.6.0"
-    async-validator "^4.1.1"
+    "@vueuse/core" "^8.7.5"
+    async-validator "^4.2.5"
     dayjs "^1.11.3"
     escape-html "^1.0.3"
     lodash "^4.17.21"
@@ -1207,12 +1202,12 @@ json-stable-stringify-without-jsonify@^1.0.1:
   resolved "https://registry.nlark.com/json-stable-stringify-without-jsonify/download/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651"
   integrity sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=
 
-jsoneditor@^9.8.0:
-  version "9.8.0"
-  resolved "https://registry.npmmirror.com/jsoneditor/-/jsoneditor-9.8.0.tgz#08db81ccf6f6e9fdff8691e42c4fb62d3efdd6ad"
-  integrity sha512-q1ekwYizbSAny0/UAEOzLviVCyBS5XFGwM/EUNf9KnfB1MRSDmJDWjt4lAqMVz1TUV5O/l3J4/WzUSLQh2tZjw==
+jsoneditor@^9.9.0:
+  version "9.9.0"
+  resolved "https://registry.npmmirror.com/jsoneditor/-/jsoneditor-9.9.0.tgz#671e1231e23c43ebc6e1eb43fe97b2f97b156faf"
+  integrity sha512-NHJhyaqcc5U33ah6dEcd0S9b14Auocpe9nydvC9ui7Uq/vjEFnsd7ot6O9Jqwv53B7DmHFUWq5cT4qeWh4MEoA==
   dependencies:
-    ace-builds "^1.5.3"
+    ace-builds "^1.6.0"
     ajv "^6.12.6"
     javascript-natural-sort "^0.7.1"
     jmespath "^0.16.0"
@@ -1593,10 +1588,10 @@ sourcemap-codec@^1.4.4:
   resolved "https://registry.npm.taobao.org/sourcemap-codec/download/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
   integrity sha1-6oBL2UhXQC5pktBaOO8a41qatMQ=
 
-sql-formatter@^6.1.2:
-  version "6.1.2"
-  resolved "https://registry.npmmirror.com/sql-formatter/-/sql-formatter-6.1.2.tgz#78b05021c641020312a5f144ec313b38e7663258"
-  integrity sha512-09AiPmA6zDq82IBXOj5kN33VeAqaV92enkoonlhJge0fmfTESiYs3pwsntGKxa1C89xj/9MoHlNeqMmCr23BJw==
+sql-formatter@^7.0.3:
+  version "7.0.3"
+  resolved "https://registry.npmmirror.com/sql-formatter/-/sql-formatter-7.0.3.tgz#6c78f1e550cfa8419fa6f50c2c6140178484c3a7"
+  integrity sha512-E9zotLB0dy9ZZhs1sY4ZqzSzJGF2uC4Vzj0mEzXJC9rlE+Jjmz6t64qT2dzm/IPQosYvZknDbBOrWkygIJz67A==
   dependencies:
     argparse "^2.0.1"
 
@@ -1670,10 +1665,10 @@ type-fest@^0.20.2:
   resolved "https://registry.npmmirror.com/type-fest/download/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
   integrity sha1-G/IH9LKPkVg2ZstfvTJ4hzAc1fQ=
 
-typescript@^4.2.4:
-  version "4.5.4"
-  resolved "https://registry.npmmirror.com/typescript/download/typescript-4.5.4.tgz#a17d3a0263bf5c8723b9c52f43c5084edf13c2e8"
-  integrity sha512-VgYs2A2QIRuGphtzFV7aQJduJ2gyfTljngLzjpfW9FoYZF6xuw1W0vW9ghCKLfcWrCFxK81CSGRAvS1pn4fIUg==
+typescript@^4.7.4:
+  version "4.7.4"
+  resolved "https://registry.npmmirror.com/typescript/-/typescript-4.7.4.tgz#1a88596d1cf47d59507a1bcdfb5b9dfe4d488235"
+  integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==
 
 uri-js@^4.2.2:
   version "4.4.1"
@@ -1694,10 +1689,10 @@ vanilla-picker@^2.12.1:
   dependencies:
     "@sphinxxxx/color-conversion" "^2.2.2"
 
-vite@^2.9.10:
-  version "2.9.10"
-  resolved "https://registry.npmmirror.com/vite/-/vite-2.9.10.tgz#f574d96655622c2e0fbc662edd0ed199c60fe91a"
-  integrity sha512-TwZRuSMYjpTurLqXspct+HZE7ONiW9d+wSWgvADGxhDPPyoIcNywY+RX4ng+QpK30DCa1l/oZgi2PLZDibhzbQ==
+vite@^2.9.13:
+  version "2.9.13"
+  resolved "https://registry.npmmirror.com/vite/-/vite-2.9.13.tgz#859cb5d4c316c0d8c6ec9866045c0f7858ca6abc"
+  integrity sha512-AsOBAaT0AD7Mhe8DuK+/kE4aWYFMx/i0ZNi98hJclxb4e0OhQcZYUrvLjIaQ8e59Ui7txcvKMiJC1yftqpQoDw==
   dependencies:
     esbuild "^0.14.27"
     postcss "^8.4.13"
@@ -1731,10 +1726,10 @@ vue-eslint-parser@^8.0.1:
     lodash "^4.17.21"
     semver "^7.3.5"
 
-vue-router@^4.0.15:
-  version "4.0.15"
-  resolved "https://registry.npmmirror.com/vue-router/-/vue-router-4.0.15.tgz#b4a0661efe197f8c724e0f233308f8776e2c3667"
-  integrity sha512-xa+pIN9ZqORdIW1MkN2+d9Ui2pCM1b/UMgwYUCZOiFYHAvz/slKKBDha8DLrh5aCG/RibtrpyhKjKOZ85tYyWg==
+vue-router@^4.0.16:
+  version "4.0.16"
+  resolved "https://registry.npmmirror.com/vue-router/-/vue-router-4.0.16.tgz#9477beeeef36e80e04d041a1738801a55e6e862e"
+  integrity sha512-JcO7cb8QJLBWE+DfxGUL3xUDOae/8nhM1KVdnudadTAORbuxIC/xAydC5Zr/VLHUDQi1ppuTF5/rjBGzgzrJNA==
   dependencies:
     "@vue/devtools-api" "^6.0.0"
 
@@ -1778,19 +1773,19 @@ xterm-addon-fit@^0.5.0:
   resolved "https://registry.npmmirror.com/xterm-addon-fit/download/xterm-addon-fit-0.5.0.tgz#2d51b983b786a97dcd6cde805e700c7f913bc596"
   integrity sha1-LVG5g7eGqX3NbN6AXnAMf5E7xZY=
 
-xterm@^4.18.0:
-  version "4.18.0"
-  resolved "https://registry.npmmirror.com/xterm/-/xterm-4.18.0.tgz#a1f6ab2c330c3918fb094ae5f4c2562987398ea1"
-  integrity sha512-JQoc1S0dti6SQfI0bK1AZvGnAxH4MVw45ZPFSO6FHTInAiau3Ix77fSxNx3mX4eh9OL4AYa8+4C8f5UvnSfppQ==
+xterm@^4.19.0:
+  version "4.19.0"
+  resolved "https://registry.npmmirror.com/xterm/-/xterm-4.19.0.tgz#c0f9d09cd61de1d658f43ca75f992197add9ef6d"
+  integrity sha512-c3Cp4eOVsYY5Q839dR5IejghRPpxciGmLWWaP9g+ppfMeBChMeLa1DCA+pmX/jyDZ+zxFOmlJL/82qVdayVoGQ==
 
 yallist@^4.0.0:
   version "4.0.0"
   resolved "https://registry.nlark.com/yallist/download/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
   integrity sha1-m7knkNnA7/7GO+c1GeEaNQGaOnI=
 
-zrender@5.3.1:
-  version "5.3.1"
-  resolved "https://registry.npmmirror.com/zrender/-/zrender-5.3.1.tgz#fa8e63ac7e719cfd563831fe8c42a9756c5af384"
-  integrity sha512-7olqIjy0gWfznKr6vgfnGBk7y4UtdMvdwFmK92vVQsQeDPyzkHW1OlrLEKg6GHz1W5ePf0FeN1q2vkl/HFqhXw==
+zrender@5.3.2:
+  version "5.3.2"
+  resolved "https://registry.npmmirror.com/zrender/-/zrender-5.3.2.tgz#f67b11d36d3d020d62411d3bb123eb1c93cccd69"
+  integrity sha512-8IiYdfwHj2rx0UeIGZGGU4WEVSDEdeVCaIg/fomejg1Xu6OifAL1GVzIPHg2D+MyUkbNgPWji90t0a8IDk+39w==
   dependencies:
     tslib "2.3.0"