diff --git a/examples/routers/input.vue b/examples/routers/input.vue index 6f9a01b..fd7766a 100644 --- a/examples/routers/input.vue +++ b/examples/routers/input.vue @@ -14,7 +14,17 @@ <Button type="ghost" @click="handleReset('formCustom')" style="margin-left: 8px">Reset</Button> </FormItem> <br><br> + <Icon class="ivu-load-loop" type="loading" size="14" color="#ff6600" /> + + <Icon class="ivu-load-loop" type="loading" size="12" color="#ff6600" /> + <Icon class="ivu-load-loop" type="loading" size="13" color="#ff6600" /> + + <Icon class="ivu-load-loop" type="loading" size="16" color="#ff6600" /> + <Icon class="ivu-load-loop" type="loading" size="18" color="#ff6600" /> + <Icon class="ivu-load-loop" type="loading" size="20" color="#ff6600" /> <Icon class="ivu-load-loop" type="loading" size="30" color="#ff6600" /> + <Icon class="ivu-load-loop" type="loading" size="30" color="#ff6600" /> + <Icon type="ios-alert" size="30" color="#ff6600" /> <Icon class="ivu-load-loop" type="ios-sync" size="30" color="#ff6600" /> </Form> diff --git a/examples/routers/message.vue b/examples/routers/message.vue index 7fc3a6a..dc11d98 100644 --- a/examples/routers/message.vue +++ b/examples/routers/message.vue @@ -1,54 +1,16 @@ <template> - <div> - <i-button @click.native="info">显示普通提示</i-button> - <i-button @click.native="success">显示成功提示</i-button> - <i-button @click.native="warning">显示警告提示</i-button> - <i-button @click.native="error">显示错误提示</i-button> - <i-button @click.native="destroy">销毁提示</i-button> - </div> + <Button @click="loading">Display loading...</Button> </template> <script> export default { methods: { - info () { -// this.$Message.info('这是一条普通提示'); - this.$Message.success({ - content: '这是一条普通提示2', - duration: 500, - onClose () { -// console.log(123) - }, - closable: true, - render (h) { - return h('Button',{ - props: { - type: 'primary' - } - }, '这是render出来的'); - } - }) - }, - success () { - this.$Message.success({ - content: '这是一条成功的提示', - duration: 4 + loading () { + const msg = this.$Message.loading({ + content: 'Loading...', + duration: 0 }); + setTimeout(msg, 103000); }, - warning () { - this.$Message.warning('这是一条警告的提示'); - }, - error () { - this.$Message.error('对方不想说话,并且向你抛出了一个异常'); - }, - destroy () { - this.$Message.destroy(); - } - }, - mounted () { -// this.$Message.config({ -// top: 50, -// duration: 3 -// }); } } </script> diff --git a/src/components/input/input.vue b/src/components/input/input.vue index 6ee0741..fbd2ba0 100644 --- a/src/components/input/input.vue +++ b/src/components/input/input.vue @@ -5,7 +5,7 @@ <i class="ivu-icon" :class="['ivu-icon-ios-close-circle', prefixCls + '-icon', prefixCls + '-icon-clear' , prefixCls + '-icon-normal']" v-if="clearable && currentValue" @click="handleClear"></i> <i class="ivu-icon" :class="['ivu-icon-' + icon, prefixCls + '-icon', prefixCls + '-icon-normal']" v-else-if="icon" @click="handleIconClick"></i> <transition name="fade"> - <i class="ivu-icon ivu-icon-ios-sync ivu-load-loop" :class="[prefixCls + '-icon', prefixCls + '-icon-validate']" v-if="!icon"></i> + <i class="ivu-icon ivu-icon-loading ivu-load-loop" :class="[prefixCls + '-icon', prefixCls + '-icon-validate']" v-if="!icon"></i> </transition> <input :id="elementId" diff --git a/src/components/message/index.js b/src/components/message/index.js index 32af5ab..102d2d7 100644 --- a/src/components/message/index.js +++ b/src/components/message/index.js @@ -17,7 +17,7 @@ const iconTypes = { 'success': 'ios-checkmark-circle', 'warning': 'ios-alert', 'error': 'ios-close-circle', - 'loading': 'ios-sync' + 'loading': 'loading' }; function getMessageInstance () { diff --git a/src/styles/common/iconfont/_ionicons-font.less b/src/styles/common/iconfont/_ionicons-font.less index 2c68f28..f7785bb 100755 --- a/src/styles/common/iconfont/_ionicons-font.less +++ b/src/styles/common/iconfont/_ionicons-font.less @@ -28,4 +28,22 @@ .ivu-icon { .ivu-icon(); +} + +.ivu-icon-loading{ + position: relative; + &::before{ + content: "\F1F6"; + } + &::after{ + content: ""; + display: block; + width: 50%; + height: 50%; + background: #fff; + position: absolute; + top: 1px; + left: 50%; + } + } \ No newline at end of file -- libgit2 0.21.4