This commit is contained in:
j3d1 2023-11-29 23:42:04 +01:00
parent fa7d5f40a9
commit a1da771507
12 changed files with 476 additions and 38 deletions

View file

@ -67,6 +67,18 @@
</ul>
</div>
</div>
<div class="card">
<div class="card-header">
<h5 class="card-title">Storage Locations</h5>
</div>
<div class="card-body">
<ul>
<li v-for="location in storage_locations.sort()" :key="location.id">
{{ location.path }}
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
@ -86,13 +98,14 @@ export default {
...BIcons
},
computed: {
...mapState(["tags", "properties", "categories", "availability_policies", "domains"]),
...mapState(["tags", "properties", "categories", "availability_policies", "domains", "storage_locations"])
},
methods: {
...mapActions(["fetchInfo"]),
...mapActions(["fetchInfo", "fetchStorageLocations"])
},
async mounted() {
await this.fetchInfo();
await this.fetchStorageLocations();
}
}
</script>

View file

@ -0,0 +1,71 @@
<template>
<BaseLayout>
<main class="content">
<div class="container-fluid p-0">
<h1 class="h3 mb-3">Files</h1>
<div class="card">
<div class="card-header">
<h5 class="card-title">Images</h5>
</div>
<div class="card-body">
<span v-for="files in only_images(files)" :key="files.id">
<deletable-wrapper @delete="deleteFile(files)">
<authenticated-image :src="files.name" :owner="files.owner"
class="img-thumbnail"/>
</deletable-wrapper>
</span>
</div>
</div>
<div class="card">
<div class="card-header">
<h5 class="card-title">Other files</h5>
</div>
<div class="card-body">
<ul>
<li v-for="file in whithout_images(files)" :key="file.id">
{{ file.name }}
</li>
</ul>
</div>
</div>
</div>
</main>
</BaseLayout>
</template>
<script>
import {mapActions, mapState} from "vuex";
import * as BIcons from "bootstrap-icons-vue";
import BaseLayout from "@/components/BaseLayout.vue";
import AuthenticatedImage from "@/components/AuthenticatedImage.vue";
import DeletableWrapper from "@/components/DeletableWrapper.vue";
export default {
name: "Files",
components: {
AuthenticatedImage,
BaseLayout,
DeletableWrapper,
...BIcons
},
computed: {
...mapState(["files"])
},
methods: {
...mapActions(["fetchFiles", "deleteFile"]),
only_images(files) {
return files.filter(file => file.mime_type.startsWith("image/"));
},
whithout_images(files) {
return files.filter(file => !file.mime_type.startsWith("image/"));
}
},
mounted() {
this.fetchFiles();
}
}
</script>
<style scoped>
</style>

View file

@ -41,7 +41,7 @@
</div>
<div class="mb-3">
<label for="image" class="form-label">Image</label>
<combined-file-field :item_files="item.files" :item_id="item.id" @change="addFiles"></combined-file-field>
<combined-file-field :item_files="item.files" :item_id="item.id" @change="changeFiles"></combined-file-field>
</div>
<div class="mb-3">
<button type="submit" class="btn btn-primary" style="width: 100%"

View file

@ -6,13 +6,6 @@
<div class="card">
<div class="card-header">Create New Item</div>
<div class="card-body">
<div class="mb-3">
<ul>
<li v-for="file in item.files" :key="file.name">
{{ file.name }} ({{ file.hash }})
</li>
</ul>
</div>
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" name="name"