From 740f596cb7c5b5e3576ba8aab9c4cc5732b3ccf2 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期日, 08 十月 2023 08:39:24 +0800
Subject: [PATCH] 油烟-报警
---
src/api/smoke/alarm.js | 12 +
src/views/smoke/alarm/header/index.vue | 120 +++++++++++++++++
src/views/smoke/alarm/index.vue | 232 ++++++++++++++++++++++++++++++++
3 files changed, 361 insertions(+), 3 deletions(-)
diff --git a/src/api/smoke/alarm.js b/src/api/smoke/alarm.js
new file mode 100644
index 0000000..ff90753
--- /dev/null
+++ b/src/api/smoke/alarm.js
@@ -0,0 +1,12 @@
+import http from '@/http'
+
+export default {
+ // 鏌ヨ瀹炴椂鏁版嵁
+ findAlarmList: (params) => {
+ return http.get('/sccg/smoke/Alarm/list', params);
+ },
+ // 瀵煎嚭瀹炴椂鏁版嵁
+ exportAlarm: (params) => {
+ return http.downloadFile('/sccg/smoke/Alarm/export', params);
+ },
+}
\ No newline at end of file
diff --git a/src/views/smoke/alarm/header/index.vue b/src/views/smoke/alarm/header/index.vue
new file mode 100644
index 0000000..f86ef15
--- /dev/null
+++ b/src/views/smoke/alarm/header/index.vue
@@ -0,0 +1,120 @@
+<template>
+ <div class="header">
+ <el-form :inline="true" :model="seachData" class="demo-form-inline">
+
+ <el-form-item label="">
+ <el-select
+ style="width: 120px"
+ v-model="seachData.msgType"
+ placeholder="娑堟伅绫诲瀷"
+ >
+ <el-option
+ v-for="item in msgTypeOptions"
+ :key="item.label"
+ :label="item.label"
+ :value="item.value"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+
+ <el-form-item label="">
+ <el-date-picker
+ v-model="seachData.alarmTime"
+ type="daterange"
+ align="right"
+ unlink-panels
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :picker-options="pickerOptions"
+ >
+ </el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="getList">鍒锋柊</el-button>
+ <el-button type="primary" @click="resetAll">閲嶇疆</el-button>
+
+ <el-button type="primary" @click="exportTableData"
+ >瀵煎嚭</el-button
+ >
+ </el-form-item>
+ </el-form>
+ </div>
+</template>
+
+<script>
+import realTimeApi from "@/api/smoke/realTime";
+
+export default {
+ data() {
+ return {
+ msgTypeOptions: [
+ {
+ label: "瓒呮爣",
+ value: "ExceedStandard",
+ },
+ {
+ label: "寮傚父绂荤嚎",
+ value: "AbnormalOffline",
+ }
+ ],
+
+ seachData: {},
+ pickerOptions: {
+ shortcuts: [
+ {
+ text: "鏈�杩戜竴鍛�",
+ onClick(picker) {
+ const end = new Date();
+ const start = new Date();
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+ picker.$emit("pick", [start, end]);
+ },
+ },
+ {
+ text: "鏈�杩戜竴涓湀",
+ onClick(picker) {
+ const end = new Date();
+ const start = new Date();
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+ picker.$emit("pick", [start, end]);
+ },
+ },
+ {
+ text: "鏈�杩戜笁涓湀",
+ onClick(picker) {
+ const end = new Date();
+ const start = new Date();
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+ picker.$emit("pick", [start, end]);
+ },
+ },
+ ],
+ },
+ };
+ },
+ created() { },
+ mounted() {
+ },
+ methods: {
+
+ resetAll() {
+ this.seachData = {};
+ this.$emit("getList", { seachData: this.seachData });
+ },
+ getList() {
+ this.$emit("getList", { seachData: this.seachData });
+ },
+ exportTableData() {
+ this.$emit("exportTable", { seachData: this.seachData });
+ }
+ },
+};
+</script>
+
+<style lang="scss" scoped>
+.header {
+ line-height: normal;
+}
+</style>
diff --git a/src/views/smoke/alarm/index.vue b/src/views/smoke/alarm/index.vue
index bd189c7..a56f829 100644
--- a/src/views/smoke/alarm/index.vue
+++ b/src/views/smoke/alarm/index.vue
@@ -1,13 +1,239 @@
<template>
- <div>鎶ヨ娑堟伅</div>
+ <div>
+ <MyHeader @getList="getAlarmList" @exportTable="exportAlarm"></MyHeader>
+ <!-- 鏁版嵁灞曠ず -->
+ <div style="width: 100%; overflow-x: scroll">
+ <el-table
+ border
+ stripe
+ ref="multipleTable"
+ :header-cell-style="{
+ background: '#F5F5F5',
+ 'font-weight': '650',
+ 'line-height': '45px',
+ }"
+ :data="tableData"
+ :row-class-name="tableRowClassName"
+ >
+ <el-table-column label="搴忓彿" type="index" width="60px">
+ </el-table-column>
+ <el-table-column prop="AcquitAtStr" label="鏃堕棿" width="120px">
+ </el-table-column>
+ <el-table-column prop="MsgTypeStr" label="娑堟伅绫诲瀷" width="180px">
+ </el-table-column>
+ <el-table-column prop="Content" label="娑堟伅鍐呭" width="100px">
+ </el-table-column>
+
+ <el-table-column prop="operation" label="鎿嶄綔" width="550px">
+ <template slot-scope="scope">
+ <div class="operation">
+ <span @click="handleUpload(scope.row)">涓婃姤</span>
+ <span class="line">|</span>
+ <span @click="handleDispatch(scope.row)">璋冨害</span>
+ <span class="line">|</span>
+ <span @click="handleLearn(scope.row)">鍦ㄥ涔�</span>
+ <span class="line">|</span>
+ <span @click="handleNotDeal(scope.row)">鏆備笉澶勭悊</span>
+ </div>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ <div class="tools">
+ <div class="pagination">
+ <el-pagination
+ background
+ @prev-click="handlePrev"
+ @next-click="handleNext"
+ :current-page="currentPage"
+ layout="prev, pager, next"
+ :total="totalNum"
+ :page-size="pageSize"
+ @current-change="changeCurrentPage"
+ >
+ </el-pagination>
+ </div>
+ </div>
+ </div>
</template>
<script>
+import MyHeader from "./components/header";
+import realTimeApi from "@/api/smoke/alarm";
export default {
+ data() {
+ return {
+ tableData: [],
+ totalNum: 0,
+ pageSize: 10,
+ currentPage: 1,
+ };
+ },
+ components: { MyHeader },
+ created() {
+ this.getAlarmList();
+ },
+ methods: {
+ getAlarmList(seachData) {
+ let params;
+ if (seachData) {
+ params = this.getParam(seachData);
+ } else {
+ params = {
+ pageNum: this.currentPage,
+ pageSize: this.pageSize,
+ };
+ }
-}
+ realTimeApi
+ .findAlarmList(params)
+ .then(({ list, total }) => {
+ list.forEach((e) => {
+ e.AcquitAtStr = this.dateFormat(
+ "YYYY-mm-dd HH:MM",
+ new Date(e.AcquitAt)
+ );
+ e.FanStatusStr = this.FanStatusStr(e.FanStatus);
+ e.FilterStatusStr = this.FanStatusStr(e.FilterStatus);
+ e.OnlineStatusStr = this.OnlineStatusStr(e.OnlineStatus);
+ e.StatusStr = this.StatusStr(e.Status);
+ });
+ this.tableData = list;
+ this.totalNum = total;
+ })
+ .catch((err) => this.$message.error(err));
+ },
+ exportAlarm(seachData) {
+ let params;
+ if (seachData) {
+ params = this.getParam(seachData);
+ }
+ realTimeApi
+ .exportAlarm(params)
+ .then((res) => {
+ let time = new Date();
+ let deathdate = time.toLocaleDateString();
+ const blob = new Blob([res.data], {
+ type: "application/vnd.ms-excel;charset=utf-8",
+ });
+ if (window.navigator.msSaveBlob) {
+ window.navigator.msSaveBlob(blob, deathdate + "瀹炴椂鏁版嵁" + ".xls");
+ } else {
+ const url = window.URL.createObjectURL(blob);
+ const link = document.createElement("a");
+ link.style.display = "none";
+ link.href = url;
+ link.download = deathdate + "瀹炴椂鏁版嵁" + ".xls";
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+ }
+ this.$message.success("鎿嶄綔鎴愬姛");
+ })
+ .catch((err) => this.$message.error(err));
+ },
+ getParam(seachData) {
+ let params;
+ if (seachData) {
+ const seachParams = seachData.seachData;
+ params = {
+ owner: seachParams.owner == undefined ? null : seachParams.owner,
+ onlineStatus:
+ seachParams.onlineStatus == undefined
+ ? null
+ : seachParams.onlineStatus,
+ status: seachParams.status == undefined ? null : seachParams.status,
+ type: seachParams.type == undefined ? null : seachParams.type,
+ startTime:
+ seachParams.alarmTime == undefined
+ ? null
+ : this.dateFormat(
+ "YYYY-mm-dd HH:MM:SS",
+ seachParams.alarmTime[0]
+ ),
+ endTime:
+ seachParams.alarmTime == undefined
+ ? null
+ : this.dateFormat(
+ "YYYY-mm-dd HH:MM:SS",
+ seachParams.alarmTime[1]
+ ),
+ };
+ }
+ return params;
+ },
+
+ MsgTypeStr(Status) {
+ switch (Status) {
+ case "ExceedStandard":
+ return "瓒呮爣";
+ case "AbnormalOffline":
+ return "寮傚父绂荤嚎";
+ default:
+ return "寮傚父绂荤嚎";
+ }
+ },
+ // 璁剧疆琛ㄦ牸鏂戦┈绾�
+ tableRowClassName({ row, rowIndex }) {
+ if ((rowIndex + 1) % 2 === 0) {
+ return "warning-row";
+ } else {
+ return "success-row";
+ }
+ },
+ // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠�
+ changeCurrentPage(page) {
+ this.currentPage = page;
+ this.getRealTimeList();
+ },
+ // 涓婁竴椤电偣鍑讳簨浠�
+ handlePrev(page) {
+ this.currentPage = page;
+ this.getRealTimeList();
+ },
+ // 涓嬩竴椤电偣鍑讳簨浠�
+ handleNext(page) {
+ this.currentPage = page;
+ this.getRealTimeList();
+ },
+ dateFormat(fmt, date) {
+ let ret;
+ const opt = {
+ "Y+": date.getFullYear().toString(), // 骞�
+ "m+": (date.getMonth() + 1).toString(), // 鏈�
+ "d+": date.getDate().toString(), // 鏃�
+ "H+": date.getHours().toString(), // 鏃�
+ "M+": date.getMinutes().toString(), // 鍒�
+ "S+": date.getSeconds().toString(), // 绉�
+ // 鏈夊叾浠栨牸寮忓寲瀛楃闇�姹傚彲浠ョ户缁坊鍔狅紝蹇呴』杞寲鎴愬瓧绗︿覆
+ };
+ for (let k in opt) {
+ ret = new RegExp("(" + k + ")").exec(fmt);
+ if (ret) {
+ fmt = fmt.replace(
+ ret[1],
+ ret[1].length == 1 ? opt[k] : opt[k].padStart(ret[1].length, "0")
+ );
+ }
+ }
+ return fmt;
+ },
+ },
+};
</script>
-<style>
+<style lang="scss" scoped>
+.el-table {
+ .operation {
+ display: flex;
+ color: var(--operation-color);
+ .line {
+ padding: 0 5px;
+ }
+ span:hover {
+ cursor: pointer;
+ }
+ }
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0