From e80067335467ca48cb94f03de3794ad93a45ad5d Mon Sep 17 00:00:00 2001
From: fuliqi <fuliqi@qq.com>
Date: 星期五, 13 九月 2024 16:42:38 +0800
Subject: [PATCH] 运行监控
---
src/views/system/monitor/face/index.vue | 55 ++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 40 insertions(+), 15 deletions(-)
diff --git a/src/views/system/monitor/face/index.vue b/src/views/system/monitor/face/index.vue
index 11ceac1..0c6bb9f 100644
--- a/src/views/system/monitor/face/index.vue
+++ b/src/views/system/monitor/face/index.vue
@@ -1,5 +1,15 @@
<template>
<div class="app-container">
+ <div
+ style="display: flex;flex-direction: row;min-width: 158px;max-width: 158px;margin-bottom: 5px;border-radius: 1px; user-select: none"
+ >
+ <div @click="clickTab(null)" class="tab"
+ :class="{tabActive: null == queryParams.provinceTag, tabInactive: null != queryParams.provinceTag}">鍏ㄩ儴
+ </div>
+ <div @click="clickTab(0)" class="tab"
+ :class="{tabActive: 0 === queryParams.provinceTag, tabInactive: 0 !== queryParams.provinceTag}">鐪佸巺鑰冩牳
+ </div>
+ </div>
<el-card class="box-card" >
<el-row type="flex" align="middle" justify="space-between">
<el-col :span="4">
@@ -73,21 +83,8 @@
<el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">鎼滅储</el-button>
<el-button icon="el-icon-refresh" size="small" @click="resetQuery">閲嶇疆</el-button>
</el-form-item>
- </el-form>
-
- <el-row :gutter="10" class="mb8">
- <!-- <el-col :span="1.5">
- <el-button
- type="warning"
- plain
- icon="el-icon-download"
- size="mini"
- @click="handleExport"
- v-hasPermi="['system:monitor:export']"
- >瀵煎嚭</el-button>
- </el-col> -->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
- </el-row>
+ </el-form>
<el-table v-loading="loading" :data="monitorList" @selection-change="handleSelectionChange">
<el-table-column label="璁惧鍚嶇О" align="center" prop="name" width="280" fixed show-overflow-tooltip/>
@@ -302,6 +299,11 @@
});
},
methods: {
+ clickTab(active) {
+ this.queryParams.provinceTag = active
+ this.getList()
+ this.getVideoCount()
+ },
/** 鏌ヨ璁惧璧勪骇鍒楄〃 */
getList() {
this.loading = true;
@@ -313,7 +315,7 @@
},
/** 鏌ヨ璁惧璧勪骇缁熻鏁� */
getVideoCount() {
- videoCount('3').then(response => {
+ videoCount(this.queryParams).then(response => {
this.count = response.data;
});
},
@@ -416,7 +418,30 @@
</script>
<style lang="scss" scoped>
+.tab {
+ padding: 5px 15px;
+}
+.tab:hover {
+ cursor: pointer;
+ user-select: none;
+}
+
+.tabActive {
+ color: white;
+ background-color: #409eff;
+ border: none;
+ border-radius: 1px;
+}
+
+.tabInactive {
+ background-color: #edf2f6;
+ color: #409eff;
+}
+
+.tabInactive:hover {
+ background-color: #edf2f6;
+}
.box-card {
background-color: #ffffff;
width: 100%;
--
Gitblit v1.8.0