From 68e3567f9eec11097bb4e6f6c308033a691049b8 Mon Sep 17 00:00:00 2001 From: ChenZeping <chenzeping> Date: 星期六, 08 五月 2021 14:23:42 +0800 Subject: [PATCH] 管线分析 --- src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue | 206 ++++++++++++++++++++++++--------------------------- 1 files changed, 96 insertions(+), 110 deletions(-) diff --git a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue index bbf8c62..816259b 100644 --- a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue +++ b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue @@ -5,26 +5,27 @@ <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick"> <el-tab-pane label="杩為�氭��" name="first"> <el-button type="primary" @click="linkClickStart" size="mini" style="margin-bottom: 5px;" - title="鍦板浘涓婄偣鍑婚�夋嫨闇�瑕佽繘琛岃繛閫氬垎鏋愮殑绠℃">璧峰绠℃ + title="鍦板浘涓婄偣鍑婚�夋嫨闇�瑕佽繘琛岃繛閫氬垎鏋愮殑绠$嚎">璧峰绠$嚎 </el-button> <el-button type="primary" @click="linkClickEnd" size="mini" style="margin-bottom: 5px;" - title="鍦板浘涓婄偣鍑讳笌鎵�閫夌娈佃繛閫氱娈�">缁撴潫绠℃ + title="鍦板浘涓婄偣鍑讳笌鎵�閫夌绾胯繛閫氱绾�">缁撴潫绠$嚎 </el-button> <el-button type="primary" @click="linkQuery" size="mini" style="margin-bottom: 5px;" - title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">杩為�氭�у垎鏋� + title="鏍规嵁璧峰銆佺粨鏉熺绾胯繘琛岃繛閫氭�у垎鏋�">杩為�氭�у垎鏋� </el-button> <el-button type="primary" @click="handleClick" size="mini" style="margin-bottom: 5px;" - title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">娓呴櫎 + title="鏍规嵁璧峰銆佺粨鏉熺绾胯繘琛岃繛閫氭�у垎鏋�">娓呴櫎 </el-button> <!-- <el-scrollbar style="height:450px">--> <!-- <el-card shadow="hover">--> - <span class="fixed-style">璧峰绠℃</span> + <span class="fixed-style">璧峰绠$嚎</span> <el-table class="tableBox" + height="100" max-height="200" - highlight-current-row :data="tableDataLinkStart" @row-click="linkSelectStart" + highlight-current-row style="width: 100%" size="mini"> <el-table-column prop="datasource" @@ -63,7 +64,7 @@ </template> </el-table-column> </el-table> - <span class="fixed-style">缁撴潫绠℃</span> + <span class="fixed-style">缁撴潫绠$嚎</span> <el-table class="tableBox" height="100" @@ -163,15 +164,15 @@ <el-row> <span>鐖嗙锛堢浉鍏冲紑鍏筹級</span> <el-button type="primary" @click="bgClick" size="mini" style="margin-bottom: 5px;" - title="鍦板浘涓婄偣鍑婚�夋嫨鍙戠敓鐖嗙鐨勭娈�"> - 閫夋嫨绠℃ + title="鍦板浘涓婄偣鍑婚�夋嫨鍙戠敓鐖嗙鐨勭绾�"> + 閫夋嫨绠$嚎 </el-button> <el-button type="primary" @click="handleClick" size="mini" style="margin-bottom: 5px;" title="娓呴櫎缁樺埗"> 娓呴櫎 </el-button> </el-row> <!-- <el-card shadow="hover">--> - <span class="fixed-style">鍙戠敓鐖嗚鐨勭娈�</span> + <span class="fixed-style">鍙戠敓鐖嗚鐨勭绾�</span> <el-table max-height="200" class="tableBox" @@ -273,7 +274,7 @@ <el-tab-pane label="娴佸悜" name="third"> <el-button type="primary" @click="selectPipeLine" size="mini" style="margin-bottom: 5px;" title="鍦板浘涓婄偣鍑昏鏄剧ず娴佸悜鐨勭绾�"> - 閫夋嫨绠℃ + 閫夋嫨绠$嚎 </el-button> <el-table max-height="200" @@ -458,23 +459,23 @@ bgMarker: null, hdmParam: null, - // 杩為�氭�� // 1 杩為�氭�ц捣濮嬬娈� 0 杩為�氭�х粨鏉熺娈� 鐢ㄦ潵鍒ゆ柇鏄偣鍑讳簡璧峰 杩樻槸缁撴潫绠℃ + // 杩為�氭�� // 1 杩為�氭�ц捣濮嬬绾� 0 杩為�氭�х粨鏉熺绾� 鐢ㄦ潵鍒ゆ柇鏄偣鍑讳簡璧峰 杩樻槸缁撴潫绠$嚎 linkType: 1, - // 杩為�氭�� 璧峰绠℃ 琛ㄦ牸鏁版嵁 + // 杩為�氭�� 璧峰绠$嚎 琛ㄦ牸鏁版嵁 tableDataLinkStart: [], - // 杩為�氭�� 缁撴潫绠℃ 琛ㄦ牸鏁版嵁 + // 杩為�氭�� 缁撴潫绠$嚎 琛ㄦ牸鏁版嵁 tableDataLinkEnd: [], // 杩為�氭�� 鍒嗘瀽缁撴灉 灞曠ず => 杩為�� || 涓嶈繛閫� currentLinkIsTrue: '', // 杩為�氭�� 鍒嗘瀽缁撴灉 琛ㄦ牸鏁版嵁 tableDataLinkResult: [], - // 鐖嗙 鍙戠敓鐖嗚鐨勭娈� table琛ㄦ牸鏁版嵁 + // 鐖嗙 鍙戠敓鐖嗚鐨勭绾� table琛ㄦ牸鏁版嵁 bgPipeLine: [], // 鐖嗙 闇�瑕佸叧闂殑闃�闂� table琛ㄦ牸鏁版嵁 bgFm: [], - // 娴佸悜 閫夋嫨鐨勭娈� 鐨則able琛ㄦ牸鏁版嵁 + // 娴佸悜 閫夋嫨鐨勭绾� 鐨則able琛ㄦ牸鏁版嵁 tableDataLiuxiang: [], // 娴佸悜 鍒嗘瀽缁撴灉 鐨則able琛ㄦ牸鏁版嵁 lxTableDataResult: [], @@ -513,15 +514,24 @@ this.lxTableDataResult = [] }, - // 娴佸悜鍦板浘涓婄偣鍑� + // 鍦板浘涓婄偣鍑� selectPipeLine () { window.map.on('click', this.selectClick) + // // 鍏抽棴寮圭獥 + window.layerFactory.clickSwitch = false }, // 鍦板浘涓婄偣鍑诲洖璋� selectClick (e) { + console.log(e) window.map.off('click', this.selectClick) const point = [e.latlng.lng, e.latlng.lat] this.getPipeLine(point) + // if () { + // // 鍏抽棴寮圭獥 + // window.layerFactory.clickSwitch = false + // } else { + // window.layerFactory.clickSwitch = true + // } }, // 鐐瑰嚮鑾峰彇鍒ゆ柇鏁版嵁 async getPipeLine (point) { @@ -532,6 +542,7 @@ } // 鏍规嵁鍙傛暟璇锋眰鎺ュ彛鏁版嵁 const res = await mapApi.findPipelineByClickPoint(param) + console.log(res) if (this.activeName === 'first') { if (this.linkType === 1) { this.tableDataLinkStart = res.data @@ -544,8 +555,6 @@ this.tableDataLiuxiang = res.data } else if (this.activeName === 'fourth') { } - // debugger - console.log(res.data) }, // 娴佸悜鏄剧ず 鐨勬柟娉曞弬鏁板皝 createFlowLine (param) { @@ -570,16 +579,16 @@ }) }, - // 杩為�氭�� ===> 鍦板浘鐐瑰嚮璧峰绠℃e + // 杩為�氭�� ===> 鍦板浘鐐瑰嚮璧峰绠$嚎e linkClickStart (e) { - console.log(e) - console.log('鍦板浘鐐瑰嚮璧峰绠℃') + // console.log(e) + // console.log('鍦板浘鐐瑰嚮璧峰绠$嚎') this.linkType = 1 this.selectPipeLine() }, - // 杩為�氭�� 璧峰绠℃ table鍒楄〃鏁版嵁 閫夋嫨鏁版嵁浜嬩欢 鐨勭偣鍑讳簨浠� + // 杩為�氭�� 璧峰绠$嚎 table鍒楄〃鏁版嵁 閫夋嫨鏁版嵁浜嬩欢 鐨勭偣鍑讳簨浠� linkSelectStart (e) { - console.log('閫夋嫨璧峰绠℃') + // console.log('閫夋嫨璧峰绠$嚎') // this.$refs.singleTable.setCurrentRow(e) this.currentSelectStart = e if (this.currentSelectStartLine != null) { @@ -597,15 +606,15 @@ }).addTo(window.map) window.map.panInsideBounds(this.currentSelectStartLine.getBounds()) }, - // 杩為�氭�� ===> 鍦板浘鐐瑰嚮缁撴潫绠℃ + // 杩為�氭�� ===> 鍦板浘鐐瑰嚮缁撴潫绠$嚎 linkClickEnd () { - console.log('鍦板浘鐐瑰嚮缁撴潫绠℃') + console.log('鍦板浘鐐瑰嚮缁撴潫绠$嚎') this.linkType = 0 this.selectPipeLine() }, - // 杩為�氭�� 缁撴潫绠℃ table鍒楄〃鏁版嵁 閫夋嫨鏁版嵁浜嬩欢 鐨勭偣鍑讳簨浠� + // 杩為�氭�� 缁撴潫绠$嚎 table鍒楄〃鏁版嵁 閫夋嫨鏁版嵁浜嬩欢 鐨勭偣鍑讳簨浠� linkSelectEnd (e) { - console.log('閫夋嫨缁撴潫绠℃') + console.log('閫夋嫨缁撴潫绠$嚎') this.currentSelectEnd = e // 鍋氬垽鏂璻emove @@ -619,7 +628,7 @@ style: function (feature) { return { weight: 10, - color: 'rgba(200,0,200,.6)' + color: 'rgba(255, 247, 0, 0.6)' } } }).addTo(window.map) @@ -635,9 +644,9 @@ }) this.linkPipeline = [] } - // 鍒ゆ柇 濡傛灉璧峰绠℃ 缁撴潫绠℃娌℃湁鏁版嵁 鍒欒繑鍥瀎alse 鎻愮ず杩樻湭閫夋嫨璧峰/缁撴潫绠℃ + // 鍒ゆ柇 濡傛灉璧峰绠$嚎 缁撴潫绠$嚎娌℃湁鏁版嵁 鍒欒繑鍥瀎alse 鎻愮ず杩樻湭閫夋嫨璧峰/缁撴潫绠$嚎 if (this.currentSelectStart === null || this.currentSelectEnd === null) { - this.$message('璇烽�夋嫨璧峰绠℃鍜岀粨鏉熺娈�') + this.$message('璇烽�夋嫨璧峰绠$嚎鍜岀粨鏉熺绾�') return false } @@ -652,7 +661,7 @@ console.log(res) // 鍒ゆ柇鏁版嵁缁撴灉 === 0 鍒欐病鏈夎姹傚埌鏁版嵁 if (res.data.length === 0) { - this.$message('娌℃湁鎵惧埌杩為�氱殑绠℃') + this.$message('娌℃湁鎵惧埌杩為�氱殑绠$嚎') this.currentLinkIsTrue = '涓嶈繛閫�' return } @@ -722,12 +731,12 @@ } }, - // 鐖嗙 ===> 閫夋嫨绠℃ + // 鐖嗙 ===> 閫夋嫨绠$嚎 bgClick () { this.selectPipeLine() }, async bgSelect (e) { - console.log('閫夋嫨鐖嗙绠℃') + console.log('閫夋嫨鐖嗙绠$嚎') console.log(e) this.bgFm = [] if (this.bgMarker != null) { @@ -802,7 +811,8 @@ bgFmClick (e) { console.log('鐐瑰嚮褰卞搷鐨勯榾闂�') console.log(e) - const point = [e.data[0][0], e.data[0][1]] + // const point = [e.data[0][0], e.data[0][1]] + const point = [e.startControlPoint.x, e.startControlPoint.y] const marker = this.createFlowMarker(point) marker.addTo(this.map) window.map.flyTo(point, 16) @@ -1072,32 +1082,6 @@ </script> <style lang="less" scoped> - /*****婊氬姩鏉�***/ - /deep/ .tableBox { - .el-table__fixed-right-patch { - display: none; - } - } - - /deep/ .tableBox::-webkit-scrollbar { - /*婊氬姩鏉℃暣浣撴牱寮�*/ - width: 10px; /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/ - /*height: 10px;*/ - } - - /deep/ .tableBox::-webkit-scrollbar-thumb { - /*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/ - border-radius: 10px; - background: #000; - } - - /deep/ .tableBox::-webkit-scrollbar-track { - /*婊氬姩鏉¢噷闈㈣建閬�*/ - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); - background: @background-color; - border-radius: 10px; - } - /deep/ .el-table .has-gutter tr th { border: none !important; } @@ -1108,50 +1092,6 @@ /deep/ .el-tabs__header { background: none !important; - } - - /deep/ .el-tabs--top .el-tabs__item.is-top:nth-child(2) { - padding-left: 20px; - } - - /deep/ .el-tabs--border-card { - background: none; - border: none; - box-shadow: none; - } - - /deep/ .el-tabs--border-card > .el-tabs__header { - background: none; - border-bottom: none; - margin: 0; - } - - /deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active { - color: #409EFF; - background: none; - border: none; - } - - /deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item { - border: none; - } - - /deep/ .panel-right ::-webkit-scrollbar-thumb { - background: none; - border: none; - } - - /deep/ .el-card { - //width: 95%; - //margin: 5px auto; - //border: none; - //background: rgba(0, 16, 30, 0.5); - //border: 0.00521rem solid @color; - //box-shadow: 0 0 0.03rem @color; - } - - /deep/ .el-card__body { - padding: 0; } /deep/ .fixed-style { @@ -1169,13 +1109,59 @@ background: none; } - /deep/ .el-table__fixed-right { - bottom: 0; - padding: 0; - margin: 0; + /deep/ .el-table__body .el-table__row.hover-row td { + background: none !important; + } + + /deep/ .el-table__fixed-right-patch { + /*display: none;*/ + } + + /deep/ .el-table__body tr.current-row > td { + background: rgba(0, 16, 30, 1) !important; } /deep/ .fixed-table { - background: rgba(0, 16, 30, 0.9) !important; + background: rgba(0, 16, 30, 1) !important; } + + /*/deep/ .el-tabs--top .el-tabs__item.is-top:nth-child(2) {*/ + /* padding-left: 20px;*/ + /*}*/ + + /*/deep/ .el-tabs--border-card {*/ + /* background: none;*/ + /* border: none;*/ + /* box-shadow: none;*/ + /*}*/ + + /*/deep/ .el-tabs--border-card > .el-tabs__header {*/ + /* background: none;*/ + /* border-bottom: none;*/ + /* margin: 0;*/ + /*}*/ + + /*/deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {*/ + /* color: #409EFF;*/ + /* background: none;*/ + /* border: none;*/ + /*}*/ + + /*/deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item {*/ + /* border: none;*/ + /*}*/ + + /*/deep/ .panel-right ::-webkit-scrollbar-thumb {*/ + /* background: none;*/ + /* border: none;*/ + /*}*/ + + /*/deep/ .el-card__body {*/ + /* padding: 0;*/ + /*}*/ + /*/deep/ .el-table__fixed-right {*/ + /* bottom: 0;*/ + /* padding: 0;*/ + /* margin: 0;*/ + /*}*/ </style> -- Gitblit v1.8.0