新增：IM 弹框

src/views/im/index.vue

@@ -0,0 +1,53 @@
+<script lang="ts" setup>
+import NavBar from './NavBar/index.vue'
+
+defineOptions({ name: 'IM' })
+</script>
+<template>
+  <div class="app-container">
+    <el-container class="chat_container">
+      <el-aside class="chat_nav_bar" width="72px">
+        <NavBar />
+      </el-aside>
+      <el-main class="chat_main_box">
+        <router-view />
+      </el-main>
+    </el-container>
+  </div>
+</template>
+<style lang="scss" scoped>
+.app-container {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100vw;
+  height: 100vh;
+  background-size: cover;
+  backdrop-filter: blur(5px);
+
+  .chat_container {
+    width: 85%;
+    height: 95%;
+    background: #fff;
+    position: relative;
+    top: 50%;
+    transform: translateY(-50%);
+    margin: auto auto;
+    border-radius: 5px;
+
+    .chat_nav_bar {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      border-radius: 5px 0 0 5px;
+      width: 80px;
+      background: #262626;
+      overflow: hidden;
+    }
+
+    .chat_main_box {
+      padding: 0;
+    }
+  }
+}
+</style>