calender.css

.calendar_contents_head{

height: 200px;

overflow-y: auto;

display: flex;

flex-direction: column;

align-items: stretch;

padding-top: 42px;

}

.another_contents_day{

padding-top: 75px;

display: flex;

margin-left: 25px;

flex-direction: row;

align-items: center;

color: #9e8874;

}

.another_contents_day>img{

height: 35px;

width: 35px;

}

.another_contents_day_title{

margin-left: 10px;

font-size: 15px;

}

.day_all_contents{

height: 100px;

overflow-y: auto;

display: flex;

flex-wrap: wrap;

font-size: 13px;

margin-left: 70px;

color: #9e8874;

justify-content: flex-start;

align-content: flex-start;

flex-direction: column;

align-items: flex-start;

}

.noti_text {

top: 0;

right: 0;

z-index: 3;

height: 17px;

width: 17px;

line-height: 20px;

text-align: center;

background-color: #bf8285;

color: white;

border-radius: 50%;

display: flex;

justify-content: center;

align-items: center;

align-content: center;

float: right;

}

.calendar_contents_head .contents_text {

display: flex;

flex-wrap: wrap;

justify-content: space-between;

margin-right: 40px;

font-size: 15px;

margin-left: 25px;

margin-bottom: 10px;

align-items: center;

border-bottom: 1px solid #8f7058;

}

.calendar_contents_head .contents_text >ul{

display: flex;

justify-content: flex-start;

width: 170px;

color: #c0ab96;

}

.day_all_contents .contents_text {

display: flex;

flex-wrap: wrap;

justify-content: space-between;

margin-right: 40px;

font-size: 15px;

margin-left: 25px;

margin-bottom: 10px;

align-items: center;

border-bottom: 1px solid #8f7058;

}

.day_all_contents .contents_text >ul{

display: flex;

justify-content: flex-start;

width: 170px;

color: #c0ab96;

}

pages/views/classSelect

from django.db.models import Count

# calender class select

@csrf_exempt

def classSelect(request):

print('come on!!!')

classgs = request.POST['classgs']

todayVal = request.POST['todayval']

print('A', todayVal)

C_result = []

try:

C_list = calender_Contents.objects.filter(days=todayVal).order_by('client_group')

C_cnt = calender_Contents.objects.values('client_group__name', 'client_group__id').filter(

days=todayVal).annotate(group_count=Count('client_group'))

row = ValuesQuerySetToDict(C_cnt)

for i, list in enumerate(C_list):

context = {}

context['contents'] = list.contents

context['pk'] = list.pk

context['client_group_name'] = list.client_group.name

context['client_group_id'] = list.client_group.id

C_result.append(context)

for i, list in enumerate(row):

context = {}

context['client_group_name'] = list['client_group__name']

context['client_group_id'] = list['client_group__id']

context['group_count'] = list['group_count']

context['another'] = True

print(context)

C_result.append(context)

except ObjectDoesNotExist:

print('fail')

print('pass?')

return HttpResponse(json.dumps(C_result), content_type='application/json')

pages/views/calenderSelect

@csrf_exempt

def calendarSelect(request):

print('come on!!!')

classgs = request.POST['classgs']

todayVal = request.POST['todayval']

print('A', todayVal)

C_result = []

try:

C_list = calender_Contents.objects.filter(days=todayVal).order_by('client_group')

C_cnt = calender_Contents.objects.values('client_group__name','client_group__id').filter(days=todayVal).annotate(group_count=Count('client_group'))

print(C_cnt)

row = ValuesQuerySetToDict(C_cnt)

for i, list in enumerate(C_list):

context = {}

context['contents'] = list.contents

context['pk'] = list.pk

context['client_group_name'] = list.client_group.name

context['client_group_id'] = list.client_group.id

C_result.append(context)

for i, list in enumerate(row):

context = {}

context['client_group_name'] = list['client_group__name']

context['client_group_id'] = list['client_group__id']

context['group_count'] = list['group_count']

context['another'] = True

print(context)

C_result.append(context)

except ObjectDoesNotExist:

print('fail')

print('pass?')

print(C_result)

return HttpResponse(json.dumps(C_result), content_type='application/json')

def ValuesQuerySetToDict(vqs):

return [item for item in vqs]

js/reserve.js

// 날짜 선택시

