常用表格的混入封装vue

export const minxin = {
  data() {
    return {
      filterCache: null, // 保存默认filter值，用于重置
      pagi: {
        page: 1,
        size: 10,
        total: 0
      },
      pagiCache: null, // 保存默认pagi值，用于重置
      tableLoading: false,
      tableData: []
    }
  },
  created() {
    this.filterCache = JSON.parse(JSON.stringify(this.filterData))
    this.pagiCache = JSON.parse(JSON.stringify(this.pagi))
  },
  methods: {
    // 条件查询
    query() {
      this.pagi = JSON.parse(JSON.stringify(this.pagiCache))
      this.getTableData()
    },
    // 条件重置
    reset() {
      this.filterData = JSON.parse(JSON.stringify(this.filterCache))
      this.pagi = JSON.parse(JSON.stringify(this.pagiCache))
      this.getTableData()
    },
    // page切换
    pageChange(data) {
      this.pagi.size = data.limit
      this.getTableData()
    },
    /**
     * @description 数据删除
     * @param {api} (例：user/userList)
     */
    deleteRow(api, httpData, text) {
      this.$confirm('确认删除该数据？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async() => {
        const res = await this.$store.dispatch(api, httpData)
        if (res.code === 200) {
          this.$message.success('已删除')
          this.getTableData()
        } else {
          this.$message.warning(res.msg)
        }
      }).catch(() => {
      })
    }
  }
}