diff --git a/.gitignore b/.gitignore
index 9a651ceb5a73625a44ff23435de6867d0426e508..4c37b5e6441d2dd7136a56510940b30c319e1351 100644
--- a/.gitignore
+++ b/.gitignore
@@ -17,9 +17,9 @@ bin-release/
 .data/log/
 main.spec
 .build/
-.dist/
 /running.lock
 ./pid.txt
+main.spec
 # Project files, i.e. `.project`, `.actionScriptProperties` and `.flexProperties`
 # should NOT be excluded as they contain compiler settings and other important
 # information for Eclipse / Flash Builder.
diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index 8b6063b315b435709b3cdc73578a69633a4ad2d2..dd9246c5ce992f93448f37d3ccd7c2362ceef84b 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -4,9 +4,21 @@
     <option name="autoReloadType" value="SELECTIVE" />
   </component>
   <component name="ChangeListManager">
-    <list default="true" id="f4369d66-c987-404e-8c45-870121207283" name="更改" comment="upd：推送0.1.0版本">
+    <list default="true" id="f4369d66-c987-404e-8c45-870121207283" name="更改" comment="upd：无权限页面测试成功">
+      <change afterPath="$PROJECT_DIR$/templates/p/shell.html" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/.gitignore" beforeDir="false" afterPath="$PROJECT_DIR$/.gitignore" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/vue/.gitignore" beforeDir="false" afterPath="$PROJECT_DIR$/vue/.gitignore" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/app/controller/index.py" beforeDir="false" afterPath="$PROJECT_DIR$/app/controller/index.py" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/app/utils/Route.py" beforeDir="false" afterPath="$PROJECT_DIR$/app/utils/Route.py" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/pid.txt" beforeDir="false" afterPath="$PROJECT_DIR$/pid.txt" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/vue/package-lock.json" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/vue/package.json" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/src/components/HelloWorld.vue" beforeDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/src/components/TheWelcome.vue" beforeDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/src/components/WelcomeItem.vue" beforeDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/src/main.js" beforeDir="false" afterPath="$PROJECT_DIR$/vue/src/main.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/src/router/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/vue/src/router/index.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/vue/src/views/HomeView.vue" beforeDir="false" afterPath="$PROJECT_DIR$/vue/src/views/HomeView.vue" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -32,7 +44,7 @@
     &quot;RunOnceActivity.OpenProjectViewOnStart&quot;: &quot;true&quot;,
     &quot;RunOnceActivity.ShowReadmeOnStart&quot;: &quot;true&quot;,
     &quot;git-widget-placeholder&quot;: &quot;develop&quot;,
-    &quot;settings.editor.selected.configurable&quot;: &quot;preferences.lookFeel&quot;
+    &quot;settings.editor.selected.configurable&quot;: &quot;com.jetbrains.python.configuration.PyActiveSdkModuleConfigurable&quot;
   }
 }</component>
   <component name="RunManager">
@@ -49,7 +61,7 @@
       <option name="ADD_CONTENT_ROOTS" value="true" />
       <option name="ADD_SOURCE_ROOTS" value="true" />
       <option name="SCRIPT_NAME" value="$PROJECT_DIR$/main.py" />
-      <option name="PARAMETERS" value="start" />
+      <option name="PARAMETERS" value="" />
       <option name="SHOW_COMMAND_LINE" value="false" />
       <option name="EMULATE_TERMINAL" value="false" />
       <option name="MODULE_MODE" value="false" />
@@ -88,12 +100,21 @@
       <option name="project" value="LOCAL" />
       <updated>1714476496947</updated>
     </task>
-    <option name="localTasksCounter" value="3" />
+    <task id="LOCAL-00003" summary="upd：无权限页面测试成功">
+      <option name="closed" value="true" />
+      <created>1714534865365</created>
+      <option name="number" value="00003" />
+      <option name="presentableId" value="LOCAL-00003" />
+      <option name="project" value="LOCAL" />
+      <updated>1714534865365</updated>
+    </task>
+    <option name="localTasksCounter" value="4" />
     <servers />
   </component>
   <component name="VcsManagerConfiguration">
     <MESSAGE value="upd：发布0.0.9版本" />
     <MESSAGE value="upd：推送0.1.0版本" />
