<template>
  <!-- 地图 -->
  <div class="position-r" id="map">
    <newFiberMapBox :initJson="`/static/libs/mapbox/style/TemporaryProject.json`"></newFiberMapBox>
  </div>
  <!-- 中部搜索框 -->
  <div class="searchBoxA">
    <input class="searchInputA" v-model="AllData.searchV" confirm-type="search" placeholder="请输入站点名称" />
    <img :src="getImgPatrol('Search.png')" class="SearchIconA" alt="" @click="getList(AllData.searchV)" />
  </div>
</template>

<script setup name="informationManagement">
import newFiberMapBox from '@/views/xuncha/gisCommonPage/newFiberMapBox.vue';
import { getImgPatrol } from '@/utils/common.js';
const AllData = reactive({
  searchV: '',
});
// 查询接口
const getList = async (val) => {
  console.log('点击', val);
};
</script>
<style lang="less" scoped>
.position-r {
  position: relative;
  width: 100%;
  height: 100%;
  // background: #c6c6c6;
}
.searchBoxA {
  width: 100%;
  height: 80px;
  // background: red;
  position: absolute;
  top: 100px;
  z-index: 99;
  .searchInputA {
    width: 100%;
    box-sizing: border-box;
    padding: 0 36px 0 20px;
    height: 73px;
    background: #f3f3f3b3;
    border-radius: 10px;
    border: none;
  }

  .SearchIconA {
    width: 45px;
    height: 45px;
    position: absolute;
    right: 50px;
    top: 15px;
  }
}
</style>