2019-03-29 10:21:11 +08:00

120 lines
3.4 KiB
Vue

<template>
<div class="page-wrap">
<ui-loading :show="page_loading.show"></ui-loading>
<div class="page-handle-wrap">
<ul class="handle-wraper bd-b">
<li class="f-l">
<div class="text-exp">
<b>全部信息</b>
</div>
</li>
<li class="f-r">
<div class="handle-item">
<Button @click="search.show=!search.show" ghost icon="ios-search" type="primary">搜索</Button>
</div>
<div class="handle-item">
<Button @click="index(1)" icon="md-refresh">刷新</Button>
</div>
<div class="handle-item">
<Button @click="exportExcel" icon="md-download">导出</Button>
</div>
</li>
</ul>
<div class="search-wrap" v-show="search.show">
<ul class="handle-wraper">
<li class="handle-item w-250">
<AutoComplete
@on-search="handleCompleteCompanies"
icon="ios-search"
placeholder="企业名称"
v-model.trim="options.name"
>
<Option
:key="item.id"
:value="item.name"
v-for="item in completeHandledCompanies"
>{{ item.name }}</Option>
</AutoComplete>
</li>
<li class="handle-item w-250">
<DatePicker
:editable="false"
placeholder="请选择时间"
placement="bottom-start"
type="daterange"
v-model.trim="options.time"
:options="datePickerOptionsMonth"
></DatePicker>
</li>
</ul>
<ul class="handle-wraper">
<li class="f-r">
<div class="handle-item">
<Button @click="index(1)" ghost type="primary">立即搜索</Button>
</div>
<div class="handle-item">
<Button @click="resetSearch" ghost type="warning">重置搜索</Button>
</div>
</li>
</ul>
</div>
</div>
<div class="page-list-wrap">
<Table
:columns="columns"
:data="data"
:height="page.limit > 12 ? 610 : ''"
ref="table"
stripe
>
<template class="table-footer" slot="footer">
<colgroup class="table-footer-colgroup"></colgroup>
<thead class="ivu-table">
<tr>
<th>
<div class="ivu-table-cell">总计</div>
</th>
<th>
<div class="ivu-table-cell"></div>
</th>
<th>
<div class="ivu-table-cell">{{stats.total}}</div>
</th>
<th>
<div class="ivu-table-cell">{{stats.counts}}</div>
</th>
<th>
<div class="ivu-table-cell">{{stats.renewed_counts}}</div>
</th>
<th v-if="page.limit > 12" rowspan="1"></th>
</tr>
</thead>
</template>
</Table>
</div>
<div class="page-turn-wrap">
<Page
:current="Number(page.page)"
:page-size="Number(page.limit)"
:page-size-opts="[10, 20, 100, Infinity]"
:total="Number(page.total)"
@on-change="changePage"
@on-page-size-change="changeLimit"
show-elevator
show-sizer
show-total
></Page>
</div>
</div>
</template>
<script src="./js/index.js"></script>