Merge branch 'zyl' of http://xny.yj-3d.com:3000/zhouyulong/electron-4 into zyl

package.json

@@ -1,7 +1,7 @@
 {
   "name": "dzsp_shijingjun_offline_Y_save",
   "version": "v4.0.0",
-  "description": "An Electron application with Vue and TypeScript",
+  "description": "",
   "main": "./out/main/index.js",
   "author": "example.com",
   "homepage": "https://electron-vite.org",

src/main/index.ts

@@ -72,6 +72,7 @@ stopBatPath = process.platform === 'win32' ? stopBatPath.replace(/^(\w:)/, '/$1'
 //     ? `${join(app.getAppPath(), 'src/renderer/public/startUp/startUp.html')}`
 //     : `file://${join(app.getAppPath(), 'resources/app.asar/out/renderer/startUp/startUp.html')}`
 let isRestart = false
+let mainWindow;
 
 function createWindow(): void {
   // Create the browser window.
@@ -98,10 +99,10 @@ function createWindow(): void {
   splashWindow.loadURL(splashURL)
   splashWindow.show()
   // 创建主窗口（保持原有配置，但先不显示）
-  const mainWindow = new BrowserWindow({
+  mainWindow = new BrowserWindow({
-    // minWidth: 1780, // 添加最小宽度限制
+    minWidth: 1280, // 添加最小宽度限制
-    // minHeight: 920, // 添加最小高度限制
+    minHeight: 768, // 添加最小高度限制
-    // fullscreen: true,
+    fullscreen: true,
     show: false,
     frame: true,
     autoHideMenuBar: true,
@@ -429,77 +430,9 @@ function createWindow(): void {
   }
 }
 
-// This method will be called when Electron has finished
-// initialization and is ready to create browser windows.
-// Some APIs can only be used after this event occurs.
-app.whenReady().then(() => {
-  // alert(devSplashURL)
-  // alert(prodSplashURL)
-  // dialog.showMessageBox({
-  //   type: 'info',
-  //   title: '信息1',
-  //   message: devSplashURL,
-  //   buttons: ['确定']
-  // })
-  // 执行批处理文件
-  exec(startBatPath.substring(1, 200), (error, stdout, stderr) => {
-    if (error) {
-      console.error(`执行错误: ${error.message}`);
-      return;
-    }
-    if (stderr) {
-      console.error(`错误输出: ${stderr}`);
-      return;
-    }
-    console.log(`批处理输出: ${stdout}`);
-  });
-  // Set app user model id for windows
-  electronApp.setAppUserModelId('com.electron')
-
-  // Default open or close DevTools by F12 in development
-  // and ignore CommandOrControl + R in production.
-  // see https://github.com/alex8088/electron-toolkit/tree/master/packages/utils
-  app.on('browser-window-created', (_, window) => {
-    optimizer.watchWindowShortcuts(window)
-  })
-
-  // IPC test
-  ipcMain.on('ping', () => console.log('pong'))
-
-  createWindow()
-
-  app.on('activate', function () {
-    // On macOS it's common to re-create a window in the app when the
-    // dock icon is clicked and there are no other windows open.
-    if (BrowserWindow.getAllWindows().length === 0) createWindow()
-  })
-})
-
-// Quit when all windows are closed, except on macOS. There, it's common
-// for applications and their menu bar to stay active until the user quits
-// explicitly with Cmd + Q.
-// app.on('window-all-closed', () => {
-//   if (process.platform !== 'darwin') {
-//     getServer().close(() => {
-//       // 关闭后台服务
-//       exec(stopBatPath.substring(1, 200), () => {
-//         app.quit()
-//       });
-//     })
-//   }
-// })
-// 退出时注销所有快捷键
-app.on('will-quit', () => {
-  globalShortcut.unregisterAll()
-})
-
 // 用于跟踪是否正在执行退出流程
 let isQuitting = false;
 
-app.on('window-all-closed', () => {
-  windowAllClosed()
-});
-
 function windowAllClosed() {
   // 防止重复触发退出流程
   if (isQuitting) return;
@@ -581,10 +514,80 @@ function closeAllWindows() {
   });
 }
 
-console.log('=================================================')
+const gotTheLock = app.requestSingleInstanceLock();
-global.sharedObject = {
+
+if (!gotTheLock) {
+  app.quit();
+} else {
+  if (app.isReady()) {
+  }
+
+  app.whenReady().then(() => {
+    // alert(devSplashURL)
+    // alert(prodSplashURL)
+    // dialog.showMessageBox({
+    //   type: 'info',
+    //   title: '信息1',
+    //   message: devSplashURL,
+    //   buttons: ['确定']
+    // })
+    // 执行批处理文件
+    exec(startBatPath.substring(1, 200), (error, stdout, stderr) => {
+      if (error) {
+        console.error(`执行错误: ${error.message}`);
+        return;
+      }
+      if (stderr) {
+        console.error(`错误输出: ${stderr}`);
+        return;
+      }
+      console.log(`批处理输出: ${stdout}`);
+    });
+    // Set app user model id for windows
+    electronApp.setAppUserModelId('com.electron')
+  
+    // Default open or close DevTools by F12 in development
+    // and ignore CommandOrControl + R in production.
+    // see https://github.com/alex8088/electron-toolkit/tree/master/packages/utils
+    app.on('browser-window-created', (_, window) => {
+      optimizer.watchWindowShortcuts(window)
+    })
+  
+    // IPC test
+    ipcMain.on('ping', () => console.log('pong'))
+  
+    createWindow()
+  
+    app.on('activate', function () {
+      // On macOS it's common to re-create a window in the app when the
+      // dock icon is clicked and there are no other windows open.
+      if (BrowserWindow.getAllWindows().length === 0) createWindow()
+    })
+  })
+  
+  // 退出时注销所有快捷键
+  app.on('will-quit', () => {
+    globalShortcut.unregisterAll()
+  })
+
+  app.on('window-all-closed', () => {
+    windowAllClosed()
+  });
+
+  app.on("second-instance", () => {
+    // 当运行第二个实例时,将会聚焦到myWindow这个窗口
+    if (mainWindow) {
+      if (mainWindow.isMinimized()) mainWindow.restore();
+      mainWindow.focus();
+    }
+  });
+
+  
+  // testNapi()
+  global.sharedObject = {
     hasService: false,
-};
+  };
+}
 
 // In this file you can include the rest of your app's specific main process
 // code. You can also put them in separate files and require them here.

src/renderer/components.d.ts

@@ -11,8 +11,6 @@ declare module 'vue' {
     BaseDialog: typeof import('./src/components/dialog/baseDialog.vue')['default']
     Directory: typeof import('./src/components/dialog/directory.vue')['default']
     DirectoryEdit: typeof import('./src/components/dialog/directoryEdit.vue')['default']
-    ElAutoResizer: typeof import('element-plus/es')['ElAutoResizer']
-    ElBotton: typeof import('element-plus/es')['ElBotton']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCard: typeof import('element-plus/es')['ElCard']
     ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
@@ -28,18 +26,15 @@ declare module 'vue' {
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
-    ElRadio: typeof import('element-plus/es')['ElRadio']
-    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElSlider: typeof import('element-plus/es')['ElSlider']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
-    ElTableV2: typeof import('element-plus/es')['ElTableV2']
     ElTabPane: typeof import('element-plus/es')['ElTabPane']
     ElTabs: typeof import('element-plus/es')['ElTabs']
-    ElTimePicker: typeof import('element-plus/es')['ElTimePicker']
+    ElTooltip: typeof import('element-plus/es')['ElTooltip']
     ElTree: typeof import('element-plus/es')['ElTree']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     Index_b: typeof import('./src/components/SvgIcon/index_b.vue')['default']

src/renderer/public/startUp/startUp.html

@@ -28,7 +28,7 @@
         }
 
         .progress-container {
-            width: 400px;
+            width: 334px;
             text-align: center;
         }
 
@@ -52,7 +52,7 @@
         }
 
         .progress-bar-container {
-            height: 16px;
+            height: 12px;
             /* background-color: #222; */
             border-radius: 14px 0px 14px 0px;
             overflow: hidden;
@@ -136,12 +136,11 @@
 
         .box_middle_content {
             width: 400px;
-            color: #ADF1FF;
+            color: #e6f7ff;
             font-size: 20px;
             font-weight: 400;
             letter-spacing: 0px;
             line-height: 27px;
-            color: rgba(var(--color-text2), 1);
             text-align: justify;
             vertical-align: top;
             font-family: 'Alibaba';
@@ -161,13 +160,13 @@
         <!-- 顶部名称 -->
         <div class="box_top">
             <img src="./earth.png" alt="">
-            <span>实景三维数字孪生系统</span>
+            <span>实景三维电子沙盘系统</span>
         </div>
         <!-- 中部介绍 -->
         <div class="box_middle">
             <div class="box_middle_title">
-                <span>欢迎进入</span>
+                <span>欢迎使用</span>
-                <span>实景三维数字孪生系统</span>
+                <span>实景三维电子沙盘系统</span>
                 <!-- <div>Welcome to the 3D Digital Twin System of Real Scenery</div> -->
             </div>
             <div class="box_middle_content">

src/renderer/public/tree/jquery.ztree.core.js

@@ -1567,7 +1567,7 @@
                 : node.iconClose
               : node[setting.data.key.icon]
           if (icon || node.svg)
-            icoStyle.push('background:url(', node.svg ? '' : icon, ') 0 0 no-repeat;')
+            icoStyle.push("background:url(", (node.svg ? '':icon), ") 0 0 no-repeat;");
           if (
             setting.view.showIcon == false ||
             !tools.apply(setting.view.showIcon, [setting.treeId, node], true)

src/renderer/src/I18n/zh-CN.ts

@@ -135,7 +135,7 @@ export default {
     panel: '面',
     ellipse: '椭圆',
     sector: '扇形',
-    circle: '圆',
+    circle: '正圆',
     attackArrow: '箭头',
     pincerArrow: '双箭头',
     rendezvous: '集结地',
@@ -143,6 +143,13 @@ export default {
     unLock: '解锁',
     Lock: '锁定'
   },
+  default: {
+    point: '点标注',
+    line: '线标注',
+    curve: '曲线标注',
+    panel: '面标注',
+    roam: '漫游路径',
+  },
   system: {
     systemTitle: '系统面板',
     authorize: '授权信息',

src/renderer/src/I18n/zh-EN.ts

@@ -143,6 +143,13 @@ export default {
     unLock: 'UnLock',
     Lock: 'Lock'
   },
+  default: {
+    point: 'Point',
+    line: 'Line',
+    curve: 'Curve',
+    panel: 'Panel',
+    roam: 'roam',
+  },
   system: {
     systemTitle: 'Settings',
     authorize: 'Authorization Information',

src/renderer/src/I18n/zh-TW.ts

@@ -134,7 +134,7 @@ export default {
     panel: '面',
     ellipse: '橢圓',
     sector: '扇形',
-    circle: '圓',
+    circle: '正圓',
     attackArrow: '箭頭',
     pincerArrow: '雙箭頭',
     rendezvous: '集結地',
@@ -142,6 +142,13 @@ export default {
     unLock: '解鎖',
     Lock: '鎖定'
   },
+  default: {
+    point: '點標注',
+    line: '線標注',
+    curve: '曲線標注',
+    panel: '面標注',
+    roam: '漫遊路徑',
+  },
   system: {
     systemTitle: '系統面板',
     authorize: '授權信息',

src/renderer/src/assets/styles/global.css

@@ -361,6 +361,24 @@ img {
   border: none !important;
 }
 
+.login-select-popper {
+  border: 1px solid var(--el-border-color-light) !important;
+  box-shadow: var(--el-box-shadow-light) !important;
+  
+  .el-select-dropdown {
+    background: #fff !important;
+  }
+  .el-select-dropdown__item {
+    color: rgba(51, 51, 51, 1) !important;
+    font-size: 14px !important;
+  }
+  .el-select-dropdown__item.is-selected, .el-select-dropdown__item.is-hovering {
+    background-color: #f5f7fa !important;
+    color: rgba(0, 66, 66, 1) !important;
+  }
+}
+
+
 /* 树 */
 .ztree li span.button.ico_docu {
   background: url(../images/tree/folder-empty.png) 0 0 no-repeat;
@@ -388,11 +406,13 @@ img {
 
 #app {
   .ztree * {
+    font-size: 14px;
     font-family: SourceHanSans;
   }
 
   .ztree li a {
     color: #ffffff;
+    margin-bottom: 6px;
   }
 
   .ztree li a.curSelectedNode {
@@ -400,6 +420,7 @@ img {
     border: none;
     color: rgba(var(--color-base1), 1);
     opacity: 1;
+
     .svg-icon {
       color: rgba(var(--color-base1), 1) !important;
     }
@@ -438,8 +459,10 @@ img {
       background: linear-gradient(180deg, rgba(var(--color-base1), 0.2) 0%, rgba(var(--color-base1), 0) 100%), rgba(0, 0, 0, 0.6);
       backdrop-filter: blur(10px);
     }
+
     .compass-gyro {
       fill: rgba(var(--color-base1), 1);
+
       .cesium-svgPath-svg {
         scale: 0.8;
       }
@@ -468,6 +491,133 @@ img {
   }
 }
 
+.el-popper.is-customized {
+  padding: 2px 6px;
+  background: rgba(0, 0, 0, 0.6);
+  pointer-events: none;
+}
+
+.el-popper.is-customized::before {
+  content: " ";
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  border-radius: var(--el-popper-border-radius);
+  background: rgba(var(--color-base1), 0.2);
+  z-index: -1;
+}
+
+.el-popper.is-customized>.el-popper__arrow::before {
+  background: #ff000000 !important;
+  margin: 0;
+  right: 0;
+  width: 0;
+  height: 0;
+  border: 5px solid rgba(var(--color-base1), 0.2) !important;
+  border-bottom-color: transparent !important;
+  border-right-color: transparent !important;
+}
+
+.el-popper.is-customized>.el-popper__arrow::after {
+  box-sizing: border-box;
+  content: " ";
+  height: 10px;
+  position: absolute;
+  transform: rotate(45deg);
+  z-index: -2;
+  background: #ff000000;
+  margin: 0;
+  right: 0;
+  width: 0;
+  height: 0;
+  border: 5px solid rgba(0, 0, 0, 0.6);
+  border-bottom-color: transparent !important;
+  border-right-color: transparent !important;
+}
+
+#app {
+  .distance-legend {
+    background-color: rgba(0, 0, 0, 0);
+    border: none;
+    bottom: 70px;
+    .distance-legend-label {
+      color: rgba(var(--color-base1), 1);
+      -webkit-text-stroke-width: 0.3px;
+      -webkit-text-stroke-color: #000;
+      font-size: 18px;
+      font-weight: 700;
+    }
+    .distance-legend-scale-bar {
+      border-left: 1px solid rgba(var(--color-base1), 1);
+      border-right: 1px solid rgba(var(--color-base1), 1);
+      border-bottom: 1px solid rgba(var(--color-base1), 1);
+      top: 18px !important;
+      /* border: none;
+      background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHkAAAAPCAYAAADAgWCVAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAABvSURBVFiF7dExEcAgEETRhUigQUaEHCquTYcI5ERB6jigQE1UMDeT3afgz/wDvd8o5cRaD+RfzAZauzLca3SLbORec3SD7KfJBDSZgCYT0GQCmkxAkwloMgFNJqDJBDSZQMKcb3SE7JVgNqIjZK8PafgL7TYPzBoAAAAASUVORK5CYII=") no-repeat;
+      background-size: 100% 100%;
+      height: 14px; */
+    }
+  }
+  .cesium-performanceDisplay-defaultContainer {
+    bottom: 71px !important;
+    right: 15px !important;
+    .cesium-performanceDisplay {
+      background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), linear-gradient(180deg, rgba(var(--color-base1), 0.2) 0%, rgba(var(--color-base1), 0) 100%);
+      border-color: rgba(var(--color-base1), 1);
+    }
+  }
+  .cesium-info {
+    right: 245px !important;
+    bottom: 72px !important;
+    font-size: 12px !important;
+    flex-direction: column !important;
+    padding-bottom: 10px !important;
+    border-radius: 0 !important;
+    border: 1px solid rgba(var(--color-base1), 0.5);
+    background: linear-gradient(180deg, rgba(var(--color-base1), 0.2) 0%, rgba(var(--color-base1), 0) 100%), rgba(0, 0, 0, 0.6) !important;
+  }
+  .cesium-info>div:nth-child(1)::before {
+    content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAABkSURBVDiN7dBBCoAwDETRjxczN8vR6s3GTZFKm1jElXSgmxIeycDKCgCSTJJ/gRT18Wk8QUqFRrhFyAhSu00yc+EbsANW3yjt/5EcaNW6bepJb1EV1p0d9OlBb/PIA/4eWPlZToLnA8jkPBbrAAAAAElFTkSuQmCC");
+    margin-right: 8px;
+    position: relative;
+    top: 6px;
+  }
+  .cesium-info>div:nth-child(2)::before {
+    content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAACkSURBVDiNrZNRDsMgDEPJ1HstN0M7Gd3JvA/CSlsWDMw/larwZJsQAiEACiAys5QAJABgZh+DYF0GGqSAniMGfgETDqXevBDAU3ci4p5xI7c66912r8P/rUoIOa4p1l3OwvR6EQaGF9uLXFZkr/6pfd+zLr/rUrmbi2zAiLvcXRx6eqbXpL+shkNdBUY2LgvUEXfdDkVkX3Z1VXkpzOxGMulF/gCoY8eTaDSlggAAAABJRU5ErkJggg==");
+    margin-right: 8px;
+    position: relative;
+    top: 6px;
+  }
+  .cesium-info>div:nth-child(3)::before {
+    content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAECSURBVDiN1ZQxTsQwEEWfCRUlQuIQNNwgOQANh9hDbAUNHIEWcQQK6hUSNZRLgfYENEiIDj0KHOQNdjZe0fArO+N8/ZkXB/5YAUA9+FUI4XVrV3Wmvqj36p16Mqh36lmt6bV6VKgtVKf47CTrQ2CmzquSjBgCrIBl5lwHMKXt3WT9BjwCz2oTQviMJt22CfeAC+BmcKYdJp2kEpQeSK+ahPtEKGpTSpWOIDeOUSiF+bVJbTEElUL5IELJmOQ0Tly9TW5KE5+tzS9Rt3GuOSgjhk+D/U/aTTelKzR0XOq0CKXygz5fM4y/r/6mPMR9m321oD5AT/mU7zYugXfgqsbsf+kLw8LzMSWqfwIAAAAASUVORK5CYII=");
+    margin-right: 8px;
+    position: relative;
+    top: 6px;
+  }
+
+  #mapxDiv {
+    bottom: 126px !important;
+    right: 16px !important;
+  }
+}
+
+@media (max-height: 850px) {
+  #distanceLegendDiv {
+    .compass {
+      scale: 0.8;
+      left: 25px;
+    }
+
+    .navigation-controls {
+      scale: 0.8;
+      top: 225px;
+      left: 22px;
+    }
+  }
+}
+
 
 /* 提示 */
 /* .el-message--info {
@@ -644,6 +794,7 @@ img {
 .el-message--error svg {
   color: rgba(241, 108, 85, 1) !important;
 }
-.el-popup-parent--hidden{
+
+.el-popup-parent--hidden {
   width: 100% !important;
 }

src/renderer/src/components/dialog/directory.vue

@@ -145,8 +145,8 @@ const cancel = () => {
   right: 0;
 
   .box {
-    width: 20vw;
+    width: 380px;
-    height: 10vw;
+    height: 192px;
     display: flex;
     flex-direction: column;
     position: absolute;

src/renderer/src/views/TS/components/grid.vue

@@ -18,6 +18,7 @@
 </template>
 
 <script lang="ts" setup>
+//@ts-nocheck
 import {computed, onMounted, ref} from "vue"
 
 const props = defineProps(['eventList',])

src/renderer/src/views/TS/components/rightMenuTs.vue

@@ -27,6 +27,7 @@
 </template>
 
 <script setup lang="ts">
+//@ts-nocheck
 import {useI18n} from 'vue-i18n'
 import {ref} from 'vue'
 import {useRightOperate} from "./rightOperate";

src/renderer/src/views/TS/deduction.vue

@@ -5,20 +5,20 @@
       <div class="control">
         <span>{{ formatTime(currentStamp) }}</span>
         <el-icon :size="20" @click="play">
-          <ZoomOut/>
+          <ZoomOut />
         </el-icon>
         <el-icon :size="20" @click="stop">
-          <ZoomIn/>
+          <ZoomIn />
         </el-icon>
         <span class="title">{{ TSOBJ.name }}</span>
         <span class="zoom">
           <el-icon :size="20" @click="add(-1)">
-           <ZoomOut/>
+            <ZoomOut />
           </el-icon>
           <el-slider :disabled="true" :max="maxLevel" :min="minLevel" v-model="level" :show-tooltip="false"
-                     style="width:80%;padding-right: 8px;"/>
+            style="width:80%;padding-right: 8px;" />
           <el-icon :size="20" @click="add(1)">
-           <ZoomIn/>
+            <ZoomIn />
           </el-icon>
         </span>
       </div>
@@ -35,17 +35,12 @@
               <!--<span class="timeline-icon16" v-drags="timing"></span>-->
             </div>
             <!-- 时间轴刻度线 -->
-            <timeScale
+            <timeScale :ticTiny="ticTiny" :ticMain="ticMain" :distanceOfTicTiny="distanceOfTicTiny"
-              :ticTiny="ticTiny"
+              :distanceOfTicMain="distanceOfTicMain" :originOffset="originOffset" :originMainOffset="originMainOffset">
-              :ticMain="ticMain"
+            </timeScale>
-              :distanceOfTicTiny="distanceOfTicTiny"
-              :distanceOfTicMain="distanceOfTicMain"
-              :originOffset="originOffset"
-              :originMainOffset="originMainOffset"
-            ></timeScale>
             <!-- 事件色块 -->
-            <chart :eventList="TSOBJ._Store._tasks" :hr="hr" :originHrOffset="originHrOffset"
+            <chart :eventList="TSOBJ._Store._tasks" :hr="hr" :originHrOffset="originHrOffset" :scrollLeft="scrollLeft">
-                   :scrollLeft="scrollLeft"></chart>
+            </chart>
           </div>
         </div>
       </div>
@@ -56,13 +51,13 @@
 </template>
 
 <script setup lang="ts">
-import {ZoomIn, ZoomOut} from '@element-plus/icons-vue'
+import { ZoomIn, ZoomOut } from '@element-plus/icons-vue'
 
 import EventParams from "./components/eventParams.vue"
 import Grid from "./components/grid.vue"
 import TimeScale from "./components/timeScale.vue"
 import Chart from "./components/chart.vue"
-import {ref, onBeforeUnmount} from "vue"
+import { ref, onBeforeUnmount } from "vue"
 
 let currentStamp = ref(window['tsObj']._Store._startTimestamp)
 let maxLevel = ref(24)
@@ -140,12 +135,12 @@ let eventCallback = () => {
   console.log(dataMap)
 
   let fun = (map, isEnd = false) => {
-    let keys = Array.from(map.keys());
+    let keys: any = Array.from(map.keys());
     for (let i = 0; i < keys.length; i++) {
       let timestamp = keys[i].split("_")[0]
 
-      let event = Array.from(map.values())[i]
+      let event: any = Array.from(map.values())[i]
-      let flag = props.TSOBJ._Store._currentTimestamp > timestamp && !window.did_ts_Arr.includes(event.id)
+      let flag = props.TSOBJ._Store._currentTimestamp > timestamp && !(window as any).did_ts_Arr.includes(event.id)
       if (String(keys[i]).indexOf(String(timeId)) > -1 || flag) {
         taskIds.push(keys[i]);
       }

src/renderer/src/views/TS/edit.vue

@@ -28,7 +28,7 @@ let cabin = ref()
 let tsOBJ = ref({})
 const router = useRouter()
 const route = useRoute()
-let params = {}
+let params:any = {}
 // 将由列表页面传递过来的参数，数字化
 for (const routeQueryKey in route.query) {
   params[routeQueryKey] = route.query[routeQueryKey]
@@ -41,7 +41,7 @@ window.planId = params.id
 
 // 通过planID获取方案包含的所有事件
 let getEventList = () => {
-  let events = []
+  let events:any = []
   for (let i = 0; i < 1; i++) {
     events.push({
       id: "task" + i,
@@ -88,10 +88,10 @@ onMounted(async () => {
   createEarth()
 })
 const createEarth = async () => {
-  window.earth_ts = await new YJ.YJEarth('earthContainer', {navigationHelpButton: false})
+  (window as any).earth_ts = await new YJ.YJEarth('earthContainer', {navigationHelpButton: false})
-  YJ.Global.CesiumContainer(earth_ts, {compass: false, legend: false});
+  YJ.Global.CesiumContainer((window as any).earth_ts, {compass: false, legend: false});
   setTimeout(() => {
-    new YJ.Tools(window.earth_ts).flyHome()
+    new YJ.Tools((window as any).earth_ts).flyHome()
   }, 1000)
   console.log("createEarth++++++++++++++++++++")
   cabin.value.initTreeCallBack()

src/renderer/src/views/TS/element.vue

@@ -51,6 +51,7 @@
 </template>
 
 <script lang="ts" setup>
+//@ts-nocheck
 import {ref, onMounted} from "vue";
 import {Search} from '@element-plus/icons-vue'
 import {ModelApi} from "../../api/model";

src/renderer/src/views/TS/list.vue

@@ -115,15 +115,15 @@ import NewPlan from "./newPlan.vue"
 const eventBus: any = inject('bus')
 const {ipcRenderer} = require('electron')
 const router = useRouter()
-let searchParams = ref({
+let searchParams:any = ref({
   name: "",
   createdBy: "",
   datetime: "",
 })
 
-let pageSize = ref(5)
+let pageSize:any = ref(5)
-let pageNum = ref(1)
+let pageNum:any = ref(1)
-let total = ref(0)
+let total:any = ref(0)
 const back = () => {
   ipcRenderer.send('toggle-fullscreen', false)
   router.push({path: '/home'})
@@ -136,7 +136,7 @@ const handleCurrentChange = (val) => {
   pageNum = val
   getList();
 }
-const getList = (params = null) => {
+const getList = (params:any = null) => {
   console.log(params)
   let formData = new FormData()
   formData.append('pageSize', pageSize.value)

src/renderer/src/views/TS/newEvent.vue

@@ -94,6 +94,7 @@
 </template>
 
 <script lang="ts" setup>
+//@ts-nocheck
 import {ref, reactive} from "vue";
 import type {RenderContentContext, TreeInstance} from 'element-plus'
 import {TsApi} from "../../api/ts";

src/renderer/src/views/TS/newPlan.vue

@@ -47,6 +47,7 @@
 </template>
 
 <script lang="ts" setup>
+//@ts-nocheck
 import {ref, reactive,} from "vue";
 import {ElMessage, FormInstance, FormRules} from 'element-plus'
 import {TsApi} from "../../api/ts";

src/renderer/src/views/components/bottomSide/bottomSide.vue

@@ -193,7 +193,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '点标注'
+        let name = t(`default.point`)
         await addMapSource({
           type: 'point',
           id: id,
@@ -231,7 +231,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '线标注'
+        let name = t(`default.line`)
         await addMapSource({
           type: 'line',
           id: id,
@@ -258,7 +258,7 @@ const bottomMenuList = ref([
               return
             }
             let id = new YJ.Tools().randomString()
-            let name = '曲线标注'
+            let name = t(`default.curve`)
             await addMapSource({
               type: 'curve',
               id: id,
@@ -292,7 +292,7 @@ const bottomMenuList = ref([
         }
         let id = new YJ.Tools().randomString()
         // let id = 'aaa'
-        let name = '面标注'
+        let name = t(`default.panel`)
         await addMapSource({
           type: 'panel',
           id: id,
@@ -319,7 +319,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '正圆'
+        let name = t(`bottomMenu.circle`)
         await addMapSource({
           type: 'circle',
           id: id,
@@ -346,7 +346,7 @@ const bottomMenuList = ref([
               return
             }
             let id = new YJ.Tools().randomString()
-            let name = '椭圆'
+            let name = t(`bottomMenu.ellipse`)
             await addMapSource({
               type: 'ellipse',
               id: id,
@@ -382,7 +382,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '矩形'
+        let name = t(`bottomMenu.rectangle`)
         await addMapSource({
           type: 'rectangle',
           id: id,
@@ -409,7 +409,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '扇形'
+        let name = t(`bottomMenu.sector`)
         await addMapSource({
           type: 'sector',
           id: id,
@@ -443,7 +443,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '集结地'
+        let name = t(`bottomMenu.rendezvous`)
         await addMapSource({
           type: 'rendezvous',
           id: id,
@@ -474,7 +474,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '箭头'
+        let name = t(`bottomMenu.attackArrow`)
         await addMapSource({
           type: 'attackArrow',
           id: id,
@@ -488,7 +488,6 @@ const bottomMenuList = ref([
       })
     }
   },
-
   {
     sourceName: '钳形箭头',
     key: 'DrawPincerArrow',
@@ -506,7 +505,7 @@ const bottomMenuList = ref([
           return
         }
         let id = new YJ.Tools().randomString()
-        let name = '双箭头'
+        let name = t(`bottomMenu.pincerArrow`)
         await addMapSource({
           type: 'pincerArrow',
           id: id,

src/renderer/src/views/components/headers/components/setTool/setTool.vue

@@ -13,16 +13,12 @@
         </div>
       </div>
     </div> -->
-    <div
+    <el-tooltip v-for="(item, i) of setList" :key="item.id" :content="t('iconTitle.' + item.name)" effect="customized" :hide-after="0">
-      class="set_item"
+      <div class="set_item" :class="{ 'last-item': i === setList.length - 1 }" @click="item.callback">
-      :title="t('iconTitle.' + item.name)"
-      v-for="(item, i) of setList"
-      :key="item.id"
-      :class="{ 'last-item': i === setList.length - 1 }"
-      @click="item.callback"
-    >
         <svg-icon :name="item.icon" :size="20"></svg-icon>
       </div>
+    </el-tooltip>
+
     <setPup ref="setPupRef"></setPup>
   </div>
 </template>
@@ -47,7 +43,7 @@ eventBus.on('settingPop', (data) => {
 })
 const logout = async (e) => {
   let res = await LoginApi.logout()
-  if(window.earth) {
+  if (window.earth) {
     window.earth.destroy()
     window.earth = null
   }
@@ -73,8 +69,8 @@ const setList = ref([
     icon: 'beidou',
     name: 'locate',
     className: 'header_public',
-    dbcallback: (e) => {},
+    dbcallback: (e) => { },
-    callback: (e) => {}
+    callback: (e) => { }
     //   dbcallback: this.flyTo,
     //   callback: this.locate,
   },
@@ -156,12 +152,10 @@ ipcRenderer.on('fullscreen-status-changed', (event, isFullscreen) => {
     top: 0;
     bottom: 0;
     width: 1px;
-    background: linear-gradient(
+    background: linear-gradient(180deg,
-      180deg,
         rgba(var(--color-base1), 0),
         rgba(var(--color-base1), 1),
-      rgba(204, 204, 204, 0)
+        rgba(204, 204, 204, 0));
-    );
   }
 
   .set_item.last-item::after {

src/renderer/src/views/components/leftSide/leftSideFirst.vue

@@ -386,10 +386,10 @@ const clickMenu = (item: any) => {
 <style scoped lang="scss">
 .leftBox {
   width: 8.3vw;
-  // height: 20vw;
+  height: 53.5vh !important;
   position: absolute;
   left: 1em;
-  bottom: calc(7vw + 2px);
+  bottom: calc(12vh + 2px);
 }
 
 .left {
@@ -421,7 +421,7 @@ const clickMenu = (item: any) => {
 
   .menus {
     width: 100%;
-    // height: 350px;
+    height: 50.6vh !important;
     display: flex;
     flex-direction: column;
     padding: 0 8px 0 5px;

src/renderer/src/views/components/leftSide/leftSideSecond.vue

@@ -154,7 +154,7 @@ const methodMap = {
         draw.start(async (err, positions) => {
           if (positions && positions.length > 1) {
             let id = new YJ.Tools().randomString()
-            let name = '轨迹运动'
+            let name = t(`effect.path`)
             await addMapSource({
               type: 'path',
               id: id,
@@ -184,7 +184,7 @@ const methodMap = {
     draw.start((err, positions) => {
       if (positions.length > 1) {
         let id = new YJ.Tools().randomString()
-        let name = '电子围墙'
+        let name = t(`effect.wallStereoscopic`)
         addMapSource({
           type: 'wallStereoscopic',
           id: id,
@@ -203,8 +203,8 @@ const methodMap = {
     let draw = new YJ.Draw.DrawPolyline(window.earth)
     draw.start((err, positions) => {
       if (positions.length > 1) {
-        let id = 'aaa'
+        let id = new YJ.Tools().randomString()
-        let name = '实体墙'
+        let name = t(`effect.entityWall`)
         addMapSource({
           type: 'entityWall',
           id: id,
@@ -224,7 +224,7 @@ const methodMap = {
     draw.start((err, options) => {
       if (options) {
         let id = new YJ.Tools().randomString()
-        let name = '扩散光波'
+        let name = t(`effect.diffuseScan`)
         addMapSource({
           type: 'diffuseScan',
           id: id,
@@ -251,7 +251,7 @@ const methodMap = {
     draw.start((err, options) => {
       if (options) {
         let id = new YJ.Tools().randomString()
-        let name = '雷达光波'
+        let name = t(`effect.radarScan`)
         addMapSource({
           type: 'radarScan',
           id: id,
@@ -273,7 +273,7 @@ const methodMap = {
     draw.start((err, options) => {
       if (options) {
         let id = new YJ.Tools().randomString()
-        let name = '立体雷达扫描'
+        let name = t(`effect.scanStereoscopic`)
         addMapSource({
           type: 'scanStereoscopic',
           id: id,
@@ -302,7 +302,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '多面体'
+      let name = t(`effect.polyhedronObject`)
       addMapSource({
         type: 'polyhedronObject',
         id: id,
@@ -327,7 +327,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '水面'
+      let name = t(`effect.water`)
       addMapSource({
         type: 'water',
         id: id,
@@ -348,7 +348,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '喷泉'
+      let name = t(`effect.fountain`)
       await addMapSource({
         type: 'fountain',
         id: id,
@@ -371,7 +371,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '火焰'
+      let name = t(`effect.fire`)
       await addMapSource({
         type: 'fire',
         id: id,
@@ -394,7 +394,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '烟雾'
+      let name = t(`effect.smoke`)
       await addMapSource({
         type: 'smoke',
         id: id,
@@ -421,7 +421,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '喷射水柱'
+      let name = t(`effect.waterL`)
       await addMapSource({
         type: 'waterL',
         id: id,
@@ -451,7 +451,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '飞线'
+      let name = t(`effect.flyLine`)
       addMapSource({
         type: 'flyLine',
         id: id,
@@ -472,7 +472,7 @@ const methodMap = {
         return
       }
       let id = new YJ.Tools().randomString()
-      let name = '爆炸'
+      let name = t(`effect.explosion`)
       await addMapSource({
         type: 'explosion',
         id: id,
@@ -964,7 +964,7 @@ defineExpose({
 <style lang="scss" scoped>
 .leftSideSecond {
   display: none;
-  height: 365px;
+  // height: 365px;
   width: 240px;
   // background: url('@/assets/images/secondBj.png') no-repeat;
   // background-size: 100% 100%;

src/renderer/src/views/components/propertyBox/FlyRoam.vue

@@ -174,12 +174,14 @@
 <script setup lang="ts">
 import { ref, reactive, onBeforeUnmount } from 'vue'
 import { inject } from 'vue'
+import { useI18n } from 'vue-i18n'
 import Dialog from '@/components/dialog/baseDialog.vue'
 import { app } from 'electron'
 import { TreeApi } from '@/api/tree'
 import { useTreeNode } from '../tree/hooks/treeNode'
 import { ElMessage } from 'element-plus'
 
+const { t } = useI18n()
 const { cusAddNodes } = useTreeNode()
 
 const baseDialog: any = ref(null)
@@ -218,7 +220,7 @@ const draw = (data) => {
     let paramsData: any = {
       params: data,
       id,
-      sourceName: '漫游路径',
+      sourceName: t(`default.roam`),
       sourceType: 'roam',
       parentId: parentId
     }

src/renderer/src/views/components/propertyBox/GoodsSearchCircle.vue

@@ -62,12 +62,12 @@ const shpTotalDict: any = reactive(
 
 //获取物资类型
 const getResource = () => {
-  let formData = new FormData()
+  let formData:any = new FormData()
   formData.append('pageNum', 1)
   formData.append('pageSize', 10000)
   formData.append('name', '')
   MaterialApi.getList(formData).then((res) => {
-    shpTotalDict = res.data.data.map((item) => {
+    shpTotalDict.value = res.data.data.map((item) => {
       return item.name
     })
   })

src/renderer/src/views/components/propertyBox/addGroundText.vue

@@ -31,7 +31,9 @@ const open = () => {
   baseDialog.value?.open()
 }
 const confirm = () => {
-  console.log('121212121', baseDialog.value)
+  if(!text.value) {
+    return
+  }
   baseDialog.value?.close()
   let name = text.value
   text.value = ''

src/renderer/src/views/components/propertyBox/addStandText.vue

@@ -31,6 +31,9 @@ const open = () => {
   baseDialog.value?.open()
 }
 const confirm = () => {
+  if(!text.value) {
+    return
+  }
   baseDialog.value?.close()
   let name = text.value
   text.value = ''

src/renderer/src/views/components/propertyBox/trajectoryMotion.vue

@@ -1,5 +1,6 @@
 <template>
-  <Dialog ref="baseDialog" title="轨迹运动属性" left="calc(50% - 160px)" top="calc(50% - 120px)" className="trajectory-motion"
+  <Dialog ref="baseDialog" title="轨迹运动属性" left="180px"
+    top="100px" className="trajectory-motion"
     :closeCallback="closeCallback">
     <template #content>
       <span class="custom-divider"></span>

src/renderer/src/views/components/tree/hooks/treeNode.ts

@@ -1,6 +1,5 @@
-import {renderMethods} from "./renderTreeNode";
+import { renderMethods } from "./renderTreeNode";
-
+const { ipcRenderer, BrowserWindow } = require('electron')
-const {ipcRenderer, BrowserWindow} = require('electron')
 export const useTreeNode = () => {
   //定义树形节点的属性
   const nodeType = {
@@ -169,12 +168,6 @@ export const useTreeNode = () => {
       // detailFun: get_detail_layer,
       // allowChildren: false,
     },
-    picture: {
-      rightMenus: ['edit', 'del']
-      // render: renderPicture,
-      // detailFun: get_detail_picture,
-      // allowChildren: false,
-    },
     model: {
       rightMenus: ['edit', 'del', 'setView', 'resetView']
       // detailFun: get_detail_glb,
@@ -267,22 +260,22 @@ export const useTreeNode = () => {
       // detailFun: get_detail_czml,
       // allowChildren: true,
     },
-    ArcgisWXImagery: {
+    arcgisWximagery: {
       // render: renderArcgisWXImagery,
       rightMenus: ['edit', 'del', 'layerRaise', 'layerLower', 'layerToTop', 'layerToBottom']
       // detailFun: get_detail_null,
     },
-    ArcgisBLUEImagery: {
+    arcgisBlueImagery: {
       // render: renderArcgisBLUEImagery,
       rightMenus: ['edit', 'del', 'layerRaise', 'layerLower', 'layerToTop', 'layerToBottom']
       // detailFun: get_detail_null,
     },
-    GDLWImagery: {
+    gdlwImagery: {
       // render: renderGDLWImagery,
       rightMenus: ['edit', 'del', 'layerRaise', 'layerLower', 'layerToTop', 'layerToBottom']
       // detailFun: get_detail_null,
     },
-    GDSLImagery: {
+    gdslImagery: {
       // render: renderGDSLImagery,
       rightMenus: ['edit', 'del', 'layerRaise', 'layerLower', 'layerToTop', 'layerToBottom']
       // detailFun: get_detail_null,
@@ -447,7 +440,7 @@ export const useTreeNode = () => {
   const cusNodeIcon = async (node) => {
     let availablePort = await ipcRenderer.invoke('get-available-port');
     let type
-    if (node.sourcePath || node.sourceType === 'vector') {
+    if(node.sourcePath || node.sourceType === 'vector') {
       let path = node.sourcePath ? node.sourcePath : JSON.parse(node.params).path
       // 获取最后一个点的位置
       const lastDotIndex = path.lastIndexOf('.');
@@ -458,22 +451,34 @@ export const useTreeNode = () => {
       // 提取后缀并转换为小写进行比较
       const extension = path.slice(lastDotIndex + 1).toLowerCase();
       type = extension
-    } else {
+    }
+    else {
       type = node.sourceType || node.type;
     }
     console.log("----------", type);
     let name = [
-      "GDSLImagery",
+      "gdslImagery",
-      "GDLWImagery",
+      "gdlwImagery",
-      "ArcgisBLUEImagery",
+      "arcgisBlueImagery",
-      "ArcgisWXImagery",
+      "arcgisWximagery",
     ].includes(type)
       ? "layer"
       : type;
     if (type == "Terrain") name = "terrain";
     if (type == "road" && node.detail.imageType == "arrowRoad")
       name = "lineDrawing";
-    return (type === 'directory' || type === 'FeatureCollection') ? undefined : `http://localhost:${availablePort}/icon/${name}.png`;
+
+      let strokeWidth = 0.1
+      if(type === 'ellipse') {
+        strokeWidth = 1.5;
+      }
+
+    // return (type === 'directory' || type === 'FeatureCollection') ? undefined : `http://localhost:${availablePort}/icon/${name}.png`;
+    return (type === 'directory' || type === 'FeatureCollection') ? undefined : `
+    <svg class="svg-icon" style="color: rgba(var(--color-base2), 1);margin-top: 1px;width:100%;height:100%;fill: currentColor !important;stroke: currentColor !important;stroke-width: ${strokeWidth} !important;shape-rendering: geometricPrecision;">
+      <use xlink:href="#icon-${name}" />
+    </svg>
+    `;
   };
   /**
    * 获取选中节点
@@ -504,7 +509,7 @@ export const useTreeNode = () => {
   const cusAddNodes = async (treeObj: any, parentNodeId: any, newNodes: any, isSilent?: any) => {
     for (let i = 0; i < newNodes.length; i++) {
       if (newNodes[i].sourceType != "directory") {
-        newNodes[i].icon = await cusNodeIcon(newNodes[i]);
+        newNodes[i].svg = await cusNodeIcon(newNodes[i]);
         YJ.Global.splitScreen.setActiveId([newNodes[i].id]);
       }
     }
@@ -533,7 +538,7 @@ export const useTreeNode = () => {
       allNodes = allNodes.concat(treeObj.transformToArray(node))
     })
     allNodes.forEach((node: any) => {
-      if (node.sourceType !== 'FeatureCollection' && node.sourceType !== 'Feature') {
+      if(node.sourceType !== 'FeatureCollection' && node.sourceType !== 'Feature') {
         _idSet.add(node.id)
       }
       treeObj.removeNode(node)
@@ -563,7 +568,7 @@ export const useTreeNode = () => {
     return siblings
   }
 
-  function cusUpdateNode({id, sourceName, params}) {
+  function cusUpdateNode({ id, sourceName, params }) {
     let node = window.treeObj.getNodeByParam(
       "id",
       id,
@@ -635,7 +640,6 @@ export const useTreeNode = () => {
 
     return arr
   }
-
   function findParentId(treeObj: any) {
     if (!treeObj) {
       return -1;
@@ -653,7 +657,6 @@ export const useTreeNode = () => {
     }
     return selectedNode.id;
   }
-
   function findTreeIndex(treeObj: any) {
     if (!treeObj) {
       return 0;

src/renderer/src/views/components/tree/index.vue

@@ -592,10 +592,10 @@ defineExpose({
   position: absolute;
   color: #ffffff;
   right: 0;
-  top: 50%;
+  top: calc(50% - 40px);
   transform: translateY(-50%);
   width: 17vw;
-  height: 33vw;
+  height: calc(100% - 420px);
 
   .box1 {
     width: 90%;
@@ -651,7 +651,7 @@ defineExpose({
 
     .ztree_lg {
       padding: 10px 15px;
-      min-height: 22vw;
+      height: calc(100% - 2.2em - 3.5vh - 1.8vw);
 
       .ztreeBox {
         //min-height: 43vh;

src/renderer/src/views/login/index.vue

@@ -52,57 +52,55 @@
     <div class="service" v-if="serviceDialog">
       <div class="contentBox">
         <div class="titleBox">
-          <span class="title">服务设置</span>
+          <span class="title"></span>
           <span class="closeBox">
             <span @click="cancel">✕</span>
           </span>
-          <div class="hr"></div>
         </div>
-
+        <h1 class="hello">Hello!</h1>
+        <h2 class="greet"><span>欢迎您使用</span>实景三维电子沙盘系统</h2>
         <div class="serviceContent">
-          <div class="tab">
+          <el-tabs v-model="selectedService" class="demo-tabs" @tab-click="handleSelect">
-            <template v-for="item in serviceOptions">
+            <el-tab-pane v-for="item in serviceOptions" :label="item.name" :name="item.name"></el-tab-pane>
-              <span :class="['tab-item', selectedService == item.name ? 'activeService' : '']"
+          </el-tabs>
-                @click="selectedService = item.name">{{ item.name }}</span>
-            </template>
-          </div>
           <div class="tabPanel">
             <template v-if="selectedService == '接口服务'">
               <div class="item">
-                <span class="itemLabel">服务选择：</span>
+                <span class="itemLabel">服务选择</span>
-                <el-select class="select" v-model="servVal">
+                <el-select class="select" popper-class="login-select-popper" v-model="servVal">
                   <el-option size="mini" v-for="item in servOptions" :key="item.value" :label="item.name"
                     :value="item.name">
                   </el-option>
                 </el-select>
               </div>
-              <div class="prototype" v-if="servVal == '网络'">
+              <div class="item prototype" v-if="servVal == '网络'">
-                <span class="itemLabel">协议：</span><el-input style="width: 200px" v-model="prototype"></el-input>
+                <span class="itemLabel">协议</span><el-input v-model="prototype"></el-input>
               </div>
               <div class="item ip">
                 <template v-if="servVal == '单机'">
-                  <span class="itemLabel">IP：</span>{{ localip }}
+                  <span class="itemLabel">IP</span>
+                  <el-input v-model="localip" disabled></el-input>
                 </template>
                 <template v-if="servVal == '网络'">
-                  <span class="itemLabel">IP：</span>
+                  <span class="itemLabel">IP</span>
-                  <el-input style="width: 200px" v-model="ip"></el-input>
+                  <el-input v-model="ip"></el-input>
                 </template>
               </div>
               <div class="item port">
                 <template v-if="servVal == '单机'">
-                  <span class="itemLabel">端口：</span>
+                  <span class="itemLabel">端口</span>
-                  <el-input style="width: 200px" v-model="localport"></el-input>
+                  <el-input v-model="localport"></el-input>
                 </template>
                 <template v-if="servVal == '网络'">
-                  <span class="itemLabel">端口：</span>
+                  <span class="itemLabel">端口</span>
-                  <el-input style="width: 200px" v-model="port"></el-input>
+                  <el-input v-model="port"></el-input>
                 </template>
               </div>
             </template>
             <template v-if="selectedService == '北斗串口'">
               <div class="item">
-                <span class="itemLabel">串口选择：</span>
+                <span class="itemLabel">串口选择</span>
-                <el-select class="select" v-model="gpsVal">
+                <el-select class="select" popper-class="login-select-popper" v-model="gpsVal">
                   <el-option size="mini" v-for="item in gpsOptions" :key="item.value" :label="item.Product"
                     :value="item.Name">
                   </el-option>
@@ -113,7 +111,6 @@
         </div>
 
         <div class="btn">
-          <div class="hr"></div>
           <el-button style="margin: 5px 0" size="mini" @click="submit">确定</el-button>
           <el-button size="mini" @click="cancel">关闭</el-button>
         </div>
@@ -161,6 +158,11 @@ const {
   cancel,
   initialize
 } = useSetUp() // 服务设置逻辑
+
+const handleSelect = (tab) => {
+  selectedService.value = tab.props.name
+}
+
 onMounted(() => {
   loginInit()
   initialize()
@@ -231,13 +233,13 @@ onMounted(() => {
 .service {
   .el-input__wrapper {
     background-color: transparent;
-    border: 0.2px solid rgba(var(--color-base1), 1);
+    border: 0.2px solid rgba(204, 204, 204, 0.4);
-    box-shadow: 0 0 0 0.2px rgba(var(--color-base1), 1) inset !important;
+    box-shadow: 0 0 0 0.2px rgba(204, 204, 204, 0.4) inset !important;
     /* 新增此行 */
   }
 
   .el-input__inner {
-    color: #fff;
+    color: rgba(0, 66, 66, 1);
   }
 
   // .el-checkbox__label {
@@ -250,15 +252,16 @@ onMounted(() => {
   // }
   .el-select__wrapper {
     background-color: transparent;
-    border: 0.2px solid rgba(var(--color-base1), 1);
+    border: 0.2px solid rgba(204, 204, 204, 0.4);
-    box-shadow: 0 0 0 0.2px rgba(var(--color-base1), 1) inset !important;
+    box-shadow: 0 0 0 0.2px rgba(204, 204, 204, 0.4) inset !important;
     /* 新增此行 */
   }
 
   .el-select__placeholder,
   .el-select__tags-text {
-    color: #fff !important;
+    color: rgba(0, 66, 66, 1) !important;
   }
+
 }
 </style>
 <style scoped lang="scss">
@@ -363,30 +366,52 @@ onMounted(() => {
   }
 }
 
-.service {
+#app {
+  .service {
     z-index: 999;
     width: 100vw;
     height: 100vh;
     position: absolute;
 
     .contentBox {
-    border: 1.5px solid;
+      padding: 0 40px 40px 40px;
+      background-color: #ffffff;
       backdrop-filter: blur(2px);
-    background: linear-gradient(0deg, rgba(var(--color-base1), 0.2) 0%, rgba(var(--color-base1), 0) 100%), rgba(0, 0, 0, 0.6);
       width: 450px;
-    height: 400px;
       position: absolute;
-    color: #fff;
+      color: rgba(51, 51, 51, 1);
       left: 50%;
-    top: 50%;
+      top: 29%;
-    transform: translate(-50%, -50%);
+      transform: translate(-50%, 0%);
-    border-image: linear-gradient(to bottom, rgb(var(--color-base1)) 6.25%, rgb(var(--color-base1)) 100%) 1;
       display: flex;
       flex-direction: column;
       justify-content: space-between;
 
+      .hello {
+        color: rgba(0, 66, 66, 1);
+        font-family: 'ddin';
+        font-size: 30px;
+        font-weight: 700;
+        line-height: 30px;
+        margin-bottom: 16px;
+      }
+
+      .greet {
+        color: rgba(0, 66, 66, 1);
+        font-family: 'SourceHanSans';
+        font-size: 18px;
+        line-height: 18px;
+        font-weight: 500;
+
+        span {
+          color: rgba(153, 153, 153, 1);
+          font-weight: 500;
+          margin-right: 5px;
+        }
+      }
+
       .titleBox {
-      height: 50px;
+        height: 40px;
 
         .title {
           line-height: 50px;
@@ -399,30 +424,66 @@ onMounted(() => {
           right: 0;
           position: absolute;
           display: inline-block;
-        width: 35px;
+          width: 30px;
-        height: 33px;
+          height: 30px;
           border-radius: 0 0 0 90%;
           background: rgba(var(--color-base1), 1);
 
           &>span {
             font-size: 1rem;
             position: absolute;
-          right: 5px;
+            right: 0px;
             cursor: pointer;
+            color: rgba(0, 66, 66, 1);
+            font-weight: 700;
+            width: 25px;
+            height: 25px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
           }
         }
       }
 
-    .hr {
-      width: 89%;
-      margin: 0 auto;
-      border-bottom: 1px solid rgba(204, 204, 204, 0.2);
-    }
-
       .serviceContent {
+        margin-top: 30px;
         flex: auto;
-      //border: 1px solid red;
+
-      padding: 5px 0;
+        ::v-deep .el-tabs {
+          .el-tabs__header {
+            margin-bottom: 5px;
+
+            .el-tabs__nav-wrap {
+              .el-tabs__nav-scroll {
+                .el-tabs__nav {
+                  .el-tabs__active-bar {
+                    background: rgba(0, 66, 66, 1);
+                    height: 3px;
+                  }
+
+                  .el-tabs__item {
+                    color: rgba(153, 153, 153, 1);
+                    font-size: 16px;
+                    font-weight: 500;
+                  }
+
+                  .el-tabs__item:focus-visible {
+                    box-shadow: none;
+                  }
+
+                  .el-tabs__item.is-active {
+                    font-size: 18px;
+                    color: rgba(0, 66, 66, 1);
+                  }
+                }
+              }
+            }
+
+            .el-tabs__nav-wrap::after {
+              height: 1px;
+            }
+          }
+        }
 
         .tab {
           border-radius: 5px;
@@ -449,53 +510,54 @@ onMounted(() => {
         }
 
         .itemLabel {
-        width: 85px;
+          width: 64px;
+          flex: 0 0 64px;
+          white-space: nowrap;
           text-align: right;
           display: inline-block;
+          margin-right: 10px;
         }
 
         .tabPanel {
-        width: 80%;
+          margin: 0;
-        margin: 0 auto;
 
           .item {
             display: flex;
             align-items: center;
             margin: 15px 0;
 
-          .select {
+            .select {}
-            //flex: auto;
-            width: 200px;
           }
         }
       }
     }
 
-    &:after {
-      display: block;
-      position: absolute;
-      content: '';
-      left: -1.5px;
-      top: -6px;
-      width: 70.5px;
-      height: 6px;
-      opacity: 1;
-      background: rgba(var(--color-base1), 1);
-      clip-path: polygon(0 0, calc(100% - 3px) 0, 100% 6px, 0 6px);
-    }
-  }
-
     .btn {
       text-align: center;
 
       button {
-      border: 1px solid rgba(var(--color-base1), 0.5) !important;
+        width: 166px;
-      background: rgba(var(--color-base1), 0.2) !important;
+        height: 40px;
-      color: #fff !important;
+        border-radius: 0;
+        ::v-deep span {
+          font-weight: 500;
+        }
 
         &:hover {
           border: 1px solid rgba(var(--color-base1), 1) !important;
-        color: rgba(var(--color-base1), 1) !important;
+        }
+      }
+
+      button:nth-child(1) {
+        background: rgba(0, 255, 255, 1) !important;
+        border-color: #ff000000 !important;
+        color: rgba(0, 66, 66, 1) !important;
+      }
+
+      button:nth-child(2) {
+        background: rgba(255, 255, 255, 1) !important;
+        border-color: rgba(204, 204, 204, 0.4) !important;
+        color: rgba(102, 102, 102, 1) !important;
       }
     }
   }