统计报表生成器 - 日报、月报和热门网点排名 - 常规

<html>
<head>
    <title>统计报表生成器</title>
    <style>
        .container {
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            padding: 20px;
        }
<pre><code>    .form-group {
        margin-bottom: 10px;
    }

    .btn {
        padding: 10px 20px;
        background-color: #4CAF50;
        color: white;
        border: none;
        cursor: pointer;
    }

    .table {
        border-collapse: collapse;
        width: 100%;
    }

    .table th, .table td {
        border: 1px solid #ddd;
        padding: 8px;
        text-align: left;
    }

    .table th {
        background-color: #4CAF50;
        color: white;
    }
&lt;/style&gt;
</code></pre>
</head>
<body>
<div class="container">
    <h1>统计报表生成器</h1>
    <div class="form-group">
        <label for="date">选择日期：</label>
        <input type="date" id="date">
    </div>
    <div class="form-group">
        <label for="month">选择月份：</label>
        <input type="month" id="month">
    </div>
    <button class="btn" onclick="generateReport()">生成报表</button>
    <table id="reportTable" class="table">
        <thead>
            <tr>
                <th>日期</th>
                <th>统计数据</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
    <h2>出现最多频次的十个网点：</h2>
    <ul id="topTenList">
    </ul>
</div>
<script>
    function generateReport() {
        var date = document.getElementById('date').value;
        var month = document.getElementById('month').value;

        var reportTable = document.getElementById('reportTable');
        var topTenList = document.getElementById('topTenList');

        // Clear previous data
        reportTable.getElementsByTagName('tbody')[0].innerHTML = '';
        topTenList.innerHTML = '';

        // Generate daily report
        if (date) {
            var dailyReport = getDailyReport(date);
            insertReportData(reportTable, dailyReport);

            var topTenSites = getTopTenSites(dailyReport);
            insertTopTenSites(topTenList, topTenSites);
        }

        // Generate monthly report
        if (month) {
            var monthlyReport = getMonthlyReport(month);
            insertReportData(reportTable, monthlyReport);

            var topTenSites = getTopTenSites(monthlyReport);
            insertTopTenSites(topTenList, topTenSites);
        }
    }

    // Sample functions to generate report data
    function getDailyReport(date) {
        // This function should return the daily report data for the given date
        // Replace with your own logic to fetch the data from server or calculate it
        return {
            'date': date,
            'data': [
                { 'site': 'Site A', 'count': 10 },
                { 'site': 'Site B', 'count': 5 },
                { 'site': 'Site C', 'count': 3 },
                // ...
            ]
        };
    }

    function getMonthlyReport(month) {
        // This function should return the monthly report data for the given month
        // Replace with your own logic to fetch the data from server or calculate it
        return {
            'month': month,
            'data': [
                { 'site': 'Site A', 'count': 100 },
                { 'site': 'Site B', 'count': 50 },
                { 'site': 'Site C', 'count': 30 },
                // ...
            ]
        };
    }

    function getTopTenSites(reportData) {
        // This function should return the top ten sites with highest frequency from the report data
        // Replace with your own logic to calculate the top ten sites
        return [
            { 'site': 'Site A', 'count': 100 },
            { 'site': 'Site B', 'count': 50 },
            { 'site': 'Site C', 'count': 30 },
            // ...
        ];
    }

    function insertReportData(table, reportData) {
        var tbody = table.getElementsByTagName('tbody')[0];
        var row = document.createElement('tr');
        var dateCell = document.createElement('td');
        var dataCell = document.createElement('td');

        dateCell.textContent = reportData.date || reportData.month;
        dataCell.textContent = JSON.stringify(reportData.data);

        row.appendChild(dateCell);
        row.appendChild(dataCell);
        tbody.appendChild(row);
    }

    function insertTopTenSites(list, topTenSites) {
        topTenSites.forEach(function (site) {
            var listItem = document.createElement('li');
            listItem.textContent = site.site + ': ' + site.count;
            list.appendChild(listItem);
        });
    }
</script>
</body>
</html>