|
|
@@ -0,0 +1,282 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div class="query mg-b-8">
|
|
|
+ <div class="query-items">
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">光伏：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-select
|
|
|
+ v-model="stationId"
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ popper-class="select"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in ChangZhan"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.stationName"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">描述：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-input v-model="alarmDesc" placeholder="报警描述"></el-input>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">等级：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-select
|
|
|
+ v-model="level"
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ popper-class="select"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in levelArray"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">开始日期：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="startDate"
|
|
|
+ type="datetime"
|
|
|
+ placeholder="开始日期"
|
|
|
+ popper-class="date-select"
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ ></el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">结束日期：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="endDate"
|
|
|
+ type="datetime"
|
|
|
+ placeholder="开始日期"
|
|
|
+ popper-class="date-select"
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ ></el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-actions">
|
|
|
+ <button class="btn green" @click="getTable()">查询</button>
|
|
|
+ <button class="btn green" @click="exportExcel()">导出</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="table-box">
|
|
|
+ <div class="title">光伏报警</div>
|
|
|
+ <ComTable
|
|
|
+ ref="curRef"
|
|
|
+ :data="tableData"
|
|
|
+ :pageSize="20"
|
|
|
+ @onPagging="onChangePage"
|
|
|
+ @sizeChange="sizeChange"
|
|
|
+ @pageClick="pageClick"
|
|
|
+ height="68vh"
|
|
|
+ v-loading="tableLoading"
|
|
|
+ element-loading-text="拼命加载中.."
|
|
|
+ element-loading-background="rgba(0, 0, 0, 0.8)"
|
|
|
+ ></ComTable>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import ComTable from "@/components/coms/table/table.vue";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "scadaAlarm",
|
|
|
+ components: { ComTable },
|
|
|
+ data() {
|
|
|
+ let that = this;
|
|
|
+ return {
|
|
|
+ ChangZhan: [],
|
|
|
+ stationId: "AK_GDC",
|
|
|
+ wtId: "",
|
|
|
+ alarmDesc: "",
|
|
|
+ levelArray: [
|
|
|
+ {
|
|
|
+ id: "",
|
|
|
+ name: "请选择",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "1",
|
|
|
+ name: "低",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "2",
|
|
|
+ name: "中低",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "3",
|
|
|
+ name: "中",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "4",
|
|
|
+ name: "中高",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: "5",
|
|
|
+ name: "高",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ level: "",
|
|
|
+ partsArray: [],
|
|
|
+ partsMap: {},
|
|
|
+ partsId: "",
|
|
|
+ startDate: "",
|
|
|
+ endDate: "",
|
|
|
+ tableLoading: true,
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ tableData: {
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ name: "光伏",
|
|
|
+ field: "stationName",
|
|
|
+ is_num: false,
|
|
|
+ is_light: false,
|
|
|
+ sortable: true,
|
|
|
+ id: "id",
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ name: "报警时间",
|
|
|
+ field: "alertTime",
|
|
|
+ is_num: false,
|
|
|
+ is_light: false,
|
|
|
+ sortable: true,
|
|
|
+ id: "id",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "报警描述",
|
|
|
+ field: "alertText",
|
|
|
+ is_num: false,
|
|
|
+ is_light: false,
|
|
|
+ sortable: true,
|
|
|
+ id: "id",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "报警类别",
|
|
|
+ field: "category2",
|
|
|
+ is_num: false,
|
|
|
+ is_light: false,
|
|
|
+ sortable: true,
|
|
|
+ id: "id",
|
|
|
+ template: function (row) {
|
|
|
+ return '光伏'
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "报警等级",
|
|
|
+ field: "rank",
|
|
|
+ is_num: false,
|
|
|
+ is_light: false,
|
|
|
+ sortable: true,
|
|
|
+ id: "id",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ data: [],
|
|
|
+ currentPageTotal: 0,
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.ChangZhanVal();
|
|
|
+ let end = new Date();
|
|
|
+ let start = new Date(end.getTime() - 1 * 24 * 60 * 60 * 1000);
|
|
|
+ this.endDate = end.formatDate("yyyy-MM-dd hh:mm:ss");
|
|
|
+ this.startDate = start.formatDate("yyyy-MM-dd hh:mm:ss");
|
|
|
+ this.getTable();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 场站
|
|
|
+ ChangZhanVal() {
|
|
|
+ var that = this;
|
|
|
+ that.API.requestData({
|
|
|
+ method: "GET",
|
|
|
+ baseURL: "http://192.168.1.14:8011/",
|
|
|
+ subUrl: "thing/station",
|
|
|
+ success(res) {
|
|
|
+ that.ChangZhan = res.filter(o => o.id.includes('GDC'));
|
|
|
+ that.stationId = res[0].id;
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getTable() {
|
|
|
+ let that = this;
|
|
|
+ this.tableLoading = true;
|
|
|
+ this.API.requestData({
|
|
|
+ timeout: 30000,
|
|
|
+ method: "GET",
|
|
|
+ baseURL: "http://192.168.1.14:8075/",
|
|
|
+ subUrl: "alarm/history/page",
|
|
|
+ data: {
|
|
|
+ category1: "GF",
|
|
|
+ stationid: this.stationId,
|
|
|
+ starttime: this.startDate,
|
|
|
+ endtime: this.endDate,
|
|
|
+ category2: '',
|
|
|
+ keyword: this.alarmDesc,
|
|
|
+ windturbineid: '',
|
|
|
+ pagenum: this.pageIndex,
|
|
|
+ pagesize: this.pageSize,
|
|
|
+ rank: that.level,
|
|
|
+ },
|
|
|
+ success(res) {
|
|
|
+ if (res) {
|
|
|
+ res.records.forEach((ele, index) => {
|
|
|
+ ele.rank = that.levelArray[parseInt(ele.rank)]?.name;
|
|
|
+ });
|
|
|
+ that.tableData.data = res.records;
|
|
|
+ that.tableData.total = res.total;
|
|
|
+ } else {
|
|
|
+ that.tableData.data = [];
|
|
|
+ that.tableData.total = 0;
|
|
|
+ }
|
|
|
+ that.tableLoading = false;
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onChangePage(params) {
|
|
|
+ this.pageIndex = params.pageIndex;
|
|
|
+ this.pageSize = params.pageSize;
|
|
|
+ this.getTable();
|
|
|
+ console.log("页码切换:", params);
|
|
|
+ },
|
|
|
+
|
|
|
+ sizeChange(res) {
|
|
|
+ console.log("每页数量:", res);
|
|
|
+ },
|
|
|
+
|
|
|
+ pageClick(res) {
|
|
|
+ console.log("页码:", res);
|
|
|
+ },
|
|
|
+
|
|
|
+ exportExcel() {
|
|
|
+ let excelData = this.BASE.deepCopy(this.tableData);
|
|
|
+ // excelData.data.forEach((ele) => {
|
|
|
+ // ele["category2"] = this.partsMap[ele["category2"]];
|
|
|
+ // });
|
|
|
+ this.BASE.exportExcel(excelData, "光伏报警");
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="less">
|
|
|
+.title {
|
|
|
+ background: rgba(255, 255, 255, 0.1);
|
|
|
+ margin-bottom: 8px;
|
|
|
+ padding: 1vh;
|
|
|
+}
|
|
|
+</style>
|
moccus