Changes in Standard Entity Components

This commit is contained in:
2024-12-30 09:30:30 +01:00
parent 92ec684066
commit ee5ebfe0b9
3 changed files with 54 additions and 27 deletions

View File

@@ -163,6 +163,7 @@ const contentChanged = (content, datapoint) => {
</template> </template>
</UDashboardNavbar> </UDashboardNavbar>
<UDashboardPanelContent> <UDashboardPanelContent>
{{props.item}}
<UForm <UForm
class="p-5" class="p-5"
> >
@@ -190,7 +191,7 @@ const contentChanged = (content, datapoint) => {
</template> </template>
<div v-if="datapoint.key.includes('.')"> <div v-if="datapoint.key.includes('.')">
<UInput <UInput
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-if="['text','number'].includes(datapoint.inputType)" v-if="['text','number'].includes(datapoint.inputType)"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -198,13 +199,13 @@ const contentChanged = (content, datapoint) => {
:placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''" :placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''"
/> />
<UToggle <UToggle
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'bool'" v-else-if="datapoint.inputType === 'bool'"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />
<USelectMenu <USelectMenu
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'select'" v-else-if="datapoint.inputType === 'select'"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -220,7 +221,7 @@ const contentChanged = (content, datapoint) => {
</template> </template>
</USelectMenu> </USelectMenu>
<UTextarea <UTextarea
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'textarea'" v-else-if="datapoint.inputType === 'textarea'"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -237,7 +238,7 @@ const contentChanged = (content, datapoint) => {
<template #panel="{ close }"> <template #panel="{ close }">
<LazyDatePicker <LazyDatePicker
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" @close="close" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" @close="close"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />
@@ -252,7 +253,7 @@ const contentChanged = (content, datapoint) => {
</div> </div>
<div v-else> <div v-else>
<UInput <UInput
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-if="['text','number'].includes(datapoint.inputType)" v-if="['text','number'].includes(datapoint.inputType)"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -260,13 +261,13 @@ const contentChanged = (content, datapoint) => {
:placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''" :placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''"
/> />
<UToggle <UToggle
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'bool'" v-else-if="datapoint.inputType === 'bool'"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />
<USelectMenu <USelectMenu
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'select'" v-else-if="datapoint.inputType === 'select'"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -283,7 +284,7 @@ const contentChanged = (content, datapoint) => {
</template> </template>
</USelectMenu> </USelectMenu>
<UTextarea <UTextarea
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'textarea'" v-else-if="datapoint.inputType === 'textarea'"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -299,7 +300,7 @@ const contentChanged = (content, datapoint) => {
<template #panel="{ close }"> <template #panel="{ close }">
<LazyDatePicker <LazyDatePicker
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-model="props.item[datapoint.key]" @close="close" v-model="props.item[datapoint.key]" @close="close"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />
@@ -351,7 +352,7 @@ const contentChanged = (content, datapoint) => {
</template> </template>
<div v-if="datapoint.key.includes('.')"> <div v-if="datapoint.key.includes('.')">
<UInput <UInput
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-if="['text','number'].includes(datapoint.inputType)" v-if="['text','number'].includes(datapoint.inputType)"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -359,13 +360,13 @@ const contentChanged = (content, datapoint) => {
:placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''" :placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''"
/> />
<UToggle <UToggle
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'bool'" v-else-if="datapoint.inputType === 'bool'"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />
<USelectMenu <USelectMenu
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'select'" v-else-if="datapoint.inputType === 'select'"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -381,7 +382,7 @@ const contentChanged = (content, datapoint) => {
</template> </template>
</USelectMenu> </USelectMenu>
<UTextarea <UTextarea
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'textarea'" v-else-if="datapoint.inputType === 'textarea'"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -398,7 +399,7 @@ const contentChanged = (content, datapoint) => {
<template #panel="{ close }"> <template #panel="{ close }">
<LazyDatePicker <LazyDatePicker
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" @close="close" v-model="props.item[datapoint.key.split('.')[0]][datapoint.key.split('.')[1]]" @close="close"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />
@@ -413,7 +414,7 @@ const contentChanged = (content, datapoint) => {
</div> </div>
<div v-else> <div v-else>
<UInput <UInput
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-if="['text','number'].includes(datapoint.inputType)" v-if="['text','number'].includes(datapoint.inputType)"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -421,13 +422,13 @@ const contentChanged = (content, datapoint) => {
:placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''" :placeholder="datapoint.inputIsNumberRange ? 'Leer lassen für automatisch generierte Nummer' : ''"
/> />
<UToggle <UToggle
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'bool'" v-else-if="datapoint.inputType === 'bool'"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />
<USelectMenu <USelectMenu
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'select'" v-else-if="datapoint.inputType === 'select'"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -444,7 +445,7 @@ const contentChanged = (content, datapoint) => {
</template> </template>
</USelectMenu> </USelectMenu>
<UTextarea <UTextarea
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-else-if="datapoint.inputType === 'textarea'" v-else-if="datapoint.inputType === 'textarea'"
v-model="props.item[datapoint.key]" v-model="props.item[datapoint.key]"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
@@ -460,7 +461,7 @@ const contentChanged = (content, datapoint) => {
<template #panel="{ close }"> <template #panel="{ close }">
<LazyDatePicker <LazyDatePicker
@change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item) : null" @change="datapoint.inputChangeFunction ? datapoint.inputChangeFunction(props.item,loadedOptions) : null"
v-model="props.item[datapoint.key]" @close="close" v-model="props.item[datapoint.key]" @close="close"
:disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false" :disabled="datapoint.disabledFunction ? datapoint.disabledFunction(props.item) : false"
/> />

View File

@@ -19,12 +19,12 @@ defineShortcuts({
document.getElementById("searchinput").focus() document.getElementById("searchinput").focus()
}, },
'+': () => { '+': () => {
router.push(`/${type}/create`) router.push(`/standardEntity/${type}/create`)
}, },
'Enter': { 'Enter': {
usingInput: true, usingInput: true,
handler: () => { handler: () => {
router.push(`/${type}/show/${filteredRows.value[selectedItem.value].id}`) router.push(`/standardEntity/${type}/show/${filteredRows.value[selectedItem.value].id}`)
} }
}, },
'arrowdown': () => { 'arrowdown': () => {

View File

@@ -35,6 +35,7 @@ defineShortcuts({
const router = useRouter() const router = useRouter()
const dataStore = useDataStore() const dataStore = useDataStore()
const profileStore = useProfileStore() const profileStore = useProfileStore()
const supabase = useSupabaseClient()
const dataType = dataStore.dataTypes[type] const dataType = dataStore.dataTypes[type]
@@ -52,7 +53,7 @@ setup()
const openTab = ref(0) const openTab = ref(0)
const renderedPhases = computed(() => { const renderedPhases = computed(() => {
console.log(props.item.phases)
if(type === "projects" && props.item.phases) { if(type === "projects" && props.item.phases) {
return props.item.phases.map((phase,index,array) => { return props.item.phases.map((phase,index,array) => {
@@ -81,7 +82,32 @@ const renderedPhases = computed(() => {
} }
}) })
const changeActivePhase = async (key) => {
let item = await useSupabaseSelectSingle("projects",props.item.id,'*')
let phaseLabel = ""
item.phases = item.phases.map(p => {
if(p.active) p.active = false
if(p.key === key) {
p.active = true
p.activated_at = dayjs().format()
p.activated_by = profileStore.activeProfile.id
phaseLabel = p.label
}
return p
})
await supabase.from("projects").update({phases: item.phases}).eq("id",item.id)
const {error} = await supabase.from("historyitems").insert({
createdBy: profileStore.activeProfile.id,
tenant: profileStore.currentTenant,
text: `Aktive Phase zu "${phaseLabel}" gewechselt`,
project: item.id
})
}
</script> </script>
@@ -321,7 +347,7 @@ const renderedPhases = computed(() => {
<template #item="{item, index}"> <template #item="{item, index}">
<UCard class="mx-5"> <UCard class="mx-5">
<template #header> <template #header>
<span class="text-black">{{item.label}}</span> <span class="dark:text-white text-black">{{item.label}}</span>
</template> </template>
<InputGroup> <InputGroup>
<!-- TODO: Reactive Change Phase --> <!-- TODO: Reactive Change Phase -->
@@ -341,9 +367,9 @@ const renderedPhases = computed(() => {
</InputGroup> </InputGroup>
<div> <div>
<p v-if="item.activated_at" class="text-black">Aktiviert am: {{dayjs(item.activated_at).format("DD.MM.YY HH:mm")}} Uhr</p> <p v-if="item.activated_at" class="dark:text-white text-black">Aktiviert am: {{dayjs(item.activated_at).format("DD.MM.YY HH:mm")}} Uhr</p>
<p v-if="item.activated_by" class="text-black">Aktiviert durch: {{profileStore.getProfileById(item.activated_by).fullName}}</p> <p v-if="item.activated_by" class="dark:text-white text-black">Aktiviert durch: {{profileStore.getProfileById(item.activated_by).fullName}}</p>
<p v-if="item.description" class="text-black">Beschreibung: {{item.description}}</p> <p v-if="item.description" class="dark:text-white text-black">Beschreibung: {{item.description}}</p>
</div> </div>
</UCard> </UCard>