adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-14 19:22:14 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor timetracker to seperate data and ui logic

Browse Source
This commit is contained in:
Gregor Vostrak
2024-07-22 17:56:51 +02:00
parent a9c874e540
commit 06fef6e40f
41 changed files with 1984 additions and 961 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
resources/js/Components/Common/Client/ClientDropdown.vue
View File

@@ -2,17 +2,18 @@
import { PlusCircleIcon } from '@heroicons/vue/20/solid';
import Dropdown from '@/Components/Dropdown.vue';
import { type Component, computed, nextTick, ref, watch } from 'vue';
import { storeToRefs } from 'pinia';
import { useClientsStore } from '@/utils/useClients';
import ClientDropdownItem from '@/Components/Common/Client/ClientDropdownItem.vue';
const clientsStore = useClientsStore();
const { clients } = storeToRefs(clientsStore);
import type { CreateClientBody, Client } from '@/utils/api';
const model = defineModel<string | null>({
default: null,
});
const props = defineProps<{
clients: Client[];
createClient: (client: CreateClientBody) => Promise<Client | undefined>;
}>();
const searchInput = ref<HTMLInputElement | null>(null);
const open = ref(false);
const dropdownViewport = ref<Component | null>(null);
@@ -32,7 +33,7 @@ watch(open, (isOpen) => {
});
const filteredClients = computed(() => {
return clients.value.filter((client) => {
return props.clients.filter((client) => {
return client.name
.toLowerCase()
.includes(searchValue.value?.toLowerCase()?.trim() || '');
@@ -41,7 +42,7 @@ const filteredClients = computed(() => {
async function addClientIfNoneExists() {
if (searchValue.value.length > 0 && filteredClients.value.length === 0) {
const newClient = await clientsStore.createClient({
const newClient = await props.createClient({
name: searchValue.value,
});
if (newClient) {
@@ -67,7 +68,7 @@ function updateSearchValue(event: Event) {
searchValue.value = '';
const highlightedClientId = highlightedItemId.value;
if (highlightedClientId) {
const highlightedClient = clients.value.find(
const highlightedClient = props.clients.find(
(client) => client.id === highlightedClientId
);
if (highlightedClient) {
@@ -119,7 +120,7 @@ function moveHighlightDown() {
const highlightedItemId = ref<string | null>(null);
const highlightedItem = computed(() => {
return clients.value.find(
return props.clients.find(
(client) => client.id === highlightedItemId.value
);
});