diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 40d7f367..d56376aa 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -1599,7 +1599,34 @@ watch([inputSearch, currentStatus], async () => {
             v-if="listCustomer.length !== 0"
             class="row justify-between q-pt-md"
           >
-            <div class="app-text-muted">
+            <div class="col-4">
+              <div class="row items-center">
+                <div style="width: 80px">{{ $t('showing') }}</div>
+                <div>
+                  <q-btn-dropdown dense unelevated :label="pageSize">
+                    <q-list>
+                      <q-item
+                        v-for="v in [10, 30, 50, 100, 500, 1000]"
+                        clickable
+                        v-close-popup
+                        @click="
+                          async () => {
+                            pageSize = v;
+                            await fetchListCustomer();
+                          }
+                        "
+                      >
+                        <q-item-section>
+                          <q-item-label>{{ v }}</q-item-label>
+                        </q-item-section>
+                      </q-item>
+                    </q-list>
+                  </q-btn-dropdown>
+                </div>
+              </div>
+            </div>
+
+            <div class="col-4 row justify-center app-text-muted">
               {{
                 $t('recordsPage', {
                   resultcurrentPage: listCustomer.length,
@@ -1607,16 +1634,18 @@ watch([inputSearch, currentStatus], async () => {
                 })
               }}
             </div>
-            <PaginationComponent
-              v-model:current-page="currentPageCustomer"
-              v-model:max-page="maxPageCustomer"
-              :fetch-data="
-                async () => {
-                  await fetchListCustomer();
-                  flowStore.rotate();
-                }
-              "
-            />
+            <div class="col-4 row justify-end">
+              <PaginationComponent
+                v-model:current-page="currentPageCustomer"
+                v-model:max-page="maxPageCustomer"
+                :fetch-data="
+                  async () => {
+                    await fetchListCustomer();
+                    flowStore.rotate();
+                  }
+                "
+              />
+            </div>
           </div>
         </template>