@section('css')
<style type='text/css'>
    .datepicker{z-index:1151 !important;}
    .bootstrap-timepicker-widget.dropdown-menu {
        z-index: 99999!important;
    }
</style>
@stop
<!-- Data Modal -->
<div class="modal fade" id="modal-data" tabindex="-1" role="dialog" aria-labelledby="registerLabel">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <div class="row">
                    <div class="col-xs-12">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">×</span>
                        </button>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12">
                        <div class="p-10">
                            
                            <div id="campaign_data_title_input_html">
                                {!!old('campaign_data_title_input', '')!!}
                            </div>
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="form-group tcenter">
                                        <a href="#" id='edit-data-url' target="_blank" class="btn btn-default btn-sm btn-block">Edit</a>
                                    </div>
                                    <hr/>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="row">
                                        <label class="col-sm-4 control-label">
                                            Agent:
                                        </label>
                                        <div class="col-sm-8" id="div-campaign-agent">
                                            
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="row">
                                        <label class="col-sm-4 control-label">
                                            Updated At:
                                        </label>
                                        <div class="col-sm-8" id="div-campaign-update-at">
                                            
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <div class="form-group tcenter">
                                        <a href="#" id='view-log-url' target="_blank" class="btn btn-default btn-sm btn-block">View Log</a>
                                    </div>
                                    <hr/>
                                </div>
                            </div>
                            <hr/>
                                
                            <form method="POST" class="form-horizontal form" id="reviewForm" action="">
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_progress_status_option ">
                                            Progress
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_progress_status') ? 'has-error' : '' !!}">
                                            <select name="campaign_progress_status_option" id="campaign_progress_status_option" class="form-control">
                                                <option value="">- Select Progress -</option>
                                                @if(isset($all_progress_status_modal))
                                                @foreach($all_progress_status_modal as $progress_status => $all_progress_sub_status)
                                                <option {{old('campaign_progress_status_option')==$progress_status?'selected':''}} value="{{$progress_status}}">
                                                    {{ucfirst($progress_status)}}
                                                </option>
                                                @endforeach
                                                @endif
                                            </select>
                                            <select name="campaign_progress_sub_status_option" id="campaign_progress_sub_status_option" class="form-control">
                                                <option value="">- Select Sub Progress -</option>
                                                @if(isset($all_progress_status_modal))
                                                @foreach($all_progress_status_modal as $progress_status => $all_progress_sub_status)
                                                    @foreach($all_progress_sub_status as $progress_sub_status )
                                                    <option {{old('campaign_progress_sub_status_option')==$progress_sub_status['progress_sub_status']?'selected':''}} 
                                                        data-progress-status='{{$progress_sub_status['progress_status']}}'
                                                        data-progress-status-id='{{$progress_sub_status['id']}}'
                                                        data-progress-sub-status='{{$progress_sub_status['progress_sub_status']}}'
                                                        data-progress-status-reminder='{{$progress_sub_status['reminder']}}'
                                                        data-progress-status-submit='{{$progress_sub_status['submit']}}'
                                                        class='hide'
                                                        value="{{$progress_sub_status['id']}}">
                                                        {{ucfirst($progress_sub_status['progress_sub_status'])}}
                                                    </option>
                                                    @endforeach
                                                @endforeach
                                                @endif
                                            </select>
                                            <input type="hidden" class="form-control" id="campaign_progress_status" 
                                                   name="campaign_progress_status" value="{{old('campaign_progress_status', '')}}">
                                            {!! $errors->first('campaign_progress_status', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row reminder_row hide">
                                    <div class="col-sm-12">
                                        <label for="reminder">
                                            Reminder
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('remind_date') ? 'has-error' : '' !!} {!! $errors->has('remind_time') ? 'has-error' : '' !!}">
                                            <div class="row">
                                                <div class="col-sm-6">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control datepicker rcorner-0" id="inputReminderDate"
                                                               placeholder="Date" name="remind_date" value="{{old('remind_date')}}">
                                                        <span class="input-group-addon">
                                                            <i class="fa fa-calendar"></i>
                                                        </span>
                                                    </div>
                                                    {!! $errors->first('remind_date', '<span class="help-block">:message</span>') !!}
                                                </div>
                                                <div class="col-sm-6">
                                                    <div class="input-group">
                                                        <input type="text" class="form-control timepicker"  id="inputReminderTime"
                                                               name="remind_time" value="{{old('remind_time')}}">
                                                        <div class="input-group-addon">
                                                            <i class="fa fa-clock-o"></i>
                                                        </div>
                                                    </div>
                                                    {!! $errors->first('remind_time', '<span class="help-block">:message</span>') !!}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_new_pic ">
                                            New PIC
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_new_pic') ? 'has-error' : '' !!}">
                                            <input type="text" class="form-control " id="campaign_new_pic"
                                                       placeholder="" name="campaign_new_pic" value="{{old('campaign_new_pic')}}">
                                            {!! $errors->first('campaign_new_pic', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_new_contact ">
                                            New Contact
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_new_contact') ? 'has-error' : '' !!}">
                                            <input type="text" class="form-control " id="campaign_new_contact"
                                                    placeholder="" name="campaign_new_contact" value="{{old('campaign_new_contact')}}">
                                            {!! $errors->first('campaign_new_contact', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_new_ic">
                                            New IC
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_new_ic') ? 'has-error' : '' !!}">
                                            <input type="text" class="form-control " id="campaign_new_ic"
                                                       placeholder="" name="campaign_new_ic" value="{{old('campaign_new_ic')}}">
                                            {!! $errors->first('campaign_new_ic', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_new_email">
                                            New Email
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_new_email') ? 'has-error' : '' !!}">
                                            <input type="text" class="form-control " id="campaign_new_email"
                                                       placeholder="" name="campaign_new_email" value="{{old('campaign_new_email')}}">
                                            {!! $errors->first('campaign_new_email', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row ">
                                    <div class="col-sm-12">
                                        <label for="appointment">
                                            Installation Date
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('appointment_date') ? 'has-error' : '' !!} {!! $errors->has('appointment_time') ? 'has-error' : '' !!}">
                                            <div class="row">
                                                <div class="col-sm-6">
                                                    <div class="input-group">
                                                        @if(in_array($userdata['role'], ['admin', 'super_admin', 'coordinator']))
                                                        <input type="text" class="form-control datepicker rcorner-0" id="inputAppointmentDate"
                                                               placeholder="Date" name="appointment_date" value="{{old('appointment_date')}}">
                                                        @else
                                                        <input type="text" class="form-control  rcorner-0" readonly id="inputAppointmentDate"
                                                               placeholder="Date" name="appointment_date" value="{{old('appointment_date')}}">
                                                        @endif
                                                        <span class="input-group-addon">
                                                            <i class="fa fa-calendar"></i>
                                                        </span>
                                                    </div>
                                                    {!! $errors->first('appointment_date', '<span class="help-block">:message</span>') !!}
                                                </div>
                                                <div class="col-sm-6">
                                                    <div class="input-group">
                                                        @if(in_array($userdata['role'], ['admin', 'super_admin', 'coordinator']))
                                                        <input type="text" class="form-control timepicker"  id="inputAppointmentTime"
                                                               name="appointment_time" value="{{old('appointment_time')}}">
                                                        @else
                                                        <input type="text" class="form-control" readonly  id="inputAppointmentTime"
                                                               name="appointment_time" value="{{old('appointment_time')}}">
                                                        @endif
                                                        <div class="input-group-addon">
                                                            <i class="fa fa-clock-o"></i>
                                                        </div>
                                                    </div>
                                                    {!! $errors->first('appointment_time', '<span class="help-block">:message</span>') !!}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_agent_remark ">
                                            Agent Remark
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_agent_remark') ? 'has-error' : '' !!}">
                                            <textarea wrap="hard" rows="5" class="form-control" placeholder="Write your remark here!" 
                                                      name="campaign_agent_remark" id="campaign_agent_remark" autocomplete="off" style="resize:none;">{{old('campaign_agent_remark', '')}}</textarea>
                                            {!! $errors->first('campaign_agent_remark', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row @if(!in_array($userdata['role'], ['super_admin', 'admin', 'qa'])) hide @endif">
                                    <div class="col-sm-12">
                                        <label for="campaign_verify_status ">
                                            Verify
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_verify_status') ? 'has-error' : '' !!}">
                                            <select name="campaign_verify_status" id="campaign_verify_status" class="form-control">
                                                <option value="">- Select Status -</option>
                                                @if(isset($all_verify_status_modal))
                                                @foreach($all_verify_status_modal as $status)
                                                <option {{old('campaign_verify_status')==$status?'selected':''}} value="{{$status}}">{{ucfirst($status)}}</option>
                                                @endforeach
                                                @endif
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_qa_remark ">
                                            QA Remark
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_qa_remark') ? 'has-error' : '' !!}">
                                            <textarea wrap="hard" rows="5" class="form-control" placeholder="Write your remark here!" 
                                                      @if(!in_array($userdata['role'], ['super_admin', 'team_leader', 'qa', 'admin'])) readonly @endif
                                                      name="campaign_qa_remark" id="campaign_qa_remark" autocomplete="off" style="resize:none;">{{old('campaign_qa_remark', '')}}</textarea>
                                            {!! $errors->first('campaign_agent_remark', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_team_leader_remark ">
                                            Team Leader Remark
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_team_leader_remark') ? 'has-error' : '' !!}">
                                            <textarea wrap="hard" rows="5" class="form-control" placeholder="Write your remark here!" 
                                                      @if(!in_array($userdata['role'], ['super_admin', 'team_leader', 'admin'])) readonly @endif
                                                      name="campaign_team_leader_remark" id="campaign_team_leader_remark" autocomplete="off" style="resize:none;">{{old('campaign_team_leader_remark', '')}}</textarea>
                                            {!! $errors->first('campaign_team_leader_remark', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row">
                                    <div class="col-sm-12">
                                        <label for="campaign_case_id ">
                                            Case ID
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_case_id') ? 'has-error' : '' !!}">
                                            <input type="text" class="form-control " @if(in_array($userdata['role'], ['agent'])) readonly @endif
                                                   id="campaign_case_id" placeholder="" name="campaign_case_id" value="{{old('campaign_case_id')}}">
                                            {!! $errors->first('campaign_case_id', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row @if(!in_array($userdata['role'], ['super_admin', 'admin', 'coordinator', 'team_leader'])) hide @endif">
                                    <div class="col-sm-12">
                                        <label for="campaign_final_status ">
                                            Final Status
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_final_status') ? 'has-error' : '' !!}">
                                            <select name="campaign_final_status" id="campaign_final_status" class="form-control">
                                                <option value="">- Select Status -</option>
                                                @if(isset($all_final_status_modal))
                                                @foreach($all_final_status_modal as $status)
                                                @if(!in_array($status, ['success', 'Cancelled']))
                                                <option {{old('campaign_final_status')==$status?'selected':''}} value="{{$status}}">{{ucfirst($status)}}</option>
                                                @endif
                                                @endforeach
                                                @endif
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                
                                <div class="row @if(!in_array($userdata['role'], ['super_admin', 'agent', 'admin', 'coordinator', 'team_leader'])) hide @endif">
                                    <div class="col-sm-12">
                                        <label for="campaign_coordinator_remark ">
                                            Coordinator Remark
                                        </label>
                                    </div>
                                    <div class="col-sm-12">
                                        <div class="pb-20 {!! $errors->has('campaign_coordinator_remark') ? 'has-error' : '' !!}">
                                            <textarea wrap="hard" rows="5" class="form-control" placeholder="Write your remark here!" 
                                                      @if(!in_array($userdata['role'], ['coordinator', 'admin'])) readonly @endif
                                                      name="campaign_coordinator_remark" id="campaign_coordinator_remark" autocomplete="off" style="resize:none;">{{old('campaign_coordinator_remark', '')}}</textarea>
                                            {!! $errors->first('campaign_coordinator_remark', '<span class="help-block">:message</span>') !!}
                                        </div>
                                    </div>
                                </div>
                                    
                                <div class="col-sm-12">
                                    <div class="form-group tcenter">
                                        <input required type="hidden" class="form-control" name="campaign_id" id="campaign_id" value="{{old('campaign_id', '')}}" autocomplete="off">
                                        <input required type="hidden" class="form-control" name="campaign_data_id" id="campaign_data_id" value="{{old('campaign_data_id', '')}}" autocomplete="off">
                                        <input required type="hidden" class="form-control" name="campaign_data_title_input" id="campaign_data_title_input" value="{{old('campaign_data_title_input', '')}}" autocomplete="off">
                                        {!! csrf_field() !!}
                                        <button type="submit" class="btn btn-primary btn-block">Confirm</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@section('script_modal')
<script type="text/javascript">
$(document).ready(function(){
    var date = new Date();
    //date.setDate(date.getDate()-1);
    $('.datepicker').datepicker({
        format: 'yyyy-mm-dd',
        todayHighlight:'TRUE',
        startDate: date
    });
    $('.timepicker').timepicker({
        showInputs: false
    });
    
    //fill in the modal form
    $('.campaign_data_row').click(function(){
        html = '<div class="row">';
        $first = true;
        if($(this).data('form-location')){
            $children = $(this).children('div').children('span');
            @if(Session::has('campaign_id'))
            $('#reviewForm').prop('action', '{{url("campaign/manage-data/".Session::get('campaign_id'))}}')
            @endif
        }else{
            $children = $(this).children('td');
            $('#reviewForm').prop('action', '')
        }
        $column_size = $children.size()-1;
        $children.each(function(i, obj){
            if($(obj).data('column-key') != 'Campaign Agent Remark'){
                if($first){
                    html += '<div class="col-sm-6"><div class="row">';
                    $first = false;
                }
                html += '<label class="col-sm-4 control-label">';
                html += $(obj).data('column-key');
                html += '</label><div class="col-sm-8">';
                html += $(obj).data('column-value');
                html += '</div>';
                if(i == $column_size){
                    html += '</div></div>';
                }else{
                    html += '</div></div><div class="col-sm-6"><div class="row">';
                }
            }
        });
        html += '</div>';
        $('#campaign_data_title_input').val(html);
        $('#campaign_data_title_input_html').html(html);
        
        $('#campaign_id').val($(this).data('campaign-id'));
        $('#campaign_data_id').val($(this).data('campaign-data-id'));
        
        $('#campaign_progress_status').val($(this).data('campaign-progress-status'));
        $('#campaign_progress_sub_status_option option').each(function(i, obj){
            if($(this).data('progress-status-id') == $('#campaign_progress_status').val()){
                $progress_status = $(this).data('progress-status');
                $('#campaign_progress_status_option').val($progress_status);
                $('#campaign_progress_sub_status_option').val($('#campaign_progress_status').val());
                $('#campaign_progress_sub_status_option option').addClass('hide');
                $('#campaign_progress_sub_status_option option').each(function(i, obj){
                    if($(this).data('progress-status') == $progress_status){
                        $(this).removeClass('hide');
                    }
                });
                if($(this).data('progress-status-reminder') == 1){
                    $('.reminder_row').removeClass('hide');
                }else{
                    $('.reminder_row').addClass('hide');
                    $('#inputReminderDate').val('0000-00-00');
                    $('#inputReminderTime').val('');
                }
            }
        });
        $('#campaign_new_pic').val($(this).data('campaign-new-pic'));
        $('#campaign_new_contact').val($(this).data('campaign-new-contact'));
        $('#campaign_new_ic').val($(this).data('campaign-new-ic'));
        $('#campaign_new_email').val($(this).data('campaign-new-email'));
        $('#inputReminderDate').val($(this).data('remind-date'));
        $('#inputReminderTime').val($(this).data('remind-time'));
        $('#inputAppointmentDate').val($(this).data('appointment-date'));
        $('#inputAppointmentTime').val($(this).data('appointment-time'));
        $('#campaign_verify_status').val($(this).data('campaign-verify-status'));
        $('#campaign_agent_remark').val($(this).data('campaign-agent-remark'));
        $('#campaign_qa_remark').val($(this).data('campaign-qa-remark'));
        $('#campaign_team_leader_remark').val($(this).data('campaign-team-leader-remark'));
        $('#campaign_coordinator_remark').val($(this).data('campaign-coordinator-remark'));
        $('#campaign_case_id').val($(this).data('campaign-case-id'));
        $('#campaign_final_status').val($(this).data('campaign-final-status'));
        $('#div-campaign-agent').html('('+$(this).data('campaign-agent-id')+') '+$(this).data('campaign-agent-name'));
        $('#div-campaign-update-at').html($(this).data('campaign-updated-at'));
        $edit_url = '{{url('campaign/data/update')}}';
        $('#edit-data-url').prop('href', $edit_url+'/'+$(this).data('campaign-id')+'/'+$(this).data('campaign-data-id'));
        $view_log_url = '{{url('audit-trail')}}';
        $('#view-log-url').prop('href', $view_log_url+'?type=campaign_data_'+$(this).data('campaign-id')+'&type_id='+$(this).data('campaign-data-id'));
    });
    
    //reset modal form
    $('#modal-data').on('hidden.bs.modal', function (e) {
        // do something...
        html = '';
        $('#campaign_data_title_input').val(html);
        $('#campaign_data_title_input_html').html(html);
        
        $('#campaign_id').val(html);
        $('#campaign_data_id').val(html);
        
        $('#campaign_new_pic').val(html);
        $('#campaign_new_contact').val(html);
        $('#campaign_new_ic').val(html);
        $('#campaign_new_email').val(html);
        $('#inputReminderDate').val(html);
        $('#inputReminderTime').val(html);
        $('#inputAppointmentDate').val(html);
        $('#inputAppointmentTime').val(html);
        $('#campaign_progress_status_option').val(html)
        $('#campaign_progress_sub_status_option').val(html)
        $('#campaign_progress_status').val(html);
        $('#campaign_verify_status').val(html);
        $('#campaign_agent_remark').val(html);
        $('#campaign_qa_remark').val(html);
        $('#campaign_team_leader_remark').val(html);
        $('#campaign_coordinator_remark').val(html);
        $('#campaign_case_id').val(html);
        $('#campaign_final_status').val(html);
        $('#div-campaign-agent').html('');
        $('#div-campaign-update-at').html('');
        $('#edit-data-url').prop('href', '#');
        $('#view-log-url').prop('href', '#');
    });
    
    //progress status option
    if($('#campaign_progress_status_option').val()==''){
        $('#campaign_progress_sub_status_option').val('');
    }else{
        $progress_status = $('#campaign_progress_status_option').val();
        $('#campaign_progress_sub_status_option option').each(function(i, obj){
            if($(this).data('progress-status') == $progress_status){
                $(this).removeClass('hide');
            }
        });
    }
    $('#campaign_progress_status_option').change(function(){
        $progress_status = $('#campaign_progress_status_option').val();
        $('#campaign_progress_sub_status_option').val('');
        $('#campaign_progress_status').val('');
        $('#campaign_progress_sub_status_option option').addClass('hide');
        $('#campaign_progress_sub_status_option option').each(function(i, obj){
            if($(this).data('progress-status') == $progress_status){
                $(this).removeClass('hide');
            }
        });
    });
    $('#campaign_progress_sub_status_option').change(function(){
        $('#campaign_progress_status').val($(this).val());
        
        //handle reminder
        $('#campaign_progress_sub_status_option option').each(function(i, obj){
            if($(this).val() == $('#campaign_progress_status').val()){
                if($(this).data('progress-status-reminder') == 1){
                    $('.reminder_row').removeClass('hide');
                }else{
                    $('.reminder_row').addClass('hide');
                    $('#inputReminderDate').val('0000-00-00');
                    $('#inputReminderTime').val('');
                }
            }
        });
        
    });

    //form validate failed
    @if (count($errors) > 0 && isset($is_manage_data) && $is_manage_data)
    $('#modal-data').modal('show');
    @endif
});
</script>
@stop