|
|
|
@ -300,17 +300,38 @@
|
|
|
|
|
<button type="button" class="btn btn-primary" id="btnDeleteFile--${pageName}" title="선택 사진 삭제">사진 삭제</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="displayForExist--${pageName}" style="overflow-y:scroll; min-height:80px; max-height:600px; border-style:solid;">
|
|
|
|
|
|
|
|
|
|
<div id="displayForExist--${pageName}" style="border-style: solid;">
|
|
|
|
|
<ul id="dragAndDrop--${pageName}" style="display:flex; flex-wrap:wrap; overflow-y:scroll; min-height:80px; max-height: 600px;">
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<form id="frmUploadSet--${pageName}" method="post" enctype="multipart/form-data">
|
|
|
|
|
<input type="file" id="inputUploadSet--${pageName}" name="inputUploadSet" multiple accept="image/*" hidden />
|
|
|
|
|
</form>
|
|
|
|
|
</div> <!-- 단속 이미지 -->
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<template id="imgRadioTemplate--${pageName}">
|
|
|
|
|
<li style="display:flex">
|
|
|
|
|
<label class='mx-1' style="display:flex;flex-direction:row">
|
|
|
|
|
<input type="radio" name="{name}" class="form-check-input" value="{value}" checked="" />
|
|
|
|
|
<div style="position:relative;">
|
|
|
|
|
<img src="{src}" width="240" height="160" style=""display:absolute;"
|
|
|
|
|
data-crdn-photo-id="{crdnPhotoId}"
|
|
|
|
|
data-mosaic="{mosaic}"
|
|
|
|
|
onload='fn_photoMask($("#photoMask--top").is(":checked"),this);' />
|
|
|
|
|
</div>
|
|
|
|
|
</label>
|
|
|
|
|
</li>
|
|
|
|
|
</template>
|
|
|
|
|
<!-- 단속 이미지 -->
|
|
|
|
|
|
|
|
|
|
</div> <!-- <div class="d-flex flex-row justify-content-evenly"> -->
|
|
|
|
|
</div> <!-- <div class="content-wrapper"> -->
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
LoadScript("sortableScript","/resources/3rd-party/sneat/libs/sortablejs/sortable.js");
|
|
|
|
|
|
|
|
|
|
/**************************************************************************
|
|
|
|
|
* Global Variable
|
|
|
|
|
**************************************************************************/
|
|
|
|
@ -428,45 +449,49 @@
|
|
|
|
|
|
|
|
|
|
// 이미지 파일만큼 html에 추가
|
|
|
|
|
fnMakeImgForExistFile${pageName} = (fileArr) => {
|
|
|
|
|
let tagsText = "";
|
|
|
|
|
let tagsTextArr = [];
|
|
|
|
|
|
|
|
|
|
for (let index = 0, j = 0; index < fileArr.length; index++) {
|
|
|
|
|
for(let index = 0, jLoop = 0; index < fileArr.length; index++){
|
|
|
|
|
let item = fileArr[index];
|
|
|
|
|
|
|
|
|
|
if (item.status == "delete") {
|
|
|
|
|
continue;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
tagsText += "<label class='mx-2'>";
|
|
|
|
|
tagsText += "<input type='radio' name='existPhoto' class='form-check-input' value='" + item.FILE_ID + "' ";
|
|
|
|
|
let template = document.getElementById("imgRadioTemplate--${pageName}").innerHTML;
|
|
|
|
|
template = template.replace(/{name}/gi, "existPhoto");
|
|
|
|
|
template = template.replace(/{value}/gi, item.FILE_ID);
|
|
|
|
|
template = template.replace(/{src}/gi, item.URL);
|
|
|
|
|
|
|
|
|
|
if (index == 0) {
|
|
|
|
|
tagsText += " checked='checked' ";
|
|
|
|
|
if (index != 0) {
|
|
|
|
|
template = template.replace("checked=\"\"", "");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
tagsText += " />";
|
|
|
|
|
tagsText += "<img src='"+ item.URL +"' width='260' height='150' />";
|
|
|
|
|
tagsText += "</label>";
|
|
|
|
|
tagsText += "<br />";
|
|
|
|
|
tagsText += "<p></p>";
|
|
|
|
|
template = template.replace(/{crdnPhotoId}/gi, "exist" + item.FILE_ID + "${pageName}");
|
|
|
|
|
template = template.replace(/{mosaic}/gi, ifEmpty(item.MOSAIC,""));
|
|
|
|
|
|
|
|
|
|
tagsTextArr.push(template);
|
|
|
|
|
|
|
|
|
|
if (jLoop % 2 == 1) {
|
|
|
|
|
//tagsTextArr.push("<br />");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
j++;
|
|
|
|
|
jLoop++;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return tagsText;
|
|
|
|
|
return tagsTextArr.join("");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 화면에 이미지 표시
|
|
|
|
|
fnImageDisplay${pageName} = (isExist) => {
|
|
|
|
|
if (isExist) {
|
|
|
|
|
let displayArea = document.querySelector("#displayForExist--${pageName}");
|
|
|
|
|
let tagsText = fnMakeImgForExistFile${pageName}(existFileArr${pageName});
|
|
|
|
|
|
|
|
|
|
if (tagsText == "") {
|
|
|
|
|
displayArea.innerHTML = "등록된 사진이 없습니다.";
|
|
|
|
|
document.querySelector("#dragAndDrop--${pageName}").innerHTML = "등록된 사진이 없습니다.";
|
|
|
|
|
$("#btnEditPhoto--${pageName}").hide();
|
|
|
|
|
} else {
|
|
|
|
|
displayArea.innerHTML = tagsText;
|
|
|
|
|
document.querySelector("#dragAndDrop--${pageName}").innerHTML = tagsText;
|
|
|
|
|
$("#btnEditPhoto--${pageName}").show();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -482,10 +507,38 @@
|
|
|
|
|
|
|
|
|
|
// 이미지(사진) 재조회
|
|
|
|
|
if (resp.saved) {
|
|
|
|
|
${pageName}RefreshImageInfo();
|
|
|
|
|
refreshImageInfo${pageName}();
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
//사진 편집 콜백
|
|
|
|
|
callbackEditPhoto${pageName} = (modifiedFile, originalFileInfo, isNumberPlate) => {
|
|
|
|
|
debugger;
|
|
|
|
|
modifiedFile.id = "file-" + new Date().getTime() + "-" + "0";
|
|
|
|
|
modifiedFile.url = (window.URL || window.webkitURL).createObjectURL(modifiedFile);
|
|
|
|
|
|
|
|
|
|
// if(isNumberPlate){
|
|
|
|
|
// modifiedFile.mosaic = "";
|
|
|
|
|
// $P.localUploadArr.push(modifiedFile);
|
|
|
|
|
|
|
|
|
|
// $P.updateFileInfo("insert");
|
|
|
|
|
|
|
|
|
|
// } else {
|
|
|
|
|
// $P.existFileArr.forEach(function(item,index){
|
|
|
|
|
// if(item.FILE_ID == originalFileInfo.FILE_ID){
|
|
|
|
|
// modifiedFile.URL = modifiedFile.url;
|
|
|
|
|
// modifiedFile.FILE_ID = originalFileInfo.FILE_ID;
|
|
|
|
|
// modifiedFile.SRT_ORD = originalFileInfo.SRT_ORD;
|
|
|
|
|
// modifiedFile.status = "modified";
|
|
|
|
|
// $P.existFileArr.splice(index, 1, modifiedFile);
|
|
|
|
|
// };
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
// $P.updateFileInfo("modifiy");
|
|
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 사진 저장
|
|
|
|
|
saveFile${pageName} = (info) => {
|
|
|
|
|
if (!info) return;
|
|
|
|
@ -556,8 +609,35 @@
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 사진 정렬
|
|
|
|
|
updateFileOrder${pageName} = () => {
|
|
|
|
|
let formData = new FormData(document.getElementById("frmFile--${pageName}"));
|
|
|
|
|
|
|
|
|
|
formData.append("crdnId", ${pageName}Control.dataset.getValue("CRDN_ID"));
|
|
|
|
|
formData.append("atchFileCnt", existFileArr${pageName}.length);
|
|
|
|
|
|
|
|
|
|
let fileProcessingURL = wctx.url("file/changeOrderCrdnImageFile.do");
|
|
|
|
|
let inputs = $("#dragAndDrop--${pageName}").find("input[name='existPhoto']");
|
|
|
|
|
|
|
|
|
|
for (let iLoop=0; iLoop < inputs.length; iLoop++) {
|
|
|
|
|
formData.append("orderedKeys", inputs[iLoop].value);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
ajax.post({
|
|
|
|
|
url : fileProcessingURL
|
|
|
|
|
, data : formData
|
|
|
|
|
, contentType : false
|
|
|
|
|
, processData : false
|
|
|
|
|
, success : resp => {
|
|
|
|
|
if (resp.saved) {
|
|
|
|
|
refreshImageInfo${pageName}();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 이미지(사진) 재조회
|
|
|
|
|
${pageName}RefreshImageInfo = () => {
|
|
|
|
|
refreshImageInfo${pageName} = () => {
|
|
|
|
|
let crdnId = ${pageName}Control.dataset.getValue("CRDN_ID");
|
|
|
|
|
let sggCd = ${pageName}Control.dataset.getValue("SGG_CD");
|
|
|
|
|
let taskSeCd = ${pageName}Control.dataset.getValue("TASK_SE_CD");
|
|
|
|
@ -926,6 +1006,15 @@
|
|
|
|
|
**************************************************************************/
|
|
|
|
|
// 이벤트 설정
|
|
|
|
|
setEvent${pageName} = () => {
|
|
|
|
|
//드래그앤드롭
|
|
|
|
|
Sortable.create(document.getElementById("dragAndDrop--${pageName}"), {
|
|
|
|
|
onEnd : function(evt) {
|
|
|
|
|
if (evt.oldIndex != evt.newIndex) {
|
|
|
|
|
updateFileOrder${pageName}();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 선택 사진 편집
|
|
|
|
|
$("#btnEditPhoto--${pageName}").on("click", () => {
|
|
|
|
|
let checked = $("#displayForExist--${pageName}").find("[name='existPhoto']:checked");
|
|
|
|
@ -936,9 +1025,11 @@
|
|
|
|
|
|
|
|
|
|
let fileId = checked.val();
|
|
|
|
|
|
|
|
|
|
window.open(wctx.url("/sprt/sprt03/020/main.do?openerPageName=${pageName}&fileId=" + fileId)
|
|
|
|
|
,"editPhoto"
|
|
|
|
|
,"width=1400,height=750"
|
|
|
|
|
window.open(wctx.url("/sprt/sprt03/020/main.do?openerPageName=${pageName}"
|
|
|
|
|
+ "&fileId=" + fileId
|
|
|
|
|
+ "&callbackFuncName=" + "callbackEditPhoto${pageName}")
|
|
|
|
|
, "editPhoto"
|
|
|
|
|
, "width=1400, height=750"
|
|
|
|
|
);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
@ -967,14 +1058,11 @@
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 초기 기본 설정
|
|
|
|
|
initForm${pageName} = () => {
|
|
|
|
|
// 화면 초기화
|
|
|
|
|
$("#frmEdit--${pageName}")[0].reset();
|
|
|
|
|
}
|
|
|
|
|
// 기본 데이터 설정
|
|
|
|
|
initData${pageName} = () => {
|
|
|
|
|
//
|
|
|
|
|
$("#btnEditPhoto--${pageName}").hide(); // 사진 편집
|
|
|
|
|
|
|
|
|
|
// 화면 데이터 셋팅
|
|
|
|
|
setFormData${pageName} = () => {
|
|
|
|
|
// jquery를 이용한 show/hide (style이 유지)
|
|
|
|
|
$("#divBlank1--${pageName}").hide(); // 빈 칸1
|
|
|
|
|
$("#divBlank2--${pageName}").hide(); // 빈 칸2
|
|
|
|
@ -1036,8 +1124,8 @@
|
|
|
|
|
// 이벤트 설정
|
|
|
|
|
setEvent${pageName}();
|
|
|
|
|
|
|
|
|
|
// 초기 기본 설정
|
|
|
|
|
initForm${pageName}();
|
|
|
|
|
// 기본 데이터 설정
|
|
|
|
|
initData${pageName}();
|
|
|
|
|
|
|
|
|
|
// Dataset 설정
|
|
|
|
|
${pageName}Control.setData([${crdnPayer}]); // 단속, 납부자 정보
|
|
|
|
@ -1045,7 +1133,7 @@
|
|
|
|
|
// 이미지 정보를 파일 배열에 셋팅
|
|
|
|
|
existFileArr${pageName} = []; // 파일 배열 초기화
|
|
|
|
|
|
|
|
|
|
var crdnPayerInfo = ${pageName}Control.getCurrent();
|
|
|
|
|
let crdnPayerInfo = ${pageName}Control.getCurrent();
|
|
|
|
|
|
|
|
|
|
if (crdnPayerInfo.fileList) {
|
|
|
|
|
crdnPayerInfo.fileList.forEach(function(item) {
|
|
|
|
@ -1055,9 +1143,6 @@
|
|
|
|
|
}
|
|
|
|
|
// 화면에 이미지 표시
|
|
|
|
|
fnImageDisplay${pageName}(true);
|
|
|
|
|
|
|
|
|
|
// 화면 데이터 셋팅
|
|
|
|
|
setFormData${pageName}();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|