From 46e8af542c02d801bea9fa8cf8f55974dcfa8554 Mon Sep 17 00:00:00 2001
From: doum <doum>
Date: 星期二, 30 十二月 2025 11:03:00 +0800
Subject: [PATCH] 更改头部
---
admin/src/components/business/OperaDeviceDataListWindow.vue | 72 ++++++++++++++++++++++++++++++++---
1 files changed, 65 insertions(+), 7 deletions(-)
diff --git a/admin/src/components/business/OperaDeviceDataListWindow.vue b/admin/src/components/business/OperaDeviceDataListWindow.vue
index 69c4a7d..b23d1b4 100644
--- a/admin/src/components/business/OperaDeviceDataListWindow.vue
+++ b/admin/src/components/business/OperaDeviceDataListWindow.vue
@@ -1,7 +1,7 @@
<template>
<GlobalWindow
:title="title"
- width="85%"
+ width="100%"
:visible.sync="visible"
>
<TableLayout >
@@ -19,20 +19,30 @@
<div style="display: flex;margin-top: 20px;">
<div style="flex: 1"><span class="label">MQTT IP锛�</span>{{model.doorNameObj.mqttIp ||''}}</div>
<div style="flex: 1"><span class="label">MQTT绔彛锛�</span>{{model.doorNameObj.mqttPort||''}}</div>
- <div style="flex: 3"> <span class="label">鏈�杩戞帶鍒舵搷浣滐細</span>{{model.remark||''}}</div>
+ <div style="flex: 3">
+ <span class="label">鏈�杩戞帶鍒舵搷浣滐細</span>
+ <span class="orange" >{{model.remark||''}}</span>
+ </div>
</div>
</div>
- <el-form-item label="寮�鍏冲簭鍙�" prop="val1">
+ <div class="platgroup_tabs">
+ <div class="tab" :class="{ active: activeGroup === item.id }" @click="groupClick(item)"
+ v-for="(item, i) in groupList" :key="i">
+ {{ item.name }}
+ </div>
+ </div>
+ <el-form-item label="寮�鍏冲簭鍙�" v-if="activeGroup==0" prop="val1">
<el-input v-model="searchForm.val1" placeholder="璇疯緭鍏ュ紑鍏冲簭鍙�" @keypress.enter.native="search"></el-input>
</el-form-item>
- <section>
+ <section v-if="activeGroup==0">
<el-button type="primary" @click="search">鎼滅储</el-button>
<el-button @click="reset">閲嶇疆</el-button>
</section>
</el-form>
<!-- 琛ㄦ牸鍜屽垎椤� -->
- <template v-slot:table-wrap>
+ <template v-slot:table-wrap>
<el-table
+ v-if="activeGroup===0"
:height="tableHeightNew"
v-loading="isWorking.search"
:data="tableData.list"
@@ -50,6 +60,24 @@
<el-table-column prop="val3" label="鐢靛湩(V)" min-width="120px"></el-table-column>
<el-table-column prop="val4" label="娓╁害(鈩�)" min-width="180px" ></el-table-column>
<el-table-column prop="val5" label="鏈夊姛鍔熺巼鍊硷紙kW锛�" min-width="120px"></el-table-column>
+ </el-table>
+ <el-table
+ v-if="activeGroup===1"
+ :height="tableHeightNew"
+ v-loading="isWorking.search"
+ :data="tableData.list"
+ stripe>
+ <el-table-column prop="createDate" label="鎿嶄綔鏃堕棿" min-width="150px"></el-table-column>
+ <el-table-column prop="val4" label="鎿嶄綔浜�" min-width="100px" ></el-table-column>
+ <el-table-column prop="val3" label="鎿嶄綔鍐呭" min-width="100px">
+ <template slot-scope="{row}">
+ <span v-if=" row.val3 === '銆愬悎闂搞��'" class="green">{{row.val3||''}}</span>
+ <span v-else-if=" row.val3 === '銆愬垎闂搞��'" class="red">{{row.val3||''}}</span>
+ <span v-else>{{row.val3||''}}</span>
+ </template>
+ </el-table-column>
+ <el-table-column prop="val5" label="寮�鍏冲簭鍙�" min-width="120px"></el-table-column>
+ <el-table-column prop="val2" label="鍐呭" min-width="300px" show-overflow-tooltip></el-table-column>
</el-table>
<pagination
@size-change="handleSizeChange"
@@ -79,10 +107,13 @@
// 琛ㄥ崟鏁版嵁
visible: false,
title: '',
+ activeGroup:0,
model:{},
+ groupList: [{ id: 0, name: '鏁版嵁涓婃姤璁板綍', type: 0 }, { id: 1, name: '杩滅▼鎺у埗璁板綍', type: 1 }],
searchForm: {
deviceId: null,
- val1:''
+ val1: '',
+ dataType:0
}
}
},
@@ -96,6 +127,12 @@
this.search()
},
methods: {
+ groupClick (item) {
+ this.activeGroup = item.id
+ this.searchForm.val1 = ''
+ this.searchForm.dataType = item.type
+ this.search()
+ },
open (title, row) {
this.title = title +' 銆�'+ (row.name)+'銆�'
this.searchForm.deviceId = row.id
@@ -118,12 +155,33 @@
total: 0
}
}
- this.search()
+ this.groupClick(this.groupList[0])
}
}
}
</script>
<style>
+.platgroup_tabs {
+ flex: 1;
+ display: flex;
+ border-bottom: 1px solid #dfe2e8;
+ margin-bottom:30px;
+
+ .tab {
+ color: #666666;
+ margin-right: 40px;
+ cursor: pointer;
+ padding-bottom: 18px;
+ border-bottom: 2px solid #fff;
+ }
+
+ .active {
+ font-weight: 500;
+ font-size: 15px;
+ color: #2080f7;
+ border-bottom: 2px solid $primary-color;
+ }
+}
.label{
/* width: 80px;
text-align: right;*/
--
Gitblit v1.9.3