/*
 *@description:运单定位
 *@author: hudw
 *@date: 2022-10-10 14:02:28
*/
<template>
  <a-spin class="p-span" :spinning="confirmLoading">
    <searchBar ref="searchBar" :formItems="mx_queryFromItems" :options="options" @submit="searchSubmit">
      <mainTable ref="mainTable" :activeID="mainId" :tableColumnsList="mx_columns" :url="mx_remoteUrl" @clickRow="handleRowClick">
        <a-row slot="title" type="flex" justify="space-between" align="middle">
          <a-col :flex="0">
            <h3>{{ $route.meta.title + '列表' }}</h3>
          </a-col>
          <a-col :flex="0">
            <p-button type="primary" icon="plus" style="margin-right: 10px">新增</p-button>
            <p-button icon="delete">删除</p-button>
          </a-col>
        </a-row>
      </mainTable>
    </searchBar>
    <webMap ref="webMap" :type="type" :queryType="mx_getUrlType()" :dataSource="mapData" />

  </a-spin>
</template>
<script>
import useMixin from '../$common/mixins/useMixin.js'
import dictionary from '../$common/mixins/dictionary.js'
import mainTable from './mixins/mainTable'
import queryForm from './mixins/queryForm'
import { getPositionUrl, getTrackUrl, getLocationMapData } from './js/api.js'

export default {
  props: {
    type: {
      type: String,
      default: 'location',
      //location=定位，path=轨迹
    },
  },
  mixins: [dictionary, useMixin, mainTable, queryForm],
  data() {
    return {
      confirmLoading: false,
      currentMainData: null,
      mapData: null,
    }
  },
  mounted() {},
  methods: {
    handleRowClick(event, key, data) {
      if (key) {
        this.mainId = key
        this.currentMainData = data
      this.confirmLoading = true;

      let urlType = this.mx_getUrlType()
      this.mapData=null
        return getLocationMapData(this, { shipBillId: data.shipbillId },urlType)
          .then((res) => {
            if (res.success) {
              if (this.type == 'location') {
                if (!res.data || isNaN(res.data.longitude) || isNaN(res.data.latitude)) {
                  this.$exception({
                    message: '运单定位失败！',
                  })
                }
                res.data.consigneeAddress = data.consigneeAddress
                this.mapData = res.data
              }
            } else {
              this.mapData = null
              this.$message.error(response.message);
            }
          })
          .finally(() => {
            this.confirmLoading = false
          })
        }

    },
  },
}
</script>

<style lang="less">
.p-span {
  height: inherit;
  .ant-spin-container {
    height: inherit;
  }
}
</style>
