forked from cerc-io/cosmos-explorer
fix: number to percent
This commit is contained in:
parent
e6cf8e3bf0
commit
4c2f3f0f8d
@ -1,10 +1,27 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import type { PropType } from 'vue';
|
import type { PropType } from 'vue';
|
||||||
|
import { useFormatter } from "@/stores";
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
cardItem: {
|
cardItem: {
|
||||||
type: Object as PropType<{ title: string; items: Array<any> }>,
|
type: Object as PropType<{ title: string; items: Array<any> }>,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const formatter = useFormatter()
|
||||||
|
function calculateValue(value: any){
|
||||||
|
if (Array.isArray(value) ){
|
||||||
|
return (value[0] && value[0].amount)|| '-'
|
||||||
|
}
|
||||||
|
const newValue = Number(value)
|
||||||
|
if(`${newValue}` === 'NaN' || typeof(value) === 'boolean'){
|
||||||
|
return value
|
||||||
|
}
|
||||||
|
|
||||||
|
if (newValue < 1 && newValue > 0) {
|
||||||
|
return formatter.formatDecimalToPercent(value)
|
||||||
|
}
|
||||||
|
return newValue
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
@ -21,7 +38,7 @@ const props = defineProps({
|
|||||||
class="rounded-sm bg-active px-4 py-2"
|
class="rounded-sm bg-active px-4 py-2"
|
||||||
>
|
>
|
||||||
<div class="text-xs mb-2 text-secondary">{{ item?.subtitle }}</div>
|
<div class="text-xs mb-2 text-secondary">{{ item?.subtitle }}</div>
|
||||||
<div class="text-base text-main">{{ Array.isArray(item?.value) ? (item?.value[0] && item?.value[0].amount)|| '-':`${Number(item?.value)}` === 'NaN' ? item?.value : Number(item?.value)}}</div>
|
<div class="text-base text-main">{{ calculateValue(item?.value) }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -51,10 +51,6 @@ onMounted(() => {
|
|||||||
<ArrayObjectElement :value="store.nodeVersion?.items" :thead="false"/>
|
<ArrayObjectElement :value="store.nodeVersion?.items" :thead="false"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Application Version -->
|
|
||||||
<!-- <TableParameter :tableItem="store.appVersion" /> -->
|
|
||||||
<!-- Node Information -->
|
|
||||||
<!-- <TableParameter :tableItem="store.nodeVersion" /> -->
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user