2020-1-CloudComputing / D_Team_Khuloud

Go to a project
Toggle navigation Toggle navigation pinning
최동원
e7872c9d 2 parents 4e06117e efb26497

Merge branch 'share,favorite' into 'master' 

Share,favorite



See merge request !1
Inline Side-by-side
Showing 46 changed files with 4372 additions and 1327 deletions
......@@ -113,4 +113,7 @@ dist
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*
\ No newline at end of file
.pnp.*
backend/routes/modules/s3/download/*
backend/routes/modules/awsconfig.json
......
......@@ -12,7 +12,10 @@ var registerRouter = require('./routes/userlogin/register');
var fileRouter = require('./routes/file/router');
//var trashcanRouter = require('./routes/trashcan/router');
var folderRouter = require('./routes/folders');
var contactRouter = require('./routes/contact')
var quickRouter = require('./routes/quick');
var favoritesRouter = require('./routes/favorites');
var shareRouter = require('./routes/share');
var trashcanRouter = require('./routes/trashcan');
var passport = require('passport');
......@@ -60,10 +63,12 @@ app.use('/api/user', userRouter);
app.use('/api/login', loginRouter);
app.use('/api/RegistUser', registerRouter);
app.use('/api/folder', folderRouter);
app.use('/api/favorites', favoritesRouter);
app.use('/api/share', shareRouter);
app.use('/api/trashcan', trashcanRouter);
//app.use('/users', usersRouter);
app.use('/api/file', fileRouter);
app.use('/api/contact',contactRouter);
//app.use('/api/trashcan', trashcanRouter);
app.use('/api/quick', quickRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
......@@ -81,4 +86,4 @@ app.use(function(err, req, res, next) {
res.render('error');
});
module.exports = app;
module.exports = app;
\ No newline at end of file
......
const express = require('express');
const router = express.Router();
router.get('/show', function(req, res, next) {
console.log(req.query);
user_id = req.query.id;
let checkfolder = 'SELECT * FROM folders WHERE user_id = ? AND favorite = 1;';
let checkfiles = 'SELECT * FROM files WHERE user_id = ? AND favorite = 1;';
connection.query(checkfolder, [user_id], function(err, folder, fields) {
if (err) {
console.log('select error');
res.status(404).send();
} else {
connection.query(checkfiles, [user_id], function(err, file, fields) {
if (err) {
console.log('select error');
res.status(404).send();
} else {
res.status(200).send({
folders: folder,
files: file
});
}
});
}
});
});
router.post('/addfolder', function(req, res, next) {
let user_id = req.body.id;
let folder_name = req.body.name;
let cur = req.body.cur;
console.log(req.body);
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name = ? AND favorite = 1;';
connection.query(checkfolder, [cur, user_id, folder_name], function(err, rows, fields) {
if (err) {
console.log('select error');
res.status(400).send({ error: err });
} else {
if (rows.length == 0) {
let sql = 'UPDATE folders SET favorite = 1 WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(sql, [cur, folder_name, user_id], function(err, result, fields) {
if (err) {
console.log('update error');
res.status(400).send({ error: err });
} else {
let getfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name != ?;';
connection.query(getfolder, [cur, user_id, 'trashcan'], function(err, folders, fields) {
res.status(200).send({
folders: folders
})
});
}
});
} else {
console.log('already exist error');
res.status(400).send({ error: err });
}
}
});
});
router.post('/addfile', function(req, res, next) {
let user_id = req.body.id;
let file_name = req.body.name;
let cur = req.body.cur;
console.log(req.body);
let checkfolder = 'SELECT * FROM files WHERE location = ? AND user_id = ? AND file_name = ? AND favorite = 1;';
connection.query(checkfolder, [cur, user_id, file_name], function(err, rows, fields) {
if (err) {
console.log('select error');
res.status(400).send({ error: err });
} else {
if (rows.length == 0) {
let sql = 'UPDATE files SET favorite = 1 WHERE location = ? AND file_name = ? AND user_id = ?;';
connection.query(sql, [cur, file_name, user_id], function(err, result, fields) {
if (err) {
console.log('update error');
res.status(400).send({ error: err });
} else {
let getfolder = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(getfolder, [cur, user_id], function(err, files, fields) {
res.status(200).send({
files: files
})
});
}
});
} else {
console.log('already exist error');
res.status(400).send({ error: err });
}
}
});
});
router.post('/delfolder', function(req, res, next) {
let user_id = req.body.id;
let folder_name = req.body.name;
let cur = req.body.cur;
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name = ? AND favorite = 1;';
connection.query(checkfolder, [cur, user_id, folder_name], function(err, rows, fields) {
if (err) {
console.log('select error');
res.status(400).send({ error: err });
} else {
if (rows.length != 0) {
let sql = 'UPDATE folders SET favorite = 0 WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(sql, [cur, folder_name, user_id], function(err, result, fields) {
if (err) {
console.log('update error');
res.status(400).send({ error: err });
} else {
let getfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name != ?;';
connection.query(getfolder, [cur, user_id, 'trashcan'], function(err, folders, fields) {
res.status(200).send({
folders: folders
})
});
}
});
} else {
console.log('dont exist error');
res.status(400).send({ error: err });
}
}
});
});
router.post('/delfile', function(req, res, next) {
let user_id = req.body.id;
let file_name = req.body.name;
let cur = req.body.cur;
let checkfile = 'SELECT * FROM files WHERE location = ? AND user_id = ? AND file_name = ? AND favorite = 1;';
connection.query(checkfile, [cur, user_id, file_name], function(err, rows, fields) {
if (err) {
console.log('select error');
res.status(400).send({ error: err });
} else {
if (rows.length != 0) {
let sql = 'UPDATE files SET favorite = 0 WHERE location = ? AND file_name = ? AND user_id = ?;';
connection.query(sql, [cur, file_name, user_id], function(err, result, fields) {
if (err) {
console.log('update error');
res.status(400).send({ error: err });
} else {
let getfile = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(getfile, [cur, user_id], function(err, files, fields) {
res.status(200).send({
files: files
})
});
}
});
} else {
console.log('dont exist error');
res.status(400).send({ error: err });
}
}
});
});
module.exports = router;
\ No newline at end of file
......@@ -7,7 +7,9 @@ var S3 = require('../modules/s3/s3');
// /file/delete/:name
router.get('/:name', function (req, res) {
router.get('/:name', function(req, res) {
console.log(req.query);
console.log(req.params);
var file_name = req.params.name;
var user_id = req.query.id;
var curPath = req.query.cur;
......@@ -15,32 +17,56 @@ router.get('/:name', function (req, res) {
var targetPath = 'trashcan';
var sourceFile = curPath.substring(1) + file_name;
var sql1 = 'DELETE FROM files WHERE file_name = (?) AND location=(?) AND user_Id = (?)';
var sql2 = 'INSERT INTO trashcan (trash_name, location, user_Id) VALUES (?, ?, ?)';
connection.query(sql1, [file_name, curPath, user_id], function (err) {
var sql1 = 'UPDATE files SET location = ? WHERE location = ? AND file_name = ? AND user_id = ?;';
connection.query(sql1, ['/trashcan/', curPath, file_name, user_id], function(err) {
if (err) {
console.log('delete db error');
res.send({erorr: 'db delete error'});
}
else {
connection.query(sql2, [file_name, '/trashcan'+curPath, user_id], function (err) {
if (err) {
console.log('insert in trashcan db error');
res.send({error: 'db insert error'});
}
else {
// /drive/user_id/sourceFile --> /drive/user_id/trashcan/sourceFile
S3.moveFile2(S3.BUCKET_NAME, user_id, sourceFile, targetPath, function (result) {
if (result) {
res.send("move to trashcan success");
}
})
console.log('update db error');
res.send({ erorr: 'db update error' });
} else {
S3.moveFile2(S3.BUCKET_NAME, user_id, sourceFile, file_name, targetPath, function(result) {
if (result) {
res.send("move to trashcan success");
}
})
}
})
});
// // /file/delete/:name
// router.get('/:name', function (req, res) {
// var file_name = req.params.name;
// var user_id = req.query.id;
// var curPath = req.query.cur;
// var targetPath = 'trashcan';
// var sourceFile = curPath.substring(1) + file_name;
// var sql1 = 'DELETE FROM files WHERE file_name = (?) AND location=(?) AND user_Id = (?)';
// var sql2 = 'INSERT INTO trashcan (trash_name, location, user_Id) VALUES (?, ?, ?)';
// connection.query(sql1, [file_name, curPath, user_id], function (err) {
// if (err) {
// console.log('delete db error');
// res.send({erorr: 'db delete error'});
// }
// else {
// connection.query(sql2, [file_name, '/trashcan'+curPath, user_id], function (err) {
// if (err) {
// console.log('insert in trashcan db error');
// res.send({error: 'db insert error'});
// }
// else {
// // /drive/user_id/sourceFile --> /drive/user_id/trashcan/sourceFile
// S3.moveFile2(S3.BUCKET_NAME, user_id, sourceFile, targetPath, function (result) {
// if (result) {
// res.send("move to trashcan success");
// }
// })
// }
// })
// }
// })
// });
module.exports = router;
\ No newline at end of file
......
......@@ -2,6 +2,7 @@ var express = require('express');
var router = express.Router();
var fs = require('fs');
var moment = require('moment');
var AWS = require('aws-sdk');
AWS.config.loadFromPath(__dirname + "/../modules/awsconfig.json");
......@@ -19,7 +20,14 @@ router.get('/:name', function (req, res) {
S3.downloadFile3(S3.BUCKET_NAME, user_id, targetFile, function (result, downloadDir) {
if (result) {
res.send({ src: downloadDir })
var sql = 'UPDATE files SET recent_access=(?) WHERE user_id=(?) AND location=(?) AND file_name=(?)';
connection.query(sql, [moment().format(), user_id, curPath, file_name], function(err){
if (err){
res.send({err: 'update error'});
}else{
res.send({ src: downloadDir })
}
})
}else{
res.send({ err: 'download error'})
}
......
......@@ -9,42 +9,50 @@ var fs = require('fs');
// /file
router.get('/', function (req, res) {
router.get('/', function(req, res) {
console.log(req.query);
var user_id = req.query.id;
var curPath = req.query.cur; // /folder1/folder2/
var curPath = req.query.cur; // /folder1/folder2/
var sql = 'SELECT * FROM files WHERE user_id=(?) AND location=(?) ORDER BY date DESC';
connection.query(sql, [user_id, curPath], function (err, result) {
if (err){
res.send({error: 'select error'});
}else{
connection.query(sql, [user_id, curPath], function(err, result) {
if (err) {
res.send({ error: 'select error' });
} else {
res.status(200).send({files: result});
res.status(200).send({ files: result });
}
})
});
router.get('/:name', function (req, res) {
router.get('/:name', function(req, res) {
var file_name = req.params.name;
var curPath = req.query.cur; // /folder1/folder2/
var curPath = req.query.cur; // /folder1/folder2/
var user_id = req.query.id;
var targetFile = curPath.substring(1) + file_name; // folder1/folder2/test.txt
var targetFile = curPath.substring(1) + file_name; // folder1/folder2/test.txt
var extension = targetFile.split('.')[1].toLowerCase();
S3.downloadFile3(S3.BUCKET_NAME, user_id, targetFile, function(result, downloadDir){
if (result){
if (extension == 'jpg' || extension == 'jpeg' || extension == 'png') {
res.status(200).send({ type: 'image', src: downloadDir})
}else{
res.status(200).send({type: 'text', src: downloadDir})
}
S3.downloadFile2(S3.BUCKET_NAME, user_id, targetFile, function(result, downloadDir) {
if (result) {
var content;
content = fs.readFileSync(downloadDir, 'utf8');
res.send({ file_name: file_name, content: content });
//if (extension == 'jpg' || extension == 'jpeg' || extension == 'png') {
// res.send({ type: 'image', src: downloadDir})
//}else{
// var content;
// content = fs.readFileSync(downloadDir, 'utf8');
// res.send({file_name: file_name, content: content});
// //res.status(200).send({type: 'text', src: downloadDir})
//}
}
})
});
});
module.exports = router;
\ No newline at end of file
......
var express = require('express');
var router = express.Router();
var AWS = require('aws-sdk');
AWS.config.loadFromPath(__dirname + "/../modules/awsconfig.json");
var S3 = require('../modules/s3/s3');
var fs = require('fs');
var moment = require('moment');
// /file/modify/:name
router.post('/:name', function(req, res){
var user_id = req.body.user_id;
var curPath = req.body.cur; // /folder1/folder2/
var file_name = req.params.name;
var modified_name = req.body.name;
var modified_content = req.body.content;
var targetPath;
if (curPath == '/') {
targetPath = '';
} else {
targetPath = curPath.substring(1, curPaht.length-1); // folder1/folder2
}
var originalDir = __dirname + '/../modules/s3/download/' + user_id + curPath + file_name;
var tempDownloadDir;
// 파일 이름 변경
S3.renameFile(S3.BUCKET_NAME, user_id, file_name, modified_name, targetPath, function(result, r_modified_name){
if (result){
modified_name = r_modified_name;
tempDownloadDir = __dirname + '/../modules/s3/download/' + user_id + curPath + modified_name;
fs.unlink(originalDir, function(err){
if (err){
console.log(err);
res.send({error: 'original file not exists in server'});
}else{
// 파일 내용 변경
fs.writeFileSync(tempDownloadDir, modified_content);
S3.coverFile(S3.BUCKET_NAME, user_id, modified_name, targetPath, tempDownloadDir, function (result) {
if (result) {
var sql = 'UPDATE files SET file_name=(?), updated=(?), recent_access=(?) WHERE user_id=(?) AND location=(?) AND file_name=(?)';
connection.query(sql, [modified_name, moment().format(), moment().format(), user_id, curPath, file_name], function (err) {
if (err) {
console.log(err);
res.send({ error: 'update error' });
} else {
fs.unlinkSync(tempDownloadDir);
res.send('modify file success');
}
})
} else {
res.send({ error: 'modify file failed' });
}
})
}
});
}else{
res.send({error: 'rename error'});
}
})
});
module.exports = router;
\ No newline at end of file
......@@ -6,12 +6,14 @@ var files = require('./files');
var uploadFile = require('./uploadFile');
var downloadFile = require('./downloadFile');
var deleteFile = require('./deleteFile');
var modifyFile = require('./modifyFile');
router.use('/', files);
router.use('/upload', uploadFile);
router.use('/download', downloadFile);
router.use('/delete', deleteFile);
router.use('/modify', modifyFile);
module.exports = router;
\ No newline at end of file
......
......@@ -2,6 +2,7 @@ var express = require('express');
var router = express.Router();
var formidable = require('formidable');
var moment = require('moment');
var AWS = require('aws-sdk');
AWS.config.loadFromPath(__dirname + "/../modules/awsconfig.json");
......@@ -43,6 +44,7 @@ router.post('/', function (req, res) {
}else{
sourceFiles.push(files.file.name);
bodies.push(files.file.path);
console.log('bodies', bodies);
}
}else{
for (var file of files.file) { // 파일 여러개일 때
......@@ -65,8 +67,8 @@ router.post('/', function (req, res) {
}
}
for (var sourceFile of noErrSourceFiles) {
var sql = 'INSERT INTO files (file_name, user_id, location) VALUES (?, ?, ?)';
connection.query(sql, [sourceFile, user_id, curPath], function (err, result) {
var sql = 'INSERT INTO files (file_name, user_id, location, recent_access) VALUES (?, ?, ?, ?)';
connection.query(sql, [sourceFile, user_id, curPath, moment().format()], function (err, result) {
if (err) {
console.log('insert error');
res.send({error: 'insert error'});
......
......@@ -2,49 +2,111 @@ const express = require('express');
const router = express.Router();
const AWS = require("aws-sdk");
const moment = require("moment");
AWS.config.loadFromPath(__dirname + "/modules/awsconfig.json");
const BUCKET_NAME = "hong-s3-cloud";
let curPath = "";
let user_id = "";
let parentPath = "";
const s3 = new AWS.S3({
accessKeyId: process.env.AWS_ACCESS_KEY_ID,
secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY,
region: "ap-northeast-2"
});
const s3 = new AWS.S3();
// router.get('/show', function(req, res, next) {
// console.log(req.query);
// user_id = req.query.id;
// curPath = req.query.cur;
// if (curPath == '/') {
// parentPath = '/';
// } else {
// let pathSplit = curPath.split('/')
// console.log(pathSplit);
// parentPath = '/';
// for (let i = 1; i < pathSplit.length - 2; i++) {
// parentPath += pathSplit[i];
// parentPath += '/';
// }
// }
// let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
// connection.query(checkfolder, [curPath, user_id], function(err, rows, fields) {
// if (err) {
// console.log('select error');
// res.status(400).send({ err: err });
// } else {
// res.status(200).send({
// folders: rows,
// cur: curPath,
// parentPath: parentPath
// })
// }
// });
// });
router.get('/show', function(req, res, next) {
console.log(req.query);
user_id = req.query.id;
curPath = req.query.cur;
if (curPath == '/') {
parentPath = '/';
folder_id = req.query.folder_id;
if (folder_id == -1) {
let location = '/';
let gerFolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name != ?;';
connection.query(gerFolder, [location, user_id, 'trashcan'], function(err, folder) {
if (err) {
console.log('select2 error');
res.status(400).send({ err: err });
} else {
let gerFile = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(gerFile, [location, user_id], function(err, file) {
if (err) {
console.log('select3 error');
res.status(400).send({ err: err });
} else {
res.status(200).send({
folders: folder,
files: file,
cur: location
});
}
});
}
});
} else {
let pathSplit = curPath.split('/')
console.log(pathSplit);
parentPath = '/';
for (let i = 1; i < pathSplit.length - 2; i++) {
parentPath += pathSplit[i];
parentPath += '/';
}
let checkfolder = 'SELECT * FROM folders WHERE folder_id = ? AND user_id = ?;';
connection.query(checkfolder, [folder_id, user_id], function(err, rows) {
if (err) {
console.log('select1 error');
res.status(400).send({ err: err });
} else {
if (rows.length == 0) {
console.log('does not exist');
res.status(400).send({ err: 'does not exist' });
} else {
let location = rows[0].location + rows[0].folder_name + '/';
let gerFolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name != ?;';
connection.query(gerFolder, [location, user_id, 'trashcan'], function(err, folder) {
if (err) {
console.log('select2 error');
res.status(400).send({ err: err });
} else {
let gerFile = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(gerFile, [location, user_id], function(err, file) {
if (err) {
console.log('select3 error');
res.status(400).send({ err: err });
} else {
res.status(200).send({
folders: folder,
files: file,
cur: location
});
}
});
}
});
}
}
});
}
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(checkfolder, [curPath, user_id], function(err, rows, fields) {
if (err) {
console.log('select error');
res.status(404).send()
} else {
res.status(200).send({
folders: rows,
cur: curPath,
parentPath: parentPath
})
}
});
});
router.post('/makefolder', function(req, res, next) {
user_id = req.body.user_id;
......@@ -54,7 +116,7 @@ router.post('/makefolder', function(req, res, next) {
let date = moment().format();
let params = {
Bucket: BUCKET_NAME,
Key: curPath + folder_name + '/',
Key: 'drive/' + curPath + folder_name + '/',
Body: "",
ACL: "public-read-write"
};
......@@ -62,13 +124,13 @@ router.post('/makefolder', function(req, res, next) {
console.log(req.body)
connection.query(checksql, [cur, folder_name], function(err, rows, fields) {
if (err) {
res.status(400).send({ err: err });
} else {
if (rows.length == 0) {
s3.putObject(params, function(err, data) {
if (err) {
console.log('s3 error');
throw err;
res.status(400).send({ err: err });
} else {
console.log(data);
let sql = 'INSERT INTO folders (folder_name,location,user_id,created) values (?,?,?,?);';
......@@ -76,10 +138,10 @@ router.post('/makefolder', function(req, res, next) {
connection.query(sql, values, function(err, result, field) {
if (err) {
console.log('insert error');
throw err;
res.status(400).send({ err: err });
} else {
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(checkfolder, [cur, user_id], function(err, rows, fields) {
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name != ?;';
connection.query(checkfolder, [cur, user_id, 'trashcan'], function(err, rows, fields) {
console.log(rows);
res.status(200).send({
folders: rows
......@@ -98,50 +160,59 @@ router.post('/makefolder', function(req, res, next) {
router.post('/delfolder', function(req, res, next) {
console.log(req.body);
user_id = req.body.id;
let cur = req.body.cur;
curPath = user_id + cur;
let folder_name = req.body.folder_name;
let params = {
Bucket: BUCKET_NAME,
Key: curPath + folder_name + '/'
};
let checksql = 'SELECT * FROM folders WHERE location = ? AND folder_name = ? AND user_id = ?;';
let values = [cur, folder_name, user_id];
connection.query(checksql, values, function(err, rows, fields) {
if (err) {
res.status(404).send({ error: "error" });
let name = req.body.folder_name;
let newPath = user_id + '/trashcan/';
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(checkfolder, [cur, name, user_id], function(err1, rows, fields) {
console.log(rows);
if (rows.length != 0) {
let copy_params = {
Bucket: BUCKET_NAME,
CopySource: BUCKET_NAME + '/drive/' + curPath + name + '/',
Key: 'drive/' + newPath + name + '/'
};
let del_params = {
Bucket: BUCKET_NAME,
Key: 'drive/' + curPath + name + '/'
};
s3.copyObject(copy_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("copy error");
res.status(304).send({ error: "copy error" });
} else {
s3.deleteObject(del_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("delete error");
res.status(304).send({ error: "delete error" });
} else {
let values = ['/trashcan/', cur, name, user_id];
let updatesql = 'UPDATE folders SET location = ? WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(updatesql, values, function(err3, result, field) {
if (err3) {
console.log("updatesql error");
res.status(304).send({ error: "updatesql error" });
} else {
let resultsql = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name != ?;';
connection.query(resultsql, [cur, user_id, 'trashcan'], function(err, rows, fields) {
res.status(200).send({
folders: rows
});
});
}
});
}
});
}
});
} else {
if (rows.length != 0) {
s3.deleteObject(params, function(err, data) {
if (err) {
console.log('s3 error');
//throw err;
} else {
console.log(data);
let sql = 'DELETE FROM folders WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(sql, values, function(err, result, field) {
if (err) {
//throw err;
} else {
console.log(cur);
console.log(user_id);
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(checkfolder, [cur, user_id], function(err, rows, fields) {
res.status(200).send({
folders: rows
})
});
}
});
}
});
} else {
console.log(req.body);
res.status(304).send({ error: "Does not exist" });
}
console.log("Does not exist folder");
res.status(304).send({ error: "Does not exist" });
}
});
});
......@@ -152,70 +223,83 @@ router.post('/move', function(req, res, next) {
user_id = req.body.id;
let cur = req.body.cur;
curPath = user_id + cur;
let name = req.body.folder_name;
let name = req.body.name;
let newPath = user_id + req.body.newPath;
if (req.body.isfolder) {
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(checkfolder, [cur, name, user_id], function(err1, rows, fields) {
console.log(rows);
if (rows.length != 0) {
let copy_params = {
Bucket: BUCKET_NAME,
CopySource: BUCKET_NAME + '/' + curPath + name + '/',
Key: newPath + name + '/'
};
let del_params = {
Bucket: BUCKET_NAME,
Key: curPath + name + '/'
};
s3.copyObject(copy_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("copy error");
res.status(304).send({ error: "copy error" });
} else {
s3.deleteObject(del_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("delete error");
res.status(304).send({ error: "delete error" });
} else {
let values = [req.body.newPath, cur, name, user_id];
let updatesql = 'UPDATE folders SET location = ? WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(updatesql, values, function(err3, result, field) {
if (err3) {
console.log("updatesql error");
res.status(304).send({ error: "updatesql error" });
} else {
let resultsql = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(resultsql, [cur, user_id], function(err, rows, fields) {
res.status(200).send({
folders: rows
});
});
}
});
}
});
}
});
let infolderpath = cur + name + '/';
let checkinfolder = 'SELECT location FROM folders WHERE location = ? AND user_id = ? UNION ALL SELECT location FROM files WHERE location = ? AND user_id = ?;';
connection.query(checkinfolder, [infolderpath, user_id, infolderpath, user_id], function(err, infolder) {
if (err) {
console.log("copy error");
res.status(304).send({ error: "checkinfolder error" });
} else {
console.log("Does not exist");
res.status(304).send({ error: "Does not exist" });
if (infolder.length != 0) {
res.status(204).send({ error: "infolder exist!" })
} else {
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(checkfolder, [cur, name, user_id], function(err1, rows, fields) {
console.log(rows);
if (rows.length != 0) {
let copy_params = {
Bucket: BUCKET_NAME,
CopySource: BUCKET_NAME + '/drive/' + curPath + name + '/',
Key: 'drive/' + newPath + name + '/'
};
let del_params = {
Bucket: BUCKET_NAME,
Key: 'drive/' + curPath + name + '/'
};
s3.copyObject(copy_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("copy error");
res.status(304).send({ error: "copy error" });
} else {
s3.deleteObject(del_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("delete error");
res.status(304).send({ error: "delete error" });
} else {
let values = [req.body.newPath, cur, name, user_id];
let updatesql = 'UPDATE folders SET location = ? WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(updatesql, values, function(err3, result, field) {
if (err3) {
console.log("updatesql error");
res.status(304).send({ error: "updatesql error" });
} else {
let resultsql = 'SELECT * FROM folders WHERE location = ? AND user_id = ? AND folder_name != ?;';
connection.query(resultsql, [cur, user_id, 'trashcan'], function(err, rows, fields) {
res.status(200).send({
folders: rows
});
});
}
});
}
});
}
});
} else {
console.log("Does not exist folder");
res.status(304).send({ error: "Does not exist" });
}
});
}
}
});
} else {
let checkfile = 'SELECT * FROM files WHERE location = ? AND file_name = ? AND user_id = ?';
connection.query(checkfile, [curPath, name, user_id], function(err1, rows, fields) {
let checkfile = 'SELECT * FROM files WHERE location = ? AND file_name = ? AND user_id = ?;';
connection.query(checkfile, [cur, name, user_id], function(err1, rows, fields) {
if (rows.length != 0) {
let copy_params = {
Bucket: BUCKET_NAME,
CopySource: BUCKET_NAME + '/' + curPath + file,
Key: newPath + file
CopySource: BUCKET_NAME + '/drive/' + curPath + name,
Key: 'drive/' + newPath + name
};
let del_params = {
Bucket: BUCKET_NAME,
Key: curPath + file
Key: 'drive/' + curPath + name
};
s3.copyObject(copy_params, function(err, data) {
if (err) {
......@@ -227,16 +311,16 @@ router.post('/move', function(req, res, next) {
console.log(err, data);
res.status(304).send({ error: "delete error" });
} else {
let values = [newPath, cur, name, user_id];
let values = [req.body.newPath, cur, name, user_id];
let updatesql = 'UPDATE files SET location = ? WHERE location = ? AND file_name = ? AND user_id = ?;';
connection.query(updatesql, values, function(err3, result, field) {
if (err3) {
res.status(304).send({ error: "updatesql error" });
} else {
let resultsql = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
let resultsql = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(resultsql, [cur, user_id], function(err, rows, fields) {
res.status(200).send({
folders: rows
files: rows
});
});
}
......@@ -246,6 +330,7 @@ router.post('/move', function(req, res, next) {
}
});
} else {
console.log("Does not exist file");
res.status(304).send({ error: "Does not exist" });
}
});
......@@ -254,20 +339,89 @@ router.post('/move', function(req, res, next) {
});
router.post('/search/:target', function(req, res, next) {
user_id = req.params.id;
let cur = req.params.cur;
folders = {}
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(checkfolder, [cur, user_id], function(err, rows, fields) {
if (rows.length != 0) {
// router.post('/modify', function(req, res, next) {
// console.log(req.body);
// user_id = req.body.id;
// let cur = req.body.cur;
// curPath = user_id + cur;
// let name = req.body.folder_name;
// let newName = req.body.newName;
// let checkfolder = 'SELECT * FROM folders WHERE location = ? AND folder_name = ? AND user_id = ?;';
// connection.query(checkfolder, [cur, name, user_id], function(err1, rows, fields) {
// console.log(rows);
// if (rows.length != 0) {
// let copy_params = {
// Bucket: BUCKET_NAME,
// CopySource: BUCKET_NAME + '/drive/' + curPath + name + '/',
// Key: 'drive/' + curPath + newName + '/'
// };
// let del_params = {
// Bucket: BUCKET_NAME,
// Key: 'drive/' + curPath + name + '/'
// };
// s3.copyObject(copy_params, function(err, data) {
// if (err) {
// console.log(err, data);
// console.log("copy error");
// res.status(304).send({ error: "copy error" });
// } else {
// s3.deleteObject(del_params, function(err, data) {
// if (err) {
// console.log(err, data);
// console.log("delete error");
// res.status(304).send({ error: "delete error" });
// } else {
// let date = moment().format();
// let values = [newName, date, cur, name, user_id];
// let updatesql = 'UPDATE folders SET folder_name = ? AND modify = ? WHERE location = ? AND folder_name = ? AND user_id = ?;';
// connection.query(updatesql, values, function(err3, result, field) {
// if (err3) {
// console.log("updatesql error");
// res.status(304).send({ error: "updatesql error" });
// } else {
// let resultsql = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
// connection.query(resultsql, [cur, user_id], function(err, rows, fields) {
// res.status(200).send({
// folders: rows
// });
// });
// }
// });
// }
// });
// }
// });
// } else {
// console.log("Does not exist");
// res.status(304).send({ error: "Does not exist" });
// }
// });
// });
router.get('/search', function(req, res, next) {
console.log(req.query);
user_id = req.query.id;
let target = connection.escape('%' + req.query.target + '%');
console.log(target);
let folders = []
let files = []
let checkfolder = 'SELECT * FROM folders WHERE folder_name LIKE ' + target + ' AND user_id = ? AND folder_name != ?;';
connection.query(checkfolder, [user_id, 'trashcan'], function(err, folder, fields) {
console.log(folder);
folders.push(folder)
let checkfile = 'SELECT * FROM files WHERE file_name LIKE ' + target + ' AND user_id = ?;';
connection.query(checkfile, [user_id], function(err, file, fields) {
console.log(file);
files.push(file)
res.status(200).send({
folders: folders
folders: folders,
files: files
})
} else {
res.send({ error: "Does not exist" });
}
});
});
});
module.exports = router;
\ No newline at end of file
......
{
"accessKeyId": "ASIAXZL2SWFEYG2GUYVJ",
"secretAccessKey": "ceYvfLs25iiBDfigO7PbP67kJoKswJdfduqROrJt",
"sessionToken": "FwoGZXIvYXdzEDMaDGvezwF9kQrAJ+uhfSLDASWFKBk7UNbRzZVEM1eoGJ3E+UI9d4xSpqEDqRYjsOTn5wYIGM3mUCZ8S6/XCnGP5yFz+qv9mBLDf311iP9ajY091OhQ8c2nB6l+JHuRKAz6FhGLrjHtD1AecHtjHOu5dXODU2+9ctvGj7V60KYqjToah5Tvv84EVac/41Les3rtrqcXS/bbmVwv5kDz9K1FJStln4sXZ/foueGHZAkAJQ6LAtIQWg4/reFUcWAi8E0bUjMckmymDQhnVNWcSbgQ+htBYiiPg+P2BTItOqWuZojM5lw32rTv7+PuOaeyHjx3+Vcd4bo3orSJr57P2ZPfmglZNKY7W5aw",
"region": "us-east-1"
}
"accessKeyId": "",
"secretAccessKey": "",
"sessionToken": "",
"region": "ap-northeast-2"
}
\ No newline at end of file
......
......@@ -13,11 +13,10 @@
// targetFile: folder2/file.txt
var AWS = require('aws-sdk');
AWS.config.update({ region: 'ap-northeast-2' });
var BUCKET_NAME = 'khuloud';
var BUCKET_NAME = 'qkrrlqja-test';
var s3 = new AWS.S3();
var fs = require('fs');
......@@ -73,6 +72,32 @@ var S3 = {
})
},
// 파일 덮어쓰기
coverFile: function(bucketName, userId, sourceFile, targetPath, body, callback) {
var pathbody = fs.createReadStream(body);
if (targetPath != '' && targetPath[targetPath.length - 1] != '/') {
targetPath = targetPath + '/';
}
var targetFile = targetPath + sourceFile;
var coverParams = {
Bucket: bucketName,
Key: 'drive/' + userId + '/' + targetFile,
Body: pathbody
};
s3.upload(coverParams, function (err, data) {
if (err) {
console.log("Cover Error" + err);
callback(false);
} else {
console.log("Cover Success");
callback(true);
}
})
},
deleteFile: function (bucketName, userId, targetFile, callback) {
// targetFile => folder1/folder2/test.txt
var deleteParams = {
......@@ -104,10 +129,8 @@ var S3 = {
console.log("Download File Error", err);
callback(false);
} else {
if (data) {
console.log("Get File Success");
callback(true, data.body.toString());
}
console.log("Get File Success");
callback(true, data.Body.toString());
}
})
},
......@@ -143,10 +166,13 @@ var S3 = {
Key: 'drive/' + userId + '/' + targetFile
};
try {
s3.getObject(params).createReadStream().pipe(file);
callback(true, tempDownloadDir);
var stream = s3.getObject(params).createReadStream().pipe(file);
stream.on('end', function(){
console.log('end!');
callback(true, tempDownloadDir);
});
}catch(err){
console.log('no such file');
console.log('no such file', err);
callback(false);
}
}else{
......@@ -277,6 +303,75 @@ var S3 = {
})
},
// 파일 이름이 달라지는 경우
moveFile3: function (bucketName, userId, oldFile, newFile, targetPath, callback) {
if (targetPath != ''){
targetPath = targetPath + '/';
}
sourceFile = targetPath + oldFile; // test.txt or folder1/test.txt
var targetFile = targetPath + newFile;
S3.copyFile2(bucketName, userId, sourceFile, targetFile, function(result){
if (!result){
console.log("Move Error on Copying File3");
callback(false);
}else{
S3.deleteFile(bucketName, userId, sourceFile, function (res) {
if (!res) {
console.log("Move Error on Deleting File");
callback(false);
} else {
console.log("Move Success");
callback(true);
}
})
}
})
},
renameFile: function(bucketName, userId, sourceFile, modiFile, targetPath, callback){
// sourceFile = test.txt
// modiFile = test2.txt
// targetPath = '' or 'folder1/folder2'
if (sourceFile == modiFile){ // 이름 변경되지 않은 경우
callback(true, sourceFile);
}else{
if (targetPath != '') {
targetPath = targetpath + '/';
}
var targetFile = targetPath + modiFile;
S3.isFileOverlapped(bucketName, userId, targetFile, function (res, ans, lvNum) {
if (!res) {
console.log("Overlap Check failed");
callback(false, sourceFile);
} else {
if (ans) {
console.log("File Duplication");
S3.makeVersion(bucketName, userId, targetFile, lvNum + 1, function (res, versionedSourceFile) {
if (!res) {
console.log("Make version failed");
callback(false, sourceFile);
} else {
S3.renameFile(bucketName, userId, sourceFile, versionedSourceFile, targetPath, callback);
}
})
} else {
S3.moveFile3(bucketName, userId, sourceFile, modiFile, targetPath, function (result) {
if (result) {
callback(true, modiFile);
} else {
console.log('File Rename failed');
callback(false);
}
})
}
}
});
}
},
uploadFile: function (bucketName, userId, sourceFile, targetPath, body, callback) {
var pathbody = fs.createReadStream(body);
......
var express = require('express');
var router = express.Router();
router.get('/', function(req, res){
var user_id = req.query.id;
var sql = 'SELECT * FROM files WHERE recent_access>date_sub(now(), interval 3 day) AND user_id=(?)';
connection.query(sql, user_id, function(err, result){
if (err){
console.log('select error');
res.send({error: 'quick error'});
}else{
res.send(result);
}
})
})
module.exports = router;
\ No newline at end of file
const express = require('express');
const router = express.Router();
const AWS = require("aws-sdk");
const moment = require("moment");
AWS.config.loadFromPath(__dirname + "/modules/awsconfig.json");
const BUCKET_NAME = "hong-s3-cloud";
const s3 = new AWS.S3();
router.post('/', function(req, res, next) {
console.log(req.body);
let user_id = req.body.id;
let cur = req.body.cur;
let curPath = user_id + cur;
let name = req.body.file_name;
let target_id = req.body.target_id;
let checkfile = 'SELECT * FROM files WHERE location = ? AND file_name = ? AND user_id = ?';
connection.query(checkfile, [cur, name, user_id], function(err1, rows, fields) {
if (rows.length != 0) {
let copy_params = {
Bucket: BUCKET_NAME,
CopySource: BUCKET_NAME + '/drive/' + curPath + name,
Key: 'drive/' + target_id + '/share/' + name
};
s3.copyObject(copy_params, function(err, data) {
if (err) {
console.log(err, data);
res.status(304).send({ error: "copy error" });
} else {
let values = [name, '/share/', target_id];
let sharesql = 'INSERT INTO files (file_name,location,user_id) values (?,?,?);';
connection.query(sharesql, values, function(err3, result, field) {
if (err3) {
console.log("sharesql error");
res.status(304).send({ error: "sharesql error" });
} else {
res.status(200).send({});
}
});
}
});
} else {
console.log("Does not exist");
res.status(304).send({ error: "Does not exist" });
}
});
});
module.exports = router;
\ No newline at end of file
const express = require('express');
const router = express.Router();
const AWS = require("aws-sdk");
const moment = require("moment");
AWS.config.loadFromPath(__dirname + "/modules/awsconfig.json");
var S3 = require(__dirname + '/modules/s3/s3');
const s3 = new AWS.S3();
router.get('/show', function(req, res, next) {
console.log(req.query);
user_id = req.query.id;
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(checkfolder, ['/trashcan/', user_id], function(err, folder) {
if (err) {
console.log('select error');
res.status(400).send({ err: err });
} else {
let checkfile = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(checkfile, ['/trashcan/', user_id], function(err, file) {
if (err) {
console.log('select error');
res.status(400).send({ err: err });
} else {
res.status(200).send({
folders: folder,
files: file
})
}
});
}
});
});
router.get('/delfile', function(req, res, next) {
var file_id = req.query.file_id;
var user_id = req.query.id;
var getsql = 'SELECT * FROM files WHERE file_id = (?)';
connection.query(getsql, [file_id], function(err, rows) {
if (err) {
console.log('select db error');
res.send({ erorr: 'db select error' });
} else {
if (rows.length == 0) {
console.log('exist error');
res.send({ erorr: 'exist error' });
} else {
var curPath = '/trashcan/';
var file_name = rows[0].file_name;
var sourceFile = curPath.substring(1) + file_name;
var sql1 = 'DELETE FROM files WHERE file_name = (?) AND location=(?) AND user_Id = (?)';
connection.query(sql1, [file_name, curPath, user_id], function(err) {
if (err) {
console.log('delete db error');
res.send({ erorr: 'db delete error' });
} else {
S3.deleteFile(S3.BUCKET_NAME, user_id, sourceFile, function(result) {
if (result) {
let checkfile = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(checkfile, ['/trashcan/', user_id], function(err, file) {
res.status(200).send({
files: file
})
});
}
})
}
})
}
}
})
});
router.get('/delfolder', function(req, res, next) {
var folder_id = req.query.folder_id;
var user_id = req.query.id;
var getsql = 'SELECT * FROM folders WHERE folder_id = (?)';
connection.query(getsql, [folder_id], function(err, rows) {
if (err) {
console.log('select db error');
res.send({ erorr: 'db select error' });
} else {
if (rows.length == 0) {
console.log('exist error');
res.send({ erorr: 'exist error' });
} else {
var curPath = '/trashcan/'
var folder_name = rows[0].folder_name;
var sql1 = 'DELETE FROM folders WHERE folder_name = (?) AND location=(?) AND user_Id = (?)';
connection.query(sql1, [folder_name, curPath, user_id], function(err) {
if (err) {
console.log('delete db error');
res.send({ erorr: 'db delete error' });
} else {
var params = {
Bucket: S3.BUCKET_NAME,
Key: 'drive/' + user_id + curPath + folder_name + '/'
};
s3.deleteObject(params, function(err, data) {
if (err) {
res.status(400).send({ err: err });
} else {
let checkfolder = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(checkfolder, [curPath, user_id], function(err, rows) {
res.status(200).send({
folders: rows
})
});
}
})
}
})
}
}
})
});
router.get('/all', function(req, res, next) {
var user_id = req.query.id;
var getfolder = "SELECT * FROM folders WHERE user_id = ? AND location = ?;";
connection.query(getfolder, [user_id, '/trashcan/'], function(err, folders) {
if (err) {
console.log('select db error');
res.send({ erorr: 'db select error' });
} else {
var getfile = "SELECT * FROM files WHERE user_id = ? AND location = ?;";
connection.query(getfile, [user_id, '/trashcan/'], function(err, files) {
if (err) {
console.log('select db error');
res.send({ erorr: 'db select error' });
} else {
for (let i of files) {
var sql1 = 'DELETE FROM files WHERE file_id = ?;';
var sourceFile = 'trashcan/' + i.file_name;
connection.query(sql1, [i.file_id], function(err) {
if (err) {
console.log('delete db error');
res.send({ erorr: 'db delete error' });
} else {
S3.deleteFile(S3.BUCKET_NAME, user_id, sourceFile, function(result) {})
}
})
}
for (let j of folders) {
var curPath = '/trashcan/';
var sql1 = 'DELETE FROM folders WHERE folder_name = (?) AND location=(?) AND user_Id = (?)';
connection.query(sql1, [j.folder_name, curPath, user_id], function(err) {
if (err) {
console.log('delete db error');
res.send({ erorr: 'db delete error' });
} else {
var params = {
Bucket: S3.BUCKET_NAME,
Key: 'drive/' + user_id + curPath + j.folder_name + '/'
};
s3.deleteObject(params, function(err, data) {
if (err) {
res.status(400).send({ err: err });
}
});
}
});
}
res.send({ success: "success" });
}
});
}
});
});
router.post('/restore', function(req, res, next) {
console.log(req.body);
let user_id = req.body.user_id;
let id = req.body.id;
if (req.body.isfolder) {
let checkfolder = 'SELECT * FROM folders WHERE folder_id = ? AND user_id = ?;';
connection.query(checkfolder, [id, user_id], function(err1, rows, fields) {
console.log(rows);
if (rows.length != 0) {
let curPath = user_id + '/trashcan/'
let name = rows[0].folder_name
let copy_params = {
Bucket: S3.BUCKET_NAM,
CopySource: S3.BUCKET_NAM + '/drive/' + curPath + name + '/',
Key: 'drive/' + user_id + '/' + name + '/'
};
let del_params = {
Bucket: S3.BUCKET_NAM,
Key: 'drive/' + curPath + name + '/'
};
s3.copyObject(copy_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("copy error");
res.status(304).send({ error: "copy error" });
} else {
s3.deleteObject(del_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("delete error");
res.status(304).send({ error: "delete error" });
} else {
let values = ['/', '/trashcan/', name, user_id];
let updatesql = 'UPDATE folders SET location = ? WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(updatesql, values, function(err3, result, field) {
if (err3) {
console.log("updatesql error");
res.status(304).send({ error: "updatesql error" });
} else {
let resultsql = 'SELECT * FROM folders WHERE location = ? AND user_id = ?;';
connection.query(resultsql, ['/trashcan/', user_id], function(err, folder, fields) {
res.status(200).send({
folders: folder
});
});
}
});
}
});
}
});
} else {
console.log("Does not exist folder");
res.status(304).send({ error: "Does not exist" });
}
});
} else {
let checkfile = 'SELECT * FROM files WHERE file_id = ? AND user_id = ?;';
connection.query(checkfile, [id, user_id], function(err1, rows, fields) {
console.log(rows);
if (rows.length != 0) {
let curPath = user_id + '/trashcan/'
let name = rows[0].file_name
let copy_params = {
Bucket: S3.BUCKET_NAME,
CopySource: S3.BUCKET_NAME + '/drive/' + curPath + name,
Key: 'drive/' + user_id + '/' + name
};
let del_params = {
Bucket: S3.BUCKET_NAME,
Key: 'drive/' + curPath + name
};
s3.copyObject(copy_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("copy error");
res.status(304).send({ error: "copy error" });
} else {
s3.deleteObject(del_params, function(err, data) {
if (err) {
console.log(err, data);
console.log("delete error");
res.status(304).send({ error: "delete error" });
} else {
let values = ['/', '/trashcan/', name, user_id];
let updatesql = 'UPDATE files SET location = ? WHERE location = ? AND folder_name = ? AND user_id = ?;';
connection.query(updatesql, values, function(err3, result, field) {
if (err3) {
console.log("updatesql error");
res.status(304).send({ error: "updatesql error" });
} else {
let resultsql = 'SELECT * FROM files WHERE location = ? AND user_id = ?;';
connection.query(resultsql, ['/trashcan/', user_id], function(err, file, fields) {
res.status(200).send({
files: file
});
});
}
});
}
});
}
});
} else {
console.log("Does not exist file");
res.status(304).send({ error: "Does not exist" });
}
});
}
});
module.exports = router;
\ No newline at end of file
var express = require('express');
var request = require('request');
var async = require('async');
const AWS = require("aws-sdk");
AWS.config.loadFromPath(__dirname + "/../modules/awsconfig.json");
var cryptoM = require('./../../routes/modules/cryptoM.js');
const moment = require("moment");
const BUCKET_NAME = "hong-s3-cloud";
const s3 = new AWS.S3();
var router = express.Router();
......@@ -14,32 +19,90 @@ router.get('/', function(req, res, next) {
router.post('/', function(req, res, next) {
console.log(req.body);
var user_id=req.body.user_id;
var user_pw=req.body.user_pw;
var user_email=req.body.user_email;
var user_name=req.body.user_name;
var user_phone=req.body.user_phone;
var user_id = req.body.user_id;
var user_pw = req.body.user_pw;
var user_email = req.body.user_email;
var user_name = req.body.user_name;
var user_phone = req.body.user_phone;
var sqlquery = "SELECT * FROM users WHERE user_id = ?";
connection.query(sqlquery, [user_id], function (err, rows) {
if (rows.length == 0) {
user_pw=cryptoM.encrypt(user_pw);
console.log(user_pw);
var sql = 'INSERT INTO users(user_id,user_pw, user_email, user_phone, user_name) values (?,?,?,?,?)';
var values = [user_id, user_pw, user_email, user_phone,user_name];
connection.query(sql, values, function (err) {
if (err) {
console.log("inserting user failed");
throw err;
} else {
res.status(200).send('saved');
}
});
} else {
res.status(404).send(err);
}
});
connection.query(sqlquery, [user_id], function(err, rows) {
if (rows.length == 0) {
user_pw = cryptoM.encrypt(user_pw);
console.log(user_pw);
var sql = 'INSERT INTO users(user_id,user_pw, user_email, user_phone, user_name) values (?,?,?,?,?)';
var values = [user_id, user_pw, user_email, user_phone, user_name];
connection.query(sql, values, function(err) {
if (err) {
console.log("inserting user failed");
res.status(400).send({ err: err });
} else {
let params = {
Bucket: BUCKET_NAME,
Key: 'drive/' + user_id + '/',
Body: "",
ACL: "public-read-write"
};
s3.putObject(params, function(err, data) {
if (err) {
console.log('s3 error');
res.status(400).send({ err: err });
} else {
let params2 = {
Bucket: BUCKET_NAME,
Key: 'drive/' + user_id + '/share/',
Body: "",
ACL: "public-read-write"
};
s3.putObject(params2, function(err, data) {
if (err) {
console.log('s3 error');
res.status(400).send({ err: err });
} else {
let params3 = {
Bucket: BUCKET_NAME,
Key: 'drive/' + user_id + '/trashcan/',
Body: "",
ACL: "public-read-write"
};
s3.putObject(params3, function(err, data) {
if (err) {
console.log('s3 error');
res.status(400).send({ err: err });
} else {
let date = moment().format();
let root = '/';
let sql = "INSERT INTO folders (folder_name,location,user_id,created) values (?,?,?,?);";
connection.query(sql, ['share', root, user_id, date], function(err, result, field) {
if (err) {
console.log('insert1 error');
res.status(400).send({ err: err });
} else {
let sql = "INSERT INTO folders (folder_name,location,user_id,created) values (?,?,?,?);";
connection.query(sql, ['trashcan', root, user_id, date], function(err, result, field) {
if (err) {
console.log('insert2 error');
res.status(400).send({ err: err });
} else {
res.status(200).send('saved');
}
});
}
});
}
});
}
});
}
});
}
});
} else {
res.status(404).send(err);
}
});
});
module.exports = router;
module.exports = router;
\ No newline at end of file
......
......@@ -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="sha384-Bfad6CLCknfcloXFOyFnlgtENryhrpZCe29RTifKEixXQZ38WheV+i/6YWSzkz3V" crossorigin="anonymous">
</head>
<body>
<noscript>
......
<template>
<tool-view></tool-view>
<tool-view></tool-view>
</template>
<script>
import ToolView from './components/ToolView'
import ToolView from './components/ToolView';
export default {
data() {
return {
}
},
components: {
ToolView,
}
}
</script>
\ No newline at end of file
export default {
data() {
return {};
},
components: {
ToolView,
},
};
</script>
......
......@@ -18,7 +18,7 @@ function folder(curData) {
return axios.get('/api/folder/show', {
params: {
id: curData.id,
cur: curData.cur,
folder_id: curData.folder_id,
},
});
}
......@@ -53,7 +53,7 @@ function uploadFile(fileData) {
}
function detailFile(fileData) {
return axios.get(`/api/file/${fileData.name}`, {
return axios.get(`/api/file/${fileData.fileName}`, {
params: {
id: fileData.id,
cur: fileData.cur,
......@@ -70,8 +70,9 @@ function deleteFile(fileData) {
},
});
}
function downloadFile(fileData) {
return axios.get(`api/file/download/${fileData.fileName}`, {
return axios.get(`/api/file/download/${fileData.fileName}`, {
params: {
//현재 접속한 사람의 id와 다운로드를 위해 선택한 파일의 이름을 파라미터로 넘긴다.
id: fileData.id,
......@@ -80,6 +81,84 @@ function downloadFile(fileData) {
});
}
function accessedList(curData) {
return axios.get('/api/quick', {
params: {
id: curData.id,
},
});
}
function showTrashcan(userId) {
return axios.get('/api/trashcan/show', {
params: {
id: userId,
},
});
}
function modifyFile(fileData) {
return axios.post(`/api/file/modify/${fileData.name}`, fileData);
}
function delFavorite(folderData) {
return axios.post('/api/favorites/delfolder', folderData);
}
function addFavorite(folderData) {
return axios.post('/api/favorites/addfolder', folderData);
}
function moveFile(fileData) {
return axios.post('/api/folder/move', fileData);
}
function delFavoriteFile(fileData) {
return axios.post('/api/favorites/delfile', fileData);
}
function addFavoriteFile(fileData) {
return axios.post('/api/favorites/addfile', fileData);
}
function getFavoriteList(userId) {
return axios.get('/api/favorites/show', {
params: {
id: userId,
},
});
}
function shareFile(shareData) {
return axios.post('/api/share', shareData);
}
function tdelFolder(tData) {
return axios.get('/api/trashcan/delfolder', {
params: {
id: tData.id,
folder_id: tData.folder_id,
},
});
}
function tdelFile(tData) {
return axios.get('/api/trashcan/delfile', {
params: {
id: tData.id,
file_id: tData.file_id,
},
});
}
function tdelAll(userId) {
return axios.get('/api/trashcan/all', {
params: {
id: userId,
},
});
}
export {
registerUser,
loginUser,
......@@ -91,4 +170,18 @@ export {
uploadFile,
deleteFile,
downloadFile,
delFavorite,
addFavorite,
moveFile,
delFavoriteFile,
addFavoriteFile,
accessedList,
detailFile,
modifyFile,
getFavoriteList,
shareFile,
tdelFolder,
tdelFile,
tdelAll,
showTrashcan,
};
......
<template>
<v-card
max-width="98%"
class="mx-auto"
>
<v-toolbar
color="light-blue"
dark
>
<v-toolbar-title>즐겨찾기</v-toolbar-title>
<v-spacer></v-spacer>
</v-toolbar>
<v-list two-line subheader>
<v-list-item
v-for="item in items"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon
:class="[item.iconClass]"
v-text="item.icon"
></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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
<v-list-item
v-for="item in items2"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon
:class="[item.iconClass]"
v-text="item.icon"
></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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
</v-list>
</v-card>
<div>
<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>
<!-- <v-subheader inset>Folders</v-subheader> -->
<!-- Folder view -->
<v-list-item
v-if="this.$route.path !== '/fav'"
@click=""
@dblclick="$router.go(-1)"
>...</v-list-item
>
<v-list-item
v-for="item in calData"
:key="item.folder_id"
:search="search"
@click.right="show(item, $event)"
@click=""
@dblclick="
$router.push({
name: 'Folder',
params: { id: item.folder_id },
})
"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.folder_name"></v-list-item-title>
</v-list-item-content>
<v-list-item-action>
<v-icon v-if="item.favorite === 0">
mdi-star-outline
</v-icon>
<v-icon v-else>
mdi-star
</v-icon>
</v-list-item-action>
</v-list-item>
<!-- File view -->
<v-list-item
v-for="item in calData2"
:key="item.title"
@click.right="showF(item, $event)"
@dblclick="
detailF(item, $event);
file_detail(item);
"
@click=""
>
<v-list-item-avatar>
<v-icon> mdi-file</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.file_name"></v-list-item-title>
</v-list-item-content>
<v-list-item-action>
<v-icon v-if="item.favorite === 0">
mdi-star-outline
</v-icon>
<v-icon v-else>
mdi-star
</v-icon>
</v-list-item-action>
</v-list-item>
</v-list>
<!--file detial -->
<v-dialog v-model="showdetailF" max-width="290">
<v-card>
<v-card-title class="headline">
<v-text-field v-model="current_filename"></v-text-field>
</v-card-title>
<v-card-text>
<v-text-field v-model="current_filedata"></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="green darken-1"
text
@click="
showdetailF = false;
modify_file();
"
>
save
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- Move Folder -->
<v-dialog v-model="dialog2" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Move Folder
</v-card-title>
<v-container>
<v-list>
<v-list-item
v-for="item2 in folders"
:key="item2.folder_id"
@click.left="transferF(item2.folder_name)"
v-if="item2.folder_name !== curfName.folder_name"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title
v-text="item2.folder_name"
></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="cancelMove">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- sub menu for folder -->
<v-menu
v-model="showMenu"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="dialog2 = !dialog2">
<v-list-item-icon>
<v-icon>mdi-send</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>이동</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="deleteF">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="curfName.favorite === 1" @click="delete_favorite">
<v-list-item-icon>
<v-icon>mdi-star-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="curfName.favorite === 0" @click="add_favorite">
<v-list-item-icon>
<v-icon>mdi-star</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 추가</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
<!-- -->
<!-- Move File -->
<v-dialog v-model="dialog3" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Move File
</v-card-title>
<v-container>
<v-list>
<v-list-item
v-for="item2 in folders"
:key="item2.folder_id"
@click.left="transferFile(item2.folder_name)"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title
v-text="item2.folder_name"
></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="cancelMove">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- sub menu for file -->
<v-menu
v-model="showMenuF"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="dialog3 = !dialog3">
<v-list-item-icon>
<v-icon>mdi-send</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>이동</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="delete_file">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="download_file">
<v-list-item-icon>
<v-icon>mdi-download</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>다운로드</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item
v-if="cfilename.favorite === 1"
@click="delete_favorite_file"
>
<v-list-item-icon>
<v-icon>mdi-star-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="cfilename.favorite === 0" @click="add_favorite_file">
<v-list-item-icon>
<v-icon>mdi-star</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 추가</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
</div>
</template>
<script>
export default {
data: () => ({
items: [
{ icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Photos', subtitle: 'Jan 9, 2014' },
{ icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Recipes', subtitle: 'Jan 17, 2014' },
{ icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Work', subtitle: 'Jan 28, 2014' },
],
items2: [
{ icon: 'assignment', iconClass: 'blue white--text', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
{ icon: 'call_to_action', iconClass: 'amber white--text', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
],
}),
}
import {
folder,
makeFolder,
deleteFolder,
moveFolder,
file,
uploadFile,
deleteFile,
downloadFile,
delFavorite,
addFavorite,
moveFile,
delFavoriteFile,
addFavoriteFile,
detailFile,
modifyFile,
getFavoriteList,
} from '../api/index';
import Axios from 'axios';
export default {
props: {
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, //파일 상세정보 (내용)
dialog: false,
howMenu: false,
showMenu: false,
showMenuF: false, //파일 관련 메뉴
showdetailF: false, //txt 파일 상세정보 및 수정
x: 0,
y: 0,
dialog2: false,
dialog3: false, //파일 관련 메뉴
detail: {
dataname: null,
date: null,
owner_id: null,
datasize: null,
datatype: null,
},
};
},
created() {
this.fetchData();
},
computed: {
calData() {
return this.folders
.filter(data => {
return data.folder_name
.toLowerCase()
.includes(this.search.toLowerCase());
})
.slice(0);
},
calData2() {
return this.files
.filter(data => {
return data.file_name
.toLowerCase()
.includes(this.search.toLowerCase());
})
.slice(0);
},
},
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);
this.folders = response.data.folders;
this.files = response.data.files;
} catch (error) {
console.log('에러');
console.log(error);
}
},
handleFileUpload() {
this.uploadedfile = this.$refs.uploadedfile.files[0];
console.log(this.uploadedfile);
},
initFolderName() {
this.foldername = '';
},
cancelMove() {
this.curfName = {};
this.cfilename = {};
this.dialog2 = false;
this.dialog3 = false;
},
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: 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('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;
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async moveParent() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.parent,
};
const response = await folder(cData);
const file_response = await file(cData);
console.log(response.data);
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;
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async deleteF() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
folder_name: this.curfName.folder_name,
};
const response = await deleteFolder(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 = '';
}
},
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 = {
fileName: this.cfilename.file_name,
id: this.$store.state.id,
cur: this.$store.state.cur,
};
const result = await downloadFile(currentData);
console.log(result);
} catch (error) {
console.log('에러');
console.log(error);
}
},
async delete_favorite() {
try {
const cData = {
id: this.$store.state.id,
cur: this.curfName.location,
name: this.curfName.folder_name,
};
console.log(cData);
const del = await delFavorite(cData);
const response = await getFavoriteList(this.$store.state.id);
this.$store.commit('setfavFolderList', response.data.folders);
this.folders = response.data.folders;
} catch (error) {
console.log('에러');
}
},
async add_favorite() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.curfName.folder_name,
};
console.log(cData);
const response = await addFavorite(cData);
this.$store.commit('setFolder', response.data.folders);
} catch (error) {
console.log('에러');
}
},
async delete_favorite_file() {
try {
const fData = {
id: this.$store.state.id,
cur: this.cfilename.location,
name: this.cfilename.file_name,
};
console.log(fData);
const del = await delFavoriteFile(fData);
const response = await getFavoriteList(this.$store.state.id);
this.$store.commit('setfavFileList', response.data.files);
this.files = response.data.files;
} catch (error) {
console.log('에러');
}
},
async add_favorite_file() {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
};
console.log(fData);
const response = await addFavoriteFile(fData);
this.$store.commit('setFile', response.data.files);
} catch (error) {
console.log('에러');
}
},
async transferFile(folderName) {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
isfolder: false,
newPath: this.$store.state.cur + folderName + '/',
};
const response = await moveFile(fData);
console.log(response);
this.$store.commit('setFile', response.data.files);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error.response.data);
} finally {
this.cfilename = {};
this.dialog3 = false;
}
},
async file_detail() {
try {
const currentData = {
id: this.cfilename.user_id,
cur: this.cfilename.location,
fileName: this.cfilename.file_name,
};
const detailData = await detailFile(currentData);
this.current_filename = detailData.data.file_name;
this.current_filedata = detailData.data.content;
console.log(this.current_filename);
console.log(this.current_filedata);
} catch (error) {
console.log('에러');
console.log(error);
}
},
async modify_file() {
try {
const modifyData = {
user_id: this.cfilename.user_id,
cur: this.cfilename.location,
name: this.current_filename,
content: this.current_filedata,
};
const result = await modifyFile(modifyData);
const after_data = {
id: this.cfilename.user_id,
cur: this.cfilename.location,
fileName: this.current_filename,
};
const detailData = await detailFile(after_data);
} catch (error) {
console.log('에러');
console.log(error);
}
},
show(folderObj, e) {
e.preventDefault();
this.curfName = folderObj;
this.showMenu = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenu = true;
});
},
showF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showMenuF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenuF = true;
});
},
detailF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showdetailF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showdetailF = true;
});
},
},
};
</script>
......
<template>
<v-card
max-width="98%"
class="mx-auto"
>
<v-toolbar
color="light-blue"
dark
>
<v-toolbar-title>파일</v-toolbar-title>
<v-spacer></v-spacer>
</v-toolbar>
<v-list two-line subheader>
<v-list-item
v-for="item in items"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon
:class="[item.iconClass]"
v-text="item.icon"
></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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
<v-list-item
v-for="item in items2"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon
:class="[item.iconClass]"
v-text="item.icon"
></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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
</v-list>
</v-card>
<v-card max-width="98%" class="mx-auto">
<v-toolbar color="light-blue" dark>
<v-toolbar-title>파일</v-toolbar-title>
<v-spacer></v-spacer>
</v-toolbar>
<v-list two-line subheader>
<v-list-item v-for="item in items" :key="item.title" @click="">
<v-list-item-avatar>
<v-icon :class="[item.iconClass]" v-text="item.icon"></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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
<v-list-item v-for="item in items2" :key="item.title" @click="">
<v-list-item-avatar>
<v-icon :class="[item.iconClass]" v-text="item.icon"></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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
</v-list>
</v-card>
</template>
<script>
export default {
data: () => ({
items: [
{ icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Photos', subtitle: 'Jan 9, 2014' },
{ icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Recipes', subtitle: 'Jan 17, 2014' },
{ icon: 'folder', iconClass: 'grey lighten-1 white--text', title: 'Work', subtitle: 'Jan 28, 2014' },
],
items2: [
{ icon: 'assignment', iconClass: 'blue white--text', title: 'Vacation itinerary', subtitle: 'Jan 20, 2014' },
{ icon: 'call_to_action', iconClass: 'amber white--text', title: 'Kitchen remodel', subtitle: 'Jan 10, 2014' },
],
}),
}
export default {
data: () => ({
items: [
{
icon: 'folder',
iconClass: 'grey lighten-1 white--text',
title: 'Photos',
subtitle: 'Jan 9, 2014',
},
{
icon: 'folder',
iconClass: 'grey lighten-1 white--text',
title: 'Recipes',
subtitle: 'Jan 17, 2014',
},
{
icon: 'folder',
iconClass: 'grey lighten-1 white--text',
title: 'Work',
subtitle: 'Jan 28, 2014',
},
],
items2: [
{
icon: 'assignment',
iconClass: 'blue white--text',
title: 'Vacation itinerary',
subtitle: 'Jan 20, 2014',
},
{
icon: 'call_to_action',
iconClass: 'amber white--text',
title: 'Kitchen remodel',
subtitle: 'Jan 10, 2014',
},
],
}),
};
</script>
......
<template lang="html">
<v-dialog v-model="dialog" max-width="290">
<v-card>
<v-card-title class="headline"
>Use Google's location service?</v-card-title
>
<v-card-text>
Let Google help apps determine location. This means sending anonymous
location data to Google, even when no apps are running.
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="green darken-1" text @click="dialog = false">
Disagree
</v-btn>
<v-btn color="green darken-1" text @click="dialog = false">
Agree
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</template>
<script>
export default {
data() {
return {
dialog: false,
};
},
};
</script>
<style lang="css" scoped></style>
<template>
<div>
<v-toolbar flat>
<v-toolbar-title>파일 </v-toolbar-title>
<v-toolbar-title>내 드라이브</v-toolbar-title>
<v-spacer></v-spacer>
<v-text-field
v-model="search"
append-icon="mdi-magnify"
label="파일 검색"
label="검색"
single-line
hide-details
></v-text-field>
</v-toolbar>
<v-list two-line subheader>
<v-subheader inset>Folders</v-subheader>
<v-btn @click="moveParent">...</v-btn>
<v-list>
<!-- <v-subheader inset>Folders</v-subheader> -->
<!-- Folder view -->
<v-list-item
v-for="item in this.$store.getters.folderL"
:key="item.title"
v-for="item in calData"
:key="item.folder_id"
:search="search"
@click.right="show(item.folder_name, $event)"
@click.left="moveF(item.folder_name)"
@click.right="show(item, $event)"
@click=""
@dblclick="
$router.push({
name: 'Folder',
params: { id: item.folder_id },
})
"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
......@@ -27,55 +33,26 @@
<v-list-item-content>
<v-list-item-title v-text="item.folder_name"></v-list-item-title>
</v-list-item-content>
<v-menu
v-model="showMenu"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="dialog2 = !dialog2">
<v-list-item-title>이동</v-list-item-title>
</v-list-item>
<v-list-item @click.prevent="deleteF">
<v-list-item-title>삭제</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
<v-list-item-action>
<v-icon v-if="item.favorite === 0">
mdi-star-outline
</v-icon>
<v-icon v-else>
mdi-star
</v-icon>
</v-list-item-action>
</v-list-item>
<v-dialog v-model="dialog2" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Move Folder
</v-card-title>
<v-container>
<v-list-item-group v-for="item2 in folders" :key="item2.folder_id">
<template v-if="!(item2.folder_name === curfName)">
<v-hover @click.left="transferF(item2.folder_name)">
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title
v-text="item2.folder_name"
></v-list-item-title>
</v-list-item-content>
</v-hover>
</template>
<!-- <template v-else></template> -->
</v-list-item-group>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="cancelMove">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<v-divider inset></v-divider>
<v-subheader inset>Files</v-subheader>
<v-list-item v-for="item in this.$store.getters.fileL" :key="item.title">
<!-- File view -->
<v-list-item
v-for="item in calData2"
:key="item.file_id"
@click.right="showF(item, $event)"
@dblclick="
detailF(item, $event);
file_detail(item);
"
@click=""
>
<v-list-item-avatar>
<v-icon> mdi-file</v-icon>
</v-list-item-avatar>
......@@ -83,15 +60,231 @@
<v-list-item-title v-text="item.file_name"></v-list-item-title>
</v-list-item-content>
<v-list-item-action>
<v-btn icon @click="download_file(item.file_name)">
<v-icon color="grey lighten-1">mdi-download</v-icon>
</v-btn>
<v-btn icon @click="delete_file(item.file_name)">
<v-icon color="grey lighten-1">mdi-delete</v-icon>
</v-btn>
<v-icon v-if="item.favorite === 0">
mdi-star-outline
</v-icon>
<v-icon v-else>
mdi-star
</v-icon>
</v-list-item-action>
</v-list-item>
</v-list>
<!--file detial -->
<v-dialog v-model="showdetailF" max-width="290">
<v-card>
<v-card-title class="headline">
<v-text-field v-model="current_filename"></v-text-field>
</v-card-title>
<v-card-text>
<v-text-field v-model="current_filedata"></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="green darken-1"
text
@click="
showdetailF = false;
modify_file();
"
>
save
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- file share menu -->
<v-dialog v-model="showShareF" width="500px">
<v-card>
<v-card-title>
Share File
</v-card-title>
<v-card-text>
<v-text-field v-model="this.cfilename.file_name"></v-text-field>
</v-card-text>
<v-card-text>
<v-text-field
v-model="targetUid"
label="target user id"
></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn @click.prevent="file_share">ok</v-btn>
<v-btn @click="showShareF = false">cancle</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- Move Folder -->
<v-dialog v-model="dialog2" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Move Folder
</v-card-title>
<v-container>
<v-list>
<v-list-item
v-for="(item2, index) in folders"
:key="index"
@click.left="transferF(item2.folder_name)"
v-if="item2.folder_name !== curfName.folder_name"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title
v-text="item2.folder_name"
></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="cancelMove">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- sub menu for folder -->
<v-menu
v-model="showMenu"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="dialog2 = !dialog2">
<v-list-item-icon>
<v-icon>mdi-send</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>이동</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="deleteF">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="curfName.favorite === 1" @click="delete_favorite">
<v-list-item-icon>
<v-icon>mdi-star-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="curfName.favorite === 0" @click="add_favorite">
<v-list-item-icon>
<v-icon>mdi-star</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 추가</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
<!-- -->
<!-- Move File -->
<v-dialog v-model="dialog3" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Move File
</v-card-title>
<v-container>
<v-list>
<v-list-item
v-for="(item2, index) in folders"
:key="index"
@click.left="transferFile(item2.folder_name)"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title
v-text="item2.folder_name"
></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="cancelMove">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- sub menu for file -->
<v-menu
v-model="showMenuF"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="dialog3 = !dialog3">
<v-list-item-icon>
<v-icon>mdi-send</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>이동</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="delete_file">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="download_file">
<v-list-item-icon>
<v-icon>mdi-download</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>다운로드</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item
v-if="cfilename.favorite === 1"
@click.prevent="delete_favorite_file"
>
<v-list-item-icon>
<v-icon>mdi-star-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item
v-if="cfilename.favorite === 0"
@click.prevent="add_favorite_file"
>
<v-list-item-icon>
<v-icon>mdi-star</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 추가</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="showShareF = !showShareF">
<v-list-item-icon>
<v-icon>fas fa-share-alt</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>공유 하기</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
<input
id="file-selector"
ref="uploadedfile"
......@@ -99,42 +292,11 @@
v-on:change="handleFileUpload()"
/>
<br />
<!--
<v-file-input
v-model="files"
color="deep-purple accent-4"
counter
label="업로드"
multiple
placeholder="파일을 화면으로 드래그앤 드롭 하거나, 이곳을 클릭하세요."
prepend-icon="mdi-paperclip"
outlined
:show-size="1000"
>
<template v-slot:selection="{ index, text }">
<v-chip
v-if="index < 2"
color="deep-purple accent-4"
dark
label
small
>
{{ text }}
</v-chip>
<span
v-else-if="index === 2"
class="overline grey--text text--darken-3 mx-2"
>
+{{ files.length - 2 }} File(s)
</span>
</template>
</v-file-input>
-->
<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>
<!-- Create Folder -->
<v-dialog v-model="dialog" width="500px">
<v-card>
<v-card-title class="grey darken-2">
......@@ -170,25 +332,42 @@ import {
uploadFile,
deleteFile,
downloadFile,
delFavorite,
addFavorite,
moveFile,
delFavoriteFile,
addFavoriteFile,
detailFile,
modifyFile,
shareFile,
} from '../api/index';
import Axios from 'axios';
export default {
data() {
return {
uploadedfile: null,
foldername: '',
curfName: '',
curfName: {},
cfilename: {},
folders: [],
files: [],
search: '',
id: '',
searchD: '',
share_file_name: '',
showShareF: false,
targetUid: '',
current_filename: null, //파일 상세정보 (이름)
current_filedata: null, //파일 상세정보 (내용)
dialog: false,
howMenu: false,
showMenu: false,
showMenuF: false, //파일 관련 메뉴
showdetailF: false, //txt 파일 상세정보 및 수정
x: 0,
y: 0,
dialog2: false,
dialog3: false, //파일 관련 메뉴
detail: {
dataname: null,
date: null,
......@@ -198,29 +377,53 @@ export default {
},
};
},
async created() {
try {
const curData = {
id: this.$store.state.id,
cur: '/',
};
console.log(curData);
const response = await folder(curData);
const file_response = await file(curData);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setCur', response.data.cur);
this.$store.commit('setParent', response.data.parentPath);
this.folders = this.$store.getters.folderL;
this.$store.commit('setFile', file_response.data.files);
this.folders = this.$store.getters.folderL;
console.log(this.$store.getters.fileL);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error);
}
created() {
this.fetchData();
},
computed: {
calData() {
return this.folders
.filter(data => {
return data.folder_name
.toLowerCase()
.includes(this.search.toLowerCase());
})
.slice(0);
},
calData2() {
return this.files
.filter(data => {
return data.file_name
.toLowerCase()
.includes(this.search.toLowerCase());
})
.slice(0);
},
},
watch: {
$route: 'fetchData',
},
methods: {
async fetchData() {
try {
const curData = {
id: this.$store.state.id,
folder_id: -1,
};
console.log(curData);
const response = await folder(curData);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setCur', response.data.cur);
this.$store.commit('setParent', response.data.parentPath);
this.$store.commit('setFile', response.data.files);
this.folders = this.$store.getters.folderL;
console.log(this.$store.getters.fileL);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error);
}
},
handleFileUpload() {
this.uploadedfile = this.$refs.uploadedfile.files[0];
console.log(this.uploadedfile);
......@@ -229,8 +432,10 @@ export default {
this.foldername = '';
},
cancelMove() {
this.curfName = '';
this.curfName = {};
this.cfilename = {};
this.dialog2 = false;
this.dialog3 = false;
},
async makeF() {
try {
......@@ -252,23 +457,6 @@ export default {
this.dialog = false;
}
},
async moveF(move_folder_name) {
try {
const curData = {
id: this.$store.state.id,
cur: this.$store.state.cur + move_folder_name + '/',
};
const response = await folder(curData);
console.log(response.data);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setCur', response.data.cur);
this.$store.commit('setParent', response.data.parentPath);
this.folders = this.$store.getters.folderL;
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async moveParent() {
try {
const cData = {
......@@ -276,11 +464,14 @@ export default {
cur: this.$store.state.parent,
};
const response = await folder(cData);
const file_response = await file(cData);
console.log(response.data);
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;
} catch (error) {
console.log('에러');
console.log(error.response.data);
......@@ -291,7 +482,7 @@ export default {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
folder_name: this.curfName,
folder_name: this.curfName.folder_name,
};
const response = await deleteFolder(cData);
console.log(response);
......@@ -309,7 +500,7 @@ export default {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
folder_name: this.curfName,
name: this.curfName.folder_name,
isfolder: true,
newPath: this.$store.state.cur + folderName + '/',
};
......@@ -321,8 +512,7 @@ export default {
console.log('에러');
console.log(error.response.data);
} finally {
this.initFolderName();
this.curfName = '';
this.curfName = {};
this.dialog2 = false;
}
},
......@@ -348,20 +538,16 @@ export default {
console.log(error);
}
},
async delete_file(itemName) {
async delete_file() {
try {
var itemlist = this.$store.getters.fileL;
console.log(itemlist);
console.log(itemName);
const currentData = {
fileName: null,
user_id: null,
cur: this.$store.state.cur,
};
for (var i = 0; i < itemlist.length; i++) {
console.log(itemlist[i].file_name);
if (itemlist[i].file_name == itemName) {
if (itemlist[i].file_name == this.cfilename.file_name) {
currentData.fileName = itemlist[i].file_name;
currentData.user_id = itemlist[i].user_id;
}
......@@ -370,23 +556,20 @@ export default {
id: currentData.user_id,
cur: currentData.cur,
};
console.log(currentData);
const response = await deleteFile(currentData);
setTimeout(function() {}, 500);
const filelist = await file(filelistData);
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 download_file(namedata) {
async download_file() {
try {
const currentData = {
fileName: namedata,
fileName: this.cfilename.file_name,
id: this.$store.state.id,
cur: this.$store.state.cur,
};
......@@ -397,16 +580,173 @@ export default {
console.log(error);
}
},
},
show(folderN, e) {
e.preventDefault();
this.curfName = folderN;
this.showMenu = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenu = true;
});
async delete_favorite() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.curfName.folder_name,
};
console.log(cData);
const response = await delFavorite(cData);
this.$store.commit('setFolder', response.data.folders);
this.folders = response.data.folders;
} catch (error) {
console.log('에러');
}
},
async add_favorite() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.curfName.folder_name,
};
console.log(cData);
const response = await addFavorite(cData);
this.$store.commit('setFolder', response.data.folders);
this.folders = response.data.folders;
} catch (error) {
console.log('에러');
}
},
async delete_favorite_file() {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
};
console.log(fData);
const response = await delFavoriteFile(fData);
this.$store.commit('setFile', response.data.files);
this.files = response.data.files;
} catch (error) {
console.log('에러');
}
},
async add_favorite_file() {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
};
console.log(fData);
const response = await addFavoriteFile(fData);
this.$store.commit('setFile', response.data.files);
this.files = response.data.files;
} catch (error) {
console.log('에러');
}
},
async transferFile(folderName) {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
isfolder: false,
newPath: this.$store.state.cur + folderName + '/',
};
const response = await moveFile(fData);
console.log(response);
this.$store.commit('setFile', response.data.files);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error.response.data);
} finally {
this.cfilename = {};
this.dialog3 = false;
}
},
async file_detail() {
try {
const currentData = {
id: this.cfilename.user_id,
cur: this.cfilename.location,
fileName: this.cfilename.file_name,
};
const detailData = await detailFile(currentData);
this.current_filename = detailData.data.file_name;
this.current_filedata = detailData.data.content;
console.log(this.current_filename);
console.log(this.current_filedata);
} catch (error) {
console.log('에러');
console.log(error);
}
},
async modify_file() {
try {
const modifyData = {
user_id: this.cfilename.user_id,
cur: this.cfilename.location,
name: this.current_filename,
content: this.current_filedata,
};
const result = await modifyFile(modifyData);
const after_data = {
id: this.cfilename.user_id,
cur: this.cfilename.location,
fileName: this.current_filename,
};
const detailData = await detailFile(after_data);
} catch (error) {
console.log('에러');
console.log(error);
}
},
async file_share() {
try {
const shareData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
file_name: this.cfilename.file_name,
target_id: this.targetUid,
};
const response = await shareFile(shareData);
if (response.status == 200) {
alert('파일 공유 완료');
}
} catch (error) {
console.log('에러');
alert('존재 하지 않은 유저입니다.');
} finally {
this.showShareF = false;
}
},
show(folderObj, e) {
e.preventDefault();
this.curfName = folderObj;
this.showMenu = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenu = true;
});
},
showF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showMenuF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenuF = true;
});
},
detailF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showdetailF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showdetailF = true;
});
},
},
};
</script>
......
......@@ -47,15 +47,7 @@
<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 router :to="{ name: 'Trash' }" exact>
<v-list-item-action>
<v-icon>mdi-delete</v-icon>
</v-list-item-action>
......
<template>
<div>
<v-toolbar flat>
<v-toolbar-title>휴지통</v-toolbar-title>
<v-spacer></v-spacer>
<v-btn @click="delAll">비우기</v-btn>
</v-toolbar>
<v-list>
<!-- <v-subheader inset>Folders</v-subheader> -->
<!-- Folder view -->
<v-list-item
v-for="item in this.$store.getters.trashFolderL"
:key="item.folder_id"
:search="search"
@click.right="show(item, $event)"
@click=""
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.folder_name"></v-list-item-title>
</v-list-item-content>
</v-list-item>
<!-- File view -->
<v-list-item
v-for="item in this.$store.getters.trashFileL"
:key="item.title"
@click.right="showF(item, $event)"
>
<v-list-item-avatar>
<v-icon> mdi-file</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.file_name"></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
<v-menu
v-model="showMenu"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="delFolder">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="transferF">
<v-list-item-icon>
<v-icon>fas fa-trash-restore</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>복원</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
<v-menu
v-model="showMenuF"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="delFile">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="transferFile">
<v-list-item-icon>
<v-icon>fas fa-trash-restore</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>복원</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
</div>
</template>
<script>
import {
tdelFolder,
tdelFile,
tdelAll,
moveFolder,
moveFile,
showTrashcan,
} from '../api/index';
export default {
data() {
return {
curfName: {},
showMenu: false,
search: '',
x: 0,
y: 0,
cfilename: {},
showMenuF: false,
};
},
created() {
this.fetchData();
},
watch: {
$route: 'fetchData',
},
methods: {
async fetchData() {
try {
const id = this.$store.state.id;
const response = await showTrashcan(id);
console.log(response.data);
this.$store.commit('settrashFolderList', response.data.folders);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
}
},
async delFolder() {
try {
const tData = {
id: this.$store.state.id,
folder_id: this.curfName.folder_id,
};
const response = await tdelFolder(tData);
this.$store.commit('settrashFolderList', response.data.folders);
} catch (error) {
console.log('에러');
alert('삭제 실패');
}
},
async delFile() {
try {
const tData = {
id: this.$store.state.id,
folder_id: this.cfilename.file_id,
};
const response = await tdelFile(tData);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
alert('삭제 실패');
}
},
async delAll() {
try {
const id = this.$store.state.id;
const response = await tdelAll(id);
this.$store.commit('settrashFolderList', response.data.folders);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
alert('삭제 실패');
}
},
async transferF() {
try {
const cData = {
id: this.$store.state.id,
cur: '/trashcan/',
name: this.curfName.folder_name,
isfolder: true,
newPath: '/',
};
const response = await moveFolder(cData);
console.log(response);
this.$store.commit('settrashFolderList', response.data.folders);
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async transferFile() {
try {
const fData = {
id: this.$store.state.id,
cur: '/trashcan/',
name: this.cfilename.file_name,
isfolder: false,
newPath: '/',
};
const response = await moveFile(fData);
console.log(response);
this.$store.commit('settrashFileList', response.data.files);
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
show(folderObj, e) {
e.preventDefault();
this.curfName = folderObj;
this.showMenu = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenu = true;
});
},
showF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showMenuF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenuF = true;
});
},
},
};
</script>
<style></style>
<template lang="html">
<v-flex>
<h1>빠른액세스</h1>
<v-simple-table>
<template v-slot:default>
<thead>
<tr>
<th class="text-left">File ID</th>
<th class="text-left">Name</th>
<th class="text-left">Dir</th>
<th class="text-left">Date</th>
</tr>
</thead>
<tbody>
<tr v-for="item in recent_list" :key="item.name">
<td>{{ item.file_id }}</td>
<td>{{ item.file_name }}</td>
<td>{{ item.location }}</td>
<td>{{ item.date }}</td>
</tr>
</tbody>
</template>
</v-simple-table>
<v-divider></v-divider>
</v-flex>
</template>
<script>
import { accessedList } from '../api/index';
import Axios from 'axios';
export default {
data() {
return {
recent_list: [],
};
},
async created() {
try {
const curData = {
id: this.$store.state.id,
};
console.log(curData);
const list_reponse = await accessedList(curData);
this.$store.commit('setRecentList', list_reponse.data);
this.recent_list = this.$store.getters.recentL;
console.log(this.$store.getters.recentL);
} catch (error) {
console.log('에러');
console.log(error);
}
},
methods: {},
};
</script>
<style lang="css" scoped></style>
<template>
<div>
<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>
<!-- <v-subheader inset>Folders</v-subheader> -->
<!-- Folder view -->
<v-list-item @click="" @dblclick="$router.go(-1)">...</v-list-item>
<v-list-item
v-for="item in calData"
:key="item.folder_id"
:search="search"
@click.right="show(item, $event)"
@click=""
@dblclick="
$router.push({
name: 'Folder',
params: { id: item.folder_id },
})
"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.folder_name"></v-list-item-title>
</v-list-item-content>
<v-list-item-action>
<v-icon v-if="item.favorite === 0">
mdi-star-outline
</v-icon>
<v-icon v-else>
mdi-star
</v-icon>
</v-list-item-action>
</v-list-item>
<!-- File view -->
<v-list-item
v-for="item in calData2"
:key="item.title"
@click.right="showF(item, $event)"
@dblclick="
detailF(item, $event);
file_detail(item);
"
@click=""
>
<v-list-item-avatar>
<v-icon> mdi-file</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title v-text="item.file_name"></v-list-item-title>
</v-list-item-content>
<v-list-item-action>
<v-icon v-if="item.favorite === 0">
mdi-star-outline
</v-icon>
<v-icon v-else>
mdi-star
</v-icon>
</v-list-item-action>
</v-list-item>
</v-list>
<!--file detail -->
<v-dialog v-model="showdetailF" max-width="290">
<v-card>
<v-card-title class="headline">
<v-text-field v-model="current_filename"></v-text-field>
</v-card-title>
<v-card-text>
<v-text-field v-model="current_filedata"></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="green darken-1"
text
@click="
showdetailF = false;
modify_file();
"
>
save
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- file share menu -->
<v-dialog v-model="showShareF" width="500px">
<v-card>
<v-card-title>
Share File
</v-card-title>
<v-card-text>
<v-text-field v-model="this.cfilename.file_name"></v-text-field>
</v-card-text>
<v-card-text>
<v-text-field
v-model="targetUid"
label="target user id"
></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn @click.prevent="file_share">ok</v-btn>
<v-btn @click="showShareF = false">cancle</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- Move Folder -->
<v-dialog v-model="dialog2" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Move Folder
</v-card-title>
<v-container>
<v-list>
<v-list-item
v-for="item2 in folders"
:key="item2.folder_id"
@click.left="transferF(item2.folder_name)"
v-if="item2.folder_name !== curfName.folder_name"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title
v-text="item2.folder_name"
></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="cancelMove">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- sub menu for folder -->
<v-menu
v-model="showMenu"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="dialog2 = !dialog2">
<v-list-item-icon>
<v-icon>mdi-send</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>이동</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="deleteF">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="curfName.favorite === 1" @click="delete_favorite">
<v-list-item-icon>
<v-icon>mdi-star-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="curfName.favorite === 0" @click="add_favorite">
<v-list-item-icon>
<v-icon>mdi-star</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 추가</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
<!-- -->
<!-- Move File -->
<v-dialog v-model="dialog3" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Move File
</v-card-title>
<v-container>
<v-list>
<v-list-item
v-for="item2 in folders"
:key="item2.folder_id"
@click.left="transferFile(item2.folder_name)"
>
<v-list-item-avatar>
<v-icon>mdi-folder</v-icon>
</v-list-item-avatar>
<v-list-item-content>
<v-list-item-title
v-text="item2.folder_name"
></v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="cancelMove">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- sub menu for file -->
<v-menu
v-model="showMenuF"
:position-x="x"
:position-y="y"
absolute
offset-y
>
<v-list dense>
<v-list-item @click.prevent="dialog3 = !dialog3">
<v-list-item-icon>
<v-icon>mdi-send</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>이동</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="delete_file">
<v-list-item-icon>
<v-icon>mdi-delete</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="download_file">
<v-list-item-icon>
<v-icon>mdi-download</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>다운로드</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item
v-if="cfilename.favorite === 1"
@click="delete_favorite_file"
>
<v-list-item-icon>
<v-icon>mdi-star-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 삭제</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item v-if="cfilename.favorite === 0" @click="add_favorite_file">
<v-list-item-icon>
<v-icon>mdi-star</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>즐겨 찾기 추가</v-list-item-title>
</v-list-item-content>
</v-list-item>
<v-list-item @click.prevent="showShareF = !showShareF">
<v-list-item-icon>
<v-icon>fas fa-share-alt</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title>공유 하기</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list>
</v-menu>
<input
id="file-selector"
ref="uploadedfile"
type="file"
v-on:change="handleFileUpload()"
/>
<br />
<v-btn color="blue" @click="upload_file">upload</v-btn>
<v-btn bottom color="blue" dark fab fixed right @click="dialog = !dialog">
<v-icon>mdi-plus</v-icon>
</v-btn>
<!-- Create Folder -->
<v-dialog v-model="dialog" width="500px">
<v-card>
<v-card-title class="grey darken-2">
Create Folder
</v-card-title>
<v-container>
<div>
<v-icon>mdi-folder</v-icon>
<v-text-field
placeholder="name"
id="foldername"
type="text"
v-model="foldername"
></v-text-field>
</div>
</v-container>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text color="primary" @click="dialog = false">Cancel</v-btn>
<v-btn text @click="makeF">Create</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</div>
</template>
<script>
import {
folder,
makeFolder,
deleteFolder,
moveFolder,
file,
uploadFile,
deleteFile,
downloadFile,
delFavorite,
addFavorite,
moveFile,
delFavoriteFile,
addFavoriteFile,
detailFile,
modifyFile,
shareFile,
} from '../api/index';
import Axios from 'axios';
export default {
props: {
folderId: Number,
},
data() {
return {
folder_id: this.$route.params.id,
uploadedfile: null,
foldername: '',
curfName: {},
cfilename: {},
folders: [],
files: [],
search: '',
id: '',
share_file_name: '',
showShareF: false,
targetUid: '',
current_filename: null, //파일 상세정보 (이름)
current_filedata: null, //파일 상세정보 (내용)
dialog: false,
howMenu: false,
showMenu: false,
showMenuF: false, //파일 관련 메뉴
showdetailF: false, //txt 파일 상세정보 및 수정
x: 0,
y: 0,
dialog2: false,
dialog3: false, //파일 관련 메뉴
detail: {
dataname: null,
date: null,
owner_id: null,
datasize: null,
datatype: null,
},
};
},
created() {
this.fetchData();
},
computed: {
calData() {
return this.folders
.filter(data => {
return data.folder_name
.toLowerCase()
.includes(this.search.toLowerCase());
})
.slice(0);
},
calData2() {
return this.files
.filter(data => {
return data.file_name
.toLowerCase()
.includes(this.search.toLowerCase());
})
.slice(0);
},
},
watch: {
$route: 'fetchData',
},
methods: {
async fetchData() {
try {
console.log(this.$route.params.id);
const curData = {
id: this.$store.state.id,
folder_id: this.$route.params.id,
};
console.log(curData);
const response = await folder(curData);
// const file_response = await file(curData);
this.$store.commit('setFolder', response.data.folders);
this.$store.commit('setCur', response.data.cur);
this.$store.commit('setParent', response.data.parentPath);
this.$store.commit('setFile', response.data.files);
this.folders = this.$store.getters.folderL;
console.log(this.$store.getters.fileL);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error);
}
},
handleFileUpload() {
this.uploadedfile = this.$refs.uploadedfile.files[0];
console.log(this.uploadedfile);
},
initFolderName() {
this.foldername = '';
},
cancelMove() {
this.curfName = {};
this.cfilename = {};
this.dialog2 = false;
this.dialog3 = false;
},
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 moveParent() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.parent,
};
const response = await folder(cData);
const file_response = await file(cData);
console.log(response.data);
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;
} catch (error) {
console.log('에러');
console.log(error.response.data);
}
},
async deleteF() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
folder_name: this.curfName.folder_name,
};
const response = await deleteFolder(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 = '';
}
},
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 = {
fileName: this.cfilename.file_name,
id: this.$store.state.id,
cur: this.$store.state.cur,
};
const result = await downloadFile(currentData);
console.log(result);
} catch (error) {
console.log('에러');
console.log(error);
}
},
async delete_favorite() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.curfName.folder_name,
};
console.log(cData);
const response = await delFavorite(cData);
this.$store.commit('setFolder', response.data.folders);
this.folders = response.data.folders;
} catch (error) {
console.log('에러');
}
},
async add_favorite() {
try {
const cData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.curfName.folder_name,
};
console.log(cData);
const response = await addFavorite(cData);
this.$store.commit('setFolder', response.data.folders);
this.folders = response.data.folders;
} catch (error) {
console.log('에러');
}
},
async delete_favorite_file() {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
};
console.log(fData);
const response = await delFavoriteFile(fData);
this.$store.commit('setFile', response.data.files);
this.files = response.data.files;
} catch (error) {
console.log('에러');
}
},
async add_favorite_file() {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
};
console.log(fData);
const response = await addFavoriteFile(fData);
this.$store.commit('setFile', response.data.files);
this.files = response.data.files;
} catch (error) {
console.log('에러');
}
},
async transferFile(folderName) {
try {
const fData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
name: this.cfilename.file_name,
isfolder: false,
newPath: this.$store.state.cur + folderName + '/',
};
const response = await moveFile(fData);
console.log(response);
this.$store.commit('setFile', response.data.files);
this.files = this.$store.getters.fileL;
} catch (error) {
console.log('에러');
console.log(error.response.data);
} finally {
this.cfilename = {};
this.dialog3 = false;
}
},
async file_detail() {
try {
const currentData = {
id: this.cfilename.user_id,
cur: this.cfilename.location,
fileName: this.cfilename.file_name,
};
const detailData = await detailFile(currentData);
this.current_filename = detailData.data.file_name;
this.current_filedata = detailData.data.content;
console.log(this.current_filename);
console.log(this.current_filedata);
} catch (error) {
console.log('에러');
console.log(error);
}
},
async modify_file() {
try {
const modifyData = {
user_id: this.cfilename.user_id,
cur: this.cfilename.location,
name: this.current_filename,
content: this.current_filedata,
};
const result = await modifyFile(modifyData);
const after_data = {
id: this.cfilename.user_id,
cur: this.cfilename.location,
fileName: this.current_filename,
};
const detailData = await detailFile(after_data);
} catch (error) {
console.log('에러');
console.log(error);
}
},
async file_share() {
try {
const shareData = {
id: this.$store.state.id,
cur: this.$store.state.cur,
file_name: this.cfilename.file_name,
target_id: this.targetUid,
};
const response = await shareFile(shareData);
if (response.status == 200) {
alert('파일 공유 완료');
}
} catch (error) {
console.log('에러');
alert('존재 하지 않은 유저입니다.');
} finally {
this.showShareF = false;
}
},
show(folderObj, e) {
e.preventDefault();
this.curfName = folderObj;
this.showMenu = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenu = true;
});
},
showF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showMenuF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showMenuF = true;
});
},
detailF(fileObj, e) {
e.preventDefault();
this.cfilename = fileObj;
this.showdetailF = false;
this.x = e.clientX;
this.y = e.clientY;
this.$nextTick(() => {
this.showdetailF = true;
});
},
},
};
</script>
import Vue from 'vue'
import App from './App.vue'
import router from './routes/index'
import store from './store/index'
import Vue from 'vue';
import App from './App.vue';
import router from './routes/index';
import store from './store/index';
import vuetify from './plugins/vuetify';
Vue.config.productionTip = false
Vue.config.productionTip = false;
new Vue({
router,
store,
vuetify,
render: h => h(App)
}).$mount('#app')
router,
store,
vuetify,
render: h => h(App),
}).$mount('#app');
......
......@@ -67,9 +67,15 @@ export default new VueRouter({
component: () => import('../views/Feedback.vue'),
},
{
path: '/folder',
path: '/file/:id',
name: 'Folder',
component: () => import('../views/FolderPage.vue'),
component: () => import('../components/folderc'),
props: true,
},
{
path: '/trash',
name: 'Trash',
component: () => import('../views/TrashPage'),
},
],
});
......
import Vue from 'vue'
import Vuex from 'vuex'
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex)
Vue.use(Vuex);
export default new Vuex.Store({
state: {
id: '',
folders: [],
files: [],
cur: '/',
parent: '/'
},
mutations: {
setId(state, userid) {
state.id = userid;
},
clearid(state) {
state.id = '';
},
setFolder(state, folderlist) {
state.folders = folderlist;
},
setFile(state, filelist) {
state.files = filelist;
},
setCur(state, cur) {
state.cur = cur;
},
setParent(state, parent) {
state.parent = parent;
}
},
getters: {
isLogin(state) {
return state.id !== '';
},
userID(state) {
return state.id;
},
folderL(state) {
return state.folders;
},
fileL(state) {
return state.files;
},
cur(state) {
return state.cur;
},
setFolder(state, folderlist){
state.folders = folderlist;
},
setFile(state, filelist){
state.files = filelist;
},
},
})
\ No newline at end of file
state: {
id: '',
folders: [],
files: [],
cur: '/',
parent: '/',
recentList: [],
favFolderList: [],
favFileList: [],
trashFolderList: [],
trashFileList: [],
},
mutations: {
setId(state, userid) {
state.id = userid;
},
clearid(state) {
state.id = '';
},
setFolder(state, folderlist) {
state.folders = folderlist;
},
setFile(state, filelist) {
state.files = filelist;
},
setCur(state, cur) {
state.cur = cur;
},
setParent(state, parent) {
state.parent = parent;
},
setRecentList(state, list) {
state.recentList = list;
},
setfavFolderList(state, fflist) {
state.favFolderList = fflist;
},
setfavFileList(state, fflist) {
state.favFileList = fflist;
},
settrashFolderList(state, tflist) {
state.trashFolderList = tflist;
},
settrashFileList(state, tflist) {
state.trashFileList = tflist;
},
},
getters: {
isLogin(state) {
return state.id !== '';
},
userID(state) {
return state.id;
},
folderL(state) {
return state.folders;
},
fileL(state) {
return state.files;
},
recentL(state) {
return state.recentList;
},
cur(state) {
return state.cur;
},
setFolder(state, folderlist) {
state.folders = folderlist;
},
setFile(state, filelist) {
state.files = filelist;
},
favFolderL(state) {
return state.favFolderList;
},
favFileL(state) {
return state.favFileList;
},
trashFolderL(state) {
return state.trashFolderList;
},
trashFileL(state) {
return state.trashFileList;
},
},
});
......
<template lang="html">
<contact></contact>
<contact></contact>
</template>
<script>
import contact from '@/components/make_contact.vue'
export default {
components:{
contact
}
}
import contact from '@/components/make_contact.vue';
export default {
components: {
contact,
},
};
</script>
<style lang="css" scoped>
</style>
<style lang="css" scoped></style>
......
<template>
<div>
<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-list-item
v-for="item in items"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon
>{{item.iconClass}}</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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
<v-list-item
v-for="item in items2"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon> {{item.iconClass}}</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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
</v-list>
</div>
<div>
<Fav_list></Fav_list>
</div>
</template>
<script>
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' },
],
}),
}
import Fav_list from '../components/Fav_list';
export default {
components: {
Fav_list,
},
};
</script>
<style></style>
......
<template lang="html">
<v-container fluid>
<FileList></FileList>
</v-container>
<v-container fluid>
<FileList></FileList>
</v-container>
</template>
<script>
import FileList from '@/components/FileList'
import Favlist from '@/components/Fav_list'
export default {
components:{
FileList,
Favlist
},
data () {
return {
headers: [
{
text: 'Dessert (100g serving)',
align: 'start',
sortable: false,
value: 'name',
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%',
format : 'dir'
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%',
format: 'pdf'
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%',
format: 'file'
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%',
format : 'dir'
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%',
format : 'pdf'
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%',
format:'file'
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%',
format:'dir'
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%',
foramt:'file'
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%',
foramt:'pdf'
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%',
foramt:'dir'
},
],
favorite:[
{
name: 'KitKat',
date: '20.05.17'
},
{
name: 'Vuetify',
date: '20.05.17'
}
],
}
},
}
import FileList from '@/components/FileList';
import Favlist from '@/components/Fav_list';
export default {
components: {
FileList,
Favlist,
},
data() {
return {
headers: [
{
text: 'Dessert (100g serving)',
align: 'start',
sortable: false,
value: 'name',
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%',
format: 'dir',
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%',
format: 'pdf',
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%',
format: 'file',
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%',
format: 'dir',
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%',
format: 'pdf',
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%',
format: 'file',
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%',
format: 'dir',
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%',
foramt: 'file',
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%',
foramt: 'pdf',
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%',
foramt: 'dir',
},
],
favorite: [
{
name: 'KitKat',
date: '20.05.17',
},
{
name: 'Vuetify',
date: '20.05.17',
},
],
};
},
};
</script>
......
<template lang="html">
<FileDetail></FileDetail>
</template>
<script>
import FileDetail from '@/components/FileDetail';
export default {
components: {
FileDetail,
},
};
</script>
<style lang="css" scoped></style>
<template>
<div>
<folderc v-bind:folderId="folderId"></folderc>
</div>
</template>
<script>
import folderc from '../components/folderc';
export default {
props: {
folderId: Number,
},
components: {
folderc,
},
};
</script>
<style></style>
......
<template lang="html">
<v-container>
<div>
<h2>안녕하세요!</h2>
<br><br>
</div>
<v-layout column>
<v-flex>
<v-layout row wrap>
<v-flex xs6>
<v-flex>
<h1>파일</h1>
<v-data-table
:headers="headers"
:items="desserts"
:expand-icon="home"
:items-per-page="5"
class="elevation-1"
></v-data-table>
<v-spacer></v-spacer>
</v-flex>
<v-flex><br><v-divider></v-divider><br></v-flex>
<v-flex>
<h1>빠른액세스</h1>
<v-simple-table>
<template v-slot:default>
<thead>
<tr>
<th class="text-left">Name</th>
<th class="text-left">Date</th>
</tr>
</thead>
<tbody>
<tr v-for="item in favorite" :key="item.name">
<td>{{ item.name }}</td>
<td>{{ item.date }}</td>
</tr>
</tbody>
</template>
</v-simple-table>
<v-divider></v-divider>
</v-flex>
</v-flex>
<v-flex><br><v-divider></v-divider><br></v-flex>
<v-flex xs6>
<h1>즐겨찾기</h1>
<v-simple-table>
<template v-slot:default>
<thead>
<tr>
<th class="text-left">Name</th>
<th class="text-left">Date</th>
</tr>
</thead>
<tbody>
<tr v-for="item in favorite" :key="item.name">
<td>{{ item.name }}</td>
<td>{{ item.date }}</td>
</tr>
</tbody>
</template>
</v-simple-table>
<v-divider></v-divider>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-container>
<v-container>
<div>
<h2>안녕하세요!</h2>
<br /><br />
</div>
<v-layout column>
<v-flex>
<v-layout row wrap>
<v-flex xs6>
<v-flex>
<h1>파일</h1>
<v-data-table
:headers="headers"
:items="desserts"
:expand-icon="home"
:items-per-page="5"
class="elevation-1"
></v-data-table>
<v-spacer></v-spacer>
</v-flex>
<v-flex><br /><v-divider></v-divider><br /></v-flex>
<v-container>
<accessList></accessList>
</v-container>
</v-flex>
<v-flex><br /><v-divider></v-divider><br /></v-flex>
<v-flex xs6>
<h1>즐겨찾기</h1>
<v-simple-table>
<template v-slot:default>
<thead>
<tr>
<th class="text-left">Name</th>
<th class="text-left">Date</th>
</tr>
</thead>
<tbody>
<tr v-for="item in favorite" :key="item.name">
<td>{{ item.name }}</td>
<td>{{ item.date }}</td>
</tr>
</tbody>
</template>
</v-simple-table>
<v-divider></v-divider>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
</v-container>
</template>
<script>
export default {
data () {
return {
headers: [
{
text: 'Dessert (100g serving)',
align: 'start',
sortable: false,
value: 'name',
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%',
format : 'dir'
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%',
format: 'pdf'
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%',
format: 'file'
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%',
format : 'dir'
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%',
format : 'pdf'
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%',
format:'file'
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%',
format:'dir'
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%',
foramt:'file'
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%',
foramt:'pdf'
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%',
foramt:'dir'
},
],
favorite:[
{
name: 'KitKat',
date: '20.05.17'
},
{
name: 'Vuetify',
date: '20.05.17'
}
],
}
},
}
import accessList from '@/components/accessList.vue';
export default {
data() {
return {
headers: [
{
text: 'Dessert (100g serving)',
align: 'start',
sortable: false,
value: 'name',
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%',
format: 'dir',
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%',
format: 'pdf',
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%',
format: 'file',
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%',
format: 'dir',
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%',
format: 'pdf',
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%',
format: 'file',
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%',
format: 'dir',
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%',
foramt: 'file',
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%',
foramt: 'pdf',
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%',
foramt: 'dir',
},
],
favorite: [
{
name: 'KitKat',
date: '20.05.17',
},
{
name: 'Vuetify',
date: '20.05.17',
},
],
};
},
};
</script>
......
<template>
<div>
<LoginForm></LoginForm>
</div>
<div>
<LoginForm></LoginForm>
</div>
</template>
<script>
import LoginForm from '../components/LoginForm'
import LoginForm from '../components/LoginForm';
export default {
components: {
LoginForm,
}
}
components: {
LoginForm,
},
};
</script>
<style>
</style>
\ No newline at end of file
<style></style>
......
<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-flex><br><br></v-flex>
<v-flex lg6>
<Favlist></Favlist>
</v-flex>
</v-layout>
</v-flex>
</v-layout>
<v-divider></v-divider>
<v-layout column>
<v-flex>
<v-toolbar flat>
<v-toolbar-title>빠른 액세스</v-toolbar-title>
<v-spacer></v-spacer>
</v-toolbar>
<v-simple-table>
<template v-slot:default>
<thead>
<tr>
<th class="text-left">Name</th>
<th class="text-left">Date</th>
</tr>
</thead>
<tbody>
<tr v-for="item in favorite" :key="item.name">
<td>{{ item.name }}</td>
<td>{{ item.date }}</td>
</tr>
</tbody>
</template>
</v-simple-table>
<v-divider></v-divider>
</v-flex>
</v-layout>
</v-container>
<v-container>
<v-layout column>
<v-flex>
<v-layout column>
<v-flex><br /><br /></v-flex>
<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>
<v-container>
<accessList></accessList>
</v-container>
<v-divider></v-divider>
</v-flex>
</v-layout>
</v-container>
</template>
<script>
import FileList from '@/components/FileList'
import Favlist from '@/components/Fav_list'
import Filecard from '@/components/FileCardlist.vue'
export default {
components:{
FileList,
Favlist,
Filecard
},
data () {
return {
headers: [
{
text: 'Dessert (100g serving)',
align: 'start',
sortable: false,
value: 'name',
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%',
format : 'dir'
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%',
format: 'pdf'
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%',
format: 'file'
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%',
format : 'dir'
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%',
format : 'pdf'
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%',
format:'file'
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%',
format:'dir'
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%',
foramt:'file'
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%',
foramt:'pdf'
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%',
foramt:'dir'
},
],
favorite:[
{
name: 'KitKat',
date: '20.05.17'
},
{
name: 'Vuetify',
date: '20.05.17'
}
],
}
},
}
import accessList from '@/components/accessList.vue';
import FileList from '@/components/FileList';
import Favlist from '@/components/Fav_list';
import Filecard from '@/components/FileCardlist.vue';
export default {
components: {
FileList,
Favlist,
Filecard,
accessList,
},
data() {
return {
headers: [
{
text: 'Dessert (100g serving)',
align: 'start',
sortable: false,
value: 'name',
},
{ text: 'Calories', value: 'calories' },
{ text: 'Fat (g)', value: 'fat' },
{ text: 'Carbs (g)', value: 'carbs' },
{ text: 'Protein (g)', value: 'protein' },
{ text: 'Iron (%)', value: 'iron' },
],
desserts: [
{
name: 'Frozen Yogurt',
calories: 159,
fat: 6.0,
carbs: 24,
protein: 4.0,
iron: '1%',
format: 'dir',
},
{
name: 'Ice cream sandwich',
calories: 237,
fat: 9.0,
carbs: 37,
protein: 4.3,
iron: '1%',
format: 'pdf',
},
{
name: 'Eclair',
calories: 262,
fat: 16.0,
carbs: 23,
protein: 6.0,
iron: '7%',
format: 'file',
},
{
name: 'Cupcake',
calories: 305,
fat: 3.7,
carbs: 67,
protein: 4.3,
iron: '8%',
format: 'dir',
},
{
name: 'Gingerbread',
calories: 356,
fat: 16.0,
carbs: 49,
protein: 3.9,
iron: '16%',
format: 'pdf',
},
{
name: 'Jelly bean',
calories: 375,
fat: 0.0,
carbs: 94,
protein: 0.0,
iron: '0%',
format: 'file',
},
{
name: 'Lollipop',
calories: 392,
fat: 0.2,
carbs: 98,
protein: 0,
iron: '2%',
format: 'dir',
},
{
name: 'Honeycomb',
calories: 408,
fat: 3.2,
carbs: 87,
protein: 6.5,
iron: '45%',
foramt: 'file',
},
{
name: 'Donut',
calories: 452,
fat: 25.0,
carbs: 51,
protein: 4.9,
iron: '22%',
foramt: 'pdf',
},
{
name: 'KitKat',
calories: 518,
fat: 26.0,
carbs: 65,
protein: 7,
iron: '6%',
foramt: 'dir',
},
],
favorite: [
{
name: 'KitKat',
date: '20.05.17',
},
{
name: 'Vuetify',
date: '20.05.17',
},
],
};
},
};
</script>
......
<template>
<div>
<v-toolbar flat>
<v-toolbar-title>빠른액세스</v-toolbar-title>
<div>
<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-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-list two-line subheader>
<v-list-item v-for="item in items" :key="item.title" @click="">
<v-list-item-avatar>
<v-icon>{{ item.iconClass }}</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-content>
<v-list-item
v-for="item in items"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
>{{item.iconClass}}</v-icon>
</v-list-item-avatar>
<v-list-item v-for="item in items2" :key="item.title" @click="">
<v-list-item-avatar>
<v-icon> {{ item.iconClass }}</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-content>
<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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
<v-list-item
v-for="item in items2"
:key="item.title"
@click=""
>
<v-list-item-avatar>
<v-icon> {{item.iconClass}}</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-content>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
</v-list>
</div>
<v-list-item-action>
<v-btn icon>
<v-icon color="grey lighten-1">mdi-information</v-icon>
</v-btn>
</v-list-item-action>
</v-list-item>
</v-list>
</div>
</template>
<script>
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' },
],
}),
}
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',
},
],
}),
};
</script>
......
<template>
<div>
<SignupForm></SignupForm>
</div>
<div>
<SignupForm></SignupForm>
</div>
</template>
<script>
import SignupForm from '../components/SignupForm'
import SignupForm from '../components/SignupForm';
export default {
components: {
SignupForm,
}
}
components: {
SignupForm,
},
};
</script>
<style>
</style>
\ No newline at end of file
<style></style>
......
<template>
<TrashList></TrashList>
</template>
<script>
import TrashList from '../components/TrashList';
export default {
components: {
TrashList,
},
};
</script>
<style></style>
......@@ -2,34 +2,10 @@
"requires": true,
"lockfileVersion": 1,
"dependencies": {
"axios": {
"version": "0.19.2",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
"integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
"requires": {
"follow-redirects": "1.5.10"
}
},
"debug": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
"requires": {
"ms": "2.0.0"
}
},
"follow-redirects": {
"version": "1.5.10",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
"requires": {
"debug": "=3.1.0"
}
},
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
"readline": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/readline/-/readline-1.3.0.tgz",
"integrity": "sha1-xYDXfvLPyHUrEySYBg3JeTp6wBw="
}
}
}
......