crm/app/sys/view/talkskill/success_cate.html

{extend name="public/layout" /} {block name="title"}分类管理{/block} {block name="body"}
<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/echarts.min.js"></script>
<style type="text/css">
	html,
	body {
		display: block;
		min-width: 1100px;
	}

	.layui-fluid {
		display: block;
		box-shadow: 0 0 4px 0 #B6CADE;
		border-radius: 5px;
		margin: 15px;
		background-color: #ffffff;
		height: auto;
	}

    .layui-form-label{
        width: auto;
    }


    #data_statistics{
    	/*background: red;*/
    	width: 100%;
    	height: 300px;
    	float: left;
    }
    .tab_1{
    	width: 10%;
    }
    #echartbox_a{
    	display: block;
    	width: 40%;
    	height: 300px;
    	/*background: red;*/
    	float: left;
    }

    #data_statistics_b{
    	/*background: blue;*/
    	width: 48%;
    	height: 300px;
    	float: left;
    }
    .all{
    	width: 100%;
    	background: red;

    }

    #echartbox_b{
    	display: block;
    	width: 80%;
    	height: 400px;
    	margin:0 auto;
    }
    #data_statistics_c{
    	width: 80%;
    	margin:0 auto;
    	overflow: hidden;
    }

    #echartbox_c{
    	display: block;
    	width: 80%;
    	height: 400px;
    	margin:0 auto;
    }
    #data_statistics_d{
    	width: 80%;
    	margin:0 auto;
    	overflow: hidden;
    }

    #echartbox_d{
    	display: block;
    	width: 80%;
    	height: 400px;
    	margin:0 auto;
    }
    #data_statistics_e{
    	width: 80%;
    	margin:0 auto;
    	overflow: hidden;
    }

    .layui_fluid1{display: none;}
    .layui-nav-tabs-ul{margin-bottom: 10px;}
    .layui-nav-tab_li{float:left;padding: 0px 20px;text-align: center;cursor: pointer;line-height: 38px;height: 38px;}
    .add-layui-nav-li{color: #fff;white-space: nowrap;text-align: center;font-size: 14px;border-radius: 2px;
}
    .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after{border-bottom: 2px solid #249efb !important;}



	/*//*/
    .layui_fluid1{display: none;}
    
    .layui-nav-tabs-ul{margin-bottom: 10px;padding-bottom:0;border-bottom: 1px solid #e6e6e6;overflow: hidden;}
    .layui-nav-tab_li{float:left;padding: 0px 20px;text-align: center;cursor: pointer;line-height: 38px;height: 38px;position: relative;}
    .add-layui-nav-li{color: #f3f3f3;;white-space: nowrap;text-align: center;font-size: 14px;border-radius: 2px;}
    .layui-bor-b{position: absolute;bottom:0;width:65px;left:50%;transform: translateX(-50%);height: 1px;background: #249efb;}
    .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after{border-bottom: 2px solid #249efb !important;}
    .layui-bor-b{display: none;}
    .add-layui-nav-li .layui-bor-b{display: block !important;}
    .layui-title-b{font-size: 20px;font-weight: bold;}
    .layui-li-box{padding-bottom: 30px;border-bottom: 1px solid #e6e6e6;}
    .woverflow{overflow: hidden;}
    .layui-bolu{color:#249efb}
    .layui-data-ul{width:100%;}
    .layui-data-ul li{float:left;width:33.33%;line-height: 40px;}
    .mdt70{margin-top:30px;}
    .width33_33{width:33.33%;}
    .wleft{float:left;}
    .mdt40{margin-top:40px;}
    .width80_{width:80%;}
    .wauto{margin:0 auto;}
    .layui-data-ul-b{height: 126px;overflow-y: auto;}
    .layui-data-ul-b li{float:left;width:33.33%;line-height: 30px;}
    .layui_box_con{display: none;height: 100%;}
	.layadmin-iframe-if{width:100%;height: 100%;position: absolute;top:56px;left:0;}
	.layui-p-bt{font-weight:bold;}
	.layui_bm{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width:70%;}
	 .layui-data-ul-b li span{display: block;float:left;}



	 /*热词搜索*/
/*	.layui-form-item .layui-inline {
		display: block;
		float: left;
		width: 145px;
		height: 38px;
		line-height: 38px;
		background: #FFFFFF;
		margin-right: 16px;
	}
	
	.layui-form-item .layui-input-inline {
		width: 145px;
		height: 38px;
		line-height: 38px;
		margin-bottom: 0;
	}*/
	
/*	.layui-form-item .layui-input-inline .layui-input {
		border: 1px solid #9DB6CF;
		border-radius: 5px;
	}*/
	
	.layui-form-select dl dd.layui-this {
		background-color: #249EFB;
	}
	
	.layui-form-item div.searchBox {
		width: 320px;
		background: #FFFFFF;
		border: 1px solid #B6CADE;
		/* border-radius: 24px; */
		height: 38px;
		overflow: hidden;
		padding-left: 10px;
		position: relative;
		margin-bottom: 0px;
		/* float: right; */
	}
	
	.searchBox .inputBox {
		width: 240px;
		/* float: left; */
		height: 36px;
		line-height: 36px;
		border-width: 0;
	}
	
/*	.searchBtn {
		position: absolute;
		top: 0;
		right: 0;
		width: 51px;
		height: 38px;
		background-color: #fff;
	}*/
	
	.searchBtn img {
		position: absolute;
		width: 26px;
		top: 6px;
		left: 0;
	}
	
	.layui-btn.layui-btn-success {
		background-color: #009688;
	}
	
	.layui-table thead tr,
	.layui-table-header {
		background-color: #D8E6F1 !important;
	}
	.layui-btn-primary {
		color: #249EFB;
		border: 1px solid #249EFB;
	}
	.layui-btn-primary:hover {
		background-color: #E3F7FF;
		color: #249EFB;
	}
	.layui-bor-b {
		height: 4px;
		background-color: #249EFB;
	}
	.add-layui-nav-li {
        color: #249EFB;
    }
	.layui-btn-xs,.layui-btn-xs:hover {
		border: 1px solid #249EFB;
		background-color: #fff;
		color: #249EFB;
		padding: 0px 10px;
	}
    .layui-btn-danger,.layui-btn-danger:hover{
		color: #FF5722;
		background-color: #fff;
		border: 1px solid #FF5722;
		padding: 0px 10px;
	}
	#data_statistics_b{
		border: 1px solid #E4E4E4;
		box-sizing: border-box;
		padding: 20px;
	}
	#data_statistics_c,#data_statistics_d,#data_statistics_e {
		border: 1px solid #E4E4E4;
		padding: 15px;
	}
	.mt15 {
		margin-top: 15px;
	}

</style>

<body>
<div class="layui-fluid">
	<div class="">
		<div class="layui_fluid1"  style="display: block;">
			<div class="layui-card">
				<div class="layui-form layui-card-header layuiadmin-card-header-auto">
	                <div class="layui-form-item">
	                    <div style="float:right;">
	                    	<div class="layui-inline">
		                        <label class="layui-form-label">关键词</label>
		                        <div class="layui-input-inline">
		                            <input type="text" id="keyword" name="keyword" placeholder="请输入话术关键词" autocomplete="off" class="layui-input keyword">
		                        </div>
		                    </div>
		                    <div class="layui-inline">
		                        <label class="layui-form-label">场景</label>
		                        <div class="layui-input-inline">
					                <select name="type" lay-filter="type" id="type">
					                    <option value="">请选择场景</option>
										{volist name="type" id="t"}
										<option value="{$t.id}" id="{$t.id}">{$t.name}</option>
										{/volist}
										</select>
		                        </div>
		                    </div>
		                    <div class="layui-inline">
		                        <button class="layui-btn layuiadmin-btn-useradmin searchBtn" lay-submit lay-filter="search">
		                            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
		                        </button>
		                    </div>
	                    </div>
	                    <div class="layui-inline" style="float: left;">
		                    {auth:check name="talkskill/add_talkskill"}
		                    	<button class="layui-btn layuiadmin-btn layui-btn-primary" data-type="add">添加成功案例</button>
		                    {/auth:check}
		                </div>
	                </div>
				</div>
				<div class="layui-card-body">
					<table id="label-table" lay-filter="label-table"></table>
				</div>
			</div>
		</div>
	</div>
</div>	
	
	
</body>
{/block} {block name="js"}
<script type="text/html" id="table-evidence-action">
		{{# if(d.from_type == 0){ }}
		
		{auth:check name="talkskill/cate_talkskill_add"}
			<a class="layui-btn layui-btn-xs" lay-event="addhs">添加话术</a>
			{{# if(d.show == 0){ }}
				<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
				<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">删除</a>
			{{# }else{ }}
				<a class="layui-btn layui-btn-xs layui-btn-disabled" style="border: 1px solid #ccc;color: #ccc;">编辑</a>
				<a class="layui-btn layui-btn-xs layui-btn-disabled" style="border: 1px solid #ccc;color: #ccc;">删除</a>
			{{# } }}
		{/auth:check}
		{{# }else{ }}
			<span>无</span>
		{{# } }}
	
</script>
<script type="text/html" id="update_time">
	{{# if(d.update_time == ''){ }}
		<span>/</span>
	{{# }else{ }}
		{{d.update_time}}	
	{{# } }}
</script>
<script type="text/html" id="label_name">
	{{# if(d.from_type == 2){ }}
	<a href="{:url('talkskill/success_index')}?type={{d.id}}" lay-event="talkill_list" style="color: #0066CC">
		<i class="layui-icon">&#xe609;</i>&nbsp;&nbsp;{{d.name}}
	</a>
	{{# }else{ }}
	<a href="{:url('talkskill/success_index')}?type={{d.id}}" lay-event="talkill_list" style="color: #0066CC">
		{{d.name}}
	</a>
	{{# } }}
</script>
<script>
	layui.config({
		base: '__LAYUI__/',
		urlbase: '/sys'
	}).extend({
		index: 'lib/index'
	}).use(['index', 'table', 'element'], function() {
		var $ = layui.$,
			form = layui.form,
			element = layui.element,
			table = layui.table;
		
		var field = {};
		form.on('submit(search)', function (data) {
	        var type = $('#type').val();
	        var keyword = $('#keyword').val();
	        field['type'] = type;
	        field['keyword'] = keyword;
	        //执行重载
	        table.reload('label-table', {
	            where: field
				,page: {curr:1}
	        });
	    });

	    var active = {
			add: function() {
				layer.open({
					type: 2,
					title:['话术上传', 'color:#333333;background-color:#D8E6F1;'],
					content: '{:url("talkskill/success_add")}',
					resize: false,
					area: ['80%', '90%'],
					btn: ['确定', '取消'],
					yes: function(index, layero) {
						//点击确认触发 iframe 内容中的按钮提交
						var submit = layero.find('iframe').contents().find("#talkskill-submit");
						submit.click();
					}
				});
			},

            //字典管理
            dictionary:function() {
				layer.open({
					type: 2,
					title:['字典管理', 'color:#333333;background-color:#D8E6F1;'],
					content: '{:url("talkskill/dictionary")}',
					resize: false,
					area: ['80%', '80%'],
					// btn: ['确定', '取消'],
					yes: function(index, layero) {
						
					}
				});
            }
		};

		//列表
		table.render({
			elem: '#label-table',
			autoSort: false,
			url: '{:url("talkskill/success_cate_list")}',
			cols: [
				[{
					type: 'numbers',
					field: 'id',
					width: 80,
					title: '序号',
				}, {
					field: 'title',
					align: 'center',
					title: '场景',
					templet: '#label_name'
				}, {
					field: 'talkskill_count',
					align: 'center',
					title: '话术条数'
				}, {
					align: 'center',
					title: '浏览量',
					field: 'view_times'
				}, {
					field: 'update_time',
					align: 'center',
					title: '更新时间',
					templet: '#update_time'
				}, {
					title: '操作',
					width: 240,
					align: 'center',
					toolbar: '#table-evidence-action',
					fixed:'right'
				}]
			],
			page: true,
			limit: 30,
			height: 'full-220',
			text: '对不起，加载出现异常！'
		});
		//监听列表
		table.on('tool(label-table)', function(obj) {

			var data = obj.data;
			if(obj.event === 'delete') {
				layer.confirm('确定要删除该场景么？',{title:['信息', 'color:#333333;background-color:#D8E6F1;'],}, function() {
					$.get("{:url('talkskill/cate_del')}?type=0&id=" + data.id, function(res) {
						if(res.code === 0) {
							layer.msg(res.msg, {
								anim: 0,time:800
							}, function() {
								table.reload('label-table');
							});
						} else {
							layer.msg(res.msg, {
								anim: 6,time:800
							});
						}
					});
				});
			} else if(obj.event === 'edit') {
				layer.prompt({
					title:['编辑', 'color:#333333;background-color:#D8E6F1;'],
					value: data.label_name
				}, function(value, index) {
					if($.trim(value) == data.label_name || $.trim(value) == '') {
						layer.msg('请修改名称', {anim: 6,time: 800});
						return false;
					}
					if($.trim(value).length > 20) {
						layer.msg('场景名称超长', {anim: 6,time: 800});
						return false;
					}
					$.ajax({
						url: '{:url("talkskill/dictionary_ajax_edit")}',
						type: 'post',
						data: {
							id: data.id,
							name: $.trim(value),
							type:0
						},
						dataType: 'json',
						success: function(res) {
							if(res.code === 0) {
								layer.msg(res.msg, {anim: 0,time: 800});
								//执行重载
								table.reload('label-table');
							} else {
								layer.msg(res.msg, {anim: 6,time: 800});
							}
						}
					});
					layer.close(index);
				});
			}else if(obj.event === 'addhs') {
				layer.open({
					type: 2,
					title:['上传 #'+data.name+'# 话术', 'color:#333333;background-color:#D8E6F1;'],
					content: '{:url("talkskill/success_add_new")}?id=' + data.id,
					resize: false,
					area: ['80%', '90%'],
					btn: ['确定', '取消'],
					yes: function(index, layero) {
						//点击确认触发 iframe 内容中的按钮提交
						var submit = layero.find('iframe').contents().find("#talkskill-submit");
						submit.click();
					}
				});
			}
		});
		
		$('.layui-btn.layuiadmin-btn').on('click', function() {
			var type = $(this).data('type');
			active[type] ? active[type].call(this) : '';
		});
	});
	
</script>
{/block}