2020-1-CloudComputing / D_Team_Khuloud

Go to a project
Toggle navigation Toggle navigation pinning
최동원
713ee350 1 parent 525538d2

make trashcan

Inline Side-by-side
Showing 8 changed files with 302 additions and 41 deletions
......@@ -89,6 +89,14 @@ function accessedList(curData) {
});
}
function showTrashcan(userId) {
return axios.get('/api/trashcan/show', {
params: {
id: userId,
},
});
}
function modifyFile(fileData) {
return axios.post(`/api/file/modify/${fileData.name}`, fileData);
}
......@@ -125,6 +133,32 @@ function shareFile(shareData) {
return axios.post('/api/share', shareData);
}
function tdelFolder(tData) {
return axios.get('/api/trashcan/delfolder', {
params: {
id: tData.id,
folder_id: tData.folder_id,
},
});
}
function tdelFile(tData) {
return axios.get('/api/trashcan/delfile', {
params: {
id: tData.id,
file_id: tData.file_id,
},
});
}
function tdelAll(userId) {
return axios.get('/api/trashcan/all', {
params: {
id: userId,
},
});
}
export {
registerUser,
loginUser,
......@@ -146,4 +180,8 @@ export {
modifyFile,
getFavoriteList,
shareFile,
tdelFolder,
tdelFile,
tdelAll,
showTrashcan,
};
......
......@@ -436,26 +436,6 @@ export default {
this.dialog = false;
}
},
async moveF(move_folder_name) {
try {
const curData = {
id: this.$store.state.id,
cur: this.$store.state.cur + move_folder_name + '/',
};
const response = await folder(curData);
const file_response = await file(curData);
console.log(response.data);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setFile', file_response.data.files);
this.$store.commit('setCur', response.data.cur);
this.$store.commit('setParent', response.data.parentPath);
this.folders = this.$store.getters.folderL;
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async moveParent() {
try {
const cData = {
......
......@@ -47,7 +47,7 @@
<v-list-item-title>연락처</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item router :to="{ name: 'Trash' }" exact>
<v-list-item-action>
<v-icon>mdi-delete</v-icon>
</v-list-item-action>
......
<template>
<div>
<v-toolbar flat>
<v-toolbar-title>내 드라이브</v-toolbar-title>
<v-spacer></v-spacer>
<v-text-field
v-model="search"
append-icon="mdi-magnify"
label="검색"
single-line
hide-details
></v-text-field>
</v-toolbar>
<v-list two-line subheader>
<!-- <v-subheader inset>Folders</v-subheader> -->
<!-- Folder view -->
<v-list-item
v-for="item in this.$store.getters.trashFolderL"
:key="item.folder_id"
:search="search"
@click.right="show(item, $event)"
@click=""
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.folder_name"></v-list-item-title>
</v-list-item-content>
</v-list-item>
<!-- File view -->
<v-list-item
v-for="item in this.$store.getters.trashFileL"
:key="item.title"
@click.right="showF(item, $event)"
>
<v-list-item-avatar>
<v-icon> mdi-file</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.file_name"></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
<v-menu
v-model="showMenu"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="delFolder">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="transferF">
<v-list-item-icon>
<v-icon>fas fa-trash-restore</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>복원</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
<v-menu
v-model="showMenu"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="delFile">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="transferFile">
<v-list-item-icon>
<v-icon>fas fa-trash-restore</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>복원</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
</div>
</template>
<script>
import {
tdelFolder,
tdelFile,
tdelAll,
moveFolder,
moveFile,
showTrashcan,
} from '../api/index';
export default {
data() {
return {
curfName: {},
showMenu: false,
cfilename: {},
showMenuF: false,
};
},
created() {
this.fetchData();
},
watch: {
$route: 'fetchData',
},
methods: {
async fetchData() {
try {
const id = this.$store.state.id;
const response = await showTrashcan(id);
this.$store.commit('settrashFolderList', response.data.folders);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
}
},
async delFolder() {
try {
const tData = {
id: this.$store.state.id,
folder_id: this.curfName.folder_id,
};
const response = await tdelFolder(tData);
this.$store.commit('settrashFolderList', response.data.folders);
} catch (error) {
console.log('에러');
alert('삭제 실패');
}
},
async delFile() {
try {
const tData = {
id: this.$store.state.id,
folder_id: this.cfilename.file_id,
};
const response = await tdelFile(tData);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
alert('삭제 실패');
}
},
async delAll() {
try {
const id = this.$store.state.id;
const response = await tdelAll(id);
this.$store.commit('settrashFolderList', response.data.folders);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
alert('삭제 실패');
}
},
async transferF() {
try {
const cData = {
id: this.$store.state.id,
cur: '/trashcan/',
name: this.curfName.folder_name,
isfolder: true,
newPath: '/',
};
const response = await moveFolder(cData);
console.log(response);
this.$store.commit('settrashFolderList', response.data.folders);
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async transferFile() {
try {
const fData = {
id: this.$store.state.id,
cur: '/trashcan/',
name: this.cfilename.file_name,
isfolder: false,
newPath: '/',
};
const response = await moveFile(fData);
console.log(response);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
show(folderObj, e) {
e.preventDefault();
this.curfName = folderObj;
this.showMenu = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenu = true;
});
},
showF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showMenuF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenuF = true;
});
},
},
};
</script>
<style></style>
......@@ -441,26 +441,6 @@ export default {
this.dialog = false;
}
},
async moveF(move_folder_name) {
try {
const curData = {
id: this.$store.state.id,
cur: this.$store.state.cur + move_folder_name + '/',
};
const response = await folder(curData);
const file_response = await file(curData);
console.log(response.data);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setFile', file_response.data.files);
this.$store.commit('setCur', response.data.cur);
this.$store.commit('setParent', response.data.parentPath);
this.folders = this.$store.getters.folderL;
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async moveParent() {
try {
const cData = {
......
......@@ -72,5 +72,10 @@ export default new VueRouter({
component: () => import('../components/folderc'),
props: true,
},
{
path: '/trash',
name: 'Trash',
component: () => import('../views/TrashPage'),
},
],
});
......
......@@ -13,6 +13,8 @@ export default new Vuex.Store({
recentList: [],
favFolderList: [],
favFileList: [],
trashFolderList: [],
trashFileList: [],
},
mutations: {
setId(state, userid) {
......@@ -42,6 +44,12 @@ export default new Vuex.Store({
setfavFileList(state, fflist) {
state.favFileList = fflist;
},
settrashFolderList(state, tflist) {
state.trashFolderList = tflist;
},
settrashFileList(state, tflist) {
state.trashFileList = tflist;
},
},
getters: {
isLogin(state) {
......@@ -74,5 +82,11 @@ export default new Vuex.Store({
favFileL(state) {
return state.favFileList;
},
trashFolderL(state) {
return state.trashFolderList;
},
trashFileL(state) {
return state.trashFolderList;
},
},
});
......
<template>
<TrashList></TrashList>
</template>
<script>
import TrashList from '../components/TrashList';
export default {
components: {
TrashList,
},
};
</script>
<style></style>