mirrors/recipes
1
0
Fork 0
mirror of https://github.com/TandoorRecipes/recipes.git synced 2026-01-01 20:28:46 -05:00
Code Issues Packages Projects Releases Wiki Activity

space settings and file dialog

Browse Source
This commit is contained in:
vabene1111
2024-08-20 15:17:06 +02:00
parent 02ffb727d5
commit 7397f4c381
9 changed files with 211 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
vue3/src/components/inputs/UserFileField.vue Normal file
View File

@@ -0,0 +1,81 @@
<template>
<v-input>
<v-card width="100%" link @click="dialog = !dialog">
<v-card-text class="pt-2 pb-2">
<v-avatar v-if="model == null" color="primary"><i class="fa-solid fa-file-arrow-up"></i></v-avatar>
<v-avatar v-if="model != null && model.preview != ''" :image="model.preview"></v-avatar>
<v-avatar v-if="model != null && model.preview == ''" color="success"><i class="fa-solid fa-eye-slash"></i></v-avatar>
<span class="ms-2" v-if="model == null">{{ $t('select_file') }}</span>
<span class="ms-2" v-if="model != null">{{ model.name }}</span>
</v-card-text>
<!--TODO right floating edit/remove/delete/??? button -->
</v-card>
</v-input>
<v-dialog max-width="600px" v-model="dialog">
<v-card>
<v-card-title>{{ $t('Files') }}</v-card-title>
<v-tabs v-model="tab" grow>
<v-tab v-if="model != null">Preview</v-tab>
<v-tab>New</v-tab>
<v-tab>Browse</v-tab>
</v-tabs>
<v-tabs-window v-model="tab">
<v-tabs-window-item v-if="model != null">
<v-card>
<v-card-title>
{{ model.name }}
</v-card-title>
<v-card-text>
{{ $n(model.fileSizeKb / 1000) }} MB <br/>
{{ model.createdBy.displayName }} <br/>
{{ DateTime.fromJSDate(model.createdAt).toLocaleString(DateTime.DATETIME_SHORT) }}
</v-card-text>
<v-img class="mr-4 ml-4" rounded :src="model.preview"></v-img>
<v-card-actions>
<v-btn :href="model.fileDownload" target="_blank" color="success" prepend-icon="fa-solid fa-file-arrow-down">{{ $t('Download') }}</v-btn>
<!-- TODO implement -->
<v-btn color="delete" prepend-icon="$delete">{{ $t('Delete') }}</v-btn>
</v-card-actions>
</v-card>
</v-tabs-window-item>
<v-tabs-window-item :value="0">
<v-file-input></v-file-input>
</v-tabs-window-item>
<v-tabs-window-item :value="0">
TODO file List
</v-tabs-window-item>
</v-tabs-window>
</v-card>
</v-dialog>
</template>
<script setup lang="ts">
import {UserFile} from "@/openapi";
import {ref} from "vue";
import {DateTime} from "luxon";
const emit = defineEmits(['update:modelValue', 'create'])
const props = defineProps({
model: {type: {} as UserFile, default: null}
})
const model = defineModel()
const dialog = ref(false)
const tab = ref(0)
</script>
<style scoped>
</style>

6
vue3/src/components/settings/SpaceSettings.vue
View File

@@ -29,7 +29,10 @@
</v-col>
</v-row>
<v-divider class="mt-3 mb-3"></v-divider>
<v-text-field></v-text-field>
<user-file-field v-model="space.image"></user-file-field>
<user-file-field v-model="space.logoColor32"></user-file-field>
<user-file-field v-model="space.logoColor128"></user-file-field>
<v-text-field></v-text-field>
<v-text-field></v-text-field>
@@ -44,6 +47,7 @@ import {useUserPreferenceStore} from "@/stores/UserPreferenceStore";
import {onMounted, ref} from "vue";
import {ApiApi, Space} from "@/openapi";
import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore";
import UserFileField from "@/components/inputs/UserFileField.vue";
const space = ref({} as Space)