fix: itemType redirection and fix filters

src/components/common/VnComponent.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { computed, defineModel } from 'vue';
+import { computed } from 'vue';
 
 const model = defineModel(undefined, { required: true });
 const $props = defineProps({

src/components/ui/VnFilterPanel.vue

@@ -37,7 +37,7 @@ const $props = defineProps({
     },
     hiddenTags: {
         type: Array,
-        default: () => ['filter', 'search', 'or', 'and'],
+        default: () => ['filter', 'or', 'and'],
     },
     customTags: {
         type: Array,

src/pages/Item/ItemType/Card/ItemTypeCard.vue

@@ -1,7 +1,7 @@
 <script setup>
 import VnCard from 'components/common/VnCard.vue';
-import ItemTypeDescriptor from 'src/pages/ItemType/Card/ItemTypeDescriptor.vue';
+import ItemTypeDescriptor from 'src/pages/Item/ItemType/Card/ItemTypeDescriptor.vue';
-import ItemTypeFilter from 'src/pages/ItemType/ItemTypeFilter.vue';
+import ItemTypeFilter from 'src/pages/Item/ItemType/ItemTypeFilter.vue';
 import ItemTypeSearchbar from '../ItemTypeSearchbar.vue';
 </script>
 <template>

src/pages/Item/ItemType/ItemTypeFilter.vue

@@ -12,6 +12,39 @@ const props = defineProps({
 });
 
 const emit = defineEmits(['search']);
+const exprBuilder = (param, value) => {
+    switch (param) {
+        case 'name':
+            return {
+                name: { like: `%${value}%` },
+            };
+        case 'code':
+            return {
+                code: { like: `%${value}%` },
+            };
+        case 'search':
+            if (value) {
+                if (!isNaN(value)) {
+                    return { id: value };
+                } else {
+                    return {
+                        or: [
+                            {
+                                name: {
+                                    like: `%${value}%`,
+                                },
+                            },
+                            {
+                                code: {
+                                    like: `%${value}%`,
+                                },
+                            },
+                        ],
+                    };
+                }
+            }
+    }
+};
 </script>
 
 <template>
@@ -19,6 +52,8 @@ const emit = defineEmits(['search']);
         :data-key="props.dataKey"
         :search-button="true"
         @search="emit('search')"
+        search-url="table"
+        :expr-builder="exprBuilder"
     >
         <template #tags="{ tag, formatFn }">
             <div class="q-gutter-x-xs">

src/pages/Item/ItemType/ItemTypeSearchbar.vue

@@ -10,6 +10,7 @@ const { t } = useI18n();
         url="ItemTypes"
         :label="t('Search item type')"
         :info="t('Search itemType by id, name or code')"
+        search-url="table"
     />
 </template>
 <i18n>

src/pages/Item/ItemTypeCreate.vue

@@ -1,98 +0,0 @@
-<script setup>
-import { reactive, ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRouter } from 'vue-router';
-
-import FetchData from 'components/FetchData.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
-import FormModel from 'components/FormModel.vue';
-import VnRow from 'components/ui/VnRow.vue';
-import VnInput from 'src/components/common/VnInput.vue';
-import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
-
-const { t } = useI18n();
-const router = useRouter();
-
-const newItemTypeForm = reactive({});
-
-const categoriesOptions = ref([]);
-const temperaturesOptions = ref([]);
-
-const redirectToItemTypeBasicData = (_, { id }) => {
-    router.push({ name: 'ItemTypeBasicData', params: { id } });
-};
-</script>
-
-<template>
-    <FetchData
-        url="ItemCategories"
-        @on-fetch="(data) => (categoriesOptions = data)"
-        :filter="{ order: 'name ASC', fields: ['id', 'name'] }"
-        auto-load
-    />
-    <FetchData
-        url="Temperatures"
-        @on-fetch="(data) => (temperaturesOptions = data)"
-        :filter="{ order: 'name ASC', fields: ['code', 'name'] }"
-        auto-load
-    />
-    <QPage>
-        <VnSubToolbar />
-        <FormModel
-            url-create="ItemTypes"
-            model="itemTypeCreate"
-            :form-initial-data="newItemTypeForm"
-            observe-form-changes
-            @on-data-saved="redirectToItemTypeBasicData"
-        >
-            <template #form="{ data }">
-                <VnRow>
-                    <VnInput v-model="data.code" :label="t('itemType.shared.code')" />
-                    <VnInput v-model="data.name" :label="t('itemType.shared.name')" />
-                </VnRow>
-                <VnRow>
-                    <VnSelect
-                        url="Workers/search"
-                        v-model="data.workerFk"
-                        :label="t('shared.worker')"
-                        sort-by="nickname ASC"
-                        :fields="['id', 'nickname']"
-                        :params="{ departmentCodes: ['shopping'] }"
-                        option-label="nickname"
-                        option-value="id"
-                        hide-selected
-                        ><template #option="scope">
-                            <QItem v-bind="scope.itemProps">
-                                <QItemSection>
-                                    <QItemLabel>{{ scope.opt?.name }}</QItemLabel>
-                                    <QItemLabel caption
-                                        >{{ scope.opt?.nickname }},
-                                        {{ scope.opt?.code }}</QItemLabel
-                                    >
-                                </QItemSection>
-                            </QItem>
-                        </template>
-                    </VnSelect>
-                    <VnSelect
-                        v-model="data.categoryFk"
-                        :label="t('itemType.shared.category')"
-                        :options="categoriesOptions"
-                        option-value="id"
-                        option-label="name"
-                        hide-selected
-                    />
-                </VnRow>
-                <VnRow>
-                    <VnSelect
-                        v-model="data.temperatureFk"
-                        :label="t('itemType.shared.temperature')"
-                        :options="temperaturesOptions"
-                        option-value="code"
-                        option-label="name"
-                        hide-selected
-                    />
-                </VnRow>
-            </template>
-        </FormModel>
-    </QPage>
-</template>

src/pages/Item/ItemTypeList.vue

@@ -1,13 +1,16 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 import { ref, computed } from 'vue';
-import ItemTypeSearchbar from '../ItemType/ItemTypeSearchbar.vue';
+import ItemTypeSearchbar from 'src/pages/Item/ItemType/ItemTypeSearchbar.vue';
 import VnTable from 'components/VnTable/VnTable.vue';
 import FetchData from 'components/FetchData.vue';
+import RightMenu from 'src/components/common/RightMenu.vue';
+import ItemTypeFilter from './ItemType/ItemTypeFilter.vue';
 
 const { t } = useI18n();
 const tableRef = ref();
-const ItemCategoriesOptions = ref([]);
+const itemCategoriesOptions = ref([]);
+const temperatureOptions = ref([]);
 
 const columns = computed(() => [
     {
@@ -34,7 +37,6 @@ const columns = computed(() => [
     },
     {
         align: 'left',
-        name: 'workerFk',
         label: t('worker'),
         create: true,
         component: 'select',
@@ -45,6 +47,19 @@ const columns = computed(() => [
         },
         cardVisible: true,
         visible: true,
+        columnField: {
+            component: 'userLink',
+            attrs: ({ row }) => {
+                return {
+                    workerId: row?.worker?.id,
+                    name: row.worker?.user?.name,
+                    defaultName: true,
+                };
+            },
+        },
+        columnFilter: {
+            name: 'workerFk',
+        },
     },
     {
         align: 'left',
@@ -53,9 +68,7 @@ const columns = computed(() => [
         create: true,
         component: 'select',
         attrs: {
-            options: ItemCategoriesOptions.value,
+            options: itemCategoriesOptions.value,
-            fields: ['id', 'name'],
-            order: 'name ASC',
         },
         cardVisible: false,
         visible: false,
@@ -67,8 +80,7 @@ const columns = computed(() => [
         create: true,
         component: 'select',
         attrs: {
-            url: 'Temperatures',
+            options: temperatureOptions.value,
-            fields: ['id', 'name'],
         },
         cardVisible: false,
         visible: false,
@@ -80,26 +92,52 @@ const columns = computed(() => [
     <FetchData
         url="ItemCategories"
         :filter="{ fields: ['id', 'name'], order: ['name ASC'] }"
-        @on-fetch="(data) => (ItemCategoriesOptions = data)"
+        @on-fetch="(data) => (itemCategoriesOptions = data)"
         auto-load
     />
+    <FetchData
+        url="Temperatures"
+        :filter="{ fields: ['id', 'name'], order: ['name ASC'] }"
+        @on-fetch="(data) => (temperatureOptions = data)"
+        auto-load
+    />
+    <RightMenu>
+        <template #right-panel>
+            <ItemTypeFilter data-key="ItemTypeList" />
+        </template>
+    </RightMenu>
     <ItemTypeSearchbar />
     <VnTable
         ref="tableRef"
         data-key="ItemTypeList"
-        :url="`ItemTypes`"
+        url="ItemTypes"
         :create="{
             urlCreate: 'ItemTypes',
             title: t('Create ItemTypes'),
             onDataSaved: () => tableRef.reload(),
             formInitialData: {},
         }"
+        :user-filter="{
+            include: {
+                relation: 'worker',
+                scope: {
+                    fields: ['id'],
+                    include: {
+                        relation: 'user',
+                        scope: {
+                            fields: ['id', 'name'],
+                        },
+                    },
+                },
+            },
+        }"
         order="name ASC"
         :columns="columns"
         auto-load
         :right-search="false"
         :is-editable="false"
         :use-model="true"
+        redirect="item/item-type"
     />
 </template>
 

src/pages/Ticket/Card/TicketDescriptorMenu.vue

@@ -348,7 +348,6 @@ async function hasDocuware() {
 }
 
 async function uploadDocuware(force) {
-    console.log('force: ', force);
     if (!force)
         return quasar
             .dialog({

src/router/modules/item.js

@@ -97,14 +97,6 @@ export default {
                     },
                     component: () => import('src/pages/Item/ItemTypeList.vue'),
                 },
-                {
-                    path: 'item-type-list/create',
-                    name: 'ItemTypeCreate',
-                    meta: {
-                        title: 'itemTypeCreate',
-                    },
-                    component: () => import('src/pages/Item/ItemTypeCreate.vue'),
-                },
             ],
         },
         {

src/router/modules/itemType.js

@@ -18,7 +18,7 @@ export default {
         {
             name: 'ItemTypeCard',
             path: ':id',
-            component: () => import('src/pages/ItemType/Card/ItemTypeCard.vue'),
+            component: () => import('src/pages/Item/ItemType/Card/ItemTypeCard.vue'),
             redirect: { name: 'ItemTypeSummary' },
             children: [
                 {
@@ -28,7 +28,7 @@ export default {
                         title: 'summary',
                     },
                     component: () =>
-                        import('src/pages/ItemType/Card/ItemTypeSummary.vue'),
+                        import('src/pages/Item/ItemType/Card/ItemTypeSummary.vue'),
                 },
                 {
                     name: 'ItemTypeBasicData',
@@ -38,7 +38,7 @@ export default {
                         icon: 'vn:settings',
                     },
                     component: () =>
-                        import('src/pages/ItemType/Card/ItemTypeBasicData.vue'),
+                        import('src/pages/Item/ItemType/Card/ItemTypeBasicData.vue'),
                 },
                 {
                     path: 'log',
@@ -47,7 +47,8 @@ export default {
                         title: 'log',
                         icon: 'vn:History',
                     },
-                    component: () => import('src/pages/ItemType/Card/ItemTypeLog.vue'),
+                    component: () =>
+                        import('src/pages/Item/ItemType/Card/ItemTypeLog.vue'),
                 },
             ],
         },