From c068a9cbaca1c984590c14b8851e97486bfdb430 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期五, 06 十月 2023 21:05:57 +0800
Subject: [PATCH] 导出功能
---
src/views/smoke/realTime/index.vue | 149 ++++++++++------
src/views/smoke/realTime/components/header/index.vue | 343 +++++++++++++++++++------------------
src/api/smoke/realTime.js | 4
3 files changed, 272 insertions(+), 224 deletions(-)
diff --git a/src/api/smoke/realTime.js b/src/api/smoke/realTime.js
index 9849483..6087d48 100644
--- a/src/api/smoke/realTime.js
+++ b/src/api/smoke/realTime.js
@@ -13,4 +13,8 @@
getInTimeCount: () => {
return http.get('/sccg/smoke/inTime/count');
},
+ // 瀵煎嚭瀹炴椂鏁版嵁
+ exportInTime: (params) => {
+ return http.downloadFile('/sccg/smoke/inTime/export', params);
+ },
}
\ No newline at end of file
diff --git a/src/views/smoke/realTime/components/header/index.vue b/src/views/smoke/realTime/components/header/index.vue
index bcfb6fb..5618876 100644
--- a/src/views/smoke/realTime/components/header/index.vue
+++ b/src/views/smoke/realTime/components/header/index.vue
@@ -1,185 +1,198 @@
<template>
- <div class="header">
- <el-form :inline="true" :model="seachData" class="demo-form-inline">
- <el-form-item label="">
- <el-select
- style="width: 140px"
- v-model="seachData.ownerIndex"
- placeholder="鎵�灞炲崟浣�"
- >
- <el-option
- v-for="(item, index) in ownerOptions"
- :key="item.Id"
- :label="item.Name"
- :value="index"
- >
- </el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="">
- <el-select
- style="width: 120px"
- v-model="seachData.status"
- placeholder="鎺掓斁鐘舵��"
- >
- <el-option
- v-for="item in statusOptions"
- :key="item.label"
- :label="item.label"
- :value="item.value"
- >
- </el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="">
- <el-select
- style="width: 120px"
- v-model="seachData.onlineStatus"
- placeholder="鏁翠綋鐘舵��"
- >
- <el-option
- v-for="item in onlineStatusOptions"
- :key="item.label"
- :label="item.label"
- :value="item.value"
- >
- </el-option>
- </el-select>
- </el-form-item>
+ <div class="header">
+ <el-form :inline="true" :model="seachData" class="demo-form-inline">
+ <el-form-item label="">
+ <el-select
+ style="width: 140px"
+ v-model="seachData.ownerIndex"
+ placeholder="鎵�灞炲崟浣�"
+ >
+ <el-option
+ v-for="(item, index) in ownerOptions"
+ :key="item.Id"
+ :label="item.Name"
+ :value="index"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="">
+ <el-select
+ style="width: 120px"
+ v-model="seachData.status"
+ placeholder="鎺掓斁鐘舵��"
+ >
+ <el-option
+ v-for="item in statusOptions"
+ :key="item.label"
+ :label="item.label"
+ :value="item.value"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="">
+ <el-select
+ style="width: 120px"
+ v-model="seachData.onlineStatus"
+ placeholder="鏁翠綋鐘舵��"
+ >
+ <el-option
+ v-for="item in onlineStatusOptions"
+ :key="item.label"
+ :label="item.label"
+ :value="item.value"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
- <el-form-item>
- <el-radio v-model="seachData.type" label="1">鐩戞帶璁惧</el-radio>
- <el-radio v-model="seachData.type" label="2">鐩戞祴璁惧</el-radio>
- </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="getUserList">鍒锋柊</el-button>
+ <el-form-item>
+ <el-radio v-model="seachData.type" label="1">鐩戞帶璁惧</el-radio>
+ <el-radio v-model="seachData.type" label="2">鐩戞祴璁惧</el-radio>
+ </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>
+ <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 {
- onlineStatusOptions: [
- {
- label: "姝ｅ父",
- value: "NORMAL",
- },
- {
- label: "棰勮",
- value: "ALARM",
- },
- {
- label: "瓒呮爣",
- value: "EXCESS",
- },
- {
- label: "绂荤嚎",
- value: "DOWN",
- },
- {
- label: "寮傚父绂荤嚎",
- value: "OFF",
- },
- ],
- statusOptions: [
- {
- label: "姝ｅ父",
- value: 1,
- },
- {
- label: "绂荤嚎",
- value: 2,
- },
- {
- label: "寮傚父绂荤嚎",
- value: 3,
- },
- ],
- ownerOptions: [],
- 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]);
+ data() {
+ return {
+ onlineStatusOptions: [
+ {
+ label: "姝ｅ父",
+ value: 1,
+ },
+ {
+ label: "绂荤嚎",
+ value: 2,
+ },
+ {
+ label: "寮傚父绂荤嚎",
+ value: 3,
+ },
+ ],
+ statusOptions: [
+ {
+ label: "姝ｅ父",
+ value: "NORMAL",
+ },
+ {
+ label: "棰勮",
+ value: "ALARM",
+ },
+ {
+ label: "瓒呮爣",
+ value: "EXCESS",
+ },
+ {
+ label: "绂荤嚎",
+ value: "DOWN",
+ },
+ {
+ label: "寮傚父绂荤嚎",
+ value: "OFF",
+ },
+ ],
+ ownerOptions: [],
+ 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]);
+ },
+ },
+ ],
},
- },
- {
- 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() {
- this.getOwnerOptions();
- },
- methods: {
- // 鑾峰彇鎵�灞炲崟浣�
- getOwnerOptions() {
- const param = { pageSize: 100, pageNum: 1 };
- realTimeApi
- .findCustomerList(param)
- .then((res) => {
- this.ownerOptions = res.list;
- })
- .catch((err) => this.$message.error(err));
+ };
},
-
- getUserList() {
- const ownerItem = this.ownerOptions[this.seachData.ownerIndex];
- this.seachData.owner = ownerItem.Pid + ownerItem.Id;
- this.$emit("getList", { seachData: this.seachData });
+ created() { },
+ mounted() {
+ this.getOwnerOptions();
},
- exportTableData(){
+ methods: {
+ // 鑾峰彇鎵�灞炲崟浣�
+ getOwnerOptions() {
+ const param = { pageSize: 100, pageNum: 1 };
+ realTimeApi
+ .findCustomerList(param)
+ .then((res) => {
+ this.ownerOptions = res.list;
+ })
+ .catch((err) => this.$message.error(err));
+ },
- }
- },
+ resetAll() {
+ this.seachData = {};
+ this.$emit("getList", { seachData: this.seachData });
+ },
+ getList() {
+ if (this.seachData.ownerIndex !== undefined) {
+ const ownerItem = this.ownerOptions[this.seachData.ownerIndex];
+ this.seachData.owner = ownerItem.Pid + ownerItem.Id + "/";
+ }
+ this.$emit("getList", { seachData: this.seachData });
+ },
+ exportTableData() {
+ if (this.seachData.ownerIndex !== undefined) {
+ const ownerItem = this.ownerOptions[this.seachData.ownerIndex];
+ this.seachData.owner = ownerItem.Pid + ownerItem.Id + "/";
+ }
+ this.$emit("exportTable", { seachData: this.seachData });
+ }
+ },
};
</script>
<style lang="scss" scoped>
.header {
- line-height: normal;
+ line-height: normal;
}
</style>
diff --git a/src/views/smoke/realTime/index.vue b/src/views/smoke/realTime/index.vue
index 09f4a4e..00a65c3 100644
--- a/src/views/smoke/realTime/index.vue
+++ b/src/views/smoke/realTime/index.vue
@@ -1,6 +1,9 @@
<template>
<div>
- <MyHeader @getList="getRealTimeList"></MyHeader>
+ <MyHeader
+ @getList="getRealTimeList"
+ @exportTable="exportInTime"
+ ></MyHeader>
<!-- 鏁版嵁灞曠ず -->
<div style="width: 100%; overflow-x: scroll">
<el-table
@@ -148,43 +151,7 @@
getRealTimeList(seachData) {
let params;
if (seachData) {
- params = {
- pageNum: this.currentPage,
- pageSize: this.pageSize,
- resource:
- seachData.seachData.resource == undefined
- ? null
- : seachData.seachData.resource,
- region:
- seachData.seachData.region == undefined
- ? null
- : seachData.seachData.region,
- type: this.statusArr[1] ?? null,
- code:
- seachData.seachData.code == undefined
- ? null
- : seachData.seachData.code,
- categoryBig:
- seachData.seachData.categoryBig == undefined
- ? null
- : seachData.seachData.categoryBig,
- categorySmall:
- seachData.seachData.categorySmall == undefined
- ? null
- : seachData.seachData.categorySmall,
- site:
- seachData.seachData.site == undefined
- ? null
- : seachData.seachData.site,
- street:
- seachData.seachData.street == undefined
- ? null
- : seachData.seachData.street,
- alarmTime:
- seachData.seachData.alarmTime == undefined
- ? null
- : seachData.seachData.alarmTime,
- };
+ params = this.getParam(seachData)
} else {
params = {
pageNum: this.currentPage,
@@ -196,7 +163,7 @@
.findInTimeList(params)
.then(({ list, total }) => {
list.forEach(e => {
- e.AcquitAtStr = this.Dateformat(e.AcquitAt);
+ 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)
@@ -207,6 +174,72 @@
})
.catch((err) => this.$message.error(err));
},
+ exportInTime(seachData) {
+ let params;
+ if (seachData) {
+ params = this.getParam(seachData)
+ }
+ realTimeApi
+ .exportInTime(params)
+ .then((res) => {
+ debugger
+ 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;
+ },
+
FanStatusStr(FanStatus) {
switch (FanStatus) {
case 1:
@@ -264,28 +297,26 @@
this.currentPage = page;
this.getRealTimeList();
},
- Dateformat(fmt) {
- var fmtdate = new Date(fmt)
- var o = {
- "M+": fmtdate.getMonth() + 1, //鏈堜唤
- "d+": fmtdate.getDate(), //鏃�
- "h+": fmtdate.getHours(), //灏忔椂
- "m+": fmtdate.getMinutes(), //鍒�
- "s+": fmtdate.getSeconds(), //绉�
- "q+": Math.floor((fmtdate.getMonth() + 3) / 3), //瀛ｅ害
- "S": fmtdate.getMilliseconds() //姣
+ 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() // 绉�
+ // 鏈夊叾浠栨牸寮忓寲瀛楃闇�姹傚彲浠ョ户缁坊鍔狅紝蹇呴』杞寲鎴愬瓧绗︿覆
};
- if (/(y+)/.test(fmt)) {
- fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
- }
- for (var k in o) {
- if (new RegExp("(" + k + ")").test(fmt)) {
- fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
- }
- }
+ 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>
--
Gitblit v1.8.0