mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-15 15:37:33 +08:00
hide percent for outflows/inflows by account categorical chart
This commit is contained in:
@@ -33,6 +33,7 @@ export interface CommonPieChartProps {
|
||||
minValidPercent?: number;
|
||||
defaultCurrency?: string;
|
||||
showValue?: boolean;
|
||||
showPercent?: boolean;
|
||||
enableClickItem?: boolean;
|
||||
}
|
||||
|
||||
|
||||
@@ -142,9 +142,11 @@ const chartOptions = computed<object>(() => {
|
||||
tooltip += `<div class="d-inline-flex">${name}</div><br/>`;
|
||||
}
|
||||
|
||||
if (props.showValue) {
|
||||
if (props.showValue && props.showPercent) {
|
||||
tooltip += `<div class="d-inline-flex"><span>${value}</span><span class="ms-1">(${percent})</span></div>`;
|
||||
} else {
|
||||
} else if (props.showValue && !props.showPercent) {
|
||||
tooltip += `<div class="d-inline-flex">${value}</div>`;
|
||||
} else if (!props.showValue && props.showPercent) {
|
||||
tooltip += `<div class="d-inline-flex">${percent}</div>`;
|
||||
}
|
||||
|
||||
|
||||
@@ -40,6 +40,7 @@ const props = defineProps<{
|
||||
minValidPercent?: number;
|
||||
defaultCurrency?: string;
|
||||
showValue?: boolean;
|
||||
showPercent?: boolean;
|
||||
}>();
|
||||
|
||||
const theme = useTheme();
|
||||
@@ -92,11 +93,15 @@ const radarData = computed<RadarChartData>(() => {
|
||||
|
||||
tooltip += '<div><span class="chart-pointer" style="background-color: ' + color + '"></span>';
|
||||
tooltip += `<span>${name}</span>`;
|
||||
if (props.showValue) {
|
||||
|
||||
if (props.showValue && props.showPercent) {
|
||||
tooltip += `<span class="ms-1" style="float: inline-end">(${displayPercent})</span><span class="ms-5" style="float: inline-end">${displayValue}</span>`;
|
||||
} else {
|
||||
} else if (props.showValue && !props.showPercent) {
|
||||
tooltip += `<span class="ms-5" style="float: inline-end">${displayValue}</span>`;
|
||||
} else if (!props.showValue && props.showPercent) {
|
||||
tooltip += `<span class="ms-5" style="float: inline-end">${displayPercent}</span>`;
|
||||
}
|
||||
|
||||
tooltip += '</div>';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -44,7 +44,7 @@
|
||||
</f7-link>
|
||||
|
||||
<div class="pie-chart-toolbox-info">
|
||||
<p v-if="selectedItem">
|
||||
<p v-if="showPercent && selectedItem">
|
||||
<f7-chip class="chip-placeholder" outline v-if="skeleton">
|
||||
<span class="skeleton-text">Percent</span>
|
||||
</f7-chip>
|
||||
@@ -53,7 +53,7 @@
|
||||
:style="getColorStyle(selectedItem?.color, '--f7-chip-outline-border-color')"
|
||||
v-else-if="!skeleton"></f7-chip>
|
||||
</p>
|
||||
<p v-else-if="!validItems || !validItems.length">
|
||||
<p v-else-if="showPercent && (!validItems || !validItems.length)">
|
||||
<f7-chip outline text="---"></f7-chip>
|
||||
</p>
|
||||
<f7-link class="pie-chart-selected-item-info" :no-link-class="!enableClickItem" v-if="selectedItem" @click="clickItem(selectedItem)">
|
||||
|
||||
Reference in New Issue
Block a user