<template >
  <div class="main-bottom" style="color: #fff;">
    <div>
      <FirePatrolRanking />
    </div>
    <div >
      <EquipmentMaintenanceRanking />
    </div>
  </div>
</template>

<script>
import EquipmentMaintenanceRanking from './EquipmentMaintenanceRanking.vue'
import FirePatrolRanking from './FirePatrolRanking.vue'

export default {
  name: 'Main.Bottom',
  components: {
    EquipmentMaintenanceRanking,
    FirePatrolRanking
  },
  provide() {
    return {
      pos: 'left'
    }
  },
  data() {
    return {}
  },
  methods: {}
}
</script>

<style scoped lang='less'>
.main-bottom{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5.5px 5.5px 0px 5.5px;
}
</style>
