60 lines
1.5 KiB
Vue
60 lines
1.5 KiB
Vue
|
<template>
|
||
|
|
<div :class="classes" transition="fade">
|
||
|
|
<div :class="mainClasses">
|
||
|
|
<span :class="dotClasses"></span>
|
||
|
|
<div :class="textClasses" v-el:text><slot></slot></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import { oneOf } from '../../utils/assist';
|
||
|
|
|
||
|
|
const prefixCls = 'ivu-spin';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
size: {
|
||
|
|
validator (value) {
|
||
|
|
return oneOf(value, ['small', 'large']);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
fix: {
|
||
|
|
type: Boolean,
|
||
|
|
default: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data () {
|
||
|
|
return {
|
||
|
|
showText: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
classes () {
|
||
|
|
return [
|
||
|
|
`${prefixCls}`,
|
||
|
|
{
|
||
|
|
[`${prefixCls}-${this.size}`]: !!this.size,
|
||
|
|
[`${prefixCls}-fix`]: this.fix,
|
||
|
|
[`${prefixCls}-show-text`]: this.showText,
|
||
|
|
}
|
||
|
|
]
|
||
|
|
},
|
||
|
|
mainClasses () {
|
||
|
|
return `${prefixCls}-main`;
|
||
|
|
},
|
||
|
|
dotClasses () {
|
||
|
|
return `${prefixCls}-dot`;
|
||
|
|
},
|
||
|
|
textClasses () {
|
||
|
|
return `${prefixCls}-text`;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
compiled () {
|
||
|
|
const text = this.$els.text.innerHTML;
|
||
|
|
|
||
|
|
if (text != '') {
|
||
|
|
this.showText = true;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|