diff --git a/ruoyi-admin/src/main/resources/application-druid.yml b/ruoyi-admin/src/main/resources/application-druid.yml index 037db5c..1eac54a 100644 --- a/ruoyi-admin/src/main/resources/application-druid.yml +++ b/ruoyi-admin/src/main/resources/application-druid.yml @@ -6,7 +6,7 @@ spring: druid: # 主库数据源 master: - url: jdbc:mysql://localhost:3306/ry?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8 + url: jdbc:mysql://localhost:3306/kj?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8 username: root password: 123456 # 从库数据源 diff --git a/ruoyi-system/src/main/resources/mapper/system/SysMenuMapper.xml b/ruoyi-system/src/main/resources/mapper/system/SysMenuMapper.xml index b5dd7be..cadfb4a 100644 --- a/ruoyi-system/src/main/resources/mapper/system/SysMenuMapper.xml +++ b/ruoyi-system/src/main/resources/mapper/system/SysMenuMapper.xml @@ -13,7 +13,6 @@ - @@ -29,7 +28,7 @@ - select menu_id, menu_name, parent_id, order_num, path, component, `query`, route_name, is_frame, is_cache, menu_type, visible, status, ifnull(perms,'') as perms, icon, create_time + select menu_id, menu_name, parent_id, order_num, path, component, `query`, is_frame, is_cache, menu_type, visible, status, ifnull(perms,'') as perms, icon, create_time from sys_menu @@ -50,13 +49,13 @@ - where menu_type in ('M', 'C') and (path = #{path} or path = #{routeName} or route_name = #{path} or route_name = #{routeName}) + where menu_type in ('M', 'C') and (path = #{path} or path = #{routeName}) @@ -147,7 +146,6 @@ path = #{path}, component = #{component}, `query` = #{query}, - route_name = #{routeName}, is_frame = #{isFrame}, is_cache = #{isCache}, menu_type = #{menuType}, @@ -171,7 +169,6 @@ path, component, `query`, - route_name, is_frame, is_cache, menu_type, @@ -190,7 +187,6 @@ #{path}, #{component}, #{query}, - #{routeName}, #{isFrame}, #{isCache}, #{menuType}, diff --git a/ruoyi-ui/node_modules.zip b/ruoyi-ui/node_modules.zip deleted file mode 100644 index 9fc2cd2..0000000 Binary files a/ruoyi-ui/node_modules.zip and /dev/null differ diff --git a/ruoyi-ui/package.json b/ruoyi-ui/package.json index bcdb065..915ace5 100644 --- a/ruoyi-ui/package.json +++ b/ruoyi-ui/package.json @@ -26,7 +26,7 @@ "dependencies": { "@riophae/vue-treeselect": "0.4.0", "axios": "0.28.1", - "cesium": "1.95", + "cesium": "^1.95.0", "clipboard": "2.0.8", "core-js": "3.37.1", "echarts": "5.4.0", @@ -50,6 +50,8 @@ "vuex": "3.6.0" }, "devDependencies": { + "@babel/plugin-transform-nullish-coalescing-operator": "^7.28.6", + "@babel/plugin-transform-optional-chaining": "^7.28.6", "@open-wc/webpack-import-meta-loader": "^0.4.7", "@vue/cli-plugin-babel": "4.4.6", "@vue/cli-service": "4.4.6", @@ -57,7 +59,6 @@ "chalk": "4.1.0", "compression-webpack-plugin": "6.1.2", "connect": "3.6.6", - "copy-webpack-plugin": "^5.1.2", "sass": "1.32.13", "sass-loader": "10.1.1", "script-ext-html-webpack-plugin": "2.1.5", diff --git a/ruoyi-ui/src/permission.js b/ruoyi-ui/src/permission.js index 6eac895..d4ff8dd 100644 --- a/ruoyi-ui/src/permission.js +++ b/ruoyi-ui/src/permission.js @@ -10,6 +10,7 @@ import { isRelogin } from '@/utils/request' NProgress.configure({ showSpinner: false }) const whiteList = ['/login', '/register', '/selectRoom', '/childRoom'] + const isWhiteList = (path) => { return whiteList.some(pattern => isPathMatch(pattern, path)) } diff --git a/ruoyi-ui/src/views/cesiumMap/DrawingToolbar.vue b/ruoyi-ui/src/views/cesiumMap/DrawingToolbar.vue new file mode 100644 index 0000000..f53a9c0 --- /dev/null +++ b/ruoyi-ui/src/views/cesiumMap/DrawingToolbar.vue @@ -0,0 +1,128 @@ + + + + + diff --git a/ruoyi-ui/src/views/cesiumMap/MeasurementPanel.vue b/ruoyi-ui/src/views/cesiumMap/MeasurementPanel.vue new file mode 100644 index 0000000..d09f8d4 --- /dev/null +++ b/ruoyi-ui/src/views/cesiumMap/MeasurementPanel.vue @@ -0,0 +1,104 @@ + + + + + diff --git a/ruoyi-ui/src/views/cesiumMap/index.vue b/ruoyi-ui/src/views/cesiumMap/index.vue index e3abcae..e17cf32 100644 --- a/ruoyi-ui/src/views/cesiumMap/index.vue +++ b/ruoyi-ui/src/views/cesiumMap/index.vue @@ -2,200 +2,30 @@
- -
- - - - -
-
- - - -
-
-
-
- - - - - -
- -
- - - -
- -
- - - -
-
- - -
- - - - - -
- - -
-
- - -
-
-
测量结果
-
- 长度： - {{ measurementResult.distance.toFixed(2) }} 米 -
-
- 面积： - {{ measurementResult.area.toFixed(2) }} 平方米 -
-
- 半径： - {{ measurementResult.radius.toFixed(2) }} 米 -
- -
-
+ + +
+ + + + diff --git a/ruoyi-ui/src/views/childRoom/LeftMenu.vue b/ruoyi-ui/src/views/childRoom/LeftMenu.vue new file mode 100644 index 0000000..0611f6c --- /dev/null +++ b/ruoyi-ui/src/views/childRoom/LeftMenu.vue @@ -0,0 +1,139 @@ + + + + + diff --git a/ruoyi-ui/src/views/childRoom/RightPanel.vue b/ruoyi-ui/src/views/childRoom/RightPanel.vue new file mode 100644 index 0000000..87c5423 --- /dev/null +++ b/ruoyi-ui/src/views/childRoom/RightPanel.vue @@ -0,0 +1,723 @@ + + + + + diff --git a/ruoyi-ui/src/views/childRoom/TopHeader.vue b/ruoyi-ui/src/views/childRoom/TopHeader.vue new file mode 100644 index 0000000..870d0ad --- /dev/null +++ b/ruoyi-ui/src/views/childRoom/TopHeader.vue @@ -0,0 +1,768 @@ + + + + + diff --git a/ruoyi-ui/src/views/childRoom/index.vue b/ruoyi-ui/src/views/childRoom/index.vue index f0bf5c9..c1c8c89 100644 --- a/ruoyi-ui/src/views/childRoom/index.vue +++ b/ruoyi-ui/src/views/childRoom/index.vue @@ -21,514 +21,91 @@
- - -
-
- -
- -
-
-
- - 联合任务筹划系统 -
- - -
-
- - {{ item.name }} - - - -
- - 新建计划 - 打开 - 保存 - - - - 导入 - -
- - 导入计划 - 导入ACD - 导入ATO - 导入图层 - 导入航线 - - - - - 导出 - - - - - -
- - 航线编辑 - 军事标绘 - 图标编辑 - 属性修改 - - - - 推演编辑 - -
- - 时间设置 - 机型设置 - 关键事件编辑 - 导弹发射 - - - - - - - - -
- - 2D/3D切换 - 显示/隐藏标尺 - 网格 - 比例尺 - 指北针 - - - - - -
- - 加载/切换地形 - 投影 - 航空图 - - - - - -
- - 航线计算 - 冲突显示 - 数据资料 - 坐标换算 - - - - - -
- - 设置 - 系统说明 - - - - - -
- - 图层收藏 - 航线收藏 - - -
-
-
- -
- -
- -
- -
-
房间编号
-
{{ roomCode }}
-
-
- - -
- -
-
在线人数
-
{{ onlineCount }}人
-
-
- - -
- -
-
作战时间
-
{{ combatTime }}
-
-
- - -
- -
-
天文时间
-
{{ astroTime }}
-
-
-
- - -
- - -
-
-
+ + -
- -
- -
- - -
-
- - -
- {{ item.name }} -
-
-
- - -
-
{{ getMenuName(hoverMenu) }}
-
-
- - -
- -
+ -
- - -
- -
- - 方案 -
- - -
- - 冲突 - {{ conflictCount }} -
- - -
- - 平台 -
-
- - -
-
-
航线列表
-
-
- -
-
{{ route.name }}
-
{{ route.points }}个航点
-
- - 冲突 - - -
- -
-
-
-
- -
-
航点列表
-
-
- -
-
{{ point.name }}
-
高度: {{ point.altitude }}m | 速度: {{ point.speed }}
-
-
- - -
-
-
-
- -
- - 添加航点 - - - 取消 - -
-
- - -
-
-
-
- - {{ conflict.title }} - 严重 -
-
-
- 涉及航线： - {{ conflict.routes.join('、') }} -
-
- 冲突时间： - {{ conflict.time }} -
-
- 冲突位置： - {{ conflict.position }} -
-
-
- - 查看详情 - - - 解决冲突 - -
-
-
-
- -

