54 lines
1.0 KiB
Vue
54 lines
1.0 KiB
Vue
<template>
|
|
<div :class="[prefixCls]">
|
|
<slot name="subtitle">
|
|
<div :class="[`${prefixCls}-subtitle`]">{{ typeof subTitle === 'string' ? subTitle : subTitle() }}</div>
|
|
</slot>
|
|
<div class="number-info-value">
|
|
<span>{{ total }}</span>
|
|
<span class="sub-total">
|
|
{{ subTotal }}
|
|
<icon :type="`caret-${status}`" />
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Icon from 'ant-design-vue/es/icon'
|
|
|
|
export default {
|
|
name: 'NumberInfo',
|
|
props: {
|
|
prefixCls: {
|
|
type: String,
|
|
default: 'ant-pro-number-info'
|
|
},
|
|
total: {
|
|
type: Number,
|
|
required: true
|
|
},
|
|
subTotal: {
|
|
type: Number,
|
|
required: true
|
|
},
|
|
subTitle: {
|
|
type: [String, Function],
|
|
default: ''
|
|
},
|
|
status: {
|
|
type: String,
|
|
default: 'up'
|
|
}
|
|
},
|
|
components: {
|
|
Icon
|
|
},
|
|
data () {
|
|
return {}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
@import "index";
|
|
</style> |