From c2f95b0b9090a2394b5b068582b932a5e57b86aa Mon Sep 17 00:00:00 2001
From: zmc <zmc_li@foxmail.com>
Date: 星期二, 05 九月 2023 18:19:37 +0800
Subject: [PATCH] 雷达图 新增综合风险排名 数据接入配置
---
src/views/data_management/HistoryData.vue | 328 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 328 insertions(+), 0 deletions(-)
diff --git a/src/views/data_management/HistoryData.vue b/src/views/data_management/HistoryData.vue
new file mode 100644
index 0000000..19f4f5d
--- /dev/null
+++ b/src/views/data_management/HistoryData.vue
@@ -0,0 +1,328 @@
+<script>
+import TimeSelectWithShortCuts from '@/sfc/TimeSelectWithShortCuts.vue';
+import ScenarioType from '@/sfc/ScenarioType.vue';
+import InputSearch from '@/sfc/InputSearch.vue';
+
+import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue'
+
+import { useCommonFunction } from '../../utils/common.js';
+import requetsApi from '@/api/exportExcel/requetsApi.js'
+import ButtonClick from '@/sfc/ButtonClick.vue'
+import ButtonExportExcel from '@/sfc/ButtonExportExcel.vue'
+import dayjs from 'dayjs';
+
+export default {
+ components: {
+ TimeSelectWithShortCuts,
+ ScenarioType,
+ InputSearch,
+ ButtonClick,
+ ButtonExportExcel,
+ AreaAndmonitorType
+ },
+ data() {
+ return {
+ form: {
+ // 绔欑偣鍚嶇О
+ name: '',
+ // 璁惧缂栧彿
+ number: '',
+ // 寮�濮嬫椂闂�
+ beginTime: '',
+ // 缁撴潫鏃堕棿
+ endTime: ''
+ },
+ // 杩斿洖鐨勬暟鎹�
+ tableData: [],
+ // 琛ㄦ牸鏁版嵁
+ displayData: [],
+ // 褰撳墠椤�
+ currentPage: 1,
+ // 姣忛〉鏉℃暟
+ pageSize: 20,
+ total: 0,
+ // 鍔犺浇涓�
+ loading: false,
+ queryButton: false,
+ exportButton:false,
+ // 绌虹姸鎬�
+ isNoData: false,
+ // 宸查�変腑鐨勫満鏅被鍨�
+ scenarioType: [],
+ // 琛ㄦ牸楂樺害
+ tableHeight: '500'
+ };
+ },
+ setup() {
+ const { isExceedOneMonth, exportToExcel } = useCommonFunction()
+ return { isExceedOneMonth, exportToExcel }
+ },
+ mounted() {
+ this.backMinuteDataAWeekAgo();
+ this.calTableHeight();
+ },
+
+ methods: {
+ exportDom() {
+
+ let params = {
+ 'beginTime': this.form.beginTime,
+ 'endTime': this.form.endTime,
+ }
+ if (this.form.name) {
+ params['siteName'] = this.form.name;
+ }
+ if (this.form.number) {
+ params['mnCode'] = this.form.numbe;
+ }
+ if (this.scenarioType.length != 0) {
+ params['scenarioType'] = this.scenarioType;
+ }
+ this.exportButton = true
+ requetsApi.fetchAlSiteData(params).then(res => {
+ const data = res.data.data
+ if (data.length != 0) {
+ const tableColumns = [
+ 'name',
+ 'address',
+ 'dutyCompany',
+ 'mnCode',
+ 'typeName',
+ 'dustValue',
+ 'noiseValue',
+ 'lst',
+ 'quality',
+ 'groupName',
+
+ ]
+ const excelColumns = [['A1', '绔欑偣鍚嶇О'],
+ ['B1', '鍦板潃'], ['C1', '渚涘簲鍟�'], ['D1', '璁惧缂栧彿'],
+ ['E1', '绫诲瀷'], ['F1', '鎵皹娴撳害(mg/m鲁)'], ['G1', '鍣０(dB)'],
+ ['H1', '閲囬泦鏃堕棿'], ['I1', '绛夌骇'], ['J1', '鎵�鍦ㄥ尯鍘�']]
+ this.exportToExcel(data, tableColumns, excelColumns, '鍘嗗彶鏁版嵁琛�.xlsx')
+ }else{
+ ElMessage('鏃犳暟鎹渶瑕佸鍑�')
+ }
+ this.exportButton = false
+ })
+ },
+ // 鍔熻兘锛氳〃鏍奸珮搴︽牴鎹唴瀹硅嚜閫傚簲
+ calTableHeight() {
+ const h1 = this.$refs.h1.$el.offsetHeight;
+ const h2 = this.$refs.h2.$el.offsetHeight;
+ // 鍏朵腑涓�涓�40鏄洅瀛愮殑鎬诲杈硅窛
+ this.tableHeight = `calc(100vh - ${h1}px - ${h2}px - 40px - 40px - var(--el-main-padding) * 2`;
+ },
+ giveTime(val) {
+ //灏嗕腑鍥芥爣鍑嗘椂闂磋浆涓烘寚瀹氭牸寮�(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�)
+ this.form.beginTime = dayjs(val[0]).format('YYYY-MM-DD HH:mm:ss');
+ this.form.endTime = dayjs(val[1]).format('YYYY-MM-DD HH:mm:ss');
+ },
+ // 椤靛ぇ灏忔敼鍙樻椂瑙﹀彂
+ handleSizeChange(val) {
+ this.pageSize = val;
+
+ // 鏀瑰彉姣忛〉鏄剧ず鏁扮洰鏃惰烦鍒板綋鍓嶉〉
+ this.handleCurrentChange(1);
+ },
+
+ // 椤靛彿鏀瑰彉鏃惰Е鍙�
+ handleCurrentChange(val) {
+ console.log('褰撳墠椤典负锛�', val);
+ // 灏嗗綋鍓嶉〉鍙风粰currentPage
+ this.currentPage = val;
+
+ // 椤甸潰鍙樺寲鏃惰皟鐢� 鏌ヨ鏁版嵁鍑芥暟
+ this.handleSubmit();
+ },
+ //搴忓彿閫掑
+ indexMethod(index) {
+ return index + 1 + (this.currentPage - 1) * this.pageSize;
+ },
+
+ // 鏌ヨ鏁版嵁
+ handleSubmit() {
+ // if (this.isExceedOneMonth(this.form.beginTime, this.form.endTime)) {
+ // alert('鏃堕棿璺ㄥ害涓嶈兘瓒呰繃涓�涓湀');
+ // return;
+ // }
+ this.loading = true;
+ this.queryButton = true
+ let params = {};
+ params['page'] = this.currentPage;
+ params['pageSize'] = this.pageSize;
+ if (this.form.name) {
+ params['siteName'] = this.form.name;
+ }
+ if (this.form.number) {
+ params['mnCode'] = this.form.number;
+ }
+ params['beginTime'] = this.form.beginTime;
+ params['endTime'] = this.form.endTime;
+ if (this.scenarioType.length != 0) {
+ params['scenarioType'] = this.scenarioType.join();
+ }
+
+ this.$http.get('/dust/history1', { params: params }).then((response) => {
+ // 淇濆瓨杩斿洖鐨�
+ this.tableData = response.data.data.rows;
+ this.displayData = this.tableData;
+ this.loading = false;
+ this.queryButton = false
+ if (response.data.data.total == 0) {
+ ElMessage('璇ユ椂娈垫棤鏁版嵁');
+ this.loading = false;
+ this.queryButton = false
+ this.isNoData = true;
+ return;
+ }
+ this.total = response.data.data.total;
+ // 绉婚櫎绌烘暟鎹姸鎬�
+ this.isNoData = false;
+ });
+ },
+ backMinuteDataAWeekAgo() {
+ // 鎵撳紑椤甸潰鍔犺浇鏈�杩戜竴鍛ㄧ殑鏁版嵁
+ this.loading = true;
+ // 缁欒緭鍏ユ璁剧疆榛樿鐨勯�夋嫨椤�
+
+ let params = {};
+ params['siteName'] = this.form.name;
+ params['beginTime'] = this.form.beginTime;
+ params['endTime'] = this.form.endTime;
+
+ this.$http.get('/dust/history1', { params: params }).then((response) => {
+ // 淇濆瓨杩斿洖鐨�
+ this.tableData = response.data.data.rows;
+ this.displayData = this.tableData;
+
+ if (response.data.data.total == 0) {
+ ElMessage('璇ユ椂娈垫棤鏁版嵁');
+ this.isNoData = true;
+ return;
+ }
+ this.total = response.data.data.total;
+ this.loading = false;
+ });
+ }
+ }
+};
+</script>
+
+<template>
+ <el-row>
+ <el-col ref="h1" class="head-row">
+ <el-card>
+ <el-form :inline="true">
+ <div class="demo-form-inline">
+ <el-row>
+ <el-col>
+
+ <el-form-item>
+ <AreaAndmonitorType></AreaAndmonitorType>
+ </el-form-item>
+ <el-form-item>
+ <template #label> </template>
+ <InputSearch isNeedDefaultSite="1" @submit-value="(n) => (form.name = n)">
+ </InputSearch>
+ </el-form-item>
+ <el-form-item>
+ <template #label>
+ <span class="font-label">璁惧缂栧彿:</span>
+ </template>
+ <el-input v-model="form.number" clearable placeholder="璇疯緭鍏�"></el-input>
+ </el-form-item>
+ <el-form-item>
+ <ScenarioType @submitScenarioType="(val) => (scenarioType = val)">
+ </ScenarioType>
+ </el-form-item>
+ </el-col>
+ <el-form-item>
+ <TimeSelectWithShortCuts @submit-time="giveTime"></TimeSelectWithShortCuts>
+ </el-form-item>
+ </el-row>
+ </div>
+ <div class="button-and-export">
+ <el-form-item>
+ <!-- <el-button
+ type="primary"
+ @click="handleSubmit"
+ style="margin-left: 10px"
+ ><el-icon style="margin-right: 6px;font-size: 1.2em;"><i-ep-Search/></el-icon>鏌ヨ</el-button
+ >
+ <el-button type="success" @click="exportDom" round><el-icon style="margin-right: 6px;margin-bottom:2px;font-size: 1.2em;"><i-ep-Download ></i-ep-Download></el-icon>瀵煎嚭鏁版嵁</el-button> -->
+ <ButtonClick style="margin-right: 12px;" content="鎼滅储" type="primary" :loading="queryButton" @do-search="handleSubmit"></ButtonClick>
+ <ButtonExportExcel content="瀵煎嚭鏁版嵁" type="success" :loading="exportButton" @do-export="exportDom"></ButtonExportExcel>
+ </el-form-item>
+ </div>
+ </el-form>
+ </el-card>
+ </el-col>
+ </el-row>
+
+ <el-row>
+ <el-col v-show="!isNoData">
+
+ <el-table border size="default" :highlight-current-row="true" :data="displayData" :height="tableHeight"
+ v-loading="loading">
+ <!--缁戝畾涓�涓柟娉曪紝灏嗚繑鍥炲�艰祴缁檌ndex,鍗宠〃鏍兼瘡琛屾暟鎹殑涓嬫爣-->
+ <el-table-column type="index" label="搴忓彿" align="center" fixed :index="indexMethod"></el-table-column>
+ <el-table-column prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="address" label="鍦板潃" align="center" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="dutyCompany" label="渚涘簲鍟�" align="center" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="mnCode" label="璁惧缂栧彿" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="typeName" label="绫诲瀷" align="center" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="dustValue" label="鎵皹娴撳害(mg/m鲁)" align="center" sortable
+ show-overflow-tooltip></el-table-column>
+ <el-table-column prop="noiseValue" label="鍣０(dB)" align="center" sortable show-overflow-tooltip></el-table-column>
+ <el-table-column prop="lst" label="閲囬泦鏃堕棿" sortable align="center" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="quality" label="绛夌骇" align="center" show-overflow-tooltip></el-table-column>
+ <el-table-column prop="groupName" label="鎵�鍦ㄥ尯鍘�" align="center" show-overflow-tooltip>
+ </el-table-column>
+ </el-table>
+ <!--size-change 鏄痯ageSize 鏀瑰彉鏃朵細瑙﹀彂鐨勪簨浠�,handleSizeChange鏄簨浠跺鐞嗗嚱鏁�
+ current-change 鏄痗urrentPage 鏀瑰彉鏃朵細瑙﹀彂鐨勪簨浠� -->
+
+ <el-pagination ref="h2" background @size-change="handleSizeChange" @current-change="handleCurrentChange"
+ :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="total"
+ layout="total,sizes, prev, pager, next, jumper" :current-page="currentPage"></el-pagination>
+
+ </el-col>
+ <el-empty v-show="isNoData" :image-size="200" />
+
+ </el-row>
+</template>
+
+<style lang="scss" scoped>
+// 鏁翠綋宸﹀杈硅窛
+.el-row {
+ margin-left: 10px;
+}
+
+.head-row {
+ margin: 10px 0px;
+}
+
+.el-card {
+ border-radius: 9px;
+}
+
+.font-label {
+ margin-top: 3px;
+ font-weight: bold;
+}
+
+.demo-form-inline {
+ display: flex;
+}
+
+.button-and-export {
+ display: flex;
+ justify-content: flex-end;
+ /* 浠庤灏句綅缃紑濮嬫帓鍒� */
+}
+
+.el-pagination {
+ margin: 10px 0px;
+}
+</style>
--
Gitblit v1.9.3