From 994e5e08cba4e6b9ce321b7cf5cb1ec8d19dfa22 Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期二, 12 四月 2022 17:50:21 +0800
Subject: [PATCH] 摄像机管理
---
src/views/hashrate/HashManage/components/EquipmentForm.vue | 276 +++++++++++++++++++++++++++++--------------------------
1 files changed, 145 insertions(+), 131 deletions(-)
diff --git a/src/views/hashrate/HashManage/components/EquipmentForm.vue b/src/views/hashrate/HashManage/components/EquipmentForm.vue
index 9740c0a..5522d29 100644
--- a/src/views/hashrate/HashManage/components/EquipmentForm.vue
+++ b/src/views/hashrate/HashManage/components/EquipmentForm.vue
@@ -1,12 +1,12 @@
<template>
<div class="EquipmentForm">
<div class="back">
- <span class="iconfont" @click="hiddenList"></span>鏈嶅姟鍣�20.10
+ <span class="iconfont" @click="hiddenList"></span>{{ name }}
</div>
<div class="header">
<div class="search">
<el-input v-model="searchInput" placeholder="璇疯緭鍏ュ唴瀹�"></el-input>
- <div class="button searchBtn">鎼滅储</div>
+ <div class="button searchBtn" @click="getDevice">鎼滅储</div>
<div class="button settingBtn" @click="showSettingBox = true">璁剧疆</div>
</div>
@@ -29,58 +29,74 @@
:fit="true"
:stripe="true"
>
- <el-table-column label="搴忓彿" class-name="index" width="70">
- <template slot-scope="scope">{{
- scope.$index + 1 + (page - 1) * size
- }}</template>
- </el-table-column>
<el-table-column
- prop="name"
+ label="搴忓彿"
+ type="index"
+ align="center"
+ width="80"
+ ></el-table-column>
+ <el-table-column
label="鎽勫儚鏈哄悕绉�"
+ align="center"
show-overflow-tooltip
- ></el-table-column>
- <el-table-column
- prop="position"
- label="鎽勫儚鏈轰綅缃�"
- show-overflow-tooltip
- ></el-table-column>
- <el-table-column prop="IP" label="鎽勫儚鏈篒P"></el-table-column>
- <el-table-column prop="type" label="鎽勫儚鏈虹被鍨�"></el-table-column>
- <el-table-column prop="sdk" label="鎵ц绠楁硶"></el-table-column>
- <el-table-column prop="device" label="杩愯璁惧"></el-table-column>
-
- <el-table-column label="鐘舵��">
+ >
<template slot-scope="scope">
- <div v-if="scope.row.status == 1" class="status green">澶勭悊涓�</div>
- <div v-else class="status">绛夊緟澶勭悊</div>
+ <span>{{
+ scope.row.alias !== "" ? scope.row.alias : scope.row.name
+ }}</span>
</template>
</el-table-column>
-
- <el-table-column label="瀹炴椂/杞">
+ <el-table-column
+ label="鎽勫儚鏈哄湴鍧�"
+ prop="addr"
+ align="center"
+ show-overflow-tooltip
+ ></el-table-column>
+ <el-table-column
+ label="鎽勫儚鏈篒P"
+ prop="ip"
+ align="center"
+ ></el-table-column>
+ <el-table-column label="鎽勫儚鏈虹被鍨�" align="center">
<template slot-scope="scope">
- <div class="switch">
- <el-switch
- v-model="scope.row.realTime"
- active-color="#D4E3FA"
- inactive-color="#FAE4D4"
- :width="56"
- >
- </el-switch>
- <div
- class="activeText"
- v-if="scope.row.realTime"
- @click="scope.row.realTime = !scope.row.realTime"
- >
- 瀹炴椂
- </div>
- <div
- class="inactiveText"
- v-else
- @click="scope.row.realTime = !scope.row.realTime"
- >
- 杞
- </div>
- </div>
+ <span>{{ scope.row.runType | cameraType }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎵ц绠楁硶" align="center" show-overflow-tooltip>
+ <template slot-scope="scope">
+ <span v-if="scope.row.tasks != null">{{
+ scope.row.tasks | taskList
+ }}</span>
+ <span v-else>-</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="杩愯璁惧" align="center">
+ <template slot-scope="scope">
+ <span>{{ scope.row.runServerName }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="鐘舵��" align="center" show-overflow-tooltip>
+ <template slot-scope="scope">
+ <span v-if="scope.row.isRunning">{{ "澶勭悊涓�" }}</span>
+ <span v-else>{{ "绛夊緟澶勭悊" }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="瀹炴椂/杞" align="center" width="100px">
+ <template slot-scope="scope">
+ <span v-if="scope.row.runType === -1">-</span>
+ <toggle-button
+ v-else
+ :value="scope.row.runType === 1"
+ :width="60"
+ :labels="{ checked: '瀹炴椂', unchecked: '杞' }"
+ :color="{
+ checked: '#4D88FF',
+ unchecked: '#FF7733',
+ disabled: '#CCCCCC',
+ }"
+ :sync="true"
+ @change="pollSwitch(scope.row)"
+ />
</template>
</el-table-column>
</el-table>
@@ -102,113 +118,111 @@
<SettingBox
v-if="showSettingBox"
@close="showSettingBox = false"
+ :id="id"
></SettingBox>
</div>
</template>
<script>
import SettingBox from "./SettingBox";
+import { getCameraByPage } from "@/api/clusterManage";
export default {
+ props: {
+ id: {},
+ name: {},
+ },
components: {
SettingBox,
+ },
+ created() {
+ this.getDevice();
},
data() {
return {
searchInput: "",
showSettingBox: false,
- dataList: [
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 1,
- realTime: true,
- },
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 0,
- realTime: true,
- },
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 1,
- realTime: true,
- },
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 1,
- realTime: true,
- },
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 1,
- realTime: true,
- },
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 1,
- realTime: false,
- },
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 1,
- realTime: false,
- },
- {
- name: "5.151锛堜骇鍝佹梺锛�265",
- position: "5.155鎽勫儚鏈�",
- IP: "192.168.20.110",
- type: "鐩戞帶鎽勫儚鏈�",
- sdk: "鍦烘櫙1锛宻leep",
- device: "189鏈嶅姟",
- status: 1,
- realTime: false,
- },
- ],
+ dataList: [],
page: 1,
size: 10,
total: 100,
};
},
methods: {
- handleSizeChange() {},
- refrash() {},
+ async getDevice() {
+ const res = await getCameraByPage({
+ deviceId: this.id,
+ inputText: this.searchInput,
+ page: this.page,
+ size: this.size,
+ });
+ if (res && res.success) {
+ this.dataList = res.data.lists;
+ this.total = res.data.total;
+ }
+ // 鏍规嵁rtsp 鎻愬彇ip鍦板潃
+ const ipReg = /\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}/;
+ this.dataList.forEach((cam) => {
+ // 鍥芥爣鎽勫儚鏈轰笉鏄剧ずip
+ if (cam.type === 1) {
+ cam.ip = "-";
+ return;
+ }
+ let ip = ipReg.exec(cam.rtsp);
+ if (ip.length > 0) {
+ cam.ip = ip[0];
+ }
+ });
+ },
+ handleSizeChange(size) {
+ this.size = size;
+ this.getDevice();
+ },
+ refrash(page) {
+ this.page = page;
+ this.getDevice();
+ },
hiddenList() {
this.$emit("hiddenList");
},
+ pollSwitch(row) {
+ changeRunType({ camera_ids: [row.id], run_type: row.run_type ^ 1 }).then(
+ (rsp) => {
+ if (rsp && rsp.success) {
+ this.$notify({
+ type: "success",
+ message: "閰嶇疆鎴愬姛",
+ });
+
+ row.run_type = row.run_type ^ 1;
+ } else {
+ this.$notify({
+ type: "error",
+ message: "閰嶇疆澶辫触",
+ });
+ }
+
+ // this.PollData.fetchPollList();
+ }
+ );
+ },
+ },
+ filters: {
+ cameraType(type) {
+ return type === -1 ? "鐩戞帶鎽勫儚鏈�" : "AI鎽勫儚鏈�";
+ },
+ taskList(tasks) {
+ return tasks
+ .filter((task) => {
+ return task.hasRule;
+ })
+ .map((task) => {
+ return task.taskname;
+ })
+ .join(",");
+ },
+ switchText(type) {
+ return type ? "宸插紑鍚�" : "鏈紑鍚�";
+ },
},
};
</script>
--
Gitblit v1.8.0