{% extends "corptools/character/char_base.html" %}
{% load i18n %}
{% block ct_block %}
    {% load colors %}
    {% load l10n %}
    {% load humanize %}

    <div class="col-md-12">
        <div class="row">
            <div class="col-md-6">
                <div class="panel panel-primary">
                    <div class="panel-heading text-center">{% translate "Sell Order Total" %}</div>
                    <div class="panel-body">
                        <h3 class="text-center">$ {{ total_sell|intcomma }}</h3>
                    </div>
                </div>
            </div>
            <div class="col-md-6">
                <div class="panel panel-primary">
                    <div class="panel-heading text-center">{% translate "Buy Order Total" %}</div>
                    <div class="panel-body">
                        <h3 class="text-center">{{ total_buy|intcomma }}</h3>
                    </div>
                </div>
            </div>
        </div>
        <div class="row panel panel-primary">
            <div class="panel-heading text-center">{% translate "Active Orders" %}</div>
            <div class="panel-body">
                <table id="market" class="table table-responsive" style="width: 100%;">
                    <thead>
                        <th>{% translate "Date" %}</th>
                        <th>{% translate "Item" %}</th>
                        <th>{% translate "Item Price" %}</th>
                        <th>{% translate "Remaining" %}</th>
                        <th>{% translate "Location" %}</th>
                        <th>{% translate "Character Filter" %}</th>
                        <th>{% translate "Buy/Sell" %}</th>
                    </thead>
                    <tbody>
                        {% for m in char_data %}
                            <tr>
                                <td class="">{{ m.issued|date:"Y-m-d h:i" }} ({{ m.duration }} {% translate "day" %})</td>
                                <td class="">{{ m.type_name.name }}</td>
                                <td class="">{{ m.price|intcomma }}</td>
                                <td class="">{{ m.volume_remain }} {% translate "of" %} {{ m.volume_total }}</td>
                                <td class="">{{ m.location_name.location_name }}</td>
                                <td class="">{{ m.character.character.character_name }}</td>
                                <td class="">
                                    {% if m.is_buy_order %}
                                        {% translate "Buy" %}
                                    {% else %}
                                        {% translate "Sell" %}
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
        <div class="row panel panel-primary">
            <div class="panel-heading text-center">{% translate "Completed Orders" %}</div>
            <div class="panel-body">
                <table id="orders" class="table table-responsive" style="width: 100%;">
                    <thead>
                        <th>{% translate "Date" %}</th>
                        <th>{% translate "State" %}</th>
                        <th>{% translate "Item" %}</th>
                        <th>{% translate "Item Price" %}</th>
                        <th>{% translate "Remaining" %}</th>
                        <th>{% translate "Location" %}</th>
                        <th>{% translate "Character Filter" %}</th>
                        <th>{% translate "Buy/Sell" %}</th>
                    </thead>
                    <tbody>
                        {% for m in old_data %}
                            <tr>
                                <td class="">{{ m.issued|date:"Y-m-d h:i" }} ({{ m.duration }} {% translate "day" %})</td>
                                <td class="">{{ m.state }}</td>
                                <td class="">{{ m.type_name.name }}</td>
                                <td class="">{{ m.price|intcomma }}</td>
                                <td class="">{{ m.volume_remain }} {% translate "of" %} {{ m.volume_total }}</td>
                                <td class="">{{ m.location_name.location_name }}</td>
                                <td class="">{{ m.character.character.character_name }}</td>
                                <td class="">
                                    {% if m.is_buy_order %}
                                        {% translate "Buy" %}
                                    {% else %}
                                        {% translate "Sell" %}
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

{% endblock ct_block %}
{% block extra_javascript %}
    {% include "bundles/datatables-js.html" %}
    <script>
        ! function(t) {
            function e(t) {
                var e = {
                    columns: [],
                    columnsIdxList: [],
                    bootstrap: !1,
                    autoSize: !0,
                    label: "Filter "
                };
                if ("bootstrap" in t && "boolean" == typeof t.bootstrap && (e.bootstrap = t.bootstrap), "autoSize" in t && "boolean" == typeof t.autoSize && (e.autoSize = t.autoSize), "label" in t && "string" == typeof t.label && (e.label = t.label), "columns" in t)
                    for (var i = 0; i < t.columns.length; i++) {
                        var n = t.columns[i];
                        if ("idx" in n && "number" == typeof n.idx) {
                            var o = n.idx;
                            e.columns[o] = {
                                title: null,
                                maxWidth: null,
                                autoSize: !0
                            }, e.columnsIdxList.push(o), "title" in n && "string" == typeof n.title && (e.columns[o].title = n.title), "maxWidth" in n && "string" == typeof n.maxWidth && (e.columns[o].maxWidth = n.maxWidth), "autoSize" in n && "boolean" == typeof n.autoSize && (e.columns[o].autoSize = n.autoSize)
                        }
                    }
                return e
            }
            t(document).on("preInit.dt", function(i, n) {
                if ("dt" === i.namespace) {
                    var o = new t.fn.dataTable.Api(n),
                        a = o.table().node().id,
                        l = o.init();
                    if ("filterDropDown" in l) {
                        var r = e(l.filterDropDown);
                        if (0 != r.columns.length) {
                            var u = o.table().container(),
                                s = a + "_filterWrapper",
                                c = s + " " + (r.bootstrap ? "form-inline" : "");
                            t(u).prepend('<div id="' + s + '" class="' + c + '">' + r.label + "</div>"), o.columns(r.columnsIdxList).every(function() {
                                var e = this.index(),
                                    i = null !== r.columns[e].title ? r.columns[e].title : t(this.header()).html();
                                "" == i && (i = "column " + (e + 1));
                                var n = "form-control " + a + "_filterSelect",
                                    o = a + "_filterSelect" + e;
                                t("#" + s).append('<select id="' + o + '" class="' + n + '"></select>');
                                var l = t("#" + o).empty().append('<option value="">(' + i + ")</option>");
                            })
                        }
                    }
                }
            }), t(document).on("init.dt", function(i, n) {
                if ("dt" === i.namespace) {
                    var o = new t.fn.dataTable.Api(n),
                        a = o.table().node().id,
                        l = o.init();
                    if ("filterDropDown" in l) {
                        var r = e(l.filterDropDown);
                        o.table().container();
                        o.columns(r.columnsIdxList).every(function() {
                            var e = this,
                                i = e.index(),
                                n = t("#" + (a + "_filterSelect" + i));
                            n.on("change", function() {
                                var i = t.fn.dataTable.util.escapeRegex(t(this).val());
                                e.search(i ? "^" + i + "$" : "", !0, !1).draw()
                            }), e.data().unique().sort().each(function(t, e) {
                                "" != t && n.append('<option value="' + t + '">' + t + "</option>")
                            })
                        })
                    }
                }
            })
        }(jQuery);
    </script>
{% endblock extra_javascript %}
{% block ct_extra_script %}

    $(document).ready(function() {

    $('#market').DataTable({
    "filterDropDown": {
    columns: [{
    idx: 5
    },
    {
    idx: 6
    }]
    },
    "columnDefs": [
    { "visible": false, "targets": [5,6] }
    ],
    "order": [
    [0, "desc"]
    ],
    "pageLength": 50
    });
    $('#orders').DataTable({
    "filterDropDown": {
    columns: [{
    idx: 1
    },{
    idx: 6
    },{
    idx: 7
    }]
    },
    "columnDefs": [
    { "visible": false, "targets": [6,7] }
    ],
    "order": [
    [0, "desc"]
    ],
    "pageLength": 50
    });
    });

{% endblock ct_extra_script %}