-    <option name="LAST_COMMIT_MESSAGE" value="upd：推送0.1.0版本" />
+    <MESSAGE value="upd：无权限页面测试成功" />
+    <option name="LAST_COMMIT_MESSAGE" value="upd：无权限页面测试成功" />
   </component>
 </project>
\ No newline at end of file
diff --git a/app/controller/index.py b/app/controller/index.py
index 940a240c1cacac05cfe5a67320165df942603048..e483606d4babd4434e11309f5cd8e7b97b37f140 100644
--- a/app/controller/index.py
+++ b/app/controller/index.py
@@ -3,10 +3,11 @@ import os
 from flask import Flask
 from app.utils import Route
 from app.utils import Config
-
+from flask_socketio import SocketIO
 
 def service_start(ROOT_PATH):
     app = Flask(__name__, template_folder=ROOT_PATH + '/templates')
+    socketio = SocketIO(app)
     app.static_folder = ROOT_PATH + "/public/static"
     # 获取配置文件
     cfg = Config.get_config()
@@ -14,6 +15,5 @@ def service_start(ROOT_PATH):
     print(os.getcwd())
     print(cfg)
     # 可以在路径内以/<参数名>的形式指定参数，默认接收到的参数类型是string
-    Route.get_route(app, cfg, ROOT_PATH)
-
-    app.run(host='0.0.0.0', port=cfg["port"])
+    Route.get_route(app, cfg, ROOT_PATH, ws=socketio)
+    socketio.run(app, host='0.0.0.0', port=cfg["port"],allow_unsafe_werkzeug=True)
diff --git a/app/utils/Route.py b/app/utils/Route.py
index dea40091a46b7364f27388133eaee1cf961ea16d..e5637cd472404df5c54ba287e557ac1d5e49d5ad 100644
--- a/app/utils/Route.py
+++ b/app/utils/Route.py
@@ -1,11 +1,28 @@
 import os
+import subprocess
 
 from flask import render_template, send_from_directory, request, session, abort, send_file
 from app.controller import Api
+from flask_socketio import SocketIO,emit
 
+import subprocess
 
+def execute_command(command):
+    try:
+        result = subprocess.run(command, shell=True, capture_output=True, text=True)
+        if result.returncode == 0:
+            output = result.stdout.strip()
+        else:
+            output = result.stderr.strip()
+    except Exception as e:
+        output = str(e)
 
-def get_route(app, cfg, ROOT_PATH):
+    return output
+
+
+
+
+def get_route(app, cfg, ROOT_PATH, ws):
     @app.before_request
     def before_request_func():
         if cfg["safe_entry"] not in str(request.path):
@@ -21,8 +38,8 @@ def get_route(app, cfg, ROOT_PATH):
                     abort(404)
 
     @app.errorhandler(404)
-    def page_not_found():
-        return render_template('error.html')
+    def page_error(e):
+        return render_template('error.html'), 404
 
     @app.route("/")
     @app.route("/home")
@@ -30,9 +47,10 @@ def get_route(app, cfg, ROOT_PATH):
     @app.route("/db")
     @app.route("/set")
     @app.route("/safe")
+    @app.route("/shell")
     @app.route("/soft")
     def home():
-        return send_from_directory(os.getcwd()+"\\vue\\dist", "index.html")
+        return send_from_directory(os.getcwd() + "/vue/dist", "index.html")
 
     @app.route("/p/<path:path>")
     def page(path):
@@ -50,7 +68,8 @@ def get_route(app, cfg, ROOT_PATH):
     @app.route('/assets/<path:path>')
     def assets_file(path):
         # 使用send_from_directory函数来发送静态文件
-        return send_from_directory(os.getcwd()+"\\vue\\dist\\assets", path)
+        return send_from_directory(os.getcwd() + "/vue/dist/assets", path)
+
     @app.route('/favicon.ico')
     def favicon():
         # 使用send_from_directory函数来发送静态文件
@@ -59,3 +78,39 @@ def get_route(app, cfg, ROOT_PATH):
     @app.route('/api/<path:path>', methods=['POST', 'GET'])
     def api_controller(path):
         return Api.service(path, cfg, request.data)
