stash
This commit is contained in:
parent
448c166507
commit
17bfb84a94
62 changed files with 62258 additions and 107 deletions
71
frontend/src/views/Files.vue
Normal file
71
frontend/src/views/Files.vue
Normal 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>
|
||||
Loading…
Add table
Add a link
Reference in a new issue