From ec4d5c1827487f4c901b69bd9eae58e111e82b32 Mon Sep 17 00:00:00 2001
From: 徐旺旺 <11530253@qq.com>
Date: 星期四, 20 五月 2021 18:05:25 +0800
Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop
---
src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue | 1049 ++++++---------------------------------------------------
1 files changed, 118 insertions(+), 931 deletions(-)
diff --git a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue
index 0fec718..b163263 100644
--- a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue
+++ b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue
@@ -1,967 +1,154 @@
<template>
- <div class="sewers-analysis-tab">
- <transition name="el-fade-in-linear">
- <el-card>
+ <div class="sewers-analysis-tab">
<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="鍦板浘涓婄偣鍑婚�夋嫨闇�瑕佽繘琛岃繛閫氬垎鏋愮殑绠℃">璧峰绠℃
- </el-button>
- <el-button type="primary" @click="linkClickEnd" size="mini" style="margin-bottom: 5px;"
- title="鍦板浘涓婄偣鍑讳笌鎵�閫夌娈佃繛閫氱娈�">缁撴潫绠℃
- </el-button>
- <el-button type="primary" @click="linkQuery" size="mini" style="margin-bottom: 5px;"
- title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">杩為�氭�у垎鏋�
- </el-button>
- <el-button type="primary" @click="linkClear" size="mini" style="margin-bottom: 5px;"
- title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">娓呴櫎
- </el-button>
- <el-scrollbar style="height:450px">
- <el-card shadow="hover"> <!-- style="height: 300px"-->
- <span class="clearfixs">璧峰绠℃</span>
- <el-table
- ref="singleTable"
- highlight-current-row
- :data="tableDataLinkStart"
- @row-click="linkSelectStart"
- max-height="200"
- style="width: 100%" size="mini">
- <el-table-column
- prop="lineloopna"
- label="绠＄嚎绫诲瀷"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="pipecode"
- label="绠＄嚎鍚嶇О"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="startpoint"
- label="璧风偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="endpointnu"
- label="缁堢偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鎿嶄綔"
- >
- <template slot-scope="scope">
- <el-button @click="linkSelectStart(scope.row)" type="text" size="small">閫夋嫨</el-button>
- </template>
- </el-table-column>
- </el-table>
- <span class="clearfixs">缁撴潫绠℃</span>
- <el-table
- max-height="200"
- highlight-current-row
- :data="tableDataLinkEnd"
- @row-click="linkSelectEnd"
- style="width: 100%" size="mini">
- <el-table-column
- prop="lineloopna"
- label="绠＄嚎绫诲瀷"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="pipecode"
- label="绠＄嚎鍚嶇О"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="startpoint"
- label="璧风偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="endpointnu"
- label="缁堢偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鎿嶄綔"
- >
- <template slot-scope="scope">
- <el-button @click="linkSelectEnd(scope.row)" type="text" size="small">閫夋嫨</el-button>
- </template>
- </el-table-column>
- </el-table>
- <span class="clearfixs">鍒嗘瀽缁撴灉:<span style="color: red;">{{ currentLinkIsTrue }}</span></span>
- <el-table
- highlight-current-row
- max-height="200"
- :data="tableDataLinkResult"
- @row-click="linkResultSelect"
- style="width: 100%" size="mini">
-
- <el-table-column
- prop="lineloopna"
- label="绠＄嚎绫诲瀷"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="pipecode"
- label="绠＄嚎鍚嶇О"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="startpoint"
- label="璧风偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="endpointnu"
- label="缁堢偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鎿嶄綔"
- >
- <template slot-scope="scope">
- <el-button @click="linkResultSelect(scope.row)" type="text" size="small">瀹氫綅</el-button>
- </template>
- </el-table-column>
-
- </el-table>
- </el-card>
- </el-scrollbar>
- </el-tab-pane>
- <el-tab-pane label="鐖嗙" name="second" style="color: #cccccc">鐖嗙锛堢浉鍏冲紑鍏筹級
- <el-button type="primary" @click="bgClick" size="mini" style="margin-bottom: 5px;" title="鍦板浘涓婄偣鍑婚�夋嫨鍙戠敓鐖嗙鐨勭娈�">
- 閫夋嫨绠℃
- </el-button>
- <el-button type="primary" @click="handleClick" size="mini" style="margin-bottom: 5px;" title="娓呴櫎缁樺埗">娓呴櫎
- </el-button>
- <el-card shadow="hover">
- <span class="clearfixs">鍙戠敓鐖嗚鐨勭娈�</span>
- <el-table
- ref="singleTable"
- highlight-current-row
- :data="bgPipeLine"
- style="width: 100%" size="mini">
- <el-table-column
- prop="lineloopna"
- label="绠＄嚎绫诲瀷"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="pipecode"
- label="绠＄嚎鍚嶇О"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="startpoint"
- label="璧风偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="endpointnu"
- label="缁堢偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鎿嶄綔"
- >
- <template slot-scope="scope">
- <el-button @click="bgSelect(scope.row)" type="text" size="small">閫夋嫨</el-button>
- </template>
- </el-table-column>
- </el-table>
- <span class="clearfixs">闇�瑕佸叧闂殑闃�闂�</span>
- <el-table
- highlight-current-row
- :data="bgFm"
- @row-click="bgFmClick"
- style="width: 100%" size="mini">
- <el-table-column
- prop="lineloopna"
- label="绠＄嚎绫诲瀷"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="pipecode"
- label="绠＄嚎鍚嶇О"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="startpoint"
- label="璧风偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="endpointnu"
- label="缁堢偣缂栧彿"
- >
- </el-table-column>
-
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鎿嶄綔"
- >
- <template slot-scope="scope">
- <el-button @click="linkResultSelect(scope.row)" type="text" size="small">瀹氫綅</el-button>
- </template>
- </el-table-column>
- </el-table>
- </el-card>
- </el-tab-pane>
- <el-tab-pane label="娴佸悜" name="third">
- <el-button type="primary" @click="selectPipeLine" size="mini" style="margin-bottom: 5px;"
- title="鍦板浘涓婄偣鍑昏鏄剧ず娴佸悜鐨勭绾�">
- 閫夋嫨绠℃
- </el-button>
- <el-table
- :data="tableDataLiuxiang" size="mini">
- <el-table-column
- prop="lineloopna"
- label="绠＄嚎绫诲瀷"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="pipecode"
- label="绠＄嚎鍚嶇О"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="startpoint"
- label="璧风偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- sortable
- width="100"
- prop="endpointnu"
- label="缁堢偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鎿嶄綔"
- width="100"
- >
- <template slot-scope="scope">
- <el-button @click="lxQuery(scope.row)" type="text" size="small">鏄剧ず娴佸悜</el-button>
- </template>
- </el-table-column>
- </el-table>
- <span>鍒嗘瀽缁撴灉</span>
- <el-table
- highlight-current-row
- max-height="200"
- :data="lxTableDataResult"
- @row-click="lxResultSelect"
- style="width: 100%" size="mini">
-
- <el-table-column
- prop="lineloopna"
- label="绠＄嚎绫诲瀷"
- >
- </el-table-column>
- <el-table-column
- sortable
- prop="pipecode"
- label="绠＄嚎鍚嶇О"
- >
- </el-table-column>
- <el-table-column
- sortable
- prop="startpoint"
- label="璧风偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- sortable
- prop="endpointnu"
- label="缁堢偣缂栧彿"
- >
- </el-table-column>
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鎿嶄綔"
- >
- <template slot-scope="scope">
- <el-button @click="linkResultSelect(scope.row)" type="text" size="small">瀹氫綅</el-button>
- </template>
- </el-table-column>
-
- </el-table>
- </el-tab-pane>
- <el-tab-pane label="妯柇闈�" name="fourth">
- <el-button type="primary" @click="drawLine" size="mini" style="margin-bottom: 5px;" title="鍦板浘涓婄粯鍒惰杩涜鍒嗘瀽鎴柇闈㈢殑绾�">
- 缁樺埗绾挎
- </el-button>
- <el-button type="primary" @click="jdmQuery" size="mini" style="margin-bottom: 5px;" title="鎴柇闈㈠垎鏋�">鎴柇闈㈠垎鏋�
- </el-button>
- <el-button type="primary" @click="jdmClear" size="mini" style="margin-bottom: 5px;" title="娓呴櫎鎴柇闈㈠垎鏋愮粨鏋�">娓呴櫎
- </el-button>
- <el-card class="box-card">
- <div slot="header" class="clearfixs">
- <span>绠＄嚎鏌ヨ缁撴灉</span>
- </div>
- <el-table
- :data="tableData"
- style="width: 100%" @row-click="selectRow" size="mini">
- <el-table-column
- prop="name"
- label="绠＄嚎鍚嶇О"
- width="180">
- </el-table-column>
- <el-table-column
- prop="type"
- label="绠＄嚎绫诲瀷"
- width="180">
- </el-table-column>
- <el-table-column
- class-name="fixed-table"
- fixed="right"
- label="鍥捐〃鏌ョ湅"
- >
- <template slot-scope="scope">
- <el-button @click="selectRow(scope.row)" type="text" size="small">鏌ョ湅</el-button>
- </template>
- </el-table-column>
- </el-table>
- </el-card>
- <el-card class="box-card">
- <div slot="header" class="clearfixs">
- <span>鏂潰鍥�</span>
- </div>
- <span v-show="!myChartShow" style="color: #909399;font-size: 12px;">鏆傛棤鏁版嵁</span>
- <div v-show="myChartShow" id="echarts_box" ref="myChart" style="width: 600px;height:300px;"></div>
- </el-card>
- </el-tab-pane>
+ <el-tab-pane label="杩為�氭��" name="first">
+ <Connectivity></Connectivity>
+ </el-tab-pane>
+ <el-tab-pane label="鐖嗙" style="color: #cccccc" name="second">
+ <Tube></Tube>
+ </el-tab-pane>
+ <el-tab-pane label="娴佸悜" name="third">
+ <Flow></Flow>
+ </el-tab-pane>
+ <el-tab-pane label="妯柇闈�" name="fourth">
+ <CrossSectional></CrossSectional>
+ </el-tab-pane>
</el-tabs>
- </el-card>
- </transition>
- </div>
+ </div>
</template>
<script>
-
+import Connectivity from './AnalysisChoose/Connectivity'
+import Tube from './AnalysisChoose/Tube'
+import Flow from './AnalysisChoose/Flow'
+import CrossSectional from './AnalysisChoose/CrossSectional'
import eventBus from '../../../../eventBus'
-// import main from "../leaflet/app/main"
-import DrawLine from './AnalysisChoose/DrawLine'
-import mapApi from '../../../../api/mapApi'
export default {
name: 'SewersAnalysis',
+ components: {
+ Connectivity,
+ Tube,
+ Flow,
+ CrossSectional
+ },
data () {
return {
// 鍦板浘鐐瑰嚮绫诲瀷 first杩為�氭�х偣鍑� second鐖嗙鐐瑰嚮 third娴佸悜鐐瑰嚮 fourth妯柇闈�
activeName: 'first',
- measure: null,
- map: null,
-
- myChart: null,
- myChartShow: false,
- flowPipeLine: null,
-
- currentSelectStart: null,
- currentSelectEnd: null,
- currentSelectStartLine: null,
- currentSelectEndLine: null,
- currentSelectResultLine: null,
- currentResultLine: null,
-
- linkPipeline: [],
-
- bgPoint: null,
- bgMarker: null,
- hdmParam: null,
-
- // 杩為�氭�� // 1 杩為�氭�ц捣濮嬬娈� 0 杩為�氭�х粨鏉熺娈� 鐢ㄦ潵鍒ゆ柇鏄偣鍑讳簡璧峰 杩樻槸缁撴潫绠℃
- linkType: 1,
- // 杩為�氭�� 璧峰绠℃ 琛ㄦ牸鏁版嵁
- tableDataLinkStart: [],
- // 杩為�氭�� 缁撴潫绠℃ 琛ㄦ牸鏁版嵁
- tableDataLinkEnd: [],
- // 杩為�氭�� 鍒嗘瀽缁撴灉 灞曠ず => 杩為�� || 涓嶈繛閫�
- currentLinkIsTrue: '',
- // 杩為�氭�� 鍒嗘瀽缁撴灉 琛ㄦ牸鏁版嵁
- tableDataLinkResult: [],
-
- // 鐖嗙 鍙戠敓鐖嗚鐨勭娈� table琛ㄦ牸鏁版嵁
- bgPipeLine: [],
- // 鐖嗙 闇�瑕佸叧闂殑闃�闂� table琛ㄦ牸鏁版嵁
- bgFm: [],
-
- // 娴佸悜 閫夋嫨鐨勭娈� 鐨則able琛ㄦ牸鏁版嵁
- tableDataLiuxiang: [],
- // 娴佸悜 鍒嗘瀽缁撴灉 鐨則able琛ㄦ牸鏁版嵁
- lxTableDataResult: [],
-
- // 妯柇闈� 绠＄嚎鏌ヨ缁撴灉 鐨則able琛ㄦ牸鏁版嵁
- tableData: []
+ tableData: false,
+ tableDataList: []
}
- },
- mounted () {
- this.myChart = this.$echarts.init(this.$refs.myChart)
- // 鍏ㄥ眬map浼犻�� || this.map = window.map
- this.map = window.map
- // 浣跨敤 DrwLine鏂规硶
- eventBus.$on('draw-hdm-line', (points) => {
- this.getHdmPoint(points)
- })
},
methods: {
// tab鍒囨崲
handleClick (tab, event) {
- console.log(tab, event)
- this.clearLinkPipe()
- this.clearLX()
- this.linkClear()
- this.jdmClear()
- this.bgFm = []
- this.bgPipeLine = []
- this.tableData = []
- this.tableDataLiuxiang = []
- this.tableDataLinkStart = []
- this.tableDataLinkEnd = []
- this.tableDataLinkResult = []
- },
-
- // 娴佸悜鍦板浘涓婄偣鍑�
- selectPipeLine () {
- this.map.on('click', this.selectClick)
- },
- // 鍦板浘涓婄偣鍑诲洖璋�
- selectClick (e) {
- this.map.off('click', this.selectClick)
- const point = [e.latlng.lng, e.latlng.lat]
- console.log(point)
- this.getPipeLine(point)
- },
-
- // 杩為�氭�� ===> 鍦板浘鐐瑰嚮璧峰绠℃
- linkClickStart () {
- console.log('鍦板浘鐐瑰嚮璧峰绠℃')
- this.linkType = 1
- this.selectPipeLine()
- },
- // 杩為�氭�� ===> 鍦板浘鐐瑰嚮缁撴潫绠℃
- linkClickEnd () {
- console.log('鍦板浘鐐瑰嚮缁撴潫绠℃')
- this.linkType = 0
- this.selectPipeLine()
- },
- // 杩為�氭�� 璧峰绠℃ table鍒楄〃鏁版嵁 閫夋嫨鏁版嵁浜嬩欢 鐨勭偣鍑讳簨浠�
- linkSelectStart (e) {
- console.log('閫夋嫨璧峰绠℃')
- console.log(e)
- // this.$refs.singleTable.setCurrentRow(e)
- // this.currentSelectStart = e
- // if (this.currentSelectStartLine != null) {
- // this.currentSelectStartLine.remove()
- // this.currentSelectStartLine = null
- // }
- // const geom = JSON.parse(e.geomText)
- // this.currentSelectStartLine = L.geoJSON(geom, {
- // style: function (feature) {
- // return { color: 'rgba(0,255,0,.6)' }
- // }
- // }).addTo(this.map)
- // this.map.panInsideBounds(this.currentSelectStartLine.getBounds())
- },
- // 杩為�氭�� 缁撴潫绠℃ table鍒楄〃鏁版嵁 閫夋嫨鏁版嵁浜嬩欢 鐨勭偣鍑讳簨浠�
- linkSelectEnd (e) {
- console.log('閫夋嫨缁撴潫绠℃')
- console.log(e)
- // this.currentSelectEnd = e
- //
- // if (this.currentSelectEndLine != null) {
- // this.currentSelectEndLine.remove()
- // this.currentSelectEndLine = null
- // }
- //
- // const geom = JSON.parse(e.geomText)
- // this.currentSelectEndLine = L.geoJSON(geom, {
- // style: function (feature) {
- // return { color: 'rgba(200,0,200,.6)' }
- // }
- // }).addTo(this.map)
- // this.map.panInsideBounds(this.currentSelectEndLine.getBounds())
- },
- // 杩為�氭�� 鍒嗘瀽缁撴灉table鍒楄〃鏁版嵁閫夋嫨鐐瑰嚮浜嬩欢
- linkResultSelect (e) {
- console.log('杩為�氭�у垎鏋愮粨鏋滃垪琛ㄧ偣鍑�')
- console.log(e)
-
- // const geom = JSON.parse(e.geomText)
- // if (this.currentSelectResultLine != null) {
- // this.currentSelectResultLine.remove()
- // this.currentSelectResultLine = null
- // }
- // this.currentSelectResultLine = L.geoJSON(geom, {
- // style: function (feature) {
- // return {
- // color: 'rgba(255,0,0,.6)',
- // weight: 6
- // }
- // }
- // }).addTo(this.map)
- // this.map.panInsideBounds(this.currentSelectResultLine.getBounds())
- },
- // 杩為�氭�ф煡璇�
- async linkQuery () {
- // 璁剧疆鍒嗘瀽缁撴灉涓虹┖
- this.tableDataLinkResult = []
- if (this.linkPipeline.length > 1) {
- this.linkPipeline.forEach((itm) => {
- itm.remove()
- })
- this.linkPipeline = []
- }
- // 鍒ゆ柇 濡傛灉璧峰绠℃ 缁撴潫绠℃娌℃湁鏁版嵁 鍒欒繑鍥瀎alse 鎻愮ず杩樻湭閫夋嫨璧峰/缁撴潫绠℃
- if (this.currentSelectStart === null || this.currentSelectEnd === null) {
- this.$message('璇烽�夋嫨璧峰绠℃鍜岀粨鏉熺娈�')
- return false
- }
- // 璇锋眰鏁版嵁鏃剁殑鍙傛暟
- const param = {
- startLineID: this.currentSelectStart.id,
- endLineID: this.currentSelectEnd.id
- }
- // 璇锋眰鎺ュ彛鍜屾暟鎹�
- const res = await mapApi.findConnectedPipelines(param)
- // 鍒ゆ柇鏁版嵁缁撴灉 === 0 鍒欐病鏈夎姹傚埌鏁版嵁
- if (res.data.length === 0) {
- this.$message('娌℃湁鎵惧埌杩為�氱殑绠℃')
- this.currentLinkIsTrue = '涓嶈繛閫�'
- return
- }
- this.tableDataLinkResult = res.data
- this.currentLinkIsTrue = '杩為��'
- const linkPipe = []
- res.data.forEach((itm, idx) => {
- const geom = JSON.parse(itm.geomText)
- const points = []
- geom.coordinates.forEach((it, id) => {
- points.push(it.reverse())
- })
- linkPipe.push(points)
- })
-
- // linkPipe.forEach((itm, idx) => {
- // const param1 = {
- // points: itm,
- // option: {
- // dashArray: '15 15',
- // dashSpeed: -30,
- // color: '#ffff00'
- // }
- // }
- // const line = main.createFlowLine(param1)
- // const createFlowLine = (param) => {
- // let flowLine = L.polyline(param.points, param.option)
- // flowLine.addTo(map)
- // return flowLine
- // }
- // this.linkPipeline.push(line)
- // })
- },
- // 杩為�氭�х殑娓呴櫎鍔熻兘
- linkClear () {
- if (this.currentSelectStartLine != null) {
- this.currentSelectStartLine.remove()
- this.currentSelectStartLine = null
- }
- if (this.currentSelectEndLine != null) {
- this.currentSelectEndLine.remove()
- this.currentSelectEndLine = null
- }
- if (this.currentSelectResultLine != null) {
- this.currentSelectResultLine.remove()
- this.currentSelectResultLine = null
- }
- if (this.bgMarker != null) {
- this.bgMarker.remove()
- this.bgMarker = null
- }
- },
-
- // 鐖嗙 ===> 閫夋嫨绠℃
- bgClick () {
- this.selectPipeLine()
- },
- async bgSelect (e) {
- console.log('閫夋嫨鐖嗙绠℃')
- console.log(e)
- this.bgFm = []
- if (this.bgMarker != null) {
- this.bgMarker.remove()
- this.bgMarker = null
- }
-
- if (this.currentSelectEndLine != null) {
- this.currentSelectEndLine.remove()
- this.currentSelectEndLine = null
- }
- this.clearLinkPipe()
- // const geom = JSON.parse(e.geomText)
- // this.currentSelectEndLine = L.geoJSON(geom, {
- // style: function (feature) {
- // return { color: 'rgba(200,0,200,.6)' }
- // }
- // }).addTo(this.map)
- this.map.panInsideBounds(this.currentSelectEndLine.getBounds())
-
- // const param = {
- // lineID: e.id
- // }
- // const res = await api.findLeakages(param)
- // console.log(res)
-
- // const len = res.data.length
- // if (len === 0) {
- // this.$message('鏈壘鍒伴渶瑕佸叧闂殑闃�闂�')
- //
- // return
- // }
- // res.data.reverse()
- // this.bgFm = res.data
- //
- // this.bgPoint = res.data[0].startControlPoint
- //
- // const point = JSON.parse(this.bgPoint.geomText)
- //
- // const p = [point.coordinates[1], point.coordinates[0]]
- //
- // // this.bgMarker = main.createFlowMarker(p)
- // this.bgMarker.bindTooltip(this.bgPoint.pointnumbe)
- // this.bgMarker.addTo(this.map)
- // this.map.flyTo(p)
- //
- // const linkPipe = []
- // res.data.forEach((itm, idx) => {
- // const geom = JSON.parse(itm.geomText)
- // const points = []
- // geom.coordinates.forEach((it, id) => {
- // points.push(it.reverse())
- // })
- //
- // linkPipe.push(points)
- // })
-
- // linkPipe.forEach((itm, idx) => {
- // const param1 = {
- // points: itm,
- // option: {
- // dashArray: '15 15',
- // dashSpeed: -30,
- // color: '#ffff00'
- // }
- // }
- // const line = main.createFlowLine(param1)
- // this.linkPipeline.push(line)
- // })
- },
- bgFmClick (e) {
- console.log('鐐瑰嚮褰卞搷鐨勯榾闂�')
- console.log(e)
- const point = [e.data[0][0], e.data[0][1]]
- // const marker = main.createFlowMarker(point)
- // marker.addTo(this.map)
- this.map.flyTo(point, 16)
- },
-
- // 娴佸悜鍒嗘瀽缁撴灉table鍒楄〃鏁版嵁鐐瑰嚮
- lxResultSelect (e) {
- console.log('杩為�氭�у垎鏋愮粨鏋滃垪琛ㄧ偣鍑�')
- console.log(e)
-
- // const geom = JSON.parse(e.geomText)
- // if (this.currentSelectResultLine != null) {
- // this.currentSelectResultLine.remove()
- // this.currentSelectResultLine = null
- // }
- // this.currentSelectResultLine = L.geoJSON(geom, {
- // style: function (feature) {
- // return { color: 'rgba(0,250,255,.6)' }
- // }
- // }).addTo(this.map)
- // this.map.panInsideBounds(this.currentSelectResultLine.getBounds())
- },
- // 鐐瑰嚮鏄剧ず娴佸悜 table鍒楄〃鏁版嵁
- async lxQuery (e) {
- console.log(e)
- this.clearLinkPipe()
- // const param = {
- // lineNodeID: e.startpoint
- // }
- // const res = await api.findFlowDirection(param)
-
- // this.lxTableDataResult = res.data
- // const linkPipe = []
- // res.data.forEach((itm, idx) => {
- // const geom = JSON.parse(itm.geomText)
- // const points = []
- // geom.coordinates.forEach((it, id) => {
- // points.push(it.reverse())
- // })
- //
- // linkPipe.push(points)
- // })
-
- // linkPipe.forEach((itm, idx) => {
- // // const param1 = {
- // // points: itm,
- // // option: {
- // // dashArray: '15 15',
- // // dashSpeed: -30,
- // // color: '#ffff00'
- // // }
- // // }
- // // const line = main.createFlowLine(param1)
- // // this.linkPipeline.push(line)
- // })
- },
- // 娓呴櫎娴佸悜
- clearLX () {
- if (this.flowPipeLine != null) {
- this.flowPipeLine.remove()
- this.flowPipeLine = null
- }
- },
-
- // 娴佸悜鏁版嵁璇锋眰
- async getPipeLine (point) {
- const param = {
- x: point[0],
- y: point[1],
- radius: 3
- }
- console.log(param)
-
- // 鏍规嵁鍙傛暟璇锋眰鎺ュ彛鏁版嵁
- // const res = await api.getPipeline(param)
- // 3 娴佸悜
-
- // if (this.activeName === 'first') {
- // if (this.linkType) {
- // this.tableDataLinkStart = res.data
- // } else {
- // this.tableDataLinkEnd = res.data
- // }
- // } else if (this.activeName === 'second') {
- // this.bgPipeLine = res.data
- // } else if (this.activeName === 'third') {
- // this.tableDataLiuxiang = res.data
- // } else if (this.activeName === 'fourth') {
- //
- // }
- //
- // console.log(res)
- },
- // 娴佸悜-绠＄嚎閫夋嫨
- selectRowLiuXiang (e) {
- // 閫夋嫨瑕佹樉绀虹殑娴佸悜绾�
- console.log('閫夋嫨瑕佹樉绀虹殑娴佸悜绾�')
- console.log(e)
- },
- lxHandleClick (e) {
- console.log('姝ｆ祦鍚戞樉绀�')
- console.log(e)
-
- this.clearLX()
- // const param = {
- // points: e.data,
- // option: {
- // dashArray: '15 15',
- // dashSpeed: -30
- // }
- // }
- // this.flowPipeLine = main.createFlowLine(param)
- },
-
- // 娓呮鍒嗘瀽缁撴灉
- clearLinkPipe () {
- if (this.linkPipeline.length > 0) {
- this.linkPipeline.forEach((itm, idx) => {
- itm.remove()
- })
- }
- this.linkPipeline = []
- },
- // 閫嗘祦鍚戞樉绀�
- lxHandleClick2 (e) {
- console.log('閫嗘祦鍚戞樉绀�')
- console.log(e)
- if (this.flowPipeLine != null) {
- this.flowPipeLine.remove()
- this.flowPipeLine = null
- }
- // const param = {
- // points: e.data,
- // option: {
- // dashArray: '15 15',
- // dashSpeed: 30
- // }
- // }
- // this.flowPipeLine = main.createFlowLine(param)
- },
- // 妯柇闈㈢粯鍒剁嚎娈�
- drawLine () {
- console.log('drawLine')
- if (this.measure === null) {
- this.measure = new DrawLine(this.map)
- }
- this.measure.destory()
- this.measure.init()
- },
- // 妯柇闈㈡暟鎹姹�
- async getHdmPoint (line) {
- console.log('妯柇闈㈢殑缁樺埗绾�')
- console.table(line)
- this.hdmParam = {
- x1: line[0].lng,
- y1: line[0].lat,
- x2: line[1].lng,
- y2: line[1].lat
- }
- },
- // 妯柇闈㈡暟鎹姹�
- async jdmQuery () {
- if (this.hdmParam == null) {
- this.$message('璇峰厛鍦ㄥ湴鍥句笂缁樺埗鎴柇绾�')
- return false
- }
- // 宸茬粯鍒剁嚎鍥� 杩涜缁樺埗妯柇闈㈡暟鎹垎鏋�
- // const res = await api.getCrossSection(this.hdmParam)
- // console.log(res)
- },
- // 妯柇闈㈢粯鍒跺畬鎴愬悗 杩涜妯柇闈㈡暟鎹垎鏋� 杩涜鍥捐〃灞曠ず
- async selectRow (e) {
- console.log(e)
- // 3. 浣跨敤鍒氭寚瀹氱殑閰嶇疆椤瑰拰鏁版嵁锛屾樉绀哄浘琛�
- const option = {
- xAxis: {
- type: 'category',
- data: ['浜�1', '浜�2', '浜�3', '浜�4', '浜�5', '浜�6', '浜�7']
- },
- yAxis: {
- type: 'value'
- },
- series: [{
- data: [820, 932, 901, 934, 1290, 1330, 1320],
- type: 'line'
- }]
- }
- this.myChartShow = true
- this.myChart.setOption(option)
- },
- // 妯柇闈㈡竻闄�
- jdmClear () {
- this.hdmParam = null
- if (this.measure != null) {
- this.measure.destory()
- }
+ eventBus.$emit('tabData-change', true)
}
}
}
</script>
<style lang="less" scoped>
-/deep/ .el-tabs__header {
- background: none !important;
-}
+ /deep/ .el-tabs .el-tabs__item {
+ height: 20px;
+ line-height: 20px;
+ }
-/deep/ .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
- padding-left: 20px;
-}
+ /deep/ .el-tabs--border-card > .el-tabs__content {
+ padding: 5px;
+ }
-/deep/ .el-tabs--border-card {
- background: none;
- border: none;
- box-shadow: none;
-}
+ /deep/ .el-table .has-gutter tr th {
+ border: none !important;
+ }
-/deep/ .el-tabs--border-card > .el-tabs__header {
- background: none;
- border-bottom: none;
- margin: 0;
-}
+ /deep/ .el-table tbody tr:hover > td {
+ background: none !important
+ }
-/deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
- color: #409EFF;
- background: none;
- border: none;
-}
+ /deep/ .el-tabs__header {
+ background: none !important;
+ }
-/deep/ .el-tabs--border-card > .el-tabs__header .el-tabs__item {
- border: none;
-}
+ /deep/ .fixed-style {
+ /*margin: 15px;*/
+ font-size: 12px;
+ display: inline-block;
+ color: #00fff6;
+ }
-/deep/ .panel-right ::-webkit-scrollbar-thumb {
- background: none;
- border: none;
-}
+ /deep/ th.is-leaf {
+ border: none !important;
+ }
-/deep/ .el-card {
- margin-top: 15px;
- background: rgba(0, 16, 30, 0.5);
- //border: 0.00521rem solid @color;
- box-shadow: 0 0 0.03rem @color;
-}
+ /deep/ .el-table__fixed-right::before, .el-table__fixed::before {
+ background: none;
+ }
-/deep/ .el-card__body {
- padding: 0;
-}
+ /deep/ .el-table__empty-text {
+ line-height: 170px;
+ }
-/deep/ .clearfixs {
- display: inline-block;
- color: #ffffff;
- margin: 15px;
-}
+ /deep/ .el-table__body .el-table__row.hover-row td {
+ background: none !important;
+ color: yellow;
+ }
-/deep/ .fixed-table {
- background: rgba(0, 16, 30, 1) !important;
-}
+ /deep/ .el-table__body tr.current-row > td {
+ background: rgba(0, 16, 30, 1) !important;
+ }
+
+ /deep/ .fixed-table {
+ background: rgba(0, 16, 30, 1) !important;
+ }
+
+ /*scroll鍙充晶鍗犱綅*/
+ /deep/ .el-table__fixed-right-patch {
+ display: none;
+ }
+
+ /deep/ .el-tab-pane {
+ min-height: 506.19px;
+ }
+
+ /*/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