|
|
|
|
@ -1,16 +1,21 @@
|
|
|
|
|
<#include "/m/include/index_top.ftl">
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
/* nutrition_camera 이미지불러오기 */
|
|
|
|
|
.nutrition_camera { padding-top:35px; background: url(../img/main/main_cont_img_camera_bg01.png)no-repeat top center/18px auto; }
|
|
|
|
|
.nutrition_camera .nutrition_camera_box { padding-bottom:40px; background: url(../img/main/main_cont_img_camera_bg03.png)no-repeat bottom center/18px auto; }
|
|
|
|
|
.nutrition_camera input { display:none; }
|
|
|
|
|
.nutrition_camera .img_preview { position:relative; overflow:hidden; width:150px; height:120px; margin:0 auto; background:#fff; border:5px solid #fff; border-radius:20px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.2); }
|
|
|
|
|
.nutrition_camera .img_preview label { display:block; width:100%; height:auto; }
|
|
|
|
|
.nutrition_camera .img_preview img { position: absolute; width:100%; height:100%; top: 50%; left: 50%; transform: translate(-50%, -50%); }
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
|
|
|
|
|
<!-- modal-wrapper : 커뮤니티 공유 팝업 -->
|
|
|
|
|
<div id="sharedPop" class="modal-wrapper">
|
|
|
|
|
<div class="modal_content" style="width: calc(100% - 80px);max-width:800px;">
|
|
|
|
|
<div class="center_title">기록을 커뮤니티에 공유하시겠습니까?</div>
|
|
|
|
|
<div class="container_y_n">
|
|
|
|
|
<button class="btn_y_n" onclick="javascript:save.submit_y();" >예</button>
|
|
|
|
|
<button class="btn_y_n" onclick="javascript:save.submit_n();">아니오</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal_layer"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- //modal-wrapper -->
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- wrap -->
|
|
|
|
|
<div class="wrap" id="view_sn_nutrition_powderedmilk">
|
|
|
|
|
<!-- header_sub -->
|
|
|
|
|
@ -38,62 +43,75 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- //nutrition_header_child -->
|
|
|
|
|
|
|
|
|
|
<!-- nutrition_camera -->
|
|
|
|
|
<!--
|
|
|
|
|
<div class="nutrition_camera">
|
|
|
|
|
<div class="nutrition_camera_box">
|
|
|
|
|
<div id="img_preview" class="img_preview">
|
|
|
|
|
<p><label for="img"><img src="<#if model['rm']['append_300_img_file']?exists>${URL_ROOT}/file/get_img.do?mt_file_seq=${model['rm']['append_300_img_file']}<#else>${URL_STATIC_ROOT}/m/img/main/main_cont_img_camera.png</#if>" alt="사진영역" /></label></p>
|
|
|
|
|
</div>
|
|
|
|
|
<input type="file" id="img" name="append_src_img_file">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
-->
|
|
|
|
|
<!-- //nutrition_camera -->
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="nutrition_camera">
|
|
|
|
|
<div class="take_time w_div">
|
|
|
|
|
<div class="img_wrap add_pic_list_wrap">
|
|
|
|
|
<#assign pick_img_index = 0>
|
|
|
|
|
<#if model['lm_img_lst']?has_content>
|
|
|
|
|
<#assign pick_img_index = model['lm_img_lst']?size>
|
|
|
|
|
<div class="add_pic_list_box">
|
|
|
|
|
<#list model['lm_img_lst'] as item_img>
|
|
|
|
|
<div class="add_pic_list_item">
|
|
|
|
|
<div class="input_file_upload">
|
|
|
|
|
<input type="hidden" id="mt_file_seq_${item_img?counter}" name="mt_file_seq" value="${item_img['mt_file_seq']!}" class="form-control ">
|
|
|
|
|
<div id="add_thumb" class="add_thumb">
|
|
|
|
|
<img src="${URL_ROOT}/file/get.do?mt_file_seq=${item_img['mt_file_seq']!}" alt="사진추가하기">
|
|
|
|
|
</div>
|
|
|
|
|
<button type="button" id="" class="ibtn_x off" style="display:inline">삭제</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</#list>
|
|
|
|
|
</div>
|
|
|
|
|
<#else>
|
|
|
|
|
<!--이미지 추가-->
|
|
|
|
|
<div class="add_pic_list_box">
|
|
|
|
|
<div class="add_pic_list_item">
|
|
|
|
|
<div class="input_file_upload">
|
|
|
|
|
<input type="file" id="append_src_img_file_0" name="append_src_img_file_0" accept="image/*;capture=camera" class="upfile"> <button type="button" class="btn_upfile"></button>
|
|
|
|
|
<div id="add_thumb" class="add_thumb">
|
|
|
|
|
<img src="${URL_STATIC_ROOT}/m/img/community/upload_img.jpg" alt="사진추가하기">
|
|
|
|
|
</div>
|
|
|
|
|
<button type="button" id="" class="ibtn_x off">삭제</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<#assign pick_img_index = pick_img_index+1>
|
|
|
|
|
</#if>
|
|
|
|
|
<button type="button" id="add_pic_btn" name="" class="add_pic_btn" onclick="javascript:add_pick_file();">
|
|
|
|
|
사진 추가하기 버튼 <span></span> <span></span>
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- nutrition_camera -->
|
|
|
|
|
<div class="nutrition_camera">
|
|
|
|
|
<div class="nutrition_camera_box">
|
|
|
|
|
<div class="swiper-container">
|
|
|
|
|
<ul class="swiper-wrapper">
|
|
|
|
|
<li class="swiper-slide">
|
|
|
|
|
<div class="input_file_upload img_preview">
|
|
|
|
|
<label for="append_src_img_file01" class="img_label">
|
|
|
|
|
<img id="img_preview01" src="${URL_ROOT}/m/img/main/main_cont_img_camera.png" alt="사진영역" />
|
|
|
|
|
</label>
|
|
|
|
|
<button type="button" id="btn_delImg01" class="ibtn_x" style="display:none">삭제</button>
|
|
|
|
|
<input type="radio" id="append_src_img_star01" name="append_src_img_star" class="star">
|
|
|
|
|
<label for="append_src_img_star01">
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-star-fill" viewBox="0 0 16 16">
|
|
|
|
|
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
|
|
|
|
|
</svg>
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="swiper-slide">
|
|
|
|
|
<div class="input_file_upload img_preview">
|
|
|
|
|
<label for="append_src_img_file02" class="img_label">
|
|
|
|
|
<img id="img_preview02" src="${URL_ROOT}/m/img/main/main_cont_img_camera.png" alt="사진영역" />
|
|
|
|
|
</label>
|
|
|
|
|
<button type="button" id="btn_delImg02" class="ibtn_x" style="display:none">삭제</button>
|
|
|
|
|
<input type="radio" id="append_src_img_star02" name="append_src_img_star" class="star">
|
|
|
|
|
<label for="append_src_img_star02">
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-star-fill" viewBox="0 0 16 16">
|
|
|
|
|
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
|
|
|
|
|
</svg>
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="swiper-slide">
|
|
|
|
|
<div class="input_file_upload img_preview">
|
|
|
|
|
<label for="append_src_img_file03" class="img_label">
|
|
|
|
|
<img id="img_preview03" src="${URL_ROOT}/m/img/main/main_cont_img_camera.png" alt="사진영역" />
|
|
|
|
|
</label>
|
|
|
|
|
<button type="button" id="btn_delImg03" class="ibtn_x" style="display:none">삭제</button>
|
|
|
|
|
<input type="radio" id="append_src_img_star03" name="append_src_img_star" class="star">
|
|
|
|
|
<label for="append_src_img_star03">
|
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-star-fill" viewBox="0 0 16 16">
|
|
|
|
|
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
|
|
|
|
|
</svg>
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
<input type="file" id="append_src_img_file01" name="append_nutrition_file1">
|
|
|
|
|
<input type="file" id="append_src_img_file02" name="append_nutrition_file2">
|
|
|
|
|
<input type="file" id="append_src_img_file03" name="append_nutrition_file3">
|
|
|
|
|
|
|
|
|
|
<input type="hidden" id="mt_file_seq01" name="mt_file_seq1">
|
|
|
|
|
<input type="hidden" id="mt_file_seq02" name="mt_file_seq2">
|
|
|
|
|
<input type="hidden" id="mt_file_seq03" name="mt_file_seq3">
|
|
|
|
|
|
|
|
|
|
<input type="hidden" id="repReordImg" name="repReordImg" value='1' />
|
|
|
|
|
<div class="pagination_container">
|
|
|
|
|
<div class="swiper-pagination"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- //nutrition_camera -->
|
|
|
|
|
<div class="description1">
|
|
|
|
|
* 표시된 사진이 공유 시 대표사진으로 설정됩니다.
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="set_list_wrap" style="display:none">
|
|
|
|
|
<#list model['music_list'] as item>
|
|
|
|
|
@ -112,27 +130,20 @@
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
|
|
|
|
var pick_img_index = "${pick_img_index!'0'}";
|
|
|
|
|
function add_pick_file(){
|
|
|
|
|
if($(".add_pic_list_item").length > 2) {
|
|
|
|
|
Swal.fire({text: '이미지는 3개 까지만 가능합니다.'});
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
var add_pic_tags = '<div class="add_pic_list_item">' +
|
|
|
|
|
'<div class="input_file_upload">' +
|
|
|
|
|
'<input type="file" id="append_src_img_file_' + pick_img_index + '" name="append_src_img_file_' + pick_img_index + '" accept="image/*;capture=camera" class="upfile">' +
|
|
|
|
|
'<button type="button" class="btn_upfile"></button>' +
|
|
|
|
|
'<div id="add_thumb" class="add_thumb">' +
|
|
|
|
|
'<img src="${URL_STATIC_ROOT}/m/img/community/upload_img.jpg" alt="사진추가하기">' +
|
|
|
|
|
'</div>'+
|
|
|
|
|
'<button type="button" id="" class="ibtn_x off">삭제</button> ' +
|
|
|
|
|
'</div>' +
|
|
|
|
|
'</div>';
|
|
|
|
|
|
|
|
|
|
$(".add_pic_list_box").append(add_pic_tags);
|
|
|
|
|
$('#pick_img_index').val(++pick_img_index);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var swiper = new Swiper('.swiper-container', {
|
|
|
|
|
slidesPerView: 'auto',
|
|
|
|
|
slidesPerGroup: 1,
|
|
|
|
|
spaceBetween: 10,
|
|
|
|
|
|
|
|
|
|
loopFillGroupWithBlank: true,
|
|
|
|
|
|
|
|
|
|
pagination: {
|
|
|
|
|
loop: false,
|
|
|
|
|
el: '.swiper-pagination',
|
|
|
|
|
clickable: true,
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 클래스 추가 삭제시
|
|
|
|
|
$(".li_check>li").click(function(e) {
|
|
|
|
|
e.stopPropagation();
|
|
|
|
|
@ -143,51 +154,78 @@
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
/*********사진 추가*********/
|
|
|
|
|
/*********Camera 및 사진 업로드*********/
|
|
|
|
|
$(function() {
|
|
|
|
|
// File Upload + Preview
|
|
|
|
|
$(document).on('click', '.input_file_upload .btn_upfile', function(){
|
|
|
|
|
$(this).siblings('.upfile').trigger('click');
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
$(document).on('click', '.input_file_upload .ibtn_x', function(){
|
|
|
|
|
$(this).parent().parent().remove();
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
$(document).on('change', ".input_file_upload input[type=file]", function(){
|
|
|
|
|
var file = $(this)[0].files[0];
|
|
|
|
|
//console.log(file.name + "\n" + file.type + "\n" + file.size + "\n" + file.lastModifiedDate); // upfile var
|
|
|
|
|
if ($(this).hasClass('file_mypage')) {
|
|
|
|
|
$(this).talkImage(file, '.add_thumb');
|
|
|
|
|
}else{
|
|
|
|
|
$(this).displayImage(file, '.add_thumb');
|
|
|
|
|
} $(this).siblings('.add_thumb').removeClass('off').siblings('.ibtn_x').removeClass('off');
|
|
|
|
|
// 사진 삭제
|
|
|
|
|
$(document).on('click', '#btn_delImg01, #btn_delImg02, #btn_delImg03', function(){
|
|
|
|
|
var imgSeq = this.id.replace('btn_delImg','');
|
|
|
|
|
|
|
|
|
|
if(Number($('#repReordImg').val()) == Number(imgSeq) ) {
|
|
|
|
|
Swal.fire({text: '대표이미지를 변경후 삭제해 주세요!'});
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
$("#append_src_img_file"+imgSeq).val('');
|
|
|
|
|
$('#img_preview'+imgSeq).attr('src', "${URL_ROOT}/m/img/main/main_cont_img_camera.png");
|
|
|
|
|
$(this).hide();
|
|
|
|
|
|
|
|
|
|
// 파일이 번호가 있으면 삭제
|
|
|
|
|
if( $('#mt_file_seq'+imgSeq).val() !="") {
|
|
|
|
|
$.ajax({
|
|
|
|
|
url:'${URL_ROOT}/m/bf_daily_nutrition/ajax_delete_bf_daily_nutrition_img.do?1=1',
|
|
|
|
|
type:'get',
|
|
|
|
|
data: {
|
|
|
|
|
"dn_no" : ${model['rm']['dn_no']!}
|
|
|
|
|
,"file_tp" : '10'
|
|
|
|
|
,"file_seq": $('#mt_file_seq'+imgSeq).val()
|
|
|
|
|
,"repReordImg" : $('#repReordImg').val()
|
|
|
|
|
},
|
|
|
|
|
dataType:'json',
|
|
|
|
|
error:function(request,status,error){
|
|
|
|
|
console.log(status);
|
|
|
|
|
is_loading = false;
|
|
|
|
|
},
|
|
|
|
|
success:function(result){
|
|
|
|
|
console.log(result);
|
|
|
|
|
is_loading = false;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
$(".bi-star-fill").on('click', function () {
|
|
|
|
|
$("#repReordImg").val(Number(this.parentNode.htmlFor.replace('append_src_img_star0','')));
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$.fn.extend({
|
|
|
|
|
// Upload preview Function
|
|
|
|
|
displayImage : function(file, classname) {
|
|
|
|
|
if (typeof FileReader !== "undefined") {
|
|
|
|
|
|
|
|
|
|
$(this).siblings(classname).find('img').remove();
|
|
|
|
|
var container = $(this).siblings(classname),
|
|
|
|
|
img = document.createElement("img"),
|
|
|
|
|
reader;
|
|
|
|
|
img.setAttribute('width', '100%'),
|
|
|
|
|
img.setAttribute('height', '100%'),
|
|
|
|
|
|
|
|
|
|
container.append(img);
|
|
|
|
|
reader = new FileReader();
|
|
|
|
|
reader.onload = (function (theImg) {
|
|
|
|
|
return function (evt) {
|
|
|
|
|
theImg.src = evt.target.result;
|
|
|
|
|
};
|
|
|
|
|
}(img));
|
|
|
|
|
reader.readAsDataURL(file);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// nutrition_camera 이미지 업로드
|
|
|
|
|
$('#append_src_img_file01,#append_src_img_file02, #append_src_img_file03').on('change', function () {
|
|
|
|
|
var imgSeq = this.id.replace('append_src_img_file','');
|
|
|
|
|
ext = $(this).val().split('.').pop().toLowerCase(); //확장자
|
|
|
|
|
//배열에 추출한 확장자가 존재하는지 체크
|
|
|
|
|
if ($.inArray(ext, ['gif', 'png', 'jpg', 'jpeg']) == -1) {
|
|
|
|
|
resetFormElement($(this)); //폼 초기화
|
|
|
|
|
window.alert('이미지 파일이 아닙니다! (gif, png, jpg, jpeg 만 업로드 가능)');
|
|
|
|
|
} else {
|
|
|
|
|
file = this.files[0];
|
|
|
|
|
blobURL = window.URL.createObjectURL(file);
|
|
|
|
|
$('#img_preview'+imgSeq).attr('src', blobURL);
|
|
|
|
|
$('.img_preview').slideDown(); //업로드한 이미지 미리보기
|
|
|
|
|
$(this).slideUp(); //파일 양식 감춤
|
|
|
|
|
$("#btn_delImg"+imgSeq).show();
|
|
|
|
|
// $("#layer_nutirition_tp").show();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
$("#append_src_img_star01").attr('checked', true);
|
|
|
|
|
<#if model['lm_img_lst']? has_content>
|
|
|
|
|
<#list model['lm_img_lst'] as item>
|
|
|
|
|
$("#img_preview0${item?counter}").attr("src", "${URL_ROOT}/file/get.do?mt_file_seq=${item['mt_file_seq']!}");
|
|
|
|
|
$("#mt_file_seq0${item?counter}").val("${item['mt_file_seq']!}");
|
|
|
|
|
$("#btn_delImg0${item?counter}").show();
|
|
|
|
|
<#if item['rep_img_yn']! == 'Y' >
|
|
|
|
|
$("#append_src_img_star0${item?counter}").attr('checked', true);
|
|
|
|
|
</#if>
|
|
|
|
|
</#list>
|
|
|
|
|
</#if>
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
kyebyungha
3 years ago