Toggle navigation
Toggle navigation
This project
Loading...
Sign in
2020-1-CloudComputing
/
D_Team_Khuloud
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
최동원
2020-05-27 00:13:07 +0900
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
2f7e0b6f5160f08442fa2019d66bec01c33d8119
2f7e0b6f
1 parent
b32ea4a4
add folders
Show whitespace changes
Inline
Side-by-side
Showing
7 changed files
with
112 additions
and
22 deletions
front-end/public/index.html
front-end/src/api/index.js
front-end/src/components/FileList.vue
front-end/src/components/FolderList.vue
front-end/src/routes/index.js
front-end/src/store/index.js
front-end/src/views/FolderPage.vue
front-end/public/index.html
View file @
2f7e0b6
...
...
@@ -8,6 +8,7 @@
<title>
<
%= htmlWebpackPlugin.options.title %>
</title>
<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"
>
</head>
<body>
<noscript>
...
...
front-end/src/api/index.js
View file @
2f7e0b6
...
...
@@ -14,4 +14,8 @@ function registerUser(userData) {
return
axios
.
post
(
'/api/login'
,
userData
);
}
export
{
registerUser
,
loginUser
};
\ No newline at end of file
function
dropbox
(
userData
){
return
axios
.
get
(
'/api/dropbox'
,
userData
);
}
export
{
registerUser
,
loginUser
,
dropbox
};
\ No newline at end of file
...
...
front-end/src/components/FileList.vue
View file @
2f7e0b6
...
...
@@ -17,19 +17,16 @@
<v-subheader inset>Folders</v-subheader>
<v-list-item
v-for="item in
items
"
v-for="item in
this.$store.getters.folderL
"
:key="item.title"
@click=""
@click="
$router.push({name: 'Folder'})
"
>
<v-list-item-avatar>
<v-icon
>{{item.iconClass}}</v-icon>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.title"></v-list-item-title>
<v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
<v-list-item-title v-text="item"></v-list-item-title>
</v-list-item-content>
<v-list-item-action>
...
...
@@ -49,12 +46,11 @@
@click=""
>
<v-list-item-avatar>
<v-icon>
{{item.iconClass}}
</v-icon>
<v-icon>
mdi-file
</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.title"></v-list-item-title>
<v-list-item-subtitle v-text="item.subtitle"></v-list-item-subtitle>
<v-list-item-title v-text="item"></v-list-item-title>
</v-list-item-content>
<v-list-item-action>
...
...
@@ -98,17 +94,40 @@
</template>
<script>
import { dropbox } from '../api/index';
export default {
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' },
],
}),
data() {
return {
folders: [],
files: [],
search:'',
}
},
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);
} catch (error) {
console.log("에러");
console.log(error.response.data);
}
}
// 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>
...
...
front-end/src/components/FolderList.vue
0 → 100644
View file @
2f7e0b6
<template>
<div>
<v-list>
<v-icon>mdi-folder</v-icon>
<v-header>Folders</v-header>
<v-list-item
v-for="item in items"
:key="item.files">
</v-list-item>
</v-list>
</div>
</template>
<script>
export default {
props:{
}
}
</script>
<style>
</style>
\ No newline at end of file
front-end/src/routes/index.js
View file @
2f7e0b6
...
...
@@ -66,6 +66,11 @@ export default new VueRouter ({
path
:
'/feedback'
,
name
:
'Feedback'
,
component
:
()
=>
import
(
'../views/Feedback.vue'
)
},
{
path
:
'/folder'
,
name
:
'Folder'
,
component
:
()
=>
import
(
'../views/FolderPage.vue'
)
}
]
...
...
front-end/src/store/index.js
View file @
2f7e0b6
...
...
@@ -6,6 +6,8 @@ Vue.use(Vuex)
export
default
new
Vuex
.
Store
({
state
:
{
id
:
''
,
folders
:
[],
files
:
[],
},
mutations
:
{
setId
(
state
,
userid
){
...
...
@@ -13,11 +15,26 @@ export default new Vuex.Store({
},
clearid
(
state
){
state
.
id
=
''
;
},
setFolder
(
state
,
folderlist
){
state
.
folders
=
folderlist
;
},
setFile
(
state
,
filelist
){
state
.
files
=
fileList
;
}
},
getters
:
{
isLogin
(
state
){
return
state
.
id
!==
''
;
},
userID
(
state
){
return
state
.
id
;
},
folderL
(
state
){
return
state
.
folders
;
},
fileL
(
state
){
return
state
.
files
;
}
}
})
...
...
front-end/src/views/FolderPage.vue
0 → 100644
View file @
2f7e0b6
<template>
<div>
<FolderList></FolderList>
</div>
</template>
<script>
import FolderList from '../components/FolderList'
export default {
components: {
FolderList,
}
}
</script>
<style>
</style>
\ No newline at end of file
Please
register
or
login
to post a comment