From f3acb8ce787f3df0eda633031473be4e6a9ff448 Mon Sep 17 00:00:00 2001
From: zmc <zmc_li@foxmail.com>
Date: 星期四, 12 十月 2023 16:56:28 +0800
Subject: [PATCH] 油烟 更新了实时监控页面
---
src/views/analysis/HomePage.vue | 211 +++++++++++++++++++++++++++++++++-------------------
1 files changed, 133 insertions(+), 78 deletions(-)
diff --git a/src/views/analysis/HomePage.vue b/src/views/analysis/HomePage.vue
index ba8ce9d..0161f33 100644
--- a/src/views/analysis/HomePage.vue
+++ b/src/views/analysis/HomePage.vue
@@ -1,16 +1,15 @@
<template>
- <div>
- <!-- <el-header> -->
- <el-card class="box-card">
- <el-form :inline="true" class="demo-form-inline">
-
- <el-radio disabled v-model="radio" label="閫変腑涓旂鐢�" style="margin-top: 15px;">寰愭眹鍖� 澶╄��妗� 鐢颁笂鍧�</el-radio>
- <el-form-item label="搴楅摵鍚�" class="form-lable">
- <el-input v-model="shopname" placeholder="搴楅摵鍚�"></el-input>
- </el-form-item>
+ <div class="page-header">
- <el-select v-model="value" placeholder="璇烽�夋嫨" >
+ <el-radio disabled v-model="radio" label="閫変腑涓旂鐢�" >寰愭眹鍖� 澶╅挜妗� 鐢板皻鍧�</el-radio>
+
+ <div class="page-label" >
+ <span class="shop-label">搴楅摵鍚�</span>
+ <div>
+ <el-input v-model="shopname" placeholder="搴楅摵鍚�"></el-input>
+ </div>
+ <el-select v-model="value" placeholder="璇烽�夋嫨" >
<el-option
v-for="item in options"
:key="item.value"
@@ -18,53 +17,47 @@
:value="item.value">
</el-option>
</el-select>
-
- <el-form-item label="寮�濮嬫棩鏈�" class="form-time-lable1">
+ </div>
+ <div class="time-label">
+ <span>寮�濮嬫棩鏈� </span>
<el-date-picker
v-model="begin"
- type="date"
+ type="datetime"
placeholder="閫夋嫨鏃ユ湡"
- value-format="YYYY-MM-DD">
+ value-format="YYYY-MM-DD HH:mm:ss">
</el-date-picker>
- </el-form-item>
-
- <el-form-item label="缁撴潫鏃ユ湡" class="form-time-lable2">
+</div>
+<div class="time-label">
+ <span>缁撴潫鏃ユ湡 </span>
<el-date-picker
v-model="end"
- type="date"
+ type="datetime"
placeholder="閫夋嫨鏃ユ湡"
- value-format="YYYY-MM-DD">
+ value-format="YYYY-MM-DD HH:mm:ss">
</el-date-picker>
- </el-form-item>
-
- <el-form-item>
- <el-button type="primary" @click="isRepeat">缁熻鍒嗘瀽</el-button>
- <el-button type="primary" @click="toSql">鍏ュ簱绠＄悊</el-button>
- </el-form-item>
+</div>
+ <!-- </el-form-item> -->
+</div>
+ <div style="display: flex; justify-content: right; margin-right: 160px;">
+ <el-button type="primary" :loading="button.statisticsButton" @click="isRepeat">缁熻鍒嗘瀽</el-button>
+ <el-button type="primary" :loading="button.WarehousingButton" @click="toSql">鍏ュ簱绠＄悊</el-button>
+</div>
- <!-- <span style="margin-left: 200px; ">鍒嗘瀽鑰楁椂锛歿{gapT}}ms</span>
- <el-divider direction="vertical"></el-divider>
- <span>缁撴灉鏉℃暟锛歿{total}}</span>
- <el-divider direction="vertical"></el-divider>
- <span>宸插啓鍏ユ暟鎹簱锛歿{isWrite}}</span> -->
- <!-- <br/> -->
- <div>
- <span style="margin-left: 1400px; ">鍒嗘瀽鑰楁椂锛歿{gapT}}ms</span>
+
+ <div style="display: flex; justify-content: right; margin-right: 110px;">
+ <span >鍒嗘瀽鑰楁椂锛歿{gapT}}ms</span>
<el-divider direction="vertical"></el-divider>
<span>缁撴灉鏉℃暟锛歿{total}}</span>
<el-divider direction="vertical"></el-divider>
</div>
<br/>
- </el-form>
- </el-card>
- <!-- </el-header> -->
- <!-- <el-main> -->
- <div class="table">
- <el-table :data="displayData" border="" id="table" ref="table" height="650px" >
- <el-table-column type="index" label="搴忓彿" :index="indexMethod" v-if="showColumn.num"> </el-table-column> <!--缁戝畾涓�涓柟娉曪紝灏嗚繑鍥炲�艰祴缁檌ndex,鍗宠〃鏍兼瘡琛屾暟鎹殑涓嬫爣-->
- <el-table-column prop="fumeDevId" label="璁惧缂栧彿" v-if="showColumn.deviceid" fixed> </el-table-column>
+ <div class="table" v-show="!isNoData" v-loading="loading">
+ <el-table :data="displayData" border="" id="table" ref="table" height="500px" >
+ <el-table-column type="index" label="搴忓彿" :index="indexMethod" v-if="showColumn.num" fixed> </el-table-column> <!--缁戝畾涓�涓柟娉曪紝灏嗚繑鍥炲�艰祴缁檌ndex,鍗宠〃鏍兼瘡琛屾暟鎹殑涓嬫爣-->
+ <el-table-column prop="diName" label="搴楅摵鍚嶇О" v-if="showColumn.diName"> </el-table-column>
+ <el-table-column prop="fumeDevId" label="璁惧缂栧彿" v-if="showColumn.deviceid" > </el-table-column>
<el-table-column prop="fumeDate" label="鏃ユ湡" v-if="showColumn.date"> </el-table-column>
<el-table-column prop="fumeDayMin" label="鏃ユ渶灏忓��" v-if="showColumn.min"></el-table-column>
<el-table-column prop="fumeDayMax" label="鏃ユ渶澶у��" v-if="showColumn.max"> </el-table-column>
@@ -117,6 +110,7 @@
<div class="head">閫夋嫨鏄剧ず瀛楁</div>
<div class="body">
<el-checkbox v-model="checkList.num" disabled>缂栧彿</el-checkbox>
+ <el-checkbox v-model="checkList.diName" disabled>搴楅摵鍚嶇О</el-checkbox>
<el-checkbox v-model="checkList.deviceid" disabled>璁惧缂栧彿</el-checkbox>
<el-checkbox v-model="checkList.date">鏃ユ湡</el-checkbox>
<el-checkbox v-model="checkList.min">鏃ユ渶灏忓��</el-checkbox>
@@ -149,19 +143,25 @@
</div>
</div>
</transition>
- <!-- </el-main> -->
</div>
- </div>
-
+ <el-empty v-show="isNoData" :image-size="200" />
</template>
<script>
-import axios from 'axios'
+import axiosInstanceInstance from '../../utils/request.js'
export default {
data() {
return {
+ button:{
+ // 缁熻鍒嗘瀽鎸夐挳
+ statisticsButton:false,
+ // 鍏ュ簱鎸夐挳
+ WarehousingButton:false
+ },
+ isNoData:true,
+ loading:false,
radio: '閫変腑涓旂鐢�',
gapT:0, //鍒嗘瀽鐨勮繃绋嬫柟娉曡�楁椂
isRepeated:0, //0 涓嶉噸澶� 1閲嶅
@@ -178,6 +178,7 @@
checkList: {},
showColumn: {
num:true,
+ diName:true,
deviceid:true,
date:true,
min:true,
@@ -258,6 +259,7 @@
this.checkList = {
num:true,
deviceid:true,
+ diName:true,
date:true,
min:true,
max:true,
@@ -289,8 +291,6 @@
//鍒嗘瀽鏁版嵁
analysisData(){
-
-
let startTime=new Date().getTime();
let params = {}
if (this.shopname) {
@@ -306,10 +306,19 @@
params['end'] = this.end
}
-axios.get('http://localhost:8080/data/input',{params:params})
+ axiosInstanceInstance.get('/data/input',{params:params})
.then(response => {
this.afterAnalysis = response.data.data
+ this.loading = false
console.log('杩斿洖鐨勬暟鎹负',response.data.data);
+ if(response.data.data.length==0){
+ alert('璇ユ椂娈垫棤鏁版嵁')
+ this.isNoData = true
+ return
+ }
+ // 绉婚櫎绌烘暟鎹姸鎬�
+ this.isNoData = false
+ this.isRepeated = 0
this.total = this.afterAnalysis.length;
this.handleCurrentChange(1); // 榛樿鏄剧ず绗竴椤�
@@ -320,11 +329,22 @@
this.gapT=endTime-startTime
},
+getHasExisitedData(){
+
+},
+
//鏄惁閲嶅
isRepeat(){
+ if (this.begin > this.end) {
+ alert('璇疯緭鍏ユ纭殑鏃堕棿鑼冨洿');
+ return;
+ }
let params = {}
if (this.shopname) {
params['shopname'] = this.shopname;
+ }
+ if(this.value){
+ params['value'] = this.value;
}
if(this.begin){
params['begin']=this.begin
@@ -332,41 +352,54 @@
if(this.end){
params['end'] = this.end
}
- axios.get('http://localhost:8080/data/search',{params:params})
- .then(response => {
- this.isRepeated=response.data.data
- console.log('璇锋眰',this.isRepeated);
+ // 鍙﹀涓�涓猯oading鍦╝nalysisData()涓�
+ this.loading=true
+ this.button.statisticsButton = true
+ axiosInstanceInstance.get('/data/search',{params:params}).then(response => {
+ // this.isRepeated=response.data.data
+ if(response.data.data.length>0){
+ alert('璇ュ簵閾虹殑鏃舵宸插瓨鍦ㄥ垎鏋愭暟鎹�,璇烽噸鏂伴�夋嫨')
+ this.isRepeated = 1
+ this.loading=false
+ this.isNoData = false
+ this.button.statisticsButton = false
+ this.afterAnalysis = response.data.data
+ this.total = this.afterAnalysis.length;
+ // 榛樿鏄剧ず绗竴椤�
+ this.handleCurrentChange(1);
+ return
+ }
+ // 璇锋眰宸插瓨鍦ㄧ殑鏁版嵁
+ else{
+ this.analysisData()
+ this.button.statisticsButton = false
+ }
+
})
-
- setTimeout(() => {
- console.log('璇锋眰鍚�',this.isRepeated);
- if(this.isRepeated>0){
- alert('璇ュ簵閾虹殑鏃舵宸插瓨鍦ㄥ垎鏋愭暟鎹�,璇烽噸鏂伴�夋嫨')
- return
- }else{
- this.analysisData()
- console.log('鎵ц浜�');
- }
- }, 1000);
-
},
+
//鍐欏叆MySql
toSql(){
- this.afterAnalysis.forEach((item)=>{
- console.log(item);
- let jsonData=JSON.stringify(item)
- console.log(jsonData);
- axios.post('http://localhost:8080/data/tosql',jsonData,{headers:{
- 'Content-Type':'application/json'
- }}).then((result)=>{
- console.log(result);
+ if(this.isRepeated == 0){
+ this.button.WarehousingButton = true
+ this.afterAnalysis.forEach((item)=>{
+ let jsonData=JSON.stringify(item)
+ // axiosInstanceInstance.post('/data/tosql',jsonData,{headers:{
+ // 'Content-Type':'application/json'
+ // }}).then((result)=>{
+ // // console.log(result);
+ // })
+
})
-
- })
- alert('宸叉垚鍔熷啓鍏ユ暟鎹簱')
- this.isWrite='鏄�'
+ alert('宸叉垚鍔熷啓鍏ユ暟鎹簱')
+ this.button.WarehousingButton = fasle
+ this.isWrite='鏄�'
+ }else{
+ alert('閲嶅鍊间笉鍙啓鍏ユ暟鎹簱')
+ }
+
},
@@ -376,6 +409,7 @@
},
handleCurrentChange(val) {
const startIndex = (val - 1) * this.pageSize;
+
const endIndex = startIndex + this.pageSize;
this.displayData = this.afterAnalysis.slice(startIndex, endIndex);
@@ -427,11 +461,32 @@
</script>
-<style>
+<style lang="scss">
/* 鍗＄墖 */
.box-card {
/* width: 1700px; */
- height: 150px;
+ height: 180px;
+}
+.el-radio {
+ margin-top: 15px;
+ margin-left: 5px;
+}
+.page-header {
+ display: flex;
+}
+.page-label {
+ display: flex;
+ margin-top: 15px;
+ margin-right: 3px;
+}
+.shop-label {
+ margin-top: 5px;
+}
+/* 鏃堕棿閫夋嫨 */
+.time-label {
+ margin-top: 15px;
+ margin-left: 20px;
+ white-space: nowrap;
}
/* 琛ㄦ牸 */
.table {
--
Gitblit v1.9.3