<template>
  <view class="aqjc-box">
    <view class="aqjc-tabs">
        <u-tabs 
        :list="list" 
        @click="tabsClick" 
        :scrollable="false"
        :activeStyle="{
        color: '#34a4fe'}"></u-tabs>
    </view>
    <view class="aqjc-content">
      <Wyjc v-if = "status == 0" :tableData="wyTable"/>
      <Syjc v-if="status == 1"  :tableData="syTable"/>
      <Sljc v-if="status == 2"  :tableData="slTable" />
    </view>
  </view>
</template>
<script>
import Sljc from './sljc.vue';
import Syjc from './syjc.vue';
import Wyjc from './wyjc.vue';
export default {
  components: {
    Wyjc,
    Syjc,
    Sljc
  },
  data() {
    return {
      list: [{ name: '位移监测' }, { name: '渗压监测' }, { name: '渗流监测' }],
      status: 0,
      wyTable: [],
      syTable: [],
      slTable:[]
    }
  },
  methods: {
    tabsClick(e) {
      this.status = e?.index;
    }
  }
}
</script>
<style lang="scss" scoped>
.aqjc-box{
  padding: 5px;
  .aqjc-tabs{
    width: 100%;
    background-color: #dff0f8;
  }
  .gcgk{
    padding: 5px;
  }
}
</style>