From f3016800deb09b296c93e1d6329aea47ffe27942 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 17 Jun 2021 17:36:15 +0800
Subject: [PATCH] 图层管理相关调整
---
widgets/Layermanagement/Widget.js | 159 ++++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 144 insertions(+), 15 deletions(-)
diff --git a/widgets/Layermanagement/Widget.js b/widgets/Layermanagement/Widget.js
index ea685a3..0838db1 100644
--- a/widgets/Layermanagement/Widget.js
+++ b/widgets/Layermanagement/Widget.js
@@ -15,34 +15,163 @@
'libs/layer/layer.js'
],
function (declare,
- lang,
- array,
- html,
- topic,
- BaseWidget,
- aspect,
- string,
- utils,
- layer
+ lang,
+ array,
+ html,
+ topic,
+ BaseWidget,
+ aspect,
+ string,
+ utils,
+ layer
) {
return declare([BaseWidget], {
baseClass: 'jimu-widget-Layermanagement',
name: 'Layermanagement',
+ dataArr: [],
startup: function () {
var that = this;
// 暴露在外的接口
- topic.subscribe("closeZtree", lang.hitch(this, this.closeZtreeBox));
-
+ topic.subscribe("appendItem", lang.hitch(this, this.appendItem));
+ topic.subscribe("removeItem", lang.hitch(this, this.removeItem));
+
+ $(".jimu-widget-Layermanagement .layer-tab button").click(function () {
+ $(".jimu-widget-Layermanagement .layer-list").stop().toggle();
+ })
+
+ $(".jimu-widget-Layermanagement .sign-head-th-xx").click(function () {
+ $(".jimu-widget-Layermanagement .layer-list").stop().hide();
+ })
+
+ $(".jimu-widget-Layermanagement .layer-list ul").on("click", "li .layer-opacity", function () {
+
+ var layerId = $(this).parents('li').attr('itemid');
+ var layerTitle = $(this).parents('li').attr('itemtitle');
+
+ var liC = `<li>
+ <div title="${layerTitle}">
+ ${layerTitle}
+ </div>
+ <div id="${layerId + 'Layer'}">
+
+ </div>
+ </li>`;
+
+ $(".jimu-widget-Layermanagement .tree-layer-opcity ul").empty();
+
+ $(".jimu-widget-Layermanagement .tree-layer-opcity ul").append(liC)
+
+ $(".jimu-widget-Layermanagement .tree-layer-opcity").stop().show();
+
+ layui.use("slider", function () {
+
+ layui.slider.render({
+ elem: '#' + layerId + 'Layer',
+ min: 0,
+ max: 10,
+ value: that[layerId].alpha * 10,
+ step: 1,
+ theme: '#1E9FFF',
+ setTips: function (value) { //自定义提示文本
+ return value / 10;
+ },
+ change: function (value) {
+ that[layerId].alpha = value / 10
+ }
+ });
+
+ })
+
+ })
+
+ $(".jimu-widget-Layermanagement .layer-list ul").on("click", "li .setup", function () {
+
+ var layerId = $(this).parents('li').attr('itemid');
+
+ that.map.scene.imageryLayers.raise(that[layerId]);
+
+ if ($(this).parents('li').prev().length > 0) {
+ $(this).parents('li').prev().before($(this).parents('li'));
+ }
+
+ })
+
+ $(".jimu-widget-Layermanagement .layer-list ul").on("click", "li .setdown", function () {
+
+ var layerId = $(this).parents('li').attr('itemid');
+
+ that.map.scene.imageryLayers.lower(that[layerId]);
+
+ if ($(this).parents('li').next().length > 0) {
+ $(this).parents('li').next().after($(this).parents('li'));
+ }
+
+ })
+
+ $(".jimu-widget-Layermanagement .tree-layer-opcity .close").click(function () {
+ $(".jimu-widget-Layermanagement .tree-layer-opcity").stop().hide();
+ })
+
},
- closeZtreeBox: function (item) {
- if (item != this.name) {
- $('#ztree_container').stop().hide();
+ appendItem: function (item, obj, layer) {
+ var that = this;
+ if (item == this.name) {
+
+ $(".jimu-widget-Layermanagement .layer-list ul .no-data").stop().hide();
+ var flag = true;
+ var liList = $(".jimu-widget-Layermanagement .layer-list ul li");
+ for (var i = 0; i < liList.length; i++) {
+ if ($(liList[i]).attr('itemid') && $(liList[i]).attr('itemid') == obj.id) {
+ flag = false
+ }
+ }
+
+ if (flag == true) {
+ var liItem = $("<li itemid='" + obj.id + "' itemtitle='" + obj.title + "'> <div>" +
+ "<span title='" + obj.title + "'>" +
+ obj.title +
+ "</span>" +
+ "<button type='button' class='layui-btn layui-btn-normal layui-btn-sm control-btn layer-opacity' title='透明度调整'>" +
+ "<img src='./images/工具（用以切换图层的透明度）.png' alt=''>" +
+ "</button>" +
+ "<button type='button' class='layui-btn layui-btn-normal layui-btn-sm control-btn setup' title='向上移动图层'>" +
+ "<img src='./images/向上移动.png' alt=''>" +
+ "</button>" +
+ "<button type='button' class='layui-btn layui-btn-normal layui-btn-sm control-btn setdown' title='向下移动图层'>" +
+ "<img src='./images/向下移动.png' alt=''>" +
+ "</button>" +
+ "</div> </li>");
+
+ that[obj.id] = layer;
+
+ $(".jimu-widget-Layermanagement .layer-list ul").prepend(liItem);
+ }
+
+
+
+ }
+ },
+
+ removeItem: function (item, obj) {
+ if (item == this.name) {
+ var liList = $(".jimu-widget-Layermanagement .layer-list ul li");
+ for (var i = 0; i < liList.length; i++) {
+ if ($(liList[i]).attr('itemid') && $(liList[i]).attr('itemid') == obj.id) {
+ $(liList[i]).remove();
+ }
+ }
+
+ if ($(".jimu-widget-Layermanagement .layer-list ul li").length == 1) {
+ $(".jimu-widget-Layermanagement .layer-list ul .no-data").stop().show();
+ $(".jimu-widget-Layermanagement .tree-layer-opcity").stop().hide();
+ }
+
}
},
onOpen: function () {
-
+
},
onClose: function () {
--
Gitblit v1.9.3