add Page UI

add Page UI
This commit is contained in:
梁灏 2016-09-23 10:57:56 +08:00
parent f30c267565
commit 93064e3b74
8 changed files with 284 additions and 27 deletions

View file

@ -2,9 +2,6 @@
body{
padding: 100px;
}
.ivu-page-item-active{
color: #f60;
}
</style>
<template>
<Page :current="1" :total="total" show-sizer show-total show-elevator :page-size="10" simple @on-change="setPage"></Page>

View file

@ -6,21 +6,22 @@
<Button @click="error">error</Button>
<Button @click="update">update</Button>
<br><br>
<Timeline>
<Timeline-item>
<Icon type="close-circled" slot="dot"></Icon>
<p class="time">1976</p>
<p class="content">Apple I 问世</p>
</Timeline-item>
<Timeline-item>
<p class="time">1984</p>
<p class="content">发布 Macintosh</p>
</Timeline-item>
</Timeline>
<Page :total="100"></Page>
<Page :total="100" show-sizer></Page>
<Page :total="100" show-elevator></Page>
<Page :total="100" show-total></Page>
<br><br>
<Page :current="2" :total="50" simple></Page>
<br>
<Page :total="400" size="small"></Page>
<br>
<Page :total="400" size="small" show-elevator show-sizer></Page>
<br>
<Page :total="400" size="small" show-total></Page>
</div>
</template>
<script>
import { Tag, LoadingBar, Button, Progress, Icon, Timeline } from 'iview';
import { Tag, LoadingBar, Button, Progress, Icon, Timeline, Page } from 'iview';
const ButtonGroup = Button.Group;
const TimelineItem = Timeline.Item;
export default {
@ -31,7 +32,8 @@
ButtonGroup,
Timeline,
TimelineItem,
Icon
Icon,
Page
},
props: {