<template>
  <div class="center">
    <div class="center_css">
      <div class="top_css">
         <el-radio v-model="radio" label="1" @change="change('1')">北斗导航</el-radio>
          <el-radio v-model="radio" label="2" @change="change('2')">平台绘制</el-radio>
        <div class="order-detail">
          <div>订单：{{querydata.orderNo}}</div>
          <div>发货地：{{querydata.sendPrivate}}{{querydata.sendCity}}{{querydata.sendArea}}{{querydata.sendDetailedAddress}}</div>
          <div>卸货地：{{querydata.unloadPrivate}}{{querydata.unloadCity}}{{querydata.unloadArea}}{{querydata.unloadDetailedAddress}}</div>
        </div>
      </div>
      <div class="map">
        <map-drag :radio='radio' :orderid='querydata.id'></map-drag>
      </div>
    </div>
  </div>
</template>

<script>
  import {
    travelpath
  } from '@/api/orderManagement'
  import mapDrag from '@/components/mapdrag/indexMap'
  export default {
    data() {
      return {
        radio: '1',
        querydata:{}
      }
    },
    components: {
      mapDrag
    },
    mounted() {
      this.querydata=this.$route.query
      //  let _obj = {}
      //   _obj.orderId = this.querydata.id
      //     travelpath(_obj).then(response => {
      //       console.log(response)
      //     })
      //     .catch(() => {
      //     })
    },
    methods:{
      change(val){
       
        this.radio=val
      }
    }
  }
</script>

<style lang="scss" scoped>
  .center {
    padding: 20px;
    background: #f5f6f7;
    height: calc(100vh - 5vh);
  }

  .center_css {
    background: #ffffff;
    border-radius: 1px;
    height: 100%;
  }

  .top_css {
    padding: 10px;
    display: flex;

  }
</style>
