@extends('admin.layout.master')
@section('title', __('obs.cost_center'))
@section('custom_style')
    @include('inventory.blade_styles.posting_blade_css')
    {{-- <style>
        {!! $setting->style_css !!}
    </style> --}}
@endsection
@section('content')
    <div class="cl-card card border-secondary border-opacity-50 rounded-2">
        <div class="card-header px-2 d-flex justify-content-between align-items-center">
            <h6 class="card-title m-0">{{__('obs.cost_center')}}</h6>
            <button type="button" class="btn cl-btn btn-warning d-flex align-items-center justify-content-center"
                onclick="createCostCenter()">
                <i class="bi bi-plus fs-6 lh-1"></i>
            </button>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-12">
                    <div class="row gx-2 gy-0 justify-content-center">
                        <div class="col-md-2 col-sm-4 col-6">
                            <div class="mb-0">
                                <label for="status" class="form-label cl-form-label">
                                    {{__('obs.status')}}
                                </label>
                                <select class="select_2 form-select cl-form-select" name="status" id="filter_status">
                                    <option value=""> {{__('obs.choose_one')}}</option>
                                    <option value="1">{{__('obs.active')}}</option>
                                    <option value="0">{{__('obs.inactive')}}</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-2 col-sm-4 col-6 mt-4">
                            <button type="button" class="btn btn-coral cl-btn ms-2"
                                onclick="getCostCenter()">{{__('obs.filter')}}</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row mt-4">
                <div class="col-12" id="div_tbl">
                    <table class="table mb-0 rounded-2 cl-bg-gray-100 cl-table">
                        <thead>
                            <th>#</th>
                            <th>{{__('obs.name')}}</th>
                            <th>{{__('obs.local_name')}}</th>
                            <th>{{__('obs.area')}}</th>
                            <th>{{__('obs.capacity')}}</th>
                            <th>{{__('obs.status')}}</th>
                            <th>{{__('obs.action')}}</th>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
    @include('v2.admin.cost_center.create_update')
    @include('admin.global.loader')
@endsection
@section('script')
    <script>
        $(document).ready(function() {

        });

        const getCCUrl = '/admin/costcenter/list';
        const statusUrl = '/admin/costcenter/update-status';

        const getCostCenter = () => {
            let status = $('#filter_status').val();
            ajaxCallV2(getCCUrl, 'GET', {
                status: status
            }, (costCenters) => {
                $('#div_tbl').html(costCenters);
                $('#costcenter_table').dataTable();
                $('#loader').hide();
            });
        }

        const callbackAfterPostingCostCenter = () => {
            costCenterObj = deepClone(initCostCenterObj);
            $('#costCenterModal').modal('hide');
            getCostCenter();
        }
    </script>
@append