<div class="row">
    <div class="container">
        <ol class="breadcrumb">
            <li><a href="#">سيارات</a></li>
              <li><a href="carsreport.php?do=report">تقرير سيارات</a></li>
            <li class="active">تفاصيل</li>
        </ol>
        <div class="panel panel-default panel-m">
            <div class="panel-heading">
                <h3 class="panel-title">تفاصيل</h3>
            </div>
            <div class="panel-body"> {literal}
                <form class="nameToBeChecked form-horizontal" role="form" action="carsreport.php?do=report"
                      method="post" enctype="multipart/form-data" id="spform">
                    {/literal}
                    <div class="form-group">
                        <label for="notes" class="col-lg-2 control-label">السيارة</label>
                        <div class="col-lg-4">
                            <input type="text" name="car" id="car" readonly placeholder="السيارة" value="{$showData.car}" class="form-control">
                        </div>
                        <span class="textfieldRequiredMsg">*</span>
                    </div>
                     <!--==============================-->
                  
                      
                      <div class="form-group">
                        <label for="notes" class="col-lg-2 control-label">اللون</label>
                        <div class="col-lg-4">
                            <input type="text" name="color" id="color" readonly placeholder="اللون" value="{$showData.color}" class="form-control">
                        </div>
                        <span class="textfieldRequiredMsg">*</span>
                    </div>
                    <!--==============================-->
                    
                    <div class="form-group">
                        <label for="notes" class="col-lg-2 control-label">رقم اللوحة</label>
                        <div class="col-lg-4">
                            <input type="text" name="num" id="num" readonly value="{$showData.num}" class="form-control">
                        </div>
                        <span class="textfieldRequiredMsg">*</span>
                    </div>
                    <!--==============================-->
                     <div class="form-group">
                        <label for="notes" class="col-lg-2 control-label">العداد</label>
                        <div class="col-lg-4">
                            <input type="text" name="counter" readonly id="counter" value="{$showData.counter}" placeholder="العداد" class="form-control">
                        </div>
                        <span class="textfieldRequiredMsg">*</span>
                    </div>
                    <!--==============================-->
                    
                    <div class="form-group">
                        <label for="court_decision" class="col-lg-2 control-label">ملاحظات</label>
                        <div class="col-lg-4">
                            <textarea name="notes" id="notes" readonly class="form-control"  rows="4" >{$showData.notes}</textarea>
                        </div>
                    </div>
                       <!--==============================-->
                    
                      <div class="form-group">
                        <label for="announcementName" class="col-lg-2 control-label">جهة التحرك</label>
                        <div class="col-lg-4"> <span id="sprytextfield1">
                                <input type="text" name="from" readonly id="from" class="form-control" value="{$showData.from}" />
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>


                      <!--==============================-->
                      <div class="form-group">
                        <label for="announcementSubDate" class="col-lg-2 control-label"> جهة الوصول</label>
                        <div class="col-lg-4"> <span id="sprytextfield2">
                                <input type="text" readonly name="to" id="to" class="form-control" value="{$showData.to}" >
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>
                     <!--==============================-->
                       <div class="form-group">
                        <label for="announcementInsurance" class="col-lg-2 control-label">تاريخ التحرك</label>
                        <div class="col-lg-4"> <span id="sprytextfield2">
                                <input type="date" name="date" readonly id="date" class="form-control" value="{$showData.l_date}">
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>
                    <!--==============================-->
                    <div class="form-group">
                        <label for="court_decision" class="col-lg-2 control-label">نعليق</label>
                        <div class="col-lg-4">
                            <textarea name="comment" id="comment" readonly class="form-control" rows="4" >{$showData.l_comment}</textarea>
                        </div>
                    </div>
                    
                      <div class="form-group">
                        <label class="col-lg-2 control-label">مرفقات خط السير</label>
                        <div class="col-lg-2">
                              {if $showData.l_images != "" && $showData.l_images !="." &&
                            $showData.l_images !="no image"}
                            <div style="margin-bottom: 10px;">
                            {assign var="imgs" value=","|explode:trim($showData.l_images)}
                            {foreach $imgs as $img}
                                <img src="../upload/ltinerary/{trim($img)}" width="122" height="75" style="border:1px solid #ccc; margin-left:5px;" />
                                
                            {/foreach}
                            </div>
                            {/if}
                            <input type="hidden" name="imageurl" value="{$showData.l_images}" />
                        </div>
                    </div>
                    <!--==============================-->
                    <!--==============================-->
                    <div class="form-group">
                        <label for="announcementName" class="col-lg-2 control-label">نوع الوقود</label>
                        <div class="col-lg-4"> <span id="sprytextfield1">
                                <input type="text" name="type" id="type" readonly class="form-control" value="{$showData.type}" />
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>


                      <!--==============================-->
                      <div class="form-group">
                        <label for="announcementSubDate" class="col-lg-2 control-label"> كمية الوقود </label>
                        <div class="col-lg-4"> <span id="sprytextfield2">
                                <input type="text" readonly name="liters" id="liters" class="form-control" value="{$showData.liters}">
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>
                     <!--==============================-->
                        <div class="form-group">
                        <label for="announcementInsurance" class="col-lg-2 control-label">سعر اللتر</label>
                        <div class="col-lg-4"> <span id="sprytextfield2">
                                <input type="number" readonly name="price" step="0.01" id="price" class="form-control" value="{$showData.price}">
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>
                    <!--==============================-->
                      <div class="form-group">
                        <label for="announcementInsurance" class="col-lg-2 control-label">اجمالي المبلغ المدفوع</label>
                        <div class="col-lg-4"> <span id="sprytextfield2">
                                <input type="number" name="total" readonly step="0.01" id="total" class="form-control" value="{$showData.total}">
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>
                    <!--==============================-->
                    <div class="form-group">
                        <label for="court_decision" class="col-lg-2 control-label">نعليق</label>
                        <div class="col-lg-4">
                            <textarea name="comment" readonly id="comment" class="form-control" rows="4" >{$showData.g_comment}</textarea>
                        </div>
                    </div>
                    
                      <div class="form-group">
                        <label class="col-lg-2 control-label">مرفقات البنزين</label>
                        <div class="col-lg-2">
                              {if $showData.g_images != "" && $showData.g_images !="." &&
                            $showData.g_images !="no image"}
                            <div style="margin-bottom: 10px;">
                            {assign var="imgs" value=","|explode:trim($showData.g_images)}
                            {foreach $imgs as $img}
                                <img src="../upload/gasoline/{trim($img)}" width="122" height="75" style="border:1px solid #ccc; margin-left:5px;" />
                                
                            {/foreach}
                            </div>
                            {/if}
                            
                            <input type="hidden" name="imageurl" value="{$showData.g_images}" />
                        </div>
                    </div>
                     <!--==============================-->
                     
                  <div class="form-group">
                        <label for="announcementName" class="col-lg-2 control-label">تاريخ الاصلاحات</label>
                        <div class="col-lg-4"> <span id="sprytextfield1">
                                <input type="date" name="date" readonly id="date" class="form-control" value="{$showData.date}" />
                                <span class="textfieldRequiredMsg">*</span></span>
                        </div>
                    </div>

                      <!--==============================-->
                       <div class="form-group">
                        <label for="court_decision"  class="col-lg-2 control-label">قطع الغيار والاصلاحات</label>
                        <div class="col-lg-4">
                            <textarea name="fixes" readonly id="fixes" class="form-control" rows="4" >{$showData.fixes}</textarea>
                        </div>
                    </div>

                    
                    <!--==============================-->
                     
                    <div class="form-group">
                        <label for="court_decision" class="col-lg-2 control-label">نعليق</label>
                        <div class="col-lg-4">
                            <textarea name="comment" readonly id="comment" class="form-control" rows="4" >{$showData.comment}</textarea>
                        </div>
                    </div>
                    
                      <div class="form-group">
                        <label class="col-lg-2 control-label">مرفقات الاصلاحات</label>
                        <div class="col-lg-2">
                              {if $showData.f_images != "" && $showData.f_images !="." &&
                            $showData.f_images !="no image"}
                            <div style="margin-bottom: 10px;">
                            {assign var="imgs" value=","|explode:trim($showData.f_images)}
                            {foreach $imgs as $img}
                                <img src="../upload/fixes/{trim($img)}" width="122" height="75" style="border:1px solid #ccc; margin-left:5px;" />
                                
                            {/foreach}
                            </div>
                            {/if}
                           
                            <input type="hidden" name="imageurl" value="{$showData.f_images}" />
                        </div>
                    </div>
                    <!--==============================-->
                    <input name="id" id="id" type="hidden" value="{$showData->id}" />
                    <!-- =================================================   -->
                    <div class="form-group">
                        <div class="col-lg-offset-2 col-lg-4">
                            <button type="button" class="btn btn-primary pull-left" id="spbutton">رجوع</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{literal}
<script type="text/javascript">
    var sprytextfield1 = new Spry.Widget.ValidationTextField("sprytextfield1");
    var sprytextfield2 = new Spry.Widget.ValidationTextField("sprytextfield2");
    $('#spbutton').live('click', function (e) {
        if (!$('#spbutton').hasClass("processing")) {
            $('#spbutton').addClass("processing");
            $('#productCatName').trigger('blur');
            setTimeout(function () {
                var myForm = document.getElementById("spform");
                var SS = Spry.Widget.Form.validate(myForm);
                if (SS == true) {
                    myForm.submit();
                } else {
                    $('#spbutton').removeClass("processing");
                }
            }, 500);
        }
    });
    $(document).ready(function(){
    $('#car').on('change', function() {
        let sideValue = $(this).find(':selected').data('counter');
        if (sideValue) {
                $('#counter').val(sideValue);
            } else {
                $('#counter').val(''); 
            }
        });
})

   
</script>
{/literal}