From e955287ac83d12c1545db512d9af7ed5a15db21c Mon Sep 17 00:00:00 2001 From: chenyabin <Chenab123!> Date: 星期一, 10 五月 2021 15:05:47 +0800 Subject: [PATCH] 管线搜索弹框整体调整 --- src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue | 672 +++++++++++++++++--------------------------------------- 1 files changed, 204 insertions(+), 468 deletions(-) diff --git a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue index 955ca38..8f2624c 100644 --- a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue +++ b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue @@ -4,152 +4,45 @@ <!--<el-card>--> <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="handleClick" size="mini" style="margin-bottom: 5px;" - title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">娓呴櫎 - </el-button> + <div> + <el-button type="primary" @click="linkClickStart" size="mini" title="鍦板浘涓婄偣鍑婚�夋嫨闇�瑕佽繘琛岃繛閫氬垎鏋愮殑绠℃">璧峰绠℃</el-button> + <el-button type="primary" @click="linkClickEnd" size="mini" title="鍦板浘涓婄偣鍑讳笌鎵�閫夌娈佃繛閫氱娈�">缁撴潫绠℃</el-button> + <el-button type="primary" @click="linkQuery" size="mini" title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">杩為�氭�у垎鏋�</el-button> + <el-button type="primary" @click="handleClick" size="mini" title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">娓呴櫎</el-button> + </div> <!-- <el-scrollbar style="height:450px">--> <!-- <el-card shadow="hover">--> <span class="fixed-style">璧峰绠℃</span> - <el-table - class="tableBox" - max-height="200" - highlight-current-row - :data="tableDataLinkStart" - @row-click="linkSelectStart" - style="width: 100%" size="mini"> - <el-table-column - prop="datasource" - label="绠$嚎绫诲瀷" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="绠$嚎鍚嶇О" - > - </el-table-column> - <el-table-column - sortable - width="100" - prop="material" - label="璧风偣缂栧彿" - > - </el-table-column> - <el-table-column - sortable - width="100" - prop="material" - label="缁堢偣缂栧彿" - > - </el-table-column> - <el-table-column - fixed="right" - class-name="fixed-table" - label="鎿嶄綔" - > + <el-table class="tableBox" height="100" max-height="200" :data="tableDataLinkStart" @row-click="linkSelectStart" highlight-current-row style="width: 100%" size="mini"> + <el-table-column prop="datasource" label="绠℃绫诲瀷"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="绠℃鍚嶇О"></el-table-column> + <el-table-column sortable width="100" prop="material" label="璧风偣缂栧彿"></el-table-column> + <el-table-column sortable width="100" prop="material" label="缁堢偣缂栧彿"></el-table-column> + <el-table-column fixed="right" class-name="fixed-table" label="鎿嶄綔" width="40"> <template slot-scope="scope"> <el-button @click="linkSelectStart(scope.row)" type="text" size="small">閫夋嫨</el-button> </template> </el-table-column> </el-table> <span class="fixed-style">缁撴潫绠℃</span> - <el-table - class="tableBox" - height="100" - max-height="200" - highlight-current-row - :data="tableDataLinkEnd" - @row-click="linkSelectEnd" - style="width: 100%" size="mini"> - <el-table-column - prop="datasource" - label="绠$嚎绫诲瀷" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="绠$嚎鍚嶇О" - > - </el-table-column> - <el-table-column - sortable - width="100" - prop="material" - label="璧风偣缂栧彿" - > - </el-table-column> - <el-table-column - sortable - width="100" - prop="material" - label="缁堢偣缂栧彿" - > - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔" - > + <el-table class="tableBox" height="100" max-height="200" highlight-current-row :data="tableDataLinkEnd" @row-click="linkSelectEnd" style="width: 100%" size="mini"> + <el-table-column prop="datasource" label="绠℃绫诲瀷"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="绠℃鍚嶇О"></el-table-column> + <el-table-column sortable width="100" prop="material" label="璧风偣缂栧彿"></el-table-column> + <el-table-column sortable width="100" prop="material" label="缁堢偣缂栧彿"></el-table-column> + <el-table-column class-name="fixed-table" fixed="right" label="鎿嶄綔" width="40"> <template slot-scope="scope"> <el-button @click="linkSelectEnd(scope.row)" type="text" size="small">閫夋嫨</el-button> </template> </el-table-column> </el-table> <span class="fixed-style">鍒嗘瀽缁撴灉:<span style="color: red;margin-left: 15px">{{ currentLinkIsTrue }}</span></span> - <el-table - class="tableBox" - highlight-current-row - max-height="200" - :data="tableDataLinkResult" - @row-click="linkResultSelect" - style="width: 100%" size="mini"> - - <el-table-column - prop="material" - label="绠$嚎绫诲瀷" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="绠$嚎鍚嶇О" - > - </el-table-column> - <el-table-column - sortable - width="100" - prop="material" - label="璧风偣缂栧彿" - > - </el-table-column> - <el-table-column - sortable - width="100" - prop="material" - label="缁堢偣缂栧彿" - > - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔" - > + <el-table class="tableBox" highlight-current-row max-height="200" :data="tableDataLinkResult" @row-click="linkResultSelect" style="width: 100%" size="mini"> + <el-table-column prop="material" label="绠℃绫诲瀷"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="绠℃鍚嶇О"></el-table-column> + <el-table-column sortable width="100" prop="material" label="璧风偣缂栧彿"></el-table-column> + <el-table-column sortable width="100" prop="material" label="缁堢偣缂栧彿"></el-table-column> + <el-table-column class-name="fixed-table" fixed="right" label="鎿嶄綔" width="40"> <template slot-scope="scope"> <el-button @click="linkResultSelect(scope.row)" type="text" size="small">瀹氫綅</el-button> </template> @@ -159,110 +52,32 @@ <!--</el-card>--> <!--</el-scrollbar>--> </el-tab-pane> - <el-tab-pane label="鐖嗙" style=";color: #cccccc" name="second"> + <el-tab-pane label="鐖嗙" style="color: #cccccc" name="second"> <el-row> <span>鐖嗙锛堢浉鍏冲紑鍏筹級</span> - <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-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-row> <!-- <el-card shadow="hover">--> <span class="fixed-style">鍙戠敓鐖嗚鐨勭娈�</span> - <el-table - max-height="200" - class="tableBox" - ref="singleTable" - highlight-current-row - :data="bgPipeLine" - style="width: 100%" size="mini"> - <el-table-column - :show-overflow-tooltip="true" - prop="pipecode" - label="绠$嚎绫诲瀷" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="绠$嚎鍚嶇О" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="璧风偣缂栧彿" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="缁堢偣缂栧彿" - > - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔" - > + <el-table max-height="200" class="tableBox" ref="singleTable" highlight-current-row :data="bgPipeLine" style="width: 100%" size="mini"> + <el-table-column :show-overflow-tooltip="true" prop="pipecode" label="绠℃绫诲瀷"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="绠℃鍚嶇О"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="璧风偣缂栧彿"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="缁堢偣缂栧彿"></el-table-column> + <el-table-column class-name="fixed-table" fixed="right" label="鎿嶄綔" width="40"> <template slot-scope="scope"> <el-button @click="bgSelect(scope.row)" type="text" size="small">閫夋嫨</el-button> </template> </el-table-column> </el-table> <span class="fixed-style">闇�瑕佸叧闂殑闃�闂�</span> - <el-table - class="tableBox" - highlight-current-row - max-height="200" - :data="bgFm" - @row-click="bgFmClick" - style="width: 100%" size="mini"> - <el-table-column - :show-overflow-tooltip="true" - prop="lineloopna" - label="绠$嚎绫诲瀷" - > - </el-table-column> - <el-table-column - sortable - :show-overflow-tooltip="true" - width="100" - prop="pipecode" - label="绠$嚎鍚嶇О" - > - </el-table-column> - <el-table-column - sortable - :show-overflow-tooltip="true" - width="100" - prop="startpoint" - label="璧风偣缂栧彿" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="endpointnu" - label="缁堢偣缂栧彿" - > - </el-table-column> - - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔" - > + <el-table class="tableBox" highlight-current-row max-height="200" :data="bgFm" @row-click="bgFmClick" style="width: 100%" size="mini"> + <el-table-column :show-overflow-tooltip="true" prop="pipecode" label="绠℃绫诲瀷"></el-table-column> + <el-table-column sortable :show-overflow-tooltip="true" width="100" prop="pipecode" label="绠℃鍚嶇О"></el-table-column> + <el-table-column sortable :show-overflow-tooltip="true" width="100" prop="pipecode" label="璧风偣缂栧彿"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="缁堢偣缂栧彿"></el-table-column> + <el-table-column class-name="fixed-table" fixed="right" label="鎿嶄綔" width="40"> <template slot-scope="scope"> <el-button @click="linkResultSelect(scope.row)" type="text" size="small">瀹氫綅</el-button> </template> @@ -271,152 +86,61 @@ <!-- </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 - max-height="200" - class="tableBox" - :data="tableDataLiuxiang" size="mini"> - <el-table-column - :show-overflow-tooltip="true" - prop="pipecode" - label="绠$嚎绫诲瀷" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="绠$嚎鍚嶇О" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="璧风偣缂栧彿" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="缁堢偣缂栧彿" - > - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔" - width="100" - > + <el-button type="primary" @click="selectPipeLine" size="mini" style="margin-bottom: 5px;" title="鍦板浘涓婄偣鍑昏鏄剧ず娴佸悜鐨勭娈�">閫夋嫨绠℃</el-button> + <el-table max-height="200" class="tableBox" :data="tableDataLiuxiang" size="mini"> + <el-table-column :show-overflow-tooltip="true" prop="pipecode" label="绠℃绫诲瀷"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="绠℃鍚嶇О"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="璧风偣缂栧彿"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="缁堢偣缂栧彿"></el-table-column> + <el-table-column class-name="fixed-table" fixed="right" label="鎿嶄綔" width="60"> <template slot-scope="scope"> <el-button @click="lxQuery(scope.row)" type="text" size="small">鏄剧ず娴佸悜</el-button> </template> </el-table-column> </el-table> <span class="fixed-style">鍒嗘瀽缁撴灉</span> - <el-table - class="tableBox" - highlight-current-row - max-height="200" - :data="lxTableDataResult" - @row-click="lxResultSelect" - style="width: 100%" size="mini"> - - <el-table-column - :show-overflow-tooltip="true" - prop="pipecode" - label="绠$嚎绫诲瀷" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - width="100" - sortable - prop="pipecode" - label="绠$嚎鍚嶇О" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="璧风偣缂栧彿" - > - </el-table-column> - <el-table-column - :show-overflow-tooltip="true" - sortable - width="100" - prop="pipecode" - label="缁堢偣缂栧彿" - > - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔" - > + <el-table class="tableBox" highlight-current-row max-height="200" :data="lxTableDataResult" @row-click="lxResultSelect" style="width: 100%" size="mini"> + <el-table-column :show-overflow-tooltip="true" prop="pipecode" label="绠℃绫诲瀷"></el-table-column> + <el-table-column :show-overflow-tooltip="true" width="100" sortable prop="pipecode" label="绠℃鍚嶇О"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="璧风偣缂栧彿"></el-table-column> + <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipecode" label="缁堢偣缂栧彿"></el-table-column> + <el-table-column class-name="fixed-table" fixed="right" label="鎿嶄綔" width="40"> <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> + <div> + <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> + </div> <!-- <el-card class="box-card">--> <div slot="header" class="fixed-style"> - <span>绠$嚎鏌ヨ缁撴灉</span> + <span>绠℃鏌ヨ缁撴灉</span> </div> - <el-table - class="tableBox" - :data="tableData" - max-height="200" - style="width: 100%" @row-click="selectRow" size="mini"> - <el-table-column - prop="pipename" - label="绠$嚎鍚嶇О" - width="180"> - </el-table-column> - <el-table-column - prop="mediumtype" - label="绠$嚎绫诲瀷" - width="180"> - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鍥捐〃鏌ョ湅" - > + <el-table class="tableBox" :data="tableData" max-height="200" style="width: 100%" @row-click="selectRow" size="mini"> + <el-table-column prop="pipename" label="绠℃鍚嶇О"></el-table-column> + <el-table-column prop="mediumtype" label="绠℃绫诲瀷" width="80"></el-table-column> + <el-table-column class-name="fixed-table" fixed="right" label="鍥捐〃" width="40"> <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"> + <!-- <el-card class="box-card"> <div slot="header" class="fixed-style"> <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: 350px;height:200px;"></div> - </el-card> + </el-card> --> + <span class="fixed-style">鏂潰鍥�</span> + <span v-show="!myChartShow" style="color: #909399;font-size: 12px;height: 200px;display: block;text-align: center;line-height: 200px">鏆傛棤鏁版嵁</span> + <div v-show="myChartShow" id="echarts_box" ref="myChart" style="width:350px;height:200px;margin: 0 auto"></div><!-- v-show="myChartShow" --> </el-tab-pane> </el-tabs> <!--</el-card>--> @@ -429,6 +153,7 @@ import eventBus from '../../../../eventBus' import DrawLine from './AnalysisChoose/DrawLine' import mapApi from '../../../../api/mapApi' +import iconUrl from '../../../../assets/images/other.png' export default { name: 'SewersAnalysis', @@ -440,6 +165,7 @@ map: window.map, myChart: null, + options: [], myChartShow: false, flowPipeLine: null, @@ -478,7 +204,7 @@ // 娴佸悜 鍒嗘瀽缁撴灉 鐨則able琛ㄦ牸鏁版嵁 lxTableDataResult: [], - // 妯柇闈� 绠$嚎鏌ヨ缁撴灉 鐨則able琛ㄦ牸鏁版嵁 + // 妯柇闈� 绠℃鏌ヨ缁撴灉 鐨則able琛ㄦ牸鏁版嵁 tableData: [], echartsList: [] @@ -512,15 +238,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) { @@ -531,6 +266,7 @@ } // 鏍规嵁鍙傛暟璇锋眰鎺ュ彛鏁版嵁 const res = await mapApi.findPipelineByClickPoint(param) + console.log(res) if (this.activeName === 'first') { if (this.linkType === 1) { this.tableDataLinkStart = res.data @@ -543,8 +279,6 @@ this.tableDataLiuxiang = res.data } else if (this.activeName === 'fourth') { } - // debugger - console.log(res.data) }, // 娴佸悜鏄剧ず 鐨勬柟娉曞弬鏁板皝 createFlowLine (param) { @@ -554,31 +288,24 @@ }, createFlowMarker (point) { return window.L.marker(point, { - icon: window.L.divIcon({ - className: 'dIcon', - html: '<div class="plane live">' + - // '<img src="'+require("../../assets/images/map/ship.png")+ - '<div style="position: absolute;' + - ' width: 20px;' + - ' height: 20px;' + - ' border-radius: 50%;' + - ' content: \'\'; background-color: #FF664A;"/>' + - '<span></span><span></span></div></>', - iconSize: [90, 36] + icon: window.L.icon({ + iconUrl: iconUrl, + iconSize: [30, 30], + iconAnchor: [15, 15] }) }) }, // 杩為�氭�� ===> 鍦板浘鐐瑰嚮璧峰绠℃e linkClickStart (e) { - console.log(e) - console.log('鍦板浘鐐瑰嚮璧峰绠℃') + // console.log(e) + // console.log('鍦板浘鐐瑰嚮璧峰绠℃') this.linkType = 1 this.selectPipeLine() }, // 杩為�氭�� 璧峰绠℃ table鍒楄〃鏁版嵁 閫夋嫨鏁版嵁浜嬩欢 鐨勭偣鍑讳簨浠� linkSelectStart (e) { - console.log('閫夋嫨璧峰绠℃') + // console.log('閫夋嫨璧峰绠℃') // this.$refs.singleTable.setCurrentRow(e) this.currentSelectStart = e if (this.currentSelectStartLine != null) { @@ -588,14 +315,17 @@ const geom = JSON.parse(e.geomText) this.currentSelectStartLine = window.L.geoJSON(geom, { style: function (feature) { - return { color: 'rgba(0,255,0,.6)' } + return { + weight: 10, + color: 'rgba(0,255,0,.6)' + } } }).addTo(window.map) window.map.panInsideBounds(this.currentSelectStartLine.getBounds()) }, // 杩為�氭�� ===> 鍦板浘鐐瑰嚮缁撴潫绠℃ linkClickEnd () { - console.log('鍦板浘鐐瑰嚮缁撴潫绠℃') + // console.log('鍦板浘鐐瑰嚮缁撴潫绠℃') this.linkType = 0 this.selectPipeLine() }, @@ -613,7 +343,10 @@ const geom = JSON.parse(e.geomText) this.currentSelectEndLine = window.L.geoJSON(geom, { style: function (feature) { - return { color: 'rgba(200,0,200,.6)' } + return { + weight: 10, + color: 'rgba(255, 247, 0, 0.6)' + } } }).addTo(window.map) window.map.panInsideBounds(this.currentSelectEndLine.getBounds()) @@ -639,14 +372,16 @@ startLineID: this.currentSelectStart.pipesegcode, endLineID: this.currentSelectEnd.pipesegcode } - console.log(param) + // console.log(param) // 璇锋眰鎺ュ彛鍜屾暟鎹� const res = await mapApi.findConnectedPipelines(param) - console.log(res) + // console.log(res) // 鍒ゆ柇鏁版嵁缁撴灉 === 0 鍒欐病鏈夎姹傚埌鏁版嵁 if (res.data.length === 0) { this.$message('娌℃湁鎵惧埌杩為�氱殑绠℃') + // if (this.tableDataLinkStart === [] && this.tableDataLinkEnd === []) { this.currentLinkIsTrue = '涓嶈繛閫�' + // } return } this.tableDataLinkResult = res.data @@ -677,9 +412,8 @@ }, // 杩為�氭�� 鍒嗘瀽缁撴灉table鍒楄〃鏁版嵁閫夋嫨鐐瑰嚮浜嬩欢 linkResultSelect (e) { - console.log('杩為�氭�у垎鏋愮粨鏋滃垪琛ㄧ偣鍑�') - console.log(e) - + // console.log('杩為�氭�у垎鏋愮粨鏋滃垪琛ㄧ偣鍑�') + // console.log(e) const geom = JSON.parse(e.geomText) if (this.currentSelectResultLine != null) { this.currentSelectResultLine.remove() @@ -689,7 +423,7 @@ style: function (feature) { return { color: 'rgba(255,0,0,.6)', - weight: 6 + weight: 10 } } }).addTo(window.map) @@ -737,7 +471,10 @@ const geom = JSON.parse(e.geomText) this.currentSelectEndLine = window.L.geoJSON(geom, { style: function (feature) { - return { color: 'rgba(200,0,200,.6)' } + return { + weight: 10, + color: 'rgba(200,0,200,.6)' + } } }).addTo(window.map) window.map.panInsideBounds(this.currentSelectEndLine.getBounds()) @@ -747,7 +484,7 @@ lineID: e.pipesegcode } const res = await mapApi.findLeakages(param) - console.log(res) + // console.log(res) const len = res.data.length if (len === 0) { @@ -756,7 +493,7 @@ } res.data.reverse() this.bgFm = res.data - console.log(res.data) + // console.log(res.data) this.bgPoint = res.data[0].startControlPoint @@ -765,7 +502,7 @@ const p = [point.coordinates[1], point.coordinates[0]] this.bgMarker = this.createFlowMarker(p) - this.bgMarker.bindTooltip(this.bgPoint.pointnumbe) + // this.bgMarker.bindTooltip(this.bgPoint.pointnumbe) this.bgMarker.addTo(window.map) window.map.flyTo(p) @@ -793,12 +530,13 @@ }) }, bgFmClick (e) { - console.log('鐐瑰嚮褰卞搷鐨勯榾闂�') + // 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.y, e.startControlPoint.x] const marker = this.createFlowMarker(point) - marker.addTo(this.map) - window.map.flyTo(point, 16) + marker.addTo(window.map) + window.map.flyTo(point, 17) }, // 娴佸悜鍒嗘瀽缁撴灉table鍒楄〃鏁版嵁鐐瑰嚮 @@ -813,7 +551,10 @@ } this.currentSelectResultLine = window.L.geoJSON(geom, { style: function (feature) { - return { color: 'rgba(0,250,255,.6)' } + return { + weight: 10, + color: 'rgba(0,250,255,.6)' + } } }).addTo(window.map) window.map.panInsideBounds(this.currentSelectResultLine.getBounds()) @@ -858,7 +599,7 @@ this.flowPipeLine = null } }, - // 娴佸悜-绠$嚎閫夋嫨 + // 娴佸悜-绠℃閫夋嫨 selectRowLiuXiang (e) { // 閫夋嫨瑕佹樉绀虹殑娴佸悜绾� // console.log('閫夋嫨瑕佹樉绀虹殑娴佸悜绾�') @@ -950,6 +691,7 @@ let tempData const storeData = [] const dataList = [] + this.echartsList = [] for (let i = 0; i < dataSeries.length; i++) { if (storeData.length === 0) { storeData.push(name) @@ -962,7 +704,7 @@ } dataList.push(dataSeries[i].pipelines.oilPipeID) } - console.log(dataList) + // console.log(dataList) // const seriesList = e.data.pointInterval // let seriesdata // for (let i = 0; i < seriesList.length; i++) { @@ -975,7 +717,7 @@ selectRow (dataList) { // console.log(dataList) // 3. 浣跨敤鍒氭寚瀹氱殑閰嶇疆椤瑰拰鏁版嵁锛屾樉绀哄浘琛� - const option = { + this.option = { tooltip: { trigger: 'axis', axisPointer: { @@ -985,10 +727,10 @@ } } }, - legend: { - // data: ['鐩存帴璁块棶', '鎼滅储寮曟搸'] - data: dataList - }, + // legend: { + // // data: ['鐩存帴璁块棶', '鎼滅储寮曟搸'] + // data: dataList + // }, toolbox: { show: false, feature: { @@ -996,10 +738,11 @@ } }, grid: { - // left: '3%', - // right: '4%', - // bottom: '3%', - // containLabel: true + left: '10px', + right: '0', + top: '10px', + bottom: '5px', + containLabel: true }, xAxis: [ { @@ -1010,9 +753,9 @@ textStyle: { color: '#fff' } - }, + } // data: ['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄦ棩'] - data: dataList + // data: dataList } ], yAxis: [ @@ -1045,13 +788,16 @@ series: this.echartsList } this.myChartShow = true - this.myChart.setOption(option) + this.myChart.clear() + this.myChart.setOption(this.option) }, // 妯柇闈㈡竻闄� jdmClear () { this.hdmParam = null this.tableData = [] + this.option = [] this.myChartShow = false + this.myChart.clear() if (this.measure != null) { this.measure.destory() } @@ -1061,32 +807,13 @@ </script> <style lang="less" scoped> - /*****婊氬姩鏉�***/ - /deep/ .tableBox { - .el-table__fixed-right-patch { - display: none; - } + /deep/ .el-tabs .el-tabs__item{ + height: 20px; + line-height: 20px; } - - /deep/ .tableBox::-webkit-scrollbar { - /*婊氬姩鏉℃暣浣撴牱寮�*/ - width: 10px; /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/ - /*height: 10px;*/ + /deep/ .el-tabs--border-card>.el-tabs__content{ + padding: 5px; } - - /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; } @@ -1099,55 +826,10 @@ 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 { font-size: 12px; display: inline-block; - color: #ffffff; - margin: 15px; + color: #00fff6; } /deep/ th.is-leaf { @@ -1157,14 +839,68 @@ /deep/ .el-table__fixed-right::before, .el-table__fixed::before { background: none; } + /deep/ .el-table__empty-text{ + line-height: 170px; + } - /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__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; } + + /*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