+
+    # 出现消息后,率先执行此处
+    @ws.on("message", namespace="/Socket")
+    def socket(message):
+        print("接收到消息:", message['command'])
+
+        command = message['command']
+        env = message['env']
+
+        if len(command) != 0:
+            splite_command = command.split(" ")
+
+            if splite_command[0] == "help":
+                ws.emit("response", {"value": "version 1.0 \n"}, namespace="/Socket")
+
+            elif splite_command[0] == "Ping":
+                if len(splite_command) == 2:
+                    index = splite_command[1]
+                    for each in range(int(index)):
+                        ws.sleep(0.1)
+                        ws.emit("response", {"value": str(each) + "\n"}, namespace="/Socket")
+                    ws.emit("response", {"value": "\n[shell] # "}, namespace="/Socket")
+            else:
+                output= execute_command(command)
+                print(os.getcwd())
+                ws.emit("response", {"value": output}, namespace="/Socket")
+        else:
+            ws.emit("response", {"value": "[shell] # "}, namespace="/Socket")
+
+    # 当websocket连接成功时,自动触发connect默认方法
+    @ws.on("connect", namespace="/Socket")
+    def connect():
+        print("链接建立成功..")
+
+
+
diff --git a/install.bat b/install.bat
index 25219d50037c2260a02f1726fa911880573b1365..7a67729a7e36492cd7c1607066c61ad975959202 100644
--- a/install.bat
+++ b/install.bat
@@ -13,6 +13,6 @@ tar -xf "%DOWNLOAD_PATH%" -C "%EXTRACT_PATH%"
 
 echo 正在以管理员权限运行 main.exe...
 cd /d "%EXTRACT_PATH%"
-powershell Start-Process "%MAIN_EXE_PATH%" -Verb RunAs
+powershell Start-Process "main.exe" -Verb RunAs
 
 echo 执行完毕！
diff --git a/pid.txt b/pid.txt
index ca071bb9db41f8f1dc4bbfea00a90951bd66036e..440c4258f52ca1fd20c431bfbbad42d1052edbc1 100644
--- a/pid.txt
+++ b/pid.txt
@@ -1 +1 @@
-12308
\ No newline at end of file
+8564
\ No newline at end of file
diff --git a/templates/p/shell.html b/templates/p/shell.html
new file mode 100644
index 0000000000000000000000000000000000000000..c60f6008deca371eab4366fe1d8081845ce9d571
--- /dev/null
+++ b/templates/p/shell.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Title</title>
+    <link rel="stylesheet" href="https://unpkg.com/xterm/css/xterm.css" />
+    <script type="text/javascript" src="https://unpkg.com/xterm/lib/xterm.js"></script>
+    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+    <script type="text/javascript" src="https://cdn.socket.io/4.7.5/socket.io.esm.min.js"></script>
+</head>
+
+<body>
+    <div id="terminal"></div>
+
+    <script type="module" charset="UTF-8">
+    import {io} from "https://cdn.socket.io/4.7.5/socket.io.esm.min.js"
+        $(document).ready(function()
+        {
+            var namespace = '/Socket';
+            var socket = io.connect("http://" + document.domain + ":" + location.port + namespace);
+
+            var window_width = $(window).width();
+            var window_height = $(window).height();
+            var term = new Terminal
+            (
+                {
+                    cols: 50,
+                    rows: 50,
+                    useStyle:false,
+                    convertEol: true,
+                    cursorBlink: true,
+                    rendererType: "canvas",
+                }
+            );
+
+            // 打开Web终端
+            term.open(document.getElementById('terminal'));
+            term.write("[shell] # ");
+
+            let input_command = '';
+
+            term.onKey((e) => {
+                console.log(e)
+              let code = e["key"].charCodeAt(0);
+              console.log(code);
+
+              // 如果按下回车,则发送命令,并等待输出结果
+              if(code == 13)
+              {
+                  // 发送数据到后端
+                  term.write("\r\n");
+                  socket.emit("message",{"command": input_command,"env":"./"});
+                  input_command ='';
+              }
+              // 如果是退格,则清除
+              else if(code == 127)
+              {
+                  term.write("\b");
+              }
+              else
+              {
+                  input_command += e["key"]
+                  term.write(e["key"]);
+              }
+            });
+
+            // 接受后台返回并输出
+            socket.on('response', function(recv)
+            {
+                console.log(recv.value);
+                term.write(recv.value);
+            });
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/vue/package-lock.json b/vue/package-lock.json
index 70bd577d12ffb94a3e122c4b6613c8ba3bd46184..4bb29a702c4bf8e322a9a72b878090c8f93c9855 100644
--- a/vue/package-lock.json
+++ b/vue/package-lock.json
@@ -11,7 +11,11 @@
         "@arco-themes/vue-qpanel": "^0.0.2",
         "axios": "^1.6.8",
         "vue": "^3.4.21",
-        "vue-router": "^4.3.0"
+        "vue-router": "^4.3.0",
+        "ws": "^8.17.0",
+        "xterm": "^5.3.0",
+        "xterm-addon-attach": "^0.9.0",
+        "xterm-addon-fit": "^0.8.0"
       },
       "devDependencies": {
         "@arco-design/web-vue": "^2.55.1",
@@ -1192,6 +1196,50 @@
       "peerDependencies": {
         "vue": "^3.2.0"
       }
+    },
+    "node_modules/ws": {
+      "version": "8.17.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz",
+      "integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/xterm": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/xterm/-/xterm-5.3.0.tgz",
+      "integrity": "sha512-8QqjlekLUFTrU6x7xck1MsPzPA571K5zNqWm0M0oroYEWVOptZ0+ubQSkQ3uxIEhcIHRujJy6emDWX4A7qyFzg==",
+      "deprecated": "This package is now deprecated. Move to @xterm/xterm instead."
+    },
+    "node_modules/xterm-addon-attach": {
+      "version": "0.9.0",
+      "resolved": "https://registry.npmjs.org/xterm-addon-attach/-/xterm-addon-attach-0.9.0.tgz",
+      "integrity": "sha512-NykWWOsobVZPPK3P9eFkItrnBK9Lw0f94uey5zhqIVB1bhswdVBfl+uziEzSOhe2h0rT9wD0wOeAYsdSXeavPw==",
+      "deprecated": "This package is now deprecated. Move to @xterm/addon-attach instead.",
+      "peerDependencies": {
+        "xterm": "^5.0.0"
+      }
+    },
+    "node_modules/xterm-addon-fit": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/xterm-addon-fit/-/xterm-addon-fit-0.8.0.tgz",
+      "integrity": "sha512-yj3Np7XlvxxhYF/EJ7p3KHaMt6OdwQ+HDu573Vx1lRXsVxOcnVJs51RgjZOouIZOczTsskaS+CpXspK81/DLqw==",
+      "deprecated": "This package is now deprecated. Move to @xterm/addon-fit instead.",
+      "peerDependencies": {
+        "xterm": "^5.0.0"
+      }
     }
   }
 }
