<!--
 * @Author: 曹捷
 * @Date: 2021-04-26 17:40:16
 * @LastEditors: 曹捷
 * @LastEditTime: 2021-12-23 14:57:39
 * @Description: 默认  列表查询模板
-->
<template>
  <div class="obit-main">
    <slot name="search"></slot>
    <div style="height:10px" v-if="hasSearch && searchInterval" class="background"></div>
    <div class="obit-content">
      <div class="flex-l-r p-b-10" v-if="name || hasBtn">
        <div class="content-title">{{name}}</div>
        <div>
          <slot name="btn"></slot>
        </div>
      </div>
      <slot></slot>
      <div class="table-footer flex-l-r" v-if="footerLeft  || pagination">
        <div>
          <slot name="footerLeft"></slot>
        </div>
        <a-pagination class="t-r" v-if="pagination" :show-size-changer="pagination.showSizeChanger" v-model:current="pagination.current" v-model:pageSize="pagination.pageSize"
          :total="pagination.total" :page-size-options="pagination.pageSizeOptions" @showSizeChange="pagination.onShowSizeChange" @change="pagination.onChange" :show-total="pagination.showTotal" />
      </div>
    </div>
  </div>
</template>

<script>
import { reactive, toRefs } from 'vue'
// import { Pagination } from 'ant-design-vue'

export default {
  // components:{Pagination},
  props: {
    name: {
      type: String,
      default: ''
    },
    pagination: {
      type: Object
    },
    hasSearch: {
      type: Boolean
    },
    hasBtn: {
      type: Boolean
    },
    footerLeft: {
      type: Boolean
    },
    searchInterval: {
      type: Boolean,
      default: true
    }
  },
  setup (props, contenxt) {
  }
}
</script>

<style>
</style>