{% extends 'ibs/layouts/base.html' %}

{% block title %}IBS - 입출금 내역 조회{% endblock %}

{% block content %}
    {% load static humanize widget_tweaks %}

    <!-- Start Content-->
    <div class="container-fluid">

        <!-- start page title -->
        {% include 'ibs/partials/content_title.html' with  second_bs="본사 자금 관리" title="입출금 내역 조회" %}
        <!-- end page title -->

        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-body">

                        {% with menu_order='2' %}
                            {% include 'cash/partials/head_menu_cash.html' %}
                        {% endwith %}

                        <div class="row col-12">
                            <form action="." method="GET" class="col-12">
                                <div class="form-row">
                                    <div class="form-group col-md-2">
                                        <label for="{{ form.s_date.id_for_label }}" class="col-form-label">거래 기간</label>
                                        {{ form.s_date|add_class:"form-control"|attr:"placeholder:시작일"|attr:"data-provide=datepicker data-date-format=yyyy-mm-dd data-date-autoclose=true data-toggle=input-mask data-mask-format=0000-00-00" }}
                                    </div>
                                    <div class="form-group col-md-2">
                                        <label for="{{ form.e_date.id_for_label }}"
                                               class="d-none d-md-block col-form-label">&nbsp;</label>
                                        {{ form.e_date|add_class:"form-control"|attr:"placeholder:종료일"|attr:"data-provide=datepicker data-date-format=yyyy-mm-dd data-date-autoclose=true data-toggle=input-mask data-mask-format=0000-00-00" }}
                                    </div>
                                    <div class="form-group col-md-1">
                                        <label for="{{ form.sort.id_for_label }}" class="col-form-label">거래
                                            구분</label>
                                        {{ form.sort|add_class:"form-control" }}
                                    </div>
                                    <div class="form-group col-md-2">
                                        <label for="{{ form.account_d1.id_for_label }}"
                                               class="d-none d-md-block col-form-label">&nbsp;</label>
                                        {{ form.account_d1|add_class:"form-control" }}
                                    </div>
                                    <div class="form-group col-md-2">
                                        <label for="{{ form.bank_account.id_for_label }}" class="col-form-label">계좌
                                            구분</label>
                                        {{ form.bank_account|add_class:"form-control" }}
                                    </div>
                                    <div class="form-group col-md-2">
                                        <label for="{{ form.search_word.id_for_label }}"
                                               class="d-none d-md-block col-form-label">&nbsp;</label>
                                        {{ form.search_word|add_class:"form-control"|attr:"placeholder:검색어 - 세부계정, 적요, 거래처" }}
                                    </div>

                                    <div class="form-group col-md-1 pt-1">
                                        <div class="mb-2">&nbsp;</div>
                                        <input type="submit" class="btn btn-info btn-sm btn-block" value="검색">
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="row">
                            <div class="col-12 table-responsive-md">
                                <div class="text-right mb-1 mr-2">
                                    <a href="{% url 'excel:cashbook' %}?s_date={{ request.GET.s_date }}&e_date={{ request.GET.e_date }}&sort={{ request.GET.sort }}&account_d1={{ request.GET.account_d1 }}&bank_account={{ request.GET.bank_account }}&search_word={{ request.GET.search_word }}">
                                        <i class="mdi mdi-file-excel-box"></i> Excel Export
                                        <i class="mdi mdi-download ml-1"></i>
                                    </a>
                                </div>
                                <table id="scroll-horizontal-datatable"
                                       class="table table-hover table-centered table-condensed table-sm w-100 m-0 nowrap"
                                       style="word-break: keep-all;">
                                    <thead>
                                    <tr class="bg-nav-pills">
                                        <th class="text-center" scope="col"><input type="checkbox" disabled></th>
                                        <th class="text-center" scope="col">거래 일자</th>
                                        <th class="text-center" scope="col">구분</th>
                                        <th class="text-center" scope="col">계정</th>
                                        <th class="text-center" scope="col">세부 계정 <a href="#" data-toggle="modal"
                                                                                     data-target="#account-subject-modal"><i
                                                class="dripicons-gear"></i></a>
                                        </th>
                                        {% include 'cash/partials/account_subject.html' %}
                                        <th class="text-center" scope="col">적 요</th>
                                        <th class="text-center" scope="col">거 래 처</th>
                                        <th class="text-center" scope="col">거래 계좌</th>
                                        <th class="text-center" scope="col">입금 금액</th>
                                        <th class="text-center" scope="col">출금 금액</th>
                                        <th class="text-center" scope="col">증빙 자료</th>
                                        <th class="text-center" scope="col">
                                            <a href="javascript: void(0);" class="action-icon"><i
                                                    class="mdi mdi-pencil"></i></a>
                                            <a href="javascript: void(0);" class="action-icon"><i
                                                    class="mdi mdi-delete"></i></a>
                                        </th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    {% for inout in object_list %}
                                        <tr>
                                            <th class="text-center" scope="row"><input type="checkbox" disabled></th>
                                            <td class="text-center">{{ inout.deal_date|date:"Y-m-d" }}</td>
                                            <td class="text-center text-primary">
                                                <span class="text-{% if inout.sort.pk == 2 %}danger{% elif inout.sort.pk == 3 %}info{% endif %}">
                                                    {{ inout.sort.name }}
                                                </span>
                                            </td>
                                            <td class="text-center text-primary">
                                                <span class="text-{% if inout.account_d1.pk == 2 %}info{% elif inout.account_d1.pk == 5 %}danger{% elif inout.sort.pk == 3 %}info{% endif %}">
                                                    {{ inout.account_d1.name }}
                                                </span>
                                            </td>
                                            <td class="text-secondary">{{ inout.account_d3.name|default:"-" }}</td>
                                            <td>{{ inout.content|truncatechars:12|default:"-" }}</td>
                                            <td>{{ inout.trader|truncatechars:8|default:"-" }}</td>
                                            <td>{{ inout.bank_account }}</td>
                                            <td class="text-right bg-success-lighten">{{ inout.income|floatformat:"0"|intcomma|default:"-" }}</td>
                                            <td class="text-right bg-info-lighten">{{ inout.outlay|floatformat:"0"|intcomma|default:"-" }}</td>
                                            <td class="text-center">{{ inout.get_evidence_display }}</td>
                                            <td class="text-center">
                                                {# <a href="javascript:auth_chk({% if request.user.staffauth.company_cash == '2' and inout.deal_date >= auth_date or request.user.is_superuser %}1{% else %}0{% endif %}, '{% url 'ibs:cash-inout:update' inout.pk %}', '')"#}
                                                <a href="javascript:alert('준비중입니다!')"
                                                   class="action-icon"><i class="mdi mdi-pencil"></i></a>
                                                <a href="javascript:auth_chk({% if request.user.staffauth.company_cash == '2' and inout.deal_date >= auth_date or request.user.is_superuser %}1{% else %}0{% endif %}, '{% url 'ibs:cash-inout:delete' inout.pk %}', 'del')"
                                                   class="action-icon"><i class="mdi mdi-delete"></i></a>
                                            </td>
                                        </tr>
                                    {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        {% if is_paginated %}

                            {# to_first_last :: 맨처음 / 맨끝으로 버튼 사용 여부 #}
                            {# page_class ex:: pagination-rounded pagination-sm pagination-lg justify-content-center justify-content-end #}
                            {% include 'partials/pagination.html' with to_first_last="ok" page_class="pagination-rounded justify-content-end" %}

                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
    </div> <!-- container -->

{% endblock %}

{% block third_party_js %}

    <script>
      const sort = document.getElementById('id_sort')
      const account_d1 = document.getElementById('id_account_d1')

      window.onload = function () {
        sort.setAttribute('onchange', 'sort_change(this)')
        account_d1.setAttribute('onchange', 'account_d1_change(this)')

        document.getElementById('id_s_date').value = '{{ request.GET.s_date }}'
        document.getElementById('id_e_date').value = '{{ request.GET.e_date }}'
        document.getElementById('id_sort').value = '{{ request.GET.sort }}'
        document.getElementById('id_account_d1').value = '{{ request.GET.account_d1 }}'
        document.getElementById('id_bank_account').value = '{{ request.GET.bank_account }}'
        const search_word = document.getElementById('id_search_word')
        search_word.value = '{{ request.GET.search_word }}'
        search_word.setAttribute('onclick', 'this.value=\'\'')
      }

      function sort_change(sort) {
        if (sort.value === '') {
          account_d1.options[0].selected = true
          account_d1.length = 7;
          account_d1.options[1].text = "자산"
          account_d1.options[1].value = "1"
          account_d1.options[2].text = "부채"
          account_d1.options[2].value = "2"
          account_d1.options[3].text = "자본"
          account_d1.options[3].value = "3"
          account_d1.options[4].text = "수익"
          account_d1.options[4].value = "4"
          account_d1.options[5].text = "비용"
          account_d1.options[5].value = "5"
          account_d1.options[6].text = "대체"
          account_d1.options[6].value = "6"
        } else if (sort.value === '1') {
          account_d1.length = 5;
          account_d1.options[1].text = "자산"
          account_d1.options[1].value = "1"
          account_d1.options[2].text = "부채"
          account_d1.options[2].value = "2"
          account_d1.options[3].text = "자본"
          account_d1.options[3].value = "3"
          account_d1.options[4].text = "수익"
          account_d1.options[4].value = "4"
        } else if (sort.value === '2') {
          account_d1.length = 5;
          account_d1.options[1].text = "자산"
          account_d1.options[1].value = "1"
          account_d1.options[2].text = "부채"
          account_d1.options[2].value = "2"
          account_d1.options[3].text = "자본"
          account_d1.options[3].value = "3"
          account_d1.options[4].text = "비용"
          account_d1.options[4].value = "5"
        } else if (sort.value === '3') {
          account_d1.length = 2;
          account_d1.options[1].text = "대체"
          account_d1.options[1].value = "6"
        }
      }

      function account_d1_change(account_d1) {
        if (account_d1.value === '4') {
          sort.options[1].selected = true
        } else if (account_d1.value === '5') {
          sort.options[2].selected = true
        } else if (account_d1.value === '6') {
          sort.options[3].selected = true
        }
      }

      function auth_chk(auth, url, del) {
        if (auth) {
          if (del) {
            if (confirm('삭제 후 복구할 수 없습니다.\n\n해당 거래 건을 삭제하시겠습니까?')) {
              location.href = url
            }
          } else {
            if (confirm('해당 거래 건을 수정하시겠습니까?')) {
              location.href = url
            }
          }
        } else {
          alert('권한이 없거나 수정 또는 삭제가능일(10일)이 경과하였습니다.. \n\n수정 또는 삭제하려면 관리자에게 문의하여 주시기 바랍니다.')
        }
        return
      }
    </script>

{% endblock %}