暂无冲突

- - 重新检测 - -
-
+ - -
-
- - -
-
-
- -
-
-
{{ platform.name }}
-
{{ platform.type }}
-
-
- -
-
-
- - - -
-
-
- -
-
-
{{ platform.name }}
-
{{ platform.type }}
-
-
- -
-
-
- - - -
-
-
- -
-
-
{{ platform.name }}
-
{{ platform.type }}
-
-
- -
-
-
- - -
-
-
+ +
-
- K-02:00 - K-01:00 - K时 - K+01:00 - K+02:00 +
+ + +
+ + {{ playbackSpeed }}x + +
-
-
- 网络延迟： - < 200ms -
-
- 数据同步： - 正常 -
-
- 检测告警： - 2处 -
-
+ @@ -614,6 +200,10 @@ import OnlineMembersDialog from '@/views/dialogs/OnlineMembersDialog' import PlatformEditDialog from '@/views/dialogs/PlatformEditDialog' import RouteEditDialog from '@/views/dialogs/RouteEditDialog' import WaypointEditDialog from '@/views/dialogs/WaypointEditDialog' +import LeftMenu from './LeftMenu' +import RightPanel from './RightPanel' +import BottomLeftPanel from './BottomLeftPanel' +import TopHeader from './TopHeader' export default { name: 'MissionPlanningView', components: { @@ -621,7 +211,11 @@ export default { OnlineMembersDialog, PlatformEditDialog, RouteEditDialog, - WaypointEditDialog + WaypointEditDialog, + LeftMenu, + RightPanel, + BottomLeftPanel, + TopHeader }, data() { return { @@ -635,18 +229,6 @@ export default { selectedRoute: null, showWaypointDialog: false, selectedWaypoint: null, - // 顶部导航 - activeTopNav: 'file', - topNavItems: [ - { id: 'file', name: '文件', icon: 'el-icon-document' }, - { id: 'edit', name: '编辑', icon: 'el-icon-edit' }, - { id: 'view', name: '视图', icon: 'el-icon-view' }, - { id: 'map', name: '地图', icon: 'el-icon-map-location' }, - { id: 'airspace', name: '空域', icon: 'el-icon-s-grid' }, - { id: 'tools', name: '工具', icon: 'el-icon-setting' }, - { id: 'options', name: '选项', icon: 'el-icon-s-tools' }, - { id: 'favorites', name: '收藏', icon: 'el-icon-star-on' } - ], // 作战信息 roomCode: 'JTF-7-ALPHA', @@ -657,8 +239,6 @@ export default { // 左侧菜单栏 isMenuHidden: true, // 是否完全隐藏左侧菜单 activeMenu: 'file', - hoverMenu: '', - showMenuTooltip: false, // 右侧面板控制 isRightPanelHidden: true, // 是否完全隐藏右侧面板 @@ -666,10 +246,15 @@ export default { // K时弹出框控制 showKTimePopup: false, + // 显示/隐藏控制 + showAirport: true, + showLandmark: true, + showRoute: true, + menuItems: [ - { id: 'file', name: '文件', icon: 'el-icon-document' }, - { id: 'start', name: '开始', icon: 'el-icon-caret-right' }, - { id: 'insert', name: '插入', icon: 'el-icon-plus' }, + { id: 'file', name: '方案', icon: 'el-icon-s-operation' }, + { id: 'start', name: '冲突', icon: 'el-icon-warning-outline' }, + { id: 'insert', name: '平台', icon: 'el-icon-ship' }, { id: 'pattern', name: '图案', icon: 'el-icon-picture-outline' }, { id: 'deduction', name: '推演', icon: 'el-icon-video-play' }, { id: 'modify', name: '修改', icon: 'el-icon-edit' }, @@ -734,6 +319,9 @@ export default { // 时间控制 timeProgress: 45, currentTime: 'K+01:15:30', + isPlaying: false, + playbackSpeed: 1, + playbackInterval: null, // 用户 userAvatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png', @@ -751,6 +339,13 @@ export default { // 作战时间也需要实时更新 setInterval(this.updateCombatTime, 1000); }, + beforeDestroy() { + // 清除播放定时器 + if (this.playbackInterval) { + clearInterval(this.playbackInterval); + this.playbackInterval = null; + } + }, methods: { // 显示在线成员弹窗 showOnlineMembersDialog() { @@ -809,12 +404,6 @@ export default { this.combatTime = `K+${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`; }, - // 顶部导航菜单操作 - selectTopNav(item) { - this.activeTopNav = item.id; - this.$message.info(`选择菜单: ${item.name}`); - }, - // 左侧菜单栏操作 showMenu() { this.isMenuHidden = false; @@ -833,187 +422,166 @@ export default { }, // 文件下拉菜单方法 - newPlan() { - this.$message.success('新建计划'); - // 这里可以添加新建计划的逻辑 - }, - - openPlan() { - this.$message.success('打开计划'); - // 这里可以添加打开计划的逻辑 - }, - savePlan() { this.$message.success('保存计划'); - // 这里可以添加保存计划的逻辑 - }, - - importPlan() { - this.$message.success('导入计划'); - // 这里可以添加导入计划的逻辑 }, - // 导入二级菜单方法 importPlanFile() { this.$message.success('导入计划'); - // 这里可以添加导入计划文件的逻辑 }, importACD() { this.$message.success('导入ACD'); - // 这里可以添加导入ACD文件的逻辑 }, importATO() { this.$message.success('导入ATO'); - // 这里可以添加导入ATO文件的逻辑 }, importLayer() { this.$message.success('导入图层'); - // 这里可以添加导入图层的逻辑 }, importRoute() { this.$message.success('导入航线'); - // 这里可以添加导入航线的逻辑 }, exportPlan() { this.$message.success('导出计划'); - // 这里可以添加导出计划的逻辑 }, // 编辑下拉菜单方法 routeEdit() { this.$message.success('航线编辑'); - // 这里可以添加航线编辑的逻辑 }, militaryMarking() { this.$message.success('军事标绘'); - // 这里可以添加军事标绘的逻辑 }, iconEdit() { this.$message.success('图标编辑'); - // 这里可以添加图标编辑的逻辑 }, attributeEdit() { this.$message.success('属性修改'); - // 这里可以添加属性修改的逻辑 }, - deductionEdit() { - this.$message.success('推演编辑'); - // 这里可以添加推演编辑的逻辑 - }, - - // 推演编辑二级菜单方法 timeSettings() { this.$message.success('时间设置'); - // 这里可以添加时间设置的逻辑 }, aircraftSettings() { this.$message.success('机型设置'); - // 这里可以添加机型设置的逻辑 }, keyEventEdit() { this.$message.success('关键事件编辑'); - // 这里可以添加关键事件编辑的逻辑 }, missileLaunch() { this.$message.success('导弹发射'); - // 这里可以添加导弹发射的逻辑 }, // 视图下拉菜单方法 toggle2D3D() { this.$message.success('2D/3D切换'); - // 这里可以添加2D/3D切换的逻辑 }, toggleRuler() { this.$message.success('显示/隐藏标尺'); - // 这里可以添加标尺显示/隐藏的逻辑 }, toggleGrid() { this.$message.success('显示/隐藏网格'); - // 这里可以添加网格显示/隐藏的逻辑 }, toggleScale() { this.$message.success('显示/隐藏比例尺'); - // 这里可以添加比例尺显示/隐藏的逻辑 - }, - - toggleCompass() { - this.$message.success('显示/隐藏指北针'); - // 这里可以添加指北针显示/隐藏的逻辑 }, // 地图下拉菜单方法 loadTerrain() { this.$message.success('加载/切换地形'); - // 这里可以添加地形加载/切换的逻辑 }, changeProjection() { this.$message.success('投影'); - // 这里可以添加投影切换的逻辑 }, loadAeroChart() { this.$message.success('航空图'); - // 这里可以添加航空图加载的逻辑 + }, + + // 空域下拉菜单方法 + powerZone() { + this.$message.success('威力区'); + }, + + threatZone() { + this.$message.success('威胁区'); }, // 工具下拉菜单方法 routeCalculation() { this.$message.success('航线计算'); - // 这里可以添加航线计算的逻辑 }, conflictDisplay() { this.$message.success('冲突显示'); - // 这里可以添加冲突显示的逻辑 }, dataMaterials() { this.$message.success('数据资料'); - // 这里可以添加数据资料管理的逻辑 }, coordinateConversion() { this.$message.success('坐标换算'); - // 这里可以添加坐标换算的逻辑 }, // 选项下拉菜单方法 - settings() { - this.$message.success('设置'); - // 这里可以添加系统设置的逻辑 + pageLayout() { + this.$message.success('页面布局'); + }, + + dataStoragePath() { + this.$message.success('数据存储路径'); + }, + + externalParams() { + this.$message.success('外部参数'); + }, + + toggleAirport() { + this.showAirport = !this.showAirport; + this.$message.success(this.showAirport ? '显示机场' : '隐藏机场'); + }, + + toggleLandmark() { + this.showLandmark = !this.showLandmark; + this.$message.success(this.showLandmark ? '显示地标' : '隐藏地标'); + }, + + toggleRoute() { + this.showRoute = !this.showRoute; + this.$message.success(this.showRoute ? '显示航线' : '隐藏航线'); }, systemDescription() { this.$message.success('系统说明'); - // 这里可以添加系统说明的逻辑 }, // 收藏下拉菜单方法 layerFavorites() { this.$message.success('图层收藏'); - // 这里可以添加图层收藏的逻辑 }, routeFavorites() { this.$message.success('航线收藏'); - // 这里可以添加航线收藏的逻辑 + }, + + showOnlineMembersDialog() { + this.showOnlineMembers = true; }, hideRightPanel() { @@ -1023,7 +591,33 @@ export default { selectMenu(item) { this.activeMenu = item.id; - if(item.id === 'modify'){ + + // 点击左侧的方案、冲突、平台时，切换右侧面板内容 + if (item.id === 'file') { + // 如果当前已经是方案标签页，则关闭右侧面板 + if (this.activeRightTab === 'plan' && !this.isRightPanelHidden) { + this.isRightPanelHidden = true; + } else { + this.activeRightTab = 'plan'; + this.isRightPanelHidden = false; + } + } else if (item.id === 'start') { + // 如果当前已经是冲突标签页，则关闭右侧面板 + if (this.activeRightTab === 'conflict' && !this.isRightPanelHidden) { + this.isRightPanelHidden = true; + } else { + this.activeRightTab = 'conflict'; + this.isRightPanelHidden = false; + } + } else if (item.id === 'insert') { + // 如果当前已经是平台标签页，则关闭右侧面板 + if (this.activeRightTab === 'platform' && !this.isRightPanelHidden) { + this.isRightPanelHidden = true; + } else { + this.activeRightTab = 'platform'; + this.isRightPanelHidden = false; + } + } else if(item.id === 'modify'){ this.drawDom = !this.drawDom console.log(this.drawDom,999999) } @@ -1042,23 +636,72 @@ export default { } }, - showTooltip(item) { - this.hoverMenu = item.id; + // K时弹出框操作 + hideKTimePopup() { + this.showKTimePopup = false; + this.$message.info('隐藏推演时钟控制'); + }, + + // 播放控制 + togglePlay() { + this.isPlaying = !this.isPlaying; + if (this.isPlaying) { + this.startPlayback(); + this.$message.success('开始播放'); + } else { + this.stopPlayback(); + this.$message.info('暂停播放'); + } }, - hideTooltip() { - this.hoverMenu = ''; + startPlayback() { + if (this.playbackInterval) { + clearInterval(this.playbackInterval); + } + this.playbackInterval = setInterval(() => { + this.timeProgress += this.playbackSpeed * 0.1; + if (this.timeProgress >= 100) { + this.timeProgress = 0; + } + this.updateTimeFromProgress(); + }, 100); }, - getMenuName(id) { - const menu = this.menuItems.find(item => item.id === id); - return menu ? menu.name : ''; + stopPlayback() { + if (this.playbackInterval) { + clearInterval(this.playbackInterval); + this.playbackInterval = null; + } }, - // K时弹出框操作 - hideKTimePopup() { - this.showKTimePopup = false; - this.$message.info('隐藏推演时钟控制'); + increaseSpeed() { + if (this.playbackSpeed < 25) { + this.playbackSpeed++; + if (this.isPlaying) { + this.startPlayback(); + } + } + }, + + decreaseSpeed() { + if (this.playbackSpeed > 1) { + this.playbackSpeed--; + if (this.isPlaying) { + this.startPlayback(); + } + } + }, + + updateTimeFromProgress() { + const totalSeconds = Math.floor(this.timeProgress * 72); + const hours = Math.floor(totalSeconds / 3600) - 2; + const minutes = Math.floor((totalSeconds % 3600) / 60); + const seconds = totalSeconds % 60; + + const sign = hours >= 0 ? '+' : '-'; + const absHours = Math.abs(hours); + + this.currentTime = `K${sign}${String(absHours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`; }, // 时间控制（保留用于底部时间轴） @@ -1217,12 +860,6 @@ background: url('~@/assets/map-background.png'); transform: translateY(-50%); } -/* 右侧红点 */ -.right-red-dot { - right: 20px; - transform: translateY(-50%); -} - .red-dot { width: 20px; height: 20px; @@ -1308,1060 +945,177 @@ background: url('~@/assets/map-background.png'); color: #008aff; } -/* 顶部导航栏 - 最终优化设计 */ -.floating-header { - position: absolute; - top: 0; - left: 0; - right: 0; - height: 60px; - padding: 0 20px; - display: flex; - align-items: center; - justify-content: space-between; - z-index: 100; - backdrop-filter: blur(15px); - background: rgba(255, 255, 255, 0.85); - border-bottom: 1px solid rgba(0, 138, 255, 0.2); - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1); -} - -.header-left { - display: flex; - align-items: center; - gap: 25px; - flex: 1; +.status-dot.operating { + background: #008aff; + animation: pulse 2s infinite; + box-shadow: 0 0 10px rgba(0, 138, 255, 0.8); } -.system-title { - display: flex; - align-items: center; - font-size: 18px; - font-weight: bold; - min-width: 180px; +/* 蓝色主题标签页 */ +.blue-tabs >>> .el-tabs__item { + color: #666; + transition: all 0.3s; } -.system-title i { - font-size: 24px; +.blue-tabs >>> .el-tabs__item:hover { color: #008aff; } -.blue-title { - color: #008aff !important; +.blue-tabs >>> .el-tabs__item.is-active { + color: #008aff; + font-weight: 600; } -/* 顶部导航菜单 - 优化为简洁文字效果 */ -.top-nav-menu { - display: flex; - gap: 0; - flex: 1; - overflow-x: auto; - max-width: 800px; - padding: 5px 0; - scrollbar-width: thin; +.blue-tabs >>> .el-tabs__active-bar { + background-color: #008aff; + box-shadow: 0 0 6px rgba(0, 138, 255, 0.5); } -.top-nav-menu::-webkit-scrollbar { - height: 3px; +.blue-tabs >>> .el-tabs__nav-wrap::after { + background-color: rgba(0, 138, 255, 0.3); } -.top-nav-menu::-webkit-scrollbar-track { - background: rgba(0, 138, 255, 0.1); - border-radius: 2px; +/* 底部时间轴（最初版本的样式）- 蓝色主题 */ +.floating-timeline { + position: absolute; + bottom: 20px; + left: 50%; + transform: translateX(-50%) translateY(100%); + width: 80%; + border-radius: 12px; + z-index: 95; + padding: 10px 20px; + color: #333; + transition: all 0.3s ease; + opacity: 0; + pointer-events: none; + backdrop-filter: blur(15px); + background: rgba(255, 255, 255, 0.95); + box-shadow: 0 8px 32px rgba(0, 138, 255, 0.25); + border: 1px solid rgba(0, 138, 255, 0.3); } -.top-nav-menu::-webkit-scrollbar-thumb { - background: rgba(0, 138, 255, 0.3); - border-radius: 2px; +.floating-timeline.show { + transform: translateX(-50%) translateY(0); + opacity: 1; + pointer-events: auto; } -.top-nav-item { +.popup-hide-btn { + position: absolute; + top: -28px; + left: 50%; + transform: translateX(-50%); + width: 56px; + height: 28px; + background: rgba(255, 255, 255, 0.3); + backdrop-filter: blur(10px); + border: 1px solid rgba(0, 138, 255, 0.4); + border-bottom: none; + border-radius: 12px 12px 0 0; display: flex; align-items: center; - gap: 6px; - padding: 8px 12px; - cursor: pointer; - font-size: 13px; - font-weight: 600; - color: #333; - transition: all 0.3s; - border-radius: 4px; - white-space: nowrap; - min-width: 60px; justify-content: center; - margin: 0 1px; - position: relative; - flex-shrink: 0; -} - -.top-nav-item:hover { - color: #008aff; -} - -.top-nav-item.active { + cursor: pointer; color: #008aff; - font-weight: 700; -} - -/* 移除了蓝色指示条 */ -.top-nav-item.active::after { - display: none; -} - -.nav-icon { - font-size: 14px; - color: #333; + font-size: 18px; transition: all 0.3s; + z-index: 10; } -.top-nav-item:hover .nav-icon, -.top-nav-item.active .nav-icon { - color: #008aff; -} - -.nav-text { - display: block; +.popup-hide-btn:hover { + background: rgba(0, 138, 255, 0.2); + color: #0066cc; + height: 32px; + top: -32px; } -/* 右侧区域 */ -.header-right { +.timeline-controls { display: flex; align-items: center; - gap: 15px; -} - -/* 作战信息组 */ -.combat-info-group { - display: flex; - gap: 12px; + justify-content: space-between; + margin-bottom: 5px; } -.info-box { +.current-time { display: flex; align-items: center; gap: 8px; - padding: 6px 10px; - border-radius: 6px; - transition: all 0.3s; - background: rgba(255, 255, 255, 0.7); - border: 1px solid rgba(0, 138, 255, 0.2); - box-shadow: 0 2px 6px rgba(0, 138, 255, 0.1); - min-width: 120px; -} - -.info-box:hover { - background: rgba(255, 255, 255, 0.9); - transform: translateY(-1px); - box-shadow: 0 4px 10px rgba(0, 138, 255, 0.2); - border-color: rgba(0, 138, 255, 0.3); -} - -.info-icon { - font-size: 16px; - color: #008aff; - min-width: 20px; - text-align: center; -} - -.info-content { - display: flex; - flex-direction: column; - flex: 1; -} - -.info-label { - font-size: 11px; - color: #666; + font-family: monospace; + font-size: 14px; font-weight: 500; - margin-bottom: 2px; - white-space: nowrap; -} - -.info-value { - font-size: 13px; - font-weight: 700; - color: #333; - white-space: nowrap; - font-family: 'Courier New', monospace; - letter-spacing: 0.5px; -} - -/* 作战时间和天文时间的特殊样式 */ -.combat-info-group .info-box:nth-child(3) .info-value { - color: #008aff; -} - -.combat-info-group .info-box:nth-child(4) .info-value { - color: #52c41a; -} - -/* 用户状态区域 */ -.user-status-area { - display: flex; - align-items: center; -} - -.user-avatar { - border: 2px solid rgba(0, 138, 255, 0.3); - box-shadow: 0 2px 6px rgba(0, 138, 255, 0.15); - transition: all 0.3s; - background: rgba(255, 255, 255, 0.9); -} - -.user-avatar:hover { - transform: scale(1.1); - box-shadow: 0 4px 10px rgba(0, 138, 255, 0.25); - border-color: rgba(0, 138, 255, 0.6); -} - -/* 左侧菜单栏 - 蓝色主题 */ -.floating-left-menu { - position: absolute; - top: 70px; - left: 20px; - width: 40px; - background: rgba(255, 255, 255, 0.3); - backdrop-filter: blur(10px); - border: 1px solid rgba(0, 138, 255, 0.1); - border-radius: 8px; - z-index: 90; - box-shadow: 0 4px 12px rgba(0, 138, 255, 0.2); - padding: 15px 5px; - transition: all 0.3s ease; - overflow: hidden; - opacity: 1; - transform: translateX(0); -} - -.floating-left-menu.hidden { - opacity: 0; - transform: translateX(-100%); - pointer-events: none; -} - -.hide-btn { - position: absolute; - top: 15px; - left: 50%; - transform: translateX(-50%); - width: 24px; - height: 24px; - display: flex; - justify-content: center; - align-items: center; - cursor: pointer; - color: #008aff; - font-size: 16px; - transition: all 0.3s; - background: rgba(255, 255, 255, 0.5); - border-radius: 4px; - z-index: 10; -} - -.hide-btn:hover { - color: #0066cc; - background: rgba(0, 138, 255, 0.1); - transform: scale(1.1); -} - -.menu-icons { - display: flex; - flex-direction: column; - gap: 10px; - margin-top: 30px; -} - -.menu-item { - display: flex; - justify-content: center; - align-items: center; - height: 40px; - cursor: pointer; - color: #555; - font-size: 20px; - position: relative; - transition: all 0.3s; + padding: 4px 12px; border-radius: 4px; - padding: 0 5px; - background: rgba(255, 255, 255, 0.8); - backdrop-filter: blur(5px); - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); -} - -.menu-item:hover { - background: rgba(0, 138, 255, 0.1); - color: #008aff; - transform: translateY(-2px); - box-shadow: 0 4px 10px rgba(0, 138, 255, 0.2); } -.menu-item.active { - background: linear-gradient(135deg, rgba(0, 138, 255, 0.2), rgba(0, 138, 255, 0.3)); - color: #008aff; - box-shadow: 0 4px 12px rgba(0, 138, 255, 0.25); +.timeline-slider { + flex: 1; + margin: 0 20px; } -.menu-tooltip { - position: absolute; - left: 100%; - top: 50%; - transform: translateY(-50%); - background: linear-gradient(135deg, rgba(0, 138, 255, 0.95), rgba(0, 102, 204, 0.95)); - color: white; - padding: 8px 14px; - border-radius: 6px; - font-size: 12px; - white-space: nowrap; - z-index: 1000; - margin-left: 10px; - box-shadow: 0 4px 12px rgba(0, 138, 255, 0.3); - pointer-events: none; - backdrop-filter: blur(5px); +.compact-slider { + width: 100%; } -.menu-tooltip-layer { - position: absolute; - top: 0; - left: 100%; - width: 200px; - height: 100%; - z-index: 999; - pointer-events: none; +.blue-slider >>> .el-slider__bar { + background-color: rgba(0, 138, 255, 0.8); } -.tooltip-content { - position: absolute; - top: 50%; - left: 0; - transform: translateY(-50%); - background: linear-gradient(135deg, rgba(0, 138, 255, 0.95), rgba(0, 102, 204, 0.95)); - color: white; - padding: 8px 14px; - border-radius: 6px; - font-size: 12px; - white-space: nowrap; - margin-left: 10px; - box-shadow: 0 4px 12px rgba(0, 138, 255, 0.3); - backdrop-filter: blur(5px); +.blue-slider >>> .el-slider__button { + border-color: rgba(0, 138, 255, 0.8); + background-color: rgba(0, 138, 255, 0.8); } -/* 右侧外部隐藏按钮 */ -.right-external-hide-btn { - position: absolute; - top: 70px; - right: 320px; /* 面板宽度300px + 外边距20px */ - width: 28px; - height: 40px; +.playback-controls { display: flex; - justify-content: center; align-items: center; - cursor: pointer; - color: white; - font-size: 16px; - transition: all 0.3s; - background: rgba(0, 138, 255, 0.9); - border-radius: 8px 0 0 8px; - z-index: 91; - border: 1px solid rgba(0, 138, 255, 1); - border-right: none; - box-shadow: -2px 0 8px rgba(0, 138, 255, 0.3); - opacity: 1; - transform: translateX(0); -} - -.right-external-hide-btn:hover { - background: rgba(0, 138, 255, 1); - transform: translateX(-2px); - box-shadow: -4px 0 12px rgba(0, 138, 255, 0.5); -} - -.right-external-hide-btn.hidden { - opacity: 0; - pointer-events: none; - transform: translateX(20px); -} - -/* 右侧浮动面板 - 蓝色主题 */ -.floating-right-panel { - position: absolute; - top: 70px; - right: 20px; - width: 300px; - border-radius: 0 8px 8px 8px; - z-index: 90; - color: #333; - overflow: hidden; - box-shadow: 0 4px 20px rgba(0, 138, 255, 0.2); - background: rgba(255, 255, 255, 0.95); - backdrop-filter: blur(15px); - transition: all 0.3s ease; - opacity: 1; - transform: translateX(0); -} - -.floating-right-panel.hidden { - opacity: 0; - transform: translateX(100%); - pointer-events: none; + gap: 10px; } -.right-tabs { - display: flex; - border-bottom: 1px solid rgba(0, 138, 255, 0.3); +.control-btn { + width: 26px; + height: 26px; + border: 1px solid rgba(0, 138, 255, 0.3); background: rgba(255, 255, 255, 0.9); - backdrop-filter: blur(5px); -} - -.right-tab-item { - flex: 1; - text-align: center; - padding: 12px 0; + border-radius: 4px; cursor: pointer; display: flex; - flex-direction: column; align-items: center; - gap: 4px; - transition: all 0.3s; - position: relative; - border-bottom: 3px solid transparent; - background: rgba(255, 255, 255, 0.8); - backdrop-filter: blur(5px); -} - -.right-tab-item i { - font-size: 18px; - color: #666; - transition: all 0.3s; -} - -.right-tab-item span { - font-size: 12px; - color: #666; + justify-content: center; transition: all 0.3s; -} - -.right-tab-item:hover { - background: rgba(0, 138, 255, 0.1); - box-shadow: 0 2px 6px rgba(0, 138, 255, 0.15); -} - -.right-tab-item.active { - background: rgba(255, 255, 255, 0.95); - border-bottom: 3px solid rgba(0, 138, 255, 0.8); - box-shadow: 0 2px 8px rgba(0, 138, 255, 0.2); -} - -.right-tab-item.active i, -.right-tab-item.active span { color: #008aff; - font-weight: 600; - text-shadow: 0 0 2px rgba(0, 138, 255, 0.3); -} - -.badge { - position: absolute; - top: 8px; - right: 20px; - border-radius: 10px; - padding: 2px 8px; - font-size: 10px; - min-width: 16px; - text-align: center; - backdrop-filter: blur(5px); - box-shadow: 0 2px 4px rgba(0, 138, 255, 0.3); -} - -.tab-content { - padding: 15px; - max-height: 500px; - overflow-y: auto; - background: rgba(255, 255, 255, 0.95); - backdrop-filter: blur(10px); -} - -.section { - margin-bottom: 20px; -} - -.section-title { - font-size: 12px; - color: #666; - margin-bottom: 10px; - padding-bottom: 6px; - border-bottom: 1px solid rgba(0, 138, 255, 0.3); - font-weight: 600; -} - -.route-list { - margin-bottom: 20px; -} - -.route-item { - display: flex; - align-items: center; - padding: 10px; - border-radius: 6px; - margin-bottom: 6px; - cursor: pointer; - transition: all 0.3s; - border: 1px solid transparent; - background: rgba(255, 255, 255, 0.9); - backdrop-filter: blur(5px); - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } -.route-item:hover { +.control-btn:hover:not(:disabled) { background: rgba(0, 138, 255, 0.1); - border-color: rgba(0, 138, 255, 0.3); - transform: translateY(-1px); - box-shadow: 0 4px 10px rgba(0, 138, 255, 0.15); -} - -.route-item.selected { - background: linear-gradient(135deg, rgba(0, 138, 255, 0.15), rgba(0, 138, 255, 0.25)); - border-color: rgba(0, 138, 255, 0.4); - box-shadow: 0 4px 12px rgba(0, 138, 255, 0.2); -} - -.route-item i { - font-size: 18px; - color: #008aff; - margin-right: 10px; - text-shadow: 0 0 4px rgba(0, 138, 255, 0.3); -} - -.route-info { - flex: 1; -} - -.route-name { - font-size: 13px; - color: #333; - margin-bottom: 3px; - font-weight: 600; -} - -.route-meta { - font-size: 11px; - color: #666; + border-color: rgba(0, 138, 255, 0.5); } -.conflict-tag { - background: linear-gradient(135deg, #f56c6c, #c45656); - border: none; - color: white; - backdrop-filter: blur(5px); - box-shadow: 0 2px 4px rgba(245, 108, 108, 0.3); +.control-btn:disabled { + opacity: 0.4; + cursor: not-allowed; } -.waypoint-list { - margin-bottom: 15px; +.control-btn i { + font-size: 14px; } -.waypoint-item { +.speed-control { display: flex; align-items: center; - padding: 10px; - border-radius: 6px; - margin-bottom: 6px; + gap: 6px; + padding: 2px 8px; background: rgba(255, 255, 255, 0.9); border: 1px solid rgba(0, 138, 255, 0.3); - backdrop-filter: blur(5px); - box-shadow: 0 2px 4px rgba(0, 138, 255, 0.1); - transition: all 0.3s; -} - -.waypoint-item:hover { - transform: translateY(-1px); - box-shadow: 0 4px 10px rgba(0, 138, 255, 0.15); -} - -.waypoint-item i { - font-size: 18px; - color: #52c41a; - margin-right: 10px; - text-shadow: 0 0 4px rgba(82, 196, 26, 0.3); -} - -.waypoint-info { - flex: 1; -} - -.waypoint-name { - font-size: 13px; - color: #333; - margin-bottom: 3px; - font-weight: 600; + border-radius: 4px; } -.waypoint-meta { +.speed-text { font-size: 11px; - color: #666; -} - -.waypoint-actions { - display: flex; - gap: 10px; - color: #666; -} - -.waypoint-actions i { - cursor: pointer; - font-size: 14px; - transition: all 0.3s; - padding: 4px; - border-radius: 4px; - background: rgba(255, 255, 255, 0.8); - backdrop-filter: blur(5px); -} - -.waypoint-actions i:hover { - color: #008aff; - transform: scale(1.1); - box-shadow: 0 2px 6px rgba(0, 138, 255, 0.2); -} - -.action-buttons { - display: flex; - gap: 10px; - justify-content: center; -} - -/* 按钮样式调整 */ -.el-button { - backdrop-filter: blur(5px); - transition: all 0.3s; -} - -/* 冲突内容样式 */ -.conflict-list { - display: flex; - flex-direction: column; - gap: 15px; -} - -.conflict-item { - background: linear-gradient(135deg, rgba(245, 108, 108, 0.1), rgba(245, 108, 108, 0.05)); - border: 1px solid rgba(245, 108, 108, 0.3); - border-radius: 8px; - padding: 14px; - backdrop-filter: blur(5px); - box-shadow: 0 4px 10px rgba(245, 108, 108, 0.15); - transition: all 0.3s; -} - -.conflict-item:hover { - transform: translateY(-2px); - box-shadow: 0 6px 15px rgba(245, 108, 108, 0.2); -} - -.conflict-header { - display: flex; - align-items: center; - gap: 8px; - margin-bottom: 10px; -} - -.conflict-title { - flex: 1; - font-size: 13px; - color: #333; - font-weight: 700; -} - -.conflict-details { - background: rgba(255, 255, 255, 0.8); - border-radius: 6px; - padding: 10px; - margin-bottom: 10px; - border: 1px solid rgba(255, 255, 255, 0.4); - backdrop-filter: blur(5px); - box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); -} - -.detail-item { - display: flex; - margin-bottom: 5px; - font-size: 12px; -} - -.detail-item:last-child { - margin-bottom: 0; -} - -.detail-item .label { - color: #666; - min-width: 70px; - font-weight: 500; -} - -.detail-item .value { - color: #333; - flex: 1; - font-weight: 600; -} - -.conflict-actions { - display: flex; - justify-content: flex-end; - gap: 15px; -} - -.no-conflict { - text-align: center; - padding: 40px 20px; - color: #666; -} - -.no-conflict p { - margin: 10px 0 15px; -} - -/* 平台内容样式 */ -.platform-list { - display: flex; - flex-direction: column; - gap: 10px; -} - -.platform-item { - display: flex; - align-items: center; - padding: 12px; - border-radius: 6px; - background: rgba(255, 255, 255, 0.9); - border: 1px solid rgba(0, 138, 255, 0.3); - transition: all 0.3s; - backdrop-filter: blur(5px); - box-shadow: 0 2px 6px rgba(0, 138, 255, 0.1); -} - -.platform-item:hover { - background: rgba(0, 138, 255, 0.1); - border-color: rgba(0, 138, 255, 0.4); - transform: translateY(-2px); - box-shadow: 0 4px 12px rgba(0, 138, 255, 0.2); -} - -.platform-icon { - width: 36px; - height: 36px; - display: flex; - align-items: center; - justify-content: center; - font-size: 22px; - margin-right: 12px; - border-radius: 6px; - background: rgba(255, 255, 255, 0.8); - backdrop-filter: blur(5px); - box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); -} - -.platform-info { - flex: 1; -} - -.platform-name { - font-size: 13px; - color: #333; - margin-bottom: 3px; - font-weight: 600; -} - -.platform-type { - font-size: 11px; - color: #666; -} - -.platform-status { - margin-left: 10px; -} - -.status-dot { - display: inline-block; - width: 10px; - height: 10px; - border-radius: 50%; - box-shadow: 0 0 6px currentColor; -} - -.status-dot.ready { - background: #52c41a; - box-shadow: 0 0 8px rgba(82, 196, 26, 0.8); -} -.status-dot.flying { - background: #008aff; - animation: pulse 2s infinite; - box-shadow: 0 0 10px rgba(0, 138, 255, 0.8); -} -.status-dot.scouting { - background: #fa8c16; - animation: pulse 1.5s infinite; - box-shadow: 0 0 10px rgba(250, 140, 22, 0.8); -} -.status-dot.sailing { - background: #008aff; - box-shadow: 0 0 8px rgba(0, 138, 255, 0.8); -} -.status-dot.patrol { - background: #52c41a; - animation: pulse 2s infinite; - box-shadow: 0 0 10px rgba(82, 196, 26, 0.8); -} -.status-dot.hidden { - background: #333; - box-shadow: 0 0 6px rgba(51, 51, 51, 0.8); -} -.status-dot.alert { - background: #f5222d; - animation: pulse 1s infinite; - box-shadow: 0 0 10px rgba(245, 34, 45, 0.8); -} -/* 二级菜单样式 */ -.submenu-item { - position: relative; -} - -.submenu-dropdown { - position: absolute; - top: 0; - right: 0; - width: 100%; - height: 100%; -} - -.submenu-trigger { - width: 100%; - height: 100%; - position: absolute; - top: 0; - left: 0; -} - -.submenu { - margin-left: 5px; - margin-bottom: 0; - border: none; - border-radius: 6px; - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1); - backdrop-filter: blur(15px); - background: rgba(255, 255, 255, 0.85); - border: 1px solid rgba(0, 138, 255, 0.2); - padding: 0; - min-width: auto; - width: fit-content; -} - -.submenu .el-dropdown-menu__item { - padding: 8px 16px; - font-size: 14px; - color: #333; - transition: all 0.2s ease; - margin: 0; -} - -.submenu .el-dropdown-menu__item:hover { - background: rgba(0, 138, 255, 0.1); - color: #008aff; -} - -.submenu .el-dropdown-menu__item:not(:last-child) { - border-bottom: 1px solid rgba(0, 138, 255, 0.1); -} - -.submenu .el-dropdown-menu__item:last-child { - border-bottom: none; -} - -/* 文件下拉菜单样式 */ -.file-dropdown { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; -} - -.dropdown-trigger { - width: 100%; - height: 100%; - position: absolute; - top: 0; - left: 0; - cursor: pointer; -} - -.file-dropdown-menu { - margin-top: 5px; - margin-bottom: 0; - border: none; - border-radius: 6px; - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1); - backdrop-filter: blur(15px); - background: rgba(255, 255, 255, 0.85); - border: 1px solid rgba(0, 138, 255, 0.2); - padding: 0; - min-width: auto; - width: fit-content; -} - -.file-dropdown-menu .el-dropdown-menu__item { - padding: 8px 16px; - font-size: 14px; - color: #333; - transition: all 0.2s ease; - margin: 0; -} - -.file-dropdown-menu .el-dropdown-menu__item:hover { - background: rgba(0, 138, 255, 0.1); - color: #008aff; -} - -.file-dropdown-menu .el-dropdown-menu__item:not(:last-child) { - border-bottom: 1px solid rgba(0, 138, 255, 0.1); -} - -.file-dropdown-menu .el-dropdown-menu__item:last-child { - border-bottom: none; -} - -/* 顶部导航菜单调整，为下拉菜单留出空间 */ -.top-nav-item { - position: relative; -} - -.status-dot.operating { - background: #008aff; - animation: pulse 2s infinite; - box-shadow: 0 0 10px rgba(0, 138, 255, 0.8); -} - -/* 蓝色主题标签页 */ -.blue-tabs >>> .el-tabs__item { - color: #666; - transition: all 0.3s; -} - -.blue-tabs >>> .el-tabs__item:hover { - color: #008aff; -} - -.blue-tabs >>> .el-tabs__item.is-active { - color: #008aff; font-weight: 600; -} - -.blue-tabs >>> .el-tabs__active-bar { - background-color: #008aff; - box-shadow: 0 0 6px rgba(0, 138, 255, 0.5); -} - -.blue-tabs >>> .el-tabs__nav-wrap::after { - background-color: rgba(0, 138, 255, 0.3); -} - -/* 底部时间轴（最初版本的样式）- 蓝色主题 */ -.floating-timeline { - position: absolute; - bottom: 20px; - left: 50%; - transform: translateX(-50%) translateY(100%); - width: 80%; - border-radius: 12px; - z-index: 95; - padding: 20px; - color: #333; - transition: all 0.3s ease; - opacity: 0; - pointer-events: none; - backdrop-filter: blur(15px); - background: rgba(255, 255, 255, 0.95); - box-shadow: 0 8px 32px rgba(0, 138, 255, 0.25); - border: 1px solid rgba(0, 138, 255, 0.3); -} - -.floating-timeline.show { - transform: translateX(-50%) translateY(0); - opacity: 1; - pointer-events: auto; -} - -.popup-hide-btn { - position: absolute; - top: -28px; - left: 50%; - transform: translateX(-50%); - width: 56px; - height: 28px; - background: rgba(255, 255, 255, 0.3); - backdrop-filter: blur(10px); - border: 1px solid rgba(0, 138, 255, 0.4); - border-bottom: none; - border-radius: 12px 12px 0 0; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; color: #008aff; - font-size: 18px; - transition: all 0.3s; - z-index: 10; -} - -.popup-hide-btn:hover { - background: rgba(0, 138, 255, 0.2); - color: #0066cc; - height: 32px; - top: -32px; -} - -.timeline-controls { - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 10px; -} - -.current-time { - display: flex; - align-items: center; - gap: 8px; - font-family: monospace; - font-size: 14px; - font-weight: 500; - padding: 4px 12px; - border-radius: 4px; -} - -.timeline-slider { - flex: 1; - margin: 0 20px; -} - -.compact-slider { - width: 100%; -} - -.blue-slider >>> .el-slider__bar { - background-color: rgba(0, 138, 255, 0.8); -} - -.blue-slider >>> .el-slider__button { - border-color: rgba(0, 138, 255, 0.8); - background-color: rgba(0, 138, 255, 0.8); -} - -.timeline-marks { - display: flex; - justify-content: space-between; - font-size: 11px; - color: #666; - margin-top: 5px; -} - -.mark.current { - font-weight: bold; + min-width: 24px; + text-align: center; } .system-status { @@ -2416,4 +1170,4 @@ background: url('~@/assets/map-background.png'); .ml-3 { margin-left: 10px; } - + \ No newline at end of file