From 25ce610f6ecca7325e7a743dc032c4a76559c63d Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Fri, 02 Jul 2021 09:10:26 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/pyhmap
---
widgets/searchL/Widget.js | 753 ++++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 603 insertions(+), 150 deletions(-)
diff --git a/widgets/searchL/Widget.js b/widgets/searchL/Widget.js
index cbd48e4..760379e 100644
--- a/widgets/searchL/Widget.js
+++ b/widgets/searchL/Widget.js
@@ -11,7 +11,8 @@
'jimu/BaseWidget',
'jimu/utils',
'jimu/css!libs/zTree_v3/css/zTreeStyle/zTreeStyle.css',
- 'libs/zTree_v3/js/jquery.ztree.all'
+ 'libs/zTree_v3/js/jquery.ztree.all',
+ './Cesiumadd'
],
function (declare,
lang,
@@ -29,14 +30,16 @@
layers: {},
states: 'one',
searchDatas: '',
+ addOneEntitys: null,
startup: function () {
var that = this;
+
+
//关键词&&坐标
$("#i-f-gjz").click(function () {
that.states = 'one';
- // console.log("gjz");
- $("#i-f-zb").css({ 'backgroundColor': '#fff', 'color': '#000' });
+ $("#i-f-zb").css({ 'backgroundColor': '#fff', 'color': '#969696' });
$("#i-f-gjz").css({ 'backgroundColor': '#3E9FFC', 'color': '#fff' });
// $("#inputTwo").css({ 'display': 'none' });
// $("#local_data").css({ 'display': 'inline-block' });
@@ -45,8 +48,7 @@
})
$("#i-f-zb").click(function () {
that.states = 'two';
- // console.log("zb");
- $("#i-f-gjz").css({ 'backgroundColor': '#fff', 'color': '#000' });
+ $("#i-f-gjz").css({ 'backgroundColor': '#fff', 'color': '#969696' });
$("#i-f-zb").css({ 'backgroundColor': '#3E9FFC', 'color': '#fff' });
// $("#local_data").css({ 'display': 'none' });
// $("#inputTwo").css({ 'display': 'inline-block' });
@@ -56,22 +58,77 @@
$(".searchImg").click(function () {
that.getInputData();
- that.setVal(that.searchDatas);
- $('.searchLMain').show();
+
+ that.addOneEntitys.removeAll();
+ if (typeof that.searchDatas == 'string') {
+ var han = /^[\u4e00-\u9fa5]+$/;
+ if (han.test(that.searchDatas) || that.searchDatas == ' ') {
+ that.getData(0, that.searchDatas);
+ $('.searchLMain').show();
+ $('.searchLMain').find('ul.layui-tab-title li:eq(0)').addClass('layui-this').siblings().removeClass('layui-this');
+ $('.searchLMain').find('div.layui-tab-content > div.layui-tab-item:eq(0)').addClass('layui-show').siblings().removeClass('layui-show');
+
+ } else {
+ layui.use(function () { //亦可加载特定模块：layui.use(['layer', 'laydate', function(){
+ //得到各种内置组件
+ var layer = layui.layer //弹层
+ // layer.msg('请先填写关键字', { icon: 1, time: 1000, shift: 6 });
+ layer.tips('请先填写关键字', '.searchImg', {
+ tips: [2, '#FF5722']
+ });
+ })
+ $('.searchLMain').hide();
+ }
+ } else {
+ if (that.searchDatas[0] && that.searchDatas[1]) {
+ that.map.camera.flyTo({
+ // destination: Cesium.Cartesian3.fromDegrees(Number(lng), Number(lat), Number(gaodu))
+ destination: Cesium.Cartesian3.fromDegrees(Number(that.searchDatas[0]), Number(that.searchDatas[1]), Number(8000))
+
+ });
+ } else {
+ layui.use(function () { //亦可加载特定模块：layui.use(['layer', 'laydate', function(){
+ //得到各种内置组件
+ var layer = layui.layer //弹层
+ // layer.msg('请先填写关键字', { icon: 1, time: 1000, shift: 6 });
+ layer.tips('请先填写完整坐标', '.searchImg', {
+ tips: [2, '#FF5722']
+ });
+ })
+ }
+ }
})
$(".searchColce").click(function () {
$('.searchLMain').hide();
+ that.addOneEntitys.removeAll();
+ topic.publish('getLegendsData', "legends", '');
})
- $('.cloce').click(() => {
- $('.popup').css({'display': 'none'})
- })
- },
+ $("#local_data").keyup(function (e) {
+ // console.log(e);
+ that.getInputData();
+ if (e.keyCode == 13 && typeof that.searchDatas == 'string') {
+ that.addOneEntitys.removeAll();
+ var han = /^[\u4e00-\u9fa5]+$/;
+ if (han.test(that.searchDatas) || that.searchDatas == ' ') {
+ that.getData(0, that.searchDatas);
+ $('.searchLMain').show();
+ $('.searchLMain').find('ul.layui-tab-title li:eq(0)').addClass('layui-this').siblings().removeClass('layui-this');
+ $('.searchLMain').find('div.layui-tab-content > div.layui-tab-item:eq(0)').addClass('layui-show').siblings().removeClass('layui-show');
- closeToolBox: function (item) {
- // if (item != this.name) {
- // $('.tool-y-box').hide();
- // }
+ } else {
+ layui.use(function () { //亦可加载特定模块：layui.use(['layer', 'laydate', function(){
+ //得到各种内置组件
+ var layer = layui.layer //弹层
+ // layer.msg('请先填写关键字', { icon: 1, time: 1000, shift: 6 });
+ layer.tips('请先填写关键字', '.searchImg', {
+ tips: [2, '#FF5722']
+ });
+ })
+ $('.searchLMain').hide();
+ }
+ }
+ })
},
getInputData: function () {
@@ -81,38 +138,187 @@
this.searchDatas = [$('#local_data1').val(), $('#local_data2').val()];
}
},
- setVal: function (val) {
- var that = this;
- if (typeof val == "string") {
- var url = 'http://171.34.76.171:8880/pyh-wetResource/GeoData/queryGeoData?name=' + val + '&protectAreald=&type=0&dataSort=1',
- token = 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJpc3MiOiJlY2hpc2FuIiwic3ViIjoiYWRtaW4iLCJpYXQiOjE2MjMxMTYwMzYsImV4cCI6MTYyNTcwODAzNn0.p2qqmcWrC9QDLAFgu1n0eR4k4wrr3udFKKhjBqGJXAzz1jdR57agyyYMsTZPXIPkH7hviE64uHLW8T7fM_VvNw';
+ getData: function (index, val) {
+ val = val == ' ' ? '' : val;
- axios.get(url, {
- headers: {
- 'token': token
- }
- }).then((res) => {
- if (res.status == 200) {
- var data = res.data.data;
- that.createData(data);
- } else {
- console.log('请求访问失败')
- }
- })
- } else if (typeof val == "object") {
+ var d = $('.searchLMain').find('.layui-tab-item').hide;
+ var that = this,
+ url = `http://171.34.76.171:8880/pyh-wetResource/monitorRecords/queryMonitorData?name=${val}&start&limit&type=${index}`
+ // url = `http://171.34.76.171:8880/pyh-wetResource/monitorRecords/queryMonitorData?name=&start&limit&type=${index}`
+ , token = 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJpc3MiOiJlY2hpc2FuIiwic3ViIjoiYWRtaW4iLCJpYXQiOjE2MjMyMjU5OTcsImV4cCI6MTYyNTgxNzk5N30.zWpoKa5AK7xLIPNm-CXoHY9D5kpk9AiUTGkuAQOZi2Rdl2BfroT4IqxjBpyUPZlgwCjG2CoJqy_7rnnodpmqNw';
- }
+ axios.get(url, {
+ headers: {
+ 'token': token
+ }
+ }).then((res) => {
+ if (res.data.code == 200) {
+ var data = res.data.data.panoramaList || res.data.data.stationList || res.data.data.videoList || [];
+
+ var val = index;//数据的2和1对调
+ if (index == 1) {
+ val = 2;
+ } else if (index == 2) {
+ val = 1;
+ }
+
+ that.createDatas(data, val);
+ } else {
+ console.log('请求访问失败')
+ }
+ })
},
- createData: function (d) {
- var i = 1;
- for (var k in d) {
- d[k].tableId = i++;
+ createDatas: function (d, n) {
+ this.addOneEntitys.removeAll();//清除图标点
+ if (d == []) {
+ if (n == 0) {
+ this.beginLayUi(d);
+ topic.publish('getLegendsData', "legends", d, "./images/addL/全景.png", "全景站点");
+ } else if (n == 1) {
+ this.beginLayUi(1, d);
+ topic.publish('getLegendsData', "legends", d, "./images/addL/监控.png", "监控站点");
+ } else if (n == 2) {
+ this.beginLayUi(1, 1, d);
+ topic.publish('getLegendsData', "legends", d, "./images/addL/全景.png", "监测站点");
+ }
+ } else {
+ var i = 1;
+ for (var k in d) {
+ d[k].tableId = i++;
+ //赋图标点
+ this.shiti(d[k], +n + 1);
+ }
+ var data = d;
+ if (n == 0) {
+ this.beginLayUi(data);
+ topic.publish('getLegendsData', "legends", d, "./images/addL/全景.png", "全景站点");
+ } else if (n == 1) {
+ this.beginLayUi(1, data);
+ topic.publish('getLegendsData', "legends", d, "./images/addL/监控.png", "监控站点");
+ } else if (n == 2) {
+ this.beginLayUi(1, 1, data);
+ topic.publish('getLegendsData', "legends", d, "./images/addL/监测.png", "监测站点");
+ }
}
- var data = d;
- this.beginLayUi(data);
},
onOpen: function () {
+ var dataSourceOne = new Cesium.CustomDataSource();
+ this.addOneEntitys = dataSourceOne.entities;
+ this.map.dataSources.add(dataSourceOne);
//面板打开的时候触发
+ var that = this;
+ layui.use('element', function () {
+ var $ = layui.jquery
+ , element = layui.element;
+ element.on('tab(docDemoTabBrief)', function (elem) {
+
+ var val = elem.index;//数据的2和1对调
+ if (elem.index == 1) {
+ val = 2;
+ } else if (elem.index == 2) {
+ val = 1;
+ }
+
+ that.getData(val, that.searchDatas);
+ });
+ });
+
+ // 地图图标点击事件
+ this.movehandLer();
+ },
+ // 获取鼠标事件
+ movehandLer: function movehandLer() {
+ // 取消默认双击事件
+ this.map.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
+ // 获取鼠标事件
+ this.mountainHandler = new Cesium.ScreenSpaceEventHandler(this.map.scene.canvas);
+ // 给鼠标左键添加事件函数
+ // this.mountainHandler.setInputAction(lang.hitch(this, this.mouseMove), Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+ this.mountainHandler.setInputAction(lang.hitch(this, this.clickHand), Cesium.ScreenSpaceEventType.LEFT_CLICK);
+ },
+ // 注册鼠标左键单击事件
+ clickHand: function clickHand(data) {// 全局鼠标点击图标事件 渲染地图图标时 添加个相对应的数组储存该对象数据 通过数组是否存在判断点击的项目
+ var pickedObjects = this.map.scene.drillPick(data.position) || 0;
+ // console.log(pickedObjects);
+ if (pickedObjects.length != 0) {
+ if (pickedObjects[0].primitive.id != undefined) {
+ if (pickedObjects[0].primitive.id.onceData != undefined) {//搜索图标点击事件
+ // console.log('onceData')
+ var data = pickedObjects[0].primitive.id.onceData[1];
+
+ if (pickedObjects[0].primitive.id.onceData[0] == 1) {//全景
+ var address = data.panAddress;
+ var dom = $('.jimu-widget-searchTabaPopup').find('.header'),
+ str = `${data.name}--全景`;
+ dom.empty();
+ dom.append(str);
+ // console.log(data)
+
+ dom = $('#poput-m-t-quanjing');
+ str = `<iframe id="poput-m-t-quanjing-iframe" src="${address}" frameborder="0"></iframe>`;
+ dom.empty();
+ dom.append(str);
+ $('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
+ $('.jimu-widget-searchTabaPopup').find('.p-main').eq(0).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
+ }
+ if (pickedObjects[0].primitive.id.onceData[0] == 2) {//监控
+ var dom = $('.jimu-widget-searchTabaPopup').find('.header'),
+ str = `${data.name}--实时视频`;
+ dom.empty();
+ dom.append(str);
+ // console.log(data)
+ if (data.flv) {
+ dom = $('#poput-m-t-video');
+ str = `
+ <video id="poput-m-t-video-video" ></video>
+ `;
+ dom.empty();
+ dom.append(str);
+ if (flvjs.isSupported()) {
+ var videoElement = document.getElementById('poput-m-t-video-video');
+ var flvPlayer = flvjs.createPlayer({
+ type: 'flv',
+ url: data.flv
+ });
+ flvPlayer.attachMediaElement(videoElement);
+ flvPlayer.load();
+ flvPlayer.play();
+ }
+ window.$myVideoFlvplayer = flvPlayer;
+ // var time = setTimeout(() => {
+
+ // }, 2000);
+ } else {
+ var dom = $('#poput-m-t-video'),
+ str = `
+ <div id="poput-m-t-video-none" >·暂无视频</div>
+ `;
+ dom.empty();
+ dom.append(str);
+ }
+ $('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
+ $('.jimu-widget-searchTabaPopup').find('.p-main').eq(0).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
+ }
+ if (pickedObjects[0].primitive.id.onceData[0] == 3) {//监测
+ console.log('监测', data)
+ }
+
+
+ } else if (pickedObjects[0].primitive.id.SQLData != undefined) {//SQL查询图标点击事件
+ // console.log('SQLData')
+ } else if (pickedObjects[0].primitive.id.spatialQueryData != undefined) {//SQL查询图标点击事件
+ var data = pickedObjects[0].primitive.id.spatialQueryData;
+ data.name = pickedObjects[0].primitive.id.name;
+ data.dom = pickedObjects[0].primitive.id.description;
+ // console.log(data);
+ var doms = $('#spatialQueryValuemain');
+ var domo = $('#spatialQueryValue');
+ doms.empty();
+ doms.append('<div>name:' + data.name + '<div/>' + data.dom._value);
+ domo.show();
+ }
+ }
+ }
},
onClose: function () {
@@ -130,131 +336,378 @@
resize: function () {
},
- beginLayUi: function (data) {
- console.log(data)
+ goOnPosition(arr, i, data) {
+ this.map.camera.flyTo({
+ // destination: Cesium.Cartesian3.fromDegrees(Number(lng), Number(lat), Number(gaodu))
+ destination: Cesium.Cartesian3.fromDegrees(Number(arr[0]), Number(arr[1]), Number(8000))
+ });
+ },
+ //定位实体位置
+ shiti: function (data, i) {
+ // console.log(data)
+ var imgs = i == 1 ? 'images/addL/全景.png' : i == 2 ? 'images/addL/监控.png' : i == 3 ? 'images/addL/监测.png' : '';
+ this.addOneEntitys.add({
+ id: data.id, // 实体ID
+ name: data.name, // 实体名称
+ position: Cesium.Cartesian3.fromDegrees(Number(data.lon), Number(data.lat)), // x,y 实体经纬度
+ label: {
+ show: true,
+ text: data.name, // text 与实体相关的文字
+ font: "700 20px '黑体'",
+ fillColor: Cesium.Color.fromCssColorString("rgba(57,165,253)"),
+ // backgroundColor: Cesium.Color.DEEPSKYBLUE,
+ style: Cesium.LabelStyle.FILL_AND_OUTLINE,
+ outlineWidth: 2,
+ outlineColor: Cesium.Color.fromBytes(255, 255, 255), // 文字轮廓的颜色
+ verticalOrigin: Cesium.VerticalOrigin.CENTER,//垂直位置
+ horizontalOrigin: Cesium.HorizontalOrigin.CENTER,//水平位置
+ pixelOffset: new Cesium.Cartesian2(0, -40), // 文字位置
+ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
+ // distanceDisplayCondition: new Cesium.DistanceDisplayCondition(1, entityConfig.showheight),
+ disableDepthTestDistance: Number.POSITIVE_INFINITY
+ },
+ billboard: {
+ show: true,
+ // image: 'images/addL/监测.png',
+ image: imgs,
+ // image: entityConfig.img,
+ width: 27,
+ height: 40,
+ clampToGround: true,
+ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
+ disableDepthTestDistance: Number.POSITIVE_INFINITY,
+ // rotation: Cesium.Math.toRadians(angle),
+ },
+ onceData: [i, data]
+ })
+ },
+ beginLayUi: function (data = 1, data1 = 1, data2 = 1) {
+ // console.log(data,data1,data2)
+ var that = this;
layui.use(function () {
var element = layui.element
, table = layui.table //表格
, laypage = layui.laypage; //分页
- table.render({
- elem: '#test'
- // , url: './data'
- , height: 475
- , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
- // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
- layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
- //,curr: 5 //设定初始在第 5 页
- , groups: 3 //只显示 1 个连续页码
- , first: false //不显示首页
- , last: false //不显示尾页
- }
- , cols: [[
- { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
- , { field: 'geoName', width: 90, align: 'center', unresize: true, title: '图层名称' }
- , { field: 'databaseName', width: 95, align: 'center', unresize: true, title: '图层属性1' }
- , { field: 'serviceUrl', width: 95, align: 'center', unresize: true, title: '图层属性2' }
- , { fixed: 'right', width: 115, align: 'center', unresize: true, title: '操作', toolbar: '#demoTable' }
- ]],
- data: data,
- //,skin: 'line' //表格风格
- even: true
- // , page: true //是否显示分页
- , limits: false
- , limit: 10 //每页默认显示的数量
+ if (data != 1) {
- });
+ table.render({
+ elem: '#test'
+ // , url: './data'全景
+ , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
+ // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ //,curr: 5 //设定初始在第 5 页
+ , groups: 3 //只显示 1 个连续页码
+ , first: false //不显示首页
+ , last: false //不显示尾页
+ }
+ , cols: [[
+ { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
+ , { field: 'name', width: 90, align: 'center', unresize: true, title: '名称' }
+ , { field: 'protectArea', width: 95, align: 'center', unresize: true, title: '所属保护区' }
+ , { field: 'remarks', width: 95, align: 'center', unresize: true, title: '备注' }
+ , { fixed: 'right', align: 'center', unresize: true, title: '操作', toolbar: '#demoTable' }
+ ]],
+ data: data,
+ //,skin: 'line' //表格风格
+ even: true
+ // , page: true //是否显示分页
+ , limits: false
+ , limit: 10 //每页默认显示的数量
+ , done: function (res, curr, count) {
+ that.addTitle();
+ }
- table.on('tool(test)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
- var data = obj.data //获得当前行数据
- ,layEvent = obj.event; //获得 lay-event 对应的值
- if(layEvent === 'detail'){
- // layer.msg('查看操作');
- }
- window.open("https://www.baidu.com");
- console.log(obj)
- });
+ });
- table.render({
- elem: '#test1'
- // , url: './data'
- , height: 474
- , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
- // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
- layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
- //,curr: 5 //设定初始在第 5 页
- , groups: 3 //只显示 1 个连续页码
- , first: false //不显示首页
- , last: false //不显示尾页
- }
- , cols: [[
- { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
- , { field: 'geoName', width: 90, align: 'center', unresize: true, title: '图层名称' }
- , { field: 'databaseName', width: 95, align: 'center', unresize: true, title: '图层属性1' }
- , { field: 'serviceUrl', width: 95, align: 'center', unresize: true, title: '图层属性2' }
- , { fixed: 'right', width: 115, align: 'center', unresize: true, title: '操作', toolbar: '#demoTable1' }
- ]],
- data: data,
- //,skin: 'line' //表格风格
- even: true
- // , page: true //是否显示分页
- , limits: false
- , limit: 10 //每页默认显示的数量
+ table.on('row(test)', function (obj) {
+ that.goOnPosition([obj.data.lon, obj.data.lat], 1, obj.data);
+ });
- });
- table.on('tool(test1)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
- var data = obj.data //获得当前行数据
- ,layEvent = obj.event; //获得 lay-event 对应的值
- if(layEvent === 'detail'){
- // layer.msg('查看操作');
- }
- $('.popup').css({'display': 'block'});
- $('.p-main').eq(0).css({'display': 'block'}).siblings().css({'display': 'none'});
- console.log(obj)
- });
-
- table.render({
- elem: '#test2'
- // , url: './data'
- , height: 474
- , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
- // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
- layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
- //,curr: 5 //设定初始在第 5 页
- , groups: 3 //只显示 1 个连续页码
- , first: false //不显示首页
- , last: false //不显示尾页
- }
- , cols: [[
- { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
- , { field: 'geoName', width: 90, align: 'center', unresize: true, title: '图层名称' }
- , { field: 'databaseName', width: 95, align: 'center', unresize: true, title: '图层属性1' }
- , { field: 'serviceUrl', width: 95, align: 'center', unresize: true, title: '图层属性2' }
- , { fixed: 'right', width: 115, align: 'center', unresize: true, title: '操作', toolbar: '#demoTable2' }
- ]],
- data: data,
- //,skin: 'line' //表格风格
- even: true
- // , page: true //是否显示分页
- , limits: false
- , limit: 10 //每页默认显示的数量
+ table.on('tool(test)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
+ var data = obj.data //获得当前行数据
+ , layEvent = obj.event; //获得 lay-event 对应的值
+ if (layEvent === 'detail') {
+ // layer.msg('查看操作');
+ window.open(obj.data.panAddress);
+ } else if (layEvent === 'edit') {
+ that.goOnPosition([obj.data.lon, obj.data.lat], 1, obj.data);
+ }
+ });
+ }
+ if (data1 != 1) {
- });
- table.on('tool(test2)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
- var data = obj.data //获得当前行数据
- ,layEvent = obj.event; //获得 lay-event 对应的值
- if(layEvent === 'detail'){
- // layer.msg('查看操作');
- }
- $('.popup').css({'display': 'block'});
- $('.p-main').eq(1).css({'display': 'block'}).siblings().css({'display': 'none'});
- console.log(obj)
- });
+ table.render({
+ elem: '#test1'
+ // , url: './data'//监控
+ , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
+ // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ //,curr: 5 //设定初始在第 5 页
+ , groups: 3 //只显示 1 个连续页码
+ , first: false //不显示首页
+ , last: false //不显示尾页
+ }
+ , cols: [[
+ { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
+ , { field: 'name', width: 90, align: 'center', unresize: true, title: '站点' }
+ , { field: 'protectName', width: 95, align: 'center', unresize: true, title: '所属保护区' }
+ , { field: 'remark', width: 95, align: 'center', unresize: true, title: '备注' }
+ , { fixed: 'right', align: 'center', unresize: true, title: '操作', toolbar: '#demoTable1' }
+ ]],
+ data: data1,
+ //,skin: 'line' //表格风格
+ even: true
+ // , page: true //是否显示分页
+ , limits: false
+ , limit: 10 //每页默认显示的数量
+ , done: function (res, curr, count) {
+ that.addTitle();
+ }
+ });
+ table.on('tool(test1)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
+ var data = obj.data //获得当前行数据
+ , layEvent = obj.event; //获得 lay-event 对应的值
+ if (layEvent === 'detail') {
+ var dom = $('.header'),
+ str = `${obj.data.name}--实时视频`;
+ dom.empty();
+ dom.append(str);
+ if (obj.data.flv) {
+ var dom = $('#poput-m-t-video'),
+ str = `
+ <video id="poput-m-t-video-video" ></video>
+ `;
+ dom.empty();
+ dom.append(str);
+ if (flvjs.isSupported()) {
+ var videoElement = document.getElementById('poput-m-t-video-video');
+ var flvPlayer = flvjs.createPlayer({
+ type: 'flv',
+ url: obj.data.flv
+ });
+ flvPlayer.attachMediaElement(videoElement);
+ flvPlayer.load();
+ flvPlayer.play();
+ }
+ window.$myVideoFlvplayer = flvPlayer;
+ // var time = setTimeout(() => {
+
+ // }, 2000);
+ } else {
+ var dom = $('#poput-m-t-video'),
+ str = `
+ <div id="poput-m-t-video-none" >·暂无视频</div>
+ `;
+ dom.empty();
+ dom.append(str);
+ }
+ $('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
+ $('.jimu-widget-searchTabaPopup').find('.p-main').eq(0).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
+ } else if (layEvent === 'edit') {
+ that.goOnPosition([obj.data.lon, obj.data.lat], 2, obj.data);
+ }
+ });
+
+ table.on('row(test1)', function (obj) {
+ that.goOnPosition([obj.data.lon, obj.data.lat], 2, obj.data);
+ });
+ }
+ if (data2 != 1) {
+
+ table.render({
+ elem: '#test2'
+ // , url: './data'//检测
+ , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
+ // layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
+ //,curr: 5 //设定初始在第 5 页
+ , groups: 3 //只显示 1 个连续页码
+ , first: false //不显示首页
+ , last: false //不显示尾页
+ }
+ , cols: [[
+ { field: 'tableId', width: 59, align: 'center', unresize: true, title: '序号' }
+ , { field: 'name', width: 90, align: 'center', unresize: true, title: '站点' }
+ , { field: 'wetlandName_', width: 95, align: 'center', unresize: true, title: '所属保护区' }
+ , { field: 'remark', width: 95, align: 'center', unresize: true, title: '备注' }
+ , { fixed: 'right', align: 'center', unresize: true, title: '操作', toolbar: '#demoTable2' }
+ ]],
+ data: data2,
+ //,skin: 'line' //表格风格
+ even: true
+ // , page: true //是否显示分页
+ , limits: false
+ , limit: 10 //每页默认显示的数量
+ , done: function (res, curr, count) {
+ that.addTitle();
+ }
+
+ });
+
+ table.on('tool(test2)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
+ var data = obj.data //获得当前行数据
+ , layEvent = obj.event; //获得 lay-event 对应的值
+ if (layEvent === 'detail') {
+ // layer.msg('查看操作');
+
+ // 监测、测站详情 表格
+
+
+ that.setXiangqing(obj);//渲染详情
+ that.getshuiwen(obj.data.stcd)//水文实时渲染
+ that.setbiaoti(obj.data)//表格各分部标题渲染
+
+ $('.jimu-widget-searchTabaPopup').css({ 'display': 'block' });
+ $('.jimu-widget-searchTabaPopup').find('.p-main').eq(1).css({ 'display': 'block' }).siblings().css({ 'display': 'none' });
+ } else if (layEvent === 'edit') {
+ that.goOnPosition([obj.data.lon, obj.data.lat], 3, obj.data);
+ }
+ });
+ table.on('row(test2)', function (obj) {
+ that.goOnPosition([obj.data.lon, obj.data.lat], 3, obj.data);
+ });
+ }
+ // that.addTitle();
//…
});
},
+ addTitle: function () {
+ let tdom = $("[data-field]");
+ for (var i = 0; i < tdom.length; i++) {
+ $(tdom[i]).attr("title", $(tdom[i]).text())
+ }
+ },
+ setXiangqing(obj) {
+ var str = '';
+ var XQDom = $('.jimu-widget-searchTabaPopup').find('.xiangqing');
+ XQDom.empty();
+ str += '<table border="1" cellpadding="100">';
+ str += `<tr>
+ <th>测站名称：</th>
+ <td>${obj.data.name}</td>
+ <th>建设类型：</th>
+ <td>建设</td>
+ </tr>
+ <tr>
+ <th>经度：</th>
+ <td>${obj.data.lon}</td>
+ <th>纬度：</th>
+ <td>${obj.data.lat}</td>
+ </tr>
+ <tr>
+ <th>建站时间：</th>
+ <td>${obj.data.accessTime}</td>
+ <th>接入时间：</th>
+ <td>${obj.data.createTime}</td>
+ </tr>
+ <tr>
+ <th>所属保护区：</th>
+ <td>鄱阳湖南矶湿地国家级自然保护区</td>
+ <th>地址：</th>
+ <td>暂无</td>
+ </tr>
+ <tr>
+ <th>全景地址：</th>
+ <td colspan="3">${obj.data.panoramaUrl}/</td>
+ </tr>
+ <tr>
+ <th>测站简介：</th>
+ <td class="left" colspan="3">暂无</td>
+ </tr>
+ <tr>
+ <th>图片：</th>
+ <td class="left" colspan="3" id="popupsimg">
+ <img layer-src="${obj.data.attList[0].uaOriginPath}" src="${obj.data.attList[0].uaOriginPath}" alt="">
+ </td>
+ </tr>`;
+ str += '</table>';
+ XQDom.append(str);
+ // 相册层
+ layui.use(['form', 'layer'], function () {
+
+ //----------模块----------
+ var form = layui.form;
+ var layer = layui.layer;
+ layer.photos({
+ photos: '#popupsimg'
+ , anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
+ });
+ });
+ },
+ getshuiwen: function (stcd) {
+ var that = this;
+ var url = `http://171.34.76.171:8880/pyh-station/monitorData/queryNewestTimeEleDataByStcd?stcd=${stcd}`,
+ token = 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJpc3MiOiJlY2hpc2FuIiwic3ViIjoiYWRtaW4iLCJpYXQiOjE2MjMyNDQxNDQsImV4cCI6MTYyNTgzNjE0NH0.wjtMw7hv8IYGxFKI9b1vo2ozMXD1pE0-02HinfPl-r8l0TYVg1YvMBxW_VzzFKoY1jeC6XByQQT-aC_mAvBnWA';
+ axios.get(url, {
+ headers: {
+ 'token': token
+ }
+ }).then((res) => {
+ if (res.data.code == 200) {
+ var datashuiziyuan = res.data.data.MONITOR_WATER//水资源数据
+ that.setshishidata(datashuiziyuan, stcd);
+ var datakongqi = res.data.data.MONITOR_AIR//空气源数据
+ that.setshishidata(datakongqi, stcd, '#kongqishishi');
+ var dataqixiang = res.data.data.MONITOR_WEATHER//气象源数据
+ that.setshishidata(dataqixiang, stcd, '#qixiangshishi');
+ }
+ })
+ },
+ setshishidata: function (data, stcd, id = '#shuiwenshishi') {
+ //给默认时间
+ var date = new Date();
+ var date1 = new Date(+new Date() + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '');
+ var myDate = date.setDate(date.getDate() - 7);
+ var date2 = new Date(+new Date(myDate) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '');
+ // console.log([date1, date2], 123456789);
+ //设置value
+ $('#test-startDate-1').val(date2);
+ $('#test-endDate-1').val(date1);
+ window.defultEchartsTimes = [date2, date1];
+ // var time = setTimeout(() => {
+ $('.jimu-widget-searchTabaPopup').find('#query').click();
+ // clearTimeout(time);
+ // time = null;
+ // }, 500);
+
+ var str = '',
+ shuiwenDom = $('.jimu-widget-searchTabaPopup').find(id)
+ shuiwenDom.empty();
+ str = `<table class="layui-table">
+ <colgroup>
+ <col width="150">
+ <col width="150">
+ <col width="200">
+ <col>
+ </colgroup>
+ <thead>
+ <tr>
+ <th>名称</th>
+ <th>数值</th>
+ <th>单位</th>
+ </tr>
+ </thead>
+ <tbody>`
+ for (var k in data) {
+ str += `<tr><td>${data[k].name}</td><td>${data[k].value}</td><td>${data[k].unit}</td></tr>`
+ }
+ str += `</tbody></table>
+ <input type="test" id="userMyStcd" style="display:none" value="${stcd}"/>`//占位传stcd 给图表历史查询用
+ shuiwenDom.append(str);
+
+ },
+ setbiaoti: function (data) {
+ var title = $('.jimu-widget-searchTabaPopup').find('.myOUrtitle');
+ title.empty();
+ title.append(data.name);
+ var time = $('.jimu-widget-searchTabaPopup').find('.myOUrtime');
+ time.empty();
+ time.append(data.createTime);
+ },
destroy: function () {
//销毁的时候触发
--
Gitblit v1.9.3