Add minimum code needed to open new file modal

This commit is contained in:
Dane Everitt 2019-05-10 21:20:37 -07:00
parent d280a91115
commit 2c73991f2b
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
3 changed files with 57 additions and 3 deletions

View file

@ -27,7 +27,7 @@
</div>
</div>
<div>
<div class="context-row">
<div class="context-row" v-on:click="openNewFileModal">
<div class="icon">
<Icon name="file-plus" class="h-4"/>
</div>
@ -73,6 +73,11 @@
this.$emit('close');
},
openNewFileModal: function () {
window.events.$emit('server:files:open-new-file-modal');
this.$emit('close');
},
triggerAction: function (action: string) {
this.$emit(`action:${action}`);
}

View file

@ -0,0 +1,43 @@
<template>
<Modal :show="isVisible" v-on:close="isVisible = false" :dismissable="!isLoading">
<MessageBox class="alert error mb-8" title="Error" :message="error" v-if="error"/>
</Modal>
</template>
<script lang="ts">
import Vue from 'vue';
import MessageBox from "@/components/MessageBox.vue";
import Modal from "@/components/core/Modal.vue";
import {ApplicationState} from '@/store/types';
import {mapState} from "vuex";
export default Vue.extend({
name: 'NewFileModal',
components: {MessageBox, Modal},
data: function (): { error: string | null, isVisible: boolean, isLoading: boolean } {
return {
error: null,
isVisible: false,
isLoading: false,
};
},
computed: mapState({
fm: (state: ApplicationState) => state.server.fm,
}),
mounted: function () {
window.events.$on('server:files:open-new-file-modal', () => {
this.isVisible = true;
});
},
methods: {
submit: function () {
},
}
})
</script>

View file

@ -48,10 +48,11 @@
<a href="#" class="block btn btn-secondary btn-sm" v-on:click.prevent="openNewFolderModal">New Folder</a>
</div>
<div>
<a href="#" class="block btn btn-primary btn-sm">New File</a>
<a href="#" class="block btn btn-primary btn-sm" v-on:click.prevent="openNewFileModal">New File</a>
</div>
</div>
<CreateFolderModal v-on:created="directoryCreated"/>
<NewFileModal/>
</div>
</template>
@ -64,6 +65,7 @@
import CreateFolderModal from '../components/filemanager/modals/CreateFolderModal.vue';
import DeleteFileModal from '../components/filemanager/modals/DeleteFileModal.vue';
import {DirectoryContentObject} from "@/api/server/types";
import NewFileModal from "@/components/server/components/filemanager/modals/NewFileModal.vue";
type DataStructure = {
loading: boolean,
@ -76,7 +78,7 @@
export default Vue.extend({
name: 'FileManager',
components: {CreateFolderModal, DeleteFileModal, FileRow},
components: {CreateFolderModal, DeleteFileModal, FileRow, NewFileModal},
computed: {
/**
@ -178,6 +180,10 @@
window.events.$emit('server:files:open-directory-modal');
},
openNewFileModal: function () {
window.events.$emit('server:files:open-new-file-modal');
},
fileRowDeleted: function (file: DirectoryContentObject, directory: boolean) {
if (directory) {
this.directories = this.directories.filter(data => data !== file);