<?php
include_once "global.php";

$pageTitle = 'Generate New Invoice - ';
include_once 'header.php';
?>

<!--breadcrumb-->
<div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
    <div class="breadcrumb-title pe-3">Invoice Management</div>
    <div class="ps-3">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0 p-0">
                <li class="breadcrumb-item"><a href="javascript:;"></a>
                </li>
                <li class="breadcrumb-item active" aria-current="page">Create Invoice</li>
            </ol>
        </nav>
    </div>
</div>
<!--end breadcrumb-->
<h6 class="mb-0 text-uppercase">Generate New Invoice</h6>
<hr>
<div class="card">
    <div class="card-body p-4">
        <form id="invoiceCreateForm" class="row g-3" method="post" enctype="multipart/form-data">
            <input type="hidden" name="invtaxamount" id="invtaxamount">
            <div class="col-md-6">
                <label for="invclientId" class="form-label">Client Name <span>*</span></label>
                <select id="invclientId" name="invclientId" class="single-select-field"
                    data-placeholder="Select a client" required>
                    <option value="" disabled selected>Select...</option>
                    <?php
                    $clients = $productClass->AllClientsArray();
                    foreach ($clients as $client) {
                        $clientId = $client["acc_id"];
                        $clientName = $client["acc_name"];
                        $clientEmail = $client["acc_email"];
                        echo "<option value='$clientId'>$clientName - $clientEmail</option>";
                    }
                    ?>
                </select>
            </div>
            <div class="col-md-6">
                <label for="invcompany" class="form-label">Company Name <span>*</span></label>
                <select id="invcompany" name="invcompany" class="form-select" disabled required>

                </select>
            </div>
            <div class="col-md-4">
                <label class="form-label d-block">Invoice Format</label>
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="invoiceformat" id="Imedia" value="Imedia"
                        checked>
                    <label class="form-check-label" for="Imedia">Imedia</label>
                </div>
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="invoiceformat" id="Bizsoft" value="Bizsoft"
                        required>
                    <label class="form-check-label" for="Bizsoft">Bizsoft</label>
                </div>
            </div>
            <div class="col-md-4">
                <label for="invnumber" class="form-label">Invoice #</label>
                <input type="text" name="invnumber" id="invnumber" class="form-control">
            </div>

            <div class="col-md-4">
                <label for="invdate" class="form-label">Invoice Date <span>*</span></label>
                <input type="date" name="invdate" id="invdate" class="form-control" required>
            </div>
            <div class="col-md-4">
                <label for="invduedate" class="form-label">Due Date <span>*</span></label>
                <input type="date" name="invduedate" id="invduedate" class="form-control" required>
            </div>
            <div class="col-md-4">
                <label for="invfor" class="form-label">Invoice For <span>*</span></label>
                <select name="invfor" id="invfor" class="form-select" required>
                    <option selected="" value="">Select...</option>
                    <option value="Domain + Hosting">Domain + Hosting</option>
                    <option value="Hosting">Hosting</option>
                    <option value="Domain">Domain</option>
                    <option value="Other">Other</option>
                </select>
            </div>
            <div class="col-md-4">
                <label for="invbilledamount" class="form-label">Invoice Billed Amount <span>*</span></label>
                <input type="number" name="invbilledamount" id="invbilledamount" class="form-control" required
                    onkeyup="updateTotalAmount(this);">
            </div>
            <div class="col-md-4">
                <label for="invtype" class="form-label">Invoice Type <span>*</span></label>
                <select name="invtype" id="invtype" class="form-select" required>
                    <option value="sales_tax">Including Sales Tax (15%)</option>
                    <option value="normal" selected="selected">Normal</option>
                </select>
            </div>
            <div class="col-md-4">
                <label for="invtotalbillamount" class="form-label">Invoice Total Billed Amount
                    <span>*</span></label>
                <input type="number" name="invtotalbillamount" id="invtotalbillamount" class="form-control" required>
            </div>
            <div class="col-md-4">
                <label for="invstatus" class="form-label">Status <span>*</span></label>
                <select class="form-select" name="invstatus" id="invstatus" required>
                    <option selected="" value="">Select...</option>
                    <?php
                    $invoiceStatuses = $productClass->getInvoiceStatuses();
                    foreach ($invoiceStatuses as $invoiceStatus) {
                        $statusId = $invoiceStatus["id"];
                        $name = $invoiceStatus["name"];
                        echo "<option value='$statusId'>$name</option>";
                    }
                    ?>
                </select>
            </div>
            <div class="col-md-4" id="invprototalamountDiv" style="display: none;">
                <label for="invprototalamount" class="form-label">Project Total Amount</label>
                <input type="number" name="invprototalamount" id="invprototalamount" class="form-control">
            </div>
            <div class="col-md-4" id="invrcvdamountDiv" style="display: none;">
                <label for="invrcvdamount" class="form-label">Invoice Received Amount</label>
                <input type="number" name="invrcvdamount" id="invrcvdamount" class="form-control">
            </div>
            <div class="col-md-4">
                <label for="invpdf" class="form-label">Upload Invoice (PDF)</label>
                <input type="file" name="invpdf" id="invpdf" class="form-control">
            </div>
            <div class="row g-3" id="recurrenceDiv" style="display: none;">
                <div class="col-md-4">
                    <label class="form-label d-block">Recurrence</label>
                    <div class="form-check form-check-inline">
                        <input class="form-check-input" type="radio" name="invrecurrence" id="Yes" value="Yes" checked>
                        <label class="form-check-label" for="Yes">Yes</label>
                    </div>
                    <div class="form-check form-check-inline">
                        <input class="form-check-input" type="radio" name="invrecurrence" id="No" value="No">
                        <label class="form-check-label" for="No">No</label>
                    </div>
                </div>
                <div class="col-md-4">
                    <label for="invrecurrenceduration" class="form-label">Recurrence Duration</label>
                    <input type="number" name="invrecurrenceduration" id="invrecurrenceduration" class="form-control"
                        placeholder="Type number of months of recurrence">
                </div>
                <div class="col-md-4">
                    <label for="invexpduration" class="form-label">Expiry Duration</label>
                    <input type="number" name="invexpduration" id="invexpduration" class="form-control"
                        placeholder="Type number of months of expiry">
                </div>
                <div class="col-md-4">
                    <label for="invpaymode" class="form-label">Payment Mode</label>
                    <select name="invpaymode" id="invpaymode" class="form-select">
                        <option selected="" value="">Select...</option>
                        <option value="Cash">Cash</option>
                        <option value="Cheque">Cheque</option>
                        <option value="Online Transfer">Online Transfer</option>
                    </select>
                </div>
                <div class="col-md-4">
                    <label for="invbankpost" class="form-label">Bank Post</label>
                    <input type="text" name="invbankpost" id="invbankpost" class="form-control">
                </div>
                <div class="col-md-4">
                    <label for="invdocs" class="form-label">Upload Document(s)</label>
                    <input type="file" name="invdocs[]" id="invdocs" class="form-control" multiple>
                </div>
            </div>
            <div class="col-md-12">
                <label for="invdesc" class="form-label">Description</label>
                <textarea class="form-control" id="invdesc" name="invdesc" rows="3"></textarea>
            </div>
            <div class="showHideDiv" style="display: none;">
                <h5 class="mb-4">Vendor Details</h5>
                <div class="row g-3">
                    <div class="col-md-6">
                        <label for="vendordomain" class="form-label">Domain</label>
                        <input type="text" name="vendordomain" id="vendordomain" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <label for="vendorrgdate" class="form-label">Registration Start Date</label>
                        <input type="date" name="vendorrgdate" id="vendorrgdate" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <label for="invexpirydate" class="form-label">Exact Expiry Date</label>
                        <input type="date" name="invexpirydate" id="invexpirydate" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <label for="vendorpaiddate" class="form-label">Payment Paid Date</label>
                        <input type="date" name="vendorpaiddate" id="vendorpaiddate" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <label for="vendoramount" class="form-label">Paid Amount</label>
                        <input type="number" name="vendoramount" id="vendoramount" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <label for="vendorname" class="form-label">Name</label>
                        <input type="text" name="vendorname" id="vendorname" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <label for="vendoremail" class="form-label">Email</label>
                        <input type="email" name="vendoremail" id="vendoremail" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <label for="vendorphone" class="form-label">Phone</label>
                        <input type="tel" name="vendorphone" id="vendorphone" class="form-control">
                    </div>
                </div>
            </div>
            <div class="col-md-12">
                <div class="d-md-flex d-grid align-items-center gap-3">
                    <button type="submit" class="btn btn-grd-primary px-4">Generate</button>
                    <button type="button" onclick="toggleVendorDetails(this)" class="btn btn-grd-royal px-4">Show Other
                        Fields</button>
                </div>
            </div>
        </form>
    </div>
</div>

<?php
include_once 'footer.php';
?>