@extends('admin.layouts.app')

@section('content')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

<style>
    /* Custom CSS for table borders */
    .table-bordered {
        border: 1px solid #dee2e6;
    }

    .table-bordered th,
    .table-bordered td {
        border: 1px solid #dee2e6;
    }
</style>

<div class="container mt-5">
    <div class="row">
        <div class="col-md-12">
            <div class="table-wrapper table-responsive">
            <button id="exportButton">Export to Excel</button>
                <table id="dataTable" class="table table-bordered">
                    <thead>
                        <tr>
                            <th>Login</th>
                            <th>EMail</th>
                            <th>Name</th>
                            <th>Group</th>
                            <th>Currency</th>
                            <th>CurrencyDigits</th>
                            <th>Company</th>
                            <th>Balance</th>
                            <th>Credit</th>
                            <th>InterestRate</th>
                            <th>CommissionDaily</th>
                            <th>CommissionMonthly</th>
                            <th>AgentDaily</th>
                            <th>AgentMonthly</th>
                            <th>BalancePrevDay</th>
                            <th>BalancePrevMonth</th>
                            <th>EquityPrevDay</th>
                            <th>EquityPrevMonth</th>
                            <th>Margin</th>
                            <th>MarginFree</th>
                            <th>MarginLevel</th>
                            <th>MarginLeverage</th>
                            <th>Profit</th>
                            <th>ProfitStorage</th>
                            <th>ProfitEquity</th>
                            <th>ProfitAssets</th>
                            <th>ProfitLiabilities</th>
                            <th>DailyProfit</th>
                            <th>DailyBalance</th>
                            <th>DailyCredit</th>
                            <th>DailyCharge</th>
                            <th>DailyCorrection</th>
                            <th>DailyBonus</th>
                            <th>DailyStorage</th>
                            <th>DailyCommInstant</th>
                            <th>DailyCommFee</th>
                            <th>DailyCommRound</th>
                            <th>DailyAgent</th>
                            <th>DailyInterest</th>
                            <th>DailyDividend</th>
                            <th>DailyTaxes</th>
                            <th>DailySOCompensation</th>
                            <th>DailySOCompensationCredit</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($responses as $response)
                            @foreach ($response as $item)
                            <tr>
                                    <td class="min-width">{{ $item['Login'] }}</td>
                                    <td class="min-width">{{ $item['EMail'] }}</td>
                                    <td class="min-width">{{ $item['Name'] }}</td>
                                    <td class="min-width">{{ $item['Group'] }}</td>
                                    <td class="min-width">{{ $item['Currency'] }}</td>
                                    <td class="min-width">{{ $item['CurrencyDigits'] }}</td>
                                    <td class="min-width">{{ $item['Company'] }}</td>
                                    <td class="min-width">{{ $item['Balance'] }}</td>
                                    <td class="min-width">{{ $item['Credit'] }}</td>
                                    <td class="min-width">{{ $item['InterestRate'] }}</td>
                                    <td class="min-width">{{ $item['CommissionDaily'] }}</td>
                                    <td class="min-width">{{ $item['CommissionMonthly'] }}</td>
                                    <td class="min-width">{{ $item['AgentDaily'] }}</td>
                                    <td class="min-width">{{ $item['AgentMonthly'] }}</td>
                                    <td class="min-width">{{ $item['BalancePrevDay'] }}</td>
                                    <td class="min-width">{{ $item['BalancePrevMonth'] }}</td>
                                    <td class="min-width">{{ $item['EquityPrevDay'] }}</td>
                                    <td class="min-width">{{ $item['EquityPrevMonth'] }}</td>
                                    <td class="min-width">{{ $item['Margin'] }}</td>
                                    <td class="min-width">{{ $item['MarginFree'] }}</td>
                                    <td class="min-width">{{ $item['MarginLevel'] }}</td>
                                    <td class="min-width">{{ $item['MarginLeverage'] }}</td>
                                    <td class="min-width">{{ $item['Profit'] }}</td>
                                    <td class="min-width">{{ $item['ProfitStorage'] }}</td>
                                    <td class="min-width">{{ $item['ProfitEquity'] }}</td>
                                    <td class="min-width">{{ $item['ProfitAssets'] }}</td>
                                    <td class="min-width">{{ $item['ProfitLiabilities'] }}</td>
                                    <td class="min-width">{{ $item['DailyProfit'] }}</td>
                                    <td class="min-width">{{ $item['DailyBalance'] }}</td>
                                    <td class="min-width">{{ $item['DailyCredit'] }}</td>
                                    <td class="min-width">{{ $item['DailyCharge'] }}</td>
                                    <td class="min-width">{{ $item['DailyCorrection'] }}</td>
                                    <td class="min-width">{{ $item['DailyBonus'] }}</td>
                                    <td class="min-width">{{ $item['DailyStorage'] }}</td>
                                    <td class="min-width">{{ $item['DailyCommInstant'] }}</td>
                                    <td class="min-width">{{ $item['DailyCommFee'] }}</td>
                                    <td class="min-width">{{ $item['DailyCommRound'] }}</td>
                                    <td class="min-width">{{ $item['DailyAgent'] }}</td>
                                    <td class="min-width">{{ $item['DailyInterest'] }}</td>
                                    <td class="min-width">{{ $item['DailyDividend'] }}</td>
                                    <td class="min-width">{{ $item['DailyTaxes'] }}</td>
                                    <td class="min-width">{{ $item['DailySOCompensation'] }}</td>
                                    <td class="min-width">{{ $item['DailySOCompensationCredit'] }}</td>
                            </tr>
                            @endforeach
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<!-- use version 0.20.1 -->
<!-- Add this line to include FileSaver.js -->
<script src="https://cdn.jsdelivr.net/npm/file-saver"></script>
<script lang="javascript" src="https://cdn.sheetjs.com/xlsx-0.20.1/package/dist/xlsx.full.min.js"></script>

<script>
    // JavaScript
// JavaScript
document.getElementById("exportButton").addEventListener("click", function(){
    // Get the HTML table element
    var table = document.getElementById("dataTable");
    
    // Convert the table to a worksheet
    var ws = XLSX.utils.table_to_sheet(table);
    
    // Apply styles to the worksheet
    ws["!cols"] = []; // Define an array to hold column properties
    for (var i = 0; i < table.rows[0].cells.length; i++) {
        ws["!cols"].push({ width: 15 }); // Set width of each column
    }
    // Apply bold font to the first row (heading row)
    ws["!rows"] = [{hpt: 20}]; // Row height
    ws["A1"].s = { font: { bold: true } }; // Apply bold font to cell A1 (first cell in first row)
    
    // Convert the worksheet to a workbook
    var wb = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(wb, ws, "Sheet1"); // Add worksheet to workbook
    
    // Convert the workbook to a binary Excel file
    var wbout = XLSX.write(wb, {bookType:'xlsx', type:'binary'});
    
    // Save the Excel file
    saveAs(new Blob([s2ab(wbout)],{type:"application/octet-stream"}), 'table_data.xlsx');
});

// Function to convert data to array buffer
function s2ab(s) {
    var buf = new ArrayBuffer(s.length);
    var view = new Uint8Array(buf);
    for (var i=0; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
    return buf;
}

</script>

@endsection