@extends('layouts.main')

    @section('main-container')
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

    <style>
    .table td input[type="text"] {
        border: none !important;
        background-color: transparent !important;
        box-shadow: none !important;
        padding: 0;
        font-size: inherit;
        color: inherit;
    }
    </style>


    <div class="page-header d-print-none">
        <div class="container-xl">
            <div class="row g-2 align-items-center">
                <div class="col">
                    <!-- Page pre-title -->
                    
                    <h2 class="page-title">
                    W.H.S. Bill Approval 
                    </h2>
                </div>
                <!-- Page title actions -->
                <div class="col-auto ms-auto d-print-none">
                    <div class="btn-list">
                        <span class="d-none d-sm-inline">
                            <a href="{{ route('export.excel') }}" class="btn btn-1">Download Excel Report</a>
                        </span>
                        <a href="/userData/create" class="btn btn-primary btn-5 d-none d-sm-inline-block">
                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-2">
                                <path d="M12 5l0 14" />
                                <path d="M5 12l14 0" />
                            </svg>
                        Add Bill Approval
                        </a>  
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Page body -->
    <div class="page-body">
        <div class="container-xl">
            <div class="card mb-4 shadow-sm">
                <div class="card-header bg-primary text-white">
                    Bill Approval
                </div>
            @if (session('success'))
                    <div class="alert alert-success alert-dismissible fade show" role="alert" id="success-alert">
                        <strong>Success!</strong> {{ session('success') }}
                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                    </div>
                @endif
            @if(session('error'))
        <div class="alert alert-danger">
            <strong>Error:</strong> {{ session('error') }}
        </div>
    @endif

    @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif



    <div class="card-body">
        
            <div class="table-responsive">
            <div class="text-center border rounded py-3 mb-4 bg-light">
                    <h5 class="mb-1 text-uppercase fw-bold">Water Harvesting Structure</h5>
                    <span class="text-secondary">Details for Bill Approval - Farm Pond</span>
                </div>
            <form action="{{ route('billapproval.store') }}" method="POST">
                @csrf
                <div class="row mb-2 align-items-center">
                    <label for="PIA_id" class="col-sm-2 col-form-label  align-items-center">
                        Name of PIA
                    </label>
                    <div class="col-sm-4">
                        <div class="input-group input-group-sm">
                            
                            <select name="PIA_id" id="PIA_id" class="form-select">
                                @if(isset($baseline->baseline->project->pia))
                                    <option value="{{ $baseline->baseline->project->pia->id }}">
                                        {{ $baseline->baseline->project->pia->name }}
                                    </option>
                                @else
                                    <option value="">N/A</option>
                                @endif
                            </select>
                        </div>
                    </div>



        <!-- Location Section -->
        <div class="row g-2 mb-3 align-items-center">
        <!-- Village -->
        <div class="col-md-3">
            <div class="d-flex align-items-center">
                <label class="form-label  me-1 mb-0">Village:</label>
                <select class="form-select form-select-sm shadow-sm border-0 rounded bg-light flex-grow-1" name="village_id">
                    <option value="{{ $baseline->baseline->village_id ?? '' }}">
                        {{ $baseline->baseline->village->name ?? 'N/A' }}
                    </option>
                </select>
            </div>
        </div>

        <!-- Panchayat -->
        <div class="col-md-3">
            <div class="d-flex align-items-center">
                <label class="form-label me-2 mb-0">
                    <i class="ti ti-building-community me-1"></i> Panchayat:
                </label>
                <select class="form-select form-select-sm shadow-sm border-0 rounded bg-light flex-grow-1" name="panchayat_id">
                    <option value="{{ $baseline->baseline->panchayat_id ?? '' }}">
                        {{ $baseline->baseline->panchayat->name ?? 'N/A' }}
                    </option>
                </select>
            </div>
        </div>

        <!-- Block -->
        <div class="col-md-3">
            <div class="d-flex align-items-center">
                <label class="form-label  me-2 mb-0">
                    <i class="ti ti-layout-grid me-1"></i> Block:
                </label>
                <select class="form-select form-select-sm shadow-sm border-0 rounded bg-light flex-grow-1" name="block_id">
                    <option value="{{ $baseline->baseline->block_id ?? '' }}">
                        {{ $baseline->baseline->block->name ?? 'N/A' }}
                    </option>
                </select>
            </div>
        </div>

        <!-- District -->
        <div class="col-md-3">
            <div class="d-flex align-items-center">
                <label class="form-label  me-2 mb-0">
                        District:
                </label>
                <select class="form-select form-select-sm shadow-sm border-0 rounded bg-light flex-grow-1" name="district_id">
                    <option value="{{ $baseline->baseline->district_id ?? '' }}">
                        {{ $baseline->baseline->district->name ?? 'N/A' }}
                    </option>
                </select>
            </div>
        </div>
    </div>



        <input type="hidden" name="unit_id" value="{{ $baseline->baseline->unit_id ?? 'N/A' }}" class="form-control form-control-sm">
        <input type="hidden" name="state_id" value="{{ $baseline->baseline->state_id ?? 'N/A' }}" class="form-control form-control-sm">
        <input type="hidden" name="application_code" value="{{ $baseline->baseline->application_code ?? 'N/A' }}" class="form-control form-control-sm">
        <input type="hidden" name="baseline_id" value="{{ $baseline->baseline->id}}" class="form-control form-control-sm">



        <!-- Beneficiary Fields -->
    <div class="row  mb-2 align-items-center bg-white p-2 rounded">
        <!-- Beneficiary Name -->
        <div class="col-md-4 d-flex align-items-center">
            <label class="me-2  w-50">Beneficiary Name:</label>
            <input type="text" class="form-control form-control-sm shadow-sm"  name="name_of_respondent"
                value="{{ $baseline->baseline->name_of_respondent ?? 'N/A' }}" readonly>
        </div>

        <!-- Plot No -->
        <div class="col-md-4 d-flex align-items-center">
            <label class="me-2  w-50">Plot No.:</label>
            <input type="text" class="form-control form-control-sm shadow-sm" name="plot_no"
                value="{{ $baseline->baseline->land->plot_khata ?? 'N/A' }}" readonly>
        </div>

        <!-- Financial Year -->
        <div class="col-md-4 d-flex align-items-center">
            <label class="me-2  w-50">Financial Year:</label>
            <select class="form-select form-select-sm shadow-sm" name="financial_year_id">
                <option value="{{$baseline->baseline->financial_year_id}}">{{ $baseline->baseline->financialYear->name ?? 'N/A' }}</option>
            </select>
        </div>
    </div>

    <table class="table table-bordered table-sm align-middle text-center table-striped" style="font-size: 12px;">
        <thead class="text-center align-middle text-white">
        <tr>
            <colgroup>
                <col style="width: 5%;">
                <col style="width: 32%;">
                <col style="width: 7%;">
                <col style="width: 7%;">
                <col style="width: 7%;">
                <col style="width: 5%;">
                <col style="width: 7%;">
                <col style="width: 7%;">
                <col style="width: 6%;">
                <col style="width: 5%;">  <!-- Bill Date (Reduced from 10% → 7%) -->
                <col style="width: 14%;"> <!-- GPS Reading (Increased from 7% → 12%) -->
                <col style="width: 5%;">
                <col style="width: 10%;">
            </colgroup>


            <!-- Main Row -->
            <th rowspan="2" class="">Sl. No.</th>
            <th rowspan="2" style="width: 35%;">Activity Name</th>

            <th colspan="3" class="border">Estimated</th>
            <th rowspan="2" class="border">Unit</th>
            <th colspan="3" class="border">Actual</th>
            <th rowspan="2" class="border">Bill Date</th>
            <th rowspan="2" class="border">GPS Reading</th>
            <th rowspan="2" class="border">Present Status</th>
            <th rowspan="2" class="border">Remarks</th>
        </tr>

        <!-- Sub Row -->
        <tr>
            <!-- Estimated -->
            <th class="border">Quantity</th>
            <th class="border">Rate (₹)</th>
            <th class="border">Amount (₹)</th>
            <!-- Actual -->
            <th class="border  ">Quantity</th>
            <th class="border  ">Rate (₹)</th>
            <th class="border  ">Amount (₹)</th>
        </tr>
    </thead>

    <tbody style="font-size: 12px;">
    <tr>
        <td><input type="text" name="items[0][serial_no]" value="1" class="form-control-plaintext text-center" readonly aria-label="Serial Number"></td>
        <td><input type="text" name="items[0][activity_name]" value="Pond Earth Work" class="text-start form-control form-control-sm input-no-border" readonly></td>

        <td><input type="text" name="items[0][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->estimated_quantity}}"  class="text-end form-control form-control-sm input-no-border" required></td>
        <td><input type="text" name="items[0][estimated_rate]" value="{{$readings[0]['rate']}}" class="text-end form-control form-control-sm input-no-border" required></td>
        <td><input type="text" name="items[0][estimated_amount]"  value="{{ $baseline->baseline->quantityCalculation->estimated_quantity * $readings[0]['rate'] }}" class="text-end form-control form-control-sm input-no-border estimated-amount" required></td>
        
        <td><input type="text" name="items[0][unit]" value="{{$readings[0]['unit']}}" class="text-end form-control form-control-sm input-no-border" required></td>
        <td><input type="text" name="items[0][actual_quantity]"  value="{{$readings[0]['qty']}}" class=" text-end form-control form-control-sm input-no-border" required></td>
        
        <td><input type="text" name="items[0][actual_rate]" value="{{$readings[0]['rate']}}" class="text-end form-control form-control-sm input-no-border" required></td>
        <td><input type="text" name="items[0][actual_amount]" value="{{$readings[0]['amount']}}" class="text-end form-control form-control-sm input-no-border" required></td>
            
    <td rowspan="14">
    @if (Auth::check() && Auth::user()->role_id === 1)
        <input type="date" name="bill_date"  class="text-end form-control form-control-sm input-no-border"   style="width: 100px;" required>
    @else
        <input type="date" name="bill_date"  class="text-end form-control form-control-sm input-no-border"   style="width: 100px;" >
    @endif

    </td>

    <td rowspan="14">
    <textarea name="gps_reading" class="form-control form-control-sm" placeholder="Enter Here" required>{{ $baseline->lat }}&#13;&#10;{{ $baseline->long }}</textarea>
    </td>

        <td rowspan="14">
            @if (Auth::check() && Auth::user()->role_id === 1)
        <select name="present_status" class="form-control form-control-sm" required>
            <option value="" disabled selected>Select Status</option>
            <option value="approved">Approved</option>
            <option value="rejected">Rejected</option>
        </select>
        @endif
    </td>
    
    <td rowspan="14">
        @if (Auth::check() && Auth::user()->role_id === 1)    
        <input type="text" name="remarks" class="form-control form-control-sm bordered" required placeholder="Enter remarks">
    @endif
    </td>
    </tr>

    <tr>
        <td><input type="text" name="items[1][serial_no]" value="2" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text"  name="items[1][activity_name]" value="Bund dressing and compaction" class="text-start form-control form-control-sm input-no-border" readonly></td>
        <td><input type="text" name="items[1][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->estimated_dressing_area ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[1][estimated_rate]" value="{{ $readings[1]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[1][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->estimated_dressing_area ?? 0) * ($readings[1]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[1][unit]" value="{{ $readings[1]['unit'] ?? '' }}" class="form-control form-control-sm" required></td>
        <td><input type="text" name="items[1][actual_quantity]" value="{{ $readings[1]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[1][actual_rate]" value="{{ $readings[1]['rate'] ?? 0 }}" class="text-end form-control form-control-sm " required></td>
        <td><input type="text" name="items[1][actual_amount]" value="{{ $readings[1]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>

    <tr>
        <td><input type="text" name="items[2][serial_no]" value="3" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[2][activity_name]" value="Earth work for silt trap" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[2][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->silt_trap_est_qty ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[2][estimated_rate]" value="{{ $readings[4]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[2][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->silt_trap_est_qty ?? 0) * ($readings[4]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[2][unit]" value="{{ $readings[4]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[2][actual_quantity]" value="{{ $readings[4]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[2][actual_rate]" value="{{ $readings[4]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[2][actual_amount]" value="{{ $readings[4]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>

    <tr>
        <td><input type="text" name="items[3][serial_no]" value="4" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[3][activity_name]" value="Outlet - Hume Pipe" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[3][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->outlet_work_estimated_quantity ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[3][estimated_rate]" value="{{ $readings[2]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[3][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->outlet_work_estimated_quantity ?? 0) * ($readings[2]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[3][unit]" value="{{ $readings[2]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[3][actual_quantity]" value="{{ $readings[2]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[3][actual_rate]" value="{{ $readings[2]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[3][actual_amount]" value="{{ $readings[2]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>


    <tr>
        <td><input type="text" name="items[4][serial_no]" value="5" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[4][activity_name]" value="Outlet - Masonry" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[4][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->estimated_qty_outlet ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[4][estimated_rate]" value="{{ $readings[3]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[4][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->estimated_qty_outlet ?? 0) * ($readings[3]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[4][unit]" value="{{ $readings[3]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[4][actual_quantity]" value="{{ $readings[3]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[4][actual_rate]" value="{{ $readings[3]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[4][actual_amount]" value="{{ $readings[3]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>



    <tr>
        <td><input type="text" name="items[5][serial_no]" value="6" class=" text-center form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[5][activity_name]" value="Inlet - Earthwork" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[5][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->inlet_est_qty ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[5][estimated_rate]" value="{{ $readings[5]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[5][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->inlet_est_qty ?? 0) * ($readings[5]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[5][unit]" value="{{ $readings[5]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[5][actual_quantity]" value="{{ $readings[5]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[5][actual_rate]" value="{{ $readings[5]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[5][actual_amount]" value="{{ $readings[5]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>

    <tr>
        <td><input type="text" name="items[6][serial_no]" value="7" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[6][activity_name]" value="Inlet - Stone pitching" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[6][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->stone_pitching_inlet_est_qty ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[6][estimated_rate]" value="{{ $readings[6]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[6][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->stone_pitching_inlet_est_qty ?? 0) * ($readings[6]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[6][unit]" value="{{ $readings[6]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[6][actual_quantity]" value="{{ $readings[6]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[6][actual_rate]" value="{{ $readings[6]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[6][actual_amount]" value="{{ $readings[6]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>

    <tr>
        <td><input type="text" name="items[7][serial_no]" value="8" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[7][activity_name]" value="Display board - Earthwork" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[7][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->estimated_excavation_qty ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[7][estimated_rate]" value="{{ $readings[7]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[7][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->estimated_excavation_qty ?? 0) * ($readings[7]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[7][unit]" value="{{ $readings[7]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[7][actual_quantity]" value="{{ $readings[7]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[7][actual_rate]" value="{{ $readings[7]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[7][actual_amount]" value="{{ $readings[7]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>

    <tr>
        <td><input type="text" name="items[8][serial_no]" value="9" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[8][activity_name]" value="Display board - Brick work" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[8][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->estimated_brick_work_qty ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[8][estimated_rate]" value="{{ $readings[8]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[8][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->estimated_brick_work_qty ?? 0) * ($readings[8]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[8][unit]" value="{{ $readings[8]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[8][actual_quantity]" value="{{ $readings[8]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[8][actual_rate]" value="{{ $readings[8]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[8][actual_amount]" value="{{ $readings[8]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>

    <tr>
        <td><input type="text" name="items[9][serial_no]" value="10" class="form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[9][activity_name]" value="Display board - Plaster" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[9][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->estimated_plaster_work_qty ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[9][estimated_rate]" value="{{ $readings[9]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[9][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->estimated_plaster_work_qty ?? 0) * ($readings[9]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[9][unit]" value="{{ $readings[9]['unit'] ?? '' }}" class=" text-center form-control form-control-sm" required></td>
        <td><input type="text" name="items[9][actual_quantity]" value="{{ $readings[9]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[9][actual_rate]" value="{{ $readings[9]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[9][actual_amount]" value="{{ $readings[9]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>

    <tr>
        <td><input type="text" name="items[10][serial_no]" value="11" class="text-center form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[10][activity_name]" value="Display board - Wall writing" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        <td><input type="text" name="items[10][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->estimated_wall_writing_qty ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[10][estimated_rate]" value="{{ $readings[10]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[10][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->estimated_wall_writing_qty ?? 0) * ($readings[10]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>
        <td><input type="text" name="items[10][unit]" value="{{ $readings[10]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[10][actual_quantity]" value="{{ $readings[10]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[10][actual_rate]" value="{{ $readings[10]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[10][actual_amount]" value="{{ $readings[10]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>



    <tr>
        <td><input type="text" name="items[11][serial_no]" value="12" class="text-center form-control-plaintext  text-center" readonly></td>
        <td><input type="text" name="items[11][activity_name]" value="Grass Turfing" class="text-start form-control form-control-sm  input-no-border" readonly></td>
        
        <td><input type="text" name="items[11][estimated_quantity]" value="{{ $baseline->baseline->quantityCalculation->grass_dressing_area ?? 0 }}" class="text-end form-control form-control-sm" required></td>


        <td><input type="text" name="items[11][estimated_rate]" value="{{ $readings[11]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
      
      
        <td><input type="text" name="items[11][estimated_amount]" value="{{ ($baseline->baseline->quantityCalculation->grass_dressing_area ?? 0) * ($readings[11]['rate'] ?? 0) }}" class="text-end form-control form-control-sm estimated-amount" required></td>


        <td><input type="text" name="items[11][unit]" value="{{ $readings[11]['unit'] ?? '' }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[11][actual_quantity]" value="{{ $readings[11]['qty'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[11][actual_rate]" value="{{ $readings[11]['rate'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
        <td><input type="text" name="items[11][actual_amount]" value="{{ $readings[11]['amount'] ?? 0 }}" class="text-end form-control form-control-sm" required></td>
    </tr>
    @if ($measurementBook)
    <tr>
        <td colspan="4" class="text-end"><strong>Total</strong></td>
    <td id="total_estimated_amount" class="text-end">0</td>
        <td colspan="3" class="text-end"><strong></strong></td>
        <td>
            <input type="text" name="total" value="{{ number_format($measurementBook->total, 2) }}" class="form-control form-control-sm text-end" readonly>
        </td>
    </tr>

    <tr>
        <td colspan="4"  class="text-end"><strong>GST @18%</strong></td>
        <td id="with_gst" class="text-end">0</td>
        <td colspan="3"  class="text-end"><strong></strong></td>
        <td>
            <input type="text" name="gst"  value="{{ number_format($measurementBook->gst, 2) }}" 
                class="form-control form-control-sm text-end" readonly>
        </td>
    </tr>

    <tr>
        <td colspan="4"  class="text-end"><strong>G. Total</strong></td>
        <td id="total_with_gst" class="text-end">0</td>
        <td colspan="3"  class="text-end"><strong></strong></td>
        <td>
            <input type="text" name="grand_total" 
                value="{{ number_format($measurementBook->grand_total, 2) }}" 
                class="form-control form-control-sm text-end fw-bold" readonly>
        </td>
    </tr>




    @else
    <tr>
        <td colspan="13">No measurement book found for this baseline.</td>
    </tr>
    @endif
    </tbody>
    </table>




<div class="container mt-4">
    <div class="row row-cards">

        {{-- Pre Work --}}
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-header">
                    <h3 class="card-title">Pre Work Earthwork Photograph</h3>
                </div>
                <div class="card-body text-center">
                    @if(!empty($geoTagedPhoto))
                        <div class="ratio ratio-4x3">
                            <img src="{{ asset('storage/' . $geoTagedPhoto) }}" 
                                 alt="Pre Work Photograph" 
                                 class="object-cover rounded shadow-sm w-100 h-100">
                        </div>
                    @else
                        <p class="text-muted">No pre-work photograph available</p>
                    @endif
                    <input type="hidden" name="pre_work_photograph" value="{{ $geoTagedPhoto }}">
                </div>
            </div>
        </div>

        {{-- Post Work --}}
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-header">
                    <h3 class="card-title">Post Work Earthwork Photograph</h3>
                </div>
                <div class="card-body text-center">
                    <div class="ratio ratio-4x3">
                        <img src="{{ asset('storage/'.$baseline->earthwork_photograph) }}" 
                             alt="Post Work Photograph" 
                             class="object-cover rounded shadow-sm w-100 h-100">
                    </div>
                    <input type="hidden" name="earthwork_photograph" value="{{ $baseline->earthwork_photograph }}">
                </div>
            </div>
        </div>

        {{-- Inlet --}}
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-header">
                    <h3 class="card-title">Inlet Photograph</h3>
                </div>
                <div class="card-body text-center">
                    <div class="ratio ratio-4x3">
                        <img src="{{ asset('storage/' . $baseline->inlet) }}" 
                             alt="Inlet Photograph" 
                             class="object-cover rounded shadow-sm w-100 h-100">
                    </div>
                    <input type="hidden" name="inlet_photograph" value="{{ $baseline->inlet }}">
                </div>
            </div>
        </div>

        {{-- Masonry Outlet --}}
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-header">
                    <h3 class="card-title">Masonry Outlet Photograph</h3>
                </div>
                <div class="card-body text-center">
                    <div class="ratio ratio-4x3">
                        <img src="{{ asset('storage/' . $baseline->masonry_outlet) }}" 
                             alt="Masonry Outlet Photograph" 
                             class="object-cover rounded shadow-sm w-100 h-100">
                    </div>
                    <input type="hidden" name="masonry_outlet_photograph" value="{{ $baseline->masonry_outlet }}">
                </div>
            </div>
        </div>

        {{-- Masonry Outlet Outer --}}
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-header">
                    <h3 class="card-title">Masonry Outlet Outer Photograph</h3>
                </div>
                <div class="card-body text-center">
                    <div class="ratio ratio-4x3">
                        <img src="{{ asset('storage/'.$baseline->masonry_outlet_outer) }}" 
                             alt="Masonry Outlet Outer Photograph" 
                             class="object-cover rounded shadow-sm w-100 h-100">
                    </div>
                    <input type="hidden" name="masonry_outlet_outer_photograph" value="{{ $baseline->masonry_outlet_outer }}">
                </div>
            </div>
        </div>

        {{-- Display Board --}}
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-header">
                    <h3 class="card-title">Display Board Photograph</h3>
                </div>
                <div class="card-body text-center">
                    <div class="ratio ratio-4x3">
                        <img src="{{ asset('storage/'.$baseline->display_board) }}" 
                             alt="Display Board Photograph" 
                             class="object-cover rounded shadow-sm w-100 h-100">
                    </div>
                    <input type="hidden" name="display_board_photograph" value="{{ $baseline->display_board }}">
                </div>
            </div>
        </div>

    </div>
</div>


    @if (Auth::check() && Auth::user()->role_id === 1)
        <!-- Submit Button -->
        <div class="text-center mt-4">
            <button type="submit" class="btn btn-success px-4">Submit</button>
        </div>
    @else
        <!-- Verified & Submit Button -->
        <div class="text-center mt-4">
            <button type="submit" class="btn btn-success px-4">Verified & Submit</button>
        </div>
    @endif


    </form>


    <!-- Simple JS to clone item block -->
    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
    document.addEventListener('DOMContentLoaded', function() {
        const qtyInputs = document.querySelectorAll('input[name^="items"][name$="[qty]"]');
        const rateInputs = document.querySelectorAll('input[name^="items"][name$="[rate]"]');
        const gstPercentInput = document.getElementById('gst_percent');

        qtyInputs.forEach(input => {
            input.addEventListener('input', updateRowAndTotals);
        });

        rateInputs.forEach(input => {
            input.addEventListener('input', updateRowAndTotals);
        });

        gstPercentInput.addEventListener('input', updateTotals);

        function updateRowAndTotals() {
            const row = this.closest('tr');
            const qty = parseFloat(row.querySelector('input[name$="[qty]"]').value) || 0;
            const rate = parseFloat(row.querySelector('input[name$="[rate]"]').value) || 0;
            const amount = qty * rate;

            const amountInput = row.querySelector('input[name$="[amount]"]');
            amountInput.value = amount.toFixed(2);

            updateTotals();
        }

        function updateTotals() {
            let totalAmount = 0;
            const amountInputs = document.querySelectorAll('input[name^="items"][name$="[amount]"]');

            amountInputs.forEach(input => {
                totalAmount += parseFloat(input.value) || 0;
            });

            document.getElementById('total_amount').value = totalAmount.toFixed(2);

            const gstPercent = parseFloat(gstPercentInput.value) || 0;
            const gstAmount = (totalAmount * gstPercent) / 100;
            document.getElementById('gst_amount').value = gstAmount.toFixed(2);

            const grandTotal = totalAmount + gstAmount;
            document.getElementById('grand_total').value = grandTotal.toFixed(2);

            document.getElementById('round_grand_total').value = Math.round(grandTotal);
        }

        // 👉 New: Also calculate all row amounts once on load:
        function updateAllRowAmounts() {
            const rows = document.querySelectorAll('tbody tr');

            rows.forEach(row => {
                const qtyInput = row.querySelector('input[name$="[qty]"]');
                const rateInput = row.querySelector('input[name$="[rate]"]');
                const amountInput = row.querySelector('input[name$="[amount]"]');

                if (qtyInput && rateInput && amountInput) {
                    const qty = parseFloat(qtyInput.value) || 0;
                    const rate = parseFloat(rateInput.value) || 0;
                    const amount = qty * rate;
                    amountInput.value = amount.toFixed(2);
                }
            });

            updateTotals();
        }

        // 👉 Call once on load:
        updateAllRowAmounts();
    });

    </script>

    <script>
    document.addEventListener("DOMContentLoaded", function () {
        const inputs = document.querySelectorAll(".estimated-amount");
        const totalCell = document.getElementById("total_estimated_amount"); 
        const GstCell = document.getElementById("with_gst"); // Only GST 18%
        const totalGstCell = document.getElementById("total_with_gst"); // Total + GST

        function calculateTotal() {
            let total = 0;

            // Calculate total from all inputs
            inputs.forEach(input => {
                total += parseFloat(input.value) || 0;
            });

            // Show total estimated amount in <td>
            totalCell.textContent = total.toFixed(2);

            // Calculate 18% GST
            const gst = total * 0.18;

            // Show only GST amount
            if (GstCell) {
                GstCell.textContent = gst.toFixed(2);
            }

            // Show total including GST
            if (totalGstCell) {
                totalGstCell.textContent = (total + gst).toFixed(2);
            }
        }

        // Initial calculation on page load
        calculateTotal();

        // Recalculate whenever input changes
        inputs.forEach(input => {
            input.addEventListener("input", calculateTotal);
        });
    });
    </script>
    <script>
        // Auto-hide success message after 5 seconds
        setTimeout(function() {
            let successAlert = document.getElementById('success-alert');
            if (successAlert) {
                successAlert.style.transition = "opacity 0.5s ease";
                successAlert.style.opacity = "0";
                setTimeout(() => successAlert.remove(), 500);
            }
        }, 5000);
    </script>

    @endsection