<style>
    .table thead tr >th{
        background-color:#4c0870;
        color:#fff;
    }
    .success {background:#4c0870 !important}
</style>
<div class="container-fluid container-fixed-lg bg-white">
    <div class="panel panel-transparent">
        <div class="panel-heading">
            <div class="panel-title"><?php print CommonLanguage::getMessage('piece_service'); ?></div>
            <div class="col-xs-12 p-0 m-b-10">
                <button id="add_piece_service" data-toggle="modal" data-target="#add-edit-piece-modal" type="button" class="btn btn-success btn-cons btn-animated from-left pg pg-plus pull-right">
                    <span> <?php print CommonLanguage::getMessage('add_piece_service'); ?></span>
                </button>
            </div>
        </div>
        <div class="panel-body">
            <div class="row">
                <div class="col-md-12">
                    <div class="table-responsive">
                        <table class="table table-bordered table-hover demo-table-search" id="tableWithSearch">
                            <thead>
                                <tr>
                                    <th class="text-center"><?php print CommonLanguage::getMessage('servicesname'); ?></th>
                                    <th class="text-center"><?php print CommonLanguage::getMessage('price'); ?></th>
                                    <th class="text-center"><?php print CommonLanguage::getMessage('currency'); ?></th>
                                    <th class="text-center"><?php print CommonLanguage::getMessage('Action'); ?></th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="add-edit-piece-modal" data-backdrop="static" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="pg-close fs-20"></i>
                </button>
                <h5 class="add-label h-labels text-left semi-bold hidden"><?php echo CommonLanguage::getMessage('add_piece_service');?></h5>
                <h5 class="edit-label h-labels text-left semi-bold hidden"><?php echo CommonLanguage::getMessage('edit_piece_service');?></h5>
            </div>
            <div class="modal-body">
                <form id="piece_service_form" method="POST" onsubmit="return false">
                    <input type='hidden' name='piece_service_id' id='piece_service_id'/>
                    <div class="row">
                        <?php echo Forms::AlertDiv('piece_service_alert'); ?>
                        <div class="col-md-12 form-group m-t-10">
                            <label><?php print CommonLanguage::getMessage('servicesname'); ?></label><span class="red-star">*</span>
                            <input type="text"  placeholder="<?php print CommonLanguage::getMessage('servicesname'); ?>" id="piece_service_name" name="piece_service_name" class="form-control " required>
                        </div>
                        <div class="col-md-12 form-group m-t-10">
                            <label><?php print CommonLanguage::getMessage('price'); ?></label><span class="red-star">*</span>
                            <input type="number" step="any"  placeholder="<?php print CommonLanguage::getMessage('price'); ?>" id="piece_service_price" name="piece_service_price" class="form-control " required>
                        </div>
                        <div class="col-md-12 form-group">
                            <label><?php print CommonLanguage::getMessage('currency'); ?></label><span class="red-star">*</span>
                            <div id="CurrencyIDContainer" class=" " >
                                <div class="form-group form-material floating ">
                                    <div class="input-group-btn DropDownForForms Closable" id="CurrencyDropDown" data-symbol="<?php echo smc_session()['local_currency_symbol']; ?>">
                                        <button type="button" class="btn btn-success btn-block dropdown-toggle full-width" data-toggle="dropdown" aria-expanded="false">
                                            <span><?php echo smc_session()['local_currency_name'] . ' - ' . smc_session()['local_currency_symbol'] ?></span>
                                            <input type="hidden"  value="<?php echo smc_session()['local_currency'] ?>" class="form-control ignore" onkeyup="return false" onkeydown="return false" id="currency_id"/>
                                        </button>
                                        <ul class="dropdown-menu">
                                            <?php echo $CurList ?>
                                            <li class="divider"></li>
                                            <li><a class="LoadMore">More..</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close'); ?></button>
                <button class="btn btn-success" id="submit_piece_service"><?php print CommonLanguage::getMessage('Save'); ?></button>
            </div>
            <?php echo Forms::ModalLoader('pieceServiceLoader'); ?>
        </div>
    </div>
</div>
<script>
    $(function(){
        RebuildDataTable($('.panel-heading .panel-title').html(), [0,1,2], 'HRMAjax/viewPieceService');
        $('#tableWithSearch').on('click', '.delete_piece_service', function () {
            var entry_value = $(this).parents('div.Action').attr('data-id')
            IncludeDeleteModal(common_delete_modal, {table:'tbl_piece_service',
                                                     entry_id:'piece_service_id',
                                                     entry_value: entry_value}, function () {
                RebuildDataTable($('.panel-heading .panel-title').html(), [0,1,2], 'HRMAjax/viewPieceService');
            }, "common_ajax/commonDelete");
        });
        $("#add_piece_service").on("click", function () {
            $("#piece_service_id").val(0);
            $("#add-edit-piece-modal .add-label").removeClass('hidden')
        });
        $("#tableWithSearch").on("click", ".edit_piece_service", function () {
            var piece_service_id = $(this).parents('div.Action').attr('data-id');
            $("#piece_service_id").val(piece_service_id);
            $("#add-edit-piece-modal .edit-label").removeClass('hidden');
            CommonViewById('',{table:'view_piece_service',entry_id:'piece_service_id',entry_value:piece_service_id},
                           '#pieceServiceLoader',function(response){
                $('#piece_service_name').val(response[0].piece_service_name)
                $('#piece_service_price').val(response[0].piece_service_price)
                $('#currency_id').val(response[0].currency_id)
                $('#CurrencyDropDown button span').html(response[0].currency)
            });
        });
        $("#submit_piece_service").on("click", function () {
            if (!$("#piece_service_form").valid())
                return;
            var Data = new FormData(document.getElementById("piece_service_form"));
            Data.append('currency_id',$('#currency_id').val());
            $("#pieceServiceLoader").removeClass('hidden');
            $.ajax({
                url: "HRMAjax/submitPieceService",
                method: "POST",
                data: Data,
                processData: false,
                contentType: false,
                dataType: "JSON",
                complete: function (jqXHR, status) {
                    if (status == 'success') {
                        if (jqXHR.responseJSON[1] == "success") {
                            RebuildDataTable($('.panel-heading .panel-title').html(), [0,1,2], 'HRMAjax/viewPieceService');
                            hideModalAlert('add-edit-piece-modal', 'piece_service_alert');
                        }
                        AddAlert("#piece_service_alert", jqXHR.responseJSON[0], jqXHR.responseJSON[1]);
                    }
                    $("#pieceServiceLoader").addClass('hidden');
                }
            });
        });
    });
</script>