Showing
2 changed files
with
73 additions
and
14 deletions
... | @@ -18,22 +18,66 @@ | ... | @@ -18,22 +18,66 @@ |
18 | <v-list-item | 18 | <v-list-item |
19 | v-for="item in this.$store.getters.folderL" | 19 | v-for="item in this.$store.getters.folderL" |
20 | :key="item.title" | 20 | :key="item.title" |
21 | + :search="search" | ||
22 | + @click.right="show" | ||
23 | + @click.left="moveF(item.folder_name)" | ||
21 | > | 24 | > |
22 | - <v-list-item-avatar @click="moveF(item.folder_name)"> | 25 | + <v-list-item-avatar > |
23 | <v-icon>mdi-folder</v-icon> | 26 | <v-icon>mdi-folder</v-icon> |
24 | </v-list-item-avatar> | 27 | </v-list-item-avatar> |
25 | - <v-list-item-content @click="moveF(item.folder_name)"> | 28 | + <v-list-item-content > |
26 | <v-list-item-title v-text="item.folder_name"></v-list-item-title> | 29 | <v-list-item-title v-text="item.folder_name"></v-list-item-title> |
27 | </v-list-item-content> | 30 | </v-list-item-content> |
28 | - <v-list-item-action> | ||
29 | - <v-btn icon> | ||
30 | - <v-icon color="grey lighten-1">mdi-information</v-icon> | ||
31 | - </v-btn> | ||
32 | - <v-btn icon @click="deleteF(item.folder_name)"> | ||
33 | - <v-icon color="grey lighten-1">mdi-delete</v-icon> | ||
34 | - </v-btn> | ||
35 | - </v-list-item-action> | ||
36 | </v-list-item> | 31 | </v-list-item> |
32 | + | ||
33 | + | ||
34 | + <v-menu | ||
35 | + v-model="showMenu" | ||
36 | + :position-x="x" | ||
37 | + :position-y="y" | ||
38 | + absolute | ||
39 | + offset-y | ||
40 | + > | ||
41 | + <v-list dense> | ||
42 | + <v-list-item @click.prevent="dialog2 = !dialog2"> | ||
43 | + <v-list-item-title>이동</v-list-item-title> | ||
44 | + </v-list-item> | ||
45 | + <v-list-item @click.prevent="deleteF"> | ||
46 | + <v-list-item-title>삭제</v-list-item-title> | ||
47 | + </v-list-item> | ||
48 | + </v-list> | ||
49 | + </v-menu> | ||
50 | + | ||
51 | + <v-dialog | ||
52 | + v-model="dialog2" | ||
53 | + width="500px" | ||
54 | + > | ||
55 | + <v-card> | ||
56 | + <v-card-title class="grey darken-2"> | ||
57 | + Move Folder | ||
58 | + </v-card-title> | ||
59 | + <v-container> | ||
60 | + <div> | ||
61 | + <v-icon>mdi-folder</v-icon> | ||
62 | + <v-text-field placeholder="name" id="foldername" type="text" v-model="foldername"></v-text-field> | ||
63 | + </div> | ||
64 | + </v-container> | ||
65 | + <v-card-actions> | ||
66 | + <v-spacer></v-spacer> | ||
67 | + <v-btn | ||
68 | + text | ||
69 | + color="primary" | ||
70 | + @click="dialog2 = false" | ||
71 | + >Cancel</v-btn> | ||
72 | + <v-btn | ||
73 | + text | ||
74 | + @click="" | ||
75 | + >Move</v-btn> | ||
76 | + </v-card-actions> | ||
77 | + </v-card> | ||
78 | + </v-dialog> | ||
79 | + | ||
80 | + | ||
37 | <v-divider inset></v-divider> | 81 | <v-divider inset></v-divider> |
38 | <v-subheader inset>Files</v-subheader> | 82 | <v-subheader inset>Files</v-subheader> |
39 | <v-list-item | 83 | <v-list-item |
... | @@ -99,7 +143,7 @@ | ... | @@ -99,7 +143,7 @@ |
99 | </v-btn> | 143 | </v-btn> |
100 | <v-dialog | 144 | <v-dialog |
101 | v-model="dialog" | 145 | v-model="dialog" |
102 | - width="800px" | 146 | + width="500px" |
103 | > | 147 | > |
104 | <v-card> | 148 | <v-card> |
105 | <v-card-title class="grey darken-2"> | 149 | <v-card-title class="grey darken-2"> |
... | @@ -138,7 +182,13 @@ import Axios from 'axios'; | ... | @@ -138,7 +182,13 @@ import Axios from 'axios'; |
138 | files: [], | 182 | files: [], |
139 | search:'', | 183 | search:'', |
140 | id: '', | 184 | id: '', |
141 | - dialog:false | 185 | + dialog:false, |
186 | + search: '', | ||
187 | + howMenu: false, | ||
188 | + showMenu: false, | ||
189 | + x: 0, | ||
190 | + y: 0, | ||
191 | + dialog2:false | ||
142 | } | 192 | } |
143 | }, | 193 | }, |
144 | async created(){ | 194 | async created(){ |
... | @@ -226,6 +276,15 @@ import Axios from 'axios'; | ... | @@ -226,6 +276,15 @@ import Axios from 'axios'; |
226 | console.log("에러"); | 276 | console.log("에러"); |
227 | console.log(error.response.data); | 277 | console.log(error.response.data); |
228 | } | 278 | } |
279 | + }, | ||
280 | + show (e) { | ||
281 | + e.preventDefault() | ||
282 | + this.showMenu = false | ||
283 | + this.x = e.clientX | ||
284 | + this.y = e.clientY | ||
285 | + this.$nextTick(() => { | ||
286 | + this.showMenu = true | ||
287 | + }) | ||
229 | } | 288 | } |
230 | } | 289 | } |
231 | } | 290 | } | ... | ... |
... | @@ -6,8 +6,8 @@ Vue.use(Vuex) | ... | @@ -6,8 +6,8 @@ Vue.use(Vuex) |
6 | export default new Vuex.Store({ | 6 | export default new Vuex.Store({ |
7 | state: { | 7 | state: { |
8 | id: '', | 8 | id: '', |
9 | - folders: {}, | 9 | + folders: [], |
10 | - files: {}, | 10 | + files: [], |
11 | cur: '/', | 11 | cur: '/', |
12 | parent: '/' | 12 | parent: '/' |
13 | }, | 13 | }, | ... | ... |
-
Please register or login to post a comment