| | |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-radio-group v-model="form.type" class="levelOfRisk"> |
| | | <el-radio-group v-model="form.transferData" class="levelOfRisk"> |
| | | <el-radio v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"> |
| | | <span class="levelOfRisk-type">{{ item.name }}</span> |
| | | </el-radio> |
| | |
| | | <script> |
| | | |
| | | import mapApi from '@/api/mapApi' |
| | | import publicBounced from '@/components/BaseNav/PublicBounced/PublicBounced' |
| | | |
| | | export default { |
| | | name: 'SolidWasteSearch', |
| | |
| | | key: 'length' |
| | | }] |
| | | }], |
| | | levelOfRisk: [ |
| | | { |
| | | name: '全部', |
| | | value: '1' |
| | | }, |
| | | { |
| | | name: '正常', |
| | | value: '2' |
| | | }, |
| | | { |
| | | name: '预警', |
| | | value: '3' |
| | | } |
| | | ], |
| | | form: { |
| | | keyword: '固废面板数据查询', |
| | | // 数据的传递 |
| | | transferData: '' |
| | | transferData: 1 |
| | | }, |
| | | levelOfRisk: [ |
| | | { |
| | | name: '全部', |
| | | value: 1 |
| | | }, |
| | | { |
| | | name: '正常', |
| | | value: 2 |
| | | }, |
| | | { |
| | | name: '预警', |
| | | value: 3 |
| | | } |
| | | ], |
| | | // 数据搜索之后,存储数据的 |
| | | searchDataDisplay: [] |
| | | searchDataDisplay: [], |
| | | searchDataDisplayName: '', |
| | | searchDataDisplayId: '' |
| | | } |
| | | }, |
| | | methods: { |
| | | setBounced (val) { |
| | | const pos = [val.Latitude, val.Longitude] |
| | | window.map.flyTo(pos, 16) |
| | | }, |
| | | handlePipelineType (val) { |
| | | this.solidWasteTypeOptions.forEach(item => { |
| | | if (val === item.value) { |
| | | this.handleSearch(item.value) |
| | | } |
| | | }) |
| | | }, |
| | | // 点击搜索实现数据的搜索展示 |
| | | async handleSearch (data) { |
| | | // console.log(this.form.keyword) |
| | | const result = await mapApi.getSolidWaste(data) |
| | | console.log(result) |
| | | this.searchDataDisplay = result.Result.DataInfo |
| | | this.searchDataDisplayName = result.Result.DataInfo[0].Name |
| | | this.searchDataDisplayId = result.Result.DataInfo[0].StoragePlaceId |
| | | console.log(this.searchDataDisplayName) |
| | | }, |
| | | // 数据展示,点击进行弹框及点的展示 |
| | | setBounced (val) { |
| | | const pos = [val.Latitude, val.Longitude] |
| | | window.map.flyTo(pos, 11) |
| | | const t1 = setTimeout(async () => { |
| | | const dataValue = { |
| | | StoragePlaceId: this.searchDataDisplayId |
| | | } |
| | | // console.log(e.layer.options.totransferData.Name) |
| | | // 弹框标题 |
| | | const title = this.searchDataDisplayName |
| | | console.log(title) |
| | | // 基本信息 tabs |
| | | const resultBasic = await mapApi.getSolidWasteBaseInfo(dataValue) |
| | | // 详细信息展示 table |
| | | const resultDetailed = await mapApi.getSolidWasteDetail(dataValue) |
| | | |
| | | // 绑定弹框实例 |
| | | const PublicBounced = window.Vue.extend(publicBounced) |
| | | const instance = new PublicBounced().$mount() |
| | | document.body.appendChild(instance.$el) |
| | | // document.body.removeChild(instance.$el) |
| | | // 通过方法 向绑定弹框传递数据 |
| | | instance.setData(title, resultBasic.Result.DataInfo, resultDetailed.Result.DataInfo, 'gufei') |
| | | // this.setPanTo(e.latlng, 300) |
| | | }, 3000) |
| | | console.log(t1) |
| | | // clearTimeout(t1) |
| | | }, |
| | | |
| | | // flayTo() 弹框的可滑动事件 |
| | | setPanTo (pos, value) { |
| | | var position = pos |
| | | position = window.map.latLngToLayerPoint(position) |
| | | position.y += value |
| | | position = window.map.layerPointToLatLng(position) |
| | | window.map.flyTo(position) |
| | | }, |
| | | // select的option的数据选择 |
| | | handlePipelineType (val) { |
| | | this.solidWasteTypeOptions.forEach(item => { |
| | | if (val === item.value) { |
| | | this.handleSearch(item.value) |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |