
<?php 
include 'db_connect.php';
if(isset($_GET['id'])){
    $qry = $conn->query("SELECT * FROM task_list where id = ".$_GET['id'])->fetch_array();
    foreach($qry as $k => $v){
        $$k = $v;
    }
}
?>
<div class="container-fluid">
    <div class="col-lg-12">
        <div class="card card-outline card-primary">
            <div class="card-body">
                <form action="" id="manage-task">
                    <input type="hidden" name="id" value="<?php echo isset($id) ? $id : '' ?>">
                    <input type="hidden" name="project_id" value="<?php echo isset($_GET['pid']) ? $_GET['pid'] : '0' ?>">
                    <input type="hidden" name="user_ids" value="<?php echo isset($_SESSION['login_id']) ? $_SESSION['login_id'] : '' ?>">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="" class="control-label">Task Date</label>
                                <input type="date" class="form-control form-control-sm" autocomplete="off" name="start_date" value="<?php echo isset($start_date) ? date("Y-m-d",strtotime($start_date)) : '' ?>">
                            </div>
                        </div>
                    </div>
                    <fieldset class="border p-2 input-field" id="task-fields">
                        <legend  class="float-none w-auto p-2">Task Details</legend>
                        <div class="adp-box">
                            <div class="inputWrapper">
                                <div class="row adp-tasks">
                                    <div class="col-md-5">
                                        <div class="form-group">
                                            <label for="">Task Title</label>
                                            <input type="text" class="form-control form-control-sm" name="task[]" required placeholder="Enter Task Title...">
                                        </div>
                                    </div>
                                    <div class="col-md-5">
                                        <div class="form-group">
                                            <label for="">Time Taken</label>
                                            <input class="form-control form-control-sm" name="time_taken[]" placeholder="HH:mm" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-2">
                                        <button class="btn btn-danger removeInput btn-remove-input"><i class="fas fa-minus"></i></button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-12">
                            <button class="btn btn-success addInput btn-add-input"><i class="fas fa-plus"></i> Add Task</button>
                        </div>
                    </fieldset>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="">Task link(If Any)</label>
                                <input type="url" name="task_link" class="form-control form-control-sm">
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="">Status</label>
                                <select name="status" id="status" class="custom-select custom-select-sm">
                                    <option value="1" <?php echo isset($status) && $status == 1 ? 'selected' : '' ?>>Pending</option>
                                    <option value="2" <?php echo isset($status) && $status == 2 ? 'selected' : '' ?>>On-Progress</option>
                                    <option value="3" <?php echo isset($status) && $status == 3 ? 'selected' : '' ?>>Done</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="card-footer border-top border-info">
    <div class="d-flex w-100 justify-content-center align-items-center">
        <button class="btn btn-flat  bg-gradient-primary mx-2" form="manage-task">Save</button>
        <button class="btn btn-flat bg-gradient-secondary mx-2" type="button" onclick="location.href='index.php?page=task_list'">Cancel</button>
    </div>
</div>

<script>
$(document).ready(() => {
    // Add Task button click event
    $(".addInput").click(function() {
        build_inputs($(this));
    });

    // Remove Task button click event
    $(document).on("click", ".removeInput", function() {
        $(this).closest(".adp-tasks").remove();
    });
});

let randId = 1;

function build_inputs(e) {
    let ind = $(".adp-tasks").length + 1;
    let str = `<div id="task-${ind}" class="row adp-tasks">`;
    str += `<div class="col-md-5">
                <div class="form-group">
                    <label for="">Task Title</label>
                    <input type="text" class="form-control form-control-sm" name="task[]" required placeholder="Enter Task Title...">
                </div>
            </div>
            <div class="col-md-5">
                <div class="form-group">
                    <label for="">Time Taken</label>
                    <input class="form-control form-control-sm" name="time_taken[]" placeholder="HH:mm" type="text">
                </div>
            </div>
            <div class="col-md-2">
                <button class="btn btn-danger removeInput btn-remove-input"><i class="fas fa-minus"></i></button>
            </div>
        </div>`;
    $(".inputWrapper").append(str);
}
</script>

<script>
	$(document).ready(function(){


	$('.summernote').summernote({
        height: 200,
        toolbar: [
            [ 'style', [ 'style' ] ],
            [ 'font', [ 'bold', 'italic', 'underline', 'strikethrough', 'superscript', 'subscript', 'clear'] ],
            [ 'fontname', [ 'fontname' ] ],
            [ 'fontsize', [ 'fontsize' ] ],
            [ 'color', [ 'color' ] ],
            [ 'para', [ 'ol', 'ul', 'paragraph', 'height' ] ],
            [ 'table', [ 'table' ] ],
            [ 'view', [ 'undo', 'redo', 'fullscreen', 'codeview', 'help' ] ]
        ]
    })
     })
    
    $('#manage-task').submit(function(e){
    	e.preventDefault()
    	start_load()
    	$.ajax({
    		url:'ajax.php?action=save_task',
			data: new FormData($(this)[0]),
		    cache: false,
		    contentType: false,
		    processData: false,
		    method: 'POST',
		    type: 'POST',
			success:function(resp){
				if(resp == 1){
					alert_toast('Data successfully saved',"success");
					setTimeout(function(){
						location.reload()
					},1500)
				}else{
					alert(resp);
				}
			}
    	})
    })
</script>

<style>
button.btn.btn-success.addInput {
    margin-top: 18%;
    font-size: 75%;
    padding: 0.25em 0.4em;
}
.removeTask {
    position: absolute;
    top: 15%;
    cursor: pointer;
}
</style>
