fix some numerals were not displayed according to the numerical system

This commit is contained in:
MaysWind
2025-08-29 00:18:46 +08:00
parent 0e634d83f4
commit 8f6adaa417
13 changed files with 145 additions and 83 deletions
+13 -2
View File
@@ -10,7 +10,7 @@
<div class="d-flex align-center justify-center" style="block-size: 24px; inline-size: 24px;">
<div class="slide-group-stepper-indicator"></div>
</div>
<h4 class="text-h4 step-number">{{ `0${idx + 1}` }}</h4>
<h4 class="text-h4 step-number">{{ getDisplayStep(idx + 1) }}</h4>
</div>
<div style="line-height: 0;">
<h6 class="text-sm font-weight-medium step-title">{{ step.title }}</h6>
@@ -31,7 +31,7 @@
<div class="d-flex align-center justify-center" style="block-size: 24px; inline-size: 24px;">
<div class="slide-group-stepper-indicator"></div>
</div>
<h4 class="text-h4 step-number">{{ `0${idx + 1}` }}</h4>
<h4 class="text-h4 step-number">{{ getDisplayStep(idx + 1) }}</h4>
</div>
<div style="line-height: 0;">
<h6 class="text-sm font-weight-medium step-title">{{ step.title }}</h6>
@@ -46,6 +46,10 @@
<script setup lang="ts">
import { computed } from 'vue';
import { useI18n } from '@/locales/helpers.ts';
import { NumeralSystem } from '@/core/numeral.ts';
export interface StepBarItem {
name: string;
title: string;
@@ -63,8 +67,15 @@ const emit = defineEmits<{
(e: 'step:change', stepName: string): void;
}>();
const { getCurrentNumeralSystemType } = useI18n();
const numeralSystem = computed<NumeralSystem>(() => getCurrentNumeralSystemType());
const isClickable = computed<boolean>(() => props.clickable !== 'false' && props.clickable !== false);
function getDisplayStep(index: number): string {
return numeralSystem.value.replaceWesternArabicDigitsToLocalizedDigits(index.toString().padStart(2, NumeralSystem.WesternArabicNumerals.digitZero));
}
function changeStep(step: StepBarItem): void {
if (isClickable.value) {
emit('step:change', step.name);