2020-1-CloudComputing / D_Team_Khuloud

Go to a project
Toggle navigation Toggle navigation pinning
최동원
d4983bd1 1 parent a178308d

코드 정리

Inline Side-by-side
Showing 7 changed files with 232 additions and 127 deletions
......@@ -9,6 +9,7 @@
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css" integrity="본인 api키" crossorigin="anonymous">
</head>
<body>
<noscript>
......
import axios from 'axios';
const instance = axios.create({
baseURL: process.env.VUE_APP_API_URL,
baseURL: process.env.VUE_APP_API_URL,
});
function registerUser(userData) {
// const url = 'http://localhost:3000/api/signup'
return axios.post('/api/RegistUser', userData);
// const url = 'http://localhost:3000/api/signup'
return axios.post('/api/RegistUser', userData);
}
function loginUser(userData) {
// const url = 'http://localhost:3000/api/login'
return axios.post('/api/login', userData);
// const url = 'http://localhost:3000/api/login'
return axios.post('/api/login', userData);
}
function folder(curData) {
return axios.get('/api/folder/show', {
params: {
id: curData.id,
folder_id: curData.folder_id,
},
});
return axios.get('/api/folder/show', {
params: {
id: curData.id,
folder_id: curData.folder_id,
},
});
}
function makeFolder(folderData) {
return axios.post('/api/folder/makefolder', folderData);
return axios.post('/api/folder/makefolder', folderData);
}
function deleteFolder(folderData) {
return axios.post('/api/folder/delfolder', folderData);
return axios.post('/api/folder/delfolder', folderData);
}
function moveFolder(folderData) {
return axios.post('/api/folder/move', folderData);
return axios.post('/api/folder/move', folderData);
}
function file(curData) {
return axios.get('/api/file', {
params: {
id: curData.id,
folder_id: curData.cur,
},
});
return axios.get('/api/file', {
params: {
id: curData.id,
folder_id: curData.cur,
},
});
}
function uploadFile(fileData) {
return axios.post('/api/file/upload', fileData, {
headers: {
'Content-Type': 'multipart/form-data',
},
});
return axios.post('/api/file/upload', fileData, {
headers: {
'Content-Type': 'multipart/form-data',
},
});
}
function detailFile(fileData) {
return axios.get(`/api/file/${fileData.fileName}`, {
params: {
id: fileData.id,
cur: fileData.cur,
},
});
return axios.get(`/api/file/${fileData.fileName}`, {
params: {
id: fileData.id,
cur: fileData.cur,
},
});
}
function deleteFile(fileData) {
return axios.get(`/api/file/delete/${fileData.fileName}`, {
params: {
//현재 접속한 사람의 id와 삭제할 파일의 이름, 현재 폴더위치를 파라미터로 넘긴다.
id: fileData.user_id,
cur: fileData.cur,
},
});
return axios.get(`/api/file/delete/${fileData.fileName}`, {
params: {
//현재 접속한 사람의 id와 삭제할 파일의 이름, 현재 폴더위치를 파라미터로 넘긴다.
id: fileData.user_id,
cur: fileData.cur,
},
});
}
function downloadFile(fileData) {
return axios.get(`/api/file/download/${fileData.fileName}`, {
params: {
//현재 접속한 사람의 id와 다운로드를 위해 선택한 파일의 이름을 파라미터로 넘긴다.
id: fileData.id,
cur: fileData.cur,
},
});
return axios.get(`/api/file/download/${fileData.fileName}`, {
params: {
//현재 접속한 사람의 id와 다운로드를 위해 선택한 파일의 이름을 파라미터로 넘긴다.
id: fileData.id,
cur: fileData.cur,
},
});
}
function accessedList(curData) {
return axios.get('/api/quick', {
params: {
id: curData.id,
},
});
return axios.get('/api/quick', {
params: {
id: curData.id,
},
});
}
function modifyFile(fileData) {
return axios.post(`/api/file/modify/${fileData.name}`, fileData);
return axios.post(`/api/file/modify/${fileData.name}`, fileData);
}
function delFavorite(folderData) {
return axios.post('/api/favorites/delfolder', folderData);
return axios.post('/api/favorites/delfolder', folderData);
}
function addFavorite(folderData) {
return axios.post('/api/favorites/addfolder', folderData);
return axios.post('/api/favorites/addfolder', folderData);
}
function moveFile(fileData) {
return axios.post('/api/folder/move', fileData);
return axios.post('/api/folder/move', fileData);
}
function delFavoriteFile(fileData) {
return axios.post('/api/favorites/delfile', fileData);
return axios.post('/api/favorites/delfile', fileData);
}
function addFavoriteFile(fileData) {
return axios.post('/api/favorites/addfile', fileData);
return axios.post('/api/favorites/addfile', fileData);
}
function getFavoriteList(userId) {
return axios.get('/api/favorites/show', {
params: {
id: userId,
},
});
return axios.get('/api/favorites/show', {
params: {
id: userId,
},
});
}
export {
registerUser,
loginUser,
folder,
makeFolder,
deleteFolder,
moveFolder,
file,
uploadFile,
deleteFile,
downloadFile,
delFavorite,
addFavorite,
moveFile,
delFavoriteFile,
addFavoriteFile,
accessedList,
detailFile,
modifyFile,
getFavoriteList,
};
\ No newline at end of file
registerUser,
loginUser,
folder,
makeFolder,
deleteFolder,
moveFolder,
file,
uploadFile,
deleteFile,
downloadFile,
delFavorite,
addFavorite,
moveFile,
delFavoriteFile,
addFavoriteFile,
accessedList,
detailFile,
modifyFile,
getFavoriteList,
};
......
......@@ -3,19 +3,35 @@
<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-if="this.$store.state.cur !== '/'" @click="moveParent"
<v-list-item
v-if="this.$route.path !== '/fav'"
@click=""
@dblclick="$router.go(-1)"
>...</v-list-item
>
<v-list-item
v-for="item in this.$store.getters.favFolderL"
:key="item.title"
:key="item.folder_id"
:search="search"
@click.right="show(item, $event)"
@click=""
@dblclick="$router.push(`/file/${item.folder_id}`)"
@dblclick="
$router.push({
name: 'Folder',
params: { id: item.folder_id },
})
"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
......@@ -34,7 +50,7 @@
</v-list-item>
<!-- File view -->
<v-list-item
v-for="item in this.$store.getters.favFileL"
v-for="item in this.$store.getters.faveFileL"
:key="item.title"
@click.right="showF(item, $event)"
@dblclick="
......@@ -264,18 +280,21 @@ import {
getFavoriteList,
} from '../api/index';
import Axios from 'axios';
export default {
props: {
folderId: Object,
folderId: Number,
},
data() {
return {
folder_id: this.$route.params.id,
uploadedfile: null,
foldername: '',
curfName: {},
cfilename: {},
folders: [],
files: [],
search: '',
id: '',
current_filename: null, //파일 상세정보 (이름)
current_filedata: null, //파일 상세정보 (내용)
......@@ -297,18 +316,24 @@ export default {
},
};
},
async created() {
try {
const response = await getFavoriteList(this.$store.state.id);
console.log(response.data);
this.$store.commit('setfavFolderList', response.data.folders);
this.$store.commit('setfavFileList', response.data.files);
} catch (error) {
console.log('에러');
console.log(error);
}
created() {
this.fetchData();
},
watch: {
$route: 'fetchData',
},
methods: {
async fetchData() {
try {
const response = await getFavoriteList(this.$store.state.id);
console.log(response.data);
this.$store.commit('setfavFolderList', response.data.folders);
this.$store.commit('setfavFileList', response.data.files);
} catch (error) {
console.log('에러');
console.log(error);
}
},
handleFileUpload() {
this.uploadedfile = this.$refs.uploadedfile.files[0];
console.log(this.uploadedfile);
......@@ -322,18 +347,38 @@ export default {
this.dialog2 = false;
this.dialog3 = false;
},
async moveF(folder_name, location) {
async makeF() {
try {
const folderData = {
user_id: this.$store.state.id,
cur: this.$store.state.cur,
folder_name: this.foldername,
};
const response = await makeFolder(folderData);
console.log(response.data);
console.log('폴더 생성 완료');
this.$store.commit('setFolder', response.data.folders);
this.folders = response.data.folders;
} catch (error) {
console.log('에러');
console.log(error.response.data);
} finally {
this.initFolderName();
this.dialog = false;
}
},
async moveF(move_folder_name) {
try {
const curData = {
id: this.$store.state.id,
cur: location,
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('setfavFolderList', response.data.folders);
this.$store.commit('setfavFileList', file_response.data.files);
this.$store.commit('setCur', location);
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;
......@@ -380,6 +425,77 @@ export default {
this.curfName = '';
}
},
async transferF(folderName) {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.curfName.folder_name,
isfolder: true,
newPath: this.$store.state.cur + folderName + '/',
};
const response = await moveFolder(cData);
console.log(response);
this.$store.commit('setFolder', response.data.folders);
this.folders = this.$store.getters.folderL;
} catch (error) {
console.log('에러');
console.log(error.response.data);
} finally {
this.curfName = {};
this.dialog2 = false;
}
},
async upload_file() {
try {
const formData = new FormData();
formData.append('file', this.uploadedfile);
formData.append('user_id', this.$store.state.id);
formData.append('cur', this.$store.state.cur);
const currentData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
};
console.log(currentData);
const response = await uploadFile(formData);
const filelist = await file(currentData);
console.log(filelist.data.files);
this.$store.commit('setFile', filelist.data.files);
console.log(this.$store.getters.fileL);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error);
}
},
async delete_file() {
try {
var itemlist = this.$store.getters.fileL;
const currentData = {
fileName: null,
user_id: null,
cur: this.$store.state.cur,
};
for (var i = 0; i < itemlist.length; i++) {
if (itemlist[i].file_name == this.cfilename.file_name) {
currentData.fileName = itemlist[i].file_name;
currentData.user_id = itemlist[i].user_id;
}
}
const filelistData = {
id: currentData.user_id,
cur: currentData.cur,
};
const response = await deleteFile(currentData);
setTimeout(function() {}, 500);
const filelist = await file(filelistData);
this.$store.commit('setFile', filelist.data.files);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error);
}
},
async download_file() {
try {
const currentData = {
......
......@@ -259,7 +259,7 @@
v-on:change="handleFileUpload()"
/>
<br />
<v-btn color="blue" @click="upload_file">upload</v-btn>
<v-btn @click="upload_file"><v-icon>fas fa-upload</v-icon></v-btn>
<v-btn bottom color="blue" dark fab fixed right @click="dialog = !dialog">
<v-icon>mdi-plus</v-icon>
</v-btn>
......
......@@ -31,6 +31,14 @@
<v-list-item-title>즐겨찾기</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item router :to="{ name: 'Fav' }" exact>
<v-list-item-action>
<v-icon>fas fa-share-alt</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>공유</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item router :to="{ name: 'Quick' }" exact>
<v-list-item-action>
<v-icon>mdi-history</v-icon>
......@@ -47,14 +55,6 @@
<v-list-item-title>연락처</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item router :to="{ name: 'Main' }" exact>
<v-list-item-action>
<v-icon>mdi-settings</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>설정</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item>
<v-list-item-action>
<v-icon>mdi-delete</v-icon>
......
......@@ -14,10 +14,7 @@
<v-list two-line subheader>
<!-- <v-subheader inset>Folders</v-subheader> -->
<!-- Folder view -->
<v-list-item
@click=""
@dblclick="$router.go(-1)"
>...</v-list-item>
<v-list-item @click="" @dblclick="$router.go(-1)">...</v-list-item>
<v-list-item
v-for="item in this.$store.getters.folderL"
:key="item.folder_id"
......
<template lang="html">
<v-container>
<div>
<h2>안녕하세요!</h2>
<br /><br />
</div>
<v-layout column>
<v-flex>
<v-layout row wrap>
<v-flex lg6>
<v-flex>
<Filecard></Filecard>
</v-flex>
<v-flex><br /><br /></v-flex>
</v-flex>
<v-layout column>
<v-flex><br /><br /></v-flex>
<v-flex lg6>
<Favlist></Favlist>
<v-flex>
<FileList></FileList>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
<v-flex><br /><br /></v-flex>
<v-divider></v-divider>
<v-layout column>
<v-flex>
......