PHP's realization are grouped by date, pagination

First, the effect of FIG.

Second, the original data

array(6) {
  [0]=>
  array(8) {
    ["id"]=>
    string(1) "6"
    ["userid"]=>
    string(1) "1"
    ["friend_id"]=>
    string(3) "843"
    ["content"]=>
    string(10) "你好啊
"
    ["date_entered"]=>
    string(19) "2019-08-01 08:42:07"
    ["thumb"]=>
    string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
    ["visittime"]=>
    int(1564620127)
    ["date"]=>
    string(5) "08:42"
  }
  [1]=>
  array(8) {
    ["id"]=>
    string(1) "5"
    ["userid"]=>
    string(1) "1"
    ["friend_id"]=>
    string(3) "843"
    ["content"]=>
    string(6) "哈哈"
    ["date_entered"]=>
    string(19) "2019-08-01 08:41:58"
    ["thumb"]=>
    string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
    ["visittime"]=>
    int(1564620118)
    ["date"]=>
    string(5) "08:41"
  }
  [2]=>
  array(8) {
    ["id"]=>
    string(1) "4"
    ["userid"]=>
    string(1) "1"
    ["friend_id"]=>
    string(3) "843"
    ["content"]=>"date_entered"] =>
    [. 11) "Well, August 1"
    String (
    string(19) "2019-08-01 08:41:47"
    ["thumb"]=>
    string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
    ["visittime"]=>
    int(1564620107)
    ["date"]=>
    string(5) "08:41"
  }
  [3]=>
  array(8) {
    ["id"]=>
    string(1) "3"
    ["userid"]=>
    string(1) "1"
    ["friend_id"]=>
    string(3) "843"
    ["content"]=>
    string(3) "456"
    ["date_entered"]=>
    string(19) "2019-07-31 15:51:17"
    ["thumb"]=>
    string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
    ["visittime"]=>
    int(1564559477)
    ["date"]=>
    string(5) "15:51"
  }
  [4]=>
  array(8) {
    ["id"]=>
    string(1) "2"
    ["userid"]=>
    string(1) "1"
    ["friend_id"]=>
    string(3) "843"
    ["content"]=>
    string(3) "123"
    ["date_entered"]=>
    string(19) "2019-07-31 15:50:23"
    ["thumb"]=>
    string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
    ["visittime"]=>
    int(1564559423)
    ["date"]=>
    string(5) "15:50"
  }
  [5]=>
  array(8) {
    ["id"]=>
    string(1) "1"
    ["userid"]=>
    string(1) "1"
    ["friend_id"]=>
    string(3) "843"
    ["content"]=>
    string(9) "开始啦"
    ["date_entered"]=>
    string(19) "2019-07-31 15:47:24"
    ["thumb"]=>
    string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
    ["visittime"]=>
    int(1564559244)
    ["date"]=>
    string(5) "15:47"
  }
}

Three, PHP handler

function groupVisit($visit)
{
    $curyear = date('Y');
    $visit_list = [];
    foreach ($visit as $v) {
        if ($curyear == date('Y', $v['visittime'])) {
            $date = date('m月d日', $v['visittime']);
        } else {
            $date = date('Y年m月d日', $v['visittime']);
        }
        $visit_list[$date][] = $v;
    }
    return $visit_list;
}

After processing the data:

array(2) {
  ["08月01日"]=>
  array(3) {
    [0]=>
    array(8) {
      ["id"]=>
      string(1) "6"
      ["userid"]=>
      string(1) "1"
      ["friend_id"]=>
      string(3) "843"
      ["content"]=>
      string(10) "你好啊
"
      ["date_entered"]=>
      string(19) "2019-08-01 08:42:07"
      ["thumb"]=>
      string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
      ["visittime"]=>
      int(1564620127)
      ["date"]=>
      string(5) "08:42"
    }
    [1]=>
    array(8) {
      ["id"]=>
      string(1) "5"
      ["userid"]=>
      string(1) "1"
      ["friend_id"]=>
      string(3) "843"
      ["content"]=>
      
      [(. 6) "ha"String"date_entered"]=>
      string(19) "2019-08-01 08:41:58"
      ["thumb"]=>
      string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
      ["visittime"]=>
      int(1564620118)
      ["date"]=>
      string(5) "08:41"
    }
    [2]=>
    array(8) {
      ["id"]=>
      string(1) "4"
      ["userid"]=>
      string(1) "1"
      ["friend_id"]=>
      string(3) "843"
      ["content"]=>
      string(11) "8月1好啦"
      ["date_entered"]=>
      string(19) "2019-08-01 08:41:47"
      ["thumb"]=>
      string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
      ["visittime"]=>
      int(1564620107)
      ["date"]=>
      string(5) "08:41"
    }
  }
  ["07月31日"]=>
  array(3) {
    [0]=>
    array(8) {
      ["id"]=>
      string(1) "3"
      ["userid"]=>
      string(1) "1"
      ["friend_id"]=>
      string(3) "843"
      ["content"]=>
      string(3) "456"
      ["date_entered"]=>
      string(19) "2019-07-31 15:51:17"
      ["thumb"]=>
      string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
      ["visittime"]=>
      int(1564559477)
      ["date"]=>
      string(5) "15:51"
    }
    [1]=>
    array(8) {
      ["id"]=>
      string(1) "2"
      ["userid"]=>
      string(1) "1"
      ["friend_id"]=>
      string(3) "843"
      ["content"]=>
      string(3) "123"
      ["date_entered"]=>
      string(19) "2019-07-31 15:50:23"
      ["thumb"]=>
      string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
      ["visittime"]=>
      int(1564559423)
      ["date"]=>
      string(5) "15:50"
    }
    [2]=>
    array(8) {
      ["id"]=>
      string(1) "1"
      ["userid"]=>
      string(1) "1"
      ["friend_id"]=>
      string(3) "843"
      ["content"]=>
      
      [(9) "start it"String"date_entered"]=>
      string(19) "2019-07-31 15:47:24"
      ["thumb"]=>
      string(116) "http://wx.qlogo.cn/mmopen/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw/0"
      ["visittime"]=>
      int(1564559244)
      ["date"]=>
      string(5) "15:47"
    }
  }
}
{"08\u670801\u65e5":[{"id":"6","userid":"1","friend_id":"843","content":"\u4f60\u597d\u554a\n","date_entered":"2019-08-01 08:42:07","thumb":"http:\/\/wx.qlogo.cn\/mmopen\/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw\/0","visittime":1564620127,"date":"08:42"},{"id":"5","userid":"1","friend_id":"843","content":"\u54c8\u54c8","date_entered":"2019-08-01 08:41:58","thumb":"http:\/\/wx.qlogo.cn\/mmopen\/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw\/0","visittime":1564620118,"date":"08:41"},{"id":"4","userid":"1","friend_id":"843","content":"8\u67081\u597d\u5566","date_entered":"2019-08-01 08:41:47","thumb":"http:\/\/wx.qlogo.cn\/mmopen\/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw\/0","visittime":1564620107,"date":"08:41"}],"07\u670831\u65e5":[{"id":"3","userid":"1","friend_id":"843","content":"456","date_entered":"2019-07-31 15:51:17","thumb":"http:\/\/wx.qlogo.cn\/mmopen\/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw\/0","visittime":1564559477,"date":"15:51"},{"id":"2","userid":"1","friend_id":"843","content":"123","date_entered":"2019-07-31 15:50:23","thumb":"http:\/\/wx.qlogo.cn\/mmopen\/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw\/0","visittime":1564559423,"date":"15:50"},{"id":"1","userid":"1","friend_id":"843","content":"\u5f00\u59cb\u5566","date_entered":"2019-07-31 15:47:24","thumb":"http:\/\/wx.qlogo.cn\/mmopen\/PiajxSqBRaEJKa1QdSvmwdHzRA6Kw4O72ItIxNJTbvwP6eUcIxIFjr6pmnMYOPzAZLxXB4xFfn63s1iaAYV8Zfbw\/0","visittime":1564559244,"date":"15:47"}]}

Fourth, the front end part of the code

Result = var ""; 
                    for (var I = 0; I < DATE .length; I ++) { 
                        // determines whether there in an array, the presence of the additional list, additionally displaying the date does not exist 
                        if (contains (arr2, date [ I]) == to false) { 
                            Result + = `<Li class =" header-AUI-List " style =" background: #fff; Line-height: the inherit; border-bottom: Solid # f5f5f5 1px; padding: .5rem .5rem .75rem 0; font-size: .7rem; " > 
                                ` DATE + [I] + ` 
                            </ Li > `; 
                            arr2.push (DATE [I]); 
                        }
                        for (var j = 0; j < data[date[i]].length; j++) {
                            result += `<li class="aui-list-item">
                                <div class="aui-media-list-item-inner">
                                    <div class="aui-list-item-media" style="width: 3rem;text-align: center;">
                                        <img class="icon-item" src="` + data[date[i]][j].thumb + `" alt="">
                                    </div>
                                    <div class="aui-list-item-inner" style="align-items: center;">
                                        <div class="aui-list-item-text" style="height: 100%;">
                                            <div class="aui-list-item-title" style="font-size: .7rem !important;">新增记录：<span style="color: #f00;">` + data[date[i]][j].content + `</span></div>
                                            <div class="aui-list-item-right user-come" style="font-size: .6rem !important;">` + data[date[i]][j].date + `</div>
                                        </div>
                                    </div>
                                </div>
                            </li>`;
                        }
                    }