@using System.Web.Mvc.Html

@{
    ViewBag.Title = "Default";
    Layout = "~/Views/Shared/_VehiclesLayout.cshtml";
}

@Html.Partial("Scripts/Default-Init")
@Html.Partial("Scripts/Default-Events")

<div class="contentBlock">
    <div class="header"><h2>Vehicle Summary</h2></div>
    <div>
        <table class="borderless" style="width: 100%">
            <tr>
                <td><b style="width: 200px">Registration Number:</b></td>
                <td><input type="text" data-bind="value: RegistrationNumberSearch" maxlength="50" style="width: 190px" /></td>
                <td><div style="width: 25px">&nbsp;</div></td>
                <td><b style="width: 200px">VIN/Engine Number:</b></td>
                <td><input type="text" data-bind="value: VINSearch" style="width: 190px" /></td>
            </tr>
            <tr>
                <td colspan="5" style="text-align: right"><button class="ui-button" data-bind="click: SearchVehicleDetails">Search</button></td>
            </tr>
        </table>
    </div>
    <hr />
    <div>
        <div data-bind="visible: Vehicles().length > 0">
            <table class="fill-content clickable">
                <thead>
                    <tr>
                        <th>Reference Number</th>
                        <th>Registration #</th>                        
                        <th>VIN #</th>                      
                    </tr>
                </thead>
                <tbody data-bind="foreach: Vehicles">
                    <tr data-bind="click: $root.OpenVehicleConsole.bind($data)">
                        <td data-bind="html: ReferenceNumber"></td>
                        <td data-bind="html: RegistrationNumber"></td>
                        <td data-bind="html: VIN"></td>                        
                    </tr>
                </tbody>
            </table>
        </div>
        <div data-bind="visible: (InitiatedSearch() == false)">Please choose from the criteria above and press search.</div>
        <div data-bind="visible: (Vehicles().length == 0 && InitiatedSearch() == true && CompletedSearch() == true)">There are currently no vehicles that match your search criteria.</div>
        <div data-bind="visible: (Vehicles().length == 0 && InitiatedSearch() == true && CompletedSearch() == false)">Searching vehicles...</div>
        @*<div data-bind="visible: Vehicles.length == 0">There are currently no Verified Vehicles.</div>
        <div class="buttonDock"><button data-bind="click: NewWorkflow, visible: false">Add New Vehicle</button></div>*@
    </div>
</div>