parking_LargeScreen/src/views/screenIndex/index.vue

<!--
 * @Description: 
 * @Author: wangcc
 * @Date: 2023-01-09 11:18:33
 * @LastEditors: wangcc
 * @LastEditTime: 2023-02-17 15:58:54
 * @FilePath: \parking_LargeScreen\src\views\screenIndex\index.vue
 * @Copyright: Copyright (c) 2016~2023 by wangcc, All Rights Reserved. 
-->
<template>
  <div>
    <v-scale-screen>
      <map-view></map-view>
      <top-nav @tabCheck="tabCheck"></top-nav>
        <tab-label v-if="tabType == 1"></tab-label>
        <Receivables v-if="tabType == 1"></Receivables>
        <ranking v-if="tabType == 1"></ranking>
        <percen-tage ref="PercenTage" v-if="tabType == 1"></percen-tage>
        <analyse ref="analyse" v-if="tabType == 1"></analyse>
        <Parking-rate v-if="tabType != 1"></Parking-rate>
    </v-scale-screen>
  </div>
</template>

<script>

import mapView from '@/components/map.vue';
import topNav from '@/components/topNav.vue';
import tabLabel from '@/components/selectLabel.vue';
import Receivables from '@/components/Receivables/Receivables.vue';
import ranking from '@/components/Receivables/ranking.vue';
import PercenTage from '@/components/Receivables/PercenTage.vue';
import analyse from '@/components/Receivables/analyse';
import ParkingRate from '@/components/ParkingRate/index.vue'
export default {
  name: '',
  components: {
    mapView,
    topNav,
    tabLabel,
    Receivables,
    ranking,
    PercenTage,
    analyse,
    ParkingRate
  },
  data() {
    return {
      tabType: '1',
      tabValue:''
    };
  },
  created() {
    
  },
  mounted() {},
  watch: {},
  methods: {
    tabCheck(item) {
      console.log(item);
      this.tabType = item.id;
      if (item.id !=1) {
        this.$refs.PercenTage.clearTime();
        this.$refs.analyse.clearTime();
      }else {
        this.tabValue = '1'
      }
    },
  }
};
</script>

<style  lang='scss' scoped>
</style>