派生自 wuyushui/SewerAndRainNetwork
src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue
@@ -10,11 +10,14 @@ <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" <el-table-column prop="mediumtype" label="管段类型"></el-table-column> <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipename" 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 sortable width="100" prop="startpointnumber" label="起点编号"></el-table-column> <el-table-column sortable width="100" prop="endpointnumber" label="终点编号"></el-table-column> <!-- <el-table-column v-for="(item, index) in tableDataLinkStartList" :key="index" :prop="item.prop"--> <!-- :label="item.label" :show-overflow-tooltip="true" min-width="100" :sortable="item.sortable">--> <!-- </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> @@ -24,11 +27,11 @@ <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" <el-table-column prop="mediumtype" label="管段类型"></el-table-column> <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipename" 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 sortable width="100" prop="startpointnumber" label="起点编号"></el-table-column> <el-table-column sortable width="100" prop="endpointnumber" 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> @@ -38,11 +41,11 @@ <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" <el-table-column prop="mediumtype" label="管段类型"></el-table-column> <el-table-column :show-overflow-tooltip="true" sortable width="100" prop="pipename" 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 sortable width="100" prop="startpointnumber" label="起点编号"></el-table-column> <el-table-column sortable width="100" prop="endpointnumber" 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> @@ -56,16 +59,39 @@ <script> import mapApi from '../../../../../api/mapApi' import eventBus from '../../../../../eventBus' import { createFlowLine } from './PublicWay' export default { name: 'Connectivity', props: ['tableData'], data () { return { // 连通性 // 1 连通性起始管段 0 连通性结束管段 用来判断是点击了起始 还是结束管段 linkType: 1, // 连通性 起始管段 表格数据 tableDataLinkStart: [], tableDataLinkStartList: [// table 表格定义的字段 { label: '管段类型', prop: 'datasource' }, { label: '管段名称', prop: 'pipecode', sortable: true }, { label: '起点编号', prop: 'material', sortable: true }, { label: '终点编号', prop: 'material', sortable: true } ], // 连通性 结束管段 表格数据 tableDataLinkEnd: [], // 连通性 分析结果 展示 => 连通 || 不连通 @@ -81,18 +107,30 @@ flowPipeLine: null } }, mounted () { this.$nextTick(() => { eventBus.$on('tabData-change', (obj) => { if (obj) { this.handleClick() } }) }) }, methods: { // 地图上点击 selectPipeLine () { window.map.on('click', this.selectClick) // 关闭弹窗 window.layerFactory.clickSwitch = false // window.mapManager.clickDialogSwitch = false }, // 地图上点击回调 selectClick (e) { // console.log(e) window.map.off('click', this.selectClick) window.mapManager.clickDialogSwitch = false const point = [e.latlng.lng, e.latlng.lat] this.getPipeLine(point) // this.getPipeLine(point, this.linkType) // window.mapManager.clickDialogSwitch = true }, // 点击获取判断数据 async getPipeLine (point) { @@ -103,7 +141,7 @@ } // 根据参数请求接口数据 const res = await mapApi.findPipelineByClickPoint(param) // console.log(res) console.log(res) if (this.linkType === 1) { this.tableDataLinkStart = res.data } else { @@ -112,7 +150,6 @@ }, // 连通性 ===> 地图点击起始管段e linkClickStart (e) { // console.log('地图点击起始管段') this.linkType = 1 this.selectPipeLine() }, @@ -203,7 +240,11 @@ const geom = JSON.parse(itm.geomText) const points = [] geom.coordinates.forEach((it, id) => { points.push(it.reverse()) const item = it.reverse() if (it.length > 2) { item.shift() } points.push(item) }) linkPipe.push(points) }) @@ -240,7 +281,8 @@ window.map.panInsideBounds(this.currentSelectResultLine.getBounds()) }, // 连通性的清除功能 linkClear () { handleClick () { // this.linkClear() if (this.currentSelectStartLine != null) { this.currentSelectStartLine.remove() this.currentSelectStartLine = null @@ -253,9 +295,6 @@ this.currentSelectResultLine.remove() this.currentSelectResultLine = null } }, handleClick () { this.linkClear() this.currentLinkIsTrue = '' this.tableDataLinkStart = [] this.tableDataLinkEnd = []
