feat: 增加全屏按钮

frontend/package-lock.json

@@ -5842,6 +5842,11 @@
                 "neo-async": "^2.6.2"
             }
         },
+        "screenfull": {
+            "version": "6.0.2",
+            "resolved": "https://registry.npmjs.org/screenfull/-/screenfull-6.0.2.tgz",
+            "integrity": "sha512-AQdy8s4WhNvUZ6P8F6PB21tSPIYKniic+Ogx0AacBMjKP1GUHN2E9URxQHtCusiwxudnCKkdy4GrHXPPJSkCCw=="
+        },
         "select": {
             "version": "1.1.2",
             "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",

frontend/package.json

@@ -34,6 +34,7 @@
         "pinia-plugin-persistedstate": "^1.6.1",
         "qs": "^6.10.3",
         "sass-loader": "^13.0.2",
+        "screenfull": "^6.0.2",
         "unplugin-vue-define-options": "^0.7.3",
         "vue": "^3.2.25",
         "vue-i18n": "^9.1.9",

frontend/src/components/app-layout/header/components/Breadcrumb.vue

@@ -3,7 +3,7 @@
         <transition-group name="breadcrumb" mode="out-in">
             <el-breadcrumb-item :to="{ path: HOME_URL }" key="/home">{{ $t('menu.home') }}</el-breadcrumb-item>
             <el-breadcrumb-item v-for="item in matched" :key="item.path" :to="{ path: item.path }">
-                {{ $t(item.meta?.title as string) }}
+                {{ item.meta?.title }}
             </el-breadcrumb-item>
         </transition-group>
     </el-breadcrumb>

frontend/src/views/terminal/index.vue

@@ -104,6 +104,7 @@
                 ></el-empty>
             </div>
         </el-tabs>
+        <el-button @click="toggleFullscreen" class="fullScreen" icon="FullScreen"></el-button>
 
         <el-dialog v-model="connVisiable" :title="$t('terminal.addHost')" width="30%">
             <el-form ref="hostInfoRef" label-width="100px" label-position="left" :model="hostInfo" :rules="rules">
@@ -159,6 +160,8 @@ import { ElMessage } from 'element-plus';
 import Terminal from '@/views/terminal/terminal/index.vue';
 import type Node from 'element-plus/es/components/tree/src/model/node';
 import { ElTree } from 'element-plus';
+import screenfull from 'screenfull';
+
 let timer: NodeJS.Timer | null = null;
 
 const terminalValue = ref();
@@ -211,6 +214,12 @@ let hostInfo = reactive<Host.HostOperate>({
 
 const ctx = getCurrentInstance() as any;
 
+function toggleFullscreen() {
+    if (screenfull.isEnabled) {
+        screenfull.toggle();
+    }
+}
+
 const handleTabsRemove = (targetName: string, action: 'remove' | 'add') => {
     if (action !== 'remove') {
         return;
@@ -353,8 +362,7 @@ function changeFrameHeight() {
 
 function syncTerminal() {
     for (const terminal of terminalTabs.value) {
-        if (ctx && ctx.refs[`Ref${terminal.key}`]) {
-            console.log(ctx.refs[`Ref${terminal.key}`][0]);
+        if (ctx && ctx.refs[`Ref${terminal.key}`][0]) {
             terminal.status = ctx.refs[`Ref${terminal.key}`][0].isWsOpen() ? 'online' : 'closed';
         }
     }