<div class="row">
    <div class="container">
        <ol class="breadcrumb">
            <li><a href="#">شئون العاملين</a></li>
            <li><a href="permanentemployee.php?do=show">مرتبات الموظفين المثبتين </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="permanentemployee.php?do=add"
                      method="post" enctype="multipart/form-data" id="spform">
                    {/literal}

                    <!-- =================================================   -->
                   <div class="form-group">
                        <label class="col-lg-2 control-label">الموظف</label>
                         <div class="col-lg-4">
                            <span>
                        <select name="name" class=" select2" required data-placeholder="اختر الموظف" class="select2 wdt100" >
                             <option value="-1">اختر الموظف</option>
                            {foreach $showData as $data}
                                <option value="{$data.id}">{$data.name}</option>
                            {/foreach}
                        </select>
                        </span>
                        </div>
                    </div>
                    <div class="form-group">
                   <label class="col-lg-2 control-label">عن شهر :</label>
                   <div class="col-lg-4">
                            <select name="month" id="month" class="form-control">
                                <option value="-1">-- اختر الشهر --</option>
                                <option value="1">يناير</option>
                                <option value="2">فبراير</option>
                                <option value="3">مارس</option>
                                <option value="4">أبريل</option>
                                <option value="5">مايو</option>
                                <option value="6">يونيو</option>
                                <option value="7">يوليو</option>
                                <option value="8">أغسطس</option>
                                <option value="9">سبتمبر</option>
                                <option value="10">أكتوبر</option>
                                <option value="11">نوفمبر</option>
                                <option value="12">ديسمبر</option>
                            </select>
                        </div>
                    </div>
                    
                     <label >الاستحقاقات :</label>
                    
                         
                        <div class="form-group">
                            <label class="col-lg-2 control-label">المرتب</label>
                            <div class="col-lg-4">
                                <span id="sprytextfield2">
                                    <input name="salary" id="salary" type="number" class="calc-input form-control " placeholder="0" />
                                   
                            </div>
                        </div>
                         <div class="form-group">
                      <label class="col-lg-2 control-label">علاوة 15%</label>
                        <div class="col-lg-4">
                            <input name="bonus" id="bonus" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                        <div class="form-group">
                      <label class="col-lg-2 control-label">حصة الجمعية في التأمينات</label>
                        <div class="col-lg-4">
                            <input name="comp_share" id="comp_share" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                        </div>
                        <div class="form-group">
                      <label class="col-lg-2 control-label">بدل تفرغ</label>
                        <div class="col-lg-4">
                            <input name="free_allowance" id="free_allowance" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                        </div>
                        <div class="form-group">
                      <label class="col-lg-2 control-label">بدل تمثيل</label>
                        <div class="col-lg-4">
                            <input name="act_allowance" id="act_allowance" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                        </div>
                        <div class="form-group">
                      <label class="col-lg-2 control-label">غلاء معيشة</label>
                        <div class="col-lg-4">
                            <input name="living_cost" id="living_cost" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                        </div>
                        <div class="form-group">
                      <label class="col-lg-2 control-label">علاوة اجتماعية</label>
                        <div class="col-lg-4">
                            <input name="social_bonus" id="social_bonus" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                        </div>
                        <div class="form-group">
                            <label class="col-lg-2 control-label">بدل انتقال</label>
                            <div class="col-lg-4">
                                <input name="move_allowance" id="move_allowance" type="number" class="calc-input form-control" placeholder="0" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-lg-2 control-label">بدلات اخري</label>
                            <div class="col-lg-4">
                                <input name="other_allowance" id="other_allowance" type="number" class="calc-input form-control" placeholder="0" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-lg-2 control-label">جهود غير عادية</label>
                            <div class="col-lg-4">
                                <input name="efforts" id="efforts" type="number" class="calc-input form-control" placeholder="0" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-lg-2 control-label">منحة شهرية</label>
                            <div class="col-lg-4">
                                <input name="monthly_grant" id="monthly_grant" type="number" class="calc-input form-control" placeholder="0" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-lg-2 control-label">حافز اثابة</label>
                            <div class="col-lg-4">
                                <input name="good_bonus" id="good_bonus" type="number" class="calc-input form-control" placeholder="0" />
                            </div>
                        </div>
                    <div class="form-group">
                        <label class="col-lg-2 control-label" style="font-weight: bold;">إجمالي الاستحقاقات</label>
                        <div class="col-lg-4">
                            <input name="total_earn" id="total_earn" type="number" readonly class="form-control" style="background: #e9ecef; font-weight: bold;" />
                        </div>
                    </div>
                     <label >الاستقطاعات :</label>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">حصة العامل في التأمينات</label>
                        <div class="col-lg-4">
                            <input name="work_share" id="work_share" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">ص.خدمة</label>
                        <div class="col-lg-4">
                            <input name="service" id="service" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">سلفة الجمعية</label>
                        <div class="col-lg-4">
                            <input name="advance" id="advance" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">قرض الجمعية</label>
                        <div class="col-lg-4">
                            <input name="comp_loan" id="comp_loan" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">سلفة صندوق خدمة</label>
                        <div class="col-lg-4">
                            <input name="service_advance" id="service_advance" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">قرض صندوق خدمة</label>
                        <div class="col-lg-4">
                            <input name="service_loan" id="service_loan" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">دمغة نسبية</label>
                        <div class="col-lg-4">
                            <input name="stamp" id="stamp" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">ضريبة</label>
                        <div class="col-lg-4">
                            <input name="tax" id="tax" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                       <div class="form-group">
                           <label class="col-lg-2 control-label">ضرائب س. سابقة</label>
                        <div class="col-lg-4">
                            <input name="previous_taxes" id="previous_taxes" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                    <div class="form-group">
                           <label class="col-lg-2 control-label">مدينون</label>
                        <div class="col-lg-4">
                            <input name="debets" id="debets" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                    <div class="form-group">
                           <label class="col-lg-2 control-label">غياب بدون اجر</label>
                        <div class="col-lg-4">
                            <input name="absence" id="absence" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                    <div class="form-group">
                           <label class="col-lg-2 control-label">جزاءات</label>
                        <div class="col-lg-4">
                            <input name="penalties" id="penalties" type="number" class="calc-input form-control" placeholder="0" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-2 control-label" style="font-weight: bold;">إجمالي الاستقطاعات</label>
                        <div class="col-lg-4">
                            <input name="deductions" id="deductions" type="number" readonly class="form-control" style="background: #e9ecef; font-weight: bold;" />
                        </div>
                    </div>
                    
                    <div class="form-group">
                        <label class="col-lg-2 control-label" style="font-weight: bold;">صافي المستحق</label>
                        <div class="col-lg-4">
                            <input name="net" id="net" type="number" readonly class="form-control" style="background: #e9ecef; font-weight: bold;" />
                        </div>
                    </div>
                    <!-- =================================================   -->
                    <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");
            var myForm = document.getElementById("spform");
            var SS = Spry.Widget.Form.validate(myForm);
            if (SS == true) {
                myForm.submit();
            } else {
                $('#spbutton').removeClass("processing");
            }
        }
    });
