Compare commits
20 Commits
| Author | SHA1 | Date |
|---|---|---|
 徐景良
|
df8c499b17 | |
|
徐景良
|
069d377b8e | |
 zhufu
|
d2dc76996b | |
 石超
|
681e5e9b9e | |
|
石超
|
85933b5dee | |
|
石超
|
e272b02cfa | |
|
徐景良
|
fd381b338b | |
|
徐景良
|
0df1c6f9c2 | |
|
石超
|
efc5df9849 | |
|
徐景良
|
d5a1a15b2f | |
|
徐景良
|
01d9ad497f | |
 刘妍
|
c088f51f72 | |
|
刘妍
|
2353ba9af7 | |
|
刘妍
|
64bc78eba2 | |
|
刘妍
|
b5650409f9 | |
|
石超
|
a83044788c | |
|
石超
|
b432aff69e | |
|
刘妍
|
b74de6b0d7 | |
|
刘妍
|
329ca651c6 | |
|
刘妍
|
4655a8c179 |
|
|
@ -1,7 +1,7 @@
|
|||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
.history/
|
||||
.svn
|
||||
# local env files
|
||||
.env.local
|
||||
|
|
|
|||
|
|
@ -3320,80 +3320,6 @@
|
|||
"webpack-chain": "^6.4.0",
|
||||
"webpack-dev-server": "^3.11.0",
|
||||
"webpack-merge": "^4.2.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-convert": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
|
||||
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^4.1.0",
|
||||
"supports-color": "^7.1.0"
|
||||
}
|
||||
},
|
||||
"color-convert": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
|
||||
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-name": "~1.1.4"
|
||||
}
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"loader-utils": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.4.tgz",
|
||||
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"big.js": "^5.2.2",
|
||||
"emojis-list": "^3.0.0",
|
||||
"json5": "^2.1.2"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
|
||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"vue-loader-v16": {
|
||||
"version": "npm:vue-loader@16.8.3",
|
||||
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
|
||||
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"chalk": "^4.1.0",
|
||||
"hash-sum": "^2.0.0",
|
||||
"loader-utils": "^2.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"@vue/cli-shared-utils": {
|
||||
|
|
@ -9075,6 +9001,11 @@
|
|||
"resolved": "https://registry.npmjs.org/js-calendar/-/js-calendar-1.2.3.tgz",
|
||||
"integrity": "sha512-dAA1/Zbp4+c5E+ARCVTIuKepXsNLzSYfzvOimiYD4S5eeP9QuplSHLcdhfqFSwyM1o1u6ku6RRRCyaZ0YAjiBw=="
|
||||
},
|
||||
"js-md5": {
|
||||
"version": "0.8.3",
|
||||
"resolved": "https://registry.npmjs.org/js-md5/-/js-md5-0.8.3.tgz",
|
||||
"integrity": "sha512-qR0HB5uP6wCuRMrWPTrkMaev7MJZwJuuw4fnwAzRgP4J4/F8RwtodOKpGp4XpqsLBFzzgqIO42efFAyz2Et6KQ=="
|
||||
},
|
||||
"js-message": {
|
||||
"version": "1.0.7",
|
||||
"resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
|
||||
|
|
@ -9642,6 +9573,14 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"mapbox-gl-draw-snap-mode": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/mapbox-gl-draw-snap-mode/-/mapbox-gl-draw-snap-mode-0.2.0.tgz",
|
||||
"integrity": "sha512-c6u8wL1cHgzFAAi6wtuoJVBKAF4qzGorpCn4IeninkzkUaYGVrNtUNPky3ECx9C3P9QbNOwD60j8bYj5wQI8hA==",
|
||||
"requires": {
|
||||
"@turf/turf": "^6.5.0"
|
||||
}
|
||||
},
|
||||
"mapbox-gl-utils": {
|
||||
"version": "0.39.0",
|
||||
"resolved": "https://registry.npmmirror.com/mapbox-gl-utils/-/mapbox-gl-utils-0.39.0.tgz",
|
||||
|
|
@ -14041,6 +13980,80 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"vue-loader-v16": {
|
||||
"version": "npm:vue-loader@16.8.3",
|
||||
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz",
|
||||
"integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"chalk": "^4.1.0",
|
||||
"hash-sum": "^2.0.0",
|
||||
"loader-utils": "^2.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-convert": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
|
||||
"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^4.1.0",
|
||||
"supports-color": "^7.1.0"
|
||||
}
|
||||
},
|
||||
"color-convert": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
|
||||
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"color-name": "~1.1.4"
|
||||
}
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"loader-utils": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
|
||||
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"big.js": "^5.2.2",
|
||||
"emojis-list": "^3.0.0",
|
||||
"json5": "^2.1.2"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
|
||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"vue-router": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
|
||||
|
|
|
|||
|
|
@ -18,8 +18,10 @@
|
|||
"core-js": "^3.6.5",
|
||||
"element-ui": "^2.15.8",
|
||||
"jquery": "^3.6.4",
|
||||
"js-md5": "^0.8.3",
|
||||
"less-loader": "^6.0.0",
|
||||
"mapbox-gl": "^2.13.0",
|
||||
"mapbox-gl": "^2.0.0",
|
||||
"mapbox-gl-draw-snap-mode": "^0.2.0",
|
||||
"mapbox-gl-utils": "^0.39.0",
|
||||
"qs": "^6.11.1",
|
||||
"terraformer-wkt-parser": "^1.2.1",
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 9.4 KiB After Width: | Height: | Size: 843 B |
|
|
@ -0,0 +1,145 @@
|
|||
.flex{
|
||||
display: flex;
|
||||
}
|
||||
.flex-1{
|
||||
flex: 1;
|
||||
}
|
||||
.wrap{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.nowrap{
|
||||
flex-wrap: nowrap;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.row{
|
||||
flex-direction: row;
|
||||
}
|
||||
.column{
|
||||
flex-direction: column;
|
||||
}
|
||||
.hidden{
|
||||
overflow: hidden;
|
||||
}
|
||||
.auto{
|
||||
overflow: auto;
|
||||
}
|
||||
.ai-c{
|
||||
align-items: center;
|
||||
}
|
||||
.ai-e{
|
||||
align-items: end;
|
||||
}
|
||||
.jc-se{
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
.jc-sa{
|
||||
justify-content: space-around;
|
||||
}
|
||||
.jc-sb{
|
||||
justify-content: space-between;
|
||||
}
|
||||
.jc-c{
|
||||
justify-content: center;
|
||||
}
|
||||
.jc-e{
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.mt-1{
|
||||
margin-top: 10px;
|
||||
}
|
||||
.mt-2{
|
||||
margin-top: 20px;
|
||||
}
|
||||
.mt-3{
|
||||
margin-top: 30px;
|
||||
}
|
||||
.ml-1{
|
||||
margin-left: 10px;
|
||||
}
|
||||
.ml-2{
|
||||
margin-left: 20px;
|
||||
}
|
||||
.ml-3{
|
||||
margin-left: 30px;
|
||||
}
|
||||
.mb-1{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.mb-2{
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.mb-3{
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.mr-1{
|
||||
margin-right: 10px;
|
||||
}
|
||||
.mr-2{
|
||||
margin-right: 20px;
|
||||
}
|
||||
.mr-3{
|
||||
margin-right: 30px;
|
||||
}
|
||||
.ta-c{
|
||||
text-align: center;
|
||||
}
|
||||
.ta-l{
|
||||
text-align: left;
|
||||
}
|
||||
.cursor{
|
||||
cursor: pointer;
|
||||
}
|
||||
.pos-r{
|
||||
position: relative;
|
||||
}
|
||||
.pos-a{
|
||||
position: absolute;
|
||||
}
|
||||
.pos-f{
|
||||
position: fixed;
|
||||
}
|
||||
.max-w{
|
||||
width: 100%;
|
||||
}
|
||||
.max-h{
|
||||
height: 100%;
|
||||
}
|
||||
.fz-12{
|
||||
font-size: 12px;
|
||||
}
|
||||
.fz-14{
|
||||
font-size: 14px;
|
||||
}
|
||||
.fz-16{
|
||||
font-size: 16px;
|
||||
}
|
||||
.fz-18{
|
||||
font-size: 18px;
|
||||
}
|
||||
.fz-20{
|
||||
font-size: 20px;
|
||||
}
|
||||
.fz-22{
|
||||
font-size: 22px;
|
||||
}
|
||||
.fz-24{
|
||||
font-size: 24px;
|
||||
}
|
||||
.fz-26{
|
||||
font-size: 26px;
|
||||
}
|
||||
.fz-28{
|
||||
font-size: 28px;
|
||||
}
|
||||
.fc-w{
|
||||
color: white;
|
||||
}
|
||||
.fc-b{
|
||||
color: black;
|
||||
}
|
||||
.fc-r{
|
||||
color: red;
|
||||
}
|
||||
.fw-b{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
@ -0,0 +1,365 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>preview_demo</title>
|
||||
<link href="./common.css" rel="stylesheet">
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.camera-dia{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,0);
|
||||
position:relative;
|
||||
}
|
||||
.camera-box{
|
||||
width: 720px;
|
||||
height: 360px;
|
||||
border-radius: 5px;
|
||||
position: fixed;
|
||||
left:100%;
|
||||
top:100%;
|
||||
transform:translate(-50%,-50%);
|
||||
z-index: 9999;
|
||||
}
|
||||
.camera-header{
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
}
|
||||
.camera-header img{
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
.camera-body{
|
||||
|
||||
width: 90%;
|
||||
height: 230px;
|
||||
/* border: 1px solid #fff; */
|
||||
margin-left: 5%;
|
||||
}
|
||||
.camera-footer{
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
color: #4371ec;
|
||||
text-align: left;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.camera-footer span{
|
||||
margin-left: 5px;
|
||||
}
|
||||
.playWnd {
|
||||
width: 360px; /*播放容器的宽和高设定*/
|
||||
height: 230px;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="camera-dia">
|
||||
<div class="camera-box">
|
||||
<div class="camera-header ">
|
||||
<span class="fz-16" id="carmerName"></span>
|
||||
<img src="../img/close.png" class="cursor" id="closeBtn" />
|
||||
</div>
|
||||
<div class="camera-body">
|
||||
<!--视频窗口展示-->
|
||||
<div id="playWnd" class="playWnd"></div>
|
||||
</div>
|
||||
<div class="camera-footer mt-1" style="display: none;">
|
||||
设备编号：<span id="carmerCard"></span>
|
||||
</div>
|
||||
<div style="display: none;" id="carmerAppKey"></div>
|
||||
<div style="display: none;" id="carmerIp"></div>
|
||||
<div style="display: none;" id="carmerPort"></div>
|
||||
<div style="display: none;" id="appSecret"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
<!--三个必要的js文件引入-->
|
||||
<script src="jquery-1.12.4.min.js"></script>
|
||||
<script src="jsencrypt.min.js"></script> <!-- 用于RSA加密 -->
|
||||
<script src="jsWebControl-1.0.0.min.js"></script> <!-- 用于前端与插件交互 -->
|
||||
|
||||
<script type="text/javascript">
|
||||
window.onload = () => {
|
||||
// 子页面接收消息
|
||||
window.addEventListener('message', function (e) {
|
||||
if (e.data) {
|
||||
console.log("play-data",e.data);
|
||||
$("#carmerName").text(e.data[0])
|
||||
$("#carmerCard").text(e.data[1])
|
||||
$("#carmerAppKey").text(e.data[2])
|
||||
$("#carmerIp").text(e.data[3])
|
||||
$("#carmerPort").text(e.data[4])
|
||||
$("#appSecret").text(e.data[5])
|
||||
}
|
||||
}, false)
|
||||
|
||||
initPlugin();
|
||||
}
|
||||
$("#closeBtn").click(function(){
|
||||
window.parent.postMessage(
|
||||
{
|
||||
cmd: 'close'
|
||||
}
|
||||
)
|
||||
})
|
||||
//页面加载时创建播放实例初始化
|
||||
$(window).load(function () {
|
||||
// initPlugin();
|
||||
});
|
||||
|
||||
//声明公用变量
|
||||
var initCount = 0;
|
||||
var pubKey = '';
|
||||
|
||||
// 创建播放实例
|
||||
function initPlugin () {
|
||||
oWebControl = new WebControl({
|
||||
szPluginContainer: "playWnd", // 指定容器id
|
||||
iServicePortStart: 15900, // 指定起止端口号，建议使用该值
|
||||
iServicePortEnd: 15909,
|
||||
szClassId:"23BF3B0A-2C56-4D97-9C03-0CB103AA8F11", // 用于IE10使用ActiveX的clsid
|
||||
cbConnectSuccess: function () { // 创建WebControl实例成功
|
||||
oWebControl.JS_StartService("window", { // WebControl实例创建成功后需要启动服务
|
||||
dllPath: "./VideoPluginConnect.dll" // 值"./VideoPluginConnect.dll"写死
|
||||
}).then(function () { // 启动插件服务成功
|
||||
oWebControl.JS_SetWindowControlCallback({ // 设置消息回调
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
|
||||
oWebControl.JS_CreateWnd("playWnd", 400, 265).then(function () { //JS_CreateWnd创建视频播放窗口，宽高可设定
|
||||
init(); // 创建播放实例成功后初始化
|
||||
});
|
||||
}, function () { // 启动插件服务失败
|
||||
});
|
||||
},
|
||||
cbConnectError: function () { // 创建WebControl实例失败
|
||||
oWebControl = null;
|
||||
$("#playWnd").html("插件未启动，正在尝试启动，请稍候...");
|
||||
WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数，采用wakeup来启动程序
|
||||
initCount ++;
|
||||
if (initCount < 3) {
|
||||
setTimeout(function () {
|
||||
initPlugin();
|
||||
}, 3000)
|
||||
} else {
|
||||
window.parent.alertInstallVideoPlayer();
|
||||
$("#playWnd").html("插件启动失败，请检查插件是否安装！");
|
||||
}
|
||||
},
|
||||
cbConnectClose: function (bNormalClose) {
|
||||
// 异常断开：bNormalClose = false
|
||||
// JS_Disconnect正常断开：bNormalClose = true
|
||||
oWebControl = null;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 设置窗口控制回调
|
||||
function setCallbacks() {
|
||||
oWebControl.JS_SetWindowControlCallback({
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
}
|
||||
|
||||
// 推送消息
|
||||
function cbIntegrationCallBack(oData) {
|
||||
// showCBInfo(JSON.stringify(oData.responseMsg));
|
||||
}
|
||||
|
||||
//初始化
|
||||
function init()
|
||||
{
|
||||
getPubKey(function () {
|
||||
|
||||
////////////////////////////////// 请自行修改以下变量值 ////////////////////////////////////
|
||||
// var appkey = "21274765"; //综合安防管理平台提供的appkey，必填
|
||||
// var ip = "223.99.16.253"; //综合安防管理平台IP地址，必填
|
||||
// var port = 1443; //综合安防管理平台端口，若启用HTTPS协议，默认443
|
||||
|
||||
var appkey = $("#carmerAppKey").text(); //综合安防管理平台提供的appkey，必填
|
||||
var ip = $("#carmerIp").text(); //综合安防管理平台IP地址，必填
|
||||
var port = Number($("#carmerPort").text());
|
||||
var appSecret = $("#appSecret").text();
|
||||
console.log(appkey,ip,port,appSecret)
|
||||
// var secret = setEncrypt("tGJdjmKxKxVWtzp1M6px"); //综合安防管理平台提供的secret，必填
|
||||
var secret = setEncrypt(appSecret); //综合安防管理平台提供的secret，必填
|
||||
|
||||
var playMode = 0; //初始播放模式：0-预览，1-回放
|
||||
var snapDir = "D:\\SnapDir"; //抓图存储路径
|
||||
var videoDir = "D:\\VideoDir"; //紧急录像或录像剪辑存储路径
|
||||
var layout = "1x1"; //playMode指定模式的布局
|
||||
var enableHTTPS = 1; //是否启用HTTPS协议与综合安防管理平台交互，这里总是填1
|
||||
var encryptedFields = 'secret'; //加密字段，默认加密领域为secret
|
||||
var showToolbar = 0; //是否显示工具栏，0-不显示，非0-显示
|
||||
var showSmart = 1; //是否显示智能信息（如配置移动侦测后画面上的线框），0-不显示，非0-显示
|
||||
var buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769"; //自定义工具条按钮
|
||||
////////////////////////////////// 请自行修改以上变量值 ////////////////////////////////////
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "init",
|
||||
argument: JSON.stringify({
|
||||
appkey: appkey, //API网关提供的appkey
|
||||
secret: secret, //API网关提供的secret
|
||||
ip: ip, //API网关IP地址
|
||||
playMode: playMode, //播放模式（决定显示预览还是回放界面）
|
||||
port: port, //端口
|
||||
snapDir: snapDir, //抓图存储路径
|
||||
videoDir: videoDir, //紧急录像或录像剪辑存储路径
|
||||
layout: layout, //布局
|
||||
enableHTTPS: enableHTTPS, //是否启用HTTPS协议
|
||||
encryptedFields: encryptedFields, //加密字段
|
||||
showToolbar: showToolbar, //是否显示工具栏
|
||||
showSmart: showSmart, //是否显示智能信息
|
||||
buttonIDs: buttonIDs //自定义工具条按钮
|
||||
})
|
||||
}).then(function (oData) {
|
||||
oWebControl.JS_Resize(400, 265); // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
|
||||
setWndCover();
|
||||
});
|
||||
// var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值，必填
|
||||
var cameraIndexCode = $("#carmerCard").text()
|
||||
var streamMode = 0; //主子码流标识：0-主码流，1-子码流
|
||||
var transMode = 1; //传输协议：0-UDP，1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
|
||||
var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
//获取公钥
|
||||
function getPubKey (callback) {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "getRSAPubKey",
|
||||
argument: JSON.stringify({
|
||||
keyLength: 1024
|
||||
})
|
||||
}).then(function (oData) {
|
||||
if (oData.responseMsg.data) {
|
||||
pubKey = oData.responseMsg.data;
|
||||
callback()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//RSA加密
|
||||
function setEncrypt (value) {
|
||||
var encrypt = new JSEncrypt();
|
||||
encrypt.setPublicKey(pubKey);
|
||||
return encrypt.encrypt(value);
|
||||
}
|
||||
|
||||
// 监听resize事件，使插件窗口尺寸跟随DIV窗口变化
|
||||
$(window).resize(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(400, 265);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
// 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动
|
||||
$(window).scroll(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(400, 265);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
|
||||
function setWndCover() {
|
||||
var iWidth = $(window).width();
|
||||
var iHeight = $(window).height();
|
||||
var oDivRect = $("#playWnd").get(0).getBoundingClientRect();
|
||||
|
||||
var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left): 0;
|
||||
var iCoverTop = (oDivRect.top < 0) ? Math.abs(oDivRect.top): 0;
|
||||
var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0;
|
||||
var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0;
|
||||
|
||||
iCoverLeft = (iCoverLeft > 360) ? 360 : iCoverLeft;
|
||||
iCoverTop = (iCoverTop > 230) ? 230 : iCoverTop;
|
||||
iCoverRight = (iCoverRight > 360) ? 360 : iCoverRight;
|
||||
iCoverBottom = (iCoverBottom > 230) ? 230 : iCoverBottom;
|
||||
|
||||
oWebControl.JS_RepairPartWindow(0, 0, 1001, 230); // 多1个像素点防止还原后边界缺失一个像素条
|
||||
if (iCoverLeft != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 230);
|
||||
}
|
||||
if (iCoverTop != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop); // 多剪掉一个像素条，防止出现剪掉一部分窗口后出现一个像素条
|
||||
}
|
||||
if (iCoverRight != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(360 - iCoverRight, 0, iCoverRight, 230);
|
||||
}
|
||||
if (iCoverBottom != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 230 - iCoverBottom, 360, iCoverBottom);
|
||||
}
|
||||
}
|
||||
|
||||
//视频预览功能
|
||||
$("#startPreview").click(function () {
|
||||
var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值，必填
|
||||
var streamMode = 0; //主子码流标识：0-主码流，1-子码流
|
||||
var transMode = 1; //传输协议：0-UDP，1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
|
||||
var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
|
||||
//停止全部预览
|
||||
$("#stopAllPreview").click(function () {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "stopAllPreview"
|
||||
});
|
||||
});
|
||||
|
||||
// 标签关闭
|
||||
$(window).unload(function () {
|
||||
if (oWebControl != null){
|
||||
oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
|
||||
oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
|
||||
},
|
||||
function() { // 断开与插件服务连接失败
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,318 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>preview_demo</title>
|
||||
<link href="../../common.css" rel="stylesheet">
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.camera-dia{
|
||||
/* width: 100vw;
|
||||
height: 100vh; */
|
||||
}
|
||||
.camera-box{
|
||||
width: 180px;
|
||||
height: 115px;
|
||||
background: rgba(19,21,35,.9);
|
||||
box-shadow: 0 0 0.0625rem 0.3125rem hsl(0deg 0% 100% / 10%);
|
||||
border: 1px solid #386df5;
|
||||
border-radius: 5px;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
bottom: 130px;
|
||||
z-index: 999;
|
||||
padding: 10px;
|
||||
}
|
||||
.camera-body{
|
||||
width: 100%;
|
||||
height: 115px;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.playWnd {
|
||||
width: 180px; /*播放容器的宽和高设定*/
|
||||
height: 115px;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="camera-dia">
|
||||
<div class="camera-box fc-w fz-14">
|
||||
<div class="camera-body pos-r">
|
||||
<!--视频窗口展示-->
|
||||
<div id="playWnd" class="playWnd"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="carmerCard" style="display: none;"></div>
|
||||
</body>
|
||||
|
||||
<!--三个必要的js文件引入-->
|
||||
<script src="jquery-1.12.4.min.js"></script>
|
||||
<script src="jsencrypt.min.js"></script> <!-- 用于RSA加密 -->
|
||||
<script src="jsWebControl-1.0.0.min.js"></script> <!-- 用于前端与插件交互 -->
|
||||
|
||||
<script type="text/javascript">
|
||||
window.onload = () => {
|
||||
// 子页面接收消息
|
||||
window.addEventListener('message', function (e) {
|
||||
if (e.data) {
|
||||
$("#carmerCard").text(e.data[0])
|
||||
}
|
||||
}, false)
|
||||
}
|
||||
$("#closeBtn").click(function(){
|
||||
window.parent.postMessage(
|
||||
{
|
||||
cmd: 'close'
|
||||
}
|
||||
)
|
||||
})
|
||||
//页面加载时创建播放实例初始化
|
||||
$(window).load(function () {
|
||||
initPlugin();
|
||||
});
|
||||
|
||||
//声明公用变量
|
||||
var initCount = 0;
|
||||
var pubKey = '';
|
||||
|
||||
// 创建播放实例
|
||||
function initPlugin () {
|
||||
oWebControl = new WebControl({
|
||||
szPluginContainer: "playWnd", // 指定容器id
|
||||
iServicePortStart: 15900, // 指定起止端口号，建议使用该值
|
||||
iServicePortEnd: 15909,
|
||||
szClassId:"23BF3B0A-2C56-4D97-9C03-0CB103AA8F11", // 用于IE10使用ActiveX的clsid
|
||||
cbConnectSuccess: function () { // 创建WebControl实例成功
|
||||
oWebControl.JS_StartService("window", { // WebControl实例创建成功后需要启动服务
|
||||
dllPath: "./VideoPluginConnect.dll" // 值"./VideoPluginConnect.dll"写死
|
||||
}).then(function () { // 启动插件服务成功
|
||||
oWebControl.JS_SetWindowControlCallback({ // 设置消息回调
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
|
||||
oWebControl.JS_CreateWnd("playWnd", 180, 115).then(function () { //JS_CreateWnd创建视频播放窗口，宽高可设定
|
||||
init(); // 创建播放实例成功后初始化
|
||||
});
|
||||
}, function () { // 启动插件服务失败
|
||||
});
|
||||
},
|
||||
cbConnectError: function () { // 创建WebControl实例失败
|
||||
oWebControl = null;
|
||||
$("#playWnd").html("插件未启动，正在尝试启动，请稍候...");
|
||||
WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数，采用wakeup来启动程序
|
||||
initCount ++;
|
||||
if (initCount < 3) {
|
||||
setTimeout(function () {
|
||||
initPlugin();
|
||||
}, 3000)
|
||||
} else {
|
||||
$("#playWnd").html("插件启动失败，请检查插件是否安装！");
|
||||
}
|
||||
},
|
||||
cbConnectClose: function (bNormalClose) {
|
||||
// 异常断开：bNormalClose = false
|
||||
// JS_Disconnect正常断开：bNormalClose = true
|
||||
oWebControl = null;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 设置窗口控制回调
|
||||
function setCallbacks() {
|
||||
oWebControl.JS_SetWindowControlCallback({
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
}
|
||||
|
||||
// 推送消息
|
||||
function cbIntegrationCallBack(oData) {
|
||||
// showCBInfo(JSON.stringify(oData.responseMsg));
|
||||
}
|
||||
|
||||
//初始化
|
||||
function init()
|
||||
{
|
||||
getPubKey(function () {
|
||||
|
||||
////////////////////////////////// 请自行修改以下变量值 ////////////////////////////////////
|
||||
var appkey = "21274765"; //综合安防管理平台提供的appkey，必填
|
||||
var secret = setEncrypt("CraRtGvpNB2xOcYSFTov"); //综合安防管理平台提供的secret，必填
|
||||
var ip = "223.99.16.253"; //综合安防管理平台IP地址，必填
|
||||
var playMode = 0; //初始播放模式：0-预览，1-回放
|
||||
var port = 1443; //综合安防管理平台端口，若启用HTTPS协议，默认443
|
||||
var snapDir = "D:\\SnapDir"; //抓图存储路径
|
||||
var videoDir = "D:\\VideoDir"; //紧急录像或录像剪辑存储路径
|
||||
var layout = "1x1"; //playMode指定模式的布局
|
||||
var enableHTTPS = 1; //是否启用HTTPS协议与综合安防管理平台交互，这里总是填1
|
||||
var encryptedFields = 'secret'; //加密字段，默认加密领域为secret
|
||||
var showToolbar = 1; //是否显示工具栏，0-不显示，非0-显示
|
||||
var showSmart = 1; //是否显示智能信息（如配置移动侦测后画面上的线框），0-不显示，非0-显示
|
||||
var buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769"; //自定义工具条按钮
|
||||
////////////////////////////////// 请自行修改以上变量值 ////////////////////////////////////
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "init",
|
||||
argument: JSON.stringify({
|
||||
appkey: appkey, //API网关提供的appkey
|
||||
secret: secret, //API网关提供的secret
|
||||
ip: ip, //API网关IP地址
|
||||
playMode: playMode, //播放模式（决定显示预览还是回放界面）
|
||||
port: port, //端口
|
||||
snapDir: snapDir, //抓图存储路径
|
||||
videoDir: videoDir, //紧急录像或录像剪辑存储路径
|
||||
layout: layout, //布局
|
||||
enableHTTPS: enableHTTPS, //是否启用HTTPS协议
|
||||
encryptedFields: encryptedFields, //加密字段
|
||||
showToolbar: showToolbar, //是否显示工具栏
|
||||
showSmart: showSmart, //是否显示智能信息
|
||||
buttonIDs: buttonIDs //自定义工具条按钮
|
||||
})
|
||||
}).then(function (oData) {
|
||||
oWebControl.JS_Resize(180, 115); // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
|
||||
setWndCover();
|
||||
});
|
||||
// var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值，必填
|
||||
var cameraIndexCode = $("#carmerCard").text()
|
||||
var streamMode = 0; //主子码流标识：0-主码流，1-子码流
|
||||
var transMode = 1; //传输协议：0-UDP，1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
|
||||
var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
//获取公钥
|
||||
function getPubKey (callback) {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "getRSAPubKey",
|
||||
argument: JSON.stringify({
|
||||
keyLength: 1024
|
||||
})
|
||||
}).then(function (oData) {
|
||||
if (oData.responseMsg.data) {
|
||||
pubKey = oData.responseMsg.data;
|
||||
callback()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//RSA加密
|
||||
function setEncrypt (value) {
|
||||
var encrypt = new JSEncrypt();
|
||||
encrypt.setPublicKey(pubKey);
|
||||
return encrypt.encrypt(value);
|
||||
}
|
||||
|
||||
// 监听resize事件，使插件窗口尺寸跟随DIV窗口变化
|
||||
$(window).resize(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
// 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动
|
||||
$(window).scroll(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
|
||||
function setWndCover() {
|
||||
var iWidth = $(window).width();
|
||||
var iHeight = $(window).height();
|
||||
var oDivRect = $("#playWnd").get(0).getBoundingClientRect();
|
||||
|
||||
var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left): 0;
|
||||
var iCoverTop = (oDivRect.top < 0) ? Math.abs(oDivRect.top): 0;
|
||||
var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0;
|
||||
var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0;
|
||||
|
||||
iCoverLeft = (iCoverLeft > 180) ? 180 : iCoverLeft;
|
||||
iCoverTop = (iCoverTop > 115) ? 115 : iCoverTop;
|
||||
iCoverRight = (iCoverRight > 180) ? 180 : iCoverRight;
|
||||
iCoverBottom = (iCoverBottom > 115) ? 115 : iCoverBottom;
|
||||
|
||||
oWebControl.JS_RepairPartWindow(0, 0, 1001, 115); // 多1个像素点防止还原后边界缺失一个像素条
|
||||
if (iCoverLeft != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 115);
|
||||
}
|
||||
if (iCoverTop != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop); // 多剪掉一个像素条，防止出现剪掉一部分窗口后出现一个像素条
|
||||
}
|
||||
if (iCoverRight != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(180 - iCoverRight, 0, iCoverRight, 115);
|
||||
}
|
||||
if (iCoverBottom != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 115 - iCoverBottom, 180, iCoverBottom);
|
||||
}
|
||||
}
|
||||
|
||||
//视频预览功能
|
||||
$("#startPreview").click(function () {
|
||||
var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值，必填
|
||||
var streamMode = 0; //主子码流标识：0-主码流，1-子码流
|
||||
var transMode = 1; //传输协议：0-UDP，1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
|
||||
var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
|
||||
//停止全部预览
|
||||
$("#stopAllPreview").click(function () {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "stopAllPreview"
|
||||
});
|
||||
});
|
||||
|
||||
// 标签关闭
|
||||
$(window).unload(function () {
|
||||
if (oWebControl != null){
|
||||
oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
|
||||
oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
|
||||
},
|
||||
function() { // 断开与插件服务连接失败
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,318 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>preview_demo</title>
|
||||
<link href="../../common.css" rel="stylesheet">
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.camera-dia{
|
||||
/* width: 100vw;
|
||||
height: 100vh; */
|
||||
}
|
||||
.camera-box{
|
||||
width: 180px;
|
||||
height: 115px;
|
||||
background: rgba(19,21,35,.9);
|
||||
box-shadow: 0 0 0.0625rem 0.3125rem hsl(0deg 0% 100% / 10%);
|
||||
border: 1px solid #386df5;
|
||||
border-radius: 5px;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
bottom: 10px;
|
||||
z-index: 999;
|
||||
padding: 10px;
|
||||
}
|
||||
.camera-body{
|
||||
width: 100%;
|
||||
height: 115px;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.playWnd {
|
||||
width: 180px; /*播放容器的宽和高设定*/
|
||||
height: 115px;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="camera-dia">
|
||||
<div class="camera-box fc-w fz-14">
|
||||
<div class="camera-body pos-r">
|
||||
<!--视频窗口展示-->
|
||||
<div id="playWnd" class="playWnd"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="carmerCard" style="display: none;"></div>
|
||||
</body>
|
||||
|
||||
<!--三个必要的js文件引入-->
|
||||
<script src="jquery-1.12.4.min.js"></script>
|
||||
<script src="jsencrypt.min.js"></script> <!-- 用于RSA加密 -->
|
||||
<script src="jsWebControl-1.0.0.min.js"></script> <!-- 用于前端与插件交互 -->
|
||||
|
||||
<script type="text/javascript">
|
||||
window.onload = () => {
|
||||
// 子页面接收消息
|
||||
window.addEventListener('message', function (e) {
|
||||
if (e.data) {
|
||||
$("#carmerCard").text(e.data[0])
|
||||
}
|
||||
}, false)
|
||||
}
|
||||
$("#closeBtn").click(function(){
|
||||
window.parent.postMessage(
|
||||
{
|
||||
cmd: 'close'
|
||||
}
|
||||
)
|
||||
})
|
||||
//页面加载时创建播放实例初始化
|
||||
$(window).load(function () {
|
||||
initPlugin();
|
||||
});
|
||||
|
||||
//声明公用变量
|
||||
var initCount = 0;
|
||||
var pubKey = '';
|
||||
|
||||
// 创建播放实例
|
||||
function initPlugin () {
|
||||
oWebControl = new WebControl({
|
||||
szPluginContainer: "playWnd", // 指定容器id
|
||||
iServicePortStart: 15900, // 指定起止端口号，建议使用该值
|
||||
iServicePortEnd: 15909,
|
||||
szClassId:"23BF3B0A-2C56-4D97-9C03-0CB103AA8F11", // 用于IE10使用ActiveX的clsid
|
||||
cbConnectSuccess: function () { // 创建WebControl实例成功
|
||||
oWebControl.JS_StartService("window", { // WebControl实例创建成功后需要启动服务
|
||||
dllPath: "./VideoPluginConnect.dll" // 值"./VideoPluginConnect.dll"写死
|
||||
}).then(function () { // 启动插件服务成功
|
||||
oWebControl.JS_SetWindowControlCallback({ // 设置消息回调
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
|
||||
oWebControl.JS_CreateWnd("playWnd", 180, 115).then(function () { //JS_CreateWnd创建视频播放窗口，宽高可设定
|
||||
init(); // 创建播放实例成功后初始化
|
||||
});
|
||||
}, function () { // 启动插件服务失败
|
||||
});
|
||||
},
|
||||
cbConnectError: function () { // 创建WebControl实例失败
|
||||
oWebControl = null;
|
||||
$("#playWnd").html("插件未启动，正在尝试启动，请稍候...");
|
||||
WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数，采用wakeup来启动程序
|
||||
initCount ++;
|
||||
if (initCount < 3) {
|
||||
setTimeout(function () {
|
||||
initPlugin();
|
||||
}, 3000)
|
||||
} else {
|
||||
$("#playWnd").html("插件启动失败，请检查插件是否安装！");
|
||||
}
|
||||
},
|
||||
cbConnectClose: function (bNormalClose) {
|
||||
// 异常断开：bNormalClose = false
|
||||
// JS_Disconnect正常断开：bNormalClose = true
|
||||
oWebControl = null;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 设置窗口控制回调
|
||||
function setCallbacks() {
|
||||
oWebControl.JS_SetWindowControlCallback({
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
}
|
||||
|
||||
// 推送消息
|
||||
function cbIntegrationCallBack(oData) {
|
||||
// showCBInfo(JSON.stringify(oData.responseMsg));
|
||||
}
|
||||
|
||||
//初始化
|
||||
function init()
|
||||
{
|
||||
getPubKey(function () {
|
||||
|
||||
////////////////////////////////// 请自行修改以下变量值 ////////////////////////////////////
|
||||
var appkey = "21274765"; //综合安防管理平台提供的appkey，必填
|
||||
var secret = setEncrypt("CraRtGvpNB2xOcYSFTov"); //综合安防管理平台提供的secret，必填
|
||||
var ip = "223.99.16.253"; //综合安防管理平台IP地址，必填
|
||||
var playMode = 0; //初始播放模式：0-预览，1-回放
|
||||
var port = 1443; //综合安防管理平台端口，若启用HTTPS协议，默认443
|
||||
var snapDir = "D:\\SnapDir"; //抓图存储路径
|
||||
var videoDir = "D:\\VideoDir"; //紧急录像或录像剪辑存储路径
|
||||
var layout = "1x1"; //playMode指定模式的布局
|
||||
var enableHTTPS = 1; //是否启用HTTPS协议与综合安防管理平台交互，这里总是填1
|
||||
var encryptedFields = 'secret'; //加密字段，默认加密领域为secret
|
||||
var showToolbar = 1; //是否显示工具栏，0-不显示，非0-显示
|
||||
var showSmart = 1; //是否显示智能信息（如配置移动侦测后画面上的线框），0-不显示，非0-显示
|
||||
var buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769"; //自定义工具条按钮
|
||||
////////////////////////////////// 请自行修改以上变量值 ////////////////////////////////////
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "init",
|
||||
argument: JSON.stringify({
|
||||
appkey: appkey, //API网关提供的appkey
|
||||
secret: secret, //API网关提供的secret
|
||||
ip: ip, //API网关IP地址
|
||||
playMode: playMode, //播放模式（决定显示预览还是回放界面）
|
||||
port: port, //端口
|
||||
snapDir: snapDir, //抓图存储路径
|
||||
videoDir: videoDir, //紧急录像或录像剪辑存储路径
|
||||
layout: layout, //布局
|
||||
enableHTTPS: enableHTTPS, //是否启用HTTPS协议
|
||||
encryptedFields: encryptedFields, //加密字段
|
||||
showToolbar: showToolbar, //是否显示工具栏
|
||||
showSmart: showSmart, //是否显示智能信息
|
||||
buttonIDs: buttonIDs //自定义工具条按钮
|
||||
})
|
||||
}).then(function (oData) {
|
||||
oWebControl.JS_Resize(180, 115); // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
|
||||
setWndCover();
|
||||
});
|
||||
// var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值，必填
|
||||
var cameraIndexCode = $("#carmerCard").text()
|
||||
var streamMode = 0; //主子码流标识：0-主码流，1-子码流
|
||||
var transMode = 1; //传输协议：0-UDP，1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
|
||||
var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
//获取公钥
|
||||
function getPubKey (callback) {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "getRSAPubKey",
|
||||
argument: JSON.stringify({
|
||||
keyLength: 1024
|
||||
})
|
||||
}).then(function (oData) {
|
||||
if (oData.responseMsg.data) {
|
||||
pubKey = oData.responseMsg.data;
|
||||
callback()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//RSA加密
|
||||
function setEncrypt (value) {
|
||||
var encrypt = new JSEncrypt();
|
||||
encrypt.setPublicKey(pubKey);
|
||||
return encrypt.encrypt(value);
|
||||
}
|
||||
|
||||
// 监听resize事件，使插件窗口尺寸跟随DIV窗口变化
|
||||
$(window).resize(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
// 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动
|
||||
$(window).scroll(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
|
||||
function setWndCover() {
|
||||
var iWidth = $(window).width();
|
||||
var iHeight = $(window).height();
|
||||
var oDivRect = $("#playWnd").get(0).getBoundingClientRect();
|
||||
|
||||
var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left): 0;
|
||||
var iCoverTop = (oDivRect.top < 0) ? Math.abs(oDivRect.top): 0;
|
||||
var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0;
|
||||
var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0;
|
||||
|
||||
iCoverLeft = (iCoverLeft > 180) ? 180 : iCoverLeft;
|
||||
iCoverTop = (iCoverTop > 115) ? 115 : iCoverTop;
|
||||
iCoverRight = (iCoverRight > 180) ? 180 : iCoverRight;
|
||||
iCoverBottom = (iCoverBottom > 115) ? 115 : iCoverBottom;
|
||||
|
||||
oWebControl.JS_RepairPartWindow(0, 0, 1001, 115); // 多1个像素点防止还原后边界缺失一个像素条
|
||||
if (iCoverLeft != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 115);
|
||||
}
|
||||
if (iCoverTop != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop); // 多剪掉一个像素条，防止出现剪掉一部分窗口后出现一个像素条
|
||||
}
|
||||
if (iCoverRight != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(180 - iCoverRight, 0, iCoverRight, 115);
|
||||
}
|
||||
if (iCoverBottom != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 115 - iCoverBottom, 180, iCoverBottom);
|
||||
}
|
||||
}
|
||||
|
||||
//视频预览功能
|
||||
$("#startPreview").click(function () {
|
||||
var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值，必填
|
||||
var streamMode = 0; //主子码流标识：0-主码流，1-子码流
|
||||
var transMode = 1; //传输协议：0-UDP，1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解，0-不启用，1-启用
|
||||
var wndId = -1; //播放窗口序号（在2x2以上布局下可指定播放窗口）
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
|
||||
//停止全部预览
|
||||
$("#stopAllPreview").click(function () {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "stopAllPreview"
|
||||
});
|
||||
});
|
||||
|
||||
// 标签关闭
|
||||
$(window).unload(function () {
|
||||
if (oWebControl != null){
|
||||
oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
|
||||
oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
|
||||
},
|
||||
function() { // 断开与插件服务连接失败
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -16,6 +16,8 @@
|
|||
<link rel="icon" href="./favicon.ico">
|
||||
<link rel='stylesheet' href='https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-draw/v1.0.9/mapbox-gl-draw.css'
|
||||
type='text/css' />
|
||||
<link href="/mapboxgl/mapbox-gl.css" rel="stylesheet">
|
||||
<script src="/mapboxgl/mapbox-gl.js"></script>
|
||||
<script type="text/javascript" src="./lib/Cesium/Cesium.js"></script>
|
||||
<script type="text/javascript" src="./lib/mars3d/mars3d.js"></script>
|
||||
<link rel='stylesheet' type='text/css' href="./lib/mars3d/mars3d.css" />
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,10 +1,10 @@
|
|||
const CONFIG = {
|
||||
// TITLE: (localStorage.getItem("areaCNName") || '费县') + "森林防灭火数据管理系统",
|
||||
// TITLE: (localStorage.getItem("areaCNName") || '平邑县') + "森林防灭火数据管理系统",
|
||||
TITLE:"费县森林防灭火数据管理系统",
|
||||
LOGO_URL: "/images/img25.png",
|
||||
BASE_API: "127.0.0.1",
|
||||
MAPBOX_OPTIONS: {
|
||||
ACCESS_TOKEN: "pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ",
|
||||
ACCESS_TOKEN: "pk.eyJ1IjoieHVqaW5nbGlhbmciLCJhIjoiY2w3bzFzZnZqMjdieTN1cG92N2I1d2huOSJ9.aQqMz4S-cTziUYizIH_gNg",
|
||||
CENTER: [118.11036, 35.17734]
|
||||
},
|
||||
TDT: {
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -37,3 +37,18 @@ export const getGeomData = (tableValue) => {
|
|||
method: 'get'
|
||||
})
|
||||
}
|
||||
export const addLayer = (data) => {
|
||||
return request({
|
||||
url: '/geoserver/createDataStore',
|
||||
method: 'post',
|
||||
data:data
|
||||
})
|
||||
}
|
||||
// 下载shp
|
||||
export const downLoadShpZip = (tableValue) => {
|
||||
return request({
|
||||
url: '/geoserver/downLoadShpZip/'+ tableValue,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@ export const getLayerStyle = () => {
|
|||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 样式编辑
|
||||
// 样式添加
|
||||
export const saveLayerStyle = (params) => {
|
||||
return request({
|
||||
url: '/geoserver/saveLayerStyle',
|
||||
|
|
@ -50,6 +50,36 @@ export const saveLayerStyle = (params) => {
|
|||
data: params
|
||||
})
|
||||
}
|
||||
// 样式编辑
|
||||
export const updateLayerStyle = (params) => {
|
||||
return request({
|
||||
url: '/geoserver/updateLayerStyle',
|
||||
method: 'post',
|
||||
data: params
|
||||
})
|
||||
}
|
||||
// 删除样式
|
||||
export const deleteLayerStyle = (tableName) => {
|
||||
return request({
|
||||
url: '/geoserver/deleteLayerStyle/' + tableName,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 发布样式
|
||||
export const publishLayerPost = (params) => {
|
||||
return request({
|
||||
url: '/geoserver/publishLayer',
|
||||
method: 'post',
|
||||
data: params
|
||||
})
|
||||
}
|
||||
// 获取样式列表
|
||||
export const getLayerStyleAndType = () => {
|
||||
return request({
|
||||
url: '/geoserver/getLayerStyleAndType',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 服务名校验
|
||||
export const checkServerName = (name) => {
|
||||
return request({
|
||||
|
|
@ -57,6 +87,13 @@ export const checkServerName = (name) => {
|
|||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 表名效验
|
||||
export const checkTableName = (name) => {
|
||||
return request({
|
||||
url: '/geoserver/checkTableName/' + name,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 文件上传
|
||||
export const uploadFile = (formData) => {
|
||||
return request({
|
||||
|
|
|
|||
|
|
@ -24,6 +24,14 @@ export const login = (username, password) => {
|
|||
}
|
||||
})
|
||||
}
|
||||
|
||||
export const checkAuth = () => {
|
||||
return request({
|
||||
url: '/api/Check/GetRoles',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// export const loginout = () => {
|
||||
// return request({
|
||||
// url: '/auth/logout',
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ export const createApplication = (data) => {
|
|||
// 获取树结构
|
||||
export const getApplicationInfo = () => {
|
||||
return request({
|
||||
url: '/applicationMars/getApplicationInfo',
|
||||
url: '/applicationMars/getApplicationInfo/'+localStorage.getItem('areaENName') ,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
|
@ -33,7 +33,7 @@ export const applicationdelete = (id) => {
|
|||
//获取所有分类
|
||||
export const getProjectName = (id) => {
|
||||
return request({
|
||||
url: '/applicationMars/getProjectName',
|
||||
url: '/applicationMars/getProjectName/'+localStorage.getItem('areaENName'),
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
|
@ -100,4 +100,19 @@ export const getGeomData = (tableValue) => {
|
|||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 获取
|
||||
export const getShpRelation = (tableName) => {
|
||||
return request({
|
||||
url: '/geoserver/getShpRelation/'+ tableName,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 获取字段值
|
||||
export const getColumnByName = (data) => {
|
||||
return request({
|
||||
url: '/geoserver/getColumnByName',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import QS from 'qs'
|
|||
|
||||
export const getMonitorList = (data) => {
|
||||
return request({
|
||||
url: '/api/CameraEvent/LoadAllRtu',
|
||||
url: '/api/CameraEvent/LoadAllRtuByLayer',
|
||||
method: 'get',
|
||||
params: data
|
||||
})
|
||||
|
|
@ -33,6 +33,34 @@ export const addGrid = (data) =>{
|
|||
data: data
|
||||
})
|
||||
}
|
||||
export const editGrid = (data) =>{
|
||||
return request({
|
||||
url: '/api/Grid/EditGrid',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export const DeleteGrid = (data)=>{
|
||||
return request({
|
||||
url: '/api/Grid/DeleteGrid',
|
||||
method: 'post',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
export const getGridUserInfo = (data)=>{
|
||||
return request({
|
||||
url: '/api/Grid/LoadGridById',
|
||||
method: 'post',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
export const getWGYTypes = (data)=>{
|
||||
return request({
|
||||
url: '/api/Grid/GetWGYTypes',
|
||||
method: 'get',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,16 +1,31 @@
|
|||
export const globalApi = {
|
||||
// 本地测试
|
||||
// BASE_URL: "http://192.168.10.136:8909", //测试 卢国栋
|
||||
// GEOSERVER_URL: "http://192.168.10.136:8180",
|
||||
// netBASE_URL: "http://123.132.248.154:9111", //测试.net
|
||||
// BASE_URL: "http://192.168.10.109:8909", //测试 卢国栋
|
||||
// GEOSERVER_URL: "http://192.168.10.109:8180",
|
||||
// netBASE_URL: "http://221.2.83.254:9001", //.net
|
||||
|
||||
// 测试服务器
|
||||
BASE_URL: "http://123.132.248.154:9217", //测试 服务器
|
||||
GEOSERVER_URL:"http://123.132.248.154:9205",
|
||||
netBASE_URL: "http://123.132.248.154:9224", //测试.net
|
||||
// BASE_URL: "http://123.132.248.154:9217", //测试 服务器
|
||||
// GEOSERVER_URL:"http://123.132.248.154:9205",
|
||||
// netBASE_URL: "http://123.132.248.154:9224", //测试.net
|
||||
|
||||
|
||||
// 1240 测试服务器
|
||||
// BASE_URL: "http://123.132.248.154:9236", //测试 服务器
|
||||
// GEOSERVER_URL:"http://123.132.248.154:9235",
|
||||
// netBASE_URL: "http://123.132.248.154:9231", //测试.net
|
||||
|
||||
|
||||
//费县正式环境
|
||||
BASE_URL: "http://221.2.83.254:9006", // java
|
||||
// BASE_URL : "http://192.168.10.106:8909",
|
||||
GEOSERVER_URL:"http://221.2.83.254:9007", // geoserver
|
||||
netBASE_URL: "http://221.2.83.254:9001", //.net
|
||||
// netBASE_URL: "http://192.168.10.124:81", //.net
|
||||
|
||||
// 平邑县正式环境
|
||||
// BASE_URL: "https://fx.hopetrytech.com:7006/", // java
|
||||
// GEOSERVER_URL:"https://fx.hopetrytech.com:7005", // geoserver
|
||||
// netBASE_URL: "https://py.hopetrytech.com:7001", //.net
|
||||
|
||||
//正式环境
|
||||
// BASE_URL: "http://223.99.16.253:9006", // java
|
||||
// GEOSERVER_URL:"http://223.99.16.253:9007", // geoserver
|
||||
// netBASE_URL: "http://223.99.16.253:9001", //.net
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -35,13 +35,13 @@ export const constantRoutes = [
|
|||
show: false, //在导航栏是否显示
|
||||
component: () => import('@/views/data_draw/index'),
|
||||
meta: { name: "数据采集", iconfont: "/images/img6.png" },
|
||||
},{
|
||||
}, {
|
||||
path: "/excel_data_upload",
|
||||
name: "excel_data_upload",
|
||||
show: false, //在导航栏是否显示
|
||||
component: () => import('@/views/data_draw/excel_data_upload'),
|
||||
meta: { name: "Excel", iconfont: "/images/img6.png" },
|
||||
},{
|
||||
}, {
|
||||
path: "/shp_data_upload",
|
||||
name: "shp_data_upload",
|
||||
show: false, //在导航栏是否显示
|
||||
|
|
@ -54,32 +54,32 @@ export const constantRoutes = [
|
|||
show: false,//在导航栏是否显示
|
||||
component: () => import('@/views/big_scene/BigScene'),
|
||||
meta: { name: "监控中心", iconfont: "/images/img7.png" },
|
||||
},{
|
||||
}, {
|
||||
path: "/monitor",
|
||||
name: "monitor",
|
||||
show: true,//在导航栏是否显示
|
||||
show: false,//在导航栏是否显示
|
||||
component: () => import('@/views/monitor/index'),
|
||||
meta: { name: "监控中心", iconfont: "/images/img7.png" },
|
||||
},{
|
||||
}, {
|
||||
path: "/upload_type_selected",
|
||||
name: "upload_type_selected",
|
||||
show: true, //在导航栏是否显示
|
||||
component: () => import('@/views/data_manage/upload_type_selected'),
|
||||
meta: { name: "数据上传", iconfont: "/images/img6.png" },
|
||||
},{
|
||||
}, {
|
||||
path: "/layer_style_config",
|
||||
name: "layer_style_config",
|
||||
show: false, //在导航栏是否显示
|
||||
component: () => import('@/views/data_manage/yangshi'),
|
||||
meta: { name: "样式配置", iconfont: "/images/img6.png" },
|
||||
},
|
||||
// {
|
||||
// path: "/grid",
|
||||
// name: "Grid",
|
||||
// show: true,//在导航栏是否显示
|
||||
// component: () => import('@/views/grid'),
|
||||
// meta: { name: "网格员管理", iconfont: "/images/img9.png" },
|
||||
// },
|
||||
{
|
||||
path: "/grid",
|
||||
name: "Grid",
|
||||
show: false,//在导航栏是否显示
|
||||
component: () => import('@/views/grid'),
|
||||
meta: { name: "网格员管理", iconfont: "/images/img9.png" },
|
||||
},
|
||||
{
|
||||
path: "/burst-upload",
|
||||
name: "NewBurstUpload",
|
||||
|
|
@ -108,6 +108,13 @@ export const constantRoutes = [
|
|||
show: true,//在导航栏是否显示
|
||||
meta: { name: "应用管理", iconfont: "/images/img9.png" },
|
||||
},
|
||||
{
|
||||
path: "/layer_style",
|
||||
name: "layer_style",
|
||||
component: () => import('@/views/layer_style/layer'),
|
||||
show: true,//在导航栏是否显示
|
||||
meta: { name: "图层样式", iconfont: "/images/img10.png" },
|
||||
},
|
||||
{
|
||||
path: "/mars3dcopy",
|
||||
name: "mars3dcopy",
|
||||
|
|
@ -149,19 +156,30 @@ export function resetRouter() {
|
|||
}
|
||||
|
||||
// 使用 router.beforeEach 注册一个全局前置守卫，判断用户是否登陆
|
||||
|
||||
// router.beforeEach((to, from, next) => {
|
||||
// // console.log(to);
|
||||
// if (to.path == '/') {
|
||||
// next();
|
||||
// } else {
|
||||
// let token = localStorage.getItem('X-Token');
|
||||
// // console.log(!token);
|
||||
// if (!token) {
|
||||
// next('/');
|
||||
// } else {
|
||||
// next();
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
router.beforeEach((to, from, next) => {
|
||||
// console.log(to);
|
||||
if (to.path == '/') {
|
||||
next();
|
||||
let token = localStorage.getItem('X-Token');
|
||||
let hrefIdx = window.location.href.indexOf('token='); // url中是否携带token
|
||||
if (hrefIdx > -1 && (token === '' || token === undefined || token === null)) { // 如果url携带token,并且没有登录后的用户信息
|
||||
let token = window.location.href.slice(hrefIdx + 3); // 截取token
|
||||
let defaultUrl = "/dashboard";
|
||||
next(defaultUrl);
|
||||
} else {
|
||||
let token = localStorage.getItem('X-Token');
|
||||
// console.log(!token);
|
||||
if (!token) {
|
||||
next('/');
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
next()
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
export default router
|
||||
|
|
|
|||
|
|
@ -380,7 +380,6 @@ export function getjq(yyyy, mm, dd) {
|
|||
*/
|
||||
export function exportJson(data, filename) {
|
||||
if (!data) {
|
||||
alert('保存的数据为空')
|
||||
return
|
||||
}
|
||||
if (!filename) {
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -6,8 +6,7 @@
|
|||
import mapboxgl from "mapbox-gl";
|
||||
import { globalApi } from "../../../api/urlPatterns.js";
|
||||
import { getLayer, getGeomData } from "../../../api/Datadetails";
|
||||
mapboxgl.accessToken =
|
||||
"pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ";
|
||||
// mapboxgl.accessToken ="pk.eyJ1IjoieHVqaW5nbGlhbmciLCJhIjoiY2w3bzFzZnZqMjdieTN1cG92N2I1d2huOSJ9.aQqMz4S-cTziUYizIH_gNg";
|
||||
export default {
|
||||
props: {
|
||||
row: {
|
||||
|
|
@ -23,9 +22,9 @@ export default {
|
|||
};
|
||||
},
|
||||
mounted() {
|
||||
// this.$nextTick(function () {
|
||||
// this.initMap();
|
||||
// });
|
||||
this.$nextTick(function () {
|
||||
this.initMap();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
onLoad() {
|
||||
|
|
@ -33,6 +32,7 @@ export default {
|
|||
if(!this.row.tableRef){
|
||||
return;
|
||||
}
|
||||
|
||||
getLayer({
|
||||
spaceType: this.row.spaceType,
|
||||
tableName: this.row.tableRef,
|
||||
|
|
@ -42,10 +42,17 @@ export default {
|
|||
getGeomData(this.row.tableRef).then((el) => {
|
||||
// console.log(el);
|
||||
if (el.data.code == 200) {
|
||||
if(el.data.msg){
|
||||
let st = el.data.msg.slice(6, -1);
|
||||
st = st.split(" ");
|
||||
// console.log([Number(st[0]), Number(st[1])]);
|
||||
this.initMap(res.data.data.data[2].url, st);
|
||||
let _this = this;
|
||||
_this.initMap(res.data.data.data[2].url, st);
|
||||
}else{
|
||||
let st = [117.977325,35.265961];
|
||||
let _this = this;
|
||||
_this.initMap(res.data.data.data[2].url, st);
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -53,33 +60,88 @@ export default {
|
|||
},
|
||||
// 加载地图
|
||||
initMap(url, jwd) {
|
||||
// 先销毁地图
|
||||
if(this.map){
|
||||
this.map.remove();
|
||||
this.map = null;
|
||||
}
|
||||
// 创建地图
|
||||
let _this = this;
|
||||
this.map = new mapboxgl.Map({
|
||||
container: this.$refs.datamap,
|
||||
style: "mapbox://styles/shichao123/clf3b1bxk007801moo0nnl87k",
|
||||
style: {
|
||||
"glyphs":"http://221.2.83.254:9010/font/{fontstack}/{range}.pbf",
|
||||
"version": 8,
|
||||
"sources": {
|
||||
"raster-tiles": {
|
||||
"type": "raster",
|
||||
"tiles": ['https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=b6585bc41ee16251dbe6b1af64f375d9'],
|
||||
"tileSize": 256,
|
||||
}
|
||||
},
|
||||
"layers": [
|
||||
{
|
||||
"id": "tdt-img-tiles",
|
||||
"type": "raster",
|
||||
"source": "raster-tiles",
|
||||
"minzoom": 0,
|
||||
"maxzoom": 22
|
||||
}]
|
||||
},
|
||||
center: [117.977325, 35.265961],
|
||||
zoom: 14,
|
||||
language: "zh-cmn",
|
||||
projection: "globe",
|
||||
});
|
||||
this.map.on("load", () => {
|
||||
// 高清影像
|
||||
_this.loadGaoQingLayer();
|
||||
// 注记图层
|
||||
_this.loadDianZiLayer();
|
||||
// 数据图层
|
||||
_this.addGeoJsonLayer(url, jwd);
|
||||
});
|
||||
},
|
||||
// 'http://localhost:8080/geoserver/wms?service=WMS&version=1.1.0&request=GetMap&layers=topp:states&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png'
|
||||
// http://123.132.248.154:9205/geoserver/gwc/service/tms/1.0.0/ksp:shp_1681969689@EPSG:4326@png
|
||||
loadDianZiLayer() {
|
||||
this.map.addLayer({
|
||||
id: "tiandituzhuji",
|
||||
type: "raster",
|
||||
source: {
|
||||
type: "raster",
|
||||
tiles: [
|
||||
"http://t0.tianditu.com/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=b6585bc41ee16251dbe6b1af64f375d9",
|
||||
],
|
||||
tileSize: 256,
|
||||
},
|
||||
layout: {
|
||||
visibility: "visible",
|
||||
},
|
||||
});
|
||||
},
|
||||
// 高清影像
|
||||
loadGaoQingLayer() {
|
||||
this.map.addLayer({
|
||||
'id': 'gaoqingyingxiang',
|
||||
'type': 'raster',
|
||||
'source': {
|
||||
'type': 'raster',
|
||||
'tiles': ["http://221.2.83.254:9007/geoserver/feixian/wms?service=WMS&version=1.1.0&request=GetMap&layers=feixian:feixianyingxiang20250308&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE"],
|
||||
'tileSize': 256
|
||||
},
|
||||
'layout': {
|
||||
'visibility': 'visible'
|
||||
},
|
||||
'paint': {
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
addGeoJsonLayer(url, jwd) {
|
||||
// console.log(Object(url));
|
||||
this.map.addSource("wmsSource", {
|
||||
type: "raster",
|
||||
// tiles: [
|
||||
// "http://60.213.14.14:8060/geoserver/feixian/wms?service=WMS&version=1.1.0&request=GetMap&layers=feixian:zhenjie&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE",
|
||||
// ],
|
||||
tiles: [
|
||||
globalApi.GEOSERVER_URL +
|
||||
"/geoserver/ksp/wms?service=WMS&version=1.1.0&request=GetMap&layers=ksp:" +
|
||||
this.row.tableRef +
|
||||
"&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE",
|
||||
globalApi.GEOSERVER_URL +"/geoserver/ksp/wms?service=WMS&version=1.1.0&request=GetMap&layers=ksp:"+this.row.tableRef +"&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE&cql_filter=is_del%20=0",
|
||||
],
|
||||
tileSize: 256,
|
||||
});
|
||||
|
|
@ -92,11 +154,13 @@ export default {
|
|||
visibility: "visible",
|
||||
},
|
||||
});
|
||||
this.map.flyTo({
|
||||
center: [Number(jwd[0]), Number(jwd[1])],
|
||||
zoom: 10,
|
||||
speed: 5,
|
||||
});
|
||||
if(jwd){
|
||||
this.map.flyTo({
|
||||
center: [Number(jwd[0]), Number(jwd[1])],
|
||||
zoom: 10,
|
||||
speed: 5,
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
|
|||
|
|
@ -128,7 +128,7 @@ import Dian from "./dian.vue";
|
|||
import geoserve from "../../../assets/xianjie.json";
|
||||
import * as turf from "@turf/turf";
|
||||
mapboxgl.accessToken =
|
||||
"pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ";
|
||||
"pk.eyJ1IjoieHVqaW5nbGlhbmciLCJhIjoiY2w3bzFzZnZqMjdieTN1cG92N2I1d2huOSJ9.aQqMz4S-cTziUYizIH_gNg";
|
||||
import { globalApi } from "../../../api/urlPatterns";
|
||||
export default {
|
||||
props: {
|
||||
|
|
@ -336,7 +336,7 @@ export default {
|
|||
let _this = this;
|
||||
this.map = new mapboxgl.Map({
|
||||
container: this.$refs.datamaps,
|
||||
style: "mapbox://styles/shichao123/clf3b1bxk007801moo0nnl87k",
|
||||
style:"mapbox://styles/mapbox/satellite-v9",
|
||||
center: [117.922083055, 35.285659054999996],
|
||||
zoom: 14,
|
||||
language: "zh-cmn",
|
||||
|
|
|
|||
|
|
@ -62,6 +62,4 @@ export default {
|
|||
margin:0px auto;
|
||||
height: calc( 100% - 240px);
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
</style>
|
||||
|
|
@ -20,7 +20,7 @@ import * as MP from './lib/Mp.js';
|
|||
},
|
||||
methods:{
|
||||
initMap(){
|
||||
this.$mapboxgl.accessToken = "pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ";
|
||||
// this.$mapboxgl.accessToken = "pk.eyJ1IjoieHVqaW5nbGlhbmciLCJhIjoiY2w3bzFzZnZqMjdieTN1cG92N2I1d2huOSJ9.aQqMz4S-cTziUYizIH_gNg";
|
||||
this.map = new this.$mapboxgl.Map({
|
||||
container:"drawMapContainer",
|
||||
center:[118.0075,35.42222222],
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -25,7 +25,7 @@
|
|||
<div class="layer-container">
|
||||
<div class="layer-button" @click="toggleLayer('tiandituzhuji')" :style="{'background':layerShow['tiandituzhuji'] == 'visible'?'#108eff':'none','color':layerShow['tiandituzhuji'] == 'visible'?'#fff':'#108eff'}"> <i class="el-icon el-icon-circle-check"></i> 电子底图</div>
|
||||
<div class="layer-button" @click="toggleLayer('gaoqingyingxiang')" :style="{'background':layerShow['gaoqingyingxiang'] == 'visible'?'#108eff':'none','color':layerShow['gaoqingyingxiang'] == 'visible'?'#fff':'#108eff'}"> <i class="el-icon el-icon-circle-check"></i> 高清影像</div>
|
||||
<div class="layer-button" @click="toggleLayer('xianjie')" :style="{'background':layerShow['xianjie'] == 'visible'?'#108eff':'none','color':layerShow['xianjie'] == 'visible'?'#fff':'#108eff'}"> <i class="el-icon el-icon-circle-check"></i> 费县县界</div>
|
||||
<div class="layer-button" @click="toggleLayer('xianjie')" :style="{'background':layerShow['xianjie'] == 'visible'?'#108eff':'none','color':layerShow['xianjie'] == 'visible'?'#fff':'#108eff'}"> <i class="el-icon el-icon-circle-check"></i> 平邑县县界</div>
|
||||
</div>
|
||||
<div id="mapEditorContainer" class="map-container">
|
||||
|
||||
|
|
@ -250,7 +250,7 @@ export default {
|
|||
}
|
||||
},
|
||||
initMap(){
|
||||
this.$mapboxgl.accessToken = "pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ";
|
||||
this.$mapboxgl.accessToken = "pk.eyJ1IjoieHVqaW5nbGlhbmciLCJhIjoiY2w3bzFzZnZqMjdieTN1cG92N2I1d2huOSJ9.aQqMz4S-cTziUYizIH_gNg";
|
||||
this.globalMap = new this.$mapboxgl.Map({
|
||||
container:"mapEditorContainer",
|
||||
center:[this.currentViewer.center.lng,this.currentViewer.center.lat],
|
||||
|
|
@ -392,7 +392,7 @@ export default {
|
|||
'type': 'raster',
|
||||
'source': {
|
||||
'type': 'raster',
|
||||
'tiles': ["http://60.213.14.14:8060/geoserver/feixian/wms?service=WMS&version=1.1.0&request=GetMap&layers=feixian:yingxiang&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE"],
|
||||
'tiles': ["http://221.2.83.254:9007/geoserver/feixian/wms?service=WMS&version=1.1.0&request=GetMap&layers=feixian:feixianyingxiang20250308&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE"],
|
||||
'tileSize': 256
|
||||
},
|
||||
'layout':{
|
||||
|
|
|
|||
|
|
@ -157,8 +157,7 @@ import {
|
|||
publishLayer,
|
||||
getLayerStyle,
|
||||
} from "../../api/datamange";
|
||||
mapboxgl.accessToken =
|
||||
"pk.eyJ1Ijoic2hpY2hhbzEyMyIsImEiOiJja3FobnI1aDEwNGF6Mm9vOXVhNnBzZmFhIn0.2fZKiMqCQHxVY74QShMEGQ";
|
||||
// mapboxgl.accessToken = "pk.eyJ1IjoieHVqaW5nbGlhbmciLCJhIjoiY2w3bzFzZnZqMjdieTN1cG92N2I1d2huOSJ9.aQqMz4S-cTziUYizIH_gNg";
|
||||
|
||||
export default {
|
||||
name: "DataManage",
|
||||
|
|
@ -393,7 +392,7 @@ export default {
|
|||
let _this = this;
|
||||
this.map = new mapboxgl.Map({
|
||||
container: "mapbox-container",
|
||||
style: "mapbox://styles/shichao123/clf3b1bxk007801moo0nnl87k",
|
||||
style:"mapbox://styles/mapbox/satellite-v9",
|
||||
center: [118, 25],
|
||||
zoom: 14,
|
||||
language: "zh-cmn",
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,28 @@
|
|||
const validateMobile = function (rule, value, callback) {
|
||||
let newValue = value.replace(/[^0-9]/gi, '')
|
||||
if (value !== newValue) {
|
||||
callback(new Error('请输入正确的手机号'))
|
||||
} else if (newValue.length !== 11) {
|
||||
callback(new Error('请输入正确的手机号'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
const validID = function(rule, value, callback) {
|
||||
// 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X
|
||||
let reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
|
||||
if (reg.test(value)) {
|
||||
callback();
|
||||
} else {
|
||||
callback(new Error("请输入正确的身份证号码"));
|
||||
}
|
||||
}
|
||||
var validateStock = (rule, value, callback) => {
|
||||
if (!value || value == 0) {
|
||||
callback(new Error("不能为空"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
|
||||
export { validateMobile ,validID,validateStock}
|
||||
|
|
@ -0,0 +1,708 @@
|
|||
<template>
|
||||
<div class="grid-container">
|
||||
<div class="operate-container">
|
||||
<!-- <el-input type="text" size="mini" style="width:300px;margin-right:14px;" placeholder='请输入搜索关键字'></el-input> -->
|
||||
<!-- <el-button icon="el-icon-search" size="mini" type="default">查询</el-button> -->
|
||||
<el-button icon="el-icon-plus" size="mini" type="primary" @click="addDialog">添加</el-button>
|
||||
<el-button icon="el-icon-edit" size="mini" type="primary" @click="createDialog">编辑</el-button>
|
||||
<el-button icon="el-icon-delete" size="mini" type="danger" @click="deleteWg">删除</el-button>
|
||||
<el-button icon="el-icon-upload" size="mini" type="primary" @click="uploadWindowShow">上传</el-button>
|
||||
</div>
|
||||
<el-table :data="tableData" size="mini" height=" " border style="width: 100%;height: 65%; background: rgb(26, 39, 75);;"
|
||||
@selection-change="handleSelectionChange">
|
||||
|
||||
<el-table-column type="selection" width="55">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="styleName" label="样式名称">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="typeName" label="数据格式">
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
<!-- <div class="page-container">
|
||||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageNum" :page-sizes="[20,50,100, 200, 300, 400]"
|
||||
:page-size="listQuery.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total">
|
||||
</el-pagination>
|
||||
</div> -->
|
||||
<el-dialog :title="titleStr" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
|
||||
<!-- ------------------------------------------- -- 配置页------------------------------------------------------------------------------- -->
|
||||
<div class="tuceng_ys">
|
||||
<div class="tuceng_ys_son">
|
||||
<el-form ref="forms" :model="form" label-width="80px" size="mini">
|
||||
<template v-if="typeName == 'add'">
|
||||
<el-form-item label="样式名称">
|
||||
<el-input style="width: 300px" v-model="form.styleName"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据格式">
|
||||
<el-select style="width: 300px" v-model="form.type" placeholder="请选择数据格式">
|
||||
<el-option label="线" value="1"></el-option>
|
||||
<el-option label="面" value="2"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-form-item label="样式名称">
|
||||
<el-input style="width: 300px" v-model="form.styleName" disabled></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据格式">
|
||||
<el-input style="width: 300px" v-model="form.typeName" disabled></el-input>
|
||||
</el-form-item>
|
||||
</template>
|
||||
|
||||
|
||||
<el-form-item v-show="form.type == 2" label="填充颜色">
|
||||
<el-color-picker v-model="form.fillColor"></el-color-picker>
|
||||
</el-form-item>
|
||||
<el-form-item v-show="form.type == 2" label="透明度">
|
||||
<el-input style="width: 300px" v-model="form.fillOpacity"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item v-show="form.type == 2 || form.type == 1" label="线条颜色">
|
||||
<el-color-picker v-model="form.strokeColor"></el-color-picker>
|
||||
</el-form-item>
|
||||
<el-form-item v-show="form.type == 2 || form.type == 1" label="线条宽度">
|
||||
<el-input style="width: 300px" v-model="form.strokeWidth"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit" v-if="typeName == 'add'">创建</el-button>
|
||||
<el-button type="primary" @click="onCreate" v-else>编辑</el-button>
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<el-dialog :title="'上传样式'" width="30%" v-if="uploadWindowVisable">
|
||||
<div style="width:500px;height:500px;background:red;">111111</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getMethodCommon } from '../../api/Api'
|
||||
import { saveLayerStyle,getLayerStyleAndType ,deleteLayerStyle,updateLayerStyle} from "../../api/datamange";
|
||||
|
||||
export default {
|
||||
name: 'index',
|
||||
data() {
|
||||
return {
|
||||
titleStr: '添加',
|
||||
rules: {
|
||||
|
||||
},
|
||||
dialogVisible: false,
|
||||
total: 100,
|
||||
listQuery: {
|
||||
pageSize: 10,
|
||||
pageNum: 1,
|
||||
},
|
||||
data: null,
|
||||
defaultProps: {
|
||||
children: 'child',
|
||||
label: 'areaName'
|
||||
},
|
||||
tableData: [
|
||||
{
|
||||
name: "样式一",
|
||||
geshi: '面',
|
||||
toumingdu: '0.1',
|
||||
tianchong: '0.1',
|
||||
kuandu: '0.1',
|
||||
yanse: '0.1',
|
||||
}
|
||||
],
|
||||
checkTreeId: null,
|
||||
selectIdList: [],
|
||||
WGYTypesList: [],
|
||||
typeName: 'add',
|
||||
form: {
|
||||
type: "1",
|
||||
styleName: "",
|
||||
fillColor: "",
|
||||
fillOpacity: "",
|
||||
strokeColor: "",
|
||||
strokeWidth: "",
|
||||
},
|
||||
selectItem:[],
|
||||
uploadWindowVisable:false,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
createEcharts(){
|
||||
|
||||
},
|
||||
uploadWindowShow(){
|
||||
},
|
||||
getList(){
|
||||
getLayerStyleAndType().then((res) => {
|
||||
console.log(res)
|
||||
var list = res.data.data.data
|
||||
list.forEach(element => {
|
||||
element.typeName = element.type == 1 ? '线' : '面'
|
||||
});
|
||||
this.tableData= list;
|
||||
});
|
||||
},
|
||||
onSubmit() {
|
||||
// console.log(this.form);
|
||||
var _this = this
|
||||
if (!/[\u4E00-\u9FA5]/g.test(this.form.styleName)) {
|
||||
saveLayerStyle(this.form).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success("创建成功");
|
||||
this.dialogVisible = false
|
||||
_this.getList()
|
||||
} else {
|
||||
this.$message.error("创建失败");
|
||||
}
|
||||
// console.log(res);
|
||||
});
|
||||
} else {
|
||||
this.$message.error('不能输入中文')
|
||||
}
|
||||
},
|
||||
handleSizeChange(e) {
|
||||
this.listQuery.pageSize = e;
|
||||
this.getList();
|
||||
},
|
||||
handleCurrentChange(e) {
|
||||
this.listQuery.pageNum = e;
|
||||
this.getList();
|
||||
},
|
||||
submitForm() {
|
||||
var _this = this
|
||||
console.log(this.ruleForm)
|
||||
this.ruleForm.pId = this.checkTreeId
|
||||
this.ruleForm.households = Number(this.ruleForm.households)
|
||||
this.ruleForm.peopleNum = Number(this.ruleForm.peopleNum)
|
||||
this.$refs['ruleForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addGrid(_this.ruleForm).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
_this.dialogVisible = false
|
||||
_this.getUserList({ id: _this.checkTreeId });
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
createForm() {
|
||||
var _this = this
|
||||
console.log(this.ruleForm)
|
||||
this.ruleForm.areaId = this.selectIdList[0]
|
||||
this.ruleForm.pId = this.checkTreeId
|
||||
this.ruleForm.households = Number(this.ruleForm.households)
|
||||
this.ruleForm.peopleNum = Number(this.ruleForm.peopleNum)
|
||||
this.$refs['ruleForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editGrid(_this.ruleForm).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
_this.dialogVisible = false
|
||||
_this.getUserList({ id: _this.checkTreeId });
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleSelectionChange(e) {
|
||||
this.selectItem = e
|
||||
console.log("handleSelectionChange",e);
|
||||
this.selectIdList = []
|
||||
e.forEach(item => {
|
||||
this.selectIdList.push(item.styleName)
|
||||
})
|
||||
},
|
||||
// 关闭弹窗
|
||||
handleClose(done) {
|
||||
done();
|
||||
},
|
||||
addDialog() {
|
||||
this.dialogVisible = true;
|
||||
this.titleStr = '添加'
|
||||
this.typeName = 'add'
|
||||
this.form = {
|
||||
type: "1",
|
||||
styleName: "",
|
||||
fillColor: "",
|
||||
fillOpacity: "",
|
||||
strokeColor: "",
|
||||
strokeWidth: "",
|
||||
}
|
||||
|
||||
},
|
||||
createDialog() {
|
||||
if (this.selectIdList.length == 0) {
|
||||
this.$message.warning('至少选中一个进行编辑');
|
||||
return
|
||||
} else if (this.selectIdList.length > 1) {
|
||||
this.$message.warning('只能选中一个进行编辑');
|
||||
return
|
||||
}
|
||||
|
||||
var _this = this
|
||||
this.dialogVisible = true;
|
||||
this.titleStr = '编辑'
|
||||
this.typeName = 'create'
|
||||
this.form = this.selectItem[0]
|
||||
this.form.type = this.form.type.toString()
|
||||
|
||||
},
|
||||
deleteWg() {
|
||||
var _this = this
|
||||
if (this.selectIdList.length == 0) {
|
||||
this.$message.warning('至少选中一个进行删除');
|
||||
return
|
||||
} else if (this.selectIdList.length > 1) {
|
||||
this.$message.warning('只能选中一个进行删除');
|
||||
return
|
||||
}
|
||||
this.$confirm("确认删除？")
|
||||
.then(() => {
|
||||
console.log("selectIdList",this.selectIdList);
|
||||
deleteLayerStyle(this.selectIdList[0]).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
_this.dialogVisible = false
|
||||
_this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch((_) => { });
|
||||
|
||||
},
|
||||
onCreate(){
|
||||
updateLayerStyle(this.form).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success("编辑成功");
|
||||
this.dialogVisible = false
|
||||
_this.getList()
|
||||
} else {
|
||||
this.$message.error("编辑失败");
|
||||
}
|
||||
// console.log(res);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.page-container {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination__total {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination__jump {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination button:disabled {
|
||||
background: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.tuceng_ys ::v-deep.tuceng_ys_son .el-input__inner {
|
||||
background-color: transparent;
|
||||
border: 1px solid #10a2e1;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.tuceng_ys ::v-deep.tuceng_ys_son .el-form-item__label {
|
||||
color: #10a2e1;
|
||||
}
|
||||
|
||||
.tuceng_ys ::v-deep.tuceng_ys_son .el-color-picker__trigger {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
::v-deep .el-checkbox {
|
||||
margin-top: 4px !important;
|
||||
}
|
||||
|
||||
::v-deep .el-checkbox__inner {
|
||||
background-color: transparent;
|
||||
border: 0.0625rem solid #00b2ff;
|
||||
color: #fff;
|
||||
border-radius: 0px
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__title {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog {
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.operate-container {
|
||||
text-align: right;
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
border-bottom: 1px solid #108eff;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
width: calc(100% - 0px);
|
||||
min-height: 500px;
|
||||
padding: 40px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
/* */
|
||||
::v-deep .el-tree {
|
||||
|
||||
color: #ffffff;
|
||||
/* // 整体背景透明 */
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
::v-deep .el-checkbox__inner {
|
||||
/*// checkbox 背景透明 */
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
::v-deep .el-tree-node__content:hover {
|
||||
/* // hover 节点背景色，否则是白色 */
|
||||
background: rgba(104, 147, 215, 0.4);
|
||||
}
|
||||
|
||||
::v-deep .el-tree-node:focus>.el-tree-node__content {
|
||||
/* // focus 节点背景透明，否则是白色 */
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-table {
|
||||
background: none;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item__label {
|
||||
/* padding:0px; */
|
||||
}
|
||||
|
||||
::v-deep .el-form-item {
|
||||
/* margin-bottom:5px; */
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-table__fixed-right::before,
|
||||
.el-table__fixed::before {
|
||||
height: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-table::before {
|
||||
height: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-form--inline {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
::v-deep .mapboxgl-ctrl {
|
||||
display: block;
|
||||
}
|
||||
|
||||
::v-deep .el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell.is-leaf {
|
||||
border-bottom: 1px solid hsl(240, 100%, 37%, 0.2);
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background-color: transparent;
|
||||
border: 0.0625rem solid #00b2ff;
|
||||
color: #fff;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-button {
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item__label {
|
||||
color: #00b2ff;
|
||||
/* line-height: 2.1875rem; */
|
||||
}
|
||||
|
||||
::v-deep .el-button--small {
|
||||
padding: 0.625rem 2.1875rem;
|
||||
}
|
||||
|
||||
::v-deep .el-form--inline .el-form-item {
|
||||
/* margin-left: 1.875rem; */
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* “表格内背景颜色“ */
|
||||
::v-deep.el-table th,
|
||||
::v-deep.el-table tr,
|
||||
::v-deep.el-table td {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* 按钮样式修改 */
|
||||
::v-deep .el-button--success {
|
||||
background: #266a94;
|
||||
color: #00f261;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-button--info {
|
||||
background: #482c27;
|
||||
color: #8ac2da;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::v-deep.el-button--primary {
|
||||
background: #266a94;
|
||||
color: #8ac2da;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
::v-deep.el-button--primary {
|
||||
background: #578ef0;
|
||||
color: #fff;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/*修改element-ui的table 在鼠标悬停hover时的高亮颜色*/
|
||||
::v-deep.el-table tbody tr:hover>td {
|
||||
background-color: black !important;
|
||||
}
|
||||
|
||||
/* 第一个 dialog修改 */
|
||||
::v-deep.dialog_one .el-dialog {
|
||||
background: #266a94 !important;
|
||||
border: 1px solid #10a2e1;
|
||||
}
|
||||
|
||||
::v-deep.dialog_one .el-dialog__title {
|
||||
color: #00b2ff;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
::v-deep.dialog_one .el-dialog__header {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 第二个 dialog 修改 */
|
||||
::v-deep.dialog_two .el-dialog {
|
||||
background: rgba(37, 61, 75, 0.7) !important;
|
||||
border: 1px solid #797979;
|
||||
}
|
||||
|
||||
::v-deep.dialog_two .el-dialog__body {
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
::v-deep.dialog_two .el-dialog__header {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-table__cell {
|
||||
background: none;
|
||||
padding: 0px;
|
||||
font-size: 14px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
::v-deep .cell {
|
||||
padding: 0px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
/* background:hsl(212, 43%, 49%,0.5); */
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
::v-deep .number {
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .btn-next {
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .btn-prev {
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination__total {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination__jump {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination button:disabled {
|
||||
background: none;
|
||||
}
|
||||
|
||||
::v-deep .disabled {
|
||||
background: none;
|
||||
}
|
||||
|
||||
::v-deep .el-descriptions__body {
|
||||
background: none;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
::v-deep .el-descriptions-row {
|
||||
background: none;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-descriptions-item__label {
|
||||
background: hsl(212, 43%, 49%, 0.5);
|
||||
color: #eee;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
::v-deep .el-descriptions .is-bordered .el-descriptions-item__cell {
|
||||
border-color: hsl(212, 43%, 49%, 1);
|
||||
}
|
||||
|
||||
|
||||
|
||||
::v-deep .el-checkbox {
|
||||
margin-top: 14px;
|
||||
}
|
||||
|
||||
::v-deep .el-table--scrollable-y .el-table__body-wrapper {
|
||||
overflow-x: auto;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
::v-deep .el-table--scrollable-x .el-table__body-wrapper {}
|
||||
|
||||
::v-deep .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar {
|
||||
display: block !important;
|
||||
z-index: 99999999999999;
|
||||
}
|
||||
|
||||
/* 滑道样式 */
|
||||
::v-deep .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
height: 10px;
|
||||
background: #304156;
|
||||
border-radius: 6px;
|
||||
z-index: 99999999999999;
|
||||
}
|
||||
|
||||
/* 定义滑块的样式 */
|
||||
::v-deep .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||
border-radius: 0px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
z-index: 99999999999999;
|
||||
}
|
||||
|
||||
/* 定义滑块鼠标移入时的样式 */
|
||||
::v-deep .el-table--scrollable-x .el-table__body-wrapper .el-table__body-wrapper .is-scrolling-left::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
z-index: 99999999999999;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination__jump {
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
|
||||
::v-deep .el-pagination .el-select {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
::v-deep .el-pager li {
|
||||
width: 10px !important;
|
||||
}
|
||||
|
||||
::v-deep .el-pager .number {
|
||||
padding: 0px;
|
||||
width: 10px !important;
|
||||
}
|
||||
|
||||
::v-deep .el-pagination .el-input__inner {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
::v-deep .mapboxgl-ctrl {
|
||||
/* display:none; */
|
||||
}
|
||||
|
||||
::v-deep .mapboxgl-ctrl-attrib-inner {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item__content .is-disabled .el-input__inner {
|
||||
background-color: none !important;
|
||||
}
|
||||
|
||||
::v-deep .mapboxgl-map canvas {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-pager li {
|
||||
min-width: 25px !important;
|
||||
}
|
||||
|
||||
::v-deep .el-table--border::after,
|
||||
.el-table--group::after,
|
||||
.el-table::before {
|
||||
background: none;
|
||||
}
|
||||
|
||||
::v-deep .el-table--border,
|
||||
.el-table--group {
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
::v-deep .el-table--border th.el-table__cell,
|
||||
.el-table__fixed-right-patch {
|
||||
/* border:0px; */
|
||||
}
|
||||
|
||||
::v-deep .el-table--border .el-table__cell,
|
||||
.el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
.page-container {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
padding: 15px 0px;
|
||||
border-top: 1px solid #ccc;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -24,7 +24,8 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { login } from "../../api/login";
|
||||
import md5 from 'js-md5'
|
||||
import { login,checkAuth } from "../../api/login";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -35,18 +36,44 @@ export default {
|
|||
methods: {
|
||||
login() {
|
||||
this.loading = true
|
||||
login(this.form.account, this.form.password).then((res) => {
|
||||
|
||||
login(this.form.account,md5(this.form.password).toUpperCase()).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
// console.log(res);
|
||||
// localStorage.setItem("X-Token", res.data.msg);
|
||||
localStorage.setItem("areaName",res.data.userInfo.areaENName);
|
||||
localStorage.setItem("areaENName",res.data.userInfo.areaENName);
|
||||
localStorage.setItem("X-Token", res.data.token);
|
||||
this.$message.success("登录成功");
|
||||
this.loading = false
|
||||
this.$router.push("/layout");
|
||||
this.checkAuth();
|
||||
|
||||
// this.$message.success("登录成功");
|
||||
// this.loading = false
|
||||
// this.$router.push("/layout");
|
||||
}
|
||||
});
|
||||
},
|
||||
checkAuth(){
|
||||
checkAuth().then(res=>{
|
||||
if(res.data.code == 200){
|
||||
let checked = false
|
||||
res.data.result.forEach((item)=>{
|
||||
// if(item.name == '数据维护'){
|
||||
checked = true
|
||||
// }
|
||||
})
|
||||
|
||||
if(checked){
|
||||
this.$message.success("登录成功！");
|
||||
this.loading = false
|
||||
this.$router.push("/layout");
|
||||
}else{
|
||||
this.$message.error("没有权限！");
|
||||
localStorage.clear();
|
||||
this.$router.push("/");
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -23,15 +23,27 @@
|
|||
}
|
||||
},
|
||||
mounted(){
|
||||
let arr = [
|
||||
this.monitorInfo.cameraindexcode,
|
||||
this.monitorInfo.cameraindexcode,
|
||||
"23604396",
|
||||
"221.2.83.54",
|
||||
1443,
|
||||
"NZJ8L3bxCOOV6rtTFjsx"
|
||||
]
|
||||
|
||||
let arr = [];
|
||||
if(localStorage.getItem("areaName")=='feixian'){
|
||||
arr = [
|
||||
this.monitorInfo.cameraindexcode,
|
||||
this.monitorInfo.cameraindexcode,
|
||||
"23604396",
|
||||
"221.2.83.54",
|
||||
1443,
|
||||
"NZJ8L3bxCOOV6rtTFjsx"
|
||||
]
|
||||
}else{
|
||||
arr = [
|
||||
this.monitorInfo.cameraindexcode,
|
||||
this.monitorInfo.cameraindexcode,
|
||||
"21274765",
|
||||
"223.99.16.253",
|
||||
1443,
|
||||
"CraRtGvpNB2xOcYSFTov"
|
||||
]
|
||||
}
|
||||
console.log('arr::::',arr)
|
||||
let _this = this;
|
||||
|
||||
this.$refs.fIframe.onload = function () {
|
||||
|
|
|
|||
Loading…
Reference in New Issue