초기 PM 소스 전체 업로드
This commit is contained in:
koj729
194
views/index/index-projectStatus.html
Normal file
194
views/index/index-projectStatus.html
Normal file
@@ -0,0 +1,194 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="stylesheet" href="/index/css/reset.css" />
|
||||
<link rel="stylesheet" href="/index/css/system.css" />
|
||||
<link rel="stylesheet" href="/index/css/style-index-projectStatus.css" />
|
||||
<title>PM PROJECT STATUS</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main class="main">
|
||||
<aside class="main__menu">
|
||||
<h3 class="main__menu_head">프로젝트 수행현황</h3>
|
||||
<ul class="main__menu_list --scrollbar">
|
||||
</ul>
|
||||
</aside>
|
||||
<section class="main__preview">
|
||||
<iframe src="" frameborder="0"></iframe>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
<script src="https://api.digitalarchive.work/hmCesium/lib/axios/dist/axios.js"></script>
|
||||
<script>
|
||||
let parentUser;
|
||||
let initCalled = false;
|
||||
window.addEventListener('message', (event) => {
|
||||
if (event.origin === window.location.origin && !initCalled && event.data && event.data.message == 'projectStatusMessage') {
|
||||
initCalled = true;
|
||||
parentUser = event.data;
|
||||
init();
|
||||
}
|
||||
})
|
||||
//draw
|
||||
async function init() {
|
||||
document.querySelector('.main__menu_list').innerHTML = '';
|
||||
let res = await axios.get(`/gsim/projectstatusList`);
|
||||
let list = res.data.data;
|
||||
|
||||
for (let item in list) {
|
||||
let li = document.createElement('li');
|
||||
li.className = 'main__menu_list_item';
|
||||
li.innerHTML = `<img
|
||||
class="--icon"
|
||||
src="/index/img-overseas/icon__file--primary-lv-3.svg"
|
||||
alt="/"
|
||||
/>
|
||||
<h4 class="main__menu_list_item_text">${list[item].file_nm}</h4>
|
||||
${(parentUser.user_id == 'M04308' || parentUser.group != null) ? '<button class="--button__xx-small" id="delete_btn"><img class="--icon" src="/index/img-overseas/icon__close--color-dahong.svg" alt="/" /> </button>' : ''}`;
|
||||
document.querySelector('.main__menu_list').appendChild(li);
|
||||
|
||||
li.addEventListener('click', async () => {
|
||||
let siblings = document.querySelectorAll('.main__menu_list_item');
|
||||
siblings.forEach((item) => item.classList.remove('--selected'));
|
||||
li.classList.add('--selected');
|
||||
|
||||
//presigned url 발급
|
||||
// console.log(list[item].object_key);
|
||||
// console.log(item);
|
||||
let urlRes = await axios.get(`/gsim/getPresignedUrl?bucket=${list[item].bucket}&objectKey=${list[item].object_key}`);
|
||||
let url = urlRes.data.data;
|
||||
|
||||
// let viewer = document.querySelector('.viewer');
|
||||
// viewer.style.display = 'none';
|
||||
// viewer.innerHTML = '';
|
||||
|
||||
let pdf_options = {
|
||||
url: url,
|
||||
initialPage: 1,
|
||||
};
|
||||
|
||||
// let iframe = document.createElement('iframe');
|
||||
let iframe = document.querySelector('iframe');
|
||||
// viewer.appendChild(iframe);
|
||||
|
||||
iframe.src = `/libs/pdfViewer/web/viewer.html`;
|
||||
iframe.addEventListener('load', () => {
|
||||
try {
|
||||
let appWin = iframe.contentWindow;
|
||||
appWin.localStorage.removeItem('pdfjs.history');
|
||||
Object.keys(appWin.localStorage).forEach(k => {
|
||||
if (k.startsWith('pdfjs.history') || k.startsWith('pdfjs.preferences')) {
|
||||
appWin.localStorage.removeItem(k);
|
||||
}
|
||||
});
|
||||
} catch (e) { /* ignore */ }
|
||||
|
||||
let app = document.querySelector('iframe').contentWindow.PDFViewerApplication;
|
||||
app.pdfCursorTools._handTool.activate();
|
||||
app.open(pdf_options);
|
||||
|
||||
iframe.width = '100%';
|
||||
iframe.height = '100%';
|
||||
// viewer.style.display = 'block';
|
||||
});
|
||||
})
|
||||
|
||||
// if((parentUser.user_id == 'M04308' || parentUser.group != null)){
|
||||
li.querySelector('#delete_btn')?.addEventListener('click', async () => {
|
||||
if (confirm(`정말 ${list[item].file_nm}를 삭제합니까?`)) {
|
||||
let deleteRes = await axios.delete(`/gsim/deleteFile?bucket=${list[item].bucket}&objectKey=${list[item].object_key}`);
|
||||
if (deleteRes.data.message == 'deleteFile') {
|
||||
init();
|
||||
}
|
||||
}
|
||||
})
|
||||
// }
|
||||
|
||||
if (item == list.length - 1) {
|
||||
li.click();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//////upload
|
||||
document.querySelector('body').addEventListener('dragover', (e) => {
|
||||
if (parentUser.user_id != 'M04308' && parentUser.group == null) return;
|
||||
e.preventDefault();
|
||||
console.log('drag');
|
||||
|
||||
if (!document.getElementById('drag-over')) {
|
||||
let div = document.createElement('div');
|
||||
div.id = 'drag-over';
|
||||
document.querySelector('body').appendChild(div);
|
||||
|
||||
div.style.width = '100%';
|
||||
div.style.height = '100%';
|
||||
div.style.position = 'absolute';
|
||||
div.style.left = 0;
|
||||
div.style.top = 0;
|
||||
div.style.zIndex = 1000;
|
||||
div.style.background = 'rgba(0,0,0,0.2)';
|
||||
div.innerHTML = '<div class="drag-over--text" style="font-weight: 600; font-size: 3.5rem; color: #fff;">파일을 여기에 놓으세요</div>';
|
||||
div.style.display = 'flex';
|
||||
div.style.justifyContent = 'center';
|
||||
div.style.alignItems = 'center';
|
||||
|
||||
dragOver = true;
|
||||
|
||||
div.addEventListener('dragleave', (e) => {
|
||||
e.preventDefault();
|
||||
console.log('dragleave');
|
||||
|
||||
document.getElementById('drag-over')?.remove();
|
||||
})
|
||||
}
|
||||
})
|
||||
document.querySelector('body').addEventListener('drop', async (e) => {
|
||||
if (parentUser.user_id != 'M04308' && parentUser.group == null) return;
|
||||
e.preventDefault();
|
||||
console.log('drop');
|
||||
document.getElementById('drag-over')?.remove();
|
||||
|
||||
//파일 저장
|
||||
const files = e.dataTransfer.files;
|
||||
if (files.length > 0) {
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
const file = files[i];
|
||||
if (file.type != 'application/pdf') {
|
||||
alert('pdf 파일만 업로드 할 수 있습니다.');
|
||||
return;
|
||||
}
|
||||
let uploadRes = await axios.get(`/gsim/uploadUrl?filename=${file.name}`);
|
||||
let uploadUrl = uploadRes.data.data;
|
||||
|
||||
await axios.put(uploadUrl, file, {
|
||||
headers: {
|
||||
'Content-Type': file.type || 'application/pdf'
|
||||
},
|
||||
onUploadProgress: async progress => {
|
||||
// let totalSize = progress.total;
|
||||
// let loadedSize = progress.loaded;
|
||||
// let percentage = (loadedSize / totalSize) * 100;
|
||||
// progressData.loadedSize = loadedSize;
|
||||
// progressData.totalSize = totalSize;
|
||||
// progressData.percentage = percentage;
|
||||
// if (percentage != 100) progressData.state = 'working';
|
||||
// if (percentage == 100) progressData.state = 'finish';
|
||||
}
|
||||
});
|
||||
|
||||
//db insert
|
||||
await axios.get('/gsim/insertProjectStatusData?filename=' + file.name);
|
||||
}
|
||||
}
|
||||
|
||||
init();
|
||||
})
|
||||
</script>
|
||||
Reference in New Issue
Block a user