diff --git a/vue/package.json b/vue/package.json
index 69f64d57d7ac4d45cd4aae7432ec521291a6c677..f8b8522e8003be5d8aa570f0118604015b1a38e6 100644
--- a/vue/package.json
+++ b/vue/package.json
@@ -12,7 +12,11 @@
     "@arco-themes/vue-qpanel": "^0.0.2",
     "axios": "^1.6.8",
     "vue": "^3.4.21",
-    "vue-router": "^4.3.0"
+    "vue-router": "^4.3.0",
+    "ws": "^8.17.0",
+    "xterm": "^5.3.0",
+    "xterm-addon-attach": "^0.9.0",
+    "xterm-addon-fit": "^0.8.0"
   },
   "devDependencies": {
     "@arco-design/web-vue": "^2.55.1",
diff --git a/vue/src/components/HelloWorld.vue b/vue/src/components/HelloWorld.vue
deleted file mode 100644
index 5fb372c9c9e8ad63c632a14fb0323627dbdf6bb1..0000000000000000000000000000000000000000
--- a/vue/src/components/HelloWorld.vue
+++ /dev/null
@@ -1,44 +0,0 @@
-<script setup>
-defineProps({
-  msg: {
-    type: String,
-    required: true
-  }
-})
-</script>
-
-<template>
-  <div class="greetings">
-    <h1 class="green">{{ msg }}</h1>
-    <h3>
-      You’ve successfully created a project with
-      <a href="https://vitejs.dev/" target="_blank" rel="noopener">Vite</a> +
-      <a href="https://vuejs.org/" target="_blank" rel="noopener">Vue 3</a>.
-    </h3>
-  </div>
-</template>
-
-<style scoped>
-h1 {
-  font-weight: 500;
-  font-size: 2.6rem;
-  position: relative;
-  top: -10px;
-}
-
-h3 {
-  font-size: 1.2rem;
-}
-
-.greetings h1,
-.greetings h3 {
-  text-align: center;
-}
-
-@media (min-width: 1024px) {
-  .greetings h1,
-  .greetings h3 {
-    text-align: left;
-  }
-}
-</style>
diff --git a/vue/src/components/TheWelcome.vue b/vue/src/components/TheWelcome.vue
deleted file mode 100644
index dab95367d4cb1dfe39b9c898fcd087ee3eda35b6..0000000000000000000000000000000000000000
--- a/vue/src/components/TheWelcome.vue
+++ /dev/null
@@ -1,88 +0,0 @@
-<script setup>
-import WelcomeItem from './WelcomeItem.vue'
-import DocumentationIcon from './icons/IconDocumentation.vue'
-import ToolingIcon from './icons/IconTooling.vue'
-import EcosystemIcon from './icons/IconEcosystem.vue'
-import CommunityIcon from './icons/IconCommunity.vue'
-import SupportIcon from './icons/IconSupport.vue'
-</script>
-
-<template>
-  <WelcomeItem>
-    <template #icon>
-      <DocumentationIcon />
-    </template>
-    <template #heading>Documentation</template>
-
-    Vue’s
-    <a href="https://vuejs.org/" target="_blank" rel="noopener">official documentation</a>
-    provides you with all information you need to get started.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <ToolingIcon />
-    </template>
-    <template #heading>Tooling</template>
-
-    This project is served and bundled with
-    <a href="https://vitejs.dev/guide/features.html" target="_blank" rel="noopener">Vite</a>. The
-    recommended IDE setup is
-    <a href="https://code.visualstudio.com/" target="_blank" rel="noopener">VSCode</a> +
-    <a href="https://github.com/johnsoncodehk/volar" target="_blank" rel="noopener">Volar</a>. If
-    you need to test your components and web pages, check out
-    <a href="https://www.cypress.io/" target="_blank" rel="noopener">Cypress</a> and
-    <a href="https://on.cypress.io/component" target="_blank" rel="noopener"
-      >Cypress Component Testing</a
-    >.
-
-    <br />
-
-    More instructions are available in <code>README.md</code>.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <EcosystemIcon />
-    </template>
-    <template #heading>Ecosystem</template>
-
-    Get official tools and libraries for your project:
-    <a href="https://pinia.vuejs.org/" target="_blank" rel="noopener">Pinia</a>,
-    <a href="https://router.vuejs.org/" target="_blank" rel="noopener">Vue Router</a>,
-    <a href="https://test-utils.vuejs.org/" target="_blank" rel="noopener">Vue Test Utils</a>, and
-    <a href="https://github.com/vuejs/devtools" target="_blank" rel="noopener">Vue Dev Tools</a>. If
-    you need more resources, we suggest paying
-    <a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">Awesome Vue</a>
-    a visit.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <CommunityIcon />
-    </template>
-    <template #heading>Community</template>
-
-    Got stuck? Ask your question on
-    <a href="https://chat.vuejs.org" target="_blank" rel="noopener">Vue Land</a>, our official
-    Discord server, or
-    <a href="https://stackoverflow.com/questions/tagged/vue.js" target="_blank" rel="noopener"
-      >StackOverflow</a
-    >. You should also subscribe to
-    <a href="https://news.vuejs.org" target="_blank" rel="noopener">our mailing list</a> and follow
-    the official
-    <a href="https://twitter.com/vuejs" target="_blank" rel="noopener">@vuejs</a>
-    twitter account for latest news in the Vue world.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <SupportIcon />
-    </template>
-    <template #heading>Support Vue</template>
-
-    As an independent project, Vue relies on community backing for its sustainability. You can help
-    us by
-    <a href="https://vuejs.org/sponsor/" target="_blank" rel="noopener">becoming a sponsor</a>.
-  </WelcomeItem>
-</template>
diff --git a/vue/src/components/WelcomeItem.vue b/vue/src/components/WelcomeItem.vue
deleted file mode 100644
index ac366d0740bfa462d7e9f290137601a3f3139ecc..0000000000000000000000000000000000000000
--- a/vue/src/components/WelcomeItem.vue
+++ /dev/null
@@ -1,86 +0,0 @@
-<template>
-  <div class="item">
-    <i>
-      <slot name="icon"></slot>
-    </i>
-    <div class="details">
-      <h3>
-        <slot name="heading"></slot>
-      </h3>
-      <slot></slot>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.item {
-  margin-top: 2rem;
-  display: flex;
-  position: relative;
-}
-
-.details {
-  flex: 1;
-  margin-left: 1rem;
-}
-
-i {
-  display: flex;
-  place-items: center;
-  place-content: center;
-  width: 32px;
-  height: 32px;
-  color: var(--color-text);
-}
-
-h3 {
-  font-size: 1.2rem;
-  font-weight: 500;
-  margin-bottom: 0.4rem;
-  color: var(--color-heading);
-}
-
-@media (min-width: 1024px) {
-  .item {
-    margin-top: 0;
-    padding: 0.4rem 0 1rem calc(var(--section-gap) / 2);
-  }
-
-  i {
-    top: calc(50% - 25px);
-    left: -26px;
-    position: absolute;
-    border: 1px solid var(--color-border);
-    background: var(--color-background);
-    border-radius: 8px;
-    width: 50px;
-    height: 50px;
-  }
-
-  .item:before {
-    content: ' ';
-    border-left: 1px solid var(--color-border);
-    position: absolute;
-    left: 0;
-    bottom: calc(50% + 25px);
-    height: calc(50% - 25px);
-  }
-
-  .item:after {
-    content: ' ';
-    border-left: 1px solid var(--color-border);
-    position: absolute;
-    left: 0;
-    top: calc(50% + 25px);
-    height: calc(50% - 25px);
-  }
-
-  .item:first-of-type:before {
-    display: none;
-  }
-
-  .item:last-of-type:after {
-    display: none;
-  }
-}
-</style>
diff --git a/vue/src/main.js b/vue/src/main.js
index 2628010a795b51833bd4fae258de656976954c40..7ff0581c170cf61ce03dbaf2eb5788b0275f1d60 100644
--- a/vue/src/main.js
+++ b/vue/src/main.js
@@ -7,6 +7,8 @@ import ArcoVue from '@arco-design/web-vue';
 import '@arco-themes/vue-qpanel/css/arco.css';
 import 'https://lf1-cdn-tos.bytegoofy.com/obj/iconpark/icons_32830_7.91c6f6815e182cddfce0c575d9efe686.js'
 
+
+
 const app = createApp(App)
 app.use(router)
 app.use(ArcoVue);
diff --git a/vue/src/router/index.js b/vue/src/router/index.js
index 7cdfe54235dd801bb726cc0eb42481ed886fa30b..02bada71e278874180b5a035337252ddbb005d07 100644
--- a/vue/src/router/index.js
+++ b/vue/src/router/index.js
@@ -42,6 +42,11 @@ const router = createRouter({
       name: 'soft',
       component: () => import('../views/Soft.vue')
     },
+    {
+      path: '/shell',
+      name: 'shell',
+      component: () => import('../components/Shell.vue')
+    }
   ]
 })
 
