From 89380e6260a75d1d3b94de687ebcc2f50d50659d Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Tue, 03 Feb 2026 15:44:33 +0800
Subject: [PATCH] feat:环境变量配置调整

---
 applications/drone-command/src/styles/common/cockpit.scss | 1247 +++++++++++++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 1,085 insertions(+), 162 deletions(-)

diff --git a/applications/drone-command/src/styles/common/cockpit.scss b/applications/drone-command/src/styles/common/cockpit.scss
index e8c8651..be0e93d 100644
--- a/applications/drone-command/src/styles/common/cockpit.scss
+++ b/applications/drone-command/src/styles/common/cockpit.scss
@@ -1,5 +1,226 @@
+/* 下拉菜单整体样式 */
+.command-custom-dropdown {
+    background: #1A1A2A !important;
+    border-radius: 8px;
+    border: none !important;
+
+    .el-popper__arrow::before {
+        background: #1A1A2A !important;
+        border: 1px solid #1A1A2A !important;
+    }
+
+    /* 菜单项样式 */
+    .el-dropdown-menu {
+        background: transparent !important;
+
+        .el-dropdown-menu__item {
+            color: #fff !important;
+            /* 文字颜色 */
+
+            a {
+                color: #fff !important;
+                /* 文字颜色 */
+            }
+
+            &:hover {
+                background: none !important;
+            }
+
+            &.is-disabled {
+                color: #8f9bb3 !important;
+            }
+        }
+
+        .el-dropdown-menu__item--divided {
+            display: none;
+        }
+    }
+}
+
+.command-radio-group {
+    height: 40px;
+}
+
+.command-tree {
+    background: transparent;
+    color: #c3c3dd;
+    font-size: 12px;
+
+    .el-tree-node {
+        line-height: 30px !important;
+
+        .el-tree-node__content {
+            padding-left: 0 !important;
+            display: flex;
+            align-items: center;
+            height: 40px !important;
+            line-height: 40px !important;
+            border-bottom: 1px solid rgba(70, 70, 100, 0.5);
+            box-sizing: border-box;
+        }
+
+        .el-tree-node__children {
+            .el-tree-node__content {
+                border: none;
+            }
+        }
+
+        &:focus {
+            .el-tree-node__content {
+                background: transparent !important;
+            }
+        }
+    }
+
+    .el-tree-node__label {
+        color: #c3c3dd;
+    }
+
+    .el-checkbox {
+        order: 1;
+    }
+
+    .el-tree-node__label {
+        order: 2;
+    }
+
+    .el-tree-node__content:hover,
+    .el-tree-node__content:focus {
+        background: transparent !important;
+    }
+
+    .el-tree-node.is-current>.el-tree-node__content {
+        background: transparent !important;
+        color: #ffffff;
+    }
+
+    .el-tree-node.is-current>.el-tree-node__content .el-tree-node__label {
+        color: #ffffff;
+    }
+
+    .el-checkbox__input {
+        .el-checkbox__inner {
+            width: 16px;
+            height: 16px;
+            background: transparent !important;
+            border-radius: 2px 2px 2px 2px;
+            border: 2px solid #A1A3D4 !important;
+            box-shadow: none;
+            box-sizing: border-box;
+        }
+
+        &.is-checked {
+            .el-checkbox__inner {
+                border: none !important;
+                background: url("@/assets/images/common/checkbox.png") no-repeat center / 100% 100% !important;
+
+                &::after {
+                    content: none !important;
+                }
+            }
+        }
+    }
+}
+
+.map-layer-tree {
+    .el-tree-node__expand-icon:not(.is-leaf)~.el-checkbox {
+        display: none !important;
+    }
+
+    .el-tree-node__expand-icon {
+        order: 3;
+        margin-left: auto;
+    }
+
+    .el-tree-node__expand-icon.is-leaf {
+        visibility: hidden;
+    }
+}
+
+.command-cascader {
+    height: 40px;
+
+    .el-input {
+        height: 40px;
+    }
+
+    .el-input__wrapper {
+        --el-input-text-color: #161B2C !important;
+    }
+}
+
+.command-cascader-popper.el-cascader__dropdown {
+    border: none;
+    background: #2E2E48 !important;
+
+    .el-cascader-panel {
+
+        .el-cascader-menu {
+            color: #fff;
+
+            .el-cascader-node:hover,
+            .el-cascader-node:focus {
+                background: transparent !important;
+            }
+
+            .el-cascader-node.is-selectable.in-active-path {
+                color: #fff;
+            }
+        }
+
+    }
+
+    .el-popper__arrow::before {
+        background: #2E2E48 !important;
+        border: 1px solid #2E2E48 !important;
+    }
+}
+
+.command-cascader-popper,
+.command-radio-group {
+
+    .el-radio {
+        .el-radio__input {
+            width: 16px;
+            height: 16px;
+            border: none;
+
+            .el-radio__inner {
+                width: 16px;
+                height: 16px;
+                border: 2px solid #A1A3D4;
+                border-radius: 50%;
+                background: transparent !important;
+                box-sizing: border-box;
+            }
+        }
+
+        .el-radio__label {
+            color: #FFFFFF;
+        }
+
+        &.is-checked {
+            .el-radio__inner {
+                background: #023AFF !important;
+                border: none;
+
+                &::after {
+                    width: 8px;
+                    height: 8px;
+                }
+            }
+
+            .el-radio__label {
+                color: #FFFFFF;
+            }
+        }
+    }
+}
+
 // 数据驾驶舱专属
-.ztzf-data-cockpit-search-input {
+.command-input {
+    height: 40px;
+
     .el-input__wrapper {
         padding: 0 8px !important;
         background: #161B2C;
@@ -22,7 +243,12 @@
     }
 }
 
-.ztzf-data-cockpit-date-picker {
+.command-input.el-textarea {
+    height: auto;
+}
+
+.command-date-picker {
+    height: 40px !important;
     box-shadow: none !important;
     background: #161B2C;
     border: none;
@@ -51,11 +277,10 @@
     }
 }
 
-.ztzf-data-cockpit-date-picker-popper {
-    background: #161B2C !important;
-    border: 1px solid !important;
+.command-date-picker-popper {
+    background: #2E2E48 !important;
+    border: none !important;
     border-radius: 0px 0px 8px 8px;
-    border-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(115, 192, 255, 1)) 1 1 !important;
 
     .el-date-picker__prev-btn,
     .el-date-picker__next-btn {
@@ -71,18 +296,60 @@
     .el-picker-panel {
         .el-picker-panel__body-wrapper {
             .el-picker-panel__body {
-                background: #161B2C !important;
+                background: #2E2E48 !important;
                 color: #fff !important;
+
+                .el-date-range-picker__time-header {
+                    .el-time-panel {
+                        background: #1A1A2A !important;
+                        border-radius: 0px 0px 8px 8px;
+                        border: none !important;
+
+                        // 将 time-picker-popper 的样式移到这里
+                        .el-time-panel__header {
+                            background: #161B2C !important;
+                            color: #ffffff !important;
+                            border-bottom: 1px solid rgba(71, 157, 255, 0.3) !important;
+                        }
+
+                        .el-time-panel__content {
+                            .el-time-spinner__item {
+                                &:hover {
+                                    background: transparent !important;
+                                }
+
+                                &.active {
+                                    color: #479dff !important;
+                                    font-weight: bold;
+                                }
+                            }
+                        }
+
+                        .el-time-panel__footer {
+                            .el-time-panel__btn {
+                                color: #fff;
+                            }
+
+                            .el-time-panel__btn:first-child {
+                                color: #86909C;
+                            }
+                        }
+                    }
+
+                    .el-input__wrapper {
+                        box-shadow: none;
+                        background: #2E2E48 !important;
+                    }
+                }
 
                 .el-date-picker__time-header {
                     border: none;
 
                     .el-date-picker__editor-wrap {
                         .el-time-panel {
-                            background: #161B2C !important;
+                            background: #1A1A2A !important;
                             border-radius: 0px 0px 8px 8px;
-                            border: 1px solid !important;
-                            border-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(115, 192, 255, 1)) 1 1 !important;
+                            border: none !important;
 
                             // 将 time-picker-popper 的样式移到这里
                             .el-time-panel__header {
@@ -93,10 +360,8 @@
 
                             .el-time-panel__content {
                                 .el-time-spinner__item {
-                                    color: #e6e6e6 !important;
-
                                     &:hover {
-                                        background: rgba(71, 157, 255, 0.3) !important;
+                                        background: transparent !important;
                                     }
 
                                     &.active {
@@ -107,25 +372,20 @@
                             }
 
                             .el-time-panel__footer {
-                                background: #012350 !important;
-                                border-top: 1px solid rgba(71, 157, 255, 0.3) !important;
-
-                                .el-button {
-                                    color: #fff !important;
-
-                                    &:hover {
-                                        color: #479dff !important;
-                                    }
+                                .el-time-panel__btn {
+                                    color: #fff;
                                 }
 
-                                .el-time-panel__btn.cancel {
-                                    color: #fff !important;
-
-                                    &:hover {
-                                        color: #fff !important;
-                                    }
+                                .el-time-panel__btn:first-child {
+                                    color: #86909C;
                                 }
                             }
+                        }
+
+                        .el-input__wrapper {
+                            height: 28px;
+                            background: #1A1A2A;
+                            box-shadow: none;
                         }
                     }
                 }
@@ -159,13 +419,13 @@
                         }
 
                         td.disabled div {
-                            background-color: #00193b !important;
+                            background-color: #1A1A2A !important;
                             color: #505050 !important;
                             cursor: not-allowed;
                         }
 
                         // td:hover,
-                        // td.current:not(.disabled) {
+                        // td.current:not(.disabled{
                         //     background: rgba(60, 121, 202) !important;
                         //     color: white !important;
                         // }
@@ -173,14 +433,20 @@
                         td.start-date span,
                         td.start-date span,
                         td.end-date span {
-                            background-color: #012350 !important;
+                            background-color: #161B2C !important;
+                        }
+
+                        td.current:not(.disabled) {
+                            .el-date-table-cell__text {
+                                background-color: #284FE3;
+                            }
                         }
 
                         td.in-range div,
                         td.in-range div:hover,
                         &.is-week-mode .el-date-table__row.current div,
                         &.is-week-mode .el-date-table__row:hover div {
-                            background-color: rgba(60, 121, 202) !important;
+                            background-color: #4160D5 !important;
                         }
                     }
                 }
@@ -190,14 +456,14 @@
 
     .el-popper__arrow {
         &::before {
-            background: #161B2C !important;
-            border: 1px solid #161B2C !important;
+            background: #2E2E48 !important;
+            border: 1px solid #2E2E48 !important;
             box-sizing: border-box;
         }
     }
 
     .el-picker-panel__sidebar {
-        background: #012350;
+        background: #161B2C;
         color: #fff;
 
         .el-picker-panel__shortcut {
@@ -207,7 +473,7 @@
 
     .el-picker-panel__body {
         .el-input.is-disabled .el-input__wrapper {
-            background: #012350;
+            background: #161B2C;
             box-shadow: 0 0 0 0.1rem#409eff;
             color: #fff;
 
@@ -218,11 +484,11 @@
 
         .el-button.is-disabled,
         .el-button.is-disabled:hover {
-            background: #012350;
+            background: #161B2C;
         }
 
         .el-input__wrapper {
-            background: #012350;
+            background: #161B2C;
             box-shadow: 0 0 0 0.1rem#409eff;
             color: #fff;
 
@@ -233,35 +499,71 @@
     }
 
     .el-picker-panel__footer {
-        background: #012350;
+        background: #2E2E48;
         color: #fff;
         border-top: none;
 
         .el-button--small {
-            box-shadow: 0 0 0 0.1rem#409eff;
-            background-color: #012350;
             color: #fff;
-            border: none;
+            border: 1px solid rgba(255, 255, 255, 0.3);
+            box-shadow: none;
+            background-color: transparent !important;
 
             &:hover {
-                background-color: #012350;
                 color: #fff;
-                border-color: #409eff;
+                border-color: none;
+                background-color: transparent !important;
             }
+        }
+
+        .el-button--small:last-child {
+            border: none;
+            background-color: #284FE3 !important;
+
+            &:hover {
+                border: none;
+                background-color: #284FE3 !important;
+            }
+        }
+    }
+
+    .el-time-panel__content {
+        .el-time-spinner__item {
+            &.is-active {
+                color: #fff;
+            }
+
+            &:hover {
+                background: transparent !important;
+            }
+        }
+    }
+
+    .el-time-panel__footer {
+        .el-time-panel__btn {
+            color: #fff;
+        }
+
+        .el-time-panel__btn:first-child {
+            color: #86909C;
         }
     }
 }
 
-.ztzf-data-cockpit-select {
+.command-select {
+    height: 40px;
+
     .el-select__input {
-        color: #8ac3fd !important;
+        color: #ffffff !important;
     }
 
     .el-select__wrapper {
+        padding: 0 8px;
         background: #2E2E48;
         box-shadow: none !important;
         border: none;
         width: 100%;
+        height: 40px;
     }
 
     .el-select__placeholder {
@@ -274,6 +576,10 @@
         }
     }
 
+    .el-select__wrapper.is-disabled .el-select__selected-item {
+        color: #a8abb2;
+    }
+
     .el-select {
         --el-select-border-color-hover: rgb(0, 162, 255) !important;
     }
@@ -283,15 +589,25 @@
     }
 
     .el-select .el-input__wrapper {
-        background-color: #012350 !important;
+        background-color: #161B2C !important;
     }
 
     .el-input__wrapper {
-        --el-input-text-color: #012350 !important;
+        --el-input-text-color: #161B2C !important;
+    }
+
+    .el-select__selection.is-near {
+        margin-left: 0;
+
+        .el-tag {
+            color: #ffffff;
+            background: #161B2C;
+        }
     }
 }
 
-.ztzf-data-cockpit-select-popper.el-select__popper {
+.command-select-popper.el-select__popper {
+    min-height: 186px;
     border: none;
     background: #2E2E48 !important;
 
@@ -338,9 +654,19 @@
 }
 
 // 树形选择
-.ztzf-data-cockpit-tree-select-popper {
+.command-tree-select-popper {
     background: #2E2E48 !important;
     border: none !important;
+
+    .el-scrollbar {
+
+        .el-scrollbar__wrap {
+
+            .el-select-dropdown__list {
+                min-height: 186px;
+            }
+        }
+    }
 
     .el-popper__arrow::before {
         background: #2E2E48 !important;
@@ -361,6 +687,11 @@
 
         .el-tree-node.is-current>.el-tree-node__content {
             color: #479dff !important;
+        }
+
+        .el-tree-node__content {
+            height: 34px;
+            line-height: 34px;
         }
     }
 
@@ -416,7 +747,7 @@
     }
 }
 
-.ztzf-data-cockpit-dialog {
+.command-dialog {
     padding: 20px;
     display: flex;
     flex-direction: column;
@@ -436,7 +767,7 @@
             font-weight: bold;
             font-size: 18px;
             color: #FFFFFF;
-            line-height: 22px;
+            line-height: 40px;
             text-align: left;
             font-style: normal;
             text-transform: none;
@@ -457,7 +788,9 @@
     }
 }
 
-.el-form.ztzf-dialog-history-search {
+.el-form.command-dialog-history-search {
+    margin-bottom: 20px;
+
     .el-form-item {
         margin-left: 20px;
     }
@@ -471,7 +804,7 @@
         text-transform: none;
     }
 
-    .ztzf-data-cockpit-search-input {
+    .command-input {
         .el-input__wrapper {
             background: #2E2E48;
         }
@@ -483,11 +816,11 @@
         }
     }
 
-    .ztzf-data-cockpit-date-picker {
+    .command-date-picker {
         background: #2E2E48;
     }
 
-    .ztzf-data-cockpit-date-picker-popper {
+    .command-date-picker-popper {
         background: #2E2E48 !important;
 
         .el-picker-panel {
@@ -521,20 +854,6 @@
         }
     }
 
-    .history-search-actions {
-        .el-button {
-            width: 96px;
-            background: transparent !important;
-            border-radius: 4px 4px 4px 4px;
-            border: 1px solid rgba(255, 255, 255, 0.3);
-
-            .el-icon {
-                font-size: 16px;
-                color: #fff;
-            }
-        }
-    }
-
     .el-input {
         width: 160px;
     }
@@ -548,9 +867,17 @@
             width: 160px;
         }
     }
+
+    .history-search-actions {
+        .search-btn {
+            background: #284FE3 !important;
+        }
+    }
 }
 
-.ztzf-page-history-search {
+.command-page-history-search {
+    margin-bottom: 20px;
+
     .el-form-item__label {
         font-family: Source Han Sans CN, Source Han Sans CN;
         font-weight: 500;
@@ -560,13 +887,13 @@
         text-transform: none;
     }
 
-    .ztzf-data-cockpit-select {
+    .command-select {
         .el-select__wrapper {
             background: #1C1C31;
         }
     }
 
-    .ztzf-data-cockpit-search-input {
+    .command-input {
         .el-input__wrapper {
             background: #1C1C31;
         }
@@ -578,11 +905,11 @@
         }
     }
 
-    .ztzf-data-cockpit-date-picker {
+    .command-date-picker {
         background: #1C1C31;
     }
 
-    .ztzf-data-cockpit-date-picker-popper {
+    .command-date-picker-popper {
         background: #1C1C31 !important;
 
         .el-picker-panel {
@@ -636,8 +963,8 @@
     }
 }
 
-.ztzf-dialog-history-search,
-.ztzf-page-history-search {
+.command-dialog-history-search,
+.command-page-history-search {
     display: flex;
 
     .el-form-item {
@@ -684,115 +1011,178 @@
     .history-search-actions {
         .el-button {
             margin-left: 20px;
+            width: 96px;
+            background: transparent !important;
+            border-radius: 4px 4px 4px 4px;
+            border: 1px solid rgba(255, 255, 255, 0.3);
+
+            .el-icon {
+                font-size: 16px;
+                color: #fff;
+            }
 
             &:first-child {
                 margin-left: 0;
             }
         }
+
+        .search-btn {
+            background: #1C1C31 !important;
+            border: 1px solid rgba(227, 227, 236, 0.3) !important;
+        }
     }
 }
 
-.ztzf-table-toolbar {
-    margin-top: 30px;
+.command-table-toolbar {
+    margin-bottom: 20px;
 
     .el-button {
         min-width: 88px;
+        border: none;
+    }
+
+    .el-button.is-disabled,
+    .el-button.is-disabled:hover {
+        background: #1A2652;
+        border: none;
     }
 }
 
-.ztzf-table-container {
-    margin-top: 20px;
-
+.command-table-container {
     height: 0;
     flex: 1;
     display: flex;
     flex-direction: column;
 
-    .ztzf-table-content {
+    .command-table-content {
         height: 0;
         flex: 1;
         display: flex;
         flex-direction: column;
+    }
 
-        .ztzf-data-cockpit-table {
-            height: 0;
-            flex: 1;
-            background: transparent !important;
+    .command-table-content-bg {
+        background: #1A1A2A;
+    }
+}
 
-            .el-table--border .el-table__inner-wrapper:after,
-            .el-table--border:after,
-            .el-table--border:before,
-            .el-table__inner-wrapper:before {
-                height: 0;
+.command-table {
+    height: 0;
+    flex: 1;
+    background: transparent !important;
+
+    .el-table--border .el-table__inner-wrapper:after,
+    .el-table--border:after,
+    .el-table--border:before,
+    .el-table__inner-wrapper:before {
+        height: 0;
+    }
+
+    tr {
+        background: transparent !important;
+    }
+
+    th.el-table__cell {
+        border-bottom: 1px solid #323241 !important;
+
+        .cell {
+            display: flex;
+            align-items: center;
+            padding: 0;
+            padding-left: 16px;
+            font-family: Source Han Sans CN, Source Han Sans CN;
+            font-weight: 500;
+            font-size: 14px;
+            color: #FFFFFF;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+
+    td.el-table__cell {
+        padding: 9px 0;
+        height: 56px;
+        border-bottom: 1px solid #323241 !important;
+
+        .cell {
+            padding: 0;
+            padding-left: 16px;
+            font-family: Source Han Sans CN, Source Han Sans CN;
+            font-weight: 400;
+            font-size: 14px;
+            color: #D2D2E7;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+
+    td.operation-btns .cell {
+        display: flex;
+        flex-wrap: nowrap;
+        gap: 12px;
+        /* 按钮间距(推荐) */
+        white-space: nowrap;
+        /* 双保险 */
+
+        a {
+            min-width: 28px;
+            color: #6A89FF;
+
+            &:last-child {
+                margin-right: 0;
             }
+        }
+    }
 
-            tr {
+    th.el-table__cell:not(.fixed-column),
+    td.el-table__cell:not(.fixed-column) {
+        background: transparent !important;
+    }
+
+    .el-table__empty-text {
+        color: #fff;
+    }
+
+    .el-checkbox {
+        width: 16px;
+        height: 16px;
+
+        .el-checkbox__input {
+            width: 16px;
+            height: 16px;
+
+            .el-checkbox__inner {
+                width: 16px;
+                height: 16px;
+
                 background: transparent !important;
+                border-radius: 2px 2px 2px 2px;
+                border: 2px solid #A1A3D4;
+                box-shadow: none;
+                box-sizing: border-box;
             }
+        }
 
-            th.el-table__cell {
-                height: 40px;
-                border-bottom: 1px solid #323241;
-                background: transparent !important;
+        &.is-checked {
+            .el-checkbox__input {
+                .el-checkbox__inner {
+                    border: none;
+                    background: url("@/assets/images/common/checkbox.png") no-repeat center / 100% 100% !important;
 
-                .cell {
-                    padding: 0;
-                    padding-left: 16px;
-                    font-family: Source Han Sans CN, Source Han Sans CN;
-                    font-weight: 500;
-                    font-size: 14px;
-                    color: #FFFFFF;
-                    line-height: 22px;
-                    font-style: normal;
-                    text-transform: none;
-                }
-            }
-
-            td.el-table__cell {
-                padding: 9px 0;
-                height: 56px;
-                border-bottom: 1px solid #323241;
-                background: transparent !important;
-
-                .cell {
-                    padding: 0;
-                    padding-left: 16px;
-                    font-family: Source Han Sans CN, Source Han Sans CN;
-                    font-weight: 400;
-                    font-size: 14px;
-                    color: #D2D2E7;
-                    line-height: 18px;
-                    font-style: normal;
-                    text-transform: none;
-                }
-            }
-
-            td.operation-btns .cell {
-                display: flex;
-                flex-wrap: nowrap;
-                gap: 12px;
-                /* 按钮间距(推荐) */
-                white-space: nowrap;
-                /* 双保险 */
-
-                a {
-                    min-width: 28px;
-                    color: #6A89FF;
-
-                    &:last-child {
-                        margin-right: 0;
+                    &::after {
+                        content: none;
                     }
                 }
             }
         }
     }
 
-    .ztzf-table-content-bg {
-        background: #1A1A2A;
+    .fixed-column {
+        background-color: #1A1A2A !important;
     }
 }
 
-.ztzf-table-pagination {
+.command-table-pagination {
     padding-top: 30px;
     padding-bottom: 10px;
     display: flex;
@@ -861,24 +1251,39 @@
     }
 }
 
-.ztzf-page-view-dialog {
+.command-page-view-dialog {
+    margin: 0;
+    padding: 20px;
     display: flex;
     flex-direction: column;
     width: 770px;
     background: #1A1A2A;
     border-radius: 6px 6px 6px 6px;
     border: 1px solid #2E2E46;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
 
     .el-dialog__header {
+        padding-bottom: 20px;
+        position: relative;
+
         span {
             font-family: Source Han Sans CN, Source Han Sans CN;
             font-weight: bold;
             font-size: 18px;
             color: #FFFFFF;
-            line-height: 22px;
             text-align: left;
             font-style: normal;
             text-transform: none;
+        }
+
+        &>button {
+            width: auto;
+            height: auto;
+            display: flex;
+            align-items: center;
         }
 
         .el-icon {
@@ -894,10 +1299,10 @@
             padding: 0 10px;
 
             .detail-title {
-                margin-bottom: 30px;
+                margin-bottom: 20px;
                 font-family: Source Han Sans CN, Source Han Sans CN;
                 font-weight: 500;
-                font-size: 18px;
+                font-size: 16px;
                 color: #FFFFFF;
                 text-align: left;
                 font-style: normal;
@@ -911,12 +1316,11 @@
                     align-items: center;
 
                     .label {
-                        width: 88px;
+                        min-width: 88px;
                         font-family: Source Han Sans CN, Source Han Sans CN;
                         font-weight: 500;
                         font-size: 14px;
                         color: #D4D5D7;
-                        line-height: 22px;
                         text-align: right;
                         font-style: normal;
                         text-transform: none;
@@ -928,7 +1332,6 @@
                         font-weight: 400;
                         font-size: 14px;
                         color: #9E9EBA;
-                        line-height: 22px;
                         text-align: left;
                         font-style: normal;
                         text-transform: none;
@@ -937,16 +1340,42 @@
             }
 
 
-            .ztzf-table-container {
+            .command-table-container {
                 height: 360px;
 
-                .ztzf-table-pagination {
+                .command-table-pagination {
+                    padding-bottom: 20px;
                     justify-content: center;
                 }
             }
         }
 
         .dialog-form {
+            h3 {
+                margin: 0;
+                margin-bottom: 20px;
+            }
+
+            .detail-title {
+                line-height: 40px;
+                font-family: Source Han Sans CN, Source Han Sans CN;
+                font-weight: 500;
+                font-size: 16px;
+                color: #FFFFFF;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+
+            .el-row {
+                .el-col {
+                    margin-bottom: 0;
+
+                    .el-form-item {
+                        margin-bottom: 20px;
+                    }
+                }
+            }
 
             .el-form-item {
                 display: flex;
@@ -959,7 +1388,7 @@
                     font-weight: 500;
                     font-size: 14px;
                     color: #D4D5D7;
-                    line-height: 22px;
+                    line-height: 40px;
                     text-align: right;
                     font-style: normal;
                     text-transform: none;
@@ -968,10 +1397,32 @@
                 .el-form-item__content {
                     display: flex;
                     align-items: center;
-                
-                    .el-input {
+                    line-height: 40px;
+
+                    .el-input,
+                    .el-input-number {
                         width: 0;
                         flex: 1;
+
+                        .el-input__inner {
+                            text-align: left;
+
+                            &::placeholder {
+                                text-align: left;
+                            }
+                        }
+                    }
+
+                    .el-cascader {
+                        width: 0;
+                        flex: 1;
+                        display: flex;
+                        align-items: center;
+                        border: none;
+
+                        .el-input__wrapper {
+                            box-shadow: none !important;
+                        }
                     }
 
                     .el-textarea {
@@ -985,27 +1436,164 @@
                     }
 
                     .el-button {
+                        height: 40px;
                         color: #fff;
                         background: #2E2E48 !important;
                         border: none;
                         box-shadow: none;
+                    }
+
+                    .command-date-picker {
+                        background: #2E2E48;
+                    }
+
+                    .command-date-picker-popper {
+                        background: #2E2E48 !important;
+
+                        .el-picker-panel {
+                            .el-picker-panel__body-wrapper {
+                                .el-picker-panel__body {
+                                    background: #2E2E48 !important;
+
+                                    .el-date-picker__time-header {
+
+                                        .el-date-picker__editor-wrap {
+                                            .el-time-panel {
+                                                background: #2E2E48 !important;
+
+                                                // 将 time-picker-popper 的样式移到这里
+                                                .el-time-panel__header {
+                                                    background: #2E2E48 !important;
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+
+                        .el-popper__arrow {
+                            &::before {
+                                background: #2E2E48 !important;
+                                border: 1px solid #2E2E48 !important;
+                                box-sizing: border-box;
+                            }
+                        }
                     }
                 }
 
                 .el-input {
                     .el-input__wrapper {
                         background: #2E2E48 !important;
+                        box-shadow: none;
 
                         .el-input__inner {
                             color: #ffffff;
                         }
                     }
                 }
+
+                .address-btn {
+                    display: flex;
+                    justify-content: flex-start;
+                    padding: 0 8px;
+                    width: 100%;
+                }
+            }
+        }
+
+        .el-tabs {
+            background: transparent;
+            border: none;
+
+            .el-tabs__header {
+                position: relative;
+                background: transparent;
+                border: none;
+
+                &::after {
+                    content: '';
+                    position: absolute;
+                    left: 0;
+                    bottom: 0;
+                    width: 100%;
+                    height: 1px;
+                    background: #333355;
+                }
+
+                .el-tabs__item {
+                    position: relative;
+                    margin-left: 26px;
+
+                    font-family: Source Code Pro, Source Code Pro;
+                    font-weight: 400;
+                    font-size: 14px;
+                    color: #86909C;
+                    text-align: center;
+                    font-style: normal;
+                    text-transform: none;
+                    cursor: pointer;
+
+                    &:first-child {
+                        margin-left: 0;
+                    }
+
+                    &.is-active {
+                        font-weight: normal;
+                        color: #FFFFFF;
+                    }
+
+                    &::after {
+                        content: '';
+                        position: absolute;
+                        left: 0;
+                        bottom: 0;
+                        width: 100%;
+                        height: 0;
+                    }
+
+                    &.is-active::after {
+                        height: 3px;
+                        background: #284FE3;
+                        box-shadow: 0px 3px 2px 0px rgba(15, 89, 255, 0.1), 0px 7px 5px 0px rgba(15, 89, 255, 0.15), 0px 13px 10px 0px rgba(15, 89, 255, 0.18), 0px 22px 18px 0px rgba(15, 89, 255, 0.21), 0px 42px 33px 0px rgba(15, 89, 255, 0.26), 0px 100px 80px 0px rgba(15, 89, 255, 0.36);
+                        border-radius: 5px 5px 0px 0px;
+                        z-index: 9;
+                    }
+                }
+            }
+
+            .el-tabs__content {
+                background: transparent;
+                border: none;
+                height: 430px;
+                overflow-y: auto;
+
+
+                .el-tab-pane {
+                    background: transparent;
+                    border: none;
+
+                    .el-tree {
+                        background: transparent;
+                        border: none;
+                    }
+                }
+            }
+
+            .el-tabs__nav {
+                background: transparent;
+                border: none;
+
+                .el-tabs__item {
+                    background: transparent;
+                    border: none;
+                }
             }
         }
     }
 
     .el-dialog__footer {
+        padding-top: 0;
         display: flex;
         justify-content: center;
 
@@ -1021,7 +1609,7 @@
     }
 }
 
-.ztzf-page-view-message-box {
+.command-page-view-message-box {
     background: #1A1A2A;
     border-radius: 6px;
     border: 1px solid #2E2E46;
@@ -1032,7 +1620,7 @@
             font-weight: bold;
             font-size: 18px;
             color: #FFFFFF;
-            line-height: 22px;
+            line-height: 40px;
             text-align: left;
             font-style: normal;
             text-transform: none;
@@ -1059,13 +1647,348 @@
     }
 }
 
-.ztzf-message-box-confirm {
+.command-message-box-confirm {
     background: #284FE3 !important;
     border-color: #284FE3 !important;
 }
 
-.ztzf-message-box-cancel {
+.command-message-box-cancel {
     background: #2B2B4C !important;
     border-color: #2B2B4C !important;
     color: #FFFFFF !important;
 }
+
+.command-page-map-view-dialog {
+    margin: 0;
+
+    padding: 20px;
+    display: flex;
+    flex-direction: column;
+    width: 80%;
+    height: 812px;
+    background: #1A1A2A;
+    border-radius: 6px 6px 6px 6px;
+    border: 1px solid #2E2E46;
+
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+
+    .el-dialog__header,
+    .el-dialog__footer {
+        margin: 0;
+        padding: 0;
+    }
+
+    .el-dialog__footer {
+        .el-button {
+            margin-top: 30px;
+        }
+    }
+
+    .el-dialog__body {
+        display: flex;
+        flex-direction: column;
+        height: 0;
+        flex: 1;
+
+        .dialog-container {
+            display: flex;
+            height: 0;
+            flex: 1;
+
+            .left-container {
+                width: 0;
+                flex: 1;
+                height: 100%;
+
+                .leftMap {
+                    width: 100%;
+                    height: 100%;
+                }
+            }
+
+            .right-container {
+                display: flex;
+                flex-direction: column;
+                width: 344px;
+                height: 100%;
+
+                .header {
+                    display: flex;
+                    align-items: center;
+                    justify-content: space-between;
+                    padding-left: 16px;
+                    padding-bottom: 20px;
+                    font-family: Source Han Sans CN, Source Han Sans CN;
+                    font-weight: 400;
+                    font-size: 18px;
+                    color: #FFFFFF;
+                    text-align: left;
+                    font-style: normal;
+                    text-transform: none;
+
+                    .el-icon {
+                        cursor: pointer;
+                    }
+                }
+
+                .content {
+                    height: 0;
+                    flex: 1;
+                    padding: 0 16px;
+                    display: flex;
+                    flex-direction: column;
+                    overflow-y: auto;
+
+
+                    .detail-title {
+                        margin-bottom: 20px;
+                        font-family: Source Han Sans CN, Source Han Sans CN;
+                        font-weight: 500;
+                        font-size: 16px;
+                        color: #FFFFFF;
+                        text-align: left;
+                        font-style: normal;
+                        text-transform: none;
+                    }
+
+                    .el-row {
+                        .el-col {
+                            margin-bottom: 20px;
+                            display: flex;
+                            align-items: center;
+
+                            .label {
+                                width: 96px;
+                                font-family: Source Han Sans CN, Source Han Sans CN;
+                                font-weight: 500;
+                                font-size: 14px;
+                                color: #D4D5D7;
+                                text-align: right;
+                                font-style: normal;
+                                text-transform: none;
+                            }
+
+                            .val {
+                                width: 0;
+                                flex: 1;
+                                margin-left: 12px;
+                                font-family: Source Han Sans CN, Source Han Sans CN;
+                                font-weight: 400;
+                                font-size: 14px;
+                                color: #9E9EBA;
+                                text-align: left;
+                                font-style: normal;
+                                text-transform: none;
+                            }
+                        }
+                    }
+
+
+                    .command-table-container {
+                        height: auto;
+                        margin-top: 0;
+                        margin-bottom: 20px;
+
+                        .command-table-pagination {
+                            justify-content: center;
+                        }
+                    }
+                }
+
+                .dialog-form {
+                    padding-left: 16px;
+                    height: 0;
+                    flex: 1;
+                    display: flex;
+                    flex-direction: column;
+
+                    overflow-y: auto;
+
+                    .el-row {
+                        .el-col {
+                            margin-bottom: 0;
+                        }
+                    }
+
+                    .el-form-item {
+                        display: flex;
+                        align-items: center;
+
+                        .el-form-item__label {
+                            display: flex;
+                            align-items: center;
+                            font-family: Source Han Sans CN, Source Han Sans CN;
+                            font-weight: 500;
+                            font-size: 14px;
+                            color: #D4D5D7;
+                            line-height: 40px;
+                            text-align: right;
+                            font-style: normal;
+                            text-transform: none;
+                        }
+
+                        .el-form-item__content {
+                            display: flex;
+                            align-items: center;
+                            line-height: 40px;
+
+                            .el-input,
+                            .el-input-number {
+                                width: 0;
+                                flex: 1;
+
+                                .el-input__inner {
+                                    text-align: left;
+
+                                    &::placeholder {
+                                        text-align: left;
+                                    }
+                                }
+                            }
+
+                            .el-textarea {
+
+                                .el-textarea__inner {
+                                    color: #fff;
+                                    background: #2E2E48 !important;
+                                    border: none;
+                                    box-shadow: none;
+                                }
+                            }
+
+                            .el-button {
+                                color: #fff;
+                                background: #2E2E48 !important;
+                                border: none;
+                                box-shadow: none;
+                            }
+
+                            >div.val {
+                                color: #fff;
+                            }
+
+                            .command-date-picker {
+                                background: #2E2E48;
+                            }
+
+                            .command-date-picker-popper {
+                                background: #2E2E48 !important;
+
+                                .el-picker-panel {
+                                    .el-picker-panel__body-wrapper {
+                                        .el-picker-panel__body {
+                                            background: #2E2E48 !important;
+
+                                            .el-date-picker__time-header {
+
+                                                .el-date-picker__editor-wrap {
+                                                    .el-time-panel {
+                                                        background: #2E2E48 !important;
+
+                                                        // 将 time-picker-popper 的样式移到这里
+                                                        .el-time-panel__header {
+                                                            background: #2E2E48 !important;
+                                                        }
+                                                    }
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+
+                                .el-popper__arrow {
+                                    &::before {
+                                        background: #2E2E48 !important;
+                                        border: 1px solid #2E2E48 !important;
+                                        box-sizing: border-box;
+                                    }
+                                }
+                            }
+                        }
+
+                        .el-input {
+                            .el-input__wrapper {
+                                background: #2E2E48 !important;
+
+                                .el-input__inner {
+                                    color: #ffffff;
+                                }
+                            }
+                        }
+                    }
+
+                    .search-table-container {
+                        display: flex;
+                        flex-direction: column;
+
+                        .search-box {
+                            display: flex;
+                            margin-bottom: 18px;
+
+                            .label {
+                                display: flex;
+                                align-items: center;
+                                justify-content: flex-end;
+
+                                padding-right: 12px;
+                                width: 96px;
+
+                                font-family: Source Han Sans CN, Source Han Sans CN;
+                                font-weight: 500;
+                                font-size: 14px;
+                                color: #D4D5D7;
+                                font-style: normal;
+                                text-transform: none;
+
+                                box-sizing: border-box;
+                            }
+
+                            .el-input {
+                                width: 0;
+                                flex: 1;
+
+                                .el-input__wrapper {
+                                    background: #2E2E48 !important;
+
+                                    .el-input__inner {
+                                        color: #ffffff;
+                                    }
+                                }
+                            }
+                        }
+
+                        .el-form-item {
+                            .el-form-item__content {
+                                width: 100%;
+
+                                .el-table {
+                                    height: auto;
+                                }
+                            }
+                        }
+                    }
+                }
+
+                .footer {
+                    width: 100%;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+
+                    .el-button {
+                        margin-left: 16px;
+                        width: 96px;
+                        height: 36px;
+
+                        &:first-child {
+                            margin-left: 0;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
\ No newline at end of file

--
Gitblit v1.9.3