<!DOCTYPE html>
<html lang="en" class="h-100">


<head>
    <!-- meta and links start -->
    <%- include('templet/meta')-%>

</head>

<body>
        <%- include('templet/preloder_topbar_sidebar',{titel: accessdata?.topbardata?.name})-%>
        <!--********** Content body start **********-->

        <div class="content-body">

            <div class="container-fluid" style="min-height: 100vh;">
                <div class="row">
                    <div class="col-12">
                        <div class="card ">
                            <div class="card-header">
                                <h3 class="card-title">
                                    <%= language.Expence_List %>
                                </h3>
                                <button
                                    class="btn btn-rounded btn-primary <%= accessdata.roll.expense.includes('write') ?'':'d-none' %>"
                                    data-bs-toggle="modal" data-bs-target="#expense_list"><span
                                        class="btn-icon-start text-primary"><i class="fa fa-plus color-info"></i></span>
                                    <%= language.Add_Expence %>
                                </button>
                            </div>
                            <div class="d-none">
                                <input type="hiden" name="sym" value="<%= accessdata.symbol %>">
                                <input type="hiden" name="pls" value="<%= accessdata.plac %>">
                                <input type="hiden" name="thousands_separator"
                                    value="<%= accessdata.thousands_separator %>">
                            </div>
                            <div class="card-body ">
                                <div class="table-responsive">
                                    <table id="example3" class="display table-responsive-lg" style="width: 100%;">
                                        <thead>
                                            <tr>
                                                <th>
                                                    <%= language.Date %>
                                                </th>
                                                <th>
                                                    <%= language.Amount %>
                                                </th>
                                                <th>
                                                    <%= language.TOWARDS %>
                                                </th>
                                                <th>
                                                    <%= language.Tax_included %>
                                                </th>
                                                <th>
                                                    <%= language.PAYMENT_MODE %>
                                                </th>
                                                <th class="<%= ismulty ? '': 'd-none' %>">
                                                    <%= language.Store_Name %>
                                                </th>
                                                <th>
                                                    <%= language.Created_By %>
                                                </th>
                                                <th
                                                    class="<%= accessdata.roll.expense.includes('edit') || accessdata.roll.expense.includes('delete') ?'':'d-none' %>">
                                                    <%= language.Cancel %> Action
                                                </th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <% expenlist.forEach(function(data){ %>
                                                <tr>
                                                    <td class="text-nowrap">
                                                        <% let Order_date=new Date(data.date) %>
                                                            <% let Order_day=(Order_date.getDate() < 10 ? '0' : '' ) +
                                                                Order_date.getDate() %>
                                                                <% let Order_month=((Order_date.getMonth()+1) < 10 ? '0'
                                                                    : '' ) + (Order_date.getMonth()+1) %>
                                                                    <% let Order_year=Order_date.getFullYear() %>
                                                                        <% let
                                                                            Order_fullDate=`${Order_year}-${Order_month}-${Order_day}`
                                                                            %>

                                                                            <%= Order_fullDate %>
                                                    </td>
                                                    <td class="symbol">
                                                        <%= data.amount %>
                                                    </td>
                                                    <td>
                                                        <%= data.towards %>
                                                    </td>
                                                    <td> <span class="badge light badge-warning ">
                                                            <%= data.taxInclud %>
                                                        </span> </td>
                                                    <td>
                                                        <%= data.ac_name %>
                                                    </td>
                                                    <td class="<%= ismulty ? '': 'd-none' %>">
                                                        <%=data.store %>
                                                    </td>
                                                    <td>
                                                        <%= data.name %>
                                                    </td>
                                                    <td>
                                                        <a href="#"
                                                            class="btn btn-primary shadow sharp me-1 <%= accessdata.roll.expense.includes('edit') ?'':'d-none' %>"
                                                            id="expaction" data-bs-toggle="modal"
                                                            data-bs-target="#expense_edit" data-date="<%= data.date %>"
                                                            data-amount="<%= data.amount %>"
                                                            data-toward="<%= data.towards %>"
                                                            data-tex="<%= data.taxInclud %>"
                                                            data-payment="<%= data.payment_mode %>"
                                                            data-category="<%= data.category %>"
                                                            data-id="<%= data.id %>" data-storeid="<%= data.store_ID %>"
                                                            data-texpercent="<%= data.taxpercent %>">
                                                            <i class="fas fa-pencil-alt"></i></a>

                                                        <a href="/expense/deletexpe/<%= data.id %>"
                                                            class="btn btn-danger shadow sharp me-1 <%= accessdata.roll.expense.includes('delete') ?'':'d-none' %>"
                                                            id="delete">
                                                            <i class="fa fa-trash"></i></a>
                                                    </td>
                                                </tr>
                                                <% }) %>


                                        </tbody>
                                    </table>
                                </div>


                            </div>
                        </div>
                    </div>
                </div>
            </div>




            <!--********** Content body end **********-->

            <!-- Modal update -->
            <div class="modal fade" id="expense_edit">
                <div class="modal-dialog  modal-dialog-scrollable" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">
                                <%= language.Expence_Update_Detail %>
                            </h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                        </div>
                        <div class="modal-body">
                            <form action="/expense/updateexp" method="post" class="need-validation" id="expupdat_form">

                                <div class="row g-1 align-items-center">
                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.Date %>
                                            </strong><span class="text-danger">*</span></label>
                                        <input type="date" class="form-control " id="date_update" name="date_update"
                                            required>
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.Expence_Category %>
                                            </strong><span class="text-danger">*</span></label>
                                        <!-- <input type="text" class="form-control" name="towards" required> -->
                                        <select class="form-control wide mb-1" name="expense_category"
                                            id="category_update">
                                            <% categ.forEach(function(data){ %>
                                                <option value="<%=data.id%>">
                                                    <%=data.cat_name%>
                                                </option>
                                                <% }) %>
                                        </select>
                                        
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.EXPENCE_AMOUNT %>
                                            </strong><span class="text-danger">*</span></label>
                                        <input type="number" class="form-control" id="amount_update"
                                            name="amount_update" placeholder="Enter Amount" step="0.01" required>
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.PAYMENT_MODE %>
                                            </strong></label>
                                        <select class="form-control wide mb-1" name="payment_update"
                                            id="payment_update">
                                            <% acountlist.forEach(function(data){ %>
                                                <option value="<%= data.id %>">
                                                    <%= data.ac_name %>
                                                </option>
                                                <% }) %>
                                        </select>
                                          
                                    </div>

                                    <div class="form-group">
                                        <div class="d-flex align-items-center justify-content-between">
                                            <label class="form-label"><strong>
                                                    <%= language.Tax_included %> ?
                                                </strong></label>
                                            <div class="form-check ms-3">
                                                <input class="form-check-input" type="radio" id="no_tax_included_update"
                                                    name="tax" value="no">
                                                <label class="form-check-label" for="no_tax_included_update"> No</label>
                                            </div>
                                            <div class="form-check ms-2">
                                                <input class="form-check-input" type="radio" id="yes_tax_   included_update"
                                                    name="tax" value="yes">
                                                <label class="form-check-label" for="yes_tax_included_update">
                                                    Yes</label>
                                            </div>
                                            <div class=" col-4 form-group ms-2 justify-content-end">

                                                <input type="number" class="form-control d-none" name="tax_percent"
                                                    placeholder="Tax Percent" id="tex_perce_update" value="0">
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.Notes %>
                                            </strong></label>
                                        <!-- <input type="text" class="form-control" name="created_by" required> -->
                                        <input type="text" class="form-control" name="notes_update" id="notes_update"
                                            placeholder="Enter Notes">
                                    </div>

                                </div>
                        </div>

                                <div class="modal-footer">
                                    <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">
                                        <%= language.Cancel %>
                                    </button>
                                    <button type="submit" class="btn btn-sm  btn-primary">
                                        <%= language.Save %>
                                    </button>
                                </div>
                            </form>



                    </div>
                </div>
            </div>

            <!-- Modal add -->
            <div class="modal fade" id="expense_list">
                <div class="modal-dialog  modal-dialog-scrollable" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">
                                <%= language.Add_Expence %>
                            </h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                        </div>
                        <div class="modal-body">
                        <form action="/expense/addexpense" method="post" class="need-validation" id="myexpen">

                                <div class="row g-1 align-items-center">
                                    <div class="col-md-12  <%= ismulty ? '': 'd-none' %>">
                                        <div class="form-group">
                                            <label class="form-label"><strong>
                                                    <%= language.Store_List %>
                                                </strong><span class="text-danger">*</span></label>
                                            <select class=" form-control wide mb-1" name="storeid"
                                                id="expense_add_admin" required>
                                                <option value="" selected disabled> Select Store </option>
                                                <% storeList.forEach(function(x){ %>
                                                    <option value="<%= x.id %>">
                                                        <%= x.name %>
                                                    </option>
                                                    <% }) %>

                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.Date %>
                                            </strong><span class="text-danger">*</span></label>
                                        <input type="date" class="form-control " name="date" required>
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.Expence_Category %>
                                            </strong><span class="text-danger">*</span></label>
                                        <!-- <input type="text" class="form-control" name="towards" required> -->
                                        <select class="form-control wide mb-1" name="category" id="exp_add_category"
                                            required>
                                            <option value="0" selected disabled>Select category</option>
                                            <% categ.forEach(function(data){ %>
                                                <option value="<%=data.id%>">
                                                    <%=data.cat_name%>
                                                </option>
                                                <% }) %>
                                        </select>

                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.EXPENCE_AMOUNT %>
                                            </strong><span class="text-danger">*</span></label>
                                        <input type="number" class="form-control" name="amount"
                                            placeholder="Enter Amount" step=0.01 required>
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.PAYMENT_MODE %>
                                            </strong></label>
                                        <select class="form-control wide mb-1" name="payment" id="exp_add_payment"
                                            required>
                                            <option value="0" selected disabled>Select Payment</option>
                                            <% acountlist.forEach(function(data){ %>
                                                <option value="<%= data.id %>">
                                                    <%= data.ac_name %>
                                                </option>
                                                <% }) %>

                                        </select>
                                    </div>

                                    <div class="form-group">

                                        <div class="d-flex align-items-center justify-content-between">
                                            <label class="form-label"><strong>
                                                    <%= language.Tax_included %> ?
                                                </strong></label>
                                            <div class="form-check ms-3">
                                                <input class="form-check-input" type="radio" id="no_tax_included"
                                                    name="tax" value="no" required checked>
                                                <label class="form-check-label" for="no_tax_included"> No</label>
                                            </div>
                                            <div class="form-check ms-2">
                                                <input class="form-check-input" type="radio" id="yes_tax_included"
                                                    name="tax" value="yes" required>
                                                <label class="form-check-label" for="yes_tax_included"> Yes</label>
                                            </div>
                                            <div class=" col-4 form-group ms-2 justify-content-end">

                                                <input type="number" class="form-control d-none" name="tax_percent"
                                                    placeholder="Tax Percent" id="tex_perce" value="0">
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label><strong>
                                                <%= language.Notes %>
                                            </strong></label>
                                        <!-- <input type="text" class="form-control" name="created_by" required> -->
                                        <textarea class="form-control" name="notes" id="notes" placeholder="Enter Notes"
                                            required></textarea>
                                    </div>
                                    <!-- <div class="form-group">
                                    <label><strong>Password</strong></label>
                                    <input type="text" class="form-control" name="password" required>
                                </div> -->
                                </div>
                            </div>
                   

                            <div class="modal-footer">
                                <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">
                                    <%= language.Cancel %>
                                </button>
                                <button type="submit" value="submit" class="btn btn-sm  btn-primary">
                                    <%= language.Save %>
                                </button>
                            </div>
                        </form>



                </div>
            </div>

        </div>
               </div>
        <!--**********************************
            Footer start
        ***********************************-->
        <%- include('templet/footer')-%>

            <!--**********************************
            Footer end
        ***********************************-->

     

            <!--********** Main wrapper end **********-->
            <%- include('templet/script')-%>

                <script>
                    $('#expense_list').on('shown.bs.modal', function () {

                        $('#expense_add_admin').select2({
                            dropdownParent: $('#expense_list'),
                            placeholder: 'Select Store(s)',
                            width: '100%',
                            allowClear: true
                        });
                    });
                </script>
                <script>
                    $('#expense_list').on('shown.bs.modal', function () {

                        $('#exp_add_category').select2({
                            dropdownParent: $('#expense_list'),
                            placeholder: 'Select Category(c)',
                            width: '100%',
                            allowClear: true
                        });
                    });
                </script>
                <script>
                    $('#expense_list').on('shown.bs.modal', function () {

                        $('#exp_add_payment').select2({
                            dropdownParent: $('#expense_list'),
                            placeholder: 'Select Paymen t Method(p)',
                            width: '100%',
                            allowClear: true
                        });
                    });
                </script>
                <script>
                    $('#expense_edit').on('shown.bs.modal', function () {

                        $('#category_update').select2({
                            dropdownParent: $('#expense_edit'),
                            placeholder: 'Select Category(c)',
                            width: '100%',
                            allowClear: true
                        });
                    }); 
                </script>
<script>  
                    $('#expense_edit').on('shown.bs.modal', function () {

                        $('#payment_update').select2({
                            dropdownParent: $('#expense_edit'),
                            placeholder: 'Select Payment Method(p)',
                            width: '100%',
                            allowClear: true
                        });
                    });
                </script>
</body>

</html>