Added Reset in Inventory
Added Keyboard Controls for Tab Nav and Back to List Added Select On Enter for First Entry in Search for Customers and Vendors
This commit is contained in:
@@ -51,7 +51,25 @@ setupPage()
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<UDashboardNavbar :title="currentItem ? currentItem.fullName : (mode === 'create' ? 'Ansprechpartner erstellen' : 'Ansprechpartner bearbeiten')">
|
<UDashboardNavbar
|
||||||
|
:title="currentItem ? currentItem.fullName : (mode === 'create' ? 'Ansprechpartner erstellen' : 'Ansprechpartner bearbeiten')"
|
||||||
|
:ui="{center: 'flex items-stretch gap-1.5 min-w-0'}"
|
||||||
|
>
|
||||||
|
<template #left>
|
||||||
|
<UButton
|
||||||
|
icon="i-heroicons-chevron-left"
|
||||||
|
variant="outline"
|
||||||
|
@click="router.push(`/contacts`)"
|
||||||
|
>
|
||||||
|
Ansprechpartner
|
||||||
|
</UButton>
|
||||||
|
</template>
|
||||||
|
<template #center>
|
||||||
|
<h1
|
||||||
|
v-if="currentItem"
|
||||||
|
:class="['text-xl','font-medium', ... currentItem.active ? ['text-primary'] : ['text-rose-500']]"
|
||||||
|
>{{currentItem ? `Ansprechpartner: ${currentItem.fullName}` : (mode === 'create' ? 'Ansprechpartner erstellen' : 'Ansprechpartner bearbeiten')}}</h1>
|
||||||
|
</template>
|
||||||
<template #right>
|
<template #right>
|
||||||
<UButton
|
<UButton
|
||||||
v-if="mode === 'edit'"
|
v-if="mode === 'edit'"
|
||||||
@@ -80,7 +98,7 @@ setupPage()
|
|||||||
Bearbeiten
|
Bearbeiten
|
||||||
</UButton>
|
</UButton>
|
||||||
</template>
|
</template>
|
||||||
<template #badge v-if="currentItem">
|
<!-- <template #badge v-if="currentItem">
|
||||||
<UBadge
|
<UBadge
|
||||||
v-if="currentItem.active"
|
v-if="currentItem.active"
|
||||||
>
|
>
|
||||||
@@ -92,7 +110,7 @@ setupPage()
|
|||||||
>
|
>
|
||||||
Kontakt inaktiv
|
Kontakt inaktiv
|
||||||
</UBadge>
|
</UBadge>
|
||||||
</template>
|
</template>-->
|
||||||
</UDashboardNavbar>
|
</UDashboardNavbar>
|
||||||
<UTabs
|
<UTabs
|
||||||
:items="[{label: 'Informationen'}, {label: 'Logbuch'}]"
|
:items="[{label: 'Informationen'}, {label: 'Logbuch'}]"
|
||||||
|
|||||||
@@ -4,6 +4,22 @@ definePageMeta({
|
|||||||
middleware: "auth"
|
middleware: "auth"
|
||||||
})
|
})
|
||||||
|
|
||||||
|
defineShortcuts({
|
||||||
|
'backspace': () => {
|
||||||
|
router.push("/customers")
|
||||||
|
},
|
||||||
|
'arrowleft': () => {
|
||||||
|
if(openTab.value > 0){
|
||||||
|
openTab.value -= 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'arrowright': () => {
|
||||||
|
if(openTab.value < 3) {
|
||||||
|
openTab.value += 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
const dataStore = useDataStore()
|
const dataStore = useDataStore()
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
@@ -11,7 +27,7 @@ const toast = useToast()
|
|||||||
const id = ref(route.params.id ? route.params.id : null )
|
const id = ref(route.params.id ? route.params.id : null )
|
||||||
|
|
||||||
let currentItem = ref(null)
|
let currentItem = ref(null)
|
||||||
|
const openTab = ref(0)
|
||||||
|
|
||||||
|
|
||||||
//Working
|
//Working
|
||||||
@@ -57,6 +73,7 @@ setupPage()
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
{{openTab}}
|
||||||
<UDashboardNavbar
|
<UDashboardNavbar
|
||||||
:title="currentItem ? `Kunde: ${currentItem.name}` : (mode === 'create' ? 'Kunde erstellen' : 'Kunde bearbeiten')"
|
:title="currentItem ? `Kunde: ${currentItem.name}` : (mode === 'create' ? 'Kunde erstellen' : 'Kunde bearbeiten')"
|
||||||
:ui="{center: 'flex items-stretch gap-1.5 min-w-0'}"
|
:ui="{center: 'flex items-stretch gap-1.5 min-w-0'}"
|
||||||
@@ -123,6 +140,7 @@ setupPage()
|
|||||||
v-if="currentItem && mode == 'show'"
|
v-if="currentItem && mode == 'show'"
|
||||||
:items="[{label: 'Informationen'},{label: 'Projekte'},{label: 'Objekte'},{label: 'Verträge'}]"
|
:items="[{label: 'Informationen'},{label: 'Projekte'},{label: 'Objekte'},{label: 'Verträge'}]"
|
||||||
class="p-5"
|
class="p-5"
|
||||||
|
v-model="openTab"
|
||||||
>
|
>
|
||||||
<template #item="{item}">
|
<template #item="{item}">
|
||||||
<div v-if="item.label === 'Informationen'" class="flex mt-5">
|
<div v-if="item.label === 'Informationen'" class="flex mt-5">
|
||||||
|
|||||||
@@ -3,6 +3,7 @@
|
|||||||
<template #right>
|
<template #right>
|
||||||
<UInput
|
<UInput
|
||||||
id="searchinput"
|
id="searchinput"
|
||||||
|
name="searchinput"
|
||||||
v-model="searchString"
|
v-model="searchString"
|
||||||
icon="i-heroicons-funnel"
|
icon="i-heroicons-funnel"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
@@ -54,7 +55,7 @@
|
|||||||
<span v-else class="text-rose-500">Gesperrt</span>
|
<span v-else class="text-rose-500">Gesperrt</span>
|
||||||
</template>
|
</template>
|
||||||
<template #address-data="{row}">
|
<template #address-data="{row}">
|
||||||
{{row.infoData.street ? `${row.infoData.street}, ` : ''}}{{row.infoData.special ? `${row.infoData.special},` : ''}} {{row.infoData.zip ? row.infoData.zip : ""}}{{row.infoData.city ? `${row.infoData.city}, ` : ''}} {{row.infoData.country}}
|
{{row.infoData.street ? `${row.infoData.street}, ` : ''}}{{row.infoData.special ? `${row.infoData.special},` : ''}} {{row.infoData.zip ? row.infoData.zip : ""}} {{row.infoData.city ? `${row.infoData.city}, ` : ''}} {{row.infoData.country}}
|
||||||
</template>
|
</template>
|
||||||
</UTable>
|
</UTable>
|
||||||
</template>
|
</template>
|
||||||
@@ -72,7 +73,16 @@ defineShortcuts({
|
|||||||
},
|
},
|
||||||
'+': () => {
|
'+': () => {
|
||||||
router.push("/customers/create")
|
router.push("/customers/create")
|
||||||
|
},
|
||||||
|
'enter': {
|
||||||
|
usingInput: "searchinput",
|
||||||
|
handler: () => {
|
||||||
|
router.push(`/customers/show/${selectedEntry.value}`)
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
const dataStore = useDataStore()
|
const dataStore = useDataStore()
|
||||||
@@ -115,17 +125,22 @@ const columns = computed(() => templateColumns.filter((column) => selectedColumn
|
|||||||
|
|
||||||
|
|
||||||
const searchString = ref('')
|
const searchString = ref('')
|
||||||
|
const selectedEntry = ref(null)
|
||||||
|
|
||||||
const filteredRows = computed(() => {
|
const filteredRows = computed(() => {
|
||||||
if(!searchString.value) {
|
if(!searchString.value) {
|
||||||
return dataStore.customers
|
return dataStore.customers
|
||||||
}
|
}
|
||||||
|
|
||||||
return dataStore.customers.filter(item => {
|
let results = dataStore.customers.filter(item => {
|
||||||
return Object.values(item).some((value) => {
|
return Object.values(item).some((value) => {
|
||||||
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
selectedEntry.value = results[0].id
|
||||||
|
|
||||||
|
return results
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -94,7 +94,25 @@ setupPage()
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<UDashboardNavbar :title="currentItem ? currentItem.licensePlate : (mode === 'create' ? 'Fahrzeug erstellen' : 'Fahrzeug bearbeiten')">
|
<UDashboardNavbar
|
||||||
|
:title="currentItem ? currentItem.licensePlate : (mode === 'create' ? 'Fahrzeug erstellen' : 'Fahrzeug bearbeiten')"
|
||||||
|
:ui="{center: 'flex items-stretch gap-1.5 min-w-0'}"
|
||||||
|
>
|
||||||
|
<template #left>
|
||||||
|
<UButton
|
||||||
|
icon="i-heroicons-chevron-left"
|
||||||
|
variant="outline"
|
||||||
|
@click="router.push(`/vehicles`)"
|
||||||
|
>
|
||||||
|
Fahrzeuge
|
||||||
|
</UButton>
|
||||||
|
</template>
|
||||||
|
<template #center>
|
||||||
|
<h1
|
||||||
|
v-if="currentItem"
|
||||||
|
:class="['text-xl','font-medium']"
|
||||||
|
>{{currentItem ? `Fahrzeug: ${currentItem.licensePlate}` : (mode === 'create' ? 'Fahrzeug erstellen' : 'Fahrzeug bearbeiten')}}</h1>
|
||||||
|
</template>
|
||||||
<template #right>
|
<template #right>
|
||||||
<UButton
|
<UButton
|
||||||
v-if="mode === 'edit'"
|
v-if="mode === 'edit'"
|
||||||
|
|||||||
19
pages/vendors/[mode]/[[id]].vue
vendored
19
pages/vendors/[mode]/[[id]].vue
vendored
@@ -4,12 +4,28 @@ definePageMeta({
|
|||||||
middleware: "auth"
|
middleware: "auth"
|
||||||
})
|
})
|
||||||
|
|
||||||
|
defineShortcuts({
|
||||||
|
'backspace': () => {
|
||||||
|
router.push("/vendors")
|
||||||
|
},
|
||||||
|
'arrowleft': () => {
|
||||||
|
if(openTab.value > 0){
|
||||||
|
openTab.value -= 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'arrowright': () => {
|
||||||
|
if(openTab.value < 1) {
|
||||||
|
openTab.value += 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
const dataStore = useDataStore()
|
const dataStore = useDataStore()
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const toast = useToast()
|
const toast = useToast()
|
||||||
const id = ref(route.params.id ? route.params.id : null )
|
const id = ref(route.params.id ? route.params.id : null )
|
||||||
|
const openTab = ref(0)
|
||||||
let currentItem = ref(null)
|
let currentItem = ref(null)
|
||||||
|
|
||||||
|
|
||||||
@@ -92,6 +108,7 @@ setupPage()
|
|||||||
:items="[{label: 'Informationen'},{label: 'Dokumente'}]"
|
:items="[{label: 'Informationen'},{label: 'Dokumente'}]"
|
||||||
v-if="currentItem && mode == 'show'"
|
v-if="currentItem && mode == 'show'"
|
||||||
class="p-5"
|
class="p-5"
|
||||||
|
v-model="openTab"
|
||||||
>
|
>
|
||||||
<template #item="{item}">
|
<template #item="{item}">
|
||||||
<div v-if="item.label === 'Informationen'" class="mt-5 flex">
|
<div v-if="item.label === 'Informationen'" class="mt-5 flex">
|
||||||
|
|||||||
14
pages/vendors/index.vue
vendored
14
pages/vendors/index.vue
vendored
@@ -3,6 +3,7 @@
|
|||||||
<template #right>
|
<template #right>
|
||||||
<UInput
|
<UInput
|
||||||
id="searchinput"
|
id="searchinput"
|
||||||
|
name="searchinput"
|
||||||
v-model="searchString"
|
v-model="searchString"
|
||||||
icon="i-heroicons-funnel"
|
icon="i-heroicons-funnel"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
@@ -65,6 +66,12 @@ defineShortcuts({
|
|||||||
},
|
},
|
||||||
'+': () => {
|
'+': () => {
|
||||||
router.push("/vendors/create")
|
router.push("/vendors/create")
|
||||||
|
},
|
||||||
|
'enter': {
|
||||||
|
usingInput: "searchinput",
|
||||||
|
handler: () => {
|
||||||
|
router.push(`/vendors/show/${selectedEntry.value}`)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -93,17 +100,22 @@ const selectedColumns = ref(templateColumns)
|
|||||||
const columns = computed(() => templateColumns.filter((column) => selectedColumns.value.includes(column)))
|
const columns = computed(() => templateColumns.filter((column) => selectedColumns.value.includes(column)))
|
||||||
|
|
||||||
const searchString = ref('')
|
const searchString = ref('')
|
||||||
|
const selectedEntry = ref(null)
|
||||||
|
|
||||||
const filteredRows = computed(() => {
|
const filteredRows = computed(() => {
|
||||||
if(!searchString.value) {
|
if(!searchString.value) {
|
||||||
return dataStore.vendors
|
return dataStore.vendors
|
||||||
}
|
}
|
||||||
|
|
||||||
return dataStore.vendors.filter(item => {
|
let results = dataStore.vendors.filter(item => {
|
||||||
return Object.values(item).some((value) => {
|
return Object.values(item).some((value) => {
|
||||||
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
selectedEntry.value = results[0].id
|
||||||
|
|
||||||
|
return results
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user