<template>
  <div class="i-table clearfix">
    <Spin size="large" fix v-if="spinShow">
      <slot>
        <div>
          <Icon type="ios-loading" size=40 class="demo-spin-icon-load"></Icon>
          <div>数据加载中</div>
        </div>
      </slot>
    </Spin>
    <advance-search-form v-if="prop.advanceSearch" :searchModel="prop.advanceSearch" :searchEvent="advanceSearch" :btnLength="actions.def.length"></advance-search-form>
    <Row class="i-table-top-btns" v-if="actions.def.length !==0">
      <!-- <i-button v-for="btn of actions.def" v-if="btn.access" :type="btn.type" @click="btn.handler" :icon="btn.icon">{{btn.name}}
      </i-button> -->
      
      <i-button  v-for="btn of actions.def" v-if="(btn.isAdmin&&isAdministrator)||!btn.isAdmin" :type="btn.type" @click="btn.handler" :icon="btn.icon" :loading="btn.loading">{{btn.name}}
      </i-button>
      <component v-if="prop.search&&prop.search.show" v-bind:is="prop.search.componentName||defaultSearchComName" :searchModel="prop.search" :searchEvent="search" :changeEvent="changeDate">
      </component>
      
    </Row>
    <Row class="i-table-title" v-if="prop.title">
      <h3>{{prop.title}}</h3>
    </Row>
    <Table ref="elTable" :border="true" :data="tableData" :show-header="!prop.notShowHeader?true:false" :height="tableHeight"
             :columns="prop.columns" @on-selection-change="handleSelect" @on-sort-change="handleSortChange"
             @on-current-change="handleCurrentRowChange" @on-row-click="handleRowClick" highlight-row stripe>
    </Table>
    <Page @on-page-size-change="handleSizeChange" @on-change="handleCurrentPageChange"
          :page-size-opts="pagination.pageSizes" :page-size="pagination.pageSize" :total="pagination.total"
          :current="pagination.currentPage" v-show="!$customs.flag" :show-total="pagination.showTotal" :show-sizer="pagination.showSizer">
    </Page>
    <div class="page-container" v-show="$customs.flag&&isShowPagination" >
      <Page size="small" @on-page-size-change="handleSizeChange" @on-change="handleCurrentPageChange"
            :page-size-opts="pagination.pageSizes" :page-size="pagination.pageSize" :total="pagination.total"
            :current="pagination.currentPage" :show-total="pagination.showTotal" :show-sizer="pagination.showSizer">
      </Page>
      <div class="page-elevator">
        前往
          <input
            class="ivu-input"
            type="text"
            :value="pagination.currentPage"
            autocomplete="off"
            spellcheck="false"
            @keyup.enter="keyupEnter"
          />
        页
      </div> 
    </div>
    <Modal class="modal" @on-cancel="cancel" :width="prop.formWidth||formInfo.width" :title="formInfo.title"
           v-model="dialogVisible" ref="dialog" :mask-closable="false">
      <slot name="form" :obj="formInfo.model" :action="formInfo.action" :tableVm="this" :closeModal="closeModal" :tableInfo="prop"></slot>
      <div slot="footer">
      </div>
    </Modal>
  </div>
</template>
<script lang="ts" src="./mixin.ts">

</script>


