Как организовать подгрузку записей сохраняя сортировку по дате?

Question

rikorit746 @rikorit746

JavaScript

Как организовать подгрузку записей сохраняя сортировку по дате?

Здравствуйте! Имеется такой способ загрузки записей

-1 сентября
--Запись
--Запись
--Запись
-2 сентября
--Запись
--Запись

Первоначально загружаются только 10 записей, каким образом можно подгружать еще записи таким образом чтобы дата не дублировалась? Т.е. если 2 сентрября 10 записей, первоначально подгрузилось из них только 5, при нажатие на кнопку оставшиеся 5 записей подгрузись уже в существующий блок с этой датой, а остальные 5 уже загружались в блоки со своей датой?

$.ajax({
    url: '../ajax/money.php',
    type: "GET",
    dataType: "json",
    success: function(json) {
        if (typeof(json.response) == 'object') {
            const _account = json.response.items.reduce((acc, cur, i, a) => {
                const index = acc.findIndex(item => item.date === cur.date)
                if (index !== -1) {
                    acc[index].accounts.push({
                        account: cur.account,
                        time: cur.time,
                        category: cur.category,
                        subcategory: cur.subcategory,
                        comment: cur.comment,
                        types: cur.type,
                        amount: cur.amount,
                        balance: cur.balance
                    })
                } else {
                    cur.accounts = []
                    cur.accounts.push({
                        account: cur.account,
                        time: cur.time,
                        category: cur.category,
                        subcategory: cur.subcategory,
                        comment: cur.comment,
                        types: cur.type,
                        amount: cur.amount,
                        balance: cur.balance
                    })
                    acc.push(cur)
                }
                return acc
            }, [])
            $('div.timeline').html(_account.map(item => {
                let div = `<div class="time-label"><span class="bg-primary">${item.date}</span></div>`
                item.accounts.forEach(_item => {
                    div += `              <div>
                ${_item.types}
                <div class="timeline-item">
                  <span class="float-right" style="padding: 5px 10px 5px 5px;">${_item.amount}</span>
				  <h3 class="timeline-header">${_item.account}</h3>
                  <div class="timeline-body"><small class="float-right">${_item.time}</small><b>${_item.category} / ${_item.subcategory}</b><br>${_item.comment}</div>
                </div>
              </div>`
                })
                return div;
            }).join(''));
        } else {
            toastr.error('Некорректный json-ответ.');
        }
    },
    error: function() {
        toastr.error('Ошибка выполнения запроса.');
    }
});