 <?php $__env->startSection('content'); ?>
<?php echo $__env->make('administrator.construction.task-working.edit-sub-task', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<?php Fun::lang()?>
<style>
  td.details-control {
      background: url(' <?php echo e(asset('images/details_open.png')); ?> ') no-repeat center center !important;
      cursor: pointer;
  }
  tr.shown td.details-control {
      background: url(' <?php echo e(asset('images/details_close.png')); ?> ') no-repeat center center !important;
  }
  .content-wrapper{
    height: 100% !important;
  }
</style>
<div class="title-page">
    <div class="page-bar">
        <ul class="page-breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
            <li><a href="#">Task Working</a></li>
            <li><a href="#">List</a></li>
        </ul>
    </div>
</div>
    <div class="page">
        <div class="top-content">
            <div class="row">
                <div class="col-sm-12 col-xs-12">
                    <div class="title-page">
                        <div class="pull-left">
                            <h3>Task Working List</h3>
                        </div>
                    </div>
                    <div class="pull-right">
                        <a class="button_sm button_primary" href="<?php echo e(route('task-working-construction.create')); ?>"><span class="fa fa-plus"></span>  Create New</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="box-body table-responsive">
                        
            <table id="datatable_task_group" width="100%" class="table table-striped table-bordered table-hover nowrap">
                <thead>
                    <tr>
                        <th></th>
                        <th>NO</th>
                        <th>Name</th>
                        <th>Type of building</th>
                        <th>Description</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                   
                </tbody>
            </table>

        </div>
    </div>
    <?php $__env->stopSection(); ?>
    <?php $__env->startSection('js'); ?>
    <script type="text/javascript">
            function edit_sub_task(obj)
            {
                var id = $(obj).data("id");
                var name = $(obj).data("name");
                var des = $(obj).data("des");
                $("#edit-sub-task-modal").modal("show");
                $("#sub-task-id").val(id);
                $("#sub-task-name").val(name);
                $("#sub-task-description").val(des);
            }
            function save_sub_task_edit()
            {
                var id = $("#sub-task-id").val();
                var name = $("#sub-task-name").val();
                var des = $("#sub-task-description").val();
                if(id=="") alert("Error with your request");
                else if(name==""){
                    $("#sub-task-name").focus();
                }
                else{
                    var route = "<?php echo e(route('task-working-construction.save_edit_sub_task_data')); ?>";
                    $.ajax({
                        url:route,
                        type:"POST",
                        dataType:"JSON",
                        data:{
                            "_token":"<?php echo e(csrf_token()); ?>",
                            id:id,
                            name:name,
                            des:des
                        },
                        success:function(){
                            $("#edit-sub-task-modal").modal("hide");
                            $('#datatable_task_group').DataTable().draw(true);
                        }
                    });
                }
            }
            /* Formatting function for row details - modify as you need */
            function format (task_group_id) {
                $("#main-spinner").show();
                var table_detail="";
                var route="<?php echo e(route('task-working-construction.get_sub_task_data')); ?>";
                $.ajax({
                url:route,
                type:"POST",
                async: false,
                dataType:"JSON",
                data:{
                    "_token":"<?php echo e(csrf_token()); ?>",
                    "task_group_id":task_group_id
                },
                success:function(data){
                    var tr =`
                            <tr><th colspan="5" style = 'text-align:center;'><u>Sub Task Detail</u></th></tr>
                            <tr>
                            <th>No</th>
                            <th>Name</th>
                            <th>Descrption</th>
                            <th>Action</th>
                            </tr>`;
                    $.each(data,function(index,val){
                    var button = `
                    <button style="color:white;margin-left:0;" onclick="edit_sub_task(this)" data-id = "${val.id}" data-name = "${val.name}" data-des = "${val.description}" class="btn btn-info btn-sm"><i class="fa fa-edit" title="Edit Sub Task"></i></button>
                    `;
                    
                    tr += `
                            <tr id="${val.id}">
                            <td>${index+1}</td>
                            <td>${val.name}</td>
                            <td>${val.description==null?"":val.description}</td>
                            <td>${button}</th>
                            </tr>
                            `;
                    });
                    table_detail= `<table id="${task_group_id}" width="100%" class="table table-striped table-bordered table-hover nowrap">${tr}</table>`;
                },
                complete:function(){
                    $("#main-spinner").hide();
                }
                });
                return table_detail;
            }
            $(document).ready(function() {
                $('#main-spinner').show();
                var table = $('#datatable_task_group').DataTable({
                    ordering: false,
                    "serverSide": true,
                    "lengthMenu": [
                    [20, 25, 50, 100, 500],
                    [20, 25, 50, 100, 500]
                ],
                    ajax: "<?php echo e(route('task-working-construction.get_data_index')); ?>",
                    columns: [
                    {
                        "className": 'details-control',
                        "orderable": false,
                        "searchable": false,
                        "data": null,
                        "defaultContent": ' ',
                    },
                    {
                        data: 'DT_RowIndex'
                    }, {
                        data: 'name'
                    }, {
                        data: 'type_of_building'
                    }
                    ,{
                        data: 'description'
                    }
                    , {
                        data: 'action'
                    }, ],
                    "initComplete": function(settings, json) {
                        $('#main-spinner').hide();
                    }
                });

                $('#datatable_task_group tbody').on('click', 'td.details-control', function () {
                    var tr = $(this).closest('tr');
                    var task_group_id = tr.attr("id");
                    var row = table.row( tr );
                    if( row.child.isShown() ) {
                        row.child.hide();
                            tr.removeClass('shown');
                        }
                    else {
                        row.child( format(task_group_id) ).show();
                        tr.addClass('shown');
                    }
                });

                $.fn.dataTable.ext.errMode = 'throw';
            });
    </script>
    
    <?php $__env->stopSection(); ?>
<?php echo $__env->make('adminlte::page', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>