This commit is contained in:
re-JZzzz
2025-09-22 16:16:30 +08:00
56 changed files with 8472 additions and 1734 deletions

View File

@ -0,0 +1,75 @@
<template>
<div class="allAlarms">
<el-row>
<el-col :span="12">
<TitleComponent title="所有告警"></TitleComponent>
</el-col>
<el-col :span="12">
<el-row class="right-align-row">
<el-col :span="8">
<el-input prefix-icon="search" placeholder="搜索告警信息"></el-input>
</el-col>
<el-col :span="4" style="text-align: right;">
<el-button icon="download" type="primary">
导出数据
</el-button>
</el-col>
</el-row>
</el-col>
</el-row>
<el-table :data="tableData" style="width: 100%;">
<el-table-column label="告警编号" prop="id"></el-table-column>
<el-table-column label="告警名称" prop="title"></el-table-column>
<el-table-column label="告警等级" prop="level"></el-table-column>
<el-table-column label="告警时间" prop="alarmTime"></el-table-column>
<el-table-column label="负责人" prop="responsible"></el-table-column>
<el-table-column label="告警描述" prop="description"></el-table-column>
<el-table-column label="状态">
<template #default="scope">
<el-tag
:type="scope.row.status === 1 ? 'success' : scope.row.status === 2 ? 'warning' : 'danger'">{{
scope.row.status === 1 ? '已解决' : scope.row.status === 2 ? '待解决' : '未解决' }}</el-tag>
</template>
</el-table-column>
</el-table>
<div style="background-color: #fff;padding: 20px 0;">
<el-pagination layout="prev, pager, next, jumper,sizes" :total="totalRecords"
v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[20, 50, 100]"
@current-change="handlePageChange" @size-change="handleSizeChange"></el-pagination>
</div>
</div>
</template>
<style scoped>
.allAlarms {
background-color: #F2F8FC;
padding: 20px;
}
.right-align-row {
display: flex;
justify-content: flex-end;
}
</style>
<script setup>
import TitleComponent from '@/components/TitleComponent';
const pageSize = ref(20);
const totalRecords = ref(100);
const tableData = computed(() => {
return Array.from({ length: 15 }).map((_, index) => {
return {
id: index,
title: `逆变器温度过高`,
id: `INV-2023-003`,
level: `二级`,
alarmTime: '2025-09-18 18:00',
// 预计解决时间
resolveTime: '2025-09-19 18:00',
// 负责人
responsible: '李华(现场运维组)',
description: `AAAABBBCCCDE...`,
status: Math.floor(Math.random() * 3) + 1
}
})
})
</script>

View File

@ -1,7 +1,7 @@
<template>
<el-card shadow="never" style="border-radius: 10px;">
<div style="margin-bottom: 20px;display: flex;align-items: center;justify-content: right;">
<span style="margin-right: 5px;color: rgba(113, 128, 150, 1);font-size: 14px;">
<span style="margin-right: 5px;color: rgba(113, 128, 150, 1);font-size: 14px;" @click="handleClick">
查看全部告警信息
</span>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="8" height="8"
@ -207,4 +207,11 @@
}
}
</style>
<script setup></script>
<script setup>
const router = useRouter();
const handleClick = () => {
console.log('查看全部告警信息');
router.push('/pvSystem/allAlarms');
}
</script>

View File

@ -1,4 +1,5 @@
<template>
<el-card shadow="never" style="border-radius: 10px;">
<el-form :inline="true" :model="formInline" label-width="120" style="display: flex; justify-content: center;">
<el-form-item label="规则编号">
@ -53,11 +54,37 @@
<pagination :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
@pagination="getList" />
</el-card>
<el-dialog v-model="dialogVisible" width="1000" id="custom-dialog" class="no-header-dialog normal">
<div class="alert-content">
<div class="img">
<img src="/assets/dialog1.png" alt="">
</div>
</div>
</el-dialog>
</template>
<style lang="scss" scoped></style>
<style lang="scss">
// #custom-dialog {
// padding: 0;
// .el-dialog__header {
// display: none;
// }
// .el-dialog__body {
// padding: 0 !important;
// }
// .alert-content {
// padding: 80px;
// background: linear-gradient(180deg, rgba(0, 119, 255, 0.23) 0%, rgba(255, 255, 255, 0) 100%);
// }
// }</style>
<script setup>
const formInline = ref({})
const total = ref(0);
const loading = ref(false);
const dialogVisible = ref(true);
const listData = [
{ id: "INV-2023-001", shuchu: "12.8kw", xiaolv: "98.2%", wendu: "42℃", fadian: "158.5kWh", status: 1 },
{ id: "INV-2023-001", shuchu: "12.8kw", xiaolv: "98.2%", wendu: "42℃", fadian: "158.5kWh", status: 1 },

View File

@ -177,11 +177,15 @@
<QiXiang />
</el-col>
</el-row>
<el-row>
<div>
<el-row :gutter="20"> <!-- gutter列之间的间距单位px控制垂直/水平间距 -->
<!-- 标题列占满12列栅格系统默认12列 -->
<el-col> <!-- span=12 表示占满一行宽度 -->
<TitleComponent title="逆变器运行状态" :fontLevel="2" />
</div>
<status style="width: 100%;" />
</el-col>
<!-- status组件列同样占满12列与标题垂直排列 -->
<el-col>
<status style="width: 100%;" /> <!-- 确保组件宽度100%不溢出 -->
</el-col>
</el-row>
<el-row style="display: flex;">
<el-col :span="6" style="display: flex;flex-direction: column;">