Commit 6932b4d73c17c0c330e7fb5521537fd09236d1ff

Authored by 梁灏
1 parent b7cf983e

update Page component

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