composable for model editor functions WIP

This commit is contained in:
vabene1111
2024-09-26 21:53:04 +02:00
parent 5ada8e529c
commit 67fff17f06
2 changed files with 64 additions and 41 deletions

View File

@@ -1,16 +1,16 @@
<template>
<v-card>
<v-card :loading="loading">
<v-card-title>
{{ $t(modelClass.model.localizationKey) }}
<v-btn class="float-right" icon="$close" variant="plain" @click="emit('close')" v-if="dialog"></v-btn>
</v-card-title>
<v-card-text>
<v-form>
<v-form :disabled="loading">
<v-row>
<v-col cols="10">
<v-text-field label="Token" v-model="editingObj.token" disabled></v-text-field>
</v-col>
<v-col cols="2" >
<v-col cols="2">
<btn-copy :copy-value="editingObj.token" class="me-1"></btn-copy>
</v-col>
</v-row>
@@ -23,7 +23,7 @@
<v-btn color="delete" prepend-icon="$delete" v-if="isUpdate">{{ $t('Delete') }}
<delete-confirm-dialog :object-name="objectName" @delete="deleteObject"></delete-confirm-dialog>
</v-btn>
<v-btn color="save" prepend-icon="$save" @click="saveObject">{{ isUpdate ? $t('Save') : $t('Create') }}</v-btn>
<v-btn color="save" prepend-icon="$save" @click="saveObject(modelClass, editingObj)">{{ isUpdate ? $t('Save') : $t('Create') }}</v-btn>
</v-card-actions>
</v-card>
</template>
@@ -39,19 +39,22 @@ import {ErrorMessageType, PreparedMessage, useMessageStore} from "@/stores/Messa
import {DateTime} from "luxon";
import BtnCopy from "@/components/buttons/BtnCopy.vue";
import {GenericModel, getGenericModelFromString} from "@/types/Models";
import {useModelEditorFunctions} from "@/composables/useModelEditorFunctions";
const {t} = useI18n()
const emit = defineEmits(['create', 'save', 'delete', 'close'])
const props = defineProps({
item: {type: {} as PropType<AccessToken>, required: false},
dialog: {type: Boolean, default: false}
})
const editingObj = ref({} as AccessToken)
//const editingObj = ref({} as AccessToken)
const modelClass = ref({} as GenericModel)
const loading = ref(false)
const {deleteObject, saveObject, loading, editingObj} = useModelEditorFunctions<AccessToken>(emit)
/**
* checks if given object has ID property to determine if it needs to be updated or created
@@ -81,41 +84,6 @@ onMounted(() => {
}
})
/**
* saves the edited object in the database
*/
async function saveObject() {
if (isUpdate.value) {
modelClass.value.update(editingObj.value.id, editingObj.value).then(r => {
editingObj.value = r
emit('save', r)
useMessageStore().addPreparedMessage(PreparedMessage.UPDATE_SUCCESS)
}).catch(err => {
useMessageStore().addError(ErrorMessageType.UPDATE_ERROR, err)
})
} else {
modelClass.value.create(editingObj.value).then(r => {
editingObj.value = r
emit('create', r)
useMessageStore().addPreparedMessage(PreparedMessage.CREATE_SUCCESS)
}).catch(err => {
useMessageStore().addError(ErrorMessageType.CREATE_ERROR, err)
})
}
}
/**
* deletes the editing object from the database
*/
async function deleteObject() {
modelClass.value.destroy(editingObj.value.id).then(r => {
editingObj.value = {} as AccessToken
emit('delete', editingObj.value)
}).catch(err => {
useMessageStore().addError(ErrorMessageType.DELETE_ERROR, err)
})
}
</script>
<style scoped>