feat(安防监控): 新增安防监控管理页面及组件

添加安防监控管理功能,包括主页面布局、实时视频监控组件和顶部数据统计卡片
更新开发环境API地址配置
新增相关静态资源图片
This commit is contained in:
tcy
2025-09-19 20:29:04 +08:00
parent 7ef7e48e83
commit eb3e1326ca
8 changed files with 225 additions and 1 deletions

View File

@ -0,0 +1,49 @@
<template>
<div class="security-surveillance">
<el-row style="display: flex;align-items: center;">
<el-col :span="12">
<TitleComponent title="安防监控管理" subtitle="实时监控、历史录像查询与视频管理" />
</el-col>
<!-- 关键给内层 el-col 套上 el-row -->
<el-col :span="12" style="text-align: right;">
<el-row :gutter="16" justify="end"> <!-- gutter 可选单位px控制列间距 -->
<el-col :span="6" :push="3">
<el-input placeholder="搜索逆变器..." prefix-icon="search" />
</el-col>
<el-col :span="6" :push="3">
<el-select placeholder="请选择逆变器状态">
<el-option label="所有状态" value="0"></el-option>
</el-select>
</el-col>
<el-col :span="6">
<el-button type="primary">刷新数据<el-icon>
<Refresh />
</el-icon>
</el-button>
</el-col>
</el-row> <!-- 闭合内层 el-row -->
</el-col>
</el-row>
<el-row>
<Top />
</el-row>
<el-row>
<el-col :span="18" style="margin-top: 20px;">
<Spjk />
</el-col>
<el-col :span="6">1</el-col>
</el-row>
</div>
</template>
<style scoped>
.security-surveillance {
padding: 20px;
background-color: #F2F8FC;
}
</style>
<script setup>
import TitleComponent from "@/components/TitleComponent";
import Top from "./components/top"
import Spjk from "./components/spjk"
</script>