<template>
  <!-- 运输距离信息页面 -->
  <div class="distance">

      <div class="info_card">
        <div class="title">
          <span class="title_name">'44545455'</span>
          <!-- <div class="close_img" onclick="closeInfoWindow()"> -->
            <!-- <span class="min top_img"></span>
            <span class="min right_img"></span>
            <span class="min bottom_img"></span> -->
            <!-- <span class="min left_img"></span> -->
            <!-- </div> -->
            </div>
            <div class="title">
          <span class="title_name">'44545455'</span>
          <!-- <div class="close_img" onclick="closeInfoWindow()"> -->
            <!-- <span class="min top_img"></span>
            <span class="min right_img"></span>
            <span class="min bottom_img"></span> -->
            <!-- <span class="min left_img"></span> -->
            <!-- </div> -->
            </div>
            <div align="left" class="content">'78787878各持股持股股东股东股东帆帆大大方方的的方式是否'</div>
            <span class="cancle bot"></span>
            <span class="cancle top"></span>
      </div>

  </div>
</template>


<script>
export default {
  name: "distance",
  data() {
    return {
      status: "",
      state: "",
      option: {       
        // 表格请求数据的地址
        requestUrl: "/api/v1/inTransit/tmstruckreplayresults/getReplayInfo?apiId=126",
      },
    };
  },
  mounted() {
    this.restaurants = this.loadAll();
  },
  methods: {
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      cb(results);
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        );
      };
    },
    },
};
</script>
<style lang='scss' scoped>
.homeworkPath {
  .top {
    padding: 20px 30px;
  }
}
</style>
<style>
    * {
        padding: 0px;
        margin: 0px;
    }

    #mapContainer {
        width: 100vw;
        height: 100vh;
    }
    .info_card {
        display: inline-block;
        margin: 50px auto;
        position: absolute;
        width: 200px;
        height:100px;
        background-color: #c7c9c8;
        border: 5px solid #ffffff;
        color: #000000;
    }
    .info_card .title{
        width: 100%;
        height:40px;
        background-color: #000000;
        color: #ffffff;
    }

    .title span.title_name{
        position: relative;
        top: 7px;
        left: 10px;
        font-size: 18px;
    }


    .info_card .title .close_img{
        position: absolute;
        top:10px;
        right: 10px;
        width: 20px;
        height: 20px;
        background-color: #ffffff;
    }
    .info_card .title .close_img .min {
        width: 0;
        height: 0;
        font-size:0;
        overflow:hidden;
        position:absolute;
        border-width:10px;
    }

    .info_card .title .close_img .top_img {
        border-style:solid dashed dashed;
        border-color:#000000 transparent transparent transparent;
        top:-2px;
    }

    .info_card .title .close_img .right_img {
        border-style:solid dashed dashed;
        border-color:transparent #000000 transparent transparent;
        left:2px;
    }

    .info_card .title .close_img .bottom_img{
        border-style:solid dashed dashed;
        border-color:transparent transparent #000000 transparent;
        top:2px;
    }

    .info_card .title .close_img .left_img{
        border-style:solid dashed dashed;
        border-color:transparent transparent transparent #000000;
        left:-2px;
    }

    .info_card span.cancle{
        width:0;
        height:0;
        font-size:0;
        overflow:hidden;
        position:absolute;
    }

    .info_card span.bot{
        border-width:20px;
        border-style:solid dashed dashed;
        border-color:#ffffff transparent transparent;
        left:80px;
        bottom:-40px;
    }
    .info_card span.top{
        border-width:20px;
        border-style:solid dashed dashed;
        border-color:#c7c9c8 transparent transparent;
        left:80px;
        bottom:-33px;
    }
    .info_card .content{
        margin-top: 10px;
        margin-left: 10px;
    }
</style>