<!-- 巡查路线设置-堤防 -->
<script>
import GaoDeMap from "./components/GaoDeMap.vue"
export default {
  name: '',
  components: {
    GaoDeMap
  },
  data() {
    return {
      selectTab: 'first'
    }
  },
  methods: {

  }
}
</script>

<template>
  <div class="body">
    <div class="top-title">
      基础信息管理
    </div>
    <div class="map-box">
      <el-tabs v-model="selectTab" class="tab">
        <el-tab-pane style="padding: 0px 16px;" label="电子地图" name="first">
          <GaoDeMap />
        </el-tab-pane>
        <el-tab-pane label="平面图" name="second">平面图</el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<style scoped lang="less">
.body {
  width: 100%;
  min-height: calc(100vh - 56px);

  .top-title {
    height: 40px;
    background-color: white;
    display: flex;
    padding-left: 16px;
    align-items: center;
    font-weight: 600;
  }

  .map-box {
    background-color: #fff;
    border-radius: 8px;
    min-height: calc(100vh - 56px - 40px - 48px);
    margin: 24px;

    .tab {
      /deep/.el-tabs__nav {
        .el-tabs__item:first-of-type {
          margin-left: 16px;
        }
      }
    }
  }
}
</style>