Showing
8 changed files
with
372 additions
and
156 deletions
... | @@ -9,6 +9,7 @@ var indexRouter = require('./routes/index'); | ... | @@ -9,6 +9,7 @@ var indexRouter = require('./routes/index'); |
9 | var userRouter = require('./routes/userlogin/user'); | 9 | var userRouter = require('./routes/userlogin/user'); |
10 | var loginRouter = require('./routes/userlogin/login'); | 10 | var loginRouter = require('./routes/userlogin/login'); |
11 | var registerRouter = require('./routes/userlogin/register'); | 11 | var registerRouter = require('./routes/userlogin/register'); |
12 | +var folderRouter = require('./routes/folders'); | ||
12 | 13 | ||
13 | 14 | ||
14 | var passport = require('passport'); | 15 | var passport = require('passport'); |
... | @@ -29,7 +30,7 @@ passport.deserializeUser(function(user, done) { | ... | @@ -29,7 +30,7 @@ passport.deserializeUser(function(user, done) { |
29 | var app = express(); | 30 | var app = express(); |
30 | 31 | ||
31 | // view engine setup | 32 | // view engine setup |
32 | -app.set('views', [path.join(__dirname, 'views'),path.join(__dirname ,'dist')]); | 33 | +app.set('views', [path.join(__dirname, 'views'), path.join(__dirname, 'dist')]); |
33 | // app.set('view engine', 'ejs'); | 34 | // app.set('view engine', 'ejs'); |
34 | 35 | ||
35 | app.use(logger('dev')); | 36 | app.use(logger('dev')); |
... | @@ -54,6 +55,7 @@ app.use('/api/', indexRouter); | ... | @@ -54,6 +55,7 @@ app.use('/api/', indexRouter); |
54 | app.use('/api/user', userRouter); | 55 | app.use('/api/user', userRouter); |
55 | app.use('/api/login', loginRouter); | 56 | app.use('/api/login', loginRouter); |
56 | app.use('/api/RegistUser', registerRouter); | 57 | app.use('/api/RegistUser', registerRouter); |
58 | +app.use('/api/folder', folderRouter); | ||
57 | //app.use('/users', usersRouter); | 59 | //app.use('/users', usersRouter); |
58 | 60 | ||
59 | // catch 404 and forward to error handler | 61 | // catch 404 and forward to error handler | ... | ... |
This diff is collapsed. Click to expand it.
... | @@ -6,6 +6,7 @@ | ... | @@ -6,6 +6,7 @@ |
6 | "start": "node ./bin/www" | 6 | "start": "node ./bin/www" |
7 | }, | 7 | }, |
8 | "dependencies": { | 8 | "dependencies": { |
9 | + "aws-sdk": "^2.683.0", | ||
9 | "cookie-parser": "~1.4.4", | 10 | "cookie-parser": "~1.4.4", |
10 | "crypto-js": "^4.0.0", | 11 | "crypto-js": "^4.0.0", |
11 | "debug": "~2.6.9", | 12 | "debug": "~2.6.9", |
... | @@ -13,9 +14,11 @@ | ... | @@ -13,9 +14,11 @@ |
13 | "express": "~4.16.1", | 14 | "express": "~4.16.1", |
14 | "express-session": "^1.17.1", | 15 | "express-session": "^1.17.1", |
15 | "http-errors": "~1.6.3", | 16 | "http-errors": "~1.6.3", |
17 | + "moment": "^2.26.0", | ||
16 | "morgan": "~1.9.1", | 18 | "morgan": "~1.9.1", |
17 | "mysql": "^2.18.1", | 19 | "mysql": "^2.18.1", |
18 | "passport": "^0.4.1", | 20 | "passport": "^0.4.1", |
19 | - "pug": "2.0.0-beta11" | 21 | + "pug": "2.0.0-beta11", |
22 | + "request": "^2.88.2" | ||
20 | } | 23 | } |
21 | } | 24 | } | ... | ... |
backend/routes/folders.js
0 → 100644
1 | +const express = require('express'); | ||
2 | +const router = express.Router(); | ||
3 | +const AWS = require("aws-sdk"); | ||
4 | +const moment = require("moment"); | ||
5 | + | ||
6 | +const BUCKET_NAME = "hong-s3-cloud"; | ||
7 | +let curPath = ""; | ||
8 | +let user_id = ""; | ||
9 | + | ||
10 | +const s3 = new AWS.S3({ | ||
11 | + accessKeyId: process.env.AWS_ACCESS_KEY_ID, | ||
12 | + secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY, | ||
13 | + region: "ap-northeast-2" | ||
14 | +}); | ||
15 | + | ||
16 | +router.get('/show', function(req, res, next) { | ||
17 | + console.log(req.query); | ||
18 | + user_id = req.query.id; | ||
19 | + curPath = req.query.cur; | ||
20 | + folders = {} | ||
21 | + let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;'; | ||
22 | + connection.query(checkfolder, [curPath, user_id], function(err, rows, fields) { | ||
23 | + if (rows.length != 0) { | ||
24 | + res.status(200).send({ | ||
25 | + folders: rows, | ||
26 | + cur: curPath | ||
27 | + }) | ||
28 | + } else { | ||
29 | + res.send({ error: "Does not exist" }); | ||
30 | + } | ||
31 | + }); | ||
32 | +}); | ||
33 | + | ||
34 | + | ||
35 | +router.post('/makefolder', function(req, res, next) { | ||
36 | + | ||
37 | + user_id = req.body.user_id; | ||
38 | + let cur = req.body.cur; | ||
39 | + curPath = user_id + cur; | ||
40 | + let folder_name = req.body.folder_name; | ||
41 | + let date = moment().format(); | ||
42 | + let params = { | ||
43 | + Bucket: BUCKET_NAME, | ||
44 | + Key: curPath + folder_name + '/', | ||
45 | + Body: "", | ||
46 | + ACL: "public-read-write" | ||
47 | + }; | ||
48 | + let checksql = 'SELECT * FROM folders WHERE location = ? AND folder_name = ?;'; | ||
49 | + console.log(req.body) | ||
50 | + connection.query(checksql, [cur, folder_name], function(err, rows, fields) { | ||
51 | + if (rows.length == 0) { | ||
52 | + s3.putObject(params, function(err, data) { | ||
53 | + if (err) { | ||
54 | + console.log('s3 error'); | ||
55 | + throw err; | ||
56 | + } else { | ||
57 | + console.log(data); | ||
58 | + } | ||
59 | + }); | ||
60 | + let sql = 'INSERT INTO folders (folder_name,location,user_id,created) values (?,?,?,?);'; | ||
61 | + let values = [folder_name, cur, user_id, date]; | ||
62 | + connection.query(sql, values, function(err, result, field) { | ||
63 | + if (err) { | ||
64 | + console.log('insert error'); | ||
65 | + throw err; | ||
66 | + } else { | ||
67 | + folders = {} | ||
68 | + let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;'; | ||
69 | + connection.query(checkfolder, [cur, user_id], function(err, rows, fields) { | ||
70 | + if (rows.length != 0) { | ||
71 | + res.status(200).send({ | ||
72 | + folders: rows, | ||
73 | + cur: curPath | ||
74 | + }) | ||
75 | + } else { | ||
76 | + res.send({ error: "Does not exist" }); | ||
77 | + } | ||
78 | + }); | ||
79 | + } | ||
80 | + }); | ||
81 | + | ||
82 | + | ||
83 | + } else { | ||
84 | + res.status(404).send({ error: "same name error" }); | ||
85 | + } | ||
86 | + }); | ||
87 | +}); | ||
88 | + | ||
89 | + | ||
90 | +router.post('/delfolder', function(req, res, next) { | ||
91 | + | ||
92 | + user_id = req.body.user_id; | ||
93 | + curPath = user_id + req.body.cur; | ||
94 | + let folder_name = req.body.folder_name; | ||
95 | + let params = { | ||
96 | + Bucket: BUCKET_NAME + curPath, | ||
97 | + Key: folder_name + '/' | ||
98 | + }; | ||
99 | + let checksql = 'SELECT * FROM folders WHERE location = ? AND folder_name = ?;'; | ||
100 | + let values = [curPath, folder_name]; | ||
101 | + | ||
102 | + connection.query(checksql, values, function(err, rows, fields) { | ||
103 | + if (rows.length != 0) { | ||
104 | + s3.deleteObject(params, function(err, data) { | ||
105 | + if (err) { | ||
106 | + //throw err; | ||
107 | + } else { | ||
108 | + let sql = 'DELETE FROM folders WHERE location = ? AND folder_name = ?;'; | ||
109 | + connection.query(sql, values, function(err, result, field) { | ||
110 | + if (err) { | ||
111 | + //throw err; | ||
112 | + } else { | ||
113 | + folders = {} | ||
114 | + let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;'; | ||
115 | + connection.query(checkfolder, [cur, user_id], function(err, rows, fields) { | ||
116 | + if (rows.length != 0) { | ||
117 | + res.status(200).send({ | ||
118 | + folders: rows, | ||
119 | + cur: curPath | ||
120 | + }) | ||
121 | + } else { | ||
122 | + res.send({ error: "Does not exist" }); | ||
123 | + } | ||
124 | + }); | ||
125 | + | ||
126 | + } | ||
127 | + }); | ||
128 | + } | ||
129 | + }); | ||
130 | + | ||
131 | + | ||
132 | + } else { | ||
133 | + res.send({ error: "Does not exist" }); | ||
134 | + } | ||
135 | + }); | ||
136 | +}); | ||
137 | + | ||
138 | + | ||
139 | +router.post('/move', function(req, res, next) { | ||
140 | + | ||
141 | + user_id = req.body.user_id; | ||
142 | + curPath = user_id + req.body.cur; | ||
143 | + let name = req.body.mfile; | ||
144 | + let newPath = req.body.newPath; | ||
145 | + let checkfolder = 'SELECT * FROM folders WHERE location = ? AND folder_name = ?;'; | ||
146 | + if (req.body.isfolder) { | ||
147 | + connection.query(checkfolder, [curPath, name], function(err1, rows, fields) { | ||
148 | + if (rows.length != 0) { | ||
149 | + let copy_params = { | ||
150 | + Bucket: BUCKET_NAME + curPath, | ||
151 | + CopySource: BUCKET_NAME + curPath + file + '/', | ||
152 | + Key: newPath + file + '/' | ||
153 | + }; | ||
154 | + | ||
155 | + let del_params = { | ||
156 | + Bucket: BUCKET_NAME + curPath, | ||
157 | + Key: file + '/' | ||
158 | + }; | ||
159 | + s3.copyObject(copy_params, function(err, data) { | ||
160 | + console.log(err, data); | ||
161 | + }); | ||
162 | + s3.deleteObject(del_params, function(err, data) { | ||
163 | + console.log(err, data); | ||
164 | + }); | ||
165 | + let values = [newPath, curPath, name]; | ||
166 | + let updatesql = 'UPDATE folders SET location = ? WHERE location = ? AND folder_name = ?;'; | ||
167 | + connection.query(updatesql, values, function(err3, result, field) { | ||
168 | + if (err3) { | ||
169 | + throw err; | ||
170 | + } else { | ||
171 | + folders = {} | ||
172 | + connection.query(checkfolder, [cur, user_id], function(err, rows, fields) { | ||
173 | + if (rows.length != 0) { | ||
174 | + res.status(200).send({ | ||
175 | + folders: rows, | ||
176 | + cur: curPath | ||
177 | + }) | ||
178 | + } else { | ||
179 | + res.send({ error: "Does not exist" }); | ||
180 | + } | ||
181 | + }); | ||
182 | + } | ||
183 | + }); | ||
184 | + | ||
185 | + | ||
186 | + } else { | ||
187 | + res.send({ error: "Does not exist" }); | ||
188 | + } | ||
189 | + }); | ||
190 | + } else { | ||
191 | + let checkfile = 'SELECT * FROM files WHERE location = ? AND file_name = ?'; | ||
192 | + | ||
193 | + connection.query(checkfile, [curPath, name], function(err1, rows, fields) { | ||
194 | + if (rows.length != 0) { | ||
195 | + let copy_params = { | ||
196 | + Bucket: BUCKET_NAME + curPath, | ||
197 | + CopySource: BUCKET_NAME + curPath + file, | ||
198 | + Key: newPath + file | ||
199 | + }; | ||
200 | + | ||
201 | + let del_params = { | ||
202 | + Bucket: BUCKET_NAME + curPath, | ||
203 | + Key: file | ||
204 | + }; | ||
205 | + s3.copyObject(copy_params, function(err, data) { | ||
206 | + console.log(err, data); | ||
207 | + }); | ||
208 | + s3.deleteObject(del_params, function(err, data) { | ||
209 | + console.log(err, data); | ||
210 | + }); | ||
211 | + let values = [newPath, curPath, name]; | ||
212 | + let updatesql = 'UPDATE files SET location = ? WHERE location = ? AND file_name = ?;'; | ||
213 | + connection.query(updatesql, values, function(err3, result, field) { | ||
214 | + if (err3) { | ||
215 | + throw err; | ||
216 | + } else { | ||
217 | + folders = {} | ||
218 | + connection.query(checkfolder, [cur, user_id], function(err, rows, fields) { | ||
219 | + if (rows.length != 0) { | ||
220 | + res.status(200).send({ | ||
221 | + folders: rows, | ||
222 | + cur: curPath | ||
223 | + }) | ||
224 | + } else { | ||
225 | + res.send({ error: "Does not exist" }); | ||
226 | + } | ||
227 | + }); | ||
228 | + } | ||
229 | + }); | ||
230 | + | ||
231 | + | ||
232 | + } else { | ||
233 | + res.send({ error: "Does not exist" }); | ||
234 | + } | ||
235 | + }); | ||
236 | + | ||
237 | + } | ||
238 | +}); | ||
239 | + | ||
240 | + | ||
241 | +router.post('/search/:target', function(req, res, next) { | ||
242 | + user_id = req.params.id; | ||
243 | + let cur = req.params.cur; | ||
244 | + folders = {} | ||
245 | + let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;'; | ||
246 | + connection.query(checkfolder, [cur, user_id], function(err, rows, fields) { | ||
247 | + if (rows.length != 0) { | ||
248 | + res.status(200).send({ | ||
249 | + folders: folders | ||
250 | + }) | ||
251 | + } else { | ||
252 | + res.send({ error: "Does not exist" }); | ||
253 | + } | ||
254 | + }); | ||
255 | +}); | ||
256 | + | ||
257 | +module.exports = router; | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
... | @@ -7,15 +7,24 @@ const instance = axios.create({ | ... | @@ -7,15 +7,24 @@ const instance = axios.create({ |
7 | function registerUser(userData) { | 7 | function registerUser(userData) { |
8 | // const url = 'http://localhost:3000/api/signup' | 8 | // const url = 'http://localhost:3000/api/signup' |
9 | return axios.post('/api/RegistUser', userData); | 9 | return axios.post('/api/RegistUser', userData); |
10 | - } | 10 | +} |
11 | 11 | ||
12 | - function loginUser(userData) { | 12 | +function loginUser(userData) { |
13 | // const url = 'http://localhost:3000/api/login' | 13 | // const url = 'http://localhost:3000/api/login' |
14 | return axios.post('/api/login', userData); | 14 | return axios.post('/api/login', userData); |
15 | +} | ||
16 | + | ||
17 | +function folder(curData) { | ||
18 | + return axios.get('/api/folder/show', { | ||
19 | + params: { | ||
20 | + id: curData.id, | ||
21 | + cur: curData.cur | ||
15 | } | 22 | } |
23 | + }); | ||
24 | +} | ||
16 | 25 | ||
17 | -function dropbox(userData){ | 26 | +function makeFolder(folderData) { |
18 | - return axios.get('/api/dropbox', userData); | 27 | + return axios.post('/api/folder/makefolder', folderData); |
19 | } | 28 | } |
20 | 29 | ||
21 | - export { registerUser, loginUser, dropbox }; | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
30 | +export { registerUser, loginUser, folder, makeFolder }; | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -12,10 +12,8 @@ | ... | @@ -12,10 +12,8 @@ |
12 | hide-details | 12 | hide-details |
13 | ></v-text-field> | 13 | ></v-text-field> |
14 | </v-toolbar> | 14 | </v-toolbar> |
15 | - | ||
16 | <v-list two-line subheader> | 15 | <v-list two-line subheader> |
17 | <v-subheader inset>Folders</v-subheader> | 16 | <v-subheader inset>Folders</v-subheader> |
18 | - | ||
19 | <v-list-item | 17 | <v-list-item |
20 | v-for="item in this.$store.getters.folderL" | 18 | v-for="item in this.$store.getters.folderL" |
21 | :key="item.title" | 19 | :key="item.title" |
... | @@ -24,35 +22,28 @@ | ... | @@ -24,35 +22,28 @@ |
24 | <v-list-item-avatar> | 22 | <v-list-item-avatar> |
25 | <v-icon>mdi-folder</v-icon> | 23 | <v-icon>mdi-folder</v-icon> |
26 | </v-list-item-avatar> | 24 | </v-list-item-avatar> |
27 | - | ||
28 | <v-list-item-content> | 25 | <v-list-item-content> |
29 | - <v-list-item-title v-text="item"></v-list-item-title> | 26 | + <v-list-item-title v-text="item.folder_name"></v-list-item-title> |
30 | </v-list-item-content> | 27 | </v-list-item-content> |
31 | - | ||
32 | <v-list-item-action> | 28 | <v-list-item-action> |
33 | <v-btn icon> | 29 | <v-btn icon> |
34 | <v-icon color="grey lighten-1">mdi-information</v-icon> | 30 | <v-icon color="grey lighten-1">mdi-information</v-icon> |
35 | </v-btn> | 31 | </v-btn> |
36 | </v-list-item-action> | 32 | </v-list-item-action> |
37 | </v-list-item> | 33 | </v-list-item> |
38 | - | ||
39 | <v-divider inset></v-divider> | 34 | <v-divider inset></v-divider> |
40 | - | ||
41 | <v-subheader inset>Files</v-subheader> | 35 | <v-subheader inset>Files</v-subheader> |
42 | - | ||
43 | <v-list-item | 36 | <v-list-item |
44 | - v-for="item in items2" | 37 | + v-for="item in this.$store.getters.fileL" |
45 | :key="item.title" | 38 | :key="item.title" |
46 | @click="" | 39 | @click="" |
47 | > | 40 | > |
48 | <v-list-item-avatar> | 41 | <v-list-item-avatar> |
49 | <v-icon> mdi-file</v-icon> | 42 | <v-icon> mdi-file</v-icon> |
50 | </v-list-item-avatar> | 43 | </v-list-item-avatar> |
51 | - | ||
52 | <v-list-item-content> | 44 | <v-list-item-content> |
53 | <v-list-item-title v-text="item"></v-list-item-title> | 45 | <v-list-item-title v-text="item"></v-list-item-title> |
54 | </v-list-item-content> | 46 | </v-list-item-content> |
55 | - | ||
56 | <v-list-item-action> | 47 | <v-list-item-action> |
57 | <v-btn icon> | 48 | <v-btn icon> |
58 | <v-icon color="grey lighten-1">mdi-information</v-icon> | 49 | <v-icon color="grey lighten-1">mdi-information</v-icon> |
... | @@ -81,7 +72,6 @@ | ... | @@ -81,7 +72,6 @@ |
81 | > | 72 | > |
82 | {{ text }} | 73 | {{ text }} |
83 | </v-chip> | 74 | </v-chip> |
84 | - | ||
85 | <span | 75 | <span |
86 | v-else-if="index === 2" | 76 | v-else-if="index === 2" |
87 | class="overline grey--text text--darken-3 mx-2" | 77 | class="overline grey--text text--darken-3 mx-2" |
... | @@ -90,44 +80,98 @@ | ... | @@ -90,44 +80,98 @@ |
90 | </span> | 80 | </span> |
91 | </template> | 81 | </template> |
92 | </v-file-input> | 82 | </v-file-input> |
83 | + <v-btn | ||
84 | + bottom | ||
85 | + color="blue" | ||
86 | + dark | ||
87 | + fab | ||
88 | + fixed | ||
89 | + right | ||
90 | + @click="dialog = !dialog" | ||
91 | + > | ||
92 | + <v-icon>mdi-plus</v-icon> | ||
93 | + </v-btn> | ||
94 | + <v-dialog | ||
95 | + v-model="dialog" | ||
96 | + width="800px" | ||
97 | + > | ||
98 | + <v-card> | ||
99 | + <v-card-title class="grey darken-2"> | ||
100 | + Create Folder | ||
101 | + </v-card-title> | ||
102 | + <v-container> | ||
103 | + <div> | ||
104 | + <v-icon>mdi-folder</v-icon> | ||
105 | + <v-text-field placeholder="name" id="foldername" type="text" v-model="foldername"></v-text-field> | ||
106 | + </div> | ||
107 | + </v-container> | ||
108 | + <v-card-actions> | ||
109 | + <v-spacer></v-spacer> | ||
110 | + <v-btn | ||
111 | + text | ||
112 | + color="primary" | ||
113 | + @click="dialog = false" | ||
114 | + >Cancel</v-btn> | ||
115 | + <v-btn | ||
116 | + text | ||
117 | + @click="makeF" | ||
118 | + >Create</v-btn> | ||
119 | + </v-card-actions> | ||
120 | + </v-card> | ||
121 | + </v-dialog> | ||
93 | </div> | 122 | </div> |
94 | </template> | 123 | </template> |
95 | 124 | ||
96 | <script> | 125 | <script> |
97 | -import { dropbox } from '../api/index'; | 126 | +import { folder, makeFolder } from '../api/index'; |
98 | export default { | 127 | export default { |
99 | data() { | 128 | data() { |
100 | return { | 129 | return { |
130 | + foldername:'', | ||
101 | folders: [], | 131 | folders: [], |
102 | files: [], | 132 | files: [], |
103 | search:'', | 133 | search:'', |
134 | + dialog:false | ||
104 | } | 135 | } |
105 | }, | 136 | }, |
106 | async created(){ | 137 | async created(){ |
107 | try { | 138 | try { |
108 | - const userData = { | 139 | + const curData = { |
109 | - user_id: this.$store.getters.userId, | 140 | + id : this.$store.state.id, |
110 | - cur: '/', | 141 | + cur: this.$store.state.cur |
142 | + } | ||
143 | + const response = await folder(curData); | ||
144 | + console.log(response); | ||
145 | + this.$store.commit('setFolder', response.data.folders); | ||
146 | + } catch (error) { | ||
147 | + console.log("에러"); | ||
148 | + console.log(error.response.data); | ||
149 | + } | ||
150 | + }, | ||
151 | + methods: { | ||
152 | + initFolderName(){ | ||
153 | + this.foldername = ''; | ||
154 | + }, | ||
155 | + async makeF(){ | ||
156 | + try { | ||
157 | + const folderData = { | ||
158 | + user_id : this.$store.state.id, | ||
159 | + cur : this.$store.state.cur, | ||
160 | + folder_name : this.foldername | ||
111 | }; | 161 | }; |
112 | - const { data } = await dropbox(userData); | 162 | + const response = await makeFolder(folderData); |
113 | - console.log(data); | 163 | + console.log(response.data) |
114 | - this.$store.commit('setFolder', data.folders); | 164 | + console.log("폴더 생성 완료"); |
115 | - this.$store.commit('setFile', data.files); | 165 | + this.$store.commit('setFolder', response.data.folders); |
116 | } catch (error) { | 166 | } catch (error) { |
117 | console.log("에러"); | 167 | console.log("에러"); |
118 | console.log(error.response.data); | 168 | console.log(error.response.data); |
169 | + } finally{ | ||
170 | + this.initFolderName(); | ||
171 | + this.dialog = false; | ||
172 | + } | ||
119 | } | 173 | } |
174 | + | ||
120 | } | 175 | } |
121 | - // data: () => ({ | ||
122 | - // items: [ | ||
123 | - // { icon: 'folder', iconClass: 'mdi-folder', title: 'Photos', subtitle: 'Jan 9, 2014' }, | ||
124 | - // { icon: 'folder', iconClass: 'mdi-folder', title: 'Recipes', subtitle: 'Jan 17, 2014' }, | ||
125 | - // { icon: 'folder', iconClass: 'mdi-folder', title: 'Work', subtitle: 'Jan 28, 2014' }, | ||
126 | - // ], | ||
127 | - // items2: [ | ||
128 | - // { icon: 'assignment', iconClass: 'mdi-file', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' }, | ||
129 | - // { icon: 'call_to_action', iconClass: 'mdi-PdfBox', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' }, | ||
130 | - // ], | ||
131 | - // }), | ||
132 | } | 176 | } |
133 | </script> | 177 | </script> | ... | ... |
... | @@ -132,112 +132,6 @@ | ... | @@ -132,112 +132,6 @@ |
132 | <router-view></router-view> | 132 | <router-view></router-view> |
133 | </v-container> | 133 | </v-container> |
134 | </v-content> | 134 | </v-content> |
135 | - <template v-if="isUserLogin"> | ||
136 | - <v-btn | ||
137 | - bottom | ||
138 | - color="pink" | ||
139 | - dark | ||
140 | - fab | ||
141 | - fixed | ||
142 | - right | ||
143 | - @click="dialog = !dialog" | ||
144 | - > | ||
145 | - <v-icon>mdi-plus</v-icon> | ||
146 | - </v-btn> | ||
147 | - </template> | ||
148 | - <!-- <v-btn | ||
149 | - bottom | ||
150 | - color="pink" | ||
151 | - dark | ||
152 | - fab | ||
153 | - fixed | ||
154 | - right | ||
155 | - @click="dialog = !dialog" | ||
156 | - > | ||
157 | - <v-icon>mdi-plus</v-icon> | ||
158 | - </v-btn> --> | ||
159 | - <v-dialog | ||
160 | - v-model="dialog" | ||
161 | - width="800px" | ||
162 | - > | ||
163 | - <v-card> | ||
164 | - <v-card-title class="grey darken-2"> | ||
165 | - Create contact | ||
166 | - </v-card-title> | ||
167 | - <v-container> | ||
168 | - <v-row class="mx-2"> | ||
169 | - <v-col | ||
170 | - class="align-center justify-space-between" | ||
171 | - cols="12" | ||
172 | - > | ||
173 | - <v-row | ||
174 | - align="center" | ||
175 | - class="mr-0" | ||
176 | - > | ||
177 | - <v-avatar | ||
178 | - size="40px" | ||
179 | - class="mx-3" | ||
180 | - > | ||
181 | - <img | ||
182 | - src="//ssl.gstatic.com/s2/oz/images/sge/grey_silhouette.png" | ||
183 | - alt="" | ||
184 | - > | ||
185 | - </v-avatar> | ||
186 | - <v-text-field | ||
187 | - placeholder="Name" | ||
188 | - ></v-text-field> | ||
189 | - </v-row> | ||
190 | - </v-col> | ||
191 | - <v-col cols="6"> | ||
192 | - <v-text-field | ||
193 | - prepend-icon="mdi-account-card-details-outline" | ||
194 | - placeholder="Company" | ||
195 | - ></v-text-field> | ||
196 | - </v-col> | ||
197 | - <v-col cols="6"> | ||
198 | - <v-text-field | ||
199 | - placeholder="Job title" | ||
200 | - ></v-text-field> | ||
201 | - </v-col> | ||
202 | - <v-col cols="12"> | ||
203 | - <v-text-field | ||
204 | - prepend-icon="mdi-mail" | ||
205 | - placeholder="Email" | ||
206 | - ></v-text-field> | ||
207 | - </v-col> | ||
208 | - <v-col cols="12"> | ||
209 | - <v-text-field | ||
210 | - type="tel" | ||
211 | - prepend-icon="mdi-phone" | ||
212 | - placeholder="(000) 000 - 0000" | ||
213 | - ></v-text-field> | ||
214 | - </v-col> | ||
215 | - <v-col cols="12"> | ||
216 | - <v-text-field | ||
217 | - prepend-icon="mdi-text" | ||
218 | - placeholder="Notes" | ||
219 | - ></v-text-field> | ||
220 | - </v-col> | ||
221 | - </v-row> | ||
222 | - </v-container> | ||
223 | - <v-card-actions> | ||
224 | - <v-btn | ||
225 | - text | ||
226 | - color="primary" | ||
227 | - >More</v-btn> | ||
228 | - <v-spacer></v-spacer> | ||
229 | - <v-btn | ||
230 | - text | ||
231 | - color="primary" | ||
232 | - @click="dialog = false" | ||
233 | - >Cancel</v-btn> | ||
234 | - <v-btn | ||
235 | - text | ||
236 | - @click="dialog = false" | ||
237 | - >Save</v-btn> | ||
238 | - </v-card-actions> | ||
239 | - </v-card> | ||
240 | - </v-dialog> | ||
241 | </v-app> | 135 | </v-app> |
242 | </template> | 136 | </template> |
243 | 137 | ... | ... |
... | @@ -6,35 +6,42 @@ Vue.use(Vuex) | ... | @@ -6,35 +6,42 @@ 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 | }, | 12 | }, |
12 | mutations: { | 13 | mutations: { |
13 | - setId(state, userid){ | 14 | + setId(state, userid) { |
14 | state.id = userid; | 15 | state.id = userid; |
15 | }, | 16 | }, |
16 | - clearid(state){ | 17 | + clearid(state) { |
17 | - state.id= ''; | 18 | + state.id = ''; |
18 | }, | 19 | }, |
19 | - setFolder(state, folderlist){ | 20 | + setFolder(state, folderlist) { |
20 | state.folders = folderlist; | 21 | state.folders = folderlist; |
21 | }, | 22 | }, |
22 | - setFile(state, filelist){ | 23 | + setFile(state, filelist) { |
23 | - state.files = fileList; | 24 | + state.files = filelist; |
25 | + }, | ||
26 | + setCur(state, cur) { | ||
27 | + state.cur = cur; | ||
24 | } | 28 | } |
25 | }, | 29 | }, |
26 | getters: { | 30 | getters: { |
27 | - isLogin(state){ | 31 | + isLogin(state) { |
28 | return state.id !== ''; | 32 | return state.id !== ''; |
29 | }, | 33 | }, |
30 | - userID(state){ | 34 | + userID(state) { |
31 | return state.id; | 35 | return state.id; |
32 | }, | 36 | }, |
33 | - folderL(state){ | 37 | + folderL(state) { |
34 | return state.folders; | 38 | return state.folders; |
35 | }, | 39 | }, |
36 | - fileL(state){ | 40 | + fileL(state) { |
37 | return state.files; | 41 | return state.files; |
42 | + }, | ||
43 | + cur(state) { | ||
44 | + return state.cur; | ||
38 | } | 45 | } |
39 | } | 46 | } |
40 | }) | 47 | }) |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or login to post a comment