playlet/project/src/components/channelCode/publicTable....

<template>
  <div>
  <!-- table -->
    <el-table v-loading="loading" ref="multipleTable"
              border
              :height='height'
              :data="tableData"
              tooltip-effect="dark"
              :header-cell-style="()=>{return { backgroundColor: '#f9f9f9 !important' }}"
              style="width: 100%">
      <template v-for="item in propsData.desCol">
        <el-table-column :key="item.prop" :label="item.label" align="center"
                         :show-overflow-tooltip="item.showOverTooltip"
                         :min-width="item.min_width?item.min_width:120">
          <template #header v-if="item.tooltip">
            {{item.label?item.label:'-'}}
            <el-tooltip class="disinblock" :content="item.tooltip" placement="top">
              <i class="el-icon-question"></i>
            </el-tooltip>
          </template>
          <template slot-scope="scope">
            <div>{{scope.row[item.prop] ? scope.row[item.prop] : '-'}}</div>
          </template>
        </el-table-column>
      </template>


      <el-table-column label="操作" align="center" min-width="180px">
        <template slot-scope="scope">
          <template v-if="propsData.source=='codeIndex'">
            <div class="flex">
              <div class="c-00B38A pointer">禁用</div>
              <div class="c-00B38A pointer lMar8">删除</div>
              <div class="c-00B38A pointer lMar8">复制</div>
              <div class="c-00B38A pointer lMar8">下载</div>
              <div class="c-00B38A pointer lMar8">分析数据</div>
            </div>
          </template>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination" v-show="total>0">
      <el-pagination background :current-page="page" @current-change="handleCurrentChange" layout="prev, pager, next" :page-count='Number(pages)'>
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: "publicTable",
  props:['propsData'],
  data(){
    return{
      loading: false,
      dataLoading: false,
      page: 1,
      pages: 0,
      total: 0,
      page_size: 20,
      height: '',
      tableData:[]
    }
  },
  watch:{
    'propsData.initFlag'(){
      this.init(1)
    }
  },
  created() {
    this.height = document.documentElement.clientHeight - 300 > 400 ? document.documentElement.clientHeight - 300 : 400
    this.init(1)
  },
  methods:{

    init (page, type) {
      if (type != 'export') {
        this.page = page ? page : this.page;
      } else {
        if (this.total == 0) {
          this.$message({
            message: '暂无数据可导出',
            type: "warning"
          })
          return
        }
      }
      this.loading = true
      this.$axios.get(this.URL.BASEURL + this.URL.batchAddCustomer_statistic, {
        params:{
          start_date: '2022-05-14',
          end_date: '2022-06-13',
          page: type == 'export' ? 1 : this.page,
          pagesize: type == 'export' ? this.$store.state.exportNumber : this.page_size,
        }
      }).then((res) => {
        var res = res.data
        this.loading = false
        if (res && res.errno == 0) {
          if (type == 'export') {
            this.exportEvent(res.rst.data)
          } else {
            this.tableData = res.rst.data
            this.total = res.rst.pageInfo.total;
            this.pages = res.rst.pageInfo.pages;
          }
        } else if (res.errno != 4002) {
          this.$message({
            message: res.err,
            type: "warning"
          })
        }
      }).catch((err) => {
        this.loading = false
      });
    },
    handleCurrentChange (val) {
      this.init(val)
    },
  }
}
</script>

<style lang="scss" scoped>

</style>