From ebefa651ad2d6edbfdb30fea3fc1ff97232a0aee Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Tue, 15 Jun 2021 11:07:52 +0800
Subject: [PATCH] 工具样式
---
widgets/LeftNavigationBar/Widget.js | 488 ++++++++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 433 insertions(+), 55 deletions(-)
diff --git a/widgets/LeftNavigationBar/Widget.js b/widgets/LeftNavigationBar/Widget.js
index 84bbfc5..750c7b9 100644
--- a/widgets/LeftNavigationBar/Widget.js
+++ b/widgets/LeftNavigationBar/Widget.js
@@ -27,6 +27,7 @@
baseClass: 'jimu-widget-LeftNavigationBar',
name: 'LeftNavigationBar',
layers: {},
+ dataAllArray: [],
startup: function () {
// 暴露在外的接口
// this.begin(this.data);
@@ -58,12 +59,57 @@
$('.jimu-widget-instructions').css({
'left': '260px'
});
+
$('#left-navigation-bar-main-search').click(() => { //搜索事件
+ leftSearchItemLayer()
+ })
+
+ $(".jimu-widget-LeftNavigationBar input[type='search']").bind('input propertychange', function () {
+ //做一些事情
+ var val = $(this).val();
+
+ if (val == '') {
+ that.changeData(that.dataAllArray, val); //重写数据
+ layui.use('tree', function () {
+ layui.tree.reload('demoId1', {
+ data: that.data
+ });
+
+ var jqDom = $("#left-tree-list > .layui-tree > div");
+
+ for (var i = 0; i < jqDom.length; i++) {
+ if ($(jqDom[i]).text().indexOf("三维倾斜数据") != -1) {
+ $(jqDom[i]).find('.layui-btn-group').remove()
+ }
+
+ var textList = $(jqDom[i]).find('.layui-tree-txt');
+
+ for (var j = 0; j < textList.length; j++) {
+ $(textList[j]).attr('title', $(textList[j]).text())
+
+ }
+
+ }
+ })
+ }
+
+ })
+
+ $(".jimu-widget-LeftNavigationBar input[type='search']").keyup(function (e) {
+ if (e.keyCode == 13) {
+ leftSearchItemLayer()
+ }
+ })
+
+ $(".jimu-widget-LeftNavigationBar .tree-layer-opcity .close").click(function () {
+ $(".jimu-widget-LeftNavigationBar .tree-layer-opcity").stop().hide();
+ })
+
+ function leftSearchItemLayer() {
var val = $('#left-navigation-bar-main-input').val();
- if (val) {
+ if (val != '') {
var clearOur = () => {
let dom = $(`[data-id]`);
- // console.log(dom);
dom.removeClass('layui-tree-spread');
let domDiv = dom.find('.layui-tree-pack');
domDiv.css({
@@ -80,7 +126,6 @@
// var b = a.split('');
// for (var i in b) {
let id = that.father; //选中项的所有父级id
- // // console.log(id)
let dom = $(`[data-id='${id}']`);
dom.addClass('layui-tree-spread');
let domDiv = dom.find('.layui-tree-pack').eq(0);
@@ -88,25 +133,46 @@
'display': 'block'
})
// }
- console.log(a, that.father)
}
if (d[k].children) {
useit(d[k].children);
}
}
};
- clearOur();
- useit(that.data);
- } else {
+ that.changeData(that.dataAllArray, val); //重写数据
+ layui.use('tree', function () {
+ layui.tree.reload('demoId1', {
+ data: that.data
+ });
+ var jqDom = $("#left-tree-list > .layui-tree > div");
+
+ for (var i = 0; i < jqDom.length; i++) {
+ if ($(jqDom[i]).text().indexOf("三维倾斜数据") != -1) {
+ $(jqDom[i]).find('.layui-btn-group').remove()
+ }
+
+ var textList = $(jqDom[i]).find('.layui-tree-txt');
+
+ for (var j = 0; j < textList.length; j++) {
+ $(textList[j]).attr('title', $(textList[j]).text())
+
+ }
+
+ }
+
+ clearOur();
+ useit(that.data);
+ })
}
- })
+ }
},
closeToolBox: function (item) {},
onOpen: function () {
//面板打开的时候触发 （when open this panel trigger）
+
},
onClose: function () {
@@ -125,6 +191,7 @@
},
getData: function () {
+ var that = this;
var url = 'http://171.34.76.171:8880/pyh-wetResource/GeoData/queryGeoDataTree',
that = this;
@@ -134,17 +201,21 @@
}
}).then((res) => {
if (res.data.code == '200') {
- console.log(res, 'open', 898998)
- that.changeData(res.data.data); //重写数据
+ that.dataAllArray = res.data.data;
+ that.changeData(res.data.data, ''); //重写数据
+ that.begin(this.data);
}
})
},
- changeData: function (val) { //重写数据
+ changeData: function (val, type) { //重写数据
+ var that = this;
var data = [],
i = 1,
inits = (d, childData) => {
var b = childData || [];
for (var k in d) {
+
+
let a = {
title: d[k].name,
@@ -154,8 +225,35 @@
field: String(i),
src: d[k].serviceUrl,
id: d[k].id,
- serviceName: d[k].serviceName
+ serviceName: d[k].serviceName,
+ alpha: 1,
+ checked: d[k].menuStatus
}
+
+ if (d[k].serviceUrl.indexOf('.openrealspace') != -1) {
+ a.model = true
+ }
+
+ if (d[k].name == '三维倾斜数据') {
+ a.model = true
+ }
+
+ if (a.model) {
+
+ if (that[a.id]) {
+ Cesium.when(that[a.id], function (layer) {
+ that.map.scene.layers.remove(layer[0].name)
+ })
+ }
+
+ } else {
+
+ if (that[a.id]) {
+ that.map.imageryLayers.remove(that[a.id]);
+ }
+
+ }
+
b.push(a);
i++;
if (d[k].children.length != 0) {
@@ -167,7 +265,6 @@
};
inits(val, data);
- // console.log(data)
// var i = 0,
// ccinit = (a) => {
@@ -175,15 +272,85 @@
// for (let k in a) {
// if (a[k].children) {
// a[k].who = i;
- // // console.log(a[k].id)
// ccinit(a[k].children)
// }
// }
// };
// ccinit(this.data);
- // console.log(this.data)
+
+ if (type != '') {
+
+ for (var i = 0; i < data.length; i++) {
+
+ if (data[i].children && data[i].children.length > 0) {
+
+ deWeight()
+
+ function deWeight() {
+ for (var j = 0; j < data[i].children.length; j++) {
+ if (data[i].children[j].title.indexOf(type) == -1) {
+ data[i].children.splice(j, 1);
+ deWeight();
+ break;
+
+ }
+ }
+ }
+
+ }
+
+
+
+
+
+ }
+ deParentWeight()
+
+ function deParentWeight() {
+ for (var i = 0; i < data.length; i++) {
+
+ if (data[i].children && data[i].children.length == 0) {
+ data.splice(i, 1)
+ deParentWeight();
+ break;
+ }
+
+ if (data[i].children == undefined && data[i].title.indexOf(type) == -1) {
+ data.splice(i, 1)
+ deParentWeight();
+ break;
+
+ }
+
+ }
+ }
+
+ }
+
+ var keyId = this.getUrlKeyId("serviceName");
+
+ if (keyId && keyId != "") {
+ for (var i = 0; i < data.length; i++) {
+
+ if (data[i].title == keyId) {
+ data[i].checked = true
+ }
+
+ for (var j = 0; j < data[i].children.length; j++) {
+
+ if (data[i].children[j].title == keyId) {
+ data[i].children[j].checked = true
+ }
+
+ }
+ }
+ }
+
+
+
this.data = data;
- this.begin(this.data);
+
+
},
begin: function (data) {
var that = this;
@@ -195,17 +362,18 @@
layer = layui.layer,
util = layui.util,
$ = layui.$;
+ var slider = layui.slider;
+
tree.render({
- elem: '#test1' //默认是点击节点可进行收缩
+ elem: '#left-tree-list' //默认是点击节点可进行收缩
,
data: data,
id: 'demoId1',
- showCheckbox: true //是否显示复选框
- ,
+ showCheckbox: true, //是否显示复选框
+ customOperate: true,
click: function (obj) {
var data = obj.data; //获取当前点击的节点数据
// layer.msg('状态：' + obj.state + '<br>节点数据：' + JSON.stringify(data));
- console.log(obj);
// 树点击三角形样式修改
// var ot = $('.layui-tree-iconArrow');
// ot.removeClass("left-navigation-bar-main-down");
@@ -217,10 +385,9 @@
// var jh = $(`[data-id='${data.id}']`).find('.layui-tree-entry').eq(0);
// jh.addClass('left-navigation-bar-main-current');
},
- showLine: false //是否开启连接线
- ,
+ showLine: false, //是否开启连接线
oncheck: function (obj) {
- console.log(obj.data.id, '--', obj.checked, obj); //得到当前点击的节点数据
+ // console.log(obj.data.id, '--', obj.checked, obj); //得到当前点击的节点数据
// console.log(obj.checked); //得到当前节点的展开状态：open、close、normal
// console.log(obj.elem); //得到当前节点元素
@@ -233,30 +400,78 @@
if (obj.checked == true) {
- obj.data.children.forEach(item => {
- $.ajax({
- url: item.src + '/maps.json',
- type: 'get',
- dataType: 'JSON',
- success: function (res) {
-
- that[item.id] = that.map.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
- url: res[0].path,
- }));
-
- }
- })
- });
+ if (obj.data.model) {
+ obj.data.children.forEach(item => {
+ var host = that.returnStr(item.src).host;
+ var scene = that.map.scene;
+ var partOfUrl = that.returnStr(item.src).partOfUrl;
+ //添加S3M图层服务
+ that[item.id] = scene.open(host + partOfUrl);
+ //定位到场景
+ Cesium.loadJson(host + partOfUrl + '/scenes.json').then(function (scenes) {
+ // var sname = scenes[0].name;
+ // Cesium.loadJson(host + partOfUrl + '/scenes/' + sname + '.json').then(function (jsonData) {
+ // var cameraPosition = jsonData.camera;
+ // var tilt = Cesium.Math.toRadians(cameraPosition.tilt - 90);
+ // Cesium.when(promise, function (layer) {
+ // //设置相机位置、视角，便于观察场景
+ // scene.camera.setView({
+ // destination: new Cesium.Cartesian3.fromDegrees(cameraPosition.longitude, cameraPosition.latitude, cameraPosition.altitude),
+ // orientation: {
+ // heading: cameraPosition.heading,
+ // pitch: tilt,
+ // roll: 0
+ // }
+ // });
+ // if (!scene.pickPositionSupported) {
+ // alert('不支持深度纹理,无法拾取位置！');
+ // }
+ // }, function (e) {
+ // if (widget._showRenderLoopErrors) {
+ // var title = '加载SCP失败，请检查网络连接状态或者url地址是否正确？';
+ // widget.showErrorPanel(title, undefined, e);
+ // }
+ // });
+ // });
+ });
+ });
+ } else {
+ obj.data.children.forEach(item => {
+ $.ajax({
+ url: item.src + '/maps.json',
+ type: 'get',
+ dataType: 'JSON',
+ success: function (res) {
-
+ that[item.id] = that.map.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
+ url: res[0].path,
+ }));
+ that[item.id].alpha = item.alpha
+ }
+ })
+ });
+
+ }
+
+
+
+
} else {
- obj.data.children.forEach(item => {
- if (that[item.id]) that.map.imageryLayers.remove(that[item.id]);
- });
+ if (obj.data.model) {
+ obj.data.children.forEach(item => {
+ Cesium.when(that[item.id], function (layer) {
+ that.map.scene.layers.remove(layer[0].name)
+ })
+ });
+ } else {
+ obj.data.children.forEach(item => {
+ if (that[item.id]) that.map.imageryLayers.remove(that[item.id]);
+ });
-
+ }
+
}
@@ -267,33 +482,183 @@
if (obj.checked == true) {
- $.ajax({
- url: obj.data.src + '/maps.json',
- type: 'get',
- dataType: 'JSON',
- success: function (res) {
- console.log(res, 123)
+ if (obj.data.model) {
+ that.map.scene.globe.depthTestAgainstTerrain = false;
+ var host = that.returnStr(obj.data.src).host;
+ var scene = that.map.scene;
+ var partOfUrl = that.returnStr(obj.data.src).partOfUrl;
+ //添加S3M图层服务
+ that[obj.data.id] = scene.open(host + partOfUrl);
+ //定位到场景
- that[obj.data.id] = that.map.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
- url: res[0].path,
- }));
+ Cesium.loadJson(host + partOfUrl + '/scenes.json').then(function (scenes) {
+ // var sname = scenes[0].name;
+ // Cesium.loadJson(host + partOfUrl + '/scenes/' + sname + '.json').then(function (jsonData) {
+ // var cameraPosition = jsonData.camera;
+ // var tilt = Cesium.Math.toRadians(cameraPosition.tilt - 90);
+ // Cesium.when(promise, function (layer) {
+ // //设置相机位置、视角，便于观察场景
+ // scene.camera.setView({
+ // destination: new Cesium.Cartesian3.fromDegrees(cameraPosition.longitude, cameraPosition.latitude, cameraPosition.altitude),
+ // orientation: {
+ // heading: cameraPosition.heading,
+ // pitch: tilt,
+ // roll: 0
+ // }
+ // });
+ // if (!scene.pickPositionSupported) {
+ // alert('不支持深度纹理,无法拾取位置！');
+ // }
+ // }, function (e) {
+ // if (widget._showRenderLoopErrors) {
+ // var title = '加载SCP失败，请检查网络连接状态或者url地址是否正确？';
+ // widget.showErrorPanel(title, undefined, e);
+ // }
+ // });
+ // });
+ });
- }
- })
+ } else {
+ $.ajax({
+ url: obj.data.src + '/maps.json',
+ type: 'get',
+ dataType: 'JSON',
+ success: function (res) {
+
+ that[obj.data.id] = that.map.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
+ url: res[0].path,
+ }));
+ that[obj.data.id].alpha = obj.data.alpha
+ }
+ })
+
+ }
} else {
+ if (obj.data.model) {
+ Cesium.when(that[obj.data.id], function (layer) {
+ that.map.scene.layers.remove(layer[0].name)
+ })
- that.map.imageryLayers.remove(that[obj.data.id]);
+ } else {
+ that.map.imageryLayers.remove(that[obj.data.id]);
+
+ }
+
+
+
+ }
+
+
+ }
+ },
+ edit: ['add'],
+ operate: function (obj) {
+ var type = obj.type; //得到操作类型: add、edit、 del
+ var data = obj.data; //得到当前节点的数据
+ var elem = obj.elem; //得到当前节点元素var deptId = data.id;//得到节点索引var parentId = data.parentId;l/父节点
+ var depId = data.id;
+ var parentId = data.parentId;
+ if (type == 'add') {
+
+ $(".jimu-widget-LeftNavigationBar .tree-layer-opcity ul").empty();
+
+ // console.log(type, data, elem, depId, parentId)
+
+ if (data.children) {
+
+ data.children.forEach(item => {
+ var liC = `<li>
+ <div title="${item.title}">
+ ${item.title}
+ </div>
+ <div id="${item.id + 'Layer'}">
+
+ </div>
+ </li>`;
+
+ $(".jimu-widget-LeftNavigationBar .tree-layer-opcity ul").append(liC)
+
+ $(".jimu-widget-LeftNavigationBar .tree-layer-opcity").stop().show();
+ slider.render({
+ elem: '#' + item.id + 'Layer',
+ min: 0,
+ max: 10,
+ value: item.alpha * 10,
+ step: 1,
+ theme: '#1E9FFF',
+ setTips: function (value) { //自定义提示文本
+ return value / 10;
+ },
+ change: function (value) {
+ item.alpha = value / 10
+ if (that[item.id]) {
+ that[item.id].alpha = item.alpha
+ }
+ }
+ });
+ })
+
+ } else {
+ var liC = `<li>
+ <div title="${data.title}">
+ ${data.title}
+ </div>
+ <div id="${data.id + 'Layer'}">
+
+ </div>
+ </li>`;
+
+ $(".jimu-widget-LeftNavigationBar .tree-layer-opcity ul").append(liC)
+
+ $(".jimu-widget-LeftNavigationBar .tree-layer-opcity").stop().show();
+ slider.render({
+ elem: '#' + data.id + 'Layer',
+ min: 0,
+ max: 10,
+ value: data.alpha * 10,
+ step: 1,
+ theme: '#1E9FFF',
+ setTips: function (value) { //自定义提示文本
+ return value / 10;
+ },
+ change: function (value) {
+ data.alpha = value / 10
+ if (that[data.id]) {
+ that[data.id].alpha = data.alpha
+ }
+ }
+ });
+
}
}
}
+
});
+
+ var jqDom = $("#left-tree-list > .layui-tree > div");
+
+ for (var i = 0; i < jqDom.length; i++) {
+ if ($(jqDom[i]).text().indexOf("三维倾斜数据") != -1) {
+ $(jqDom[i]).find('.layui-btn-group').remove()
+ }
+
+ var textList = $(jqDom[i]).find('.layui-tree-txt');
+
+ for (var j = 0; j < textList.length; j++) {
+ $(textList[j]).attr('title', $(textList[j]).text())
+
+ }
+
+ }
+
+
//按钮事件
util.event('lay-demo', {
@@ -303,7 +668,6 @@
layer.alert(JSON.stringify(checkedData), {
shade: 0
});
- console.log(checkedData);
},
setChecked: function () {
tree.setChecked('demoId1', [12, 114]); //勾选指定节点
@@ -317,6 +681,14 @@
}
});
})
+ },
+ returnStr: function (url) {
+ var startIndex = url.indexOf("/iserver");
+ var endIndex = url.indexOf("/scenes");
+ return {
+ host: url.substring(0, startIndex),
+ partOfUrl: url.substring(startIndex, endIndex)
+ }
},
changeImg: true,
father: [],
@@ -609,6 +981,12 @@
}]
}],
}],
+ getUrlKeyId: function (name) {
+ var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
+ var r = window.location.search.substr(1).match(reg);
+ if (r != null) return decodeURI(r[2]);
+ return null;
+ },
destroy: function () {
//销毁的时候触发
//todo
--
Gitblit v1.9.3