diff --git a/src/pages/Order/Card/OrderLines.vue b/src/pages/Order/Card/OrderLines.vue
index f361d9898..391a4e374 100644
--- a/src/pages/Order/Card/OrderLines.vue
+++ b/src/pages/Order/Card/OrderLines.vue
@@ -1,8 +1,9 @@
 <script setup>
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import { ref, computed } from 'vue';
+import { ref, computed, watch } from 'vue';
 import { useQuasar } from 'quasar';
+import { useRouter } from 'vue-router';
 
 import VnConfirm from 'components/ui/VnConfirm.vue';
 import { toCurrency, toDate } from 'src/filters';
@@ -14,6 +15,7 @@ import VnLv from 'src/components/ui/VnLv.vue';
 import FetchedTags from 'src/components/ui/FetchedTags.vue';
 import { useStateStore } from 'stores/useStateStore';
 
+const router = useRouter();
 const stateStore = useStateStore();
 const route = useRoute();
 const { t } = useI18n();
@@ -194,6 +196,15 @@ async function confirmOrder() {
         type: 'positive',
     });
 }
+
+watch(
+    () => router.currentRoute.value.params.id,
+    () => {
+        lineFilter.value.where.orderFk = router.currentRoute.value.params.id;
+
+        tableLinesRef.value.reload();
+    }
+);
 </script>
 
 <template>
diff --git a/src/pages/Order/Card/OrderVolume.vue b/src/pages/Order/Card/OrderVolume.vue
index 35d68de16..62aa08bc3 100644
--- a/src/pages/Order/Card/OrderVolume.vue
+++ b/src/pages/Order/Card/OrderVolume.vue
@@ -1,7 +1,9 @@
 <script setup>
+import axios from 'axios';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import { ref } from 'vue';
+import { ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
 
 import VnPaginate from 'components/ui/VnPaginate.vue';
 import FetchData from 'components/FetchData.vue';
@@ -10,11 +12,20 @@ import CardList from 'components/ui/CardList.vue';
 import FetchedTags from 'components/ui/FetchedTags.vue';
 
 import { dashIfEmpty } from 'src/filters';
-import axios from 'axios';
 
+const router = useRouter();
 const route = useRoute();
 const { t } = useI18n();
 const volumeSummary = ref(null);
+const volumeRef = ref();
+const volumeFilter = ref({
+    include: [
+        {
+            relation: 'item',
+        },
+    ],
+    where: { orderFk: route.params.id },
+});
 
 const loadVolumes = async (rows) => {
     const { data } = await axios.get(`Orders/${route.params.id}/getVolumes`);
@@ -26,6 +37,15 @@ const loadVolumes = async (rows) => {
         });
     });
 };
+
+watch(
+    () => router.currentRoute.value.params.id,
+    () => {
+        volumeFilter.value.where.orderFk = router.currentRoute.value.params.id;
+
+        volumeRef.value.fetch();
+    }
+);
 </script>
 
 <template>
@@ -54,15 +74,11 @@ const loadVolumes = async (rows) => {
             </QCard>
             <VnPaginate
                 data-key="OrderCatalogVolume"
+                ref="volumeRef"
                 url="OrderRows"
                 :limit="20"
                 auto-load
-                :filter="{
-                    include: {
-                        relation: 'item',
-                    },
-                    where: { orderFk: route.params.id },
-                }"
+                :user-filter="volumeFilter"
                 order="itemFk"
                 @on-fetch="(data) => loadVolumes(data)"
             >