- 新增OperationDashboard.vue全屏大屏组件 - 添加6个核心KPI指标卡片: 进水总量/出水总量/产销差率/营收额/平均水质/报警次数 - 实现6个ECharts图表: 供水趋势/水质分布/报警统计/管网空间/设备状态/营收分析 - 创建静态HTML版本operation-dashboard.html,使用CDN加载Vue3/ECharts/Element Plus - 更新路由配置,添加/operation路径支持 - 修复nextTick导入问题,优化build脚本 🚧 开发者: bot_dev1 📝 任务: #38 [BI] 运营仪表盘 + 供水专题大屏
50 lines
1.2 KiB
SCSS
50 lines
1.2 KiB
SCSS
@use 'mixins/mixins' as *;
|
|
@use 'mixins/var' as *;
|
|
@use 'common/var' as *;
|
|
|
|
@include b(card) {
|
|
@include set-component-css-var('card', $card);
|
|
}
|
|
|
|
@include b(card) {
|
|
display: flex;
|
|
flex-direction: column;
|
|
border-radius: getCssVar('card', 'border-radius');
|
|
border: 1px solid getCssVar('card', 'border-color');
|
|
background-color: getCssVar('card', 'bg-color');
|
|
overflow: hidden;
|
|
color: getCssVar('text-color', 'primary');
|
|
transition: getCssVar('transition-duration');
|
|
|
|
@include when(always-shadow) {
|
|
box-shadow: getCssVar('box-shadow', 'light');
|
|
}
|
|
|
|
@include when(hover-shadow) {
|
|
&:hover,
|
|
&:focus {
|
|
box-shadow: getCssVar('box-shadow', 'light');
|
|
}
|
|
}
|
|
|
|
@include e(header) {
|
|
padding: calc(#{getCssVar('card', 'padding')} - 2px)
|
|
getCssVar('card', 'padding');
|
|
border-bottom: 1px solid getCssVar('card', 'border-color');
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
@include e(body) {
|
|
flex-grow: 1; // #23538
|
|
overflow: auto;
|
|
padding: getCssVar('card', 'padding');
|
|
}
|
|
|
|
@include e(footer) {
|
|
padding: calc(#{getCssVar('card', 'padding')} - 2px)
|
|
getCssVar('card', 'padding');
|
|
border-top: 1px solid getCssVar('card', 'border-color');
|
|
box-sizing: border-box;
|
|
}
|
|
}
|