@using CarCareTracker.Helper
@inject IConfigHelper config
@inject ITranslationHelper translator
@model Vehicle
@{
    var userConfig = config.GetUserConfig(User);
    var userLanguage = userConfig.UserLanguage;
    var isNew = Model.Id == 0;
    if (Model.ImageLocation == "/defaults/noimage.png")
    {
        Model.ImageLocation = "";
    }
}
<div class="modal-header">
    <h5 class="modal-title" id="addVehicleModalLabel">@(isNew ? translator.Translate(userLanguage, "Add New Vehicle") : translator.Translate(userLanguage, "Edit Vehicle"))</h5>
    @if (isNew)
    {
        <button type="button" class="btn-close" onclick="hideAddVehicleModal()" aria-label="Close"></button>
    }
    else if (!isNew)
    {
        <button type="button" class="btn-close" onclick="hideEditVehicleModal()" aria-label="Close"></button>
    }
    
</div>
<div class="modal-body">
    <form class="form-inline">
        <div class="form-group">
            <label for="inputYear">@translator.Translate(userLanguage, "Year")</label>
            <input type="number" id="inputYear" class="form-control" placeholder="@translator.Translate(userLanguage, "Year(must be after 1900)")" value="@(isNew ? "" : Model.Year)">
            <label for="inputMake">@translator.Translate(userLanguage, "Make")</label>
            <input type="text" id="inputMake" class="form-control" placeholder="@translator.Translate(userLanguage, "Make")" value="@Model.Make">
            <label for="inputModel">@translator.Translate(userLanguage, "Model")</label>
            <input type="text" id="inputModel" class="form-control" placeholder="@translator.Translate(userLanguage, "Model")" value="@Model.Model">
            <label for="inputLicensePlate">@translator.Translate(userLanguage, "License Plate")</label>
            <input type="text" id="inputLicensePlate" class="form-control" placeholder="@translator.Translate(userLanguage, "License Plate")" value="@Model.LicensePlate">
            <div class="form-check form-switch">
                <input class="form-check-input" type="checkbox" role="switch" id="inputIsElectric" checked="@Model.IsElectric">
                <label class="form-check-label" for="inputIsElectric">@translator.Translate(userLanguage, "Electric Vehicle")</label>
            </div>
            <div class="form-check form-switch">
                <input class="form-check-input" type="checkbox" role="switch" id="inputUseHours" checked="@Model.UseHours">
                <label class="form-check-label" for="inputUseHours">@translator.Translate(userLanguage, "Use Engine Hours")</label>
            </div>
            <label for="inputTag">@translator.Translate(userLanguage, "Tags(optional)")</label>
            <select multiple class="form-select" id="inputTag">
                @foreach (string tag in Model.Tags)
                {
                    <!option value="@tag">@tag</!option>
                }
            </select>
            @if (!string.IsNullOrWhiteSpace(Model.ImageLocation))
            {
                <label for="inputImage">@translator.Translate(userLanguage, "Replace picture(optional)")</label>
                <input onChange="uploadFileAsync(this)" type="file" accept=".png,.jpg,.jpeg" class="form-control-file" id="inputImage">
            } else
            {
                <label for="inputImage">@translator.Translate(userLanguage, "Upload a picture(optional)")</label>
                <input onChange="uploadFileAsync(this)" type="file" accept=".png,.jpg,.jpeg" class="form-control-file" id="inputImage">
            }
        </div>
    </form>
</div>
<div class="modal-footer">
    @if (isNew)
    {
        <button type="button" class="btn btn-secondary" onclick="hideAddVehicleModal()">@translator.Translate(userLanguage, "Cancel")</button>
        <button type="button" onclick="saveVehicle(false)" class="btn btn-primary">@translator.Translate(userLanguage, "Add New Vehicle")</button>
    } else if (!isNew)
    {
        <button type="button" class="btn btn-secondary" onclick="hideEditVehicleModal()">@translator.Translate(userLanguage, "Cancel")</button>
        <button type="button" onclick="saveVehicle(true)" class="btn btn-primary">@translator.Translate(userLanguage, "Save Vehicle")</button>
    }
</div>
<script>
    var uploadedFile = "@Model.ImageLocation";
    function getVehicleModelData() {
        return { id: @Model.Id}
    }
</script>