@extends('layouts.simple.master')

@section('main_content')
@include('operations.auditoria.navigation_comercial')

<div class="container-fluid">
    <h4>Sync Kanboard Offers</h4>
    <div class="table-responsive">
        <table class="table">
            <thead>
                <tr>
                    <th>Task ID</th>
                    <th>Código Proyecto</th>
                    <th>Kanboard Task</th>
                    <th>Operaciones</th>
                    <th>Due Date</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
                @foreach($tasks as $task)
                <tr>
                    <td>{{ $task->task_id }}</td>
                    <td>{{ $task->codigo_proyecto }}</td>
                    <td>{{ $task->KB_task }}</td>
                    <td>{{ $task->Operaciones }}</td>
                    <td>{{ \Carbon\Carbon::createFromTimestamp($task->date_due)->format('Y-m-d') }}</td>
                    <td>
                        @if(!$task->codigo_proyecto)
                            <button class="btn btn-primary btn-sm sync-btn" 
                                    data-task-id="{{ $task->task_id }}">
                                Sync
                            </button>
                        @endif
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>

@push('scripts')
<script>
$(document).ready(function() {
    $('.sync-btn').click(function() {
        const taskId = $(this).data('task-id');
        const button = $(this);
        
        $.ajax({
            url: '{{ route("operations.auditoria.kanboard.sync-offers.sync") }}',
            method: 'POST',
            data: {
                task_id: taskId,
                _token: '{{ csrf_token() }}'
            },
            success: function(response) {
                if(response.success) {
                    button.prop('disabled', true).text('Synced');
                    location.reload();
                }
            }
        });
    });
});
</script>
@endpush
@endsection