<template>
  <div
    v-loading="options.loading"
    class="l-flex__auto l-flex--col c-table"
    :class="{ 'prevent-copy': preventCopy }"
  >
    <div class="l-flex__none l-flex--row c-table__header">
      <slot name="header" />
    </div>
    <el-table
      ref="table"
      class="l-flex--col c-table__main"
      :data="options.list"
      v-bind="$attrs"
      @row-click="onClick"
      @row-dblclick="onRowClick"
      @selection-change="onSelectionChange"
    >
      <slot />
      <status-wrapper
        slot="empty"
        :error="options.error"
        @click="onPagination"
      />
    </el-table>
    <pagination
      v-if="options.params"
      :total="options.totalCount"
      :page.sync="options.params.pageNum"
      :limit.sync="options.params.pageSize"
      @pagination="onPagination"
    />
  </div>
</template>

<script>
export default {
  name: 'CTable',
  props: {
    options: {
      type: Object,
      default () {
        return {}
      }
    },
    copy: {
      type: [Boolean, String],
      default: false
    }
  },
  computed: {
    preventCopy () {
      return !this.copy && !!(this.$listeners['row-click'] || this.$listeners['row-dblclick'])
    }
  },
  methods: {
    onPagination () {
      this.$emit('pagination')
    },
    onClick (row) {
      this.$emit('row-click', row)
    },
    onRowClick (row) {
      this.$emit('row-dblclick', row)
    },
    onSelectionChange (val) {
      this.$emit('selection-change', val)
    },
    getInstance () {
      return this.$refs.table
    }
  }
}
</script>
