<template>
  <div class="industrialBase">
    <layOutLand :baseId="baseId" :title="title">
      <template v-slot:one>
       <land-area-total :baseId="baseId"></land-area-total>
      </template>
      <template v-slot:two>
        <land-resource-pro :baseId="baseId"></land-resource-pro>
      </template>
      <template v-slot:three>
         <landProbenefit :baseId="baseId"></landProbenefit>
      </template>
      <template v-slot:four>
        <land-type-compose :baseId="baseId"></land-type-compose>
      </template>
      <template v-slot:five>
          <land-type-distribution :baseId="baseId"></land-type-distribution>
      </template>
      <template v-slot:six>
        <land-type-area :baseId="baseId"></land-type-area>
      </template>
    </layOutLand>
    <el-dialog :visible.sync="show" width="60%" custom-class="taskDetail" :modal="false">
      <div slot="title">农事任务</div>
      <task :baseId="baseId"></task>
    </el-dialog>
  </div>
</template>

<script>
import layOutLand from '../layOutLand.vue';
import baseInfo from './baseInfo.vue';
import productPrices from './productPrices.vue';
import farmTask from './farmTask.vue';
import landResourcePro from './landResourcePro.vue';
import landTypeCompose from './landTypeCompose.vue';
import landTypeDistribution from './landTypeDistribution.vue';
import landTypeArea from './landTypeArea.vue';
import landAreaTotal from './landAreaTotal.vue';
import landProbenefit from './landProbenefit.vue'
import task from './task.vue';
export default {
  components: {
    layOutLand,
    baseInfo,
    productPrices,
    farmTask,
    landResourcePro,
    landTypeCompose,
    landTypeDistribution,
    landTypeArea,
    landAreaTotal,
    landProbenefit,
    task,
  },
  props: {
    baseId: Number,
  },
  data() {
    return {
      title: ['耕地面积统计', '农村土地资源项目', '项目效益分析','耕地类型', '耕地类型面积统计', '作物情况', ],
      show: false,
    };
  },
  watch: {
    baseId: {
      handler: function (n) {},
      immediate: true,
    },
  },
};
</script>

<style lang="scss" scoped>
.industrialBase::v-deep {
  height: 100%;
  width: 100%;
  .taskDetail {
    .el-dialog__header {
      background: #0b2439;
      color: #fff;
    }
    .el-dialog__body {
      background: #0b2439;
    }
  }
}
</style>
