派生自 wuyushui/SewerAndRainNetwork
src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue
@@ -1,139 +1,14 @@ <template> <div class="sewers-analysis-tab"> <!--<transition name="el-fade-in-linear">--> <!--<el-card>--> <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick"> <el-tab-pane label="连通性" name="first"> <el-row> <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> </el-row> <!-- <el-scrollbar style="height:450px">--> <!-- <el-card shadow="hover">--> <span class="fixed-style">起始管段</span> <el-table class="tableBox" height="100" max-height="200" :data="tableDataLinkStart" 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 width="40" fixed="right" class-name="fixed-table" 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="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="操作" 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" 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> </el-table-column> </el-table> <!--</el-card>--> <!--</el-scrollbar>--> <Connectivity></Connectivity> </el-tab-pane> <el-tab-pane label="爆管" style="color: #cccccc" name="second"> <el-row> <span>爆管（相关开关）</span> <el-button type="primary" @click="bgClick" size="mini" title="地图上点击选择发生爆管的管段">选择管段</el-button> <el-button type="primary" @click="handleClick" size="mini" 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="操作" 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="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> </el-table-column> </el-table> <!-- </el-card>--> <Tube></Tube> </el-tab-pane> <el-tab-pane label="流向" name="third"> <el-button type="primary" @click="selectPipeLine" size="mini" highlight-current-row title="地图上点击要显示流向的管段">选择管段 </el-button> <el-table max-height="200" class="tableBox" highlight-current-row :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="操作" width="40"> <template slot-scope="scope"> <el-button @click="linkResultSelect(scope.row)" type="text" size="small">定位</el-button> </template> </el-table-column> </el-table> <Flow></Flow> </el-tab-pane> <el-tab-pane label="横断面" name="fourth"> <el-row> @@ -170,8 +45,6 @@ style="width:350px;height:200px;margin: 0 auto"></div><!-- v-show="myChartShow" --> </el-tab-pane> </el-tabs> <!--</el-card>--> <!--</transition>--> </div> </template> @@ -181,10 +54,17 @@ import DrawLine from './AnalysisChoose/DrawLine' import mapApi from '../../../../api/mapApi' import { pulseEffect } from '../../../../utils/utils' // import iconUrl from '../../../../assets/images/other.png' import Connectivity from './AnalysisChoose/Connectivity' import Tube from './AnalysisChoose/Tube' import Flow from './AnalysisChoose/Flow' export default { name: 'SewersAnalysis', components: { Connectivity, Tube, Flow }, data () { return { // 地图点击类型 first连通性点击 second爆管点击 third流向点击 fourth横断面 @@ -439,10 +319,10 @@ this.linkPipeline.push(line) }) }, // 连通性 分析结果table列表数据选择点击事件 // 定位方法事件 linkResultSelect (e) { // console.log('连通性分析结果列表点击') // console.log(e) console.log(e) const geom = JSON.parse(e.geomText) if (this.currentSelectResultLine != null) { this.currentSelectResultLine.remove() @@ -483,8 +363,8 @@ this.selectPipeLine() }, async bgSelect (e) { console.log('选择爆管管段') console.log(e) // console.log('选择爆管管段') // console.log(e) this.bgFm = [] if (this.bgMarker != null) { this.bgMarker.remove() @@ -527,9 +407,7 @@ this.bgPoint = res.data[0].startControlPoint // const point = JSON.parse(this.bgPoint.geomText) // const p = [point.coordinates[1], point.coordinates[0]] // this.bgMarker = this.createFlowMarker(p) // this.bgMarker = pulseEffect(p) // this.bgMarker.bindTooltip(this.bgPoint.pointnumbe)
