Commit e5ac79258a39dd1db1458d3b2f8ddc44305ddc19
1 parent
962c40bd
update Rate
update Rate
Showing
8 changed files
with
32 additions
and
3 deletions
Show diff stats
assets/iview.png
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
src/locale/lang/zh-CN.js
src/locale/lang/zh-TW.js
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 'vue-router'; |
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> | ... | ... |