function getCG_Contents(days,year,month) {

// alert(days);

$('.resv-remain1').css({"display": ""});

$('#resv-text').val('');

$('.resv-text').css({"display": ""});

$('.resv_btn').css({"display": ""});

var seldays = year.innerHTML+"-"+month.innerHTML+"-"+days;

console.log(seldays);

var week = ['일요일', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일'];

mainTodayDay.innerHTML = week[new Date(seldays).getDay()];

var classgs = document.getElementById('cglist');

var todayString = year.innerHTML;

// var classgs2 = document.getElementsByName('chku')[0].value;

var classgs2 = $('input[name=chku]:checked').val();

if (classgs.innerText=='' || classgs.innerText == null){

console.log('여기타?'+classgs2);

if (classgs2=='' || classgs2 == null){

return alert('일정 등록이 실패하였습니다. 다시 등록 해주시기 바랍니다.');

}

classgs = classgs2;

}else{

classgs = classgs.innerText

}

if (parseInt(month.innerHTML) < 10) {

todayString += "0";

}

todayString += month.innerHTML;

if (parseInt(days) < 10) {

todayString += "0";

}

todayString += days;

// console.log(todayString);

// console.log(classgs);

console.log("classgs = "+classgs);

$.ajax({

type: 'POST',

url: '/manager/calender/calendarSelect',

cache: false,

data: { todayval:todayString, classgs: classgs},

dataType: 'json',

async: false,

success: function(response){

$('.contents_text').remove();

$('.all_content_text').remove();

console.log("obj.client_group_id"+ JSON.stringify(response.length))

console.log("obj = "+ JSON.stringify(response,'',2))

response.forEach(function (obj) {

console.log("obj!!!! = "+JSON.stringify(obj))

if(!obj.another && !obj.contents){

$('#calendar_contents_head').append("<div class='contents_text'>일정이없습니다.</div>");

}else if(!obj.another && obj.client_group_id == classgs ){

$('#calendar_contents_head').append("<div class='contents_text' ><ul><li><input class='calendarlist' name='calendarlist"+obj.pk+"' id='calendarlist"+obj.pk+"' value='"+obj.contents+"' onkeyup='cUpdateEnter("+obj.pk+")' readonly /></li></ul><button class='cUpdate_btn' onclick='cUpdate("+obj.pk+")'></button><button class='cDelete_btn' onclick='cDelete("+obj.pk+")'></button></div>");

}else if(obj.another && obj.client_group_id != classgs){

//if()

$('#day_all_contents').append("<div class='all_content_text'> "+ obj.client_group_name + "<div class='noti_text'>"+ obj.group_count +"</div></div>");

// $('#calendar_contents_head').append("<div class='contents_text' ><ul><li>"+obj.contents+"</li></ul><button class='cDelete_btn' onclick='cDelete("+obj.pk+")'></button></div>");

//$('#day_all_contents').append("<div class='contents_text' ><ul><li><input class='calendarlist' name='calendarlist"+obj.pk+"' id='calendarlist"+obj.pk+"' value='"+obj.contents+"' onkeyup='cUpdateEnter("+obj.pk+")' readonly /></li></ul><button class='cUpdate_btn' onclick='cUpdate("+obj.pk+")'></button><button class='cDelete_btn' onclick='cDelete("+obj.pk+")'></button></div>");

}

});

// for(var C_list in response['C_list']){

//         console.log(C_list);

// }

//  $('#contents_text').load(location.href+' #contents_text');

// flag_ck(date);

},

error: function(request){

alert('클래스를 선택해주세요!!')

},

});

}

js/calender.js

function getCG(event) {

document.getElementById('cglist').innerText = event.target.value;

document.getElementById('classg').value = event.target.value;

var classgs = $('.classgs').val();

console.log('classgs'+classgs);

console.log('CGnumber'+event.target.value);

var dayss = document.getElementById('day_hd');

const year = document.querySelector('.year');

const month = document.querySelector('.month');

let str = ""

// var classgs = document.getElementById('cglist');

// console.log(classgs.innerText);

//날짜 0000/00/00

var todayString = year.innerHTML;

var flag_status = year.innerHTML;

if (parseInt(month.innerHTML) < 10) {

todayString += "0";

flag_status += "0";

}

todayString += month.innerHTML;

flag_status += month.innerHTML;

if (parseInt(dayss.innerHTML) < 10) {

todayString += "0";

}

todayString += dayss.innerHTML;

var cglist =document.getElementById('cglist').innerText;

calendarInte(cglist);

$('#resv-text').val('');

// $('.contents_text').remove();

$.ajax({

type: 'POST',

url: '/manager/calender/classSelect',

cache: false,

data: { todayval:todayString, classgs: event.target.value, flag_status: flag_status},

dataType: 'json',

async: false,

success: function(response){

$('.contents_text').remove();

$('.all_content_text').remove();

response.forEach(function (obj) {

console.log("obj!!!! = "+JSON.stringify(obj))

if(!obj.another && !obj.contents){

$('#calendar_contents_head').append("<div class='contents_text'>일정이없습니다.</div>");

}else if(!obj.another && obj.client_group_id == event.target.value ){

$('#calendar_contents_head').append("<div class='contents_text' ><ul><li><input class='calendarlist' name='calendarlist"+obj.pk+"' id='calendarlist"+obj.pk+"' value='"+obj.contents+"' onkeyup='cUpdateEnter("+obj.pk+")' readonly /></li></ul><button class='cUpdate_btn' onclick='cUpdate("+obj.pk+")'></button><button class='cDelete_btn' onclick='cDelete("+obj.pk+")'></button></div>");

}else if(obj.another && obj.client_group_id != event.target.value){

//if()

//$('#day_all_contents').append("<span class='all_content_text'> "+ obj.client_group_name +" 에 일정이 "+ obj.group_count +"개 있습니다. </span>");

$('#day_all_contents').append("<div class='all_content_text'> "+ obj.client_group_name + "<div class='noti_text'>"+ obj.group_count +"</div></div>");

// $('#calendar_contents_head').append("<div class='contents_text' ><ul><li>"+obj.contents+"</li></ul><button class='cDelete_btn' onclick='cDelete("+obj.pk+")'></button></div>");

//$('#day_all_contents').append("<div class='contents_text' ><ul><li><input class='calendarlist' name='calendarlist"+obj.pk+"' id='calendarlist"+obj.pk+"' value='"+obj.contents+"' onkeyup='cUpdateEnter("+obj.pk+")' readonly /></li></ul><button class='cUpdate_btn' onclick='cUpdate("+obj.pk+")'></button><button class='cDelete_btn' onclick='cDelete("+obj.pk+")'></button></div>");

}

});

$('#resv-text').val('');

// for(var C_list in response['C_list']){

//         console.log(C_list);

// }

},

error: function(request){

alert('일정 등록이 실패하였습니다.')

},

});

}

manageClassGroup.html // 70 라인부분

<div class="another_contents_day" style=""><img src="/media/image/manager/notis.png" ><span class="another_contents_day_title"> 오늘의 주요 일정</span></div>

<div class="day_all_contents" id="day_all_contents"></div>