| | |
| | | <div class="lalala tree-container"> |
| | | <el-form ref="form"> |
| | | <el-form-item> |
| | | <el-select |
| | | v-model="$store.state.pigCode" |
| | | clearable |
| | | filterable |
| | | style="width :100%" |
| | | @change="prjChanged" |
| | | placeholder="请选择项目" |
| | | > |
| | | <el-option |
| | | v-for="item in menus" |
| | | :key="item.code" |
| | | :label="item.name" |
| | | :value="item.code" |
| | | > |
| | | <el-select v-model="$store.state.pigCode" clearable filterable style="width :100%" @change="prjChanged" |
| | | placeholder="请选择项目"> |
| | | <el-option v-for="item in menus" :key="item.code" :label="item.name" :value="item.code"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-input |
| | | placeholder="输入关键字进行过滤" |
| | | v-model="filterText" |
| | | class="search" |
| | | > |
| | | <el-input placeholder="输入关键字进行过滤" v-model="filterText" class="search"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | <el-tree |
| | | ref="tree" |
| | | :data="treeData" |
| | | node-key="id" |
| | | show-checkbox |
| | | :props="defaultProps" |
| | | @node-click="handleLeftclick" |
| | | @node-contextmenu="rightClick" |
| | | @check="handleCheckChange" |
| | | :default-checked-keys="handleTreeCheck" |
| | | :expand-on-click-node="false" |
| | | :filter-node-method="filterNode" |
| | | draggable |
| | | > |
| | | <span |
| | | class="slot-t-node" |
| | | slot-scope="{ node, data }" |
| | | > |
| | | <el-tree ref="tree" :data="treeData" node-key="id" show-checkbox :props="defaultProps" @node-click="handleLeftclick" |
| | | @node-contextmenu="rightClick" @check="handleCheckChange" :default-checked-keys="handleTreeCheck" |
| | | :expand-on-click-node="false" :filter-node-method="filterNode"> |
| | | <span class="slot-t-node" slot-scope="{ node, data }"> |
| | | <span v-show="!data.isEdit"> |
| | | <span :class="[data.id >= 99 ? 'slot-t-node--label' : '']">{{ |
| | | node.label |
| | | }}</span> |
| | | 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 |
| | | class="edit" |
| | | @click="showLayerAttribute()" |
| | | v-if="showProp && !shwoHistogram" |
| | | > |
| | | <el-card class="box-card" ref="card" :style="{ ...rightClickMenuStyle }" v-show="menuVisible"> |
| | | <div class="edit" @click="showLayerAttribute()" v-if="showProp && !shwoHistogram"> |
| | | <i class="el-icon-tickets"></i> 属性 |
| | | </div> |
| | | <div |
| | | class="edit" |
| | | @click="positioning()" |
| | | v-if="showLocal" |
| | | > |
| | | <div class="edit" @click="positioning()" v-if="showLocal"> |
| | | <i class="el-icon-tickets"></i> 定位 |
| | | </div> |
| | | <div |
| | | class="edit" |
| | | @click="pellucidity()" |
| | | v-if="showOpacity" |
| | | > |
| | | <div class="edit" @click="pellucidity()" v-if="showOpacity"> |
| | | <i class="el-icon-tickets"></i> 透明度 |
| | | </div> |
| | | <div |
| | | class="edit" |
| | | @click="histogram()" |
| | | v-show="shwoHistogram" |
| | | > |
| | | <div class="edit" @click="histogram()" v-show="shwoHistogram"> |
| | | <i class="el-icon-tickets"></i> 钻孔柱状图 |
| | | </div> |
| | | <div |
| | | class="edit" |
| | | v-show="shwoTileDown" |
| | | @click="tileDownload()" |
| | | > |
| | | <div class="edit" v-show="shwoTileDown" @click="tileDownload()"> |
| | | <i class="el-icon-download"></i> 瓦片下载 |
| | | </div> |
| | | <div class="edit" v-show="shwoAnnex" @click="annexDownload()"> |
| | | <i class="el-icon-tickets"></i> 附件 |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | |
| | | showOpacity: false, // 不透明度 |
| | | shwoTileDown: false, // 瓦片下载 |
| | | menuVisible: false, // 菜单 |
| | | shwoAnnex: false,//附件 |
| | | levelArray: [ // 高程数组 |
| | | 0, 40000000, 20000000, 10000000, 5000000, 2000000, 1000000, 500000, |
| | | 250000, 200000, 100000, 50000, 17000, 9000, 5000, 2000, 1000, 500, 200, |
| | |
| | | this.showOpacity = ["Tileset", "3DML"].indexOf(object.serveType) > -1; // 不透明度 |
| | | this.shwoTileDown = ["TMS", "DOM"].indexOf(object.serveType) > -1 && object.pubid; // 瓦片下载 |
| | | this.menuVisible = this.showProp || this.shwoHistogram || this.showLocal || this.showOpacity || this.shwoTileDown; // 菜单 |
| | | this.shwoAnnex = ['DEM', 'TMS'].indexOf(object.serveType) > -1;//附件 |
| | | |
| | | this.$refs.card.$el.style.left = event.pageX + 20 + "px"; |
| | | |
| | | var left = window.innerWidth - 140; |
| | | var pageLeft = event.pageX + 20 |
| | | if(pageLeft>left){ |
| | | pageLeft = left - 25 |
| | | } |
| | | |
| | | this.$refs.card.$el.style.left =pageLeft+ "px"; |
| | | this.$refs.card.$el.style.top = event.pageY + "px"; |
| | | }, |
| | | // 属性显示 |
| | |
| | | let wkt = this.$wkt.parse(data.result.geom); |
| | | let height = this.getHeight(wkt.coordinates[2]); |
| | | Viewer.camera.flyTo({ |
| | | destination: Cesium.Cartesian3.fromDegrees(wkt.coordinates[1], wkt.coordinates[0], height), // 2000 |
| | | destination: Cesium.Cartesian3.fromDegrees(wkt.coordinates[1], wkt.coordinates[0], sceneConfig.extureHeight), // 2000 |
| | | }); |
| | | } |
| | | return; |
| | |
| | | // 获取高度 |
| | | getHeight(level) { |
| | | if (level > -1 && level < 23) return this.levelArray[level]; |
| | | |
| | | return this.levelArray[this.levelArray.length - 1]; |
| | | var res = 7 |
| | | return this.levelArray[res]; |
| | | }, |
| | | //附件下载 |
| | | annexDownload() { |
| | | this.$bus.$emit('annexDownload', this.currentData) |
| | | }, |
| | | |
| | | // 瓦片下载 |
| | | tileDownload() { |
| | | this.rmListener(); |
| | |
| | | }, |
| | | // 添加TMS图层 |
| | | addTMSLayers(layers) { |
| | | |
| | | for (let i in layers) { |
| | | let res = layers[i]; |
| | | res.url = res.url.indexOf("{host}") > -1 ? res.url.replace("{host}", iisHost) : res.url; |
| | |
| | | maximumLevel: 22, |
| | | enablePickFeatures: false |
| | | }), 1); |
| | | |
| | | layer.id = res.id; |
| | | layer.name = res.cnName; |
| | | if (is_production) { |
| | | Viewer.imageryLayers.raiseToTop(layer);//将图层上移一层 |
| | | Viewer.imageryLayers.lower(layer);//将图层上移一层 |
| | | } |
| | | |
| | | } |
| | | }, |
| | | // 切换Mpt |
| | |
| | | let layer = Viewer.imageryLayers.addImageryProvider(provider, 1); |
| | | layer.name = res.cnName; |
| | | |
| | | if (is_production) { |
| | | Viewer.imageryLayers.raiseToTop(layer);//将图层上移一层 |
| | | Viewer.imageryLayers.lower(layer);//将图层上移一层 |
| | | } |
| | | // if (data.result.geom) { |
| | | // let wkt = this.$wkt.parse(data.result.geom); |
| | | // Viewer.camera.flyTo({ |
| | |
| | | </script> |
| | | <style scoped lang="less"> |
| | | /* 点击节点时的选中颜色 */ |
| | | .tree-container /deep/.el-tree-node.is-current > .el-tree-node__content { |
| | | .tree-container /deep/.el-tree-node.is-current>.el-tree-node__content { |
| | | color: #409eff !important; |
| | | } |
| | | |
| | |
| | | padding-left: 16px; |
| | | } |
| | | |
| | | .tree-container /deep/ .el-tree > .el-tree-node:before { |
| | | .tree-container /deep/ .el-tree>.el-tree-node:before { |
| | | border-left: none; |
| | | } |
| | | |
| | | .tree-container /deep/ .el-tree > .el-tree-node:after { |
| | | .tree-container /deep/ .el-tree>.el-tree-node:after { |
| | | border-top: none; |
| | | } |
| | | |
| | | .tree-container /deep/ .el-tree > .el-tree-node:before { |
| | | .tree-container /deep/ .el-tree>.el-tree-node:before { |
| | | border-left: none; |
| | | } |
| | | |
| | | .tree-container /deep/ .el-tree > .el-tree-node:after { |
| | | .tree-container /deep/ .el-tree>.el-tree-node:after { |
| | | border-top: none; |
| | | } |
| | | |
| | |
| | | z-index: 8; |
| | | } |
| | | |
| | | .tree-container |
| | | /deep/ |
| | | .el-tree-node |
| | | .el-tree-node__children |
| | | .el-tree-node__content::before { |
| | | .tree-container /deep/ .el-tree-node .el-tree-node__children .el-tree-node__content::before { |
| | | border-left: 0px dashed #ccc; |
| | | height: 100%; |
| | | top: 0; |
| | |
| | | } |
| | | |
| | | .tree-container /deep/ .el-tree-node { |
| | | .is-leaf + .el-checkbox .el-checkbox__inner { |
| | | .is-leaf+.el-checkbox .el-checkbox__inner { |
| | | display: inline-block; |
| | | } |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | .tree-container |
| | | /deep/ |
| | | .el-tree-node |
| | | .el-tree-node__children |
| | | .el-tree-node__content::after { |
| | | .tree-container /deep/ .el-tree-node .el-tree-node__children .el-tree-node__content::after { |
| | | border-top: 0px dashed #ccc; |
| | | } |
| | | |
| | |
| | | /deep/.el-card__body { |
| | | padding: 10px !important; |
| | | |
| | | > div { |
| | | >div { |
| | | padding-bottom: 10px; |
| | | border-bottom: 1px solid #ccc; |
| | | |