src/components/common/VnSection.vue

@@ -4,6 +4,7 @@ import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import VnTableFilter from '../VnTable/VnTableFilter.vue';
 import { onBeforeMount, computed } from 'vue';
 import { useArrayData } from 'src/composables/useArrayData';
+import { useRoute } from 'vue-router';
 
 const $props = defineProps({
     section: {
@@ -40,8 +41,17 @@ const $props = defineProps({
     },
 });
 
-const sectionValue = computed(() => $props.section ?? $props.dataKey);
+const route = useRoute();
 let arrayData;
+const sectionValue = computed(() => $props.section ?? $props.dataKey);
+const isMainSection = computed(() => {
+    const isSame = sectionValue.value == route.name;
+    if (!isSame && arrayData) {
+        arrayData.reset(['userParams', 'userFilter']);
+    }
+    return isSame;
+});
+
 onBeforeMount(() => {
     if ($props.dataKey)
         arrayData = useArrayData($props.dataKey, {
@@ -74,6 +84,6 @@ onBeforeMount(() => {
             </slot>
         </template>
     </RightMenu>
-    <slot name="body" v-if="sectionValue == $route.name" />
+    <slot name="body" v-if="isMainSection" />
     <RouterView v-else />
 </template>

src/components/ui/VnSearchbar.vue

@@ -126,6 +126,7 @@ async function search() {
         delete filter.params.search;
     }
     await arrayData.applyFilter(filter);
+    searchText.value = undefined;
 }
 </script>
 <template>

src/pages/Order/Card/OrderSummary.vue

@@ -221,7 +221,7 @@ async function handleConfirm() {
                                             </span>
                                         </div>
                                     </div>
-                                    <FetchedTags :item="props.row.item" />
+                                    <FetchedTags :item="props.row.item" :columns="3" />
                                 </QTd>
                                 <QTd key="quantity" :props="props">
                                     {{ props.row.quantity }}