

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>语音识别</title>
    <link href="../../layuiadmin/layui/css/layui.css" rel="stylesheet" />
    <style>
        body .layim-chat-main {
            height: auto;
        }
    </style>
</head>
<body>

    <div class="layim-chat-main">
        <ul id="LAY_view"></ul>
    </div>

    <div id="LAY_page" style="margin: 0 10px;"></div>


<textarea title="消息模版" id="LAY_tpl" style="display:none;">
{{# layui.each(d.data, function(index, item){
  if(item.id == parent.layui.layim.cache().mine.id){ }}
    <li class="layim-chat-mine"><div class="layim-chat-user"><img src="{{ item.avatar }}"><cite><i>{{ layui.data.date(item.timestamp) }}</i>{{ item.username }}</cite></div><div class="layim-chat-text">{{ layui.layim.content(item.content) }}</div></li>
  {{# } else { }}
    <li><div class="layim-chat-user"><img src="{{ item.avatar }}"><cite>{{ item.username }}<i>{{ layui.data.date(item.timestamp) }}</i></cite></div><div class="layim-chat-text">{{ layui.layim.content(item.content) }}</div></li>
  {{# }
}); }}
</textarea>
    <script src="../../layuiadmin/layui/layui.js"></script>
    <script>
        layui.use(['layim', 'laypage'], function () {
            var layim = layui.layim
                , layer = layui.layer
                , laytpl = layui.laytpl
                , $ = layui.jquery
                , laypage = layui.laypage;

            //开始请求聊天记录
            var param = location.search //获得URL参数。该窗口url会携带会话id和type，他们是你请求聊天记录的重要凭据

                //实际使用时，下述的res一般是通过Ajax获得，而此处仅仅只是演示数据格式
                , res = {
                    code: 0
                    , msg: ''
                    , data: [{
                        username: '人员1'
                        , id: 0
                        , content: '你好，优软科技'
                    }, {
                        username: '人员2'
                        , id: 1
                        , content: '你好'
                    }, {
                        username: '人员1'
                        , id: 0
                        , content: 'dddddddddddddddd'
                    }, {
                        username: '人员2'
                        , id: 1
                        , content: 'aaaaaaaaaaaaaaaaaaaaaa'
                    }]
                }

            //console.log(param)

            var html = laytpl(LAY_tpl.value).render({
                data: res.data
            });
            $('#LAY_view').html(html);

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