<template>
  <div>
    <a-table
      bordered
      :data-source="list"
      :columns="columns"
      @change="getList"
      rowKey="id"
      :loading="loading"
      :pagination="tablePageOptions"
    >
    </a-table>
  </div>
</template>

<script lang="ts">
import usePagination from "@/hooks/usePagination";
import PreviewBox from "./preview.vue";
import { defineComponent, reactive, toRefs, ref, watch } from "vue";
import { TableColumnOfLog } from "../../_pageOptions/table_material";

import { getVideoLog } from "@/api";
import { message } from "ant-design-vue";
const CommonTable = defineComponent({
  props: ["visible"],
  setup(props) {
    let { meta, tablePageOptions } = usePagination();
    const state = reactive({
      loading: false,
      list: ref<any[]>([]),
      columns: TableColumnOfLog,
      pushVisible: false,
    });
    const getList = async (page?: any) => {
      state.loading = true;
      let { data } = await getVideoLog({
        page: page ? page.current : 1,
      });
      state.loading = false;
      state.list = data.list;
      meta.value = data.meta;
    };

    watch(
      () => props.visible,
      (newVal, oldVal) => {
        if (newVal) {
          getList();
        }
      }
    );
    return { ...toRefs(state), tablePageOptions, getList };
  },
  mounted() {},
});

export default CommonTable;
</script>
<style lang="scss" scoped></style>
