地图显示，未测试！

src/main/java/com/bowintek/practice/controller/FactWellController.java

@@ -5,6 +5,7 @@ import com.bowintek.practice.filter.exception.RespGenerstor;
 import com.bowintek.practice.services.service.AccountService;
 import com.bowintek.practice.services.service.FactWellService;
 import com.bowintek.practice.services.service.QueryLogService;
+import com.bowintek.practice.services.service.WellInfoService;
 import com.bowintek.practice.vo.EsQueryLogVo;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.web.bind.annotation.*;

src/main/java/com/bowintek/practice/controller/WellInfoController.java

@@ -41,6 +41,16 @@ public class WellInfoController {
         return RespGenerstor.success(result);
     }
 
+    @ResponseBody
+    @GetMapping("/getMapList")
+    public BaseResponse<PageInfo<HashMap<String, Object>>> getMapList(@RequestParam("page") int page, @RequestParam("rows") int rows,
+                                                                   WellInfoParams params) throws Exception {
+
+        PageInfo<HashMap<String, Object>> result = wellInfoService.getMapList(page, rows, params);
+
+        return RespGenerstor.success(result);
+    }
+
     @GetMapping("/getOrganizationTree")
     public BaseResponse getOrganizationTree() {
         return RespGenerstor.success(organizationService.getListTree());

src/main/java/com/bowintek/practice/mapper/cquery/WellInfoCQuery.java

@@ -15,6 +15,13 @@ public interface WellInfoCQuery {
      */
     List<HashMap<String,Object>> getWellInfoList(WellInfoParams params);
 
+    /**
+     * 查询地图井信息
+     * @param params
+     * @return
+     */
+    List<HashMap<String,Object>> getWellMapList(WellInfoParams params);
+
     /**
      * 获取井信息
      * @param well_id

src/main/java/com/bowintek/practice/services/impl/WellInfoServiceImpl.java

@@ -51,6 +51,17 @@ public class WellInfoServiceImpl implements WellInfoService {
         return result;
     }
 
+    @Override
+    @SwitchDataSource(DBTypeEnum.POSTGRE)
+    public PageInfo<HashMap<String, Object>> getMapList(Integer page, Integer rows, WellInfoParams params) {
+        PageHelper.startPage(page, rows);
+
+        List<HashMap<String, Object>> dataList = wellInfoCQuery.getWellMapList(params);
+
+        PageInfo<HashMap<String, Object>> result = new PageInfo(dataList);
+        return result;
+    }
+
     @Override
     @SwitchDataSource(DBTypeEnum.POSTGRE)
     public HashMap<String, Object> getWellInfo(String well_id) {

src/main/java/com/bowintek/practice/services/service/WellInfoService.java

@@ -12,6 +12,7 @@ public interface WellInfoService {
 
     HashMap<String,Object> getWellInfo(String well_id);
     PageInfo< HashMap<String, Object>> getList(Integer page, Integer rows, WellInfoParams params);
+    PageInfo<HashMap<String, Object>> getMapList(Integer page, Integer rows, WellInfoParams params);
     List<HashMap<String,Object>> selectBoreholeInterList(String well_id);
     List<HashMap<String,Object>> selectTestHistoryList(String well_id);
     List<HashMap<String, Object>> selectTestHistorySummary(String well_id);

src/main/resources/mapping/cquery/WellInfoCQuery.xml

@@ -106,6 +106,46 @@
             and well.project_id =#{project_id}
         </if>
     </select>
+
+    <select id="getWellMapList" parameterType="com.bowintek.practice.vo.query.WellInfoParams"
+            resultType="java.util.HashMap">
+        SELECT well.well_id,
+            well.well_common_name,
+            well.geo_description,
+            structure.well_coordinates_x x,
+            structure.well_coordinates_y y
+        FROM well_basic_information well
+        inner join fact_dwr_well_structure structure on well.well_id = structure.well_id
+        where 1=1
+        <if test="well_common_name!='' and well_common_name!=null">
+            and well.well_common_name like Concat('%',#{well_common_name},'%')
+        </if>
+        <if test="well_id!='' and well_id!=null">
+            and well.well_id like Concat('%',#{well_id},'%')
+        </if>
+        <if test="well_type!='' and well_type!=null">
+            and well.well_type like Concat('%',#{well_type},'%')
+        </if>
+        <if test="spud_date_begin!='' and spud_date_begin!=null">
+            and well.spud_date <![CDATA[ >= ]]> CAST(#{spud_date_begin} AS DATE)
+        </if>
+        <if test="spud_date_end!='' and spud_date_end!=null">
+            and well.spud_date  <![CDATA[ < ]]> (CAST(#{spud_date_end} AS DATE) + INTERVAL '1 day')
+        </if>
+        <if test="completion_date_begin!='' and completion_date_begin!=null">
+            and well.completion_date <![CDATA[ >= ]]> CAST(#{completion_date_begin} AS DATE)
+        </if>
+        <if test="completion_date_end!='' and completion_date_end!=null">
+            and well.completion_date  <![CDATA[ < ]]> (CAST(#{completion_date_end} AS DATE) + INTERVAL '1 day')
+        </if>
+        <if test="org_id_a1!='' and org_id_a1!=null">
+            and well.org_id_a1 =#{org_id_a1}
+        </if>
+        <if test="project_id!='' and project_id!=null">
+            and well.project_id =#{project_id}
+        </if>
+    </select>
+
     <select id="selectBoreholeInterList" resultType="java.util.HashMap">
         select *
         from public.fact_dwr_wl_ach_borehole_inter bi

vue/src/components/basic/chart/chart-map.vue

@@ -0,0 +1,162 @@
+<template>
+  <div class="chart-map">
+    <div class="chart-map-input">
+      <a-auto-complete
+        :dropdown-match-select-width="252"
+        style="width: 300px"
+        :options="options"
+        @search="onSearch"
+        @select="onSelect"
+      >
+        <template #option="item">
+          <div class="chart-map-item">
+            <div class="chart-map-item-icon">
+              <img src="~@/assets/icons/postion.png">
+            </div>
+            <div class="chart-map-item-text">
+              <div class="chart-map-item-wellname">井名：{{ item.well_common_name }}</div>
+              <div>地址：{{ item.geo_description }}</div>
+            </div>
+          </div>
+        </template>
+        <a-input-search size="large" placeholder="..." enter-button></a-input-search>
+      </a-auto-complete>
+    </div>
+    <iframe width="100%" height="100%" tyle="border: 0"
+            :src="iframeSrc" ref="iframeRef" id="iframeMap"
+            class="chart-map-iframe"></iframe>
+  </div>
+</template>
+
+<script lang="ts">
+  import {defineComponent, computed, ref} from 'vue';
+  import {get} from '@/api/common';
+
+  export  default defineComponent ({
+    props:{
+      wellId: null as any
+    },
+    name : 'ChartMap',
+    data() {
+      return{
+        loading : false,
+        datas:null as any,
+        options:[] as any,
+        iframeWindow : null,
+        value : null
+      }
+    },
+    setup(props, context){
+      console.log("ChartMap setup" , props, context);
+      let iframeSrc = ref<string>("http://127.0.0.1:1936/a4gis/index.html");
+      let iframeRef = ref<any>();   // 和iframe标签的ref绑定
+
+      const wellId = computed(() => {
+        return props.wellId ? props.wellId : null
+      });
+      return{
+        wellId,
+        iframeSrc,
+        iframeRef
+      }
+    },
+    mounted(){
+      console.log("mounted chart-map" , this.wellId);
+      // 父项目绑定一个message事件给iframe handleMessage
+      window.addEventListener("message", this.handleMessage, false);
+      this.iframeWindow = this.iframeRef.contentWindow;
+      //加载数据
+      this.options = this.getDatas();
+      console.log("mounted options", this.options);
+    },
+    methods:{
+      getDatas:async function(){
+        //数据查询逻辑，如果不查询，改此方法返回数据即可
+        if(this.datas==null){
+          this.datas = [];
+          const result = await get('/wellInfo/getMapList',{ page: 1, rows:1000 });
+          this.datas = result.list.map((item, index) => {
+            item.value = item.well_id;
+            item.index = index;
+            return item;
+          });
+        }
+        console.log("getDatas", this.datas);
+        return this.datas;
+      },
+      onSearch:async function (searchText){
+        let datas = await this.getDatas();
+        if(searchText!=null && searchText!=undefined && searchText.length>0){
+          this.options = datas.filter((item) => {
+            return (item.well_common_name && item.well_common_name.indexOf(searchText) >=0)
+              || (item.geo_description && item.geo_description.indexOf(searchText)>=0);
+          });
+        }
+        else this.options = datas;
+      },
+      onSelect:function (value, item){
+        console.log("onSelect", value, item);
+        (document.getElementById('iframeMap') as any).contentWindow.postMessage({
+          action:'setCenter',
+          item : JSON.stringify(item)
+        },'*');
+      },
+      handleMessage:async function (event){
+        console.log("parent handle Message", event.data);
+        //(document.getElementById('iframeMap') as any).contentWindow.postMessage({message:'父页面传过来的数据'},'*');
+        //显示坐标点
+        let datas = await this.getDatas();
+        (document.getElementById('iframeMap') as any).contentWindow.postMessage({
+          action:'setSymbols',
+          datas : JSON.stringify(datas)
+        },'*');
+        this.options = datas;
+      }
+    }
+  })
+</script>
+
+<style lang="less" scoped>
+  .chart-map{
+    width: 100%;
+    height: 100%;
+  }
+  .chart-map-iframe{
+    position: relative;
+    top:-50px;
+    z-index: 10;
+  }
+  .chart-map-input{
+    background-color: white;
+    position: relative;
+    width: 300px;
+    height: 50px;
+    left: 30px;
+    top: 30px;
+    z-index: 100;
+  }
+
+  .chart-map-item{
+    display: flex;
+    flex-direction: row;
+  }
+  .chart-map-item-icon{
+    width: 30px;
+    min-width: 30px;
+    min-height: 30px;
+    text-align: center;
+  }
+  .chart-map-item-icon img{
+    width: 20px;
+    height: 20px;
+  }
+  .chart-map-item-text{
+    flex-grow: 1;
+    font-size: 12px;
+    line-height: 20px;
+  }
+  .chart-map-item-wellname{
+    color: #1890ff;
+    font-size: 14px;
+  }
+</style>

vue/src/views/position/test.vue

@@ -46,6 +46,11 @@
     <div style="width:1200px;">
       <ChartProdDynmics :wellId="('吉45-144(A2)')"></ChartProdDynmics>
     </div>
+
+    <a-divider orientation="left">地图</a-divider>
+    <div style="width:1000px;height: 400px">
+      <ChartMap :wellId="('吉45-144(A2)')"></ChartMap>
+    </div>
   </div>
 </template>
 
@@ -56,10 +61,11 @@ import QueryHistoryList from '@/components/basic/querylog/history-list.vue'
 import QueryHistoryComplete from '@/components/basic/querylog/history-complete.vue'
 import ChartCell from '@/components/basic/chart/chart-cell.vue'
 import ChartProdDynmics from '@/components/basic/chart/chart-prod-dynamics.vue'
+import ChartMap from '@/components/basic/chart/chart-map.vue'
 
 export default defineComponent({
   name: 'QueryTest',
-  components: {QueryHistoryList, QueryHistoryComplete, ChartCell, ChartProdDynmics},
+  components: {QueryHistoryList, QueryHistoryComplete, ChartCell, ChartProdDynmics, ChartMap},
   setup() {
     const route = useRoute();
     const queryHistoryComplete = ref<typeof QueryHistoryComplete>();