From 6d960a1fc7d1eda31704343493e83acbc6ea57c0 Mon Sep 17 00:00:00 2001 From: tcy <1193318383@qq.com> Date: Mon, 22 Sep 2025 19:47:06 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E7=AB=99=E7=82=B9=E6=A6=82=E8=A7=88):=20?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=8A=B6=E6=80=81=E5=92=8C=E5=91=8A=E8=AD=A6?= =?UTF-8?q?=E8=87=AA=E5=AE=9A=E4=B9=89=E5=BC=B9=E7=AA=97=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit refactor(样式): 重构弹窗样式并分离状态和告警样式 style: 调整页面间距和布局 --- src/assets/styles/1.html | 16 +++ src/assets/styles/dialog.scss | 117 +++++++++++++++- src/components/TitleComponent/index.vue | 4 +- .../pvSystem/mainSystemDiagram/index.vue | 2 +- .../components/CustomDialogAlarm.vue | 93 +++++++++++++ .../components/CustomDialogStatus.vue | 102 ++++++++++++++ .../siteOverview/components/status.vue | 130 +++--------------- src/views/pvSystem/siteOverview/index.vue | 9 +- 8 files changed, 353 insertions(+), 120 deletions(-) create mode 100644 src/assets/styles/1.html create mode 100644 src/views/pvSystem/siteOverview/components/CustomDialogAlarm.vue create mode 100644 src/views/pvSystem/siteOverview/components/CustomDialogStatus.vue diff --git a/src/assets/styles/1.html b/src/assets/styles/1.html new file mode 100644 index 0000000..880c800 --- /dev/null +++ b/src/assets/styles/1.html @@ -0,0 +1,16 @@ +
+
+ +
+
+ + \ No newline at end of file diff --git a/src/assets/styles/dialog.scss b/src/assets/styles/dialog.scss index 5e92c76..6ed33de 100644 --- a/src/assets/styles/dialog.scss +++ b/src/assets/styles/dialog.scss @@ -1,3 +1,7 @@ +.no-header-dialog { + height: auto; +} + #custom-dialog { padding: 0; top: 0; @@ -11,9 +15,11 @@ .el-dialog__body { padding: 0 !important; + // height: auto !important; + max-height: none !important; } - .alert-content { + .status-alert-content { background: linear-gradient(180deg, rgba(0, 119, 255, 0.23) 0%, rgba(255, 255, 255, 0) 100%); display: flex; align-items: center; @@ -99,15 +105,118 @@ } } - .alert-content .success { + .status-alert-content .success { color: rgba(0, 184, 122, 1) !important; } - .alert-content .orange { + .status-alert-content .orange { color: rgba(255, 153, 0, 1) !important; } - .alert-content .red { + .status-alert-content .red { + color: rgba(227, 39, 39, 1) !important; + } + + .alarm-alert-content { + background: linear-gradient(180deg, rgba(255, 87, 51, 0.23) 0%, rgba(255, 219, 219, 0) 100%); + padding-left: 50px; + padding-right: 50px; + padding-bottom: 50px; + + .top { + display: flex; + gap: 50px; + align-items: center; + padding: 50px 0; + padding-bottom: 20px; + + .info { + display: flex; + flex-direction: column; + gap: 15px; + + .title { + color: rgba(227, 39, 39, 1); + font-size: 28px; + font-weight: bold; + } + + .alarm-id { + color: rgba(0, 30, 59, 1); + font-size: 18px; + font-weight: bold; + } + + .status-box { + display: flex; + gap: 20px; + + .status { + font-weight: bold; + } + + .last-update { + color: rgba(113, 128, 150, 1); + } + } + } + + .info-box { + .list { + display: flex; + gap: 90px; + + .item { + display: flex; + flex-direction: column; + gap: 30px; + + .title { + color: rgba(113, 128, 150, 1); + margin-bottom: 10px; + } + + .text { + color: rgba(0, 30, 59, 1); + font-weight: bold; + } + } + } + } + } + + .progress-box { + .title { + color: rgba(0, 30, 59, 1); + font-weight: bold; + font-size: 20px; + margin-bottom: 24px; + } + } + + .notice-box { + display: flex; + justify-content: space-between; + } + + .item { + display: flex; + flex-direction: column; + gap: 10px; + color: rgba(113, 128, 150, 1); + + .time { + font-size: 12px; + } + } + + .title.active { + color: rgba(247, 89, 10, 1); + font-weight: bold; + } + } + + .alarm-alert-content .red { color: rgba(227, 39, 39, 1) !important; } } \ No newline at end of file diff --git a/src/components/TitleComponent/index.vue b/src/components/TitleComponent/index.vue index 8b44219..4eddf81 100644 --- a/src/components/TitleComponent/index.vue +++ b/src/components/TitleComponent/index.vue @@ -1,5 +1,5 @@ \ No newline at end of file diff --git a/src/views/pvSystem/siteOverview/components/CustomDialogStatus.vue b/src/views/pvSystem/siteOverview/components/CustomDialogStatus.vue new file mode 100644 index 0000000..79cac99 --- /dev/null +++ b/src/views/pvSystem/siteOverview/components/CustomDialogStatus.vue @@ -0,0 +1,102 @@ + + + \ No newline at end of file diff --git a/src/views/pvSystem/siteOverview/components/status.vue b/src/views/pvSystem/siteOverview/components/status.vue index db31309..7f027a2 100644 --- a/src/views/pvSystem/siteOverview/components/status.vue +++ b/src/views/pvSystem/siteOverview/components/status.vue @@ -1,7 +1,8 @@ -