如何让layui table的行显示动态日期,行列转置显示

如何让table的行显示未动态日期？默认为当月。

mysql table：
id datetime name score
1 5月1日张三 43
2 5月1日李四 87
3 5月1日王五 90
4 5月1日 JD 23
5 5月1日 JC 54
6 5月1日小明 32
7 5月1日小青 12
8 5月1日才子 23
9 5月1日彤彤 67
10 5月1日悠悠 82
11 5月2日张三 43
12 5月2日李四 87
13 5月2日王五 90
14 5月2日 JD 23
15 5月2日 JC 54
16 5月2日小明 32
17 5月2日小青 12
18 5月2日才子 23
19 5月2日彤彤 67

pdo链接数据库：

<?php
try {
  $pdo = new PDO('mysql:host=127.0.0.1;dbname=mydb;port=3306', 'root', 'root');
} catch (PDOException $e) {
  die('connet error :' . $e->getMessage());
};
$pdo->exec('set names utf8');

前端表格和PHP后台数据score_data.php该如何写？

<script>
layui.use('table', function(){
  var table = layui.table;
  var $ = layui.jquery;
    var tableFilter = layui.tableFilter;
  
  var tableIns = table.render({
    elem: '#test'
    ,url: './score_data.php' //数据接口，json格式
    ,toolbar:'#toolbarDemo'
    ,defaultToolbar: ['filter', 'print']
    ,loading:true
    ,height:'full-20'
    ,skin:''
    ,size:''
    ,page: true //开启分页
    ,cols: [[ //表头
      {field: 'id', title: 'ID', width:'5%', sort: true, fixed: 'left'}
      ,{field: 'name', title: '姓名', width:'8%'}
      ,{field: 'datetime', title: '日期', width:'10%'}
      ,{field: 'score', title: '分数', width:'10%'}
         ]]
    ,where:{
        }
        , page: true
        , limits: [50,100,150,200,250,300,350,400,450,500]
        , limit: 50 //每页默认显示的数量
  });

PHP后台数据score_data.php按月返回数据。
关于前端表格，参考下面的代码。

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <link rel="stylesheet" href="js/layui-v2.8.1/layui/css/layui.css">
        <script src="js/layui-v2.8.1/layui/layui.js"></script>
    </head>
    <body>
        <div id="test"></div>

        <script>
            layui.use('table', function() {
                var table = layui.table;
                var $ = layui.jquery;
                var tableFilter = layui.tableFilter;

                // 原始的表格数据
                let tableData = [];
                let str = `1 5月1日 张三 43
                    2 5月1日 李四 87
                    3 5月1日 王五 90
                    4 5月1日 JD 23
                    5 5月1日 JC 54
                    6 5月1日 小明 32
                    7 5月1日 小青 12
                    8 5月1日 才子 23
                    9 5月1日 彤彤 67
                    10 5月1日 悠悠 82
                    11 5月2日 张三 43
                    12 5月2日 李四 87
                    13 5月2日 王五 90
                    14 5月2日 JD 23
                    15 5月2日 JC 54
                    16 5月2日 小明 32
                    17 5月2日 小青 12
                    18 5月2日 才子 23
                    19 5月2日 彤彤 67`;

                let strArr = str.split('\n');
                strArr.forEach(item => {
                    item = item.trim();
                    let itemArr = item.split(' ');
                    tableData.push({
                        "id": itemArr[0],
                        "datetime": itemArr[1],
                        "name": itemArr[2],
                        "score": itemArr[3]
                    });
                });

                // 所有日期
                let tableDataDate = new Set();
                // 所有姓名
                let tableDataName = new Set();
                for (let data of tableData) {
                    tableDataDate.add(data.datetime);
                    tableDataName.add(data.name);
                }

                // 处理过的表格数据
                let newTableData = [];
                let temp;
                for (let name of tableDataName) {
                    temp = {
                        name: name
                    };
                    for (let dt of tableDataDate) {
                        let tableDataItem = tableData.find(function(currentValue, index, arr) {
                            return currentValue['name'] == name && currentValue['datetime'] == dt;
                        });
                        if (tableDataItem) {
                            temp[dt] = tableDataItem['score'];
                        } else {
                            temp[dt] = '';
                        }
                    }
                    newTableData.push(temp);
                }

                let tableCols = [];
                tableCols.push({
                    'field': 'name',
                    'title': '姓名'
                });
                for (let dtItem of tableDataDate) {
                    tableCols.push({
                        'field': dtItem,
                        'title': dtItem
                    });
                }

                var tableIns = table.render({
                    elem: '#test',
                    // url: './score_data.php', //数据接口，json格式
                    data: newTableData,
                    loading: true,
                    height: 'full-20',
                    skin: '',
                    size: '',
                    page: true, //开启分页
                    cols: [
                        tableCols
                    ],
                    page: true,
                    limits: [50, 100, 150, 200, 250, 300, 350, 400, 450, 500],
                    limit: 50 //每页默认显示的数量
                });

            });
        </script>
    </body>
</html>