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/recovery/index.vue | 174 ++++++++---
src/views/system/check/result/detail/detail.vue | 40 --
src/views/system/monitor/video/index.vue | 262 ++++++++++--------
src/views/system/data-manage/data-detail/index.vue | 140 +++++----
src/views/system/monitor/face/index.vue | 55 ++-
src/views/system/monitor/car/index.vue | 55 ++-
src/api/platform/monitor.js | 12
src/views/system/monitor/platform/index.vue | 49 ---
8 files changed, 439 insertions(+), 348 deletions(-)
diff --git a/src/api/platform/monitor.js b/src/api/platform/monitor.js
index b2f006f..19a2908 100644
--- a/src/api/platform/monitor.js
+++ b/src/api/platform/monitor.js
@@ -10,18 +10,20 @@
}
// 鏌ヨ璁惧璧勪骇缁熻鏁�
-export function videoCount(type) {
+export function videoCount(query) {
return request({
- url: '/system/monitor/getVideoCount/' + type,
- method: 'get'
+ url: '/system/monitor/getVideoCount',
+ method: 'get',
+ params: query
})
}
// 鏌ヨ寮傚父鎭㈠璁惧璧勪骇缁熻鏁�
-export function recoveryException() {
+export function recoveryException(query) {
return request({
url: '/system/monitor/recoveryException',
- method: 'get'
+ method: 'get',
+ params: query
})
}
diff --git a/src/views/system/check/result/detail/detail.vue b/src/views/system/check/result/detail/detail.vue
index f5b8242..f4d2a72 100644
--- a/src/views/system/check/result/detail/detail.vue
+++ b/src/views/system/check/result/detail/detail.vue
@@ -46,35 +46,6 @@
</el-card>
</el-col>
</el-row>
- <!-- <div></div>
- <el-table
- v-loading="loading"
- :data="checkRuleList"
- @selection-change="handleSelectionChange"
- >
- <el-table-column type="selection" width="55" align="center" />
- <el-table-column
- label="瑙勫垯鍚嶇О"
- align="center"
- prop="checkRuleName"
- />
- <el-table-column label="瑙勫垯鏉冮噸" align="center" prop="weight" />
- <el-table-column
- label="鎿嶄綔"
- align="center"
- class-name="small-padding fixed-width"
- >
- <template slot-scope="scope">
- <el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="handleRuleUpdate(scope.row)"
- >淇敼
- </el-button>
- </template>
- </el-table-column>
- </el-table> -->
</el-main>
</el-container>
@@ -100,17 +71,6 @@
:inline="true"
v-show="showSearch"
>
-<!-- <el-form-item label="鑰冩牳鏈堝害" prop="name">-->
-<!-- <el-date-picker-->
-<!-- v-model="queryParams.date"-->
-<!-- format="yyyy-MM"-->
-<!-- value-format="yyyy-MM"-->
-<!-- type="month"-->
-<!-- placeholder="閫夋嫨鏃ユ湡"-->
-<!-- @change="dateChange"-->
-<!-- >-->
-<!-- </el-date-picker>-->
-<!-- </el-form-item>-->
<el-form-item label="鑰冩牳鏃堕棿">
<el-date-picker
:clearable="false"
diff --git a/src/views/system/data-manage/data-detail/index.vue b/src/views/system/data-manage/data-detail/index.vue
index f5cb7d6..7a28b97 100644
--- a/src/views/system/data-manage/data-detail/index.vue
+++ b/src/views/system/data-manage/data-detail/index.vue
@@ -1,13 +1,22 @@
<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(0)" class="tab" :class="{tabActive: 0 === queryParams.dataType, tabInactive: 0 !== queryParams.dataType}">鍏ㄩ儴</div>
- <div @click="clickTab(1)" class="tab" :class="{tabActive: 1 === queryParams.dataType, tabInactive: 1 !== queryParams.dataType}">鐪佸巺鑰冩牳</div>
+ <div
+ style="display: flex;flex-direction: row;min-width: 158px;max-width: 158px;margin-bottom: 5px;border-radius: 1px; user-select: none"
+ v-show="index !== 'image_resource_security'">
+ <div @click="clickTab(0)" class="tab"
+ :class="{tabActive: 0 === queryParams.dataType, tabInactive: 0 !== queryParams.dataType}">鍏ㄩ儴
+ </div>
+ <div @click="clickTab(1)" class="tab"
+ :class="{tabActive: 1 === queryParams.dataType, tabInactive: 1 !== queryParams.dataType}">鐪佸巺鑰冩牳
+ </div>
</div>
<el-card class="box-card" v-show="index !== 'image_resource_security'">
<el-row style="display: flex; flex-direction: row; align-items: center" justify="space-between">
- <div style="font-size: 18px;min-width: 200px;height: 80px;display: flex;align-items: center">{{ruleName}}</div>
- <div v-if="cardList && cardList.length > 0" v-for="card in cardList" style="display: flex;flex-direction: row; margin-right: 50px;margin-left: 20px;align-items: center" :key="card.label">
+ <div style="font-size: 18px;min-width: 200px;height: 80px;display: flex;align-items: center">{{ ruleName }}
+ </div>
+ <div v-if="cardList && cardList.length > 0" v-for="card in cardList"
+ style="display: flex;flex-direction: row; margin-right: 50px;margin-left: 20px;align-items: center"
+ :key="card.label">
<div>
<div class="icon-container">
<i :class="card.icon"></i>
@@ -29,37 +38,15 @@
<el-col :span="8"></el-col>
</el-row>
</el-card>
-
- <div style="display: flex;position: relative">
- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
- <el-form-item label="鍏抽敭璇�" prop="bayonetNumber">
- <el-input v-model="queryParams.keyword" placeholder="鍏抽敭璇嶆悳绱�" clearable @input="handleQuery"/>
- </el-form-item>
- <el-form-item label="鏃堕棿鑼冨洿" prop="timeRange">
- <el-date-picker
- v-model="queryParams.timeRange"
- type="daterange"
- range-separator="鑷�"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡">
- </el-date-picker>
- </el-form-item>
- <el-form-item>
- <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>
- <right-toolbar style="position: absolute;right: 0px" v-show="index !== 'image_resource_security'" :showSearch.sync="showSearch" @queryTable="handleQuery" :columns="showList"></right-toolbar>
- </div>
-
-
<el-row :gutter="10" class="mb8" v-show="index === 'image_resource_security'">
<el-container>
<el-main>
<h2>瑙嗛鍥惧儚璧勬簮瀹夊叏绠＄悊</h2>
<el-row :gutter="20">
- <el-col :xl="3" :lg="3" :md="6" :sm="6" :xs="12" v-if="imageResourceSecurity && imageResourceSecurity.length > 0" v-for="(item, index) in imageResourceSecurity" :key="index"
- class="col-margin">
+ <el-col :xl="3" :lg="3" :md="6" :sm="6" :xs="12"
+ v-if="imageResourceSecurity && imageResourceSecurity.length > 0"
+ v-for="(item, index) in imageResourceSecurity" :key="index"
+ class="col-margin">
<el-card style="
min-width: 150px;
width: 100%;
@@ -82,28 +69,53 @@
</el-row>
</el-main>
</el-container>
- <el-col :span="1.5">
- <el-button type="primary" plain icon="el-icon-upload" size="mini" @click="handleExport"
- v-hasPermi="['platform:platform:export']">瀵煎叆
- </el-button>
- </el-col>
- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+
</el-row>
+ <div style="display: flex;position: relative">
+ <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
+ <el-form-item label="鍏抽敭璇�" prop="bayonetNumber">
+ <el-input v-model="queryParams.keyword" placeholder="鍏抽敭璇嶆悳绱�" clearable @input="handleQuery"/>
+ </el-form-item>
+ <el-form-item label="鏃堕棿鑼冨洿" prop="timeRange">
+ <el-date-picker
+ v-model="queryParams.timeRange"
+ type="daterange"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡">
+ </el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <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>
+ <right-toolbar style="position: absolute;right: 0px" v-show="index !== 'image_resource_security'" :showSearch.sync="showSearch" @queryTable="handleQuery"
+ :columns="showList"></right-toolbar>
+ </div>
+
+ <div v-show="index === 'image_resource_security'" style="margin-bottom: 5px">
+ <el-button type="primary" plain icon="el-icon-upload" size="mini" @click="handleExport"
+ v-hasPermi="['platform:platform:export']">瀵煎叆
+ </el-button>
+ <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+ </div>
<div>
<el-table v-loading="loading" :data="tableData.list">
- <el-table-column :prop="item.prop" :label="item.label" :width="item.width" v-for="(item, index) in tableHead" :key="index" v-if="showListPD(item)"/>
+ <el-table-column :prop="item.prop" :label="item.label" :width="item.width" v-for="(item, index) in tableHead"
+ :key="index" v-if="showListPD(item)"/>
</el-table>
</div>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
- @pagination="getList" />
+ @pagination="getList"/>
<!-- 淇敼瑙嗛鍥惧儚璧勬簮瀹夊叏绠＄悊瀵硅瘽妗� -->
<el-dialog title="淇敼瑙嗛鍥惧儚璧勬簮瀹夊叏绠＄悊" :visible.sync="resourceOpen" width="600px" append-to-body>
<el-form ref="form" :model="resourceForm" :rules="rules" label-width="250px">
<el-form-item label="閮ㄩ棬鍚嶇О" prop="deptName">
- <el-input v-model="resourceForm.deptName" disabled />
+ <el-input v-model="resourceForm.deptName" disabled/>
</el-form-item>
<el-form-item label="骞冲彴杩愯鐜�" prop="platformOnline">
<el-input-number v-model="resourceForm.platformOnline" :precision="2" :step="0.1" :min="0" :max="1"/>
@@ -117,7 +129,8 @@
<el-form-item label="瑙嗛浼犺緭缃戝嵄闄╄祫浜ф瘮渚�" prop="riskProperty">
<el-input-number v-model="resourceForm.riskProperty" :precision="2" :step="0.1" :min="0" :max="1"/>
</el-form-item>
- <el-tooltip class="item" effect="dark" content="杩濊杩炴帴浜掕仈缃戞墸鍑�20涓櫨鍒嗙偣/娆★紝杩濊鏃犵嚎AP鎺ュ叆銆侀殢韬玾ifi鎺ュ叆銆佸叡浜綉缁滃悇鎵ｅ噺5涓櫨鍒嗙偣/娆★紝鐩磋嚦姝ら」鎸囨爣鎵ｅ畬涓烘銆�" placement="top-start">
+ <el-tooltip class="item" effect="dark" content="杩濊杩炴帴浜掕仈缃戞墸鍑�20涓櫨鍒嗙偣/娆★紝杩濊鏃犵嚎AP鎺ュ叆銆侀殢韬玾ifi鎺ュ叆銆佸叡浜綉缁滃悇鎵ｅ噺5涓櫨鍒嗙偣/娆★紝鐩磋嚦姝ら」鎸囨爣鎵ｅ畬涓烘銆�"
+ placement="top-start">
<el-form-item label="瑙嗛浼犺緭缃戣竟鐣屽畬鏁存�ф娴嬫墸鍒嗛」" prop="boundaryIntegrity">
<el-input-number v-model="resourceForm.boundaryIntegrity" :precision="2" :step="0.1" :min="0" :max="1"/>
</el-form-item>
@@ -133,14 +146,15 @@
<!-- 瀵煎叆瀵硅瘽妗� -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url"
- :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess"
- :auto-upload="false" drag>
+ :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess"
+ :auto-upload="false" drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
<div class="el-upload__tip text-center" slot="tip">
<span>浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢銆�</span>
<el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;"
- @click="importTemplate">涓嬭浇妯℃澘</el-link>
+ @click="importTemplate">涓嬭浇妯℃澘
+ </el-link>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
@@ -153,10 +167,11 @@
</template>
<script>
-import { dataCenter } from "@/api/platform/data-center";
-import { videoData, carData, faceData, equipment } from "./list";
-import { listSecurity, updateSecurity } from '@/api/platform/resource-security';
-import { getToken } from "@/utils/auth";
+import {dataCenter} from "@/api/platform/data-center";
+import {videoData, carData, faceData, equipment} from "./list";
+import {listSecurity, updateSecurity} from '@/api/platform/resource-security';
+import {getToken} from "@/utils/auth";
+
export default {
name: "Platform",
computed: {
@@ -175,7 +190,7 @@
// 鏄惁绂佺敤涓婁紶
isUploading: false,
// 璁剧疆涓婁紶鐨勮姹傚ご閮�
- headers: { Authorization: "Bearer " + getToken() },
+ headers: {Authorization: "Bearer " + getToken()},
// 涓婁紶鐨勫湴鍧�
url: process.env.VUE_APP_BASE_API + "/platform/resourceSecurity/importData"
},
@@ -218,20 +233,20 @@
// 琛ㄥ崟鏍￠獙
rules: {
platformOnline: [
- { required: true, message: "璇疯緭鍏ュ钩鍙拌繍琛岀巼", trigger: "blur" },
- { type: "number", message: "骞冲彴杩愯鐜囧繀椤讳负鏁板瓧", trigger: "blur" }
+ {required: true, message: "璇疯緭鍏ュ钩鍙拌繍琛岀巼", trigger: "blur"},
+ {type: "number", message: "骞冲彴杩愯鐜囧繀椤讳负鏁板瓧", trigger: "blur"}
],
propertyAccuracy: [
- { required: true, message: "璇疯緭鍏ヨ棰戜紶杈撶綉璧勪骇鍑嗙‘鐜�", trigger: "blur" },
- { type: "number", message: "瑙嗛浼犺緭缃戣祫浜у噯纭巼蹇呴』涓烘暟瀛�", trigger: "blur" }
+ {required: true, message: "璇疯緭鍏ヨ棰戜紶杈撶綉璧勪骇鍑嗙‘鐜�", trigger: "blur"},
+ {type: "number", message: "瑙嗛浼犺緭缃戣祫浜у噯纭巼蹇呴』涓烘暟瀛�", trigger: "blur"}
],
riskProperty: [
- { required: true, message: "璇疯緭鍏ュ急鍙ｄ护寰楀垎", trigger: "blur" },
- { type: "number", message: "寮卞彛浠ゅ緱鍒嗗繀椤讳负鏁板瓧", trigger: "blur" }
+ {required: true, message: "璇疯緭鍏ュ急鍙ｄ护寰楀垎", trigger: "blur"},
+ {type: "number", message: "寮卞彛浠ゅ緱鍒嗗繀椤讳负鏁板瓧", trigger: "blur"}
],
boundaryIntegrity: [
- { required: true, message: "璇疯緭鍏ヨ棰戜紶杈撶綉鍗遍櫓璧勪骇姣斾緥", trigger: "blur" },
- { type: "number", message: "瑙嗛浼犺緭缃戝嵄闄╄祫浜ф瘮渚嬪繀椤讳负鏁板瓧", trigger: "blur" }
+ {required: true, message: "璇疯緭鍏ヨ棰戜紶杈撶綉鍗遍櫓璧勪骇姣斾緥", trigger: "blur"},
+ {type: "number", message: "瑙嗛浼犺緭缃戝嵄闄╄祫浜ф瘮渚嬪繀椤讳负鏁板瓧", trigger: "blur"}
],
},
@@ -254,7 +269,7 @@
let day = yesterday.getDate().toString().padStart(2, '0');
// 鎷兼帴鎴� yyyy-MM-dd 鏍煎紡
- let yesterday1 = `${year}-${month}-${day}`;
+ let yesterday1 = `${year}-${month}-${day}`;
this.queryParams.timeRange = [yesterday1, yesterday1]
this.index = this.$route.query.index;
if (this.$route.query.type === '1') {
@@ -293,7 +308,7 @@
return true
}
let arr = this.showList.filter(d => d.label === item.label)
- if (item && (!arr || arr.length <1)) {
+ if (item && (!arr || arr.length < 1)) {
return true;
} else {
return item && arr && arr.length > 0 && arr[0].visible
@@ -343,7 +358,7 @@
this.queryParams.endTime = this.queryParams.timeRange[1]
}
dataCenter(url, this.queryParams).then(response => {
- response.data.list = response.data.list && response.data.list.length >0 ? response.data.list : []
+ response.data.list = response.data.list && response.data.list.length > 0 ? response.data.list : []
this.tableData = response.data;
this.total = response.total;
this.loading = false;
@@ -413,23 +428,28 @@
.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: #F5F9FE;
width: 100%;
diff --git a/src/views/system/monitor/car/index.vue b/src/views/system/monitor/car/index.vue
index 29c4736..87f7c22 100644
--- a/src/views/system/monitor/car/index.vue
+++ b/src/views/system/monitor/car/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">
@@ -74,21 +84,10 @@
<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>
+ <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</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-table v-loading="loading" :data="monitorList" @selection-change="handleSelectionChange">
<el-table-column label="璁惧鍚嶇О" align="center" prop="name" width="280" fixed show-overflow-tooltip/>
@@ -264,6 +263,11 @@
});
},
methods: {
+ clickTab(active) {
+ this.queryParams.provinceTag = active
+ this.getList()
+ this.getVideoCount()
+ },
/** 鏌ヨ璁惧璧勪骇鍒楄〃 */
getList() {
this.loading = true;
@@ -275,7 +279,7 @@
},
/** 鏌ヨ璁惧璧勪骇缁熻鏁� */
getVideoCount() {
- videoCount('2').then(response => {
+ videoCount(this.queryParams).then(response => {
this.count = response.data;
});
},
@@ -378,7 +382,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%;
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%;
diff --git a/src/views/system/monitor/platform/index.vue b/src/views/system/monitor/platform/index.vue
index 39950ec..2e5d6d5 100644
--- a/src/views/system/monitor/platform/index.vue
+++ b/src/views/system/monitor/platform/index.vue
@@ -62,53 +62,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="primary"
- plain
- icon="el-icon-plus"
- size="mini"
- @click="handleAdd"
- v-hasPermi="['platform:platform:add']"
- >鏂板</el-button>
- </el-col>
- <el-col :span="1.5">
- <el-button
- type="success"
- plain
- icon="el-icon-edit"
- size="mini"
- :disabled="single"
- @click="handleUpdate"
- v-hasPermi="['platform:platform:edit']"
- >淇敼</el-button>
- </el-col>
- <el-col :span="1.5">
- <el-button
- type="danger"
- plain
- icon="el-icon-delete"
- size="mini"
- :disabled="multiple"
- @click="handleDelete"
- v-hasPermi="['platform:platform:remove']"
- >鍒犻櫎</el-button>
- </el-col> -->
- <el-col :span="1.5">
- <!-- <el-button
- type="warning"
- plain
- icon="el-icon-download"
- size="mini"
- @click="handleExport"
- v-hasPermi="['platform:platform:export']"
- >瀵煎嚭</el-button> -->
- </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
- </el-row>
+ </el-form>
<el-table v-loading="loading" :data="platformList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
@@ -258,7 +213,7 @@
},
/** 鏌ヨ璁惧璧勪骇缁熻鏁� */
getVideoCount() {
- videoCount('1').then(response => {
+ videoCount().then(response => {
this.count = response.data;
});
},
diff --git a/src/views/system/monitor/recovery/index.vue b/src/views/system/monitor/recovery/index.vue
index 5278610..f4ebf64 100644
--- a/src/views/system/monitor/recovery/index.vue
+++ b/src/views/system/monitor/recovery/index.vue
@@ -1,6 +1,16 @@
<template>
<div class="app-container">
- <el-card class="box-card" >
+ <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">
<div class="icon-container" style="background-color: #1890FF">
@@ -11,19 +21,19 @@
<div class="dashboard">
<div class="dashboard-item">
<h3 style="color: #5C9BF8">{{ count.totalPosts }}</h3>
- <p>璁惧鎬绘暟</p >
+ <p>璁惧鎬绘暟</p>
</div>
<div class="dashboard-item">
<h3 style="color: #3eba45">{{ count.totalMembers }}</h3>
- <p>姝ｅ父鏁�</p >
+ <p>姝ｅ父鏁�</p>
</div>
<div class="dashboard-item">
<h3 style="color: #fe640d">{{ count.postsPercentage }}</h3>
- <p>寮傚父鏁�</p >
+ <p>寮傚父鏁�</p>
</div>
<div class="dashboard-item">
<h3>{{ count.viewsPercentage }}%</h3>
- <p>璁惧杩愯鐜�</p >
+ <p>璁惧杩愯鐜�</p>
</div>
</div>
</el-col>
@@ -46,7 +56,7 @@
clearable
@change="handleQuery"
>
- <el-option
+ <el-option
v-for="dept in deptList"
:key="dept.deptId"
:label="dept.area"
@@ -54,7 +64,7 @@
/>
</el-select>
</el-form-item>
- <el-form-item label="鐩戞帶绫诲瀷" prop="onState">
+ <el-form-item label="鐩戞帶绫诲瀷" prop="cameraFunType">
<el-select
v-model="queryParams.cameraFunType"
placeholder="璇烽�夋嫨鐩戞帶绫诲瀷"
@@ -70,40 +80,33 @@
<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>
+ <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</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"
- >瀵煎嚭</el-button>
- </el-col> -->
- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
- </el-row>
-
<el-table v-loading="loading" :data="monitorList" @selection-change="handleSelectionChange">
- <el-table-column label="璁惧鍚嶇О" align="center" prop="name" />
- <el-table-column label="璁惧缂栫爜" align="center" prop="serialNumber" width="180px" />
- <el-table-column label="鏍囩" align="center" v-if="columns[0].visible">
+ <el-table-column label="璁惧鍚嶇О" align="center" prop="name" width="280" fixed show-overflow-tooltip/>
+ <el-table-column label="璁惧缂栫爜" align="center" prop="serialNumber" width="180px"/>
+ <el-table-column label="璁惧绫诲瀷" align="center" prop="cameraFunType" width="180px">
+ <template slot-scope="scope">
+ {{ translateCameraFunType(scope.row.cameraFunType) }}
+ </template>
+ </el-table-column>
+ <el-table-column label="鏍囩" align="center" width="180px" v-if="columns[0].visible">
<template slot-scope="scope">
<div>{{ scope.row.provinceTag == 0 ? "鐪佸巺" : "甯傚眬" }}</div>
</template>
</el-table-column>
<el-table-column label="鍖哄煙" align="center" prop="area" v-if="columns[1].visible"/>
- <el-table-column label="璁惧鐘舵��" align="center" prop="onState" v-if="columns[2].visible">
- <template slot-scope="scope">
- <dict-tag :options="dict.type.camera_state" :value="scope.row.onState"/>
- </template>
+ <el-table-column label="璁惧鐘舵��" align="center" width="180px" prop="onState" v-if="columns[2].visible">
+ <template slot-scope="scope">
+ <dict-tag :options="dict.type.camera_state" width="180px" :value="scope.row.onState"/>
+ </template>
</el-table-column>
- <el-table-column label="鏄惁鐢熸垚寮傚父宸ュ崟" align="center" prop="error" v-if="columns[3].visible" />
- <el-table-column label="寮傚父鍘熷洜" align="center" prop="reason" v-if="columns[4].visible" />
- <el-table-column label="寮傚父鎭㈠鏃堕棿" align="center" prop="recoveryTime" width="180" v-if="columns[5].visible">
+ <el-table-column label="鏄惁鐢熸垚寮傚父宸ュ崟" align="center" prop="error" width="180px" v-if="columns[3].visible"/>
+ <el-table-column label="寮傚父鍘熷洜" align="center" prop="reason" width="180px" v-if="columns[4].visible"/>
+ <el-table-column label="寮傚父鎭㈠鏃堕棿" align="center" prop="recoveryTime" width="180px" v-if="columns[5].visible">
</el-table-column>
- <el-table-column label="绠＄悊鍗曚綅" align="center" prop="unitName" v-if="columns[6].visible" />
+ <el-table-column label="绠＄悊鍗曚綅" align="center" prop="unitName" width="180px" v-if="columns[6].visible"/>
<el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
@@ -111,7 +114,8 @@
type="text"
icon="el-icon-view"
@click="handleView(scope.row,scope.index)"
- >璇︾粏</el-button>
+ >璇︾粏
+ </el-button>
</template>
</el-table-column>
</el-table>
@@ -130,8 +134,8 @@
<el-row>
<el-col :span="12">
<el-form-item label="璁惧缂栫爜锛�">{{ form.serialNumber }}</el-form-item>
- <el-form-item label="璁惧鍚嶇О锛�">{{ form.name }} </el-form-item>
- <el-form-item label="鏍囩锛�">{{ form.deptName }} </el-form-item>
+ <el-form-item label="璁惧鍚嶇О锛�">{{ form.name }}</el-form-item>
+ <el-form-item label="鏍囩锛�">{{ form.deptName }}</el-form-item>
<el-form-item label="璁惧鐘舵�侊細">
<div v-if="form.onState === 1">鍙敤</div>
<div v-else-if="form.onState === 2">涓嶅彲鐢�</div>
@@ -163,23 +167,31 @@
</template>
<script>
-import { recoveryException, listMonitor, getMonitor, delMonitor, addMonitor, updateMonitor } from "@/api/platform/monitor";
-import { listDept } from "@/api/system/dept";
+import {
+ recoveryException,
+ listMonitor,
+ getMonitor,
+ delMonitor,
+ addMonitor,
+ updateMonitor
+} from "@/api/platform/monitor";
+import {listDept} from "@/api/system/dept";
+
export default {
name: "Monitor",
- dicts: ['sys_normal_disable','platform_yes_no','camera_state'],
+ dicts: ['sys_normal_disable', 'platform_yes_no', 'camera_state'],
data() {
return {
deptList: [],
// 鍒椾俊鎭�
columns: [
- { key: 0, label: `鏍囩`, visible: true },
- { key: 1, label: `鍖哄煙`, visible: true },
- { key: 2, label: `璁惧鐘舵�乣, visible: true },
- { key: 3, label: `鏄惁鐢熸垚寮傚父宸ュ崟`, visible: true },
- { key: 4, label: `寮傚父鍘熷洜`, visible: true },
- { key: 5, label: `寮傚父鎭㈠鏃堕棿`, visible: true },
- { key: 6, label: `绠＄悊鍗曚綅`, visible: true },
+ {key: 0, label: `鏍囩`, visible: true},
+ {key: 1, label: `鍖哄煙`, visible: true},
+ {key: 2, label: `璁惧鐘舵�乣, visible: true},
+ {key: 3, label: `鏄惁鐢熸垚寮傚父宸ュ崟`, visible: true},
+ {key: 4, label: `寮傚父鍘熷洜`, visible: true},
+ {key: 5, label: `寮傚父鎭㈠鏃堕棿`, visible: true},
+ {key: 6, label: `绠＄悊鍗曚綅`, visible: true},
],
count: {
totalPosts: 0,
@@ -226,16 +238,16 @@
// 琛ㄥ崟鏍￠獙
rules: {
serialNumber: [
- { required: true, message: "璁惧缂栫爜涓嶈兘涓虹┖", trigger: "blur" }
+ {required: true, message: "璁惧缂栫爜涓嶈兘涓虹┖", trigger: "blur"}
],
name: [
- { required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
+ {required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur"}
],
onState: [
- { required: true, message: "璁惧鐘舵��", trigger: "blur" }
+ {required: true, message: "璁惧鐘舵��", trigger: "blur"}
],
address: [
- { required: true, message: "鍦板潃涓嶈兘涓虹┖", trigger: "blur" }
+ {required: true, message: "鍦板潃涓嶈兘涓虹┖", trigger: "blur"}
],
}
};
@@ -243,11 +255,40 @@
created() {
this.getList();
this.getVideoCount();
- listDept({ status: 0 }).then(response => {
+ listDept({status: 0}).then(response => {
this.deptList = response.data.filter(item => item.area);
});
},
methods: {
+ translateCameraFunType(cameraFunType) {
+ // 鏍￠獙杈撳叆鏄惁涓哄瓧绗︿覆
+ if (typeof cameraFunType !== 'string') {
+ return "";
+ }
+
+ // 鍒嗗壊瀛楃涓蹭负鏁扮粍锛屽苟鍘婚櫎绌哄瓧绗︿覆
+ const types = cameraFunType.split('/').filter(type => type);
+
+ // 鏍￠獙骞惰浆鎹㈡瘡涓被鍨�
+ const translatedTypes = types.map(type => {
+ switch (type) {
+ case '1':
+ return '瑙嗛';
+ case '2':
+ return '杞﹁締';
+ case '3':
+ return '浜鸿劯';
+ default:
+ return ''
+ }
+ });
+ return translatedTypes.join(', ');
+ },
+ clickTab(active) {
+ this.queryParams.provinceTag = active
+ this.getList()
+ this.getVideoCount()
+ },
/** 鏌ヨ璁惧璧勪骇鍒楄〃 */
getList() {
this.loading = true;
@@ -259,7 +300,7 @@
},
/** 鏌ヨ寮傚父鎭㈠璁惧缁熻鏁� */
getVideoCount() {
- recoveryException().then(response => {
+ recoveryException(this.queryParams).then(response => {
this.count = response.data;
});
},
@@ -302,7 +343,7 @@
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
- this.single = selection.length!==1
+ this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 鏂板鎸夐挳鎿嶄綔 */
@@ -344,12 +385,13 @@
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
const ids = row.id || this.ids;
- this.$modal.confirm('鏄惁纭鍒犻櫎璁惧璧勪骇缂栧彿涓�"' + ids + '"鐨勬暟鎹」锛�').then(function() {
+ this.$modal.confirm('鏄惁纭鍒犻櫎璁惧璧勪骇缂栧彿涓�"' + ids + '"鐨勬暟鎹」锛�').then(function () {
return delMonitor(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(() => {});
+ }).catch(() => {
+ });
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
@@ -362,6 +404,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;
@@ -369,6 +435,7 @@
margin-bottom: 20px;
height: 120px
}
+
.icon-container {
display: flex;
justify-content: center;
@@ -378,6 +445,7 @@
height: 80px;
margin-left: 5%;
}
+
.el-icon-refresh-left {
font-size: 50px;
color: #FFFFFF;
diff --git a/src/views/system/monitor/video/index.vue b/src/views/system/monitor/video/index.vue
index 37c11f7..35c544a 100644
--- a/src/views/system/monitor/video/index.vue
+++ b/src/views/system/monitor/video/index.vue
@@ -1,126 +1,127 @@
<template>
<div class="app-container">
-
- <el-card class="box-card" >
+ <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" style="width: 100%;">
<el-col :span="4">
- <div class="icon-container" style="background-color: #1890FF">
- <i class="el-icon-video-camera"></i>
- </div>
+ <div class="icon-container" style="background-color: #1890FF">
+ <i class="el-icon-video-camera"></i>
+ </div>
</el-col>
<el-col :span="20">
<div class="dashboard">
<div class="dashboard-item">
<h3 style="color: #5C9BF8">{{ count.totalPosts }}</h3>
- <p>璁惧鎬绘暟</p >
+ <p>璁惧鎬绘暟</p>
</div>
<div class="dashboard-item">
<h3 style="color: #3eba45">{{ count.totalMembers }}</h3>
- <p>姝ｅ父鏁�</p >
+ <p>姝ｅ父鏁�</p>
</div>
<div class="dashboard-item">
<h3 style="color: #fe640d">{{ count.postsPercentage }}</h3>
- <p>寮傚父鏁�</p >
+ <p>寮傚父鏁�</p>
</div>
<div class="dashboard-item">
<h3>{{ count.viewsPercentage }}%</h3>
- <p>璁惧杩愯鐜�</p >
+ <p>璁惧杩愯鐜�</p>
</div>
</div>
</el-col>
</el-row>
</el-card>
+ <el-row type="flex">
+ <el-col :span="20">
+ <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
+ <el-form-item label="鍏抽敭瀛�" prop="name">
+ <el-input
+ v-model="queryParams.name"
+ placeholder="璇疯緭鍏ュ叧閿瓧"
+ clearable
+ @keyup.enter.native="handleQuery"
+ />
+ </el-form-item>
+ <el-form-item label="鍖哄煙" prop="onState">
+ <el-select
+ v-model="queryParams.address"
+ placeholder="璇烽�夋嫨鍖哄煙"
+ clearable
+ @change="handleQuery"
+ >
+ <el-option
+ v-for="dept in deptList"
+ :key="dept.deptId"
+ :label="dept.area"
+ :value="dept.deptId"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="璁惧鐘舵��" prop="onState">
+ <el-select
+ v-model="queryParams.onState"
+ placeholder="璁惧鐘舵��"
+ clearable
+ style="width: 100px"
+ >
+ <el-option
+ v-for="dict in dict.type.camera_state"
+ :key="dict.value"
+ :label="dict.label"
+ :value="dict.value"
+ />
+ </el-select>
+ </el-form-item>
- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
- <el-form-item label="鍏抽敭瀛�" prop="name">
- <el-input
- v-model="queryParams.name"
- placeholder="璇疯緭鍏ュ叧閿瓧"
- clearable
- @keyup.enter.native="handleQuery"
- />
- </el-form-item>
- <el-form-item label="鍖哄煙" prop="onState">
- <el-select
- v-model="queryParams.address"
- placeholder="璇烽�夋嫨鍖哄煙"
- clearable
- @change="handleQuery"
- >
- <el-option
- v-for="dept in deptList"
- :key="dept.deptId"
- :label="dept.area"
- :value="dept.deptId"
- />
- </el-select>
- </el-form-item>
- <el-form-item label="璁惧鐘舵��" prop="onState">
- <el-select
- v-model="queryParams.onState"
- placeholder="璁惧鐘舵��"
- clearable
- style="width: 100px"
- >
- <el-option
- v-for="dict in dict.type.camera_state"
- :key="dict.value"
- :label="dict.label"
- :value="dict.value"
- />
- </el-select>
- </el-form-item>
-
- <el-form-item>
- <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-form-item>
+ <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-col>
+ <el-col span="4">
+ <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
+ </el-col>
</el-row>
-
<el-table v-loading="loading" :data="monitorList" @selection-change="handleSelectionChange">
<el-table-column label="璁惧鍚嶇О" align="center" prop="name" width="280" fixed show-overflow-tooltip/>
- <el-table-column label="璁惧缂栫爜" align="center" prop="serialNumber" width="180" />
+ <el-table-column label="璁惧缂栫爜" align="center" prop="serialNumber" width="180"/>
<el-table-column label="鏍囩" align="center" width="180" v-if="columns[0].visible">
<template slot-scope="scope">
<div>{{ scope.row.provinceTag == 0 ? "鐪佸巺" : "甯傚眬" }}</div>
</template>
</el-table-column>
- <el-table-column label="鍖哄煙" align="center" prop="area" width="180" v-if="columns[1].visible" />
+ <el-table-column label="鍖哄煙" align="center" prop="area" width="180" v-if="columns[1].visible"/>
<el-table-column label="璁惧鐘舵��" align="center" prop="onState" v-if="columns[2].visible">
- <template slot-scope="scope">
- <dict-tag :options="dict.type.camera_state" :value="scope.row.onState"/>
- </template>
+ <template slot-scope="scope">
+ <dict-tag :options="dict.type.camera_state" :value="scope.row.onState"/>
+ </template>
</el-table-column>
- <el-table-column label="鏄惁鐢熸垚寮傚父宸ュ崟" align="center" prop="error" width="180" v-if="columns[3].visible" />
- <el-table-column label="鏁版嵁鏃堕棿" align="center" prop="mongoCreateTime" width="180" v-if="columns[4].visible" />
- <el-table-column label="绠＄悊鍗曚綅" align="center" prop="unitName" width="180" v-if="columns[5].visible" />
- <el-table-column label="淇′护鏃跺欢(ms)" align="center" prop="sipDelay" width="180" v-if="columns[6].visible" />
- <el-table-column label="瑙嗛鏃跺欢(ms)" align="center" prop="videoDelay" width="180" v-if="columns[7].visible" />
- <el-table-column label="鍏抽敭甯ф椂寤�(ms)" align="center" prop="ifmDelay" width="180" v-if="columns[8].visible" />
- <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width" fixed="right">
- <template slot-scope="scope">
- <el-button
- size="mini"
- type="text"
- icon="el-icon-view"
- @click="handleView(scope.row,scope.index)"
- >璇︾粏</el-button>
- </template>
+ <el-table-column label="鏄惁鐢熸垚寮傚父宸ュ崟" align="center" prop="error" width="180" v-if="columns[3].visible"/>
+ <el-table-column label="绠＄悊鍗曚綅" align="center" prop="unitName" width="180" v-if="columns[5].visible"/>
+ <el-table-column label="鏁版嵁鏃堕棿" align="center" prop="mongoCreateTime" width="180" v-if="columns[4].visible"/>
+ <el-table-column label="淇′护鏃跺欢(ms)" align="center" prop="sipDelay" width="180" v-if="columns[6].visible"/>
+ <el-table-column label="瑙嗛鏃跺欢(ms)" align="center" prop="videoDelay" width="180" v-if="columns[7].visible"/>
+ <el-table-column label="鍏抽敭甯ф椂寤�(ms)" align="center" prop="ifmDelay" width="180" v-if="columns[8].visible"/>
+ <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width" fixed="right">
+ <template slot-scope="scope">
+ <el-button
+ size="mini"
+ type="text"
+ icon="el-icon-view"
+ @click="handleView(scope.row,scope.index)"
+ >璇︾粏
+ </el-button>
+ </template>
</el-table-column>
</el-table>
@@ -138,9 +139,9 @@
<el-row>
<el-col :span="12">
<el-form-item label="璁惧缂栫爜锛�">{{ form.serialNumber }}</el-form-item>
- <el-form-item label="璁惧鍚嶇О锛�">{{ form.name }} </el-form-item>
- <el-form-item label="鍦板尯锛�">{{ form.address }} </el-form-item>
- <el-form-item label="涓婃姤閮ㄩ棬锛�">{{ form.deptName }} </el-form-item>
+ <el-form-item label="璁惧鍚嶇О锛�">{{ form.name }}</el-form-item>
+ <el-form-item label="鍦板尯锛�">{{ form.address }}</el-form-item>
+ <el-form-item label="涓婃姤閮ㄩ棬锛�">{{ form.deptName }}</el-form-item>
<el-form-item label="璁惧鐘舵�侊細">
<div v-if="form.onState === 1">鍙敤</div>
<div v-else-if="form.onState === 2">涓嶅彲鐢�</div>
@@ -178,25 +179,26 @@
</template>
<script>
-import { videoCount, listMonitor, getMonitor, delMonitor, addMonitor, updateMonitor } from "@/api/platform/monitor";
-import { listDept } from "@/api/system/dept";
+import {videoCount, listMonitor, getMonitor, delMonitor, addMonitor, updateMonitor} from "@/api/platform/monitor";
+import {listDept} from "@/api/system/dept";
+
export default {
name: "Monitor",
- dicts: ['sys_normal_disable', 'platform_yes_no','camera_state'],
+ dicts: ['sys_normal_disable', 'platform_yes_no', 'camera_state'],
data() {
return {
deptList: [],
// 鍒椾俊鎭�
columns: [
- { key: 0, label: `鏍囩`, visible: true },
- { key: 1, label: `鍖哄煙`, visible: true },
- { key: 2, label: `璁惧鐘舵�乣, visible: true },
- { key: 3, label: `鏄惁鐢熸垚寮傚父宸ュ崟`, visible: true },
- { key: 4, label: `鏁版嵁鏃堕棿`, visible: true },
- { key: 5, label: `绠＄悊鍗曚綅`, visible: true },
- { key: 6, label: `淇′护鏃跺欢`, visible: true },
- { key: 7, label: `瑙嗛鏃跺欢`, visible: true },
- { key: 8, label: `鍏抽敭甯ф椂寤禶, visible: true }
+ {key: 0, label: `鏍囩`, visible: true},
+ {key: 1, label: `鍖哄煙`, visible: true},
+ {key: 2, label: `璁惧鐘舵�乣, visible: true},
+ {key: 3, label: `鏄惁鐢熸垚寮傚父宸ュ崟`, visible: true},
+ {key: 4, label: `鏁版嵁鏃堕棿`, visible: true},
+ {key: 5, label: `绠＄悊鍗曚綅`, visible: true},
+ {key: 6, label: `淇′护鏃跺欢`, visible: true},
+ {key: 7, label: `瑙嗛鏃跺欢`, visible: true},
+ {key: 8, label: `鍏抽敭甯ф椂寤禶, visible: true}
],
count: {
totalPosts: 0,
@@ -243,16 +245,16 @@
// 琛ㄥ崟鏍￠獙
rules: {
serialNumber: [
- { required: true, message: "璁惧缂栫爜涓嶈兘涓虹┖", trigger: "blur" }
+ {required: true, message: "璁惧缂栫爜涓嶈兘涓虹┖", trigger: "blur"}
],
name: [
- { required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
+ {required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur"}
],
onState: [
- { required: true, message: "璁惧鐘舵��", trigger: "blur" }
+ {required: true, message: "璁惧鐘舵��", trigger: "blur"}
],
address: [
- { required: true, message: "鍦板潃涓嶈兘涓虹┖", trigger: "blur" }
+ {required: true, message: "鍦板潃涓嶈兘涓虹┖", trigger: "blur"}
],
}
};
@@ -260,11 +262,16 @@
created() {
this.getVideoCount();
this.getList();
- listDept({ status: 0 }).then(response => {
+ listDept({status: 0}).then(response => {
this.deptList = response.data.filter(item => item.area);
});
},
methods: {
+ clickTab(active) {
+ this.queryParams.provinceTag = active
+ this.getList()
+ this.getVideoCount()
+ },
/** 鏌ヨ璁惧璧勪骇鍒楄〃 */
getList() {
this.loading = true;
@@ -274,9 +281,9 @@
this.loading = false;
});
},
- /** 鏌ヨ璁惧璧勪骇缁熻鏁� */
- getVideoCount() {
- videoCount('1').then(response => {
+ /** 鏌ヨ璁惧璧勪骇缁熻鏁� */
+ getVideoCount() {
+ videoCount(this.queryParams).then(response => {
this.count = response.data;
});
},
@@ -316,7 +323,7 @@
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
- this.single = selection.length!==1
+ this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 鏂板鎸夐挳鎿嶄綔 */
@@ -363,12 +370,13 @@
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
const ids = row.id || this.ids;
- this.$modal.confirm('鏄惁纭鍒犻櫎璁惧璧勪骇缂栧彿涓�"' + ids + '"鐨勬暟鎹」锛�').then(function() {
+ this.$modal.confirm('鏄惁纭鍒犻櫎璁惧璧勪骇缂栧彿涓�"' + ids + '"鐨勬暟鎹」锛�').then(function () {
return delMonitor(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(() => {});
+ }).catch(() => {
+ });
},
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
handleExport() {
@@ -380,6 +388,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: hsl(0, 0%, 100%);
@@ -387,6 +419,7 @@
margin-bottom: 20px;
height: 120px;
}
+
.icon-container {
display: flex;
justify-content: center;
@@ -396,6 +429,7 @@
height: 80px;
margin-left: 5%;
}
+
.el-icon-video-camera {
font-size: 50px;
color: #FFFFFF;
--
Gitblit v1.8.0