flfeders/FEDEO
2
1
Fork 0
Code Issues 62 Pull Requests Actions Packages Projects 21 Releases Wiki Activity

Added Support for Conditional Rendering of Inputs

Browse Source 
Added Some InputColumns in anticipation of required InputColumns
This commit is contained in:
florianfederspiel
2025-05-20 17:13:06 +02:00
parent fd3b96a11c
commit 4a3c4f4bd7
1 changed files with 83 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
stores/data.js
View File

@@ -92,12 +92,14 @@ export const useDataStore = defineStore('data', () => {
key: "created_at", key: "created_at",
label: "Erstellt am", label: "Erstellt am",
component: created_at, component: created_at,
inputColumn: "Allgemeines"
},{ },{
key: "name", key: "name",
label: "Name", label: "Name",
title: true, title: true,
required: true, required: true,
inputType: "text" inputType: "text",
inputColumn: "Allgemeines"
},{ },{
key: "categorie", key: "categorie",
label: "Kategorie", label: "Kategorie",
@@ -109,6 +111,7 @@ export const useDataStore = defineStore('data', () => {
{label:"In Bearbeitung"}, {label:"In Bearbeitung"},
{label:"Abgeschlossen"} {label:"Abgeschlossen"}
], ],
inputColumn: "Allgemeines"
},{ },{
key: "profile", key: "profile",
label: "Mitarbeiter", label: "Mitarbeiter",
@@ -117,6 +120,7 @@ export const useDataStore = defineStore('data', () => {
selectDataType: "profiles", selectDataType: "profiles",
selectOptionAttribute: "fullName", selectOptionAttribute: "fullName",
selectSearchAttributes: ['fullName'], selectSearchAttributes: ['fullName'],
inputColumn: "Zuweisungen"
},{ },{
key: "project", key: "project",
label: "Projekt", label: "Projekt",
@@ -125,6 +129,7 @@ export const useDataStore = defineStore('data', () => {
selectDataType: "projects", selectDataType: "projects",
selectOptionAttribute: "name", selectOptionAttribute: "name",
selectSearchAttributes: ['name'], selectSearchAttributes: ['name'],
inputColumn: "Zuweisungen"
},{ },{
key: "customer", key: "customer",
label: "Kunde", label: "Kunde",
@@ -133,6 +138,7 @@ export const useDataStore = defineStore('data', () => {
selectDataType: "customers", selectDataType: "customers",
selectOptionAttribute: "name", selectOptionAttribute: "name",
selectSearchAttributes: ['name'], selectSearchAttributes: ['name'],
inputColumn: "Zuweisungen"
},{ },{
key: "plant", key: "plant",
label: "Objekt", label: "Objekt",
@@ -141,11 +147,17 @@ export const useDataStore = defineStore('data', () => {
selectDataType: "plants", selectDataType: "plants",
selectOptionAttribute: "name", selectOptionAttribute: "name",
selectSearchAttributes: ['name'], selectSearchAttributes: ['name'],
inputColumn: "Zuweisungen"
},{ },{
key: "description", key: "description",
label: "Beschreibung" label: "Beschreibung",
inputColumn: "Allgemeines"
}, },
], ],
inputColumns: [
"Allgemeines",
"Zuweisungen"
],
showTabs: [{label: 'Informationen'}] showTabs: [{label: 'Informationen'}]
}, },
customers: { customers: {
@@ -169,12 +181,23 @@ export const useDataStore = defineStore('data', () => {
} }
} }
}], }],
inputColumns: [
"Allgemeines",
"Kontaktdaten"
],
templateColumns: [ templateColumns: [
{ {
key: 'customerNumber', key: 'customerNumber',
label: "Kundennummer", label: "Kundennummer",
inputIsNumberRange: true, inputIsNumberRange: true,
inputType: "text" inputType: "text",
inputColumn: "Allgemeines"
}, {
key: "isCompany",
label: "Firmenkunde",
component: isCompany,
inputType: "bool",
inputColumn: "Allgemeines"
}, { }, {
key: "name", key: "name",
label: "Firmenname", label: "Firmenname",
@@ -184,6 +207,10 @@ export const useDataStore = defineStore('data', () => {
disabledFunction: function (item) { disabledFunction: function (item) {
return !item.isCompany return !item.isCompany
}, },
showFunction: function (item) {
return item.isCompany
},
inputColumn: "Allgemeines"
}, { }, {
key: "nameAddition", key: "nameAddition",
label: "Firmenname Zusatz", label: "Firmenname Zusatz",
@@ -191,6 +218,10 @@ export const useDataStore = defineStore('data', () => {
disabledFunction: function (item) { disabledFunction: function (item) {
return !item.isCompany return !item.isCompany
}, },
showFunction: function (item) {
return item.isCompany
},
inputColumn: "Allgemeines"
},{ },{
key: "salutation", key: "salutation",
label: "Anrede", label: "Anrede",
@@ -213,6 +244,10 @@ export const useDataStore = defineStore('data', () => {
disabledFunction: function (item) { disabledFunction: function (item) {
return item.isCompany return item.isCompany
}, },
showFunction: function (item) {
return !item.isCompany
},
inputColumn: "Allgemeines"
},{ },{
key: "title", key: "title",
label: "Titel", label: "Titel",
@@ -235,6 +270,10 @@ export const useDataStore = defineStore('data', () => {
disabledFunction: function (item) { disabledFunction: function (item) {
return item.isCompany return item.isCompany
}, },
showFunction: function (item) {
return !item.isCompany
},
inputColumn: "Allgemeines"
},{ },{
key: "firstname", key: "firstname",
label: "Vorname",//TODO: Add Conditional Rendering to Datatypes label: "Vorname",//TODO: Add Conditional Rendering to Datatypes
@@ -258,10 +297,15 @@ export const useDataStore = defineStore('data', () => {
disabledFunction: function (item) { disabledFunction: function (item) {
return item.isCompany return item.isCompany
}, },
showFunction: function (item) {
return !item.isCompany
},
inputColumn: "Allgemeines"
},{ },{
key: "lastname", key: "lastname",
label: "Nachname", label: "Nachname",
title: true, title: true,
required: true,
inputType: "text", inputType: "text",
inputChangeFunction: function (row) { inputChangeFunction: function (row) {
row.name = "" row.name = ""
@@ -281,35 +325,39 @@ export const useDataStore = defineStore('data', () => {
disabledFunction: function (item) { disabledFunction: function (item) {
return item.isCompany return item.isCompany
}, },
}, { showFunction: function (item) {
key: "isCompany", return !item.isCompany
label: "Firmenkunde", },
component: isCompany, inputColumn: "Allgemeines"
inputType: "bool"
},{ },{
key: "active", key: "active",
label: "Aktiv", label: "Aktiv",
component: active, component: active,
inputType: "bool" inputType: "bool",
inputColumn: "Allgemeines"
}, { }, {
key: "customPaymentDays", key: "customPaymentDays",
label: "Zahlungsziel in Tagen", label: "Zahlungsziel in Tagen",
inputType: "number" inputType: "number",
inputColumn: "Allgemeines"
}, { }, {
key: "customSurchargePercentage", key: "customSurchargePercentage",
label: "Individueller Aufschlag", label: "Individueller Aufschlag",
inputType: "number" inputType: "number",
inputColumn: "Allgemeines"
}, { }, {
key: "infoData.street", key: "infoData.street",
label: "Straße + Hausnummer", label: "Straße + Hausnummer",
inputType: "text", inputType: "text",
disabledInTable: true disabledInTable: true,
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.special", key: "infoData.special",
label: "Adresszusatz", label: "Adresszusatz",
inputType: "text", inputType: "text",
disabledInTable: true disabledInTable: true,
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.zip", key: "infoData.zip",
@@ -320,13 +368,15 @@ export const useDataStore = defineStore('data', () => {
row.infoData.city = (await useZipCheck(row.infoData.zip)) row.infoData.city = (await useZipCheck(row.infoData.zip))
} }
}, },
disabledInTable: true disabledInTable: true,
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.city", key: "infoData.city",
label: "Stadt", label: "Stadt",
inputType: "text", inputType: "text",
disabledInTable: true disabledInTable: true,
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.country", key: "infoData.country",
@@ -335,42 +385,50 @@ export const useDataStore = defineStore('data', () => {
selectDataType: "countrys", selectDataType: "countrys",
selectOptionAttribute: "name", selectOptionAttribute: "name",
selectValueAttribute: "name", selectValueAttribute: "name",
disabledInTable: true disabledInTable: true,
inputColumn: "Kontaktdaten"
}, },
{ {
key: "address", key: "address",
label: "Adresse", label: "Adresse",
component: address component: address,
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.tel", key: "infoData.tel",
label: "Telefon", label: "Telefon",
inputType: "text" inputType: "text",
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.email", key: "infoData.email",
label: "E-Mail", label: "E-Mail",
inputType: "text" inputType: "text",
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.invoiceEmail", key: "infoData.invoiceEmail",
label: "E-Mail für Rechnungen", label: "E-Mail für Rechnungen",
inputType: "text" inputType: "text",
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.web", key: "infoData.web",
label: "Web", label: "Web",
inputType: "text" inputType: "text",
inputColumn: "Kontaktdaten"
}, },
{ {
key: "infoData.ustid", key: "infoData.ustid",
label: "USt-Id", label: "USt-Id",
inputType: "text" inputType: "text",
inputColumn: "Kontaktdaten"
}, },
{ {
key: "notes", key: "notes",
label: "Notizen", label: "Notizen",
inputType: "textarea" inputType: "textarea",
inputColumn: "Allgemeines"
}, },
{ {
key: "profiles", key: "profiles",
@@ -380,7 +438,8 @@ export const useDataStore = defineStore('data', () => {
selectOptionAttribute: "fullName", selectOptionAttribute: "fullName",
selectSearchAttributes: ['fullName'], selectSearchAttributes: ['fullName'],
selectMultiple: true, selectMultiple: true,
component: profiles component: profiles,
inputColumn: "Allgemeines"
}, },
], ],
showTabs: [{label: 'Informationen'},{label: 'Ansprechpartner'},{label: 'Dateien'},{label: 'Ausgangsbelege'},{label: 'Projekte'},{label: 'Objekte'},{label: 'Termine'},{label: 'Verträge'}] showTabs: [{label: 'Informationen'},{label: 'Ansprechpartner'},{label: 'Dateien'},{label: 'Ausgangsbelege'},{label: 'Projekte'},{label: 'Objekte'},{label: 'Termine'},{label: 'Verträge'}]