Commit 6932b4d73c17c0c330e7fb5521537fd09236d1ff

Authored by 梁灏
1 parent b7cf983e

update Page component

change Page select size in mini type
components/page/options.vue
1 1 <template>
2 2 <div v-if="showSizer || showElevator" :class="optsClasses">
3 3 <div v-if="showSizer" :class="sizerClasses">
4   - <i-select :model.sync="pageSize" @on-change="changeSize">
  4 + <i-select :model.sync="pageSize" :size="size" @on-change="changeSize">
5 5 <i-option v-for="item in pageSizeOpts" :value="item" style="text-align:center;">{{ item }} 条/页</i-option>
6 6 </i-select>
7 7 </div>
... ... @@ -31,9 +31,13 @@
31 31 current: Number,
32 32 _current: Number,
33 33 pageSize: Number,
34   - allPages: Number
  34 + allPages: Number,
  35 + isSmall: Boolean
35 36 },
36 37 computed: {
  38 + size () {
  39 + return this.isSmall ? 'small' : 'default';
  40 + },
37 41 optsClasses () {
38 42 return [
39 43 `${prefixCls}-options`
... ...
components/page/page.vue
... ... @@ -56,6 +56,7 @@
56 56 :_current.once="current"
57 57 :current.sync="current"
58 58 :all-pages="allPages"
  59 + :is-small="isSmall"
59 60 @on-size="onSize"
60 61 @on-page="onPage">
61 62 </Options>
... ... @@ -116,6 +117,9 @@
116 117 }
117 118 },
118 119 computed: {
  120 + isSmall () {
  121 + return !!this.size;
  122 + },
119 123 allPages () {
120 124 const allPage = Math.ceil(this.total / this.pageSize);
121 125 return (allPage === 0) ? 1 : allPage;
... ...
components/select/select.vue
... ... @@ -71,7 +71,7 @@
71 71 },
72 72 size: {
73 73 validator (value) {
74   - return oneOf(value, ['small', 'large']);
  74 + return oneOf(value, ['small', 'large', 'default']);
75 75 }
76 76 },
77 77 labelInValue: {
... ...
local/routers/index.vue
... ... @@ -2,7 +2,9 @@
2 2  
3 3 </style>
4 4 <template>
5   - <Page :total="100" show-sizer></Page>
  5 + <Page :total="40" size="small"></Page>
  6 + <Page :total="40" size="small" show-elevator show-sizer></Page>
  7 + <Page :total="40" size="small" show-total></Page>
6 8 </template>
7 9 <script>
8 10 import { Modal, Button, Message, Page } from 'iview';
... ...
local/routers/select.vue
1 1 <template>
2 2 <div>
3   - <!--<br><br><br><br><br><br><br><br><br><br><br>-->
  3 + <br><br><br><br><br><br><br><br><br><br><br>
4 4 {{ city | json }}<br>
5 5 <Button @click="city = 'hangzhou'">切换城市</Button>
6 6 <br>
... ...
package.json
1 1 {
2 2 "name": "iview",
3   - "version": "0.9.4rc-3",
  3 + "version": "0.9.4rc-4",
4 4 "title": "iView",
5 5 "description": "A high quality UI components Library with Vue.js",
6 6 "homepage": "http://www.iviewui.com",
... ...