element-plus
Version:
A Component Library for Vue 3
1 lines • 2.07 kB
Source Map (JSON)
{"version":3,"file":"statistic2.mjs","names":[],"sources":["../../../../../../packages/components/statistic/src/statistic.vue"],"sourcesContent":["<template>\n <div :class=\"ns.b()\">\n <div v-if=\"$slots.title || title\" :class=\"ns.e('head')\">\n <slot name=\"title\">\n {{ title }}\n </slot>\n </div>\n <div :class=\"ns.e('content')\">\n <div v-if=\"$slots.prefix || prefix\" :class=\"ns.e('prefix')\">\n <slot name=\"prefix\">\n <span>{{ prefix }}</span>\n </slot>\n </div>\n <span :class=\"ns.e('number')\" :style=\"valueStyle\">\n {{ displayValue }}\n </span>\n <div v-if=\"$slots.suffix || suffix\" :class=\"ns.e('suffix')\">\n <slot name=\"suffix\">\n <span>{{ suffix }}</span>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { isFunction, isNumber } from '@element-plus/utils'\n\nimport type { StatisticProps } from './statistic'\n\ndefineOptions({\n name: 'ElStatistic',\n})\n\nconst props = withDefaults(defineProps<StatisticProps>(), {\n decimalSeparator: '.',\n groupSeparator: ',',\n precision: 0,\n value: 0,\n valueStyle: undefined,\n})\nconst ns = useNamespace('statistic')\n\nconst displayValue = computed(() => {\n const { value, formatter, precision, decimalSeparator, groupSeparator } =\n props\n\n if (isFunction(formatter)) return formatter(value)\n\n // https://github.com/element-plus/element-plus/issues/17784\n if (!isNumber(value) || Number.isNaN(value)) return value\n\n let [integer, decimal = ''] = String(value).split('.')\n decimal = decimal\n .padEnd(precision, '0')\n .slice(0, precision > 0 ? precision : 0)\n integer = integer.replace(/\\B(?=(\\d{3})+(?!\\d))/g, groupSeparator)\n return [integer, decimal].join(decimal ? decimalSeparator : '')\n})\n\ndefineExpose({\n /**\n * @description current display value\n */\n displayValue,\n})\n</script>\n"],"mappings":""}