scott
/
crm


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
							{extend name="public/layout" /} {block name="title"}话术评论列表{/block} {block name="body"}
<style>
	html,body {
		background-color: #fff;
	}
    .layui-hs-xq-nametw{font-size: 14px;margin-bottom:10px;}
    .layui-hs-xq-tw{font-size: 16px;}
    .layui-hs-xq-ul-img{overflow: hidden;margin:10px 0;}
    .layui-hs-xq-ul-img li{float:left;width:124px;height: 100px;overflow: hidden;margin-right: 10px;}
    .layui-hs-xq-ul-img li img{max-width:100%;max-height: 100%;margin:auto;display: block;}
    .textlh1{overflow:hidden;white-space:nowrap}
    .layui-hs-xq-da{font-size: 16px;}
    .layui-hs-xq-fgx{height: 15px;width:100%;background-color: #F2F2F2;margin:20px 0;}
    .layui-hs-xq-hd-t{font-size: 20px;}
    .layui-hs-xq-hd-tx{overflow: hidden;}
    .woverflow{overflow: hidden;}
    .width100_{width:100%;}
    .layui-hs-xq-hd-ul li{padding-bottom:10px;border-bottom: 1px solid #E4E4E4;margin-top:30px;}
    .layui-hs-xq-hd-tximg{width:24px;height: 24px;border-radius: 50%;float: left;}
    .layui-hs-xq-hd-txname{font-size: 20px;float:left;margin:0 4px 0;line-height: 24px;}
    .layui-hs-xq-hd-tx-r{display: inline-block;width:18px;}
    .height100_{height: 100%;}
    .layui-hs-xq-hd-ms{font-size: 16px;margin-top:10px;}
    .layui-hs-xq-hd-right{float:right;font-size: 16px;}
    .layui-hs-xq-hd-left{float:left;}
    .wleft{float:left;}
    .wright{float:right;}
    .layui-hs-xq-hd-dz{margin-top:15px;}
    .layui-hs-xq-hd-dz p{font-size: 14px;color:#99AEC2;}
    .mdl20{margin-left:20px;}
    .ds{display:block;}
    .flex-row {
        display: flex;
    }
    .flex-sub {
        flex:1;
    }
    .omit,.omit-1 {margin-left: 5px;cursor: pointer;color: #28A1FF;}
    .textStyle {height: auto;overflow: hidden;}
    .layui-view {
        display: inline-block;
    }
</style>
<body>
	<div class="layui-fluid">
		<div class="layui-card">
			<div class="layui-card-body">
                <p class="layui-hs-xq-nametw">{$data.type_name}</p>
				<p class="layui-hs-xq-tw">问：{$data.title}</p>
                <div class="">
                    <ul class="layui-hs-xq-ul-img">
                        {volist name='data.imgs' id='vo'}
                        <li><img src="{$vo}" alt=""></li>
                        {/volist}
                    </ul>
                </div>
                <div class="flex-row">
                    <p class="layui-hs-xq-da textlh1 flex-sub">答：{$data.content}<i class="layui-icon layui-icon-up omit-1 layui-hide"></i></p>
                    <i class="layui-icon layui-icon-more omit"></i>
                </div>
                <div class="">
                    <ul class="layui-hs-xq-ul-img">
                        {volist name='data.videos' id='vo'}
                        <li><img src="{$vo}" alt=""></li>
                        {/volist}
                    </ul>
                </div>
                <div class="layui-hs-xq-fgx"></div>
                <p class="layui-hs-xq-hd-t">员工回答（<span class="conts"></span>条）</p>
                <div class="">
                    <ul class="layui-hs-xq-hd-ul"></ul>
                    <div class="zxf_pagediv"></div>
                </div>
			</div>
		</div>
	</div>
	{/block} {block name="js"}
	<script>
		var id = {$id};
        var pages = 1;
        var limits = 0;
        var htmlarr=[];
		layui.config({
			base: '__LAYUI__/',
			urlbase: '/sys'
		}).extend({
			index: 'lib/index' //主入口模块
		}).use(['index', 'table', 'form'], function() {
			var $ = layui.$,
				form = layui.form,
				table = layui.table;
            var lihtml = '';

            function forlis(talk){
                for(var i=0;i<talk.length;i++){
                    lihtml+='<li><div class="layui-hs-xq-hd-tx"><div class="layui-hs-xq-hd-left">';
                    lihtml+='<div class="woverflow layui-hs-xq-hd-tximg">';
                    lihtml+='<img class="width100_ height100_ ds" src="'+talk[i].headimgurl+'" alt="">';
                    lihtml+='</div><p class="layui-hs-xq-hd-txname">'+talk[i].nickname+'</p>';
                    if(i==0&&pages==1){
                        lihtml+='<img class="layui-hs-xq-hd-tx-r" src="__STATIC__/img/txicos.png"/>';
                    }
                    lihtml+='</div><div class="layui-hs-xq-hd-right">'+talk[i].addtime+'</div></div>';
                    lihtml+='<p class="layui-hs-xq-hd-ms">'+talk[i].comments+'</p>'
                    lihtml+='<div class="woverflow layui-hs-xq-hd-dz"><p class="wleft">点赞：<span>'+talk[i].praise+'</span></p><p class="wleft mdl20">热度：<span>'+talk[i].use+'</span></p></div></li>'
                }
            }

            main();
            function main() {
                let box = $('.textlh1')[0];
                if (box.scrollWidth > box.offsetWidth) {
                    $('.omit').prop('className','layui-icon layui-icon-more omit layui-show');
                } else {
                    $('.omit').prop('className','layui-icon layui-icon-more omit layui-hide');
                }
            }

            $('.omit').click(() => {
                $('.textlh1').prop('className','layui-hs-xq-da textStyle flex-sub');
                $('.omit').prop('className','layui-icon layui-icon-more omit layui-hide');
                $('.omit-1').prop('className','layui-icon layui-icon-up omit-1 layui-view');
            })
            $('.omit-1').click(() => {
                $('.textStyle').prop('className','layui-hs-xq-da textlh1 flex-sub');
                $('.omit').prop('className','layui-icon layui-icon-more omit layui-show');
                $('.omit-1').prop('className','layui-icon layui-icon-up omit-1 layui-hide');
            })

            function ajaxbox(pages){
                var layerIndex=layer.load(1);
                $.ajax({
                    url: "{:url('talkskill/talkskillcomment')}?id=" + id+'&root_id='+"{$root_id}",
                    type: 'post',
                    data: {
                        page:pages,
                        limit:5
                    },
                    dataType: 'json',
                    success: function(talk) {
                        layer.close(layerIndex);
                        limits=Math.round(talk.count/5);
                        $('.conts').html(talk.count);
                        if (talk.data != '') {
                            var arrbox=talk.data;
                            htmlarr=[];
                            for(var j=0;j<arrbox.length;j++){
                                htmlarr.push(arrbox[j]);
                            }
                            console.log(htmlarr)
                            forlis(htmlarr);
                            $(".layui-hs-xq-hd-ul").html(lihtml);
                        }
                    }
                })
            }
            ajaxbox(pages);
            $(window).scroll(
                function() {
                    var scrollTop = $(this).scrollTop();
                    var scrollHeight = $(document).height();
                    var windowHeight = $(this).height();
                    if (scrollTop + windowHeight == scrollHeight) {
                        if(pages<limits){
                            pages++;
                            ajaxbox(pages);
                        }else{
                            layer.open({
                                content: '已没有数据了'
                            });
                        }
                    }
                }
            );
            
			//监听搜索
			form.on('submit(talkskill-search)', function(data) {
				var field = data.field;

				//执行重载
				table.reload('talkskillComment-table', {
					where: field
					,page: {curr:1}
				});
			});
			
			table.on('tool(talkskillComment-table)', function(obj) {
				var data = obj.data;
				if(obj.event === 'del') {
						$.ajax({
							url: "{:url('talkskill/talkskillCommentDel')}?id=" + data.id,
							type: 'post'
						});
						obj.del();
						layer.close(index);
				}
			});

			//事件
			var active = {}
			$('.layui-btn.layuiadmin-btn-admin').on('click', function() {
				var type = $(this).data('type');
				active[type] ? active[type].call(this) : '';
			});
		});
	</script>
	{/block}