<template>
  <div class="w-full h-full flex bussinessbg">
    <div class="flex flex-col flex-shrink-0" :style="{ width: '420px' }">
      <WayFilter />
      <PatrolInspection />
      <DailyPatrolinspection />
      <RegularInspection />
    </div>
    <div class="flex flex-col" :style="{ width: 'calc(100% - 840px)' }">
      <div class="h-2/3 bussoutmapbox">
        <base-info></base-info>
        <MapLeft />
        <map-view></map-view>
      </div>
      <div class="flex flex-grow h-1/3">
        <DiseasesNumber />
        <DiseaseTreatment />
        <DiseaseType />
      </div>
    </div>
    <div class="flex flex-col" :style="{ width: '420px' }">
      <CuringOrder />
      <TaskSituation />
      <CuringAmount />
    </div>
  </div>
</template>

<script>
import WayFilter from '@/components/wayFilter/index.vue';
import PatrolInspection from './component/patrolInspection.vue';
import DailyPatrolinspection from './component/dailyPatrolinspection.vue';
import RegularInspection from './component/regularInspection.vue';
// import MapView from "./component/mapView.vue";
import MapView from '@/components/MapView.vue';
import DiseasesNumber from './component/diseasesNumber.vue';
import DiseaseTreatment from './component/diseaseTreatment.vue';
import DiseaseType from './component/diseaseType.vue';
import CuringOrder from './component/curingOrder.vue';
import TaskSituation from './component/taskSituation.vue';
import CuringAmount from './component/curingAmount.vue';
import baseInfo from './component/baseInfo.vue';
import MapLeft from './component/MapLeft.vue';
export default {
  components: {
    WayFilter,
    PatrolInspection,
    DailyPatrolinspection,
    RegularInspection,
    MapView,
    DiseasesNumber,
    DiseaseTreatment,
    DiseaseType,
    CuringOrder,
    TaskSituation,
    CuringAmount,
    baseInfo,
    MapLeft
  },
  data() {
    return {};
  }
};
</script>
<style scoped>
.bussinessbg {
  background: url('@/assets/images/app-bg.jpg');
  background-size: 100% 100%;
  padding-top: 50px;
}
.bussoutmapbox{
  position: relative;
}
</style>
