
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>语音识别</title>
    <script src="~/layuiadmin/layui/layui.js"></script>
    <link href="~/layuiadmin/layui/css/layui.css" rel="stylesheet" />
    <script src="~/Content/jquery-1.8.3.js"></script>
    <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 == 1){ }}
    <li class="layim-chat-mine"><div class="layim-chat-user"></div><div class="layim-chat-text">{{ layui.layim.content(item.content) }}</div></li>
  {{# } else { }}
    <li><div class="layim-chat-user"></div><div class="layim-chat-text">{{ layui.layim.content(item.content) }}</div></li>
  {{# }
}); }}
</textarea>
    <script>
        function child(result) {
            layui.use(['layim', 'laypage'], function () {
                var layim = layui.layim
                    , layer = layui.layer
                    , laytpl = layui.laytpl
                    , $ = layui.jquery
                    , laypage = layui.laypage;
                var Content = JSON.parse(result);
                var html = laytpl(LAY_tpl.value).render({
                    data: Content.data
                });
                $('#LAY_view').html(html);

                ////实际使用时，下述的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'
                //    }]
                //}
            });
        }
    </script>
</body>
</html>
