From fa7044f3ccc9a91bc2bc117d1a06f650d86554f2 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期二, 15 六月 2021 16:07:16 +0800
Subject: [PATCH] 优化联动规则加载场景列表的操作
---
src/pages/library/components/personList.vue | 235 +++++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 191 insertions(+), 44 deletions(-)
diff --git a/src/pages/library/components/personList.vue b/src/pages/library/components/personList.vue
index 6ade657..697ca59 100644
--- a/src/pages/library/components/personList.vue
+++ b/src/pages/library/components/personList.vue
@@ -1,31 +1,13 @@
<template>
<div class="table-parent">
- <el-row class style="margin:20px">
- <!-- <el-col :span="4" class="tl">
- <b class="f14">{{this.baseObject.tableName}}</b>
- </el-col>
- <el-col :span="2">
- <b class="f14">{{this.baseObject.bwType === '1'?'榛戝悕鍗�':'鐧藉悕鍗�'}}</b>
- </el-col>
- <el-col :span="8">
- <b class="f14">鏈夋晥鏃堕棿锛歿{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'姘镐箙鏈夋晥'}}</b>
- </el-col>-->
- <div class="tl">
- <span
- class="f14"
- style="color:#000000;"
- >{{this.baseObject.tableName?this.baseObject.tableName + '/ ':''}}</span>
- <span
- class="f14"
- style="color:#000000;"
- >{{this.baseObject.bwType === '1'?'榛戝悕鍗�/ ':'鐧藉悕鍗�/ '}}</span>
- <span
- class="f14"
- style="color:#000000;"
- >鏈夋晥鏃堕棿锛歿{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'姘镐箙鏈夋晥'}}</span>
+ <el-row style="margin-top:20px">
+ <div class="base-tip">
+ <span>{{this.baseObject.tableName?this.baseObject.tableName + '/ ':''}}</span>
+ <span>{{this.baseObject.bwType === '1'?'榛戝悕鍗�/ ':'鐧藉悕鍗�/ '}}</span>
+ <span>鏈夋晥鏃堕棿锛歿{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'姘镐箙鏈夋晥'}}</span>
</div>
</el-row>
- <el-row class style="margin:40px 0 40px 20px">
+ <el-row class style="margin:40px 0 40px 0px">
<el-col :span="6">
<el-input
placeholder="濮撳悕/鎬у埆/韬唤璇佸彿/鎵嬫満鍙�"
@@ -42,13 +24,13 @@
<el-button size="small" type="primary" @click="handleSearch">鎼滅储</el-button>
</el-col>
<el-col :offset="11" :span="3">
- <fTemplate authority="videoTable:edit">
+ <fTemplate authority="library:set">
<el-button
size="small"
class="ml10"
type="danger"
@click="deleteBatch"
- v-if="isShow('videoTable:edit')"
+ v-if="isShow('library:set')"
>鎵归噺鍒犻櫎</el-button>
</fTemplate>
</el-col>
@@ -59,7 +41,7 @@
limitSize
uploadBtntext="涓婁紶鐓х墖"
uploadBtnIcon
- v-if="isShow('videoTable:edit')"
+ v-if="isShow('library:set')"
uploadBtnSize="small"
:isDrag="true"
@addFilesBaBackFN="changeDialog"
@@ -135,7 +117,7 @@
<el-switch
v-model="scope.row.enable"
:active-value="1"
- :disabled="!isShow('videoTable:edit')"
+ :disabled="!isShow('library:set')"
:inactive-value="0"
@change="enable(scope.row)"
></el-switch>
@@ -143,7 +125,7 @@
</el-table-column>
<el-table-column label="鎿嶄綔" min-width="200" align="center">
<template slot-scope="scope">
- <fTemplate authority="videoTable:edit">
+ <fTemplate authority="library:set">
<el-tooltip content="缂栬緫" placement="top" popper-class="atooltip">
<span
class="iconfont iconbianji iconStyle1"
@@ -155,7 +137,10 @@
<el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip">
<span class="iconfont iconsousuoren iconStyle1" @click="tosearch(scope.row)"></span>
</el-tooltip>
- <fTemplate authority="videoTable:edit">
+ <el-tooltip content="鏌ョ湅璇︽儏" placement="top" popper-class="atooltip">
+ <span class="iconfont iconsousuoren iconStyle1" @click="showDetail(scope.row)"></span>
+ </el-tooltip>
+ <fTemplate authority="library:set">
<el-tooltip content="澶嶅埗" placement="top" popper-class="atooltip">
<span
class="iconfont iconfuzhi iconStyle1"
@@ -164,7 +149,7 @@
></span>
</el-tooltip>
</fTemplate>
- <fTemplate authority="videoTable:edit">
+ <fTemplate authority="library:set">
<el-tooltip content="绉诲姩" placement="top" popper-class="atooltip">
<span
class="iconfont iconyidongzhi iconStyle1"
@@ -174,7 +159,7 @@
></span>
</el-tooltip>
</fTemplate>
- <fTemplate authority="videoTable:edit">
+ <fTemplate authority="library:set">
<el-tooltip content="鍒犻櫎" placement="top" popper-class="atooltip">
<span
class="iconfont iconshanchu iconStyle1"
@@ -188,15 +173,83 @@
</el-table-column>
</el-table>
</div>
- <div class="pt5 " style="height:40px;position:relative">
+ <div class="pt5" style="height:40px;position:relative">
<el-pagination
+ @size-change="handleSizeChange"
@current-change="refrash"
:current-page="BaseManageData.page"
:page-size="BaseManageData.size"
+ :page-sizes="[10,20,50,100]"
style="position:absolute;right:10px;bottom:5px"
+ layout="total,sizes,prev,pager,next,jumper"
:total="BaseManageData.total"
></el-pagination>
</div>
+ <el-dialog title="鎶撴媿璇︽儏" :visible.sync="cameraDetailVisible" okText="纭畾">
+ <div class="top-bar">
+ <el-date-picker
+ size="mini"
+ @change="timeChange"
+ v-model="timeRange"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ type="datetimerange"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫椂闂�"
+ end-placeholder="缁撴潫鏃堕棿"
+ ></el-date-picker>
+ <div style="margin:0 10px;display:flex;">
+ <span style="width:68px;">鍋滅暀鏃堕暱:</span>
+ <el-input size="mini" style="width: 80px;" v-model.number="reqCameraParams.thresholdTime"></el-input>s
+ </div>
+ <el-button size="mini" type="primary" @click="postCameraData">鏌ヨ</el-button>
+ </div>
+
+ <div class="member-info">
+ <label class>浜哄憳淇℃伅:</label>
+ <ul>
+ <li>
+ <span>濮撳悕:</span>
+ <span>{{memberInfo.personName}}</span>
+ </li>
+ <li>
+ <span>鎬у埆:</span>
+ <span>{{memberInfo.sex}}</span>
+ </li>
+ <li>
+ <span>韬唤璇佸彿:</span>
+ <span>{{memberInfo.idCard}}</span>
+ </li>
+ <li>
+ <span>鎰忓浘:</span>
+ <span>{{memberInfo.reserved}}</span>
+ </li>
+ </ul>
+ </div>
+
+ <el-table :data="cameraDetailData" border>
+ <el-table-column prop="faceImg" label="鎶撴媿瀹炴櫙" width="160" align="center">
+ <template slot-scope="scope">
+ <div>
+ <img
+ v-if="scope.row.faceImg"
+ :src="`/httpImage/`+scope.row.faceImg"
+ style="max-height:84px;width:84px;object-fit:contain;background:rgba(0,0,0,0.35);"
+ class="avatar"
+ />
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="cameraName" label="鎽勫儚鏈哄悕绉�" width="100" align="center"></el-table-column>
+ <el-table-column prop="startTime" label="寮�濮嬫椂闂�" align="center"></el-table-column>
+ <el-table-column prop="endTime" label="缁撴潫鏃堕棿" align="center"></el-table-column>
+ <el-table-column prop="stayTime" label="鍋滅暀鏃堕暱" width="99" align="center">
+ <template slot-scope="scope">
+ <span>{{scope.row.stayTime}} 绉�</span>
+ </template>
+ </el-table-column>
+ </el-table>
+ <p style="text-align:right; font-size: 14px;">鍏眥{faceDataCount}}鏉℃暟鎹�</p>
+ </el-dialog>
<el-dialog
title="淇敼淇℃伅"
:visible.sync="dialogFormVisible"
@@ -254,7 +307,11 @@
</el-row>
<el-row>
<el-col :span="20">
- <el-form-item label="鎬у埆" prop="sex" style="width:100%;margin-bottom: 10px;" class="tl">
+ <el-form-item
+ label="鎬у埆"
+ prop="sex"
+ style="width:100%;margin-bottom: 8px; text-align: left"
+ >
<el-radio-group v-model="form.sex" class="mt10">
<el-radio label="鐢�"></el-radio>
<el-radio label="濂�"></el-radio>
@@ -449,14 +506,48 @@
</template>
<script>
import { updateBasePerson, deleteBasePersons } from "@/api/baseLibrary";
+import { getCameraFaceData } from "@/api/es";
import axios from "axios";
// import { findByType } from '@/server/video.js'
import Upload from "./upload";
import fTemplate from "@/components/fTemplate";
import UploadIcon from "@/components/searching/UploadIcon.vue";
+
+Date.prototype.Format = function (fmt) {
+ var o = {
+ "M+": this.getMonth() + 1, //鏈堜唤
+ "d+": this.getDate(), //鏃�
+ "H+": this.getHours(), //灏忔椂
+ "m+": this.getMinutes(), //鍒�
+ "s+": this.getSeconds(), //绉�
+ "q+": Math.floor((this.getMonth() + 3) / 3), //瀛ｅ害
+ "S": this.getMilliseconds() //姣
+ };
+ if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
+ for (var k in o)
+ if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
+ return fmt;
+}
+
export default {
data() {
return {
+ timeRange: [new Date(2020, 7, 25, 8), new Date(new Date().setHours(23, 59, 59))],
+ memberInfo: {
+ personName: '',
+ sex: '',
+ idCard: '',
+ reserved: ''
+ },
+ reqCameraParams: {
+ startTime: new Date(2020, 7, 25, 8).Format("yyyy-MM-dd HH:mm:ss"),
+ endTime: new Date().Format("yyyy-MM-dd HH:mm:ss"),
+ thresholdTime: 10,
+ faceId: []
+ },
+ cameraDetailData: [],
+ cameraDetailVisible: false,
+
dialogFormVisible: false,
copyVisiabled: false,
moveVisiabled: false,
@@ -467,7 +558,7 @@
pageSize: 10,
total: 0,
orderType: "desc",
- orderName: "id",
+ orderName: "createTime",
contentValue: "",
visible: false,
selectedRowKeys: [],
@@ -499,6 +590,7 @@
peoperLevel: [],
oldWidth: "",
oldHeight: "",
+ faceDataCount: 0,
// 涓婁紶鍚庣殑寮规鏄剧ず
dialogVisible: false,
// 鎵归噺涓婁紶鍚庣殑杩斿洖缁撴灉
@@ -520,6 +612,28 @@
}
},
methods: {
+ postCameraData() {
+ getCameraFaceData(this.reqCameraParams).then(res => {
+ if (res && res.rtnCode == 1) {
+ this.cameraDetailData = res.rtnData
+ this.faceDataCount = res.rtnData.length
+ }
+ })
+ },
+ timeChange(val) {
+ this.reqCameraParams.startTime = val[0];
+ this.reqCameraParams.endTime = val[1];
+
+ },
+ showDetail(row) {
+ this.cameraDetailData = []
+ this.memberInfo.reserved = row.reserved;
+ this.memberInfo.idCard = row.idCard;
+ this.memberInfo.personName = row.personName;
+ this.memberInfo.sex = row.sex;
+ this.reqCameraParams.faceId = row.id;
+ this.cameraDetailVisible = true;
+ },
isShow(authority) {
if (this.isAdmin) {
return true
@@ -580,7 +694,7 @@
console.log("hello");
},
getUploadResult(result) {
- console.log(result, "涓婁紶鐨勮繑鍥�");
+ // console.log(result, "涓婁紶鐨勮繑鍥�");
this.uploadResult = result.data;
this.dialogVisible = true;
this.getPersonList();
@@ -612,6 +726,11 @@
refrash(current, pageSize) {
this.current = current;
this.BaseManageData.page = current;
+ this.getPersonList();
+ },
+ handleSizeChange(val){
+ //this.pageSize = val;
+ this.BaseManageData.size = val;
this.getPersonList();
},
handleClick(row) {
@@ -832,11 +951,7 @@
//let captureId = item.id == "" ? item.baseInfo[0].targetId : item.id
let captureId = item.id == "" ? item.personId : item.id
let imgUrl = item.personPicUrl ? item.personPicUrl : item.personPicUrl
- let compType = 1 // 鏁版嵁鏉ヨ嚜浜巈s
- if (!item.id || item.id == "") {
- compType = 0 // 鏁版嵁鏉ヨ嚜浜庡簳搴�
- }
- // window.open(href + '?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + url + '&compType=' + compType)
+ let compType = 0;
let message = 'toSearch?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType;
window.parent.postMessage({
@@ -1032,8 +1147,15 @@
}
.table-parent {
// position: relative;
+ margin-left: 5px;
height: 90%;
overflow: visible !important;
+
+ .base-tip {
+ text-align: left;
+ font-size: 14px;
+ color: #000000;
+ }
}
.text-left {
@@ -1046,9 +1168,9 @@
border-bottom: none;
// border-bottom: none;
}
-.el-dialog{
+.el-dialog {
min-width: 515px;
- .el-button--info{
+ .el-button--info {
color: #222;
}
}
@@ -1097,7 +1219,10 @@
color: #222222;
text-align: center;
}
-
+.el-table th {
+ color: #222;
+ background: #ececec;
+}
.el-table .cell {
padding-left: 8px !important;
padding-right: 0px !important;
@@ -1165,9 +1290,31 @@
}
.avatar-uploader {
+ margin: auto;
max-width: 150px;
min-width: 150px;
min-height: 152px;
border: 1px solid #eee;
}
+.top-bar {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ line-height: 30px;
+}
+.member-info {
+ font-size: 13px;
+ margin: 10px 0;
+ display: flex;
+ label {
+ color: #999;
+ margin-right: 6px;
+ }
+ ul {
+ display: flex;
+ li {
+ margin-right: 8px;
+ }
+ }
+}
</style>
--
Gitblit v1.8.0