Commit 09e2faff by 潘建波

增加列表展示图片

1 parent ee93678e
No preview for this file type
......@@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.png">
<title></title>
<title>AI视频分析平台</title>
<script src="<%= BASE_URL %>js/kinetic-v5.1.0.min.js"></script>
<script src="<%= BASE_URL %>js/ObjTree.js"></script>
<script src="<%= BASE_URL %>js/jquery.min.js"></script>
......
export let config = {
"logstatus":true, //是否开启日志收集
"logstatus":false, //是否开启日志收集
"hadertitle":"AI视频分析平台",//系统标题
"logintitle":"AI视频分析平台"//展示标题
"logintitle":"AI视频分析平台",//展示标题
"https": false,
}
\ No newline at end of file
{"commit":"fd62f96ec39cb7d3c47b3f4b918431e4fc2d5795","commitDate":"2020-10-29 16:12","buildDate":"2020-11-25 17:0","version":"2.0.8","info":"密文登录"}
\ No newline at end of file
{"commit":"ee93678efa5d71b73b150061b821123318d8e244","commitDate":"2020-11-27 9:51","buildDate":"2020-12-23 18:0","version":"2.0.9","info":"1.【new】添加admin重置普通用户密码功能 2.【new】添加密码登录5次锁定功能 3.【bug】修复角色管理菜单选中BUG 4.【bug】修复系统管理用户管理添加时间IE下显示错误"}
\ No newline at end of file
[![][KurentoImage]][website]
Copyright © 2014 Kurento. Licensed under [LGPL License].
Kurento RTSP/HTTP URI to WebRTC example
===========================
Kurento Client JavaScript demos
This project is a simple example showing how to tranform a RTSP URI or an HTTP video URI
feeds into a WebRTC stream.
Installation instructions
-------------------------
Be sure to have installed [Node.js] in your system:
```bash
curl -sL https://deb.nodesource.com/setup | sudo bash -
sudo apt-get install -y nodejs
```
Also be sure to have installed [Bower] in your system:
```bash
sudo npm install -g bower
```
To launch the demo, run:
```bash
cd kurento-rtsp2webrtc
bower install
```
An HTTP server is required for these demos. A very simple way of doing this is
by means of a NodeJS server. This server can be installed as follows:
```bash
sudo npm install -g http-server
```
Then, in each demo folder execute this command:
```bash
http-server
```
Finally, open this URL in your browser: http://localhost:8080/
Insert the RTSP or HTTP video feed into the input text and press "start"
Optional parameters
-------------------
The demos accept some optional GET parameters given on the URL, you only need to
add them to the query string in the same way you would add them to the Node.js
executable on your command line:
```
http://example.com/index.html?ws_url=ws://example.org/kurento
```
All the demos accept the *ws_url* parameter to set the WebSocket Kurento
MediaServer endpoint, other parameters specific to each demo can be found at the
top of their index.js files.
Kurento
=======
What is Kurento
---------------
Kurento provides an open platform for video processing and streaming based on
standards.
This platform has several APIs and components which provide solutions to the
requirements of multimedia content application developers. These include:
* Kurento Media Server (KMS). A full featured media server providing
the capability to create and manage dynamic multimedia pipelines.
* Kurento Clients. Libraries to create applications with media
capabilities. Kurento provides libraries for Java, browser JavaScript,
and Node.js.
Downloads
---------
To download binary releases of Kurento components visit http://kurento.org
Code for other Kurento projects can be found in the [GitHub Kurento group].
News and Website
----------------
Information about Kurento can be found on our [website].
Follow us on Twitter @[kurentoms].
[Bower]: http://bower.io
[co]: https://github.com/visionmedia/co
[GitHub Kurento group]: https://github.com/kurento
[GitHub repository]: https://github.com/Kurento/kurento-tutorial-js
[KurentoImage]: https://secure.gravatar.com/avatar/21a2a12c56b2a91c8918d5779f1778bf?s=120
[kurentoms]: http://twitter.com/kurentoms
[kurento-client-js]: https://github.com/Kurento/kurento-client-js
[kurento-utils-js]: https://github.com/Kurento/kurento-utils-js
[LGPL License]: http://www.gnu.org/licenses/lgpl-2.1.html
[Node.js]: http://nodejs.org/
[website]: http://kurento.org
{
"name": "kurento-hello-world",
"version": "5.1.1-dev",
"description": "Kurento Browser JavaScript Tutorial 1: Hello World (WebRTC in loopback)",
"authors": [
"Kurento <info@kurento.org>"
],
"main": "index.html",
"moduleType": [
"globals"
],
"license": "LGPL",
"homepage": "http://www.kurento.org/",
"private": true,
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"dependencies": {
"bootstrap": "~3.3.0",
"ekko-lightbox": "~3.2.3",
"adapter.js": "v0.2.9",
"kurento-client": "master",
"kurento-utils": "master"
}
}
/*
* (C) Copyright 2014 Kurento (http://kurento.org/)
*
* All rights reserved. This program and the accompanying materials
* are made available under the terms of the GNU Lesser General Public License
* (LGPL) version 2.1 which accompanies this distribution, and is available at
* http://www.gnu.org/licenses/lgpl-2.1.html
*
* This library is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
* Lesser General Public License for more details.
*
*/
@CHARSET "UTF-8";
html {
position: relative;
min-height: 100%;
}
body {
padding-top: 40px;
body
}
video,#console {
display: block;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-webkit-transition: border-color ease-in-out .15s, box-shadow
ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
#console {
overflow-y: auto;
width: 100%;
height: 120px;
}
.col-md-2 {
width: 80px;
padding-top: 190px;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="expires" content="0">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="shortcut icon" href="./img/kurento.png" type="image/png" />
<link rel="stylesheet"
href="bower_components/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet"
href="bower_components/ekko-lightbox/dist/ekko-lightbox.min.css">
<link rel="stylesheet" href="css/kurento.css">
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/ekko-lightbox/dist/ekko-lightbox.min.js"></script>
<script src="bower_components/adapter.js/adapter.js"></script>
<script src="bower_components/kurento-client/js/kurento-client.js"></script>
<script src="bower_components/kurento-utils/js/kurento-utils.js"></script>
<script src="./js/console.js"></script>
<script src="./js/index.js"></script>
<title>Kurento RTSP to WebRTC player</title>
</head>
<body>
<header>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse"></button>
<a class="navbar-brand" href="./">Kurento Tutorial</a>
</div>
<div class="collapse navbar-collapse"
id="bs-example-navbar-collapse-1"></div>
</div>
</div>
</header>
<div class="container">
<div class="page-header">
<h1>Kurento RTSP to WebRTC player</h1>
</div>
<div class="row">
<div class="col-md-5">
<h3>Remote stream</h3>
<video id="videoOutput" autoplay width="480px" height="360px"
poster="./img/webrtc.png"></video>
</br>
Set source URL: <input style="width:350px;" id="address" type="text">
</br></br>
</div>
<div class="col-md-2">
<a id="start" href="#" class="btn btn-success"><span
class="glyphicon glyphicon-play"></span> Start</a><br /> <br /> <a
id="stop" href="#" class="btn btn-danger"><span
class="glyphicon glyphicon-stop"></span> Stop</a>
</div>
<div class="col-md-5">
</div>
<div class="row">
<div class="col-md-12">
<label class="control-label" for="console">Console</label>
<div id="console"></div>
</div>
</div>
</div>
<footer>
<div class="foot-fixed-bottom">
<div class="container text-center">
<hr />
<div class="row">&copy; 2014 Kurento</div>
<div class="row">
<div class="col-md-4">
<a href="http://www.urjc.es"><img src="./img/urjc.gif"
alt="Universidad Rey Juan Carlos" height="50px" /></a>
</div>
<div class="col-md-4">
<a href="http://www.kurento.org"><img src="./img/kurento.png"
alt="Kurento" height="50px" /></a>
</div>
<div class="col-md-4">
<a href="http://www.naevatec.com"><img
src="./img/naevatec.png" alt="Naevatec" height="50px" /></a>
</div>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>
/*
* (C) Copyright 2013 Kurento (http://kurento.org/)
*
* All rights reserved. This program and the accompanying materials
* are made available under the terms of the GNU Lesser General Public License
* (LGPL) version 2.1 which accompanies this distribution, and is available at
* http://www.gnu.org/licenses/lgpl-2.1.html
*
* This library is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
* Lesser General Public License for more details.
*
*/
/**
* Object that piggy-back the browser console and show their messages on a DIV
*
* Inspired by Node.js ClIM module (https://github.com/epeli/node-clim)
*
* @constructor
*
* @param {String}
* id: id attribute of the DIV tag where to show the messages
* @param console:
* reference to the original browser console
*/
function Console(id, console) {
var div = document.getElementById(id);
function createMessage(msg, color) {
// Sanitize the input
msg = msg.toString().replace(/</g, '&lt;');
var span = document.createElement('SPAN');
if (color != undefined) {
span.style.color = color;
}
span.appendChild(document.createTextNode(msg));
return span;
}
this._append = function(element) {
div.appendChild(element);
div.appendChild(document.createElement('BR'));
// $(window).scrollTo('max', {duration: 500});
};
/**
* Show an Error message both on browser console and on defined DIV
*
* @param msg:
* message or object to be shown
*/
this.error = function(msg) {
console.error(msg);
this._append(createMessage(msg, "#FF0000"));
};
/**
* Show an Warn message both on browser console and on defined DIV
*
* @param msg:
* message or object to be shown
*/
this.warn = function(msg) {
console.warn(msg);
this._append(createMessage(msg, "#FFA500"));
};
/**
* Show an Info message both on browser console and on defined DIV
*
* @param msg:
* message or object to be shown
*/
this.info = this.log = function(msg) {
console.info(msg);
this._append(createMessage(msg));
};
/**
* Show an Debug message both on browser console and on defined DIV
*
* @param msg:
* message or object to be shown
*/
this.debug = function(msg) {
console.log(msg);
// this._append(createMessage(msg, "#0000FF"));
};
}
/*
* (C) Copyright 2014 Kurento (http://kurento.org/)
*
* All rights reserved. This program and the accompanying materials
* are made available under the terms of the GNU Lesser General Public License
* (LGPL) version 2.1 which accompanies this distribution, and is available at
* http://www.gnu.org/licenses/lgpl-2.1.html
*
* This library is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
* Lesser General Public License for more details.
*
*/
function getopts(args, opts)
{
var result = opts.default || {};
args.replace(
new RegExp("([^?=&]+)(=([^&]*))?", "g"),
function($0, $1, $2, $3) { result[$1] = $3; });
return result;
};
var args = getopts(location.search,
{
default:
{
ws_uri: 'ws://' + '192.168.9.133' + ':8888/kurento',
ice_servers: undefined
}
});
if (args.ice_servers) {
console.log("Use ICE servers: " + args.ice_servers);
kurentoUtils.WebRtcPeer.prototype.server.iceServers = JSON.parse(args.ice_servers);
} else {
console.log("Use freeice")
}
window.addEventListener('load', function(){
console = new Console('console', console);
var videoOutput = document.getElementById('videoOutput');
var address = document.getElementById('address');
address.value = 'http://files.kurento.org/video/puerta-del-sol.ts';
var pipeline;
var webRtcPeer;
startButton = document.getElementById('start');
startButton.addEventListener('click', start);
stopButton = document.getElementById('stop');
stopButton.addEventListener('click', stop);
function start() {
if(!address.value){
window.alert("You must set the video source URL first");
return;
}
address.disabled = true;
showSpinner(videoOutput);
var options = {
remoteVideo : videoOutput
};
webRtcPeer = kurentoUtils.WebRtcPeer.WebRtcPeerRecvonly(options,
function(error){
if(error){
return console.error(error);
}
webRtcPeer.generateOffer(onOffer);
webRtcPeer.peerConnection.addEventListener('iceconnectionstatechange', function(event){
if(webRtcPeer && webRtcPeer.peerConnection){
console.log("oniceconnectionstatechange -> " + webRtcPeer.peerConnection.iceConnectionState);
console.log('icegatheringstate -> ' + webRtcPeer.peerConnection.iceGatheringState);
}
});
});
}
function onOffer(error, sdpOffer){
if(error) return onError(error);
kurentoClient(args.ws_uri, function(error, kurentoClient) {
if(error) return onError(error);
kurentoClient.create("MediaPipeline", function(error, p) {
if(error) return onError(error);
pipeline = p;
pipeline.create("PlayerEndpoint", {uri: address.value}, function(error, player){
if(error) return onError(error);
pipeline.create("WebRtcEndpoint", function(error, webRtcEndpoint){
if(error) return onError(error);
setIceCandidateCallbacks(webRtcEndpoint, webRtcPeer, onError);
webRtcEndpoint.processOffer(sdpOffer, function(error, sdpAnswer){
if(error) return onError(error);
webRtcEndpoint.gatherCandidates(onError);
webRtcPeer.processAnswer(sdpAnswer);
});
player.connect(webRtcEndpoint, function(error){
if(error) return onError(error);
console.log("PlayerEndpoint-->WebRtcEndpoint connection established");
player.play(function(error){
if(error) return onError(error);
console.log("Player playing ...");
});
});
});
});
});
});
}
function stop() {
address.disabled = false;
if (webRtcPeer) {
webRtcPeer.dispose();
webRtcPeer = null;
}
if(pipeline){
pipeline.release();
pipeline = null;
}
hideSpinner(videoOutput);
}
});
function setIceCandidateCallbacks(webRtcEndpoint, webRtcPeer, onError){
webRtcPeer.on('icecandidate', function(candidate){
console.log("Local icecandidate " + JSON.stringify(candidate));
candidate = kurentoClient.register.complexTypes.IceCandidate(candidate);
webRtcEndpoint.addIceCandidate(candidate, onError);
});
webRtcEndpoint.on('OnIceCandidate', function(event){
var candidate = event.candidate;
console.log("Remote icecandidate " + JSON.stringify(candidate));
webRtcPeer.addIceCandidate(candidate, onError);
});
}
function onError(error) {
if(error)
{
console.error(error);
stop();
}
}
function showSpinner() {
for (var i = 0; i < arguments.length; i++) {
arguments[i].poster = 'img/transparent-1px.png';
arguments[i].style.background = "center transparent url('img/spinner.gif') no-repeat";
}
}
function hideSpinner() {
for (var i = 0; i < arguments.length; i++) {
arguments[i].src = '';
arguments[i].poster = 'img/webrtc.png';
arguments[i].style.background = '';
}
}
/**
* Lightbox utility (to display media pipeline image in a modal dialog)
*/
$(document).delegate('*[data-toggle="lightbox"]', 'click', function(event) {
event.preventDefault();
$(this).ekkoLightbox();
});
......@@ -23,8 +23,8 @@ export default {
window.videoEquitTableHeight = document.body.clientHeight - 142 + "px";
window.opsTableHeight = document.body.clientHeight - 260 + "px";
if (document.body.clientWidth > 1366) {
window.oneSearchTableHeight = document.body.clientHeight - 250 + "px";
window.twoSearchTableHeight = document.body.clientHeight - 280 + "px";
window.oneSearchTableHeight = document.body.clientHeight - 280 + "px";
window.twoSearchTableHeight = document.body.clientHeight - 320 + "px";
} else {
window.oneSearchTableHeight = document.body.clientHeight - 280 + "px";
window.twoSearchTableHeight = document.body.clientHeight - 315 + "px";
......
......@@ -7,10 +7,11 @@ import device from "./device";
import resource from "./resource";
import codes from "./codes";
import ops from "./ops";
import {config} from '../../public/js/config.js'
let wsIP = "";
switch (process.env.NODE_ENV) {
case "development":
wsIP = "192.168.9.233:20080"; // 测试环境url
wsIP = config.https?"192.168.9.233:20070":"192.168.9.233:20080"; // 测试环境url
// baseUrl = "http://192.168.9.61:8086";
break;
case "pre":
......
let baseUrl = "/api"; // 本地代理
import {config} from '../../public/js/config.js'
console.log(process.env.NODE_ENV);
switch (process.env.NODE_ENV) {
case "development":
// baseUrl = "http://192.168.9.234:20080"; // 测试环境url
baseUrl = "http://192.168.9.233:20080"; // 测试环境url
baseUrl = config.https?"https://192.168.9.233:20070":"http://192.168.9.233:20080"; // 测试环境url
// baseUrl = "http://192.168.9.82:8080"; // 测试环境url
// baseUrl = "http://192.168.9.61:8086";
// baseUrl = 'http://vion-panda.51vip.biz:52510';
......@@ -12,7 +13,8 @@ switch (process.env.NODE_ENV) {
baseUrl = "https://pre-server.feleti.cn"; // 预上线环境url
break;
case "production":
baseUrl = `http://${location.host}`; // 生产环境url
baseUrl = config.https?`https://${location.host}`:`http://${location.host}`; // 生产环境url
break;
}
......
......@@ -186,7 +186,7 @@ Vue.prototype.baseencode = function(str){
// } else {
// base = str;
// }
// return str
return sha1(str);
}
Vue.prototype.showLocalTime = function(obj) {
......
......@@ -254,7 +254,7 @@ display: table-cell!important;
@include font-colr(input_color);
}
.el-dialog__body{
padding: 30px 34px;
padding: 10px 34px;
}
.detailDialog .el-dialog__body{
padding: 0 34px;
......
......@@ -593,4 +593,58 @@ a:active{
.capbox .el-table--border td:first-child .cell, .el-table--border th:first-child .cell, .el-table .cell{
padding-right:0 !important;
padding-left: 0px!important;
}
.desplay-icon{
height: 28px;
overflow: hidden;
width: 20vw;
font-size: 16px;
font-weight: 600;
}
.desplay-icon i{
margin-right: 5px;
border: 1px solid rgb(204, 204, 204);
color: #c3c3c3;
padding: 2px;
cursor: pointer;
}
.desplay-icon i:hover{
@include font-colr(submenu_houver);
}
.listbox{
display: flex;
flex-direction: row;
flex-wrap: wrap;
overflow: auto;
color:#606266;
font-size: 14px;
}
.listboxitem{
width: 250px;
margin:0 10px 10px;
overflow: hidden;
border:1px solid rgba(202, 200, 200,.3);
border-radius: 1px;
}
.listboxitem .imgbox{
width: 250px;
}
.listboxitem .imgbox img{
width: 100%;
height: 100%;
}
.listboxitem .el-form-item--small .el-form-item__content, .el-form-item--small .el-form-item__label {
line-height: 20px!important;
padding-left: 5px;
}
.displaybtn-box {
float: right;
padding-bottom: 5px;
}
.displaybtn-box span{
padding-right: 10px;
}
.displaybtn-box .playIcon{
font-size: 15px;
}
\ No newline at end of file
......@@ -10,6 +10,7 @@
</template>
<script>
import {config} from '../../public/js/config'
export default {
data () {
return {
......@@ -23,11 +24,16 @@
let _this = this;
this.videoDialogVisible = true;
this.domTimer = setTimeout(() => {
_this.player = document.getElementById('playerVideo');
this.player = document.getElementById('playerVideo');
console.log(this.player)
_this.player.loop = true;
_this.player.src = play_url;
_this.player.play();
this.player.loop = true;
if(config.https) {
let loc = location.host
this.player.src = `https://${loc}/${play_url.split(":20080")[1]}`
} else {
this.player.src = play_url;
}
this.player.play();
}, 100);
},
closeVideoDialog: function () {
......
......@@ -239,7 +239,13 @@ export default {
let uid = localStorage.getItem("user_unid");
let clientid = localStorage.getItem("client_unid");
this.$api.device.getGlobalWs(uid, clientid).then(data => {
this.globalWs = new WebSocket(data.ws_url);
if(config.https) {
let url = data.ws_url.replace("ws://","wss://")
this.globalWs = new WebSocket(url.replace("20080","20070"));
} else {
let url = data.ws_url;
this.globalWs = new WebSocket(url);
}
let ary = data.ws_url.split("/");
localStorage.setItem("cennect_unid", ary[ary.length - 1]);
......
......@@ -297,7 +297,6 @@ export default {
},
created() {
this.logintitle = config.logintitle;
document.title = config.hadertitle;
this.initHeight();
let _this = this;
document.onkeydown = function(e) {
......
......@@ -48,6 +48,7 @@ import IllegalAlarm from "./eventData/illegalEvent.vue";
import Eventalarm from "./eventData/eventAlarm.vue";
import EventDetail from "./eventDetail.vue";
import { mapState } from "vuex";
import {config} from '../../../public/js/config.js'
export default {
data() {
return {
......@@ -103,12 +104,16 @@ export default {
connectwebsocket(type) {
let that = this;
this.connect_id = new Date().getTime();
this.cws = new WebSocket(
"ws://" +
this.$api.wsIP +
"/websocket/v1/recv_data/connects/" +
this.connect_id
if(config.https) {
this.cws = new WebSocket(
`wss://${this.$api.wsIP}/websocket/v1/recv_data/connects/${this.connect_id}`
);
} else {
this.cws = new WebSocket(
`ws://${this.$api.wsIP}/websocket/v1/recv_data/connects/${this.connect_id}`
);
}
this.cws.onopen = () => {
console.log("ws事件推送服务连接成功");
if (type == 1) {
......
......@@ -6,7 +6,8 @@
width="1100px"
:before-close="beforeHideModal"
>
<TraficCanvas
<div>
<TraficCanvas
:bgUrl="bgUrl"
v-if="type == '0' || type == '5' || type == '3'"
ref="canvas"
......@@ -19,6 +20,20 @@
v-if="type == '7'"
ref="canvas"
></ComplexCanvas>
</div>
<div>
<el-button type="primary" style="float:left; margin-right:10px" @click="down">下载<i class="el-icon-download el-icon--right"></i></el-button>
<el-upload
class="upload-demo"
action=""
:auto-upload="false"
:show-file-list="false"
:on-change="handleChange"
:file-list="fileList">
<el-button type="primary">上传<i class="el-icon-upload el-icon--right"></i></el-button>
<span slot="tip" class="el-upload__tip upinfo"> 手动上传场景图片</span>
</el-upload>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="beforeHideModal">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button>
......@@ -44,7 +59,9 @@ export default {
roiBody: {},
XMLStr: "",
taskData: "",
bgUrl: ""
bgUrl: "",
baseUrl:"",
fileList:[]
};
},
components: {
......@@ -73,6 +90,7 @@ export default {
.then(data => {
if (!data.ecode) {
this.bgUrl = "data:image/png;base64," + data.pic_base64;
this.baseUrl = "data:image/png;base64," + data.pic_base64;
setTimeout(() => {
let img = document.getElementById("pic").childNodes[0];
let canvas = document.createElement("canvas");
......@@ -100,6 +118,46 @@ export default {
}
}, 300);
},
handleChange(file, fileLis){
this.bgUrl = URL.createObjectURL(file.raw);
setTimeout(() => {
let img = document.getElementById("pic").childNodes[0];
let canvas = document.createElement("canvas");
canvas.width = 800;
canvas.height = 500;
try {
canvas.getContext("2d").drawImage(img, 0, 0, 800, 500);
_this.bgUrl = canvas.toDataURL("image/webp");
} catch (error) {
console.log(error);
}
}, 500);
},
down(){
this.downloadurl(this.baseUrl,'scenes_pic')
},
downloadurl(content, fileName) { //下载base64图片
var base64ToBlob = function(code) {
let parts = code.split(';base64,');
let contentType = parts[0].split(':')[1];
let raw = window.atob(parts[1]);
let rawLength = raw.length;
let uInt8Array = new Uint8Array(rawLength);
for(let i = 0; i < rawLength; ++i) {
uInt8Array[i] = raw.charCodeAt(i);
}
return new Blob([uInt8Array], {
type: contentType
});
};
let aLink = document.createElement('a');
let blob = base64ToBlob(content); //new Blob([content]);
let evt = document.createEvent("HTMLEvents");
evt.initEvent("click", true, true); //initEvent 不加后两个参数在FF下会报错 事件类型,是否冒泡,是否阻止浏览器的默认行为
aLink.download = fileName;
aLink.href = URL.createObjectURL(blob);
aLink.click();
},
beforeHideModal: function() {
this.$store.commit("setocxstate", 1);
this.dialogVisible = false;
......
......@@ -805,7 +805,7 @@ button {
}
.modal-body {
height: 540px !important;
height: 555px !important;
padding-left: 3%;
}
.modal-editbox{
......
......@@ -371,7 +371,7 @@
}
.modal-body {
height: 540px!important;
height: 555px!important;
padding-left: 3%;
}
.modal-editbox{
......
......@@ -688,7 +688,7 @@ button {
}
.modal-body {
height: 540px !important;
height: 555px !important;
padding-left: 3%;
}
.modal-editbox{
......
......@@ -859,7 +859,7 @@
}
.modal-body {
height: 540px!important;
/* height: 540px!important; */
}
.modal-lt {
width: 100%;
......
......@@ -2392,7 +2392,7 @@ button {
}
.modal-body {
height: 540px !important;
height: 555px !important;
}
.modal-lt {
width: 100%;
......
......@@ -2328,7 +2328,7 @@ button {
}
.modal-body {
height: 540px !important;
/* height: 540px !important; */
}
.modal-lt {
width: 100%;
......
......@@ -71,6 +71,7 @@
</template>
<script>
import {config} from '../../../../public/js/config'
export default {
data() {
return {
......@@ -94,8 +95,8 @@ export default {
this.subtaskid = subid;
this.subtask_name = subdata.subtask_name;
this.dialogVisible = true;
this.uploadurl = `http://${location.host}/api/v1/devconf_fx/import/${this.subtaskid}`;
this.fileList = [];
this.uploadurl = `${config.https?'https':'http'}://${location.host}/api/v1/devconf_fx/import/${this.subtaskid}`;
this.fileList = [];
this.$store.commit("setocxstate", 0);
},
handlePreview(file, fileList) {
......
......@@ -151,7 +151,7 @@ export default {
let vrefid = this.vchan.refid || this.vchan.vchan_refid;
document
.getElementById("VionVideo")
.VionPTZControl(String(vrefid), Number(nType), 1);
.VionPTZControl(String(vrefid), Number(nType), 200);
} catch (error) {
console.log(error);
}
......@@ -161,7 +161,7 @@ export default {
let vrefid = this.vchan.refid || this.vchan.vchan_refid;
document
.getElementById("VionVideo")
.VionPTZControl(String(vrefid), Number(nType), 1);
.VionPTZControl(String(vrefid), Number(nType), 200);
},
subset() {
let vrefid = this.vchan.refid || this.vchan.vchan_refid;
......
......@@ -110,6 +110,11 @@
</div>
</el-col>
<div style="">
<div class="desplay-icon">
<i class="el-icon-s-grid" @click="dataDisplay('list')"></i>
<i class="el-icon-tickets" @click="dataDisplay('table')"></i>
</div>
<div v-if="displaystatus == 'table'">
<el-table
:data="formatterData"
:height="tableHeight"
......@@ -205,6 +210,46 @@
</template>
</el-table-column>
</el-table>
</div>
<div v-if="displaystatus == 'list'">
<div class="listbox" :style="{'height':tableHeight}">
<div v-for="(item, index) in formatterData" :key="index" class="listboxitem" @click="detailFun(index,item)">
<div class="imgbox">
<img :src="item.pics[0].src_url" alt="">
</div>
<div class="displayinfo">
<el-form label-width="80px" inline>
<el-form-item label="事件类型:">
<span>{{ item.event_type }}</span>
</el-form-item>
<el-form-item label="经过日期:">
<span>{{
item.shoot_date ? item.shoot_date : ""
}} {{
item.shoot_time ? item.shoot_time : ""
}}</span>
</el-form-item>
</el-form>
</div>
<div class="displaybtn-box">
<span
:class="{
'iconfont icon-fanxing-qidong playIcon': true,
'no-btn':
item.video && item.video[0].src_url != ''
? false
: true
}"
@click.stop="playFun(index, item)"
></span>
<span
class="el-icon-delete delIcon"
@click.stop="delFun(index, item)"
></span>
</div>
</div>
</div>
</div>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
......@@ -309,6 +354,7 @@ export default {
formatterData: [],
total: 0,
page: 1,
displaystatus:'table',
pageSize: 30,
selectcheck: [],
currentIndex: 0,
......@@ -337,6 +383,9 @@ export default {
indexFormatter(row, column, cellValue, index) {
return index + (this.page - 1) * this.pageSize + 1;
},
dataDisplay(data){
this.displaystatus = data
},
cateFormatter(row, column, cellValue, index) {
let name = "";
this.cateList.forEach(item => {
......
......@@ -150,6 +150,11 @@
</div>
</el-col>
<div style="">
<div class="desplay-icon">
<i class="el-icon-s-grid" @click="dataDisplay('list')"></i>
<i class="el-icon-tickets" @click="dataDisplay('table')"></i>
</div>
<div v-if="displaystatus == 'table'">
<el-table
:data="formatterData"
:height="tableHeight"
......@@ -253,6 +258,71 @@
</template>
</el-table-column>
</el-table>
</div>
<div v-if="displaystatus == 'list'">
<div class="listbox" :style="{'height':tableHeight}">
<div v-for="(item, index) in formatterData" :key="index" class="listboxitem" @click="detailFun(index,item)">
<div class="imgbox">
<img :src="item.pics[0].src_url" alt="">
</div>
<div class="displayinfo">
<el-form label-width="80px" inline>
<el-form-item label="车牌号码:">
<span>{{ item.vehicle_plate_text }}</span>
</el-form-item>
<el-form-item label="车辆类型:">
<span>{{ item.vehicle_body_type_text }}</span>
</el-form-item>
<el-form-item label="车辆品牌:">
<span>{{ item.vehicle_body_logo_text }}</span>
</el-form-item>
<el-form-item label="车身颜色:">
<span>{{ item.vehicle_body_color_text }}</span>
</el-form-item>
<el-form-item label="车牌颜色:">
<span>{{ item.plate_color_text }}</span>
</el-form-item>
<el-form-item label="违法日期:">
<span>{{
item.shoot_date ? item.shoot_date : ""
}}{{
item.shoot_time ? item.shoot_time : ""
}}</span>
</el-form-item>
<el-form-item label="违法类型:">
<span>{{ item.illegalType }}</span>
</el-form-item>
<el-form-item label="违法日期:">
<span>{{
item.shoot_date ? item.shoot_date : ""
}}{{
item.shoot_time ? item.shoot_time : ""
}}</span>
</el-form-item>
<el-form-item label="经过地点:">
<span>{{ item.location_name }}</span>
</el-form-item>
</el-form>
</div>
<div class="displaybtn-box">
<span
:class="{
'iconfont icon-fanxing-qidong playIcon': true,
'no-btn':
item.video && item.video[0].src_url != ''
? false
: true
}"
@click.stop="playFun(index, item)"
></span>
<span
class="el-icon-delete delIcon"
@click.stop="delFun(index, item)"
></span>
</div>
</div>
</div>
</div>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
......@@ -397,6 +467,7 @@ export default {
selectcheck: [],
currentIndex: 0,
taskList: [],
displaystatus:'table',
subTaskList: [],
tableHeight: window.twoSearchTableHeight
};
......@@ -416,6 +487,9 @@ export default {
indexFormatter(row, column, cellValue, index) {
return index + (this.page - 1) * this.pageSize + 1;
},
dataDisplay(data){
this.displaystatus = data
},
getTaskList() {
this.$api.task
.getTask({
......
......@@ -177,6 +177,11 @@
</div>
</el-col>
<div style="">
<div class="desplay-icon">
<i class="el-icon-s-grid" @click="dataDisplay('list')"></i>
<i class="el-icon-tickets" @click="dataDisplay('table')"></i>
</div>
<div v-if="displaystatus == 'table'">
<el-table
:data="formatterData"
:height="tableHeight"
......@@ -266,6 +271,43 @@
</template>
</el-table-column>
</el-table>
</div>
<div v-if="displaystatus == 'list'">
<div class="listbox" :style="{'height':tableHeight}">
<div v-for="(item, index) in formatterData" :key="index" class="listboxitem" @click="detailFun(index,item)">
<div class="imgbox">
<img :src="item.pics[0].src_url" alt="">
</div>
<div class="displayinfo">
<el-form>
<el-form-item label="车牌号码:">
<span>{{ item.vehicle_plate_text }}</span>
</el-form-item>
<el-form-item label="车牌颜色:">
<span>{{ item.plate_color_text }}</span>
</el-form-item>
<el-form-item label="车辆类型:">
<span>{{ item.vehicle_body_type_text }}</span>
</el-form-item>
<el-form-item label="车辆颜色:">
<span>{{ item.vehicle_body_color_text }}</span>
</el-form-item>
<el-form-item label="特殊车辆:">
<span>{{ item.special_text }}</span>
</el-form-item>
<el-form-item label="抓拍时间:">
<span>{{
item.shoot_date ? item.shoot_date : ""
}} {{
item.shoot_time ? item.shoot_time : ""
}}</span>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
......@@ -401,6 +443,7 @@ export default {
currentIndex: 0,
taskList: [],
subTaskList: [],
displaystatus:"table",
tableHeight: window.twoSearchTableHeight
};
},
......@@ -419,6 +462,9 @@ export default {
indexFormatter(row, column, cellValue, index) {
return index + (this.page - 1) * this.pageSize + 1;
},
dataDisplay(data){
this.displaystatus = data
},
getTaskList() {
this.$api.task
.getTask({
......@@ -671,4 +717,6 @@ export default {
}
};
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
</style>
......@@ -253,6 +253,11 @@
</div>
</el-col>
<div style="">
<div class="desplay-icon">
<i class="el-icon-s-grid" @click="dataDisplay('list')"></i>
<i class="el-icon-tickets" @click="dataDisplay('table')"></i>
</div>
<div v-if="displaystatus == 'table'">
<el-table
:data="formatterData"
v-loading="loading"
......@@ -356,6 +361,45 @@
</template>
</el-table-column>
</el-table>
</div>
<div v-if="displaystatus == 'list'">
<div class="listbox" :style="{'height':tableHeight}">
<div v-for="(item, index) in formatterData" :key="index" class="listboxitem" @click="detailFun(index,item)">
<div class="imgbox">
<img :src="item.pics[0].src_url" alt="">
</div>
<div class="displayinfo">
<el-form>
<el-form-item label="检测类型:">
<span>{{ item.xcycle_type_text }}</span>
</el-form-item>
<el-form-item label="性别:">
<span>{{ item.driver_face_sex }}</span>
</el-form-item>
<el-form-item label="是否带头盔:" v-if="item.event_type == 'xcycle'">
<span>{{ item.driver_face_with_hats }}</span>
</el-form-item>
<el-form-item label="是否带头盔:" v-if="item.event_type == 'pedestrian'">
<span>{{ item.driver_face_with_hats }}</span>
</el-form-item>
<el-form-item label="运营公司:">
<span>{{ item.company }}</span>
</el-form-item>
<el-form-item label="经过日期:">
<span>{{
item.shoot_date ? item.shoot_date : ""
}} {{
item.shoot_time ? item.shoot_time : ""
}}</span>
</el-form-item>
<el-form-item label="经过地点:">
<span>{{ item.location_name }}</span>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<div style="margin-top: 28px;">
<el-pagination
style="float: right;"
......@@ -487,6 +531,7 @@ export default {
selectcheck: [],
currentIndex: 0,
taskList: [],
displaystatus:'table',
subTaskList: [],
tableHeight: window.twoSearchTableHeight
};
......@@ -506,6 +551,9 @@ export default {
indexFormatter(row, column, cellValue, index) {
return index + (this.page - 1) * this.pageSize + 1;
},
dataDisplay(data){
this.displaystatus = data
},
getTaskList() {
this.$api.task
.getTask({
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!