2020-1-CloudComputing / D_Team_Khuloud

Go to a project
Toggle navigation Toggle navigation pinning
최동원
9d6ac623 1 parent 2f7e0b6f

make folder

Inline Side-by-side
Showing 4 changed files with 93 additions and 131 deletions
......@@ -15,7 +15,11 @@ function registerUser(userData) {
}
function dropbox(userData){
return axios.get('/api/dropbox', userData);
return axios.get(`/api/folder/${userData}`);
}
export { registerUser, loginUser, dropbox };
\ No newline at end of file
function makeFolder(folderData){
return axios.post('/api/makefolder', folderData);
}
export { registerUser, loginUser, dropbox, makeFolder };
\ No newline at end of file
......
......@@ -41,7 +41,7 @@
<v-subheader inset>Files</v-subheader>
<v-list-item
v-for="item in items2"
v-for="item in this.$store.getters.fileL"
:key="item.title"
@click=""
>
......@@ -90,44 +90,107 @@
</span>
</template>
</v-file-input>
<template>
<v-btn
bottom
color="blue"
dark
fab
fixed
right
@click="dialog = !dialog"
>
<v-icon>mdi-plus</v-icon>
</v-btn>
</template>
<v-dialog
v-model="dialog"
width="800px"
>
<v-card>
<v-card-title class="grey darken-2">
Create Folder
</v-card-title>
<v-container>
<div>
<v-icon>mdi-folder</v-icon>
<v-text-field placeholder="name" id="foldername" type="text" v-mode="foldername" @click="makeF"></v-text-field>
</div>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="dialog = false"
>Cancel</v-btn>
<v-btn
text
@click="dialog = false"
>Create</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</div>
</template>
<script>
import { dropbox } from '../api/index';
import { dropbox, makeFolder } from '../api/index';
export default {
data() {
return {
foldername: '',
folders: [],
files: [],
search:'',
id: '',
dialog: false,
}
},
async created(){
try {
const userData = {
user_id: this.$store.getters.userId,
cur: '/',
};
const { data } = await dropbox(userData);
console.log(data);
this.$store.commit('setFolder', data.folders);
this.$store.commit('setFile', data.files);
const userData = this.$store.state.id;
console.log(this.id);
const response = await dropbox(userData);
console.log(response);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setFile', response.data.files);
} catch (error) {
console.log("에러");
console.log(error.response.data);
}
},
methods: {
initFolderName(){
this.foldername = '';
},
async makeF(){
try {
const folderData = {
user_id : this.$store.state.id,
cur : this.$store.state.id,
folder_name : this.foldername
};
const response = await makeFolder(folderData);
if (reponse.status == 200){
try {
const res = await deropbox(folderData.user_id);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setFile', response.data.files);
} catch (error) {
console.log("에러");
console.log(error.response.data);
}
}
console.log("폴더 생성 완료");
} catch (error) {
console.log("에러");
console.log(error.response.data);
} finally{
this.initFolderName();
}
}
}
// data: () => ({
// items: [
// { icon: 'folder', iconClass: 'mdi-folder', title: 'Photos', subtitle: 'Jan 9, 2014' },
// { icon: 'folder', iconClass: 'mdi-folder', title: 'Recipes', subtitle: 'Jan 17, 2014' },
// { icon: 'folder', iconClass: 'mdi-folder', title: 'Work', subtitle: 'Jan 28, 2014' },
// ],
// items2: [
// { icon: 'assignment', iconClass: 'mdi-file', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
// { icon: 'call_to_action', iconClass: 'mdi-PdfBox', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
// ],
// }),
}
</script>
......
......@@ -132,112 +132,6 @@
<router-view></router-view>
</v-container>
</v-content>
<template v-if="isUserLogin">
<v-btn
bottom
color="pink"
dark
fab
fixed
right
@click="dialog = !dialog"
>
<v-icon>mdi-plus</v-icon>
</v-btn>
</template>
<!-- <v-btn
bottom
color="pink"
dark
fab
fixed
right
@click="dialog = !dialog"
>
<v-icon>mdi-plus</v-icon>
</v-btn> -->
<v-dialog
v-model="dialog"
width="800px"
>
<v-card>
<v-card-title class="grey darken-2">
Create contact
</v-card-title>
<v-container>
<v-row class="mx-2">
<v-col
class="align-center justify-space-between"
cols="12"
>
<v-row
align="center"
class="mr-0"
>
<v-avatar
size="40px"
class="mx-3"
>
<img
src="//ssl.gstatic.com/s2/oz/images/sge/grey_silhouette.png"
alt=""
>
</v-avatar>
<v-text-field
placeholder="Name"
></v-text-field>
</v-row>
</v-col>
<v-col cols="6">
<v-text-field
prepend-icon="mdi-account-card-details-outline"
placeholder="Company"
></v-text-field>
</v-col>
<v-col cols="6">
<v-text-field
placeholder="Job title"
></v-text-field>
</v-col>
<v-col cols="12">
<v-text-field
prepend-icon="mdi-mail"
placeholder="Email"
></v-text-field>
</v-col>
<v-col cols="12">
<v-text-field
type="tel"
prepend-icon="mdi-phone"
placeholder="(000) 000 - 0000"
></v-text-field>
</v-col>
<v-col cols="12">
<v-text-field
prepend-icon="mdi-text"
placeholder="Notes"
></v-text-field>
</v-col>
</v-row>
</v-container>
<v-card-actions>
<v-btn
text
color="primary"
>More</v-btn>
<v-spacer></v-spacer>
<v-btn
text
color="primary"
@click="dialog = false"
>Cancel</v-btn>
<v-btn
text
@click="dialog = false"
>Save</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-app>
</template>
......
......@@ -8,6 +8,7 @@ export default new Vuex.Store({
id: '',
folders: [],
files: [],
cur:'/',
},
mutations: {
setId(state, userid){
......@@ -20,8 +21,8 @@ export default new Vuex.Store({
state.folders = folderlist;
},
setFile(state, filelist){
state.files = fileList;
}
state.files = filelist;
},
},
getters: {
isLogin(state){
......