/*
 *@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">
      <a-row :gutter="20" >
        <a-col :span="12" style="height:300px">
          <mainTable ref="mainTable" :activeID="mainId" :tableColumnsList="mx_columns" :url="mx_remoteUrl" @clickRow="handleRowClick" />
        </a-col>
        <a-col :span="12" style="height:300px">
          <mainTable id="shipBillTable" ref="shipBillTable" :tableColumnsList="mx_s_columns" :url="mx_s_remoteUrl"  />
        </a-col>
      </a-row>
    </searchBar>
    <webMap ref="webMap" :type="type" :dataSource="mapData" :queryType="mx_getUrlType()" @markerClick="markerClick"/>

  </a-spin>
</template>
<script>
import useMixin from '../$common/mixins/useMixin.js'
import dictionary from '../$common/mixins/dictionary.js'
import mainTable from './mixins/mainTable'
import shipBillTable from './mixins/shipBillTable'
import queryForm from './mixins/queryForm'

export default {
  props: {
    type: {
      type: String,
      default: 'location',
      //location=定位，path=轨迹
    },
  },
  mixins: [dictionary, useMixin, mainTable, shipBillTable, queryForm],
  data() {

    return {
      confirmLoading: false,
      currentMainData: null,
      mapData: null,
    }
  },
  mounted() {},
  methods: {
    markerClick(data) {
      const { loadingBillNo, vehiclePlateNumber, shipbillNo } = data
      let urlType=this.mx_getUrlType()

      this.$refs.mainTable.reload({ data: {urlType, carNumber: vehiclePlateNumber } });
      this.$refs.shipBillTable.reload({data:{ urlType,loadingBillNo}});
    },
    handleRowClick(event, key, data) {
      if (key) {
        let form = this.$refs.searchBar.getFieldsValue()
        if (form.date) {
          form.startDate=form.date[0]
          form.endDate = form.date[1]
        }
        let urlType=this.mx_getUrlType()
        this.$refs.shipBillTable.reload({
          data: { ...form, loadingBillNo: data.loadingBillNo, urlType }
        });

      }
    },
  },
}
</script>

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