diff --git a/vue/src/views/HomeView.vue b/vue/src/views/HomeView.vue
index ad8f3bd8a434e56dcfef1ec5cc47a103bd954e16..b8e2fe662c9507cc5acd517a54debb40d35f4090 100644
--- a/vue/src/views/HomeView.vue
+++ b/vue/src/views/HomeView.vue
@@ -65,17 +65,18 @@
     <a-row :gutter="20">
       <a-col :span="16">
         <a-card title="概览" :bordered="false" :style="{ width: '100%' }">
-
-          
+          <a-card :style="{ marginBottom: '20px' }" title="终端">
+            <a-button type="outline" @click="shell_run">运行</a-button>
+          </a-card>
         </a-card>
       </a-col>
       <a-col :span="8">
         <a-card title="系统信息" :bordered="false" :style="{ width: '100%' }">
-
-          
         </a-card>
       </a-col>
     </a-row>
+    <Shell ref="modalComponent">
+    </Shell>
   </div>
 </template>
 
@@ -83,6 +84,7 @@
 import { ref } from "vue";
 import { onMounted } from "vue";
 import axios from "axios";
+import Shell from "../components/Shell.vue";
 
 export default {
   setup() {
@@ -112,7 +114,6 @@ export default {
             (item) => `${item[0]}: ${item[1]}`
           );
 
-
           // 将结果赋值给 cpu_top_5.value
           cpu_top_5.value = cpuTopItems;
 
@@ -167,6 +168,14 @@ export default {
       memory_top_5,
     };
   },
+  components: {
+    Shell
+  },
+  methods: {
+    shell_run() {
+      this.$refs.modalComponent.open();
+    }
+  }
 };
 </script>