| | |
| | | <template> |
| | | <div class="lalala tree-container"> |
| | | <el-input placeholder="输入关键字进行过滤" |
| | | v-model="filterText" |
| | | class="search"> |
| | | <el-input |
| | | placeholder="输入关键字进行过滤" |
| | | v-model="filterText" |
| | | class="search" |
| | | > |
| | | </el-input> |
| | | <el-tree :data="treeData" |
| | | node-key="id" |
| | | default-expand-all |
| | | show-checkbox |
| | | @node-click="handleLeftclick" |
| | | @node-contextmenu="rightClick" |
| | | @check-change="handleCheckChange" |
| | | :default-checked-keys="handleTreeCheck" |
| | | ref="tree"> |
| | | <span class="slot-t-node" |
| | | slot-scope="{ node, data }" |
| | | @dblclick="editNode(data)"> |
| | | <el-tree |
| | | ref="tree" |
| | | :data="treeData" |
| | | node-key="id" |
| | | default-expand-all |
| | | show-checkbox |
| | | @node-click="handleLeftclick" |
| | | @node-contextmenu="rightClick" |
| | | @check-change="handleCheckChange" |
| | | :default-checked-keys="handleTreeCheck" |
| | | > |
| | | <span |
| | | class="slot-t-node" |
| | | slot-scope="{ node, data }" |
| | | @dblclick="editNode(data)" |
| | | > |
| | | <span v-show="!data.isEdit"> |
| | | <span :class="[data.id >= 99 ? 'slot-t-node--label' : '']">{{ |
| | | node.label |
| | | }}</span> |
| | | </span> |
| | | <span v-show="data.isEdit"> |
| | | <el-input class="slot-t-input" |
| | | size="mini" |
| | | autofocus |
| | | v-model="data.label" |
| | | :ref="'slotTreeInput' + data.id" |
| | | @blur.stop="NodeBlur(node, data)" |
| | | @keydown.native.enter="NodeBlur(node, data)"></el-input> |
| | | <el-input |
| | | class="slot-t-input" |
| | | size="mini" |
| | | autofocus |
| | | v-model="data.label" |
| | | :ref="'slotTreeInput' + data.id" |
| | | @blur.stop="NodeBlur(node, data)" |
| | | @keydown.native.enter="NodeBlur(node, data)" |
| | | ></el-input> |
| | | </span> |
| | | </span> |
| | | |
| | | </el-tree> |
| | | |
| | | <el-card class="box-card" |
| | | ref="card" |
| | | :style="{ ...rightClickMenuStyle }" |
| | | v-show="menuVisible"> |
| | | <div @click="addSameLevelNode()"> |
| | | <i class="el-icon-circle-plus-outline"></i> 添加图层组 |
| | | <el-card |
| | | class="box-card" |
| | | ref="card" |
| | | :style="{ ...rightClickMenuStyle }" |
| | | v-show="menuVisible" |
| | | > |
| | | <div @click="addSameLevelNode()" v-show="firstLevel"> |
| | | <i class="el-icon-plus"></i> 添加图层组 |
| | | </div> |
| | | <div class="add" |
| | | @click="addChildNode()" |
| | | v-show="firstLevel"> |
| | | <i class="el-icon-circle-plus-outline"></i> 添加图层 |
| | | <div class="add" @click="addChildNode()"> |
| | | <i class="el-icon-plus"></i> 添加图层 |
| | | </div> |
| | | <div class="delete" |
| | | @click="deleteNode()"> |
| | | <i class="el-icon-remove-outline"></i> 删除节点 |
| | | <div class="delete" @click="deleteNode()"> |
| | | <i class="el-icon-delete"></i> 删除 |
| | | </div> |
| | | <div class="edit" |
| | | @click="editNode()"> |
| | | <i class="el-icon-edit"></i> 修改节点 |
| | | <div class="edit" @click="editNode()"> |
| | | <i class="el-icon-edit"></i> 重命名 |
| | | </div> |
| | | <div class="edit" |
| | | @click="showLayerAttribute()"> |
| | | <i class="el-icon-edit"></i> 属性 |
| | | <div class="edit" @click="showLayerAttribute()"> |
| | | <i class="el-icon-tickets"></i> 属性 |
| | | </div> |
| | | <!-- <div |
| | | class="edit" |
| | |
| | | <i class="el-icon-bottom"></i> 下移 |
| | | </div> --> |
| | | </el-card> |
| | | <el-dialog :title="appendNodetitle" |
| | | :visible.sync="dialogVisible" |
| | | width="30%" |
| | | top="20vh" |
| | | :modal="false" |
| | | :before-close="handleClose"> |
| | | <el-form ref="form" |
| | | :model="addFormServer" |
| | | label-width="100px"> |
| | | <el-dialog |
| | | :title="appendNodetitle" |
| | | :visible.sync="dialogVisible" |
| | | width="30%" |
| | | top="20vh" |
| | | :modal="false" |
| | | :before-close="handleClose" |
| | | > |
| | | <el-form ref="form" :model="addFormServer" label-width="100px"> |
| | | <el-form-item label="服务类型"> |
| | | <!-- <el-input v-model="addFormServer.type"></el-input> --> |
| | | <el-select style="width:100%" |
| | | :popper-append-to-body="false" |
| | | v-model="addFormServer.layerType" |
| | | placeholder="请选择"> |
| | | <el-option v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value"> |
| | | <el-select |
| | | style="width: 100%" |
| | | :popper-append-to-body="false" |
| | | v-model="addFormServer.layerType" |
| | | placeholder="请选择" |
| | | > |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | > |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | |
| | | <el-slider v-model="addFormServer.opacity"></el-slider> |
| | | </el-form-item> |
| | | </el-form> |
| | | <span slot="footer" |
| | | class="dialog-footer"> |
| | | <el-button type="primary" |
| | | @click="setAddServer">确 定</el-button> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" @click="setAddServer">确 定</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | <queryinfo ref="queryinfo" /> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { image_layer } from '../../assets/js/index.js'; |
| | | import ImageWMS from 'ol/source/ImageWMS'; |
| | | import Image from 'ol/layer/Image'; |
| | | import GeoJSON from 'ol/format/GeoJSON.js'; |
| | | import Map from 'ol/Map.js'; |
| | | import queryinfo from './queryinfo.vue'; |
| | | import { image_layer } from "../../assets/js/index.js"; |
| | | import ImageWMS from "ol/source/ImageWMS"; |
| | | import Image from "ol/layer/Image"; |
| | | import GeoJSON from "ol/format/GeoJSON.js"; |
| | | import Map from "ol/Map.js"; |
| | | import queryinfo from "./queryinfo.vue"; |
| | | import { Vector as VectorSource } from "ol/source"; |
| | | import { Vector as VectorLayer, } from "ol/layer"; |
| | | import { Vector as VectorLayer } from "ol/layer"; |
| | | |
| | | import View from 'ol/View.js'; |
| | | import { Fill, Stroke, Style } from 'ol/style.js'; |
| | | import { perms_selectLayers } from '../../api/api.js' |
| | | import View from "ol/View.js"; |
| | | import { Fill, Stroke, Style } from "ol/style.js"; |
| | | import { perms_selectLayers } from "../../api/api.js"; |
| | | export default { |
| | | name: 'tree', |
| | | name: "tree", |
| | | components: { queryinfo }, |
| | | data () { |
| | | data() { |
| | | return { |
| | | eleId: '', |
| | | eleId: "", |
| | | isShow: false, |
| | | currentData: '', |
| | | currentNode: '', |
| | | currentData: "", |
| | | currentNode: "", |
| | | menuVisible: false, |
| | | firstLevel: false, |
| | | filterText: '', |
| | | appendNodetitle: '', |
| | | filterText: "", |
| | | appendNodetitle: "", |
| | | maxexpandId: 4, |
| | | rightClickMenuStyle: {}, |
| | | handleTreeCheck: [], |
| | | dialogVisible: false, |
| | | addFormServer: { |
| | | opacity: 100, |
| | | layerType: 'WMS', |
| | | layerType: "WMS", |
| | | type: 2, |
| | | }, |
| | | layerId: [ |
| | | 'm_pipeline', |
| | | 'th_strategic_channel', |
| | | 'bs_project', |
| | | 'm_sitepoint', |
| | | "m_pipeline", |
| | | "th_strategic_channel", |
| | | "bs_project", |
| | | "m_sitepoint", |
| | | ], |
| | | treeData: [ |
| | | |
| | | ], |
| | | treeData: [], |
| | | defaultProps: { |
| | | children: 'children', |
| | | label: 'label', |
| | | |
| | | children: "children", |
| | | label: "label", |
| | | }, |
| | | options: [{ |
| | | value: 'WMS', |
| | | label: 'WMS' |
| | | }, { |
| | | value: 'WFS', |
| | | label: 'WFS' |
| | | }], |
| | | options: [ |
| | | { |
| | | value: "WMS", |
| | | label: "WMS", |
| | | }, |
| | | { |
| | | value: "WFS", |
| | | label: "WFS", |
| | | }, |
| | | ], |
| | | }; |
| | | }, |
| | | methods: { |
| | | NodeBlur (Node, data) { |
| | | NodeBlur(Node, data) { |
| | | if (data.label.length === 0) { |
| | | this.$message.error('菜单名不可为空!'); |
| | | this.$message.error("菜单名不可为空!"); |
| | | return false; |
| | | } else { |
| | | if (data.isEdit) { |
| | | this.$set(data, 'isEdit', false); |
| | | this.$set(data, "isEdit", false); |
| | | } |
| | | this.$nextTick(() => { |
| | | this.$refs['slotTreeInput' + data.id].$refs.input.focus(); |
| | | this.$refs["slotTreeInput" + data.id].$refs.input.focus(); |
| | | }); |
| | | } |
| | | }, |
| | | // 查询 |
| | | filterNode (value, data) { |
| | | filterNode(value, data) { |
| | | if (!value) return true; |
| | | return data.label.indexOf(value) !== -1; |
| | | }, |
| | | |
| | | allowDrop (draggingNode, dropNode, type) { |
| | | if (dropNode.data.label === '二级 3-1') { |
| | | return type !== 'inner'; |
| | | allowDrop(draggingNode, dropNode, type) { |
| | | if (dropNode.data.label === "二级 3-1") { |
| | | return type !== "inner"; |
| | | } else { |
| | | return true; |
| | | } |
| | | }, |
| | | allowDrag (draggingNode) { |
| | | return draggingNode.data.label.indexOf('三级 3-2-2') === -1; |
| | | allowDrag(draggingNode) { |
| | | return draggingNode.data.label.indexOf("三级 3-2-2") === -1; |
| | | }, |
| | | // 鼠标右击事件 |
| | | rightClick (event, object, Node, element) { |
| | | |
| | | rightClick(event, object, Node, element) { |
| | | this.currentData = object; |
| | | this.currentNode = Node; |
| | | if (Node.level === 1) { |
| | |
| | | } |
| | | this.menuVisible = true; |
| | | |
| | | this.$refs.card.$el.style.left = event.pageX + 20 + 'px'; |
| | | this.$refs.card.$el.style.top = event.pageY + 'px'; |
| | | this.$refs.card.$el.style.left = event.pageX + 20 + "px"; |
| | | this.$refs.card.$el.style.top = event.pageY + "px"; |
| | | }, |
| | | // 鼠标左击事件 |
| | | handleLeftclick (data, node) { |
| | | handleLeftclick(data, node) { |
| | | this.foo(); |
| | | if (node.checked == true) { |
| | | for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) { |
| | |
| | | } |
| | | }, |
| | | // 取消鼠标监听事件 菜单栏 |
| | | foo () { |
| | | foo() { |
| | | this.menuVisible = false; |
| | | // 要及时关掉监听,不关掉的是一个坑,不信你试试,虽然前台显示的时候没有啥毛病,加一个alert你就知道了 |
| | | document.removeEventListener('click', this.foo); |
| | | document.removeEventListener("click", this.foo); |
| | | }, |
| | | // 增加同级节点事件 |
| | | addSameLevelNode () { |
| | | |
| | | addSameLevelNode() { |
| | | this.foo(); |
| | | if (this.currentNode.level == 2) { |
| | | this.appendNodetitle = this.currentData.label; |
| | | this.dialogVisible = true; |
| | | } else { |
| | | let id = Math.ceil(Math.random() * 100); |
| | | var data = { id: id, label: '新增节点' }; |
| | | var data = { id: id, label: "新增节点" }; |
| | | this.$refs.tree.append(data, this.currentNode.parent); |
| | | } |
| | | }, |
| | | // 增加子级节点事件 |
| | | addChildNode () { |
| | | addChildNode() { |
| | | this.foo(); |
| | | if (this.currentNode.level >= 2) { |
| | | this.$message.error('最多只支两级!'); |
| | | return false; |
| | | } |
| | | // if (this.currentNode.level >= 2) { |
| | | // this.$message.error("最多只支两级!"); |
| | | // return false; |
| | | // } |
| | | this.appendNodetitle = this.currentData.label; |
| | | this.dialogVisible = true; |
| | | }, |
| | | handleClose () { |
| | | handleClose() { |
| | | this.dialogVisible = false; |
| | | this.addFormServer = { |
| | | opacity: 100, |
| | | layerType: 'WMS', |
| | | layerType: "WMS", |
| | | type: 2, |
| | | }; |
| | | }, |
| | | setAddServer () { |
| | | setAddServer() { |
| | | var val = this.currentNode; |
| | | if (this.currentNode.level == 2) { |
| | | val = this.currentNode.parent; |
| | |
| | | this.handleClose(); |
| | | }, |
| | | // 删除节点 |
| | | deleteNode () { |
| | | |
| | | deleteNode() { |
| | | this.foo(); |
| | | var label = this.currentNode.data.label; |
| | | if (this.currentNode.data.layerType == 'WMS') { |
| | | if (this.currentNode.data.layerType == "WMS") { |
| | | for (var i in window.Viewer.imageryLayers_layers) { |
| | | if (window.Viewer.imageryLayers_layers[i].name === label) { |
| | | window.Viewer.imageryLayers.remove(window.Viewer.imageryLayers_layers[i]) |
| | | window.Viewer.imageryLayers.remove( |
| | | window.Viewer.imageryLayers_layers[i] |
| | | ); |
| | | } |
| | | } |
| | | |
| | | } else if (this.currentNode.data.layerType == 'WFS') { |
| | | } else if (this.currentNode.data.layerType == "WFS") { |
| | | for (var i in window.Viewer.dataSources._dataSources) { |
| | | if (window.Viewer.dataSources._dataSources[i].name == label) { |
| | | window.Viewer.dataSources.remove(window.Viewer.dataSources._dataSources[i]); |
| | | std.push(data.label) |
| | | window.Viewer.dataSources.remove( |
| | | window.Viewer.dataSources._dataSources[i] |
| | | ); |
| | | std.push(data.label); |
| | | } |
| | | } |
| | | } |
| | |
| | | this.$refs.tree.remove(this.currentNode); |
| | | }, |
| | | //属性显示 |
| | | showLayerAttribute (data) { |
| | | showLayerAttribute(data) { |
| | | this.foo(); |
| | | this.currentData = data ? data : this.currentData; |
| | | var layer = this.currentData.layer.replaceAll('_', ""); |
| | | var layer = this.currentData.layer.replaceAll("_", ""); |
| | | this.$store.state.mapSpaceQueryLayer = layer; |
| | | // this.$store.state.mapPopBoolean = true; |
| | | this.$store.state.mapPopBoxFlag = '2'; |
| | | this.$store.state.mapPopBoxFlag = "2"; |
| | | this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close(); |
| | | this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.open("属性", null, { |
| | | close: () => { |
| | | this.$refs && |
| | | this.$refs.queryinfo && |
| | | this.$refs.queryinfo.open("属性", null, { |
| | | close: () => { |
| | | if (this.$store.state.primitLayer != null) { |
| | | sgworld.Creator.DeleteObject(this.$store.state.primitLayer); |
| | | this.$store.state.primitLayer = null; |
| | | } |
| | | |
| | | if (this.$store.state.primitLayer != null) { |
| | | sgworld.Creator.DeleteObject(this.$store.state.primitLayer); |
| | | this.$store.state.primitLayer = null; |
| | | } |
| | | |
| | | if (window.Viewer.scene.primitives.length != 0) { |
| | | window.Viewer.scene.primitives.removeAll() |
| | | } |
| | | } |
| | | }); |
| | | if (window.Viewer.scene.primitives.length != 0) { |
| | | window.Viewer.scene.primitives.removeAll(); |
| | | } |
| | | }, |
| | | }); |
| | | }, |
| | | // 编辑节点 |
| | | editNode (data) { |
| | | |
| | | editNode(data) { |
| | | this.foo(); |
| | | this.currentData = data ? data : this.currentData; |
| | | if (!this.currentData.isEdit) { |
| | | this.$set(this.currentData, 'isEdit', true); |
| | | this.$set(this.currentData, "isEdit", true); |
| | | } |
| | | // 获取焦点 |
| | | this.$nextTick(() => { |
| | | this.$refs['slotTreeInput' + this.currentData.id].focus(); |
| | | this.$refs["slotTreeInput" + this.currentData.id].focus(); |
| | | }); |
| | | }, |
| | | |
| | | |
| | | |
| | | menuMoveF (type) { |
| | | menuMoveF(type) { |
| | | // 将变动之前的node备份 |
| | | var node = this.currentNode; |
| | | var data = this.currentData; |
| | | let copyNode = this.currentNode |
| | | let copyNode = this.currentNode; |
| | | |
| | | // copyNode.previousSibling = {...node. } |
| | | // copyNode.nextSibling = {...node.nextSibling} |
| | | // window.sessionStorage.setItem('menuNode',CircularJSON.stringify(copyNode)) |
| | | let nodeData = {} |
| | | if (type === 'up') { |
| | | let nodeData = {}; |
| | | if (type === "up") { |
| | | // 上移 |
| | | if (node.previousSibling) { |
| | | // 删除原先的node |
| | | this.$refs.tree.remove(node.data) |
| | | this.$refs.tree.remove(node.data); |
| | | // 拿到copy的node |
| | | // nodeData = CircularJSON.parse(window.sessionStorage.getItem('menuNode')) |
| | | // // 复制该node到指定位置(参数:1. 要增加的节点的 data 2. 要增加的节点的后一个节点的 data、key 或者 node) |
| | | // this.$refs.tree.insertBefore(nodeData.data,nodeData.previousSibling.data) |
| | | window.sessionStorage.removeItem('menuNode') |
| | | window.sessionStorage.removeItem("menuNode"); |
| | | } else { |
| | | this.$message.warning('该菜单已经是当前层最上级') |
| | | this.$message.warning("该菜单已经是当前层最上级"); |
| | | } |
| | | } else { |
| | | // 下移 |
| | | if (node.nextSibling) { |
| | | this.$refs.tree.remove(node.data) |
| | | nodeData = CircularJSON.parse(window.sessionStorage.getItem('menuNode')) |
| | | this.$refs.tree.remove(node.data); |
| | | nodeData = CircularJSON.parse( |
| | | window.sessionStorage.getItem("menuNode") |
| | | ); |
| | | // 参数:1. 要增加的节点的 data 2. 要增加的节点的前一个节点的 data、key 或者 node |
| | | this.$refs.tree.insertAfter(nodeData.data, nodeData.nextSibling.data) |
| | | window.sessionStorage.removeItem('menuNode') |
| | | this.$refs.tree.insertAfter(nodeData.data, nodeData.nextSibling.data); |
| | | window.sessionStorage.removeItem("menuNode"); |
| | | } else { |
| | | this.$message.warning('该菜单已经是当前层最下级') |
| | | this.$message.warning("该菜单已经是当前层最下级"); |
| | | } |
| | | } |
| | | }, |
| | | |
| | | |
| | | handleDragStart (node, ev) { |
| | | console.log('drag start', node); |
| | | handleDragStart(node, ev) { |
| | | console.log("drag start", node); |
| | | }, |
| | | handleDragEnter (draggingNode, dropNode, ev) { |
| | | console.log('tree drag enter: ', dropNode.label); |
| | | handleDragEnter(draggingNode, dropNode, ev) { |
| | | console.log("tree drag enter: ", dropNode.label); |
| | | }, |
| | | handleDragLeave (draggingNode, dropNode, ev) { |
| | | console.log('tree drag leave: ', dropNode.label); |
| | | handleDragLeave(draggingNode, dropNode, ev) { |
| | | console.log("tree drag leave: ", dropNode.label); |
| | | }, |
| | | handleDragOver (draggingNode, dropNode, ev) { |
| | | console.log('tree drag over: ', dropNode.label); |
| | | handleDragOver(draggingNode, dropNode, ev) { |
| | | console.log("tree drag over: ", dropNode.label); |
| | | }, |
| | | handleDragEnd (draggingNode, dropNode, dropType, ev) { |
| | | console.log('tree drag end: ', dropNode && dropNode.label, dropType); |
| | | handleDragEnd(draggingNode, dropNode, dropType, ev) { |
| | | console.log("tree drag end: ", dropNode && dropNode.label, dropType); |
| | | }, |
| | | handleDrop (draggingNode, dropNode, dropType, ev) { |
| | | console.log('tree drop: ', dropNode.label, dropType); |
| | | handleDrop(draggingNode, dropNode, dropType, ev) { |
| | | console.log("tree drop: ", dropNode.label, dropType); |
| | | }, |
| | | handleCheckChange(data, checked, indeterminate) { |
| | | |
| | | |
| | | |
| | | |
| | | if (data.type != 2) return; |
| | | //做判断是否是1:100万行政界面 |
| | | if(data.layer==window.XZOutlie&&checked){ |
| | | window.ImageLayer3.show=false; |
| | | }else{ |
| | | window.ImageLayer3.show=true; |
| | | if (data.layer == window.XZOutlie && checked) { |
| | | window.ImageLayer3.show = false; |
| | | } else { |
| | | window.ImageLayer3.show = true; |
| | | } |
| | | |
| | | |
| | | var std = []; |
| | | if (data.layerType == 'WMS') { |
| | | if (data.layerType == "WMS") { |
| | | var layers_ol = window.map.getAllLayers(); |
| | | for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) { |
| | | var val_id = window.Viewer.imageryLayers._layers[i].imageryProvider.name; |
| | | var val_id = |
| | | window.Viewer.imageryLayers._layers[i].imageryProvider.name; |
| | | if (val_id == data.label) { |
| | | |
| | | std.push(data.label) |
| | | std.push(data.label); |
| | | |
| | | const img_layer = window.Viewer.imageryLayers._layers[i]; |
| | | img_layer.show = checked; |
| | |
| | | layerOl.setVisible(checked); //显示图层 |
| | | } |
| | | } |
| | | } else if (data.layerType == 'WFS') { |
| | | |
| | | } else if (data.layerType == "WFS") { |
| | | if (window.Viewer.dataSources._dataSources.length == 0) { |
| | | this.setAddLayers(data); |
| | | } else { |
| | | for (var i in window.Viewer.dataSources._dataSources) { |
| | | if (window.Viewer.dataSources._dataSources[i].name == data.label) { |
| | | window.Viewer.dataSources._dataSources[i].show = checked; |
| | | std.push(data.label) |
| | | std.push(data.label); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | if (std.length == 0 && checked == true) { |
| | | this.setAddLayers(data) |
| | | this.setAddLayers(data); |
| | | } |
| | | var layers_ol = window.map.getAllLayers(); |
| | | for (var i in layers_ol) { |
| | |
| | | } |
| | | }, |
| | | setAddLayers(res) { |
| | | if (res.layerType == 'WMS') { |
| | | if (res.layerType == "WMS") { |
| | | var url = geoServerURl; |
| | | if (res.url != null && res.url != undefined) { |
| | | url = res.url |
| | | url = res.url; |
| | | } |
| | | |
| | | //var width = $("#mapdiv").width(); |
| | |
| | | styles: "", |
| | | }, |
| | | tileWidth: 512, |
| | | tileHeight: 512 |
| | | tileHeight: 512, |
| | | }); |
| | | layerWMS.name = res.label; |
| | | //透明度 |
| | |
| | | var layer2 = new Image({ |
| | | name: res.label, |
| | | source: new ImageWMS({ |
| | | crossOrigin: 'anonymous', |
| | | crossOrigin: "anonymous", |
| | | url: url, |
| | | params: { |
| | | FORMAT: 'image/png', |
| | | VERSION: '1.1.1', |
| | | FORMAT: "image/png", |
| | | VERSION: "1.1.1", |
| | | LAYERS: res.resource, |
| | | }, |
| | | }), |
| | |
| | | layer2.setOpacity(parseInt(res.opacity) / 100); |
| | | } |
| | | window.map.addLayer(layer2); |
| | | |
| | | } else if (res.layerType == 'WFS') { |
| | | |
| | | var url = res.url + "?service=WFS&version=1.0.0&request=GetFeature&typeName=" + res.resource + "&outputFormat=application%2Fjson" |
| | | } else if (res.layerType == "WFS") { |
| | | var url = |
| | | res.url + |
| | | "?service=WFS&version=1.0.0&request=GetFeature&typeName=" + |
| | | res.resource + |
| | | "&outputFormat=application%2Fjson"; |
| | | $.ajax({ |
| | | url: url, |
| | | cache: false, |
| | |
| | | fill: Cesium.Color.YELLOW.withAlpha(0.1), |
| | | alpha: 0.1, |
| | | strokeWidth: 8, |
| | | clampToGround: true //是否贴地 |
| | | clampToGround: true, //是否贴地 |
| | | }); |
| | | datasource.then((data) => { |
| | | data.name = res.label; |
| | | window.Viewer.dataSources.add(data); |
| | | }) |
| | | |
| | | }); |
| | | }, |
| | | error: function (data) { |
| | | console.log("error"); |
| | | } |
| | | }, |
| | | }); |
| | | |
| | | var vectorLayer = new VectorLayer({ |
| | |
| | | url: url, |
| | | format: new GeoJSON(), |
| | | }), |
| | | |
| | | }); |
| | | window.map.addLayer(vectorLayer); |
| | | } |
| | | }, |
| | | async layersStart () { |
| | | async layersStart() { |
| | | const data = await perms_selectLayers(); |
| | | if (data.code != 200) { |
| | | return this.$message.error("图层列表查询失败"); |
| | | |
| | | } |
| | | |
| | | this.newData = data.result; |
| | |
| | | type: data.result[i].type, |
| | | isEdit: false, |
| | | children: [], |
| | | }) |
| | | }); |
| | | } else if (data.result[i].type == 2) { |
| | | |
| | | if (data.result[i].url != null) { |
| | | |
| | | var layer_entity = { |
| | | id: data.result[i].id, |
| | | pid: data.result[i].pid, |
| | |
| | | type: data.result[i].type, |
| | | isEdit: false, |
| | | layer: data.result[i].enName, |
| | | layerType: data.result[i].serveType |
| | | } |
| | | layer_list.push(layer_entity) |
| | | layerType: data.result[i].serveType, |
| | | }; |
| | | layer_list.push(layer_entity); |
| | | |
| | | if (data.result[i].isShow == 1) { |
| | | std.push(data.result[i].id); |
| | | this.setAddLayers(layer_entity); |
| | | } |
| | | |
| | | } |
| | | } |
| | | } |
| | |
| | | for (var i in layer_list) { |
| | | for (var j in layer_groups) { |
| | | if (layer_list[i].pid === layer_groups[j].id) { |
| | | layer_groups[j].children.push(layer_list[i]) |
| | | layer_groups[j].children.push(layer_list[i]); |
| | | } |
| | | } |
| | | } |
| | | layer_groups = layer_groups.filter((res) => { |
| | | if (res.children && res.children.length != 0) { |
| | | return res |
| | | return res; |
| | | } |
| | | }) |
| | | }); |
| | | this.treeData = layer_groups; |
| | | this.$refs.tree.setCheckedKeys(std); |
| | | }, |
| | | async treelayersStart () { |
| | | async treelayersStart() { |
| | | const data = await perms_selectLayers(); |
| | | if (data.code != 200) { |
| | | return this.$message.error("图层列表查询失败"); |
| | |
| | | type: data.result[i].type, |
| | | isEdit: false, |
| | | children: [], |
| | | }) |
| | | }); |
| | | } else if (data.result[i].type == 2) { |
| | | if (data.result[i].url != null) { |
| | | var layer_entity = { |
| | |
| | | resource: data.result[i].url, |
| | | type: data.result[i].type, |
| | | isEdit: false, |
| | | } |
| | | layer_list.push(layer_entity) |
| | | }; |
| | | layer_list.push(layer_entity); |
| | | } |
| | | } |
| | | } |
| | | for (var i in layer_list) { |
| | | for (var j in layer_groups) { |
| | | if (layer_list[i].pid === layer_groups[j].id) { |
| | | layer_groups[j].children.push(layer_list[i]) |
| | | layer_groups[j].children.push(layer_list[i]); |
| | | } |
| | | } |
| | | } |
| | | layer_groups = layer_groups.filter((res) => { |
| | | if (res.children && res.children.length != 0) { |
| | | return res |
| | | return res; |
| | | } |
| | | }) |
| | | }); |
| | | this.treeData = layer_groups; |
| | | |
| | | for (var i in data.result) { |
| | |
| | | for (var j = 0; j < window.Viewer.imageryLayers._layers.length; j++) { |
| | | var val_id = window.Viewer.imageryLayers._layers[j]; |
| | | if (val_id.show == true) { |
| | | |
| | | if (val_id.imageryProvider.name == data.result[i].cnName) { |
| | | std.push(data.result[i].id); |
| | | } |
| | |
| | | } |
| | | } |
| | | this.$refs.tree.setCheckedKeys(std); |
| | | |
| | | } |
| | | }, |
| | | watch: { |
| | | filterText (val) { |
| | | this.$refs.tree.filter(val); |
| | | |
| | | }, |
| | | }, |
| | | mounted () { |
| | | watch: { |
| | | filterText(val) { |
| | | this.$refs.tree.filter(val); |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.$bus.$on("treeDataCopy", (res) => { |
| | | this.$store.state.treeData = this.treeData; |
| | | this.$store.state.checkedKeys = this.$refs.tree.getCheckedKeys() |
| | | this.$store.state.checkedKeys = this.$refs.tree.getCheckedKeys(); |
| | | }); |
| | | |
| | | |
| | | if (this.$store.state.showAllLayers == true) { |
| | | this.layersStart(); |
| | | this.$store.state.showAllLayers = false; |
| | |
| | | this.treeData = this.$store.state.treeData; |
| | | this.$refs.tree.setCheckedKeys(this.$store.state.checkedKeys); |
| | | } |
| | | |
| | | }, |
| | | }; |
| | | </script> |