Commit e5ac79258a39dd1db1458d3b2f8ddc44305ddc19

Authored by 梁灏
1 parent 962c40bd

update Rate

update Rate
assets/iview.png

164 KB | W: | H:

162 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
src/components/rate/rate.vue
... ... @@ -7,12 +7,18 @@
7 7 @click="handleClick(item)">
8 8 <span :class="[prefixCls + '-star-content']" type="half"></span>
9 9 </div>
  10 + <div :class="[prefixCls + '-text']" v-if="showText">
  11 + <slot>{{ value }} <template v-if="value <= 1">{{ t('i.rate.star') }}</template><template v-else>{{ t('i.rate.stars') }}</template></slot>
  12 + </div>
10 13 </div>
11 14 </template>
12 15 <script>
  16 + import Locale from '../../mixins/locale';
  17 +
13 18 const prefixCls = 'ivu-rate';
14 19  
15 20 export default {
  21 + mixins: [ Locale ],
16 22 props: {
17 23 count: {
18 24 type: Number,
... ... @@ -29,6 +35,10 @@
29 35 disabled: {
30 36 type: Boolean,
31 37 default: false
  38 + },
  39 + showText: {
  40 + type: Boolean,
  41 + default: false
32 42 }
33 43 },
34 44 data () {
... ...
src/locale/lang/en-US.js
... ... @@ -83,6 +83,10 @@ export default {
83 83 page: '/page',
84 84 goto: 'Goto',
85 85 p: ''
  86 + },
  87 + rate: {
  88 + star: 'Star',
  89 + stars: 'Stars'
86 90 }
87 91 }
88 92 };
89 93 \ No newline at end of file
... ...
src/locale/lang/zh-CN.js
... ... @@ -83,6 +83,10 @@ export default {
83 83 page: '条/页',
84 84 goto: '跳至',
85 85 p: '页'
  86 + },
  87 + rate: {
  88 + star: '星',
  89 + stars: '星'
86 90 }
87 91 }
88 92 };
89 93 \ No newline at end of file
... ...
src/locale/lang/zh-TW.js
... ... @@ -83,6 +83,10 @@ export default {
83 83 page: '條/頁',
84 84 goto: '跳至',
85 85 p: '頁'
  86 + },
  87 + rate: {
  88 + star: '星',
  89 + stars: '星'
86 90 }
87 91 }
88 92 };
89 93 \ No newline at end of file
... ...
src/styles/components/rate.less
... ... @@ -8,7 +8,6 @@
8 8 vertical-align: middle;
9 9 font-weight: normal;
10 10 font-style: normal;
11   - font-family: 'Ionicons';
12 11  
13 12 &-disabled &-star {
14 13 &:before,
... ... @@ -26,6 +25,7 @@
26 25 padding: 0;
27 26 margin-right: 8px;
28 27 position: relative;
  28 + font-family: 'Ionicons';
29 29 transition: all 0.3s ease;
30 30  
31 31 &:hover {
... ... @@ -63,4 +63,10 @@
63 63 color: tint(@rate-star-color, 20%);
64 64 }
65 65 }
  66 + &-text {
  67 + margin-left: 8px;
  68 + vertical-align: middle;
  69 + display: inline-block;
  70 + font-size: @font-size-small;
  71 + }
66 72 }
67 73 \ No newline at end of file
... ...
test/main.js
... ... @@ -6,9 +6,10 @@ import VueRouter from &#39;vue-router&#39;;
6 6 import App from './app.vue';
7 7 import iView from '../src/index';
8 8 // import locale from '../src/locale/lang/en-US';
  9 +import locale from '../src/locale/lang/zh-CN';
9 10  
10 11 Vue.use(VueRouter);
11   -Vue.use(iView);
  12 +Vue.use(iView, { locale });
12 13  
13 14 // 开启debug模式
14 15 Vue.config.debug = true;
... ...
test/routers/rate.vue
... ... @@ -2,7 +2,7 @@
2 2 <div style="margin: 100px">
3 3 {{value}}
4 4 <br><br><br>
5   - <Rate :value.sync="value" :count="5" allow-half></Rate>
  5 + <Rate :value.sync="value" :count="5" allow-half show-text></Rate>
6 6 <br><br><br>
7 7 <i-button @click="value++">add</i-button>
8 8 <i-button @click="value--">remove</i-button>
... ...