Files
cm-app-adm-content/application/views/pages/media/music.php

398 lines
19 KiB
PHP

<div class="content-header row">
<h1> 교회정보 </h1>
</div>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
<style>
.modal-dialog {
margin: 30px auto;
}
.modal-body {
position: relative;
padding: 0px;
}
.close {
position: absolute;
right: -30px;
top: 0;
z-index: 999;
font-size: 2rem;
font-weight: normal;
color: #fff;
opacity: 1;
}
.operate-btn {
cursor: pointer
}
</style>
<div id="dsItemListTableTool">
<div class="form-inline" role="form">
<input type="text" class="form-control keyword-search-input" name="keyword">
<button type="submit" class="btn btn-primary podbbang-search-btn">검색</button>
</div>
</div>
<table class="order-table fill table-condensed cm-place-table" data-page-size="50" data-page-list="[50,100,250,500,1000]" data-toolbar="#dsItemListTableTool" data-method="post" data-side-pagination="server" data-pagination="true" data-show-export="true" data-export-types="['excel','sheet']" data-show-refresh="true" data-show-columns="true" data-pagination-v-align="both" data-click-to-select="true" data-single-select="true" data-sort-name="vcDateCreated" data-sort-order="desc" data-url="/crawls/place/church_table">
<thead>
<tr>
<th data-field="state" data-checkbox="true"></th>
<th data-field="Name" data-align="left">교회명</th>
<th data-field="Pastor" data-align="left">담임목사</th>
<th data-field="Facebook" data-align="left" data-formatter="snsFormatter">SNS</th>
<th data-field="RoadAddress" data-align="left" data-formatter="addressFormatter">주소</th>
<th data-field="Phone" data-align="left">전화</th>
<th data-field="CreatedAt" data-align="left">등록시간</th>
<th data-field="CreatedAt" data-formatter="operateFormatter" data-event="churchEditFormatter">등록시간</th>
</tr>
</thead>
</table>
<div class="modal cm-modal-map" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title cm-modal-map-title">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div id="cm-map" style="width:585px;height:400px;margin-left:7px;"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade cm-modal-church" role="dialog" aria-labelledby="cm-modal-church">
<div class="modal-dialog modal-md" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">교회정보</h4>
</div>
<div class="modal-body">
<div class="col-sm-12">
<form class="form-horizontal">
<input type="hidden" class="cm-nid">
<div class="form-group"></div>
<div class="form-group">
<label class="col-sm-2 control-label">교회명</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-name">
</div>
<label class="col-sm-2 control-label">담임목사</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-pastor">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">주소</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-address">
</div>
<label class="col-sm-2 control-label">전화</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-phone">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">홈페이지</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-homepage">
</div>
<label class="col-sm-2 control-label">유튜브</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-youtube">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">트위터계정</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-twitter">
</div>
<label class="col-sm-2 control-label">페북계정</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-facebook">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">카카오계정</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-kakao">
</div>
<label class="col-sm-2 control-label">인스타계정</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-instagram">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">네이버카페</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-navercafe">
</div>
<label class="col-sm-2 control-label">다음카페</label>
<div class="col-sm-4">
<input type="text" class="form-control cm-church-daumcafe">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">예배시간 </label>
<a class="btn btn-default col-sm-2 pull-left cm-church-serviceinfo-add">입력추가</a>
</div>
<div class="form-group cm-church-serviceinfo" style="display:none">
<div class="col-sm-3">
<input type="text" class="form-control cm-church-servicename" placeholder="예배명">
</div>
<div class="col-sm-3">
<select type="btn btn-default" class="form-control cm-church-dayname">
<option value="">요일</option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
</select>
</div>
<div class="col-sm-3">
<select type="btn btn-default" class="form-control cm-church-servicechapter">
<option value="">회차</option>
<option value="1부">1</option>
<option value="2부">2</option>
<option value="3부">3</option>
<option value="4부">4</option>
<option value="5부">5</option>
<option value="6부">6</option>
<option value="7부">7</option>
</select>
</div>
<div class="col-sm-3" style="position: relative; z-index: 100000;">
<input type="text" class="form-control cm-church-servicetime">
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer selamat-text-center">
<button type="button" class="btn btn-default" data-dismiss="modal">취소</button>
<button type="button" class="btn btn-primary cm-church-save">저장</button>
</div>
</div>
</div>
</div>
<script src="/assets/alt/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="/assets/alt/bootstrap/js/bootstrap.min.js"></script>
<script src="/assets/js/select2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.0/bootstrap-table.min.js" integrity="sha256-eXHLyyVI+v6X1wbfg9NB05IWqOqY4E9185nHZgeDIhg=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.0/locale/bootstrap-table-ko-KR.min.js" integrity="sha256-Yb64uCOu811SJG/6YP+DHrXfkk0cEq9FI2aDHKrXsFA=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js" integrity="sha256-bqVeqGdJ7h/lYPq6xrPv/YGzMEb6dNxlfiTUHSgRCp8=" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=b9da5412e3022dcc1e02c67c53e6269e"></script>
<script>
$(function() {
$('.cm-church-serviceinfo-add').on('click', function(e) {
var infoSample = $('.cm-church-serviceinfo').eq(0)
var info = infoSample.clone(true)
info.addClass('cm-church-serviceinfo-data')
infoSample.after(info)
info.find('.cm-church-servicetime').timepicker({
timeFormat: 'HH:mm',
interval: 10,
minTime: '1',
maxTime: '11:50pm',
defaultTime: '10',
startTime: '5:00',
dynamic: false,
dropdown: true,
scrollbar: true
});
info.show()
})
tableActionButtons = $('.table-action-buttons')
var categoryOptions = tableActionButtons.find('select option');
addressFormatter = function(value, row, index) {
// return '<a href="https://map.naver.com/v5/search/'+encodeURIComponent(row.Name)+'?c='+row.Y+','+row.X+'" target="_blank">' + (row.RoadAddress ? row.RoadAddress : row.Address) + '</a>'
return '<a href="https://www.google.co.kr/maps/search/' + row.Address + '/@' + row.Y + ',' + row.X + ',20.75z?hl=ko" target="_blank" class="cm-address2map" data-place-id="' + index + '">' + row.Address + '</a>'
}
operateFormatter = function(value, row, index) {
var operateBtns = [
'<a class="edit operate-btn" title="Edit" data-place-id="' + index + '">',
'<i class="glyphicon glyphicon-edit"></i>',
'</a> ',
'<a class="remove operate-btn" title="Remove">',
'<i class="glyphicon glyphicon-remove"></i>',
'</a>'
];
return operateBtns.join('');
}
snsFormatter = function(value, row, index) {
var operateBtns = [
row.Youtube ? '<a class="btn btn-default">YT</a> ' : '',
row.Facebook ? '<a class="btn btn-default">FB</a> ' : '',
row.Instagram ? '<a class="btn btn-default">Inst</a> ' : '',
row.Kakao ? '<a class="btn btn-default">Kakao</a> ' : '',
row.Twitter ? '<a class="btn btn-default">Twit</a>' : ''
];
return operateBtns.join('');
}
var table = $('.cm-place-table').bootstrapTable()
table.on('load-success.bs.table', function(e, data) {
$('.cm-address2map').on('click', function(e) {
e.preventDefault();
var place = table.bootstrapTable('getData')[$(this).data('place-id')];
$('.cm-modal-map-title').html('<strong style="color:blue">' + place.Name + '</strong> : ' + $(this).text())
$('.cm-modal-map').modal('show')
var container = $('#cm-map').get(0); //지도를 담을 영역의 DOM 레퍼런스
var options = { //지도를 생성할 때 필요한 기본 옵션
center: new kakao.maps.LatLng(place.Y, place.X), //지도의 중심좌표.
level: 3 //지도의 레벨(확대, 축소 정도)
};
var map = new kakao.maps.Map(container, options); //지도 생성 및 객체 리턴
var markerPosition = new kakao.maps.LatLng(place.Y, place.X);
var marker = new kakao.maps.Marker({
position: markerPosition
});
marker.setMap(map);
})
$('.table-action-btn').each(function(i, n) {
$(n).find('select').on('change', function() {
$.post('/crawls/podbbang/category', {
category: this.value,
id: table.bootstrapTable('getData')[$(n).parents('tr:eq(0)').data('index')].Id
}, function(res) {
table.bootstrapTable('refresh', {
query: {
keyword: searchInput.val(),
category: $('.podbbang-crawl-category').val()
}
})
})
})
//.find('option[value="' + (data.rows[i] != undefined && data.rows[i].Category != 0 ? data.rows[i].Category : '') + '"]').get(0).selected = true;
})
$('.edit.operate-btn').on('click', function() {
var place = table.bootstrapTable('getData')[$(this).data('place-id')];
console.log(place)
var frm = $('.cm-modal-church').modal('show').find('.cm-nid').val(place.NId).parent()
frm.find('.cm-church-name').val(place.Name)
frm.find('.cm-church-phone').val(place.Phone)
frm.find('.cm-church-address').val(place.Address)
frm.find('.cm-church-pastor').val(place.Pastor)
frm.find('.cm-church-homepage').val(place.Homepage)
frm.find('.cm-church-twitter').val(place.Twitter)
frm.find('.cm-church-facebook').val(place.Facebook)
frm.find('.cm-church-kakao').val(place.Kakao)
frm.find('.cm-church-instagram').val(place.Instagram)
frm.find('.cm-church-navercafe').val(place.NaverCafe)
frm.find('.cm-church-daumcafe').val(place.DaumCafe)
frm.find('.cm-church-youtube').val(place.Youtube)
for(var i in place.Services) {
if(i > 0) $('.cm-church-serviceinfo-add').trigger('click')
var info = $('.cm-church-serviceinfo').next().eq(0)
info.find('.cm-church-servicename').val(place.Services[i].Service)
info.find('.cm-church-dayname').val(place.Services[i].DayName)
info.find('.cm-church-servicechapter').val(place.Services[i].Chapter)
info.find('.cm-church-servicetime').val(place.Services[i].StartAt)
}
})
})
$('.cm-modal-church').on('show.bs.modal', function(){
$('.cm-church-serviceinfo-add').trigger('click')
})
$('.cm-modal-church').on('hide.bs.modal', function(){
$('.cm-church-serviceinfo-data').remove()
})
$('.cm-church-save').on('click', function(e) {
var frm = $('.cm-modal-church form');
var params = {
NId: frm.find('.cm-nid').val(),
Name: frm.find('.cm-church-name').val(),
Phone: frm.find('.cm-church-phone').val(),
Address: frm.find('.cm-church-address').val(),
Pastor: frm.find('.cm-church-pastor').val(),
Homepage: frm.find('.cm-church-homepage').val(),
Twitter: frm.find('.cm-church-twitter').val(),
Facebook: frm.find('.cm-church-facebook').val(),
Kakao: frm.find('.cm-church-kakao').val(),
Instagram: frm.find('.cm-church-instagram').val(),
Youtube: frm.find('.cm-church-youtube').val(),
NaverCafe: frm.find('.cm-church-navercafe').val(),
DaumCafe: frm.find('.cm-church-daumcafe').val(),
Services: $.map($('.cm-church-serviceinfo-data'), function(info){
info = $(info)
return {
Service: info.find('.cm-church-servicename').val(),
DayName: info.find('.cm-church-dayname').val(),
Chapter: info.find('.cm-church-servicechapter').val(),
StartAt: info.find('.cm-church-servicetime').val(),
}
})
}
$.post('/crawls/place/church_save', params, function(res) {
if (res.code == 200) {
alert('Saved successfully');
table.bootstrapTable('refresh');
$('.cm-modal-church').modal('hide')
}
}, 'json')
})
var searchInput = $('.keyword-search-input').keyup(function(e) {
if (e.keyCode == 13) {
searchBtn.trigger('click')
}
})
var searchBtn = $('.podbbang-search-btn').on('click', function() {
table.bootstrapTable('refresh', {
query: {
keyword: searchInput.val(),
category: $('.podbbang-crawl-category').val()
}
})
})
})
</script>