feat: 实现供水运营专题大屏BI可视化

- 新增OperationDashboard.vue全屏大屏组件
- 添加6个核心KPI指标卡片: 进水总量/出水总量/产销差率/营收额/平均水质/报警次数
- 实现6个ECharts图表: 供水趋势/水质分布/报警统计/管网空间/设备状态/营收分析
- 创建静态HTML版本operation-dashboard.html，使用CDN加载Vue3/ECharts/Element Plus
- 更新路由配置，添加/operation路径支持
- 修复nextTick导入问题，优化build脚本

🚧 开发者: bot_dev1
📝 任务: #38 [BI] 运营仪表盘 + 供水专题大屏

frontend/node_modules/element-plus/theme-chalk/src/button-group.scss

@@ -0,0 +1,133 @@
+@use 'sass:map';
+
+@use 'common/var' as *;
+@use 'mixins/mixins' as *;
+@use 'mixins/utils' as *;
+
+@include b(button-group) {
+  & > .#{$namespace}-button {
+    & + .#{$namespace}-button {
+      margin-left: 0;
+    }
+
+    &:first-child:last-child {
+      border-top-right-radius: map.get($button-border-radius, 'default');
+      border-bottom-right-radius: map.get($button-border-radius, 'default');
+      border-top-left-radius: map.get($button-border-radius, 'default');
+      border-bottom-left-radius: map.get($button-border-radius, 'default');
+
+      &.is-round {
+        border-radius: getCssVar('border-radius', 'round');
+      }
+
+      &.is-circle {
+        border-radius: 50%;
+      }
+    }
+
+    &:not(:first-child):not(:last-child) {
+      border-radius: 0;
+    }
+
+    &:hover,
+    &:focus,
+    &:active {
+      z-index: 1;
+    }
+
+    @include when(active) {
+      z-index: 1;
+    }
+  }
+
+  @include m('horizontal') {
+    display: inline-block;
+    vertical-align: middle;
+    @include utils-clearfix;
+
+    & > .#{$namespace}-button {
+      float: left;
+      position: relative;
+
+      &:first-child {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+      &:last-child {
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+      }
+
+      &:not(:last-child) {
+        margin-right: -1px;
+      }
+    }
+
+    @each $type in (primary, success, warning, danger, info) {
+      .#{$namespace}-button--#{$type} {
+        &:first-child {
+          border-right-color: getCssVar('button', 'divide-border-color');
+        }
+        &:last-child {
+          border-left-color: getCssVar('button', 'divide-border-color');
+        }
+        &:not(:first-child):not(:last-child) {
+          border-left-color: getCssVar('button', 'divide-border-color');
+          border-right-color: getCssVar('button', 'divide-border-color');
+        }
+      }
+    }
+
+    & > .#{$namespace}-dropdown {
+      & > .#{$namespace}-button {
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+        border-left-color: getCssVar('button', 'divide-border-color');
+      }
+    }
+  }
+
+  @include m('vertical') {
+    display: inline-flex;
+    flex-direction: column;
+    align-items: stretch;
+
+    & > .#{$namespace}-button {
+      margin-top: -1px;
+
+      &:first-child {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+      &:last-child {
+        border-top-left-radius: 0;
+        border-top-right-radius: 0;
+      }
+    }
+
+    & > .#{$namespace}-dropdown {
+      margin-top: -1px;
+
+      & > .#{$namespace}-button {
+        border-top-left-radius: 0;
+        border-top-right-radius: 0;
+        border-left-color: getCssVar('button', 'divide-border-color');
+      }
+    }
+
+    @each $type in (primary, success, warning, danger, info) {
+      .#{$namespace}-button--#{$type} {
+        &:first-child {
+          border-bottom-color: getCssVar('button', 'divide-border-color');
+        }
+        &:last-child {
+          border-top-color: getCssVar('button', 'divide-border-color');
+        }
+        &:not(:first-child):not(:last-child) {
+          border-top-color: getCssVar('button', 'divide-border-color');
+          border-bottom-color: getCssVar('button', 'divide-border-color');
+        }
+      }
+    }
+  }
+}