|
@@ -0,0 +1,816 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-tabs v-model="activeTab">
|
|
|
+ <!-- 照明监控标签页 -->
|
|
|
+ <el-tab-pane label="照明监控" name="monitor">
|
|
|
+ <el-form :model="lightingQuery" ref="lightingQueryRef" :inline="true" label-width="80px">
|
|
|
+ <el-form-item label="楼栋" prop="buildingId">
|
|
|
+ <el-select v-model="lightingQuery.buildingId" placeholder="请选择楼栋" clearable @change="handleBuildingChange">
|
|
|
+ <el-option
|
|
|
+ v-for="item in buildingList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="楼层" prop="floorId">
|
|
|
+ <el-select v-model="lightingQuery.floorId" placeholder="请选择楼层" clearable :disabled="!lightingQuery.buildingId">
|
|
|
+ <el-option
|
|
|
+ v-for="item in floorList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="区域" prop="areaName">
|
|
|
+ <el-input v-model="lightingQuery.areaName" placeholder="请输入区域名称" clearable />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="状态" prop="status">
|
|
|
+ <el-select v-model="lightingQuery.status" placeholder="请选择状态" clearable>
|
|
|
+ <el-option label="关闭" :value="0" />
|
|
|
+ <el-option label="开启" :value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="控制模式" prop="controlMode">
|
|
|
+ <el-select v-model="lightingQuery.controlMode" placeholder="请选择控制模式" clearable>
|
|
|
+ <el-option label="手动" :value="0" />
|
|
|
+ <el-option label="自动" :value="1" />
|
|
|
+ <el-option label="定时" :value="2" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="Search" @click="getLightingList">搜索</el-button>
|
|
|
+ <el-button icon="Refresh" @click="resetLightingQuery">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <el-row :gutter="10" class="mb8">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="success"
|
|
|
+ plain
|
|
|
+ icon="Operation"
|
|
|
+ @click="handleBatchControl"
|
|
|
+ :disabled="lightingSelection.length === 0"
|
|
|
+ >批量控制</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="warning"
|
|
|
+ plain
|
|
|
+ icon="Clock"
|
|
|
+ @click="handleSchedule"
|
|
|
+ >定时计划</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-table v-loading="lightingLoading" :data="lightingList" stripe border @selection-change="handleLightingSelectionChange">
|
|
|
+ <el-table-column type="selection" width="55" align="center" />
|
|
|
+ <el-table-column label="设备编码" prop="deviceCode" />
|
|
|
+ <el-table-column label="设备名称" prop="deviceName" />
|
|
|
+ <el-table-column label="楼栋" prop="buildingName" />
|
|
|
+ <el-table-column label="楼层" prop="floorName" />
|
|
|
+ <el-table-column label="区域" prop="areaName" />
|
|
|
+ <el-table-column label="回路" prop="circuitNo" />
|
|
|
+ <el-table-column label="状态" prop="status" width="80" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-switch
|
|
|
+ v-model="scope.row.status"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ @change="handleStatusChange(scope.row)"
|
|
|
+ :disabled="scope.row.control_mode !== 0"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="亮度" prop="brightness" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-slider
|
|
|
+ v-model="scope.row.brightness"
|
|
|
+ :disabled="scope.row.status === 0 || scope.row.control_mode !== 0"
|
|
|
+ @change="handleBrightnessChange(scope.row)"
|
|
|
+ size="small"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="控制模式" prop="control_mode" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="controlModeType(scope.row.control_mode)">
|
|
|
+ {{ controlModeText(scope.row.control_mode) }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="在线状态" prop="is_online" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="scope.row.is_online === 1 ? 'success' : 'info'">
|
|
|
+ {{ scope.row.is_online === 1 ? '在线' : '离线' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="故障状态" prop="fault_status" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="scope.row.fault_status === 0 ? 'success' : 'danger'">
|
|
|
+ {{ scope.row.fault_status === 0 ? '正常' : '故障' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="更新时间" prop="last_update_time" width="160">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>{{ parseTime(scope.row.last_update_time) }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" fixed="right" width="120">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button link type="primary" icon="Setting" @click="handleDeviceDetail(scope.row)">详情</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <pagination
|
|
|
+ v-show="lightingTotal > 0"
|
|
|
+ :total="lightingTotal"
|
|
|
+ v-model:page="lightingQuery.pageNum"
|
|
|
+ v-model:limit="lightingQuery.pageSize"
|
|
|
+ @pagination="getLightingList"
|
|
|
+ />
|
|
|
+ </el-tab-pane>
|
|
|
+
|
|
|
+ <!-- 报警记录标签页 -->
|
|
|
+ <el-tab-pane label="报警记录" name="alarm">
|
|
|
+ <el-form :model="alarmQuery" ref="alarmQueryRef" :inline="true" label-width="80px">
|
|
|
+ <el-form-item label="设备名称" prop="deviceName">
|
|
|
+ <el-input v-model="alarmQuery.deviceName" placeholder="请输入设备名称" clearable />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="报警类型" prop="alarmType">
|
|
|
+ <el-select v-model="alarmQuery.alarmType" placeholder="请选择报警类型" clearable>
|
|
|
+ <el-option label="通信故障" value="communication" />
|
|
|
+ <el-option label="灯具故障" value="lamp" />
|
|
|
+ <el-option label="线路故障" value="circuit" />
|
|
|
+ <el-option label="控制器故障" value="controller" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="报警级别" prop="alarmLevel">
|
|
|
+ <el-select v-model="alarmQuery.alarmLevel" placeholder="请选择报警级别" clearable>
|
|
|
+ <el-option label="提示" :value="1" />
|
|
|
+ <el-option label="一般" :value="2" />
|
|
|
+ <el-option label="严重" :value="3" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="处理状态" prop="handleStatus">
|
|
|
+ <el-select v-model="alarmQuery.handleStatus" placeholder="请选择处理状态" clearable>
|
|
|
+ <el-option label="未处理" :value="0" />
|
|
|
+ <el-option label="已处理" :value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="时间范围" prop="timeRange">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="alarmQuery.timeRange"
|
|
|
+ type="datetimerange"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始时间"
|
|
|
+ end-placeholder="结束时间"
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="Search" @click="getAlarmList">搜索</el-button>
|
|
|
+ <el-button icon="Refresh" @click="resetAlarmQuery">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <el-table v-loading="alarmLoading" :data="alarmList" stripe border>
|
|
|
+ <el-table-column label="设备编码" prop="device_code" width="120" />
|
|
|
+ <el-table-column label="设备名称" prop="device_name" width="150" />
|
|
|
+ <el-table-column label="报警类型" prop="alarm_type" width="120" />
|
|
|
+ <el-table-column label="报警级别" prop="alarm_level" width="100" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="alarmLevelType(scope.row.alarm_level)">
|
|
|
+ {{ alarmLevelText(scope.row.alarm_level) }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="报警描述" prop="alarm_desc" show-overflow-tooltip />
|
|
|
+ <el-table-column label="报警时间" prop="alarm_time" width="160">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>{{ parseTime(scope.row.alarm_time) }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="处理状态" prop="handle_status" width="100" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="scope.row.handle_status === 1 ? 'success' : 'warning'">
|
|
|
+ {{ scope.row.handle_status === 1 ? '已处理' : '未处理' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="处理人" prop="handle_user" width="100" />
|
|
|
+ <el-table-column label="处理时间" prop="handle_time" width="160">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>{{ parseTime(scope.row.handle_time) }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" fixed="right" width="120">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button
|
|
|
+ link
|
|
|
+ type="primary"
|
|
|
+ icon="Edit"
|
|
|
+ @click="handleAlarm(scope.row)"
|
|
|
+ v-if="scope.row.handle_status === 0"
|
|
|
+ >处理</el-button>
|
|
|
+ <el-button
|
|
|
+ link
|
|
|
+ type="primary"
|
|
|
+ icon="View"
|
|
|
+ @click="handleAlarmDetail(scope.row)"
|
|
|
+ v-else
|
|
|
+ >详情</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <pagination
|
|
|
+ v-show="alarmTotal > 0"
|
|
|
+ :total="alarmTotal"
|
|
|
+ v-model:page="alarmQuery.pageNum"
|
|
|
+ v-model:limit="alarmQuery.pageSize"
|
|
|
+ @pagination="getAlarmList"
|
|
|
+ />
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
+ <!-- 批量控制对话框 -->
|
|
|
+ <el-dialog v-model="batchControlVisible" title="批量控制" width="500px" append-to-body>
|
|
|
+ <el-form ref="batchControlRef" :model="batchControlForm" label-width="80px">
|
|
|
+ <el-form-item label="控制动作">
|
|
|
+ <el-radio-group v-model="batchControlForm.action">
|
|
|
+ <el-radio :label="0">关闭</el-radio>
|
|
|
+ <el-radio :label="1">开启</el-radio>
|
|
|
+ <el-radio :label="2">调光</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="亮度调节" v-if="batchControlForm.action === 2">
|
|
|
+ <el-slider v-model="batchControlForm.brightness" :min="0" :max="100" show-input />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选中设备">
|
|
|
+ <el-tag v-for="item in lightingSelection" :key="item.id" class="mr8 mb8">
|
|
|
+ {{ item.deviceName }}
|
|
|
+ </el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="batchControlVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="submitBatchControl">确定</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 定时计划对话框 -->
|
|
|
+ <el-dialog v-model="scheduleVisible" title="定时计划管理" width="900px" append-to-body>
|
|
|
+ <el-button type="primary" icon="Plus" @click="handleAddSchedule" class="mb8">新增计划</el-button>
|
|
|
+ <el-table :data="scheduleList" stripe border>
|
|
|
+ <el-table-column label="计划名称" prop="schedule_name" />
|
|
|
+ <el-table-column label="计划类型" prop="schedule_type" width="100" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scheduleTypeText(scope.row.schedule_type) }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="执行时间" width="160">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.start_time }} - {{ scope.row.end_time }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="动作" prop="action_type" width="100" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ actionTypeText(scope.row.action_type) }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="状态" prop="is_enabled" width="80" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-switch
|
|
|
+ v-model="scope.row.is_enabled"
|
|
|
+ :active-value="1"
|
|
|
+ :inactive-value="0"
|
|
|
+ @change="handleScheduleStatusChange(scope.row)"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="150" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button link type="primary" icon="Edit" @click="handleEditSchedule(scope.row)">编辑</el-button>
|
|
|
+ <el-button link type="danger" icon="Delete" @click="handleDeleteSchedule(scope.row)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 新增/编辑计划对话框 -->
|
|
|
+ <el-dialog v-model="scheduleFormVisible" :title="scheduleFormTitle" width="600px" append-to-body>
|
|
|
+ <el-form ref="scheduleFormRef" :model="scheduleForm" :rules="scheduleRules" label-width="100px">
|
|
|
+ <el-form-item label="计划名称" prop="scheduleName">
|
|
|
+ <el-input v-model="scheduleForm.scheduleName" placeholder="请输入计划名称" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择设备" prop="deviceIds">
|
|
|
+ <el-select v-model="scheduleForm.deviceIds" multiple placeholder="请选择设备" style="width: 100%">
|
|
|
+ <el-option
|
|
|
+ v-for="item in allLightingList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.device_name"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="计划类型" prop="scheduleType">
|
|
|
+ <el-radio-group v-model="scheduleForm.scheduleType">
|
|
|
+ <el-radio :label="0">单次执行</el-radio>
|
|
|
+ <el-radio :label="1">每日执行</el-radio>
|
|
|
+ <el-radio :label="2">每周执行</el-radio>
|
|
|
+ <el-radio :label="3">每月执行</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="执行时间" prop="timeRange">
|
|
|
+ <el-time-picker
|
|
|
+ v-model="scheduleForm.startTime"
|
|
|
+ placeholder="开始时间"
|
|
|
+ format="HH:mm"
|
|
|
+ value-format="HH:mm"
|
|
|
+ />
|
|
|
+ <span class="mx8">至</span>
|
|
|
+ <el-time-picker
|
|
|
+ v-model="scheduleForm.endTime"
|
|
|
+ placeholder="结束时间"
|
|
|
+ format="HH:mm"
|
|
|
+ value-format="HH:mm"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="周执行日" v-if="scheduleForm.scheduleType === 2" prop="weekDays">
|
|
|
+ <el-checkbox-group v-model="scheduleForm.weekDays">
|
|
|
+ <el-checkbox :label="1">周一</el-checkbox>
|
|
|
+ <el-checkbox :label="2">周二</el-checkbox>
|
|
|
+ <el-checkbox :label="3">周三</el-checkbox>
|
|
|
+ <el-checkbox :label="4">周四</el-checkbox>
|
|
|
+ <el-checkbox :label="5">周五</el-checkbox>
|
|
|
+ <el-checkbox :label="6">周六</el-checkbox>
|
|
|
+ <el-checkbox :label="7">周日</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="月执行日" v-if="scheduleForm.scheduleType === 3" prop="monthDays">
|
|
|
+ <el-select v-model="scheduleForm.monthDays" multiple placeholder="请选择日期" style="width: 100%">
|
|
|
+ <el-option v-for="i in 31" :key="i" :label="i + '日'" :value="i" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="排除节假日" prop="excludeHolidays">
|
|
|
+ <el-switch v-model="scheduleForm.excludeHolidays" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="执行动作" prop="actionType">
|
|
|
+ <el-radio-group v-model="scheduleForm.actionType">
|
|
|
+ <el-radio :label="0">关闭</el-radio>
|
|
|
+ <el-radio :label="1">开启</el-radio>
|
|
|
+ <el-radio :label="2">调光</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="亮度设置" v-if="scheduleForm.actionType === 2" prop="brightness">
|
|
|
+ <el-slider v-model="scheduleForm.brightness" :min="0" :max="100" show-input />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="scheduleFormVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="submitScheduleForm">确定</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 处理报警对话框 -->
|
|
|
+ <el-dialog v-model="handleAlarmVisible" title="处理报警" width="500px" append-to-body>
|
|
|
+ <el-form ref="handleAlarmRef" :model="handleAlarmForm" label-width="80px">
|
|
|
+ <el-form-item label="设备名称">
|
|
|
+ <el-input v-model="handleAlarmForm.deviceName" disabled />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="报警描述">
|
|
|
+ <el-input v-model="handleAlarmForm.alarmDesc" type="textarea" :rows="3" disabled />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="处理备注" prop="handleRemark">
|
|
|
+ <el-input v-model="handleAlarmForm.handleRemark" type="textarea" :rows="3" placeholder="请输入处理备注" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="handleAlarmVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="submitHandleAlarm">确定</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, reactive, onMounted } from 'vue'
|
|
|
+import {
|
|
|
+ listLightingDevice,
|
|
|
+ controlLightingDevice,
|
|
|
+ batchControlLighting,
|
|
|
+ listLightingAlarm,
|
|
|
+ handleLightingAlarm,
|
|
|
+ listLightingSchedule,
|
|
|
+ addLightingSchedule,
|
|
|
+ updateLightingSchedule,
|
|
|
+ deleteLightingSchedule,
|
|
|
+ getBuildingList,
|
|
|
+ getFloorList
|
|
|
+} from '@/api/subsystem/lighting'
|
|
|
+
|
|
|
+const { proxy } = getCurrentInstance()
|
|
|
+const activeTab = ref('monitor')
|
|
|
+
|
|
|
+// 照明监控查询相关
|
|
|
+const lightingQuery = reactive({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ buildingId: null,
|
|
|
+ floorId: null,
|
|
|
+ areaName: null,
|
|
|
+ status: null,
|
|
|
+ controlMode: null
|
|
|
+})
|
|
|
+const lightingList = ref([])
|
|
|
+const lightingTotal = ref(0)
|
|
|
+const lightingLoading = ref(false)
|
|
|
+const lightingSelection = ref([])
|
|
|
+const allLightingList = ref([])
|
|
|
+
|
|
|
+// 报警记录查询相关
|
|
|
+const alarmQuery = reactive({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ deviceName: null,
|
|
|
+ alarmType: null,
|
|
|
+ alarmLevel: null,
|
|
|
+ handleStatus: null,
|
|
|
+ timeRange: []
|
|
|
+})
|
|
|
+const alarmList = ref([])
|
|
|
+const alarmTotal = ref(0)
|
|
|
+const alarmLoading = ref(false)
|
|
|
+
|
|
|
+// 楼栋楼层数据
|
|
|
+const buildingList = ref([])
|
|
|
+const floorList = ref([])
|
|
|
+
|
|
|
+// 批量控制相关
|
|
|
+const batchControlVisible = ref(false)
|
|
|
+const batchControlForm = reactive({
|
|
|
+ action: 1,
|
|
|
+ brightness: 50
|
|
|
+})
|
|
|
+
|
|
|
+// 定时计划相关
|
|
|
+const scheduleVisible = ref(false)
|
|
|
+const scheduleList = ref([])
|
|
|
+const scheduleFormVisible = ref(false)
|
|
|
+const scheduleFormTitle = ref('')
|
|
|
+const scheduleForm = reactive({
|
|
|
+ id: null,
|
|
|
+ scheduleName: '',
|
|
|
+ deviceIds: [],
|
|
|
+ scheduleType: 1,
|
|
|
+ startTime: '',
|
|
|
+ endTime: '',
|
|
|
+ weekDays: [],
|
|
|
+ monthDays: [],
|
|
|
+ excludeHolidays: false,
|
|
|
+ actionType: 1,
|
|
|
+ brightness: 50
|
|
|
+})
|
|
|
+const scheduleRules = {
|
|
|
+ scheduleName: [{ required: true, message: '请输入计划名称', trigger: 'blur' }],
|
|
|
+ deviceIds: [{ required: true, message: '请选择设备', trigger: 'change' }],
|
|
|
+ scheduleType: [{ required: true, message: '请选择计划类型', trigger: 'change' }],
|
|
|
+ actionType: [{ required: true, message: '请选择执行动作', trigger: 'change' }]
|
|
|
+}
|
|
|
+
|
|
|
+// 处理报警相关
|
|
|
+const handleAlarmVisible = ref(false)
|
|
|
+const handleAlarmForm = reactive({
|
|
|
+ id: null,
|
|
|
+ deviceName: '',
|
|
|
+ alarmDesc: '',
|
|
|
+ handleRemark: ''
|
|
|
+})
|
|
|
+
|
|
|
+// 控制模式类型
|
|
|
+const controlModeType = (mode) => {
|
|
|
+ const types = ['', 'success', 'warning']
|
|
|
+ return types[mode] || ''
|
|
|
+}
|
|
|
+
|
|
|
+// 控制模式文本
|
|
|
+const controlModeText = (mode) => {
|
|
|
+ const texts = ['手动', '自动', '定时']
|
|
|
+ return texts[mode] || '未知'
|
|
|
+}
|
|
|
+
|
|
|
+// 报警级别类型
|
|
|
+const alarmLevelType = (level) => {
|
|
|
+ const types = ['', 'info', 'warning', 'danger']
|
|
|
+ return types[level] || 'info'
|
|
|
+}
|
|
|
+
|
|
|
+// 报警级别文本
|
|
|
+const alarmLevelText = (level) => {
|
|
|
+ const texts = ['', '提示', '一般', '严重']
|
|
|
+ return texts[level] || '未知'
|
|
|
+}
|
|
|
+
|
|
|
+// 计划类型文本
|
|
|
+const scheduleTypeText = (type) => {
|
|
|
+ const texts = ['单次', '每日', '每周', '每月']
|
|
|
+ return texts[type] || '未知'
|
|
|
+}
|
|
|
+
|
|
|
+// 动作类型文本
|
|
|
+const actionTypeText = (type) => {
|
|
|
+ const texts = ['关闭', '开启', '调光']
|
|
|
+ return texts[type] || '未知'
|
|
|
+}
|
|
|
+
|
|
|
+// 获取楼栋列表
|
|
|
+async function loadBuildingList() {
|
|
|
+ const res = await getBuildingList()
|
|
|
+ buildingList.value = res.data
|
|
|
+}
|
|
|
+
|
|
|
+// 楼栋变化处理
|
|
|
+async function handleBuildingChange(val) {
|
|
|
+ lightingQuery.floorId = null
|
|
|
+ floorList.value = []
|
|
|
+ if (val) {
|
|
|
+ const res = await getFloorList({ buildingId: val })
|
|
|
+ floorList.value = res.data
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 查询照明设备列表
|
|
|
+function getLightingList() {
|
|
|
+ lightingLoading.value = true
|
|
|
+ const params = {
|
|
|
+ ...lightingQuery,
|
|
|
+ pageNum: lightingQuery.pageNum,
|
|
|
+ pageSize: lightingQuery.pageSize
|
|
|
+ }
|
|
|
+ listLightingDevice(params).then(response => {
|
|
|
+ lightingList.value = response.rows
|
|
|
+ lightingTotal.value = response.total
|
|
|
+ lightingLoading.value = false
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 获取所有照明设备(用于选择)
|
|
|
+async function getAllLightingList() {
|
|
|
+ const res = await listLightingDevice({ pageSize: 1000 })
|
|
|
+ allLightingList.value = res.rows
|
|
|
+}
|
|
|
+
|
|
|
+// 重置照明查询
|
|
|
+function resetLightingQuery() {
|
|
|
+ proxy.resetForm('lightingQueryRef')
|
|
|
+ lightingQuery.pageNum = 1
|
|
|
+ getLightingList()
|
|
|
+}
|
|
|
+
|
|
|
+// 选择变化
|
|
|
+function handleLightingSelectionChange(selection) {
|
|
|
+ lightingSelection.value = selection
|
|
|
+}
|
|
|
+
|
|
|
+// 状态切换
|
|
|
+function handleStatusChange(row) {
|
|
|
+ const text = row.status === 1 ? '开启' : '关闭'
|
|
|
+ proxy.$modal.confirm(`确认${text}照明设备"${row.device_name}"吗?`).then(() => {
|
|
|
+ return controlLightingDevice({
|
|
|
+ deviceCode: row.device_code,
|
|
|
+ action: row.status,
|
|
|
+ brightness: row.brightness
|
|
|
+ })
|
|
|
+ }).then(() => {
|
|
|
+ proxy.$modal.msgSuccess(`${text}成功`)
|
|
|
+ getLightingList()
|
|
|
+ }).catch(() => {
|
|
|
+ row.status = row.status === 1 ? 0 : 1
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 亮度调节
|
|
|
+function handleBrightnessChange(row) {
|
|
|
+ controlLightingDevice({
|
|
|
+ deviceCode: row.device_code,
|
|
|
+ action: 2,
|
|
|
+ brightness: row.brightness
|
|
|
+ }).then(() => {
|
|
|
+ proxy.$modal.msgSuccess('亮度调节成功')
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 批量控制
|
|
|
+function handleBatchControl() {
|
|
|
+ batchControlVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+// 提交批量控制
|
|
|
+function submitBatchControl() {
|
|
|
+ const deviceCodes = lightingSelection.value.map(item => item.device_code)
|
|
|
+ batchControlLighting({
|
|
|
+ deviceCodes: deviceCodes,
|
|
|
+ action: batchControlForm.action,
|
|
|
+ brightness: batchControlForm.brightness
|
|
|
+ }).then(() => {
|
|
|
+ proxy.$modal.msgSuccess('批量控制成功')
|
|
|
+ batchControlVisible.value = false
|
|
|
+ getLightingList()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 定时计划管理
|
|
|
+function handleSchedule() {
|
|
|
+ scheduleVisible.value = true
|
|
|
+ getScheduleList()
|
|
|
+}
|
|
|
+
|
|
|
+// 获取计划列表
|
|
|
+function getScheduleList() {
|
|
|
+ listLightingSchedule().then(response => {
|
|
|
+ scheduleList.value = response.rows
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 新增计划
|
|
|
+function handleAddSchedule() {
|
|
|
+ resetScheduleForm()
|
|
|
+ scheduleFormTitle.value = '新增定时计划'
|
|
|
+ scheduleFormVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+// 编辑计划
|
|
|
+function handleEditSchedule(row) {
|
|
|
+ resetScheduleForm()
|
|
|
+ scheduleFormTitle.value = '编辑定时计划'
|
|
|
+ Object.assign(scheduleForm, {
|
|
|
+ id: row.id,
|
|
|
+ scheduleName: row.schedule_name,
|
|
|
+ deviceIds: row.device_ids ? row.device_ids.split(',').map(Number) : [],
|
|
|
+ scheduleType: row.schedule_type,
|
|
|
+ startTime: row.start_time,
|
|
|
+ endTime: row.end_time,
|
|
|
+ weekDays: row.week_days ? row.week_days.split(',').map(Number) : [],
|
|
|
+ monthDays: row.month_days ? row.month_days.split(',').map(Number) : [],
|
|
|
+ excludeHolidays: row.exclude_holidays === 1,
|
|
|
+ actionType: row.action_type,
|
|
|
+ brightness: row.brightness || 50
|
|
|
+ })
|
|
|
+ scheduleFormVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+// 删除计划
|
|
|
+function handleDeleteSchedule(row) {
|
|
|
+ proxy.$modal.confirm(`确认删除计划"${row.schedule_name}"吗?`).then(() => {
|
|
|
+ return deleteLightingSchedule(row.id)
|
|
|
+ }).then(() => {
|
|
|
+ proxy.$modal.msgSuccess('删除成功')
|
|
|
+ getScheduleList()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 计划状态切换
|
|
|
+function handleScheduleStatusChange(row) {
|
|
|
+ updateLightingSchedule({
|
|
|
+ id: row.id,
|
|
|
+ isEnabled: row.is_enabled
|
|
|
+ }).then(() => {
|
|
|
+ proxy.$modal.msgSuccess('状态更新成功')
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 重置计划表单
|
|
|
+function resetScheduleForm() {
|
|
|
+ scheduleForm.id = null
|
|
|
+ scheduleForm.scheduleName = ''
|
|
|
+ scheduleForm.deviceIds = []
|
|
|
+ scheduleForm.scheduleType = 1
|
|
|
+ scheduleForm.startTime = ''
|
|
|
+ scheduleForm.endTime = ''
|
|
|
+ scheduleForm.weekDays = []
|
|
|
+ scheduleForm.monthDays = []
|
|
|
+ scheduleForm.excludeHolidays = false
|
|
|
+ scheduleForm.actionType = 1
|
|
|
+ scheduleForm.brightness = 50
|
|
|
+ proxy.resetForm('scheduleFormRef')
|
|
|
+}
|
|
|
+
|
|
|
+// 提交计划表单
|
|
|
+function submitScheduleForm() {
|
|
|
+ proxy.$refs['scheduleFormRef'].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ const data = {
|
|
|
+ ...scheduleForm,
|
|
|
+ deviceIds: scheduleForm.deviceIds.join(','),
|
|
|
+ weekDays: scheduleForm.weekDays.join(','),
|
|
|
+ monthDays: scheduleForm.monthDays.join(','),
|
|
|
+ excludeHolidays: scheduleForm.excludeHolidays ? 1 : 0
|
|
|
+ }
|
|
|
+ if (scheduleForm.id) {
|
|
|
+ updateLightingSchedule(data).then(() => {
|
|
|
+ proxy.$modal.msgSuccess('修改成功')
|
|
|
+ scheduleFormVisible.value = false
|
|
|
+ getScheduleList()
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ addLightingSchedule(data).then(() => {
|
|
|
+ proxy.$modal.msgSuccess('新增成功')
|
|
|
+ scheduleFormVisible.value = false
|
|
|
+ getScheduleList()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 查询报警列表
|
|
|
+function getAlarmList() {
|
|
|
+ alarmLoading.value = true
|
|
|
+ const params = {
|
|
|
+ ...alarmQuery,
|
|
|
+ pageNum: alarmQuery.pageNum,
|
|
|
+ pageSize: alarmQuery.pageSize
|
|
|
+ }
|
|
|
+ if (alarmQuery.timeRange && alarmQuery.timeRange.length === 2) {
|
|
|
+ params.beginTime = alarmQuery.timeRange[0]
|
|
|
+ params.endTime = alarmQuery.timeRange[1]
|
|
|
+ }
|
|
|
+ listLightingAlarm(params).then(response => {
|
|
|
+ alarmList.value = response.rows
|
|
|
+ alarmTotal.value = response.total
|
|
|
+ alarmLoading.value = false
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 重置报警查询
|
|
|
+function resetAlarmQuery() {
|
|
|
+ proxy.resetForm('alarmQueryRef')
|
|
|
+ alarmQuery.pageNum = 1
|
|
|
+ getAlarmList()
|
|
|
+}
|
|
|
+
|
|
|
+// 处理报警
|
|
|
+function handleAlarm(row) {
|
|
|
+ handleAlarmForm.id = row.id
|
|
|
+ handleAlarmForm.deviceName = row.device_name
|
|
|
+ handleAlarmForm.alarmDesc = row.alarm_desc
|
|
|
+ handleAlarmForm.handleRemark = ''
|
|
|
+ handleAlarmVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+// 提交处理报警
|
|
|
+function submitHandleAlarm() {
|
|
|
+ handleLightingAlarm({
|
|
|
+ id: handleAlarmForm.id,
|
|
|
+ handleRemark: handleAlarmForm.handleRemark
|
|
|
+ }).then(() => {
|
|
|
+ proxy.$modal.msgSuccess('处理成功')
|
|
|
+ handleAlarmVisible.value = false
|
|
|
+ getAlarmList()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 查看报警详情
|
|
|
+function handleAlarmDetail(row) {
|
|
|
+ // 可以打开详情对话框显示更多信息
|
|
|
+ proxy.$modal.msgWarning(`待开发`)
|
|
|
+}
|
|
|
+
|
|
|
+// 查看设备详情
|
|
|
+function handleDeviceDetail(row) {
|
|
|
+ // 可以跳转到设备详情页面或打开详情对话框
|
|
|
+ proxy.$modal.msgWarning(`设备编码:${row.deviceCode}`+'详情对话框')
|
|
|
+}
|
|
|
+
|
|
|
+// 初始化
|
|
|
+onMounted(() => {
|
|
|
+ loadBuildingList()
|
|
|
+ getLightingList()
|
|
|
+ getAllLightingList()
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.mr8 {
|
|
|
+ margin-right: 8px;
|
|
|
+}
|
|
|
+.mb8 {
|
|
|
+ margin-bottom: 8px;
|
|
|
+}
|
|
|
+.mx8 {
|
|
|
+ margin: 0 8px;
|
|
|
+}
|
|
|
+</style>
|