Tmr-Multilingual/src/views/statisticalAnalysis/inventoryManagement/pasture/index1.vue

<template>
  <div class="app-content">
    <el-radio v-model="radio2" label="1" @change="changeRadio2">牲畜类别</el-radio>
    <el-radio v-model="radio2" label="2" @change="changeRadio2">栏舍名称</el-radio>
    <template v-if="aa">
      <u-table  ref="plTable" v-loading="listLoading" :max-height="height" use-virtual @table-body-scroll="tableScroll" :data-changes-scroll-top="radio === 1" :row-height="rowHeight" border>
        <u-table-column v-for="(item,key) in tableConfig" :key="'a'+key" :label="item.label" :show-overflow-tooltip="item.showOverflow" align="center" :prop="item.prop" :fixed="key==0">
          <u-table-column v-for="(item1,key1) in item.children" v-if="item.children || item.children.length>0" :key="'B'+key1" align="center" :label="item1.label" :prop="item1.prop" :min-width="item1.width">
            <u-table-column v-for="(item2,key2) in item1.children" v-if="item1.children || item1.children.length>0" :key="'C'+key2" :label="item2.label" :prop="item2.prop" />
          </u-table-column>
        </u-table-column>
      </u-table>
    </template>
    
  </div>
</template>

<script>
  import { postJson } from '@/api/common'
  export default {
    name: 'PastureInventoryManagement',
    data() {
      return {
        radio: 1,
        height: document.documentElement.clientHeight - 125,
        rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
        rowHeight: 30,
        listLoading:false,
        tableConfig:[],
        radio2: '1',
        aa:false
      }
    },
    mounted() {
      this.setData()
    },
    methods: {
      setData() {
          this.aa = false
          
          setTimeout(()=>{
            this.aa = true
            this.$nextTick(() => {
              let list = []
              let url = 'authdata/GetReportform'
              let data = {
                "name":"",
                "page":1,
                "offset":1,
                "returntype":"Map",
                "checked":0,
                "parammaps":{
                  "pastureid":"1647481173",
                  "startTime":"2022-03-11",
                  "stopTime":"2022-03-17",
                  "fname":"",
                  },
                }
                if(this.radio2 == '1'){
                  data.name = 'getMaterialAnalysisLS'
                }else if(this.radio2 == '2'){
                  data.name = 'getMaterialAnalysisSC'
                }
              this.listLoading = true
              postJson(url,data).then(response => {
                this.listLoading = false
                this.tableConfig = response.data.list.data2
                list = response.data.list.data1
                 this.$refs.plTable.reloadData(list)
              })
            })
          },50)
          
          

      },
      tableScroll({ scrollTop, scrollLeft, table, judgeFlse }) {
        // {scrollTop， scrollLeft, table, judgeFlse: 这个参数返回一个boolean值，为true则代表表格滚动到了底部了，false没有滚动到底部，必须开起大数据渲染模式才能有值哦}, event
        // console.log(scrollTop, scrollLeft, table, judgeFlse)
      },
      changeRadio2() {
        console.log(this.radio2)
        if (this.radio2 == '1') {
          this.setData()
        } else if (this.radio2 == '2') {
          this.setData()
        }
      }
    }
  }
</script>

<style lang="scss" scoped>
  .app-content{padding: 20px 20px}
</style>