$(document).ready(function() {
    $('#nature').on('change', function() {
        if ($(this).val() === 'other') {
            $('#other_input_container').show();
        } else {
            $('#other_input_container').hide(); 
            $('#other_nature').val(''); 
        }
    });
});
$(document).ready(function(){
    $('#name').on('change', function() {
        let sideValue = $(this).find(':selected').data('side');
        if (sideValue) {
                $('#side').val(sideValue);
            } else {
                $('#side').val(''); 
            }
        });
});

function doCalculation() {
    let salary = parseFloat($('#salary').val()) || 0;
    let bonus    = parseFloat($('#bonus').val()) || 0;
    let comp_share = parseFloat($('#comp_share').val()) || 0;
    let free_allowance = parseFloat($('#free_allowance').val()) || 0;
    let act_allowance    = parseFloat($('#act_allowance').val()) || 0;
    let living_cost = parseFloat($('#living_cost').val()) || 0;
    let social_bonus = parseFloat($('#social_bonus').val()) || 0;
    let move_allowance    = parseFloat($('#move_allowance').val()) || 0;
    let other_allowance = parseFloat($('#other_allowance').val()) || 0;
    let efforts = parseFloat($('#efforts').val()) || 0;
    let monthly_grant    = parseFloat($('#monthly_grant').val()) || 0;
    let good_bonus = parseFloat($('#good_bonus').val()) || 0;
    let work_share       = parseFloat($('#work_share').val()) || 0;
    let service      = parseFloat($('#service').val()) || 0;
    let advance     = parseFloat($('#advance').val()) || 0;
    let comp_loan     = parseFloat($('#comp_loan').val()) || 0;
    let service_advance     = parseFloat($('#service_advance').val()) || 0;
    let service_loan     = parseFloat($('#service_loan').val()) || 0;
    let stamp     = parseFloat($('#stamp').val()) || 0;
    let tax     = parseFloat($('#tax').val()) || 0;
    let previous_taxes     = parseFloat($('#previous_taxes').val()) || 0;
    let debets     = parseFloat($('#debets').val()) || 0;
    let absence     = parseFloat($('#absence').val()) || 0;
    let penalties     = parseFloat($('#penalties').val()) || 0;
    let totalEarn = salary + bonus + comp_share + free_allowance + act_allowance + living_cost + social_bonus + move_allowance + other_allowance + efforts + monthly_grant + good_bonus ;
    $('#total_earn').val(totalEarn.toFixed(2));
   let totalDeductions = work_share + service + advance + advance + comp_loan + service_advance + service_loan + stamp + tax + previous_taxes + debets + absence + penalties ;
    $('#deductions').val(totalDeductions.toFixed(2));
  
    
   let netTotal = totalEarn - totalDeductions;
    $('#net').val(netTotal.toFixed(2));
}

$(document).on('input', '.calc-input', function() {
    doCalculation();
});

</script>
{/literal}
 