{% include 'header.html' %}
<!-- Begin Page Content -->
<div class="container-fluid">

    <!-- Content Row -->

    <!-- /Content Row -->

    <!-- Content Row -->
    <!-- Approach -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">TF-IDF</h6>
        </div>

        <div class="card-body">
            <h2>Proses TF-IDF</h2>
            <p>Silahkan klik tombol di bawah ini untuk melakukan proses TF-IDF dengan
                menggunakan data file sebelumnya yang sudah melalui proses preprocessing.</p>

            <form enctype="multipart/form-data" action="/tfidf" method="POST">
                <div class="mt-3">
                    <button type="submit" name="" value="tfidf" class="btn btn-primary">TF-IDF</button>
                </div>
                <br>
            </form>
        </div>
    </div>

    <!-- Approach -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">Hasil TF-IDF</h6>
        </div>

        <div class="card-body">
            <h6>Hasil TF-IDF pada data training :</h6>
            <table border="1" class="table table-bordered" id="dataTable">
                <thead>
                    <tr>
                        <th>Training Data</th>
                    </tr>
                </thead>
                <tbody>
                    {% for item in X_train %}
                    <tr>
                        <td>{{ item }}</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
            <h6 style="margin-top: 10vh;">Hasil TF-IDF pada data testing :</h6>
            <table border="1" class="table table-bordered" id="dataTableTesting">
                <thead>
                    <tr>
                        <th>Testing Data</th>
                    </tr>
                </thead>
                <tbody>
                    {% for item in X_test %}
                    <tr>
                        <td>{{ item }}</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>

        <!-- Sertakan jQuery dan library DataTables -->
        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
        <script src="https://cdn.datatables.net/1.11.6/js/jquery.dataTables.min.js"></script>

        <!-- Panggil fungsi DataTables pada tabel "dataTableTesting" -->
        <script>
            $(document).ready(function () {
                $('#dataTableTesting').DataTable();
            });
        </script>
    </div>
</div>
{% include 'footer.html' %}