|
|
|
@extends('layouts.admin')
|
|
|
|
|
|
|
|
@section('content')
|
|
|
|
<form id="writeForm" method="post" accept-charset="utf-8" enctype="multipart/form-data" action="{{ route('cms.board.store', null, false) }}" onsubmit="return false;">
|
|
|
|
<input type="hidden" name="_token" value="{{ csrf_token() }}" />
|
|
|
|
<input type="hidden" name="mode" value="{{ $data->mode }}" />
|
|
|
|
<input type="hidden" name="code" value="{{ $data->code }}" />
|
|
|
|
<input type="hidden" name="board_id" value="{{ $data->board_id }}" />
|
|
|
|
<input type="hidden" name="uid" value="{{ $data->uid }}" />
|
|
|
|
<input type="hidden" name="category" value="{{ $data->category }}" />
|
|
|
|
<div class="card card-default">
|
|
|
|
<div class="card-body">
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="input-subject">제목</label>
|
|
|
|
<input type="text" class="form-control" name="subject" id="input-subject" required value="{{ $data->subject }}" />
|
|
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="input-content">내용</label>
|
|
|
|
<div id="editor"></div>
|
|
|
|
<textarea class="form-control autosize" name="content" id="input-content" rows="8" placeholder="내용을 입력해 주세요." style="display:none;">{{ $data->content }}</textarea>
|
|
|
|
</div>
|
|
|
|
@if($data->code == 'news')
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="input-image">목록 이미지</label>
|
|
|
|
<div class="custom-file">
|
|
|
|
<input type="file" name="image" id="input-image" class="custom-file-input" accept="image/gif,image/jpeg,image/png">
|
|
|
|
<label class="custom-file-label" for="input-image">이미지 선택</label>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@if ($data->image)
|
|
|
|
<div class="form-group">
|
|
|
|
<div class="form-group-box list-image-del">
|
|
|
|
<i class="fas fa-trash" title="삭제"></i>
|
|
|
|
<a href="/image/{{ $data->image }}" data-fancybox="gallery-list"><span class="prev-image">{{ $data->asset->orgin_name }}</span></a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@endif
|
|
|
|
@endif
|
|
|
|
<div class="form-group" style="position:relative;">
|
|
|
|
<label for="form-control" id="fileBtn">첨부파일</label>
|
|
|
|
<span class="fileSize mobileNone">(<em id="fileSize">0</em>)</span>
|
|
|
|
<div id="dropzone" class="frame-wrap clearfix">
|
|
|
|
<div id="dropzoneDesc" class="dropzone-desc">여기를 클릭하거나 파일을 마우스로 드래그하여 업로드할 수 있습니다.</div>
|
|
|
|
<input type="file" name="selectFiles[]" id="selectFiles" class="dropzone-file" multiple="multiple" />
|
|
|
|
<div id="dropzoneList" class="dropzone-list">
|
|
|
|
<ul id="previewFiles" class="preview-files">
|
|
|
|
@if ($data->assets)
|
|
|
|
@foreach ($data->assets as $i => $asset)
|
|
|
|
<li class="old-file" data-uid="{{ $asset->uid }}" data-size="{{ $asset->asset->size }}">
|
|
|
|
<i class="fas fa-trash" title="삭제"></i>
|
|
|
|
@if($asset->asset->width && $asset->asset->height)
|
|
|
|
<a href="{{ route('image', [$asset->uid], false) }}" class="file-item" data-fancybox="gallery">{{ $asset->asset->orgin_name }} ({{ human_filesize($asset->asset->size) }})</a>
|
|
|
|
@else
|
|
|
|
<a href="{{ route('download', [$asset->uid], false) }}" class="file-item">{{ $asset->asset->orgin_name }} ({{ human_filesize($asset->asset->size) }})</a>
|
|
|
|
@endif
|
|
|
|
</li>
|
|
|
|
@endforeach
|
|
|
|
@endif
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="notice">옵션 설정</label>
|
|
|
|
<div class="form-group-box">
|
|
|
|
<div class="custom-control custom-checkbox custom-control-inline">
|
|
|
|
<input type="checkbox" id="notice" class="custom-control-input" name="notice" value="1" {{ $data->notice ? 'checked="checked "' : '' }}/>
|
|
|
|
<label for="notice" class="custom-control-label">공지글</label>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@if($data->uid)
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="view_count">조회수</label>
|
|
|
|
<input type="text" class="form-control" id="view_count" disabled="disabled" value="{{ $data->view_count }}" />
|
|
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="input-name">작성자</label>
|
|
|
|
<input type="text" class="form-control" name="name" id="input-name" disabled="disabled" value="{{ $data->name }}" />
|
|
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
|
|
<label for="created_at">작성일시</label>
|
|
|
|
<input type="text" class="form-control" id="created_at" disabled="disabled" value="{{ $data->created_at }}" />
|
|
|
|
</div>
|
|
|
|
@endif
|
|
|
|
</div>
|
|
|
|
<div class="card-footer">
|
|
|
|
<div class="row">
|
|
|
|
<span>
|
|
|
|
<button type="submit" class="btn btn-success"><i class="fas fa-pen"></i> @if($data->mode == 'modify') 수정 @else 등록 @endif</button>
|
|
|
|
@if($data->mode == 'modify')
|
|
|
|
<a href="{{ route('cms.board.delete', null, false) }}" class="btn btn-secondary ml-2 btn-delete"><i class="far fa-trash-alt"></i> 삭제</a>
|
|
|
|
@endif
|
|
|
|
</span>
|
|
|
|
<span><a href="javascript:;" onclick="gotoList();" class="btn btn-primary btn-list ml-2"><i class="fas fa-list-alt"></i> 목록 </a></span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
@stop
|
|
|
|
|
|
|
|
@push('styles')
|
|
|
|
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/summernote@0.8.20/dist/summernote-bs4.min.css">
|
|
|
|
@endpush
|
|
|
|
|
|
|
|
@push('scripts')
|
|
|
|
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/summernote@0.8.20/dist/summernote-bs4.min.js"></script>
|
|
|
|
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/summernote@0.8.20/dist/lang/summernote-ko-KR.min.js"></script>
|
|
|
|
<script type="text/javascript">
|
|
|
|
function gotoList() {
|
|
|
|
window.location.href = '{{ route('cms.board.list', [$data->code], false) }}';
|
|
|
|
}
|
|
|
|
|
|
|
|
var fileIndex = 0; // 파일 번호
|
|
|
|
var totalSize = 0; // 전체 파일용량
|
|
|
|
var fileList = []; // 파일 목록
|
|
|
|
var sizeList = []; // 파일용량 목록
|
|
|
|
|
|
|
|
// 드래그앤드롭 파일 첨부
|
|
|
|
function fileDropDown() {
|
|
|
|
var dropzone = $("#dropzone");
|
|
|
|
dropzone.on('dragenter', function (e) {
|
|
|
|
e.stopPropagation();
|
|
|
|
e.preventDefault();
|
|
|
|
dropzone.css({'background-color': '#FFEFEE', 'border': '1px dashed #999'});
|
|
|
|
});
|
|
|
|
dropzone.on('dragleave', function (e) {
|
|
|
|
e.stopPropagation();
|
|
|
|
e.preventDefault();
|
|
|
|
dropzone.css({'background-color': '#F3F3F3', 'border': '1px solid #e5e5e5'});
|
|
|
|
});
|
|
|
|
dropzone.on('dragover', function (e) {
|
|
|
|
e.stopPropagation();
|
|
|
|
e.preventDefault();
|
|
|
|
dropzone.css({'background-color': '#FFEFEE', 'border': '1px dashed #999'});
|
|
|
|
});
|
|
|
|
dropzone.on('drop', function (e) {
|
|
|
|
e.preventDefault();
|
|
|
|
dropzone.css({'background-color': '#F3F3F3', 'border': '1px solid #e5e5e5'});
|
|
|
|
|
|
|
|
var files = e.originalEvent.dataTransfer.files;
|
|
|
|
if (files != null) {
|
|
|
|
if (files.length < 1) {
|
|
|
|
console.log("파일이 선택되지 않았습니다.");
|
|
|
|
return false;
|
|
|
|
} else {
|
|
|
|
selectFiles(files);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
console.log("ERROR!!");
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function toggleFileBox() {
|
|
|
|
if ($('#previewFiles li').length > 0) {
|
|
|
|
$('.dropzone-desc').hide();
|
|
|
|
$('.dropzone-list').show();
|
|
|
|
} else {
|
|
|
|
$('.dropzone-desc').show();
|
|
|
|
$('.dropzone-list').hide();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function setFileSize() {
|
|
|
|
var strSize = getFileSize(totalSize);
|
|
|
|
|
|
|
|
$('#fileSize').html(strSize);
|
|
|
|
}
|
|
|
|
|
|
|
|
// 첨부파일 추가
|
|
|
|
function addFile(fSource, fName, fSize, isImage) {
|
|
|
|
var appendHtml = $('<li class="new-file" data-index="'+ fileIndex +'"><i class="fas fa-trash"></i></li>');
|
|
|
|
|
|
|
|
if (isImage !== -1) {
|
|
|
|
appendHtml.append('<a href="#" class="file-item" data-fancybox="gallery">'+ fName +' ('+ getFileSize(fSize) +')</a>');
|
|
|
|
$('#previewFiles').append(appendHtml);
|
|
|
|
|
|
|
|
var reader = new FileReader();
|
|
|
|
reader.onload = function(e) {
|
|
|
|
appendHtml.find('a').attr('href', e.target.result);
|
|
|
|
};
|
|
|
|
reader.readAsDataURL(fSource);
|
|
|
|
} else {
|
|
|
|
appendHtml.append('<span class="file-item">'+ fName +' ('+ getFileSize(fSize) +')</span>');
|
|
|
|
$('#previewFiles').append(appendHtml);
|
|
|
|
}
|
|
|
|
|
|
|
|
totalSize += fSize;
|
|
|
|
|
|
|
|
sizeList[fileIndex] = fSize;
|
|
|
|
fileList[fileIndex] = fSource;
|
|
|
|
|
|
|
|
fileIndex++;
|
|
|
|
|
|
|
|
setFileSize();
|
|
|
|
toggleFileBox();
|
|
|
|
}
|
|
|
|
|
|
|
|
// 첨부파일 션택 완료
|
|
|
|
function selectFiles(files) {
|
|
|
|
if (files == null) {
|
|
|
|
console.log('파일이 선택되지 않았습니다.');
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
for (var i = 0; i < files.length; i++) {
|
|
|
|
var fileName = files[i].name;
|
|
|
|
var fileNameArr = fileName.split('\.');
|
|
|
|
var fileExtension = fileNameArr[fileNameArr.length - 1];
|
|
|
|
var fileSize = files[i].size;
|
|
|
|
|
|
|
|
if (fileSize <= 0) {
|
|
|
|
alert('비어 있는 파일입니다.');
|
|
|
|
return;
|
|
|
|
} else if ($.inArray(fileExtension, extExecutes.split(',')) !== -1) {
|
|
|
|
alert('업로드가 허용되지 않는 파일입니다.');
|
|
|
|
} else {
|
|
|
|
addFile(files[i], fileName, fileSize, $.inArray(fileExtension, extImages.split(',')));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
$(document).ready(function() {
|
|
|
|
fileDropDown();
|
|
|
|
|
|
|
|
$('#selectFiles').bind('change', function() {
|
|
|
|
selectFiles(this.files);
|
|
|
|
$(this).val('');
|
|
|
|
});
|
|
|
|
|
|
|
|
$('#fileBtn').click(function() {
|
|
|
|
$('#selectFiles').click();
|
|
|
|
});
|
|
|
|
|
|
|
|
if ($('.old-file').length) {
|
|
|
|
$('.old-file').each(function() {
|
|
|
|
totalSize += parseInt($(this).data('size'));
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
setFileSize();
|
|
|
|
toggleFileBox();
|
|
|
|
|
|
|
|
// 드래그존 클릭시 파일 선택
|
|
|
|
$('#dropzone').on('click', function(e) {
|
|
|
|
var targetID = e.target.id;
|
|
|
|
console.log(e.target);
|
|
|
|
if (targetID == 'dropzone' || targetID == 'dropzoneDesc' || targetID == 'dropzoneList' || targetID == 'previewFiles') {
|
|
|
|
$('#selectFiles').click();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
// 파일 삭제
|
|
|
|
$('.list-image-del').on('click', '.fa-trash', function(e) {
|
|
|
|
var objItem = $(this).parent();
|
|
|
|
|
|
|
|
objItem.remove();
|
|
|
|
|
|
|
|
$('#writeForm').append('<input type="hidden" name="delImage" value="1" />');
|
|
|
|
});
|
|
|
|
|
|
|
|
// 파일 삭제
|
|
|
|
$('#previewFiles').on('click', '.fa-trash', function(e) {
|
|
|
|
var objItem = $(this).parent();
|
|
|
|
|
|
|
|
objItem.remove();
|
|
|
|
|
|
|
|
if (objItem.hasClass('old-file')) {
|
|
|
|
$('#writeForm').append('<input type="hidden" name="delFiles[]" value="'+ objItem.data('uid') +'" />');
|
|
|
|
totalSize -= parseInt(objItem.data('size'));
|
|
|
|
} else {
|
|
|
|
var fIndex = objItem.data('index');
|
|
|
|
|
|
|
|
totalSize -= parseInt(sizeList[fIndex]);
|
|
|
|
|
|
|
|
delete fileList[fIndex];
|
|
|
|
delete sizeList[fIndex];
|
|
|
|
}
|
|
|
|
|
|
|
|
setFileSize();
|
|
|
|
toggleFileBox();
|
|
|
|
});
|
|
|
|
|
|
|
|
$('#editor').html($('textarea[name=content]').val());
|
|
|
|
var $editor = $('#editor').summernote({
|
|
|
|
height: 300,
|
|
|
|
placeholder: '내용을 입력해 주세요.',
|
|
|
|
dialogsInBody: true,
|
|
|
|
dialogsFade: true,
|
|
|
|
codeviewFilter: false,
|
|
|
|
codeviewIframeFilter: true,
|
|
|
|
lang: 'ko-KR',
|
|
|
|
toolbar: [
|
|
|
|
['fontsize', ['fontsize']],
|
|
|
|
['font', ['bold', 'italic', 'underline']],
|
|
|
|
['font', ['strikethrough', 'superscript', 'subscript']],
|
|
|
|
['color', ['color']],
|
|
|
|
['para', ['ul', 'ol', 'paragraph', 'height']],
|
|
|
|
['insert', ['table', 'picture', 'video', 'link', 'hr']],
|
|
|
|
['font', ['undo', 'redo', 'clear']],
|
|
|
|
['view', ['fullscreen', 'codeview', 'help']]
|
|
|
|
],
|
|
|
|
callbacks: {
|
|
|
|
onImageUpload: function (files) {
|
|
|
|
for (var i = 0; i < files.length; i++) {
|
|
|
|
//if (i > 10) {
|
|
|
|
// alert('Only 10 images can be registered.');
|
|
|
|
// return;
|
|
|
|
//}
|
|
|
|
sendEditorImage(this, files[i]);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
onPaste: function (e) {
|
|
|
|
var clipboardData = e.originalEvent.clipboardData;
|
|
|
|
if (clipboardData && clipboardData.items && clipboardData.items.length) {
|
|
|
|
var item = clipboardData.items[0];
|
|
|
|
if (item.kind === 'file' && item.type.indexOf('image/') !== -1) {
|
|
|
|
e.preventDefault();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
if ($('input[name=subject]').length) {
|
|
|
|
$('input[name=subject]').focus();
|
|
|
|
} else if ($('#editor').length) {
|
|
|
|
$('#editor').summernote('focus');
|
|
|
|
} else if ($('textarea[name=content]').length) {
|
|
|
|
$('textarea[name=content]').focus();
|
|
|
|
}
|
|
|
|
|
|
|
|
$('#writeForm').submit(function (e) {
|
|
|
|
e.preventDefault();
|
|
|
|
|
|
|
|
if ($('#input-subject').length) {
|
|
|
|
if (!$('#input-subject').checkEmpty('제목을 입력해 주세요.')) return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
if ($('#editor').length) {
|
|
|
|
$('#input-content').val($('#editor').summernote('code'));
|
|
|
|
if ($('#editor').summernote('isEmpty')) {
|
|
|
|
alert('내용을 입력해 주세요.');
|
|
|
|
$('#editor').summernote('focus');
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
} else if (!$('#input-content').checkEmpty('내용을 입력해 주세요.')) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
var formData = new FormData(this);
|
|
|
|
var uploadFiles = Object.keys(fileList);
|
|
|
|
for (var i = 0; i < uploadFiles.length; i++) {
|
|
|
|
formData.append('files[]', fileList[uploadFiles[i]]);
|
|
|
|
}
|
|
|
|
|
|
|
|
$.ajax({
|
|
|
|
url : $(this).attr('action'),
|
|
|
|
type : 'POST',
|
|
|
|
data : formData,
|
|
|
|
enctype : 'multipart/form-data',
|
|
|
|
processData : false,
|
|
|
|
contentType : false,
|
|
|
|
dataType : 'json',
|
|
|
|
cache : false,
|
|
|
|
async : false,
|
|
|
|
success: function(result) {
|
|
|
|
if (result.code == 'success') {
|
|
|
|
if ($(this).find("input[name='uid']").val()) {
|
|
|
|
window.location.reload();
|
|
|
|
} else {
|
|
|
|
gotoList();
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
alert(result.message);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
$('.btn-delete').click(function() {
|
|
|
|
if(confirm('게시글을 삭제하시겠습니까?')) {
|
|
|
|
$.post($(this).attr('href'), {'uid': $('#writeForm input[name=uid]').val() }, function (result) {
|
|
|
|
if (result.code = 'success') {
|
|
|
|
gotoList();
|
|
|
|
} else {
|
|
|
|
alert(result.message);
|
|
|
|
}
|
|
|
|
}).fail(function(result) {
|
|
|
|
var data = result.responseJSON;
|
|
|
|
if (!data.success) {
|
|
|
|
alert(data.message);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
});
|
|
|
|
</script>
|
|
|
|
@endpush
|