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 143 additions and 38 deletions
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
9 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900"> 9 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
10 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css"> 10 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
11 <meta name="viewport" content="width=device-width,initial-scale=1.0"> 11 <meta name="viewport" content="width=device-width,initial-scale=1.0">
12 + <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css" integrity="본인 api키" crossorigin="anonymous">
12 </head> 13 </head>
13 <body> 14 <body>
14 <noscript> 15 <noscript>
......
...@@ -3,19 +3,35 @@ ...@@ -3,19 +3,35 @@
3 <v-toolbar flat> 3 <v-toolbar flat>
4 <v-toolbar-title>내 드라이브</v-toolbar-title> 4 <v-toolbar-title>내 드라이브</v-toolbar-title>
5 <v-spacer></v-spacer> 5 <v-spacer></v-spacer>
6 + <v-text-field
7 + v-model="search"
8 + append-icon="mdi-magnify"
9 + label="검색"
10 + single-line
11 + hide-details
12 + ></v-text-field>
6 </v-toolbar> 13 </v-toolbar>
7 <v-list two-line subheader> 14 <v-list two-line subheader>
8 <!-- <v-subheader inset>Folders</v-subheader> --> 15 <!-- <v-subheader inset>Folders</v-subheader> -->
9 <!-- Folder view --> 16 <!-- Folder view -->
10 - <v-list-item v-if="this.$store.state.cur !== '/'" @click="moveParent" 17 + <v-list-item
18 + v-if="this.$route.path !== '/fav'"
19 + @click=""
20 + @dblclick="$router.go(-1)"
11 >...</v-list-item 21 >...</v-list-item
12 > 22 >
13 <v-list-item 23 <v-list-item
14 v-for="item in this.$store.getters.favFolderL" 24 v-for="item in this.$store.getters.favFolderL"
15 - :key="item.title" 25 + :key="item.folder_id"
26 + :search="search"
16 @click.right="show(item, $event)" 27 @click.right="show(item, $event)"
17 @click="" 28 @click=""
18 - @dblclick="$router.push(`/file/${item.folder_id}`)" 29 + @dblclick="
30 + $router.push({
31 + name: 'Folder',
32 + params: { id: item.folder_id },
33 + })
34 + "
19 > 35 >
20 <v-list-item-avatar> 36 <v-list-item-avatar>
21 <v-icon>mdi-folder</v-icon> 37 <v-icon>mdi-folder</v-icon>
...@@ -34,7 +50,7 @@ ...@@ -34,7 +50,7 @@
34 </v-list-item> 50 </v-list-item>
35 <!-- File view --> 51 <!-- File view -->
36 <v-list-item 52 <v-list-item
37 - v-for="item in this.$store.getters.favFileL" 53 + v-for="item in this.$store.getters.faveFileL"
38 :key="item.title" 54 :key="item.title"
39 @click.right="showF(item, $event)" 55 @click.right="showF(item, $event)"
40 @dblclick=" 56 @dblclick="
...@@ -264,18 +280,21 @@ import { ...@@ -264,18 +280,21 @@ import {
264 getFavoriteList, 280 getFavoriteList,
265 } from '../api/index'; 281 } from '../api/index';
266 import Axios from 'axios'; 282 import Axios from 'axios';
283 +
267 export default { 284 export default {
268 props: { 285 props: {
269 - folderId: Object, 286 + folderId: Number,
270 }, 287 },
271 data() { 288 data() {
272 return { 289 return {
290 + folder_id: this.$route.params.id,
273 uploadedfile: null, 291 uploadedfile: null,
274 foldername: '', 292 foldername: '',
275 curfName: {}, 293 curfName: {},
276 cfilename: {}, 294 cfilename: {},
277 folders: [], 295 folders: [],
278 files: [], 296 files: [],
297 + search: '',
279 id: '', 298 id: '',
280 current_filename: null, //파일 상세정보 (이름) 299 current_filename: null, //파일 상세정보 (이름)
281 current_filedata: null, //파일 상세정보 (내용) 300 current_filedata: null, //파일 상세정보 (내용)
...@@ -297,7 +316,14 @@ export default { ...@@ -297,7 +316,14 @@ export default {
297 }, 316 },
298 }; 317 };
299 }, 318 },
300 - async created() { 319 + created() {
320 + this.fetchData();
321 + },
322 + watch: {
323 + $route: 'fetchData',
324 + },
325 + methods: {
326 + async fetchData() {
301 try { 327 try {
302 const response = await getFavoriteList(this.$store.state.id); 328 const response = await getFavoriteList(this.$store.state.id);
303 console.log(response.data); 329 console.log(response.data);
...@@ -308,7 +334,6 @@ export default { ...@@ -308,7 +334,6 @@ export default {
308 console.log(error); 334 console.log(error);
309 } 335 }
310 }, 336 },
311 - methods: {
312 handleFileUpload() { 337 handleFileUpload() {
313 this.uploadedfile = this.$refs.uploadedfile.files[0]; 338 this.uploadedfile = this.$refs.uploadedfile.files[0];
314 console.log(this.uploadedfile); 339 console.log(this.uploadedfile);
...@@ -322,18 +347,38 @@ export default { ...@@ -322,18 +347,38 @@ export default {
322 this.dialog2 = false; 347 this.dialog2 = false;
323 this.dialog3 = false; 348 this.dialog3 = false;
324 }, 349 },
325 - async moveF(folder_name, location) { 350 + async makeF() {
351 + try {
352 + const folderData = {
353 + user_id: this.$store.state.id,
354 + cur: this.$store.state.cur,
355 + folder_name: this.foldername,
356 + };
357 + const response = await makeFolder(folderData);
358 + console.log(response.data);
359 + console.log('폴더 생성 완료');
360 + this.$store.commit('setFolder', response.data.folders);
361 + this.folders = response.data.folders;
362 + } catch (error) {
363 + console.log('에러');
364 + console.log(error.response.data);
365 + } finally {
366 + this.initFolderName();
367 + this.dialog = false;
368 + }
369 + },
370 + async moveF(move_folder_name) {
326 try { 371 try {
327 const curData = { 372 const curData = {
328 id: this.$store.state.id, 373 id: this.$store.state.id,
329 - cur: location, 374 + cur: this.$store.state.cur + move_folder_name + '/',
330 }; 375 };
331 const response = await folder(curData); 376 const response = await folder(curData);
332 const file_response = await file(curData); 377 const file_response = await file(curData);
333 console.log(response.data); 378 console.log(response.data);
334 - this.$store.commit('setfavFolderList', response.data.folders); 379 + this.$store.commit('setFolder', response.data.folders);
335 - this.$store.commit('setfavFileList', file_response.data.files); 380 + this.$store.commit('setFile', file_response.data.files);
336 - this.$store.commit('setCur', location); 381 + this.$store.commit('setCur', response.data.cur);
337 this.$store.commit('setParent', response.data.parentPath); 382 this.$store.commit('setParent', response.data.parentPath);
338 this.folders = this.$store.getters.folderL; 383 this.folders = this.$store.getters.folderL;
339 this.files = this.$store.getters.fileL; 384 this.files = this.$store.getters.fileL;
...@@ -380,6 +425,77 @@ export default { ...@@ -380,6 +425,77 @@ export default {
380 this.curfName = ''; 425 this.curfName = '';
381 } 426 }
382 }, 427 },
428 + async transferF(folderName) {
429 + try {
430 + const cData = {
431 + id: this.$store.state.id,
432 + cur: this.$store.state.cur,
433 + name: this.curfName.folder_name,
434 + isfolder: true,
435 + newPath: this.$store.state.cur + folderName + '/',
436 + };
437 + const response = await moveFolder(cData);
438 + console.log(response);
439 + this.$store.commit('setFolder', response.data.folders);
440 + this.folders = this.$store.getters.folderL;
441 + } catch (error) {
442 + console.log('에러');
443 + console.log(error.response.data);
444 + } finally {
445 + this.curfName = {};
446 + this.dialog2 = false;
447 + }
448 + },
449 + async upload_file() {
450 + try {
451 + const formData = new FormData();
452 + formData.append('file', this.uploadedfile);
453 + formData.append('user_id', this.$store.state.id);
454 + formData.append('cur', this.$store.state.cur);
455 + const currentData = {
456 + id: this.$store.state.id,
457 + cur: this.$store.state.cur,
458 + };
459 + console.log(currentData);
460 + const response = await uploadFile(formData);
461 + const filelist = await file(currentData);
462 + console.log(filelist.data.files);
463 + this.$store.commit('setFile', filelist.data.files);
464 + console.log(this.$store.getters.fileL);
465 + this.files = this.$store.getters.fileL;
466 + } catch (error) {
467 + console.log('에러');
468 + console.log(error);
469 + }
470 + },
471 + async delete_file() {
472 + try {
473 + var itemlist = this.$store.getters.fileL;
474 + const currentData = {
475 + fileName: null,
476 + user_id: null,
477 + cur: this.$store.state.cur,
478 + };
479 + for (var i = 0; i < itemlist.length; i++) {
480 + if (itemlist[i].file_name == this.cfilename.file_name) {
481 + currentData.fileName = itemlist[i].file_name;
482 + currentData.user_id = itemlist[i].user_id;
483 + }
484 + }
485 + const filelistData = {
486 + id: currentData.user_id,
487 + cur: currentData.cur,
488 + };
489 + const response = await deleteFile(currentData);
490 + setTimeout(function() {}, 500);
491 + const filelist = await file(filelistData);
492 + this.$store.commit('setFile', filelist.data.files);
493 + this.files = this.$store.getters.fileL;
494 + } catch (error) {
495 + console.log('에러');
496 + console.log(error);
497 + }
498 + },
383 async download_file() { 499 async download_file() {
384 try { 500 try {
385 const currentData = { 501 const currentData = {
......
...@@ -259,7 +259,7 @@ ...@@ -259,7 +259,7 @@
259 v-on:change="handleFileUpload()" 259 v-on:change="handleFileUpload()"
260 /> 260 />
261 <br /> 261 <br />
262 - <v-btn color="blue" @click="upload_file">upload</v-btn> 262 + <v-btn @click="upload_file"><v-icon>fas fa-upload</v-icon></v-btn>
263 <v-btn bottom color="blue" dark fab fixed right @click="dialog = !dialog"> 263 <v-btn bottom color="blue" dark fab fixed right @click="dialog = !dialog">
264 <v-icon>mdi-plus</v-icon> 264 <v-icon>mdi-plus</v-icon>
265 </v-btn> 265 </v-btn>
......
...@@ -31,6 +31,14 @@ ...@@ -31,6 +31,14 @@
31 <v-list-item-title>즐겨찾기</v-list-item-title> 31 <v-list-item-title>즐겨찾기</v-list-item-title>
32 </v-list-item-content> 32 </v-list-item-content>
33 </v-list-item> 33 </v-list-item>
34 + <v-list-item router :to="{ name: 'Fav' }" exact>
35 + <v-list-item-action>
36 + <v-icon>fas fa-share-alt</v-icon>
37 + </v-list-item-action>
38 + <v-list-item-content>
39 + <v-list-item-title>공유</v-list-item-title>
40 + </v-list-item-content>
41 + </v-list-item>
34 <v-list-item router :to="{ name: 'Quick' }" exact> 42 <v-list-item router :to="{ name: 'Quick' }" exact>
35 <v-list-item-action> 43 <v-list-item-action>
36 <v-icon>mdi-history</v-icon> 44 <v-icon>mdi-history</v-icon>
...@@ -47,14 +55,6 @@ ...@@ -47,14 +55,6 @@
47 <v-list-item-title>연락처</v-list-item-title> 55 <v-list-item-title>연락처</v-list-item-title>
48 </v-list-item-content> 56 </v-list-item-content>
49 </v-list-item> 57 </v-list-item>
50 - <v-list-item router :to="{ name: 'Main' }" exact>
51 - <v-list-item-action>
52 - <v-icon>mdi-settings</v-icon>
53 - </v-list-item-action>
54 - <v-list-item-content>
55 - <v-list-item-title>설정</v-list-item-title>
56 - </v-list-item-content>
57 - </v-list-item>
58 <v-list-item> 58 <v-list-item>
59 <v-list-item-action> 59 <v-list-item-action>
60 <v-icon>mdi-delete</v-icon> 60 <v-icon>mdi-delete</v-icon>
......
...@@ -14,10 +14,7 @@ ...@@ -14,10 +14,7 @@
14 <v-list two-line subheader> 14 <v-list two-line subheader>
15 <!-- <v-subheader inset>Folders</v-subheader> --> 15 <!-- <v-subheader inset>Folders</v-subheader> -->
16 <!-- Folder view --> 16 <!-- Folder view -->
17 - <v-list-item 17 + <v-list-item @click="" @dblclick="$router.go(-1)">...</v-list-item>
18 - @click=""
19 - @dblclick="$router.go(-1)"
20 - >...</v-list-item>
21 <v-list-item 18 <v-list-item
22 v-for="item in this.$store.getters.folderL" 19 v-for="item in this.$store.getters.folderL"
23 :key="item.folder_id" 20 :key="item.folder_id"
......
1 <template lang="html"> 1 <template lang="html">
2 <v-container> 2 <v-container>
3 - <div>
4 - <h2>안녕하세요!</h2>
5 - <br /><br />
6 - </div>
7 <v-layout column> 3 <v-layout column>
8 <v-flex> 4 <v-flex>
9 - <v-layout row wrap> 5 + <v-layout column>
10 - <v-flex lg6>
11 - <v-flex>
12 - <Filecard></Filecard>
13 - </v-flex>
14 - <v-flex><br /><br /></v-flex>
15 - </v-flex>
16 <v-flex><br /><br /></v-flex> 6 <v-flex><br /><br /></v-flex>
17 - <v-flex lg6> 7 + <v-flex>
18 - <Favlist></Favlist> 8 + <FileList></FileList>
19 </v-flex> 9 </v-flex>
20 </v-layout> 10 </v-layout>
21 </v-flex> 11 </v-flex>
22 </v-layout> 12 </v-layout>
13 + <v-flex><br /><br /></v-flex>
23 <v-divider></v-divider> 14 <v-divider></v-divider>
24 <v-layout column> 15 <v-layout column>
25 <v-flex> 16 <v-flex>
......