diff --git a/src/components/03_customer-management/HistoryEditComponent.vue b/src/components/03_customer-management/HistoryEditComponent.vue
index c7edb621..40d0a5db 100644
--- a/src/components/03_customer-management/HistoryEditComponent.vue
+++ b/src/components/03_customer-management/HistoryEditComponent.vue
@@ -448,7 +448,7 @@ const currentData = computed(() => {
                 <q-step
                   v-for="(item, index) in props.row.history"
                   :key="index"
-                  :name="1"
+                  :name="index"
                   :title="$t(mapName(item.field).title)"
                   :caption="$t(mapName(item.field).i18n)"
                   :icon="`mdi-numeric-${props.row.history.length - index}`"
@@ -538,4 +538,17 @@ const currentData = computed(() => {
   cursor: pointer;
   font-family: 'Noto Sans Thai', sans-serif;
 }
+
+:deep(.q-stepper) {
+  counter-reset: css-counter;
+}
+
+:deep(.q-stepper__dot)span > * {
+  display: none;
+}
+
+:deep(.q-stepper__dot) span::before {
+  counter-increment: css-counter;
+  content: counter(css-counter);
+}
 </style>