crm/app/empcrm/view/community/operate_report.html

{extend name="public/layout"}
{block name="body"}
<link rel="stylesheet" href="__LAYUI__/layui/css/layui.css" media="all">
<link rel="stylesheet" " href=" /static/css/common.css">
<script src="/static/js/jquery.min.js"></script>
<style>
	body {
		padding-bottom: 40px;
	}

	.searchtitlebox {
		display: block;
		padding: 15px 10px;
		border: 1px solid #F0F0F0;
		background: #FCFCFC;
		margin-top: 5px;
		margin-bottom: 10px;
		position: relative;
		min-width: 800px;
	}

	.searchbox {
		display: block;
		margin-top: 8px;
		text-align: center;
	}

	.searchbox input {
		display: inline-block;
		height: 26px;
		line-height: 26px;
		padding-left: 3px;
		vertical-align: middle;
	}

	body {
		font-size: 12px;
		font-family: "宋体";
	}

	.selectbox {
		float: left;
	}

	.leftselect {
		float: left;
		height: 26px;
		line-height: 26px;
	}

	.selectbox select {
		float: left;
		height: 26px;
	}

	.searchtext {
		border: 1px solid #ccc;
		background: #fff url(__STATIC__/img/icon071402.png) no-repeat;
		padding: 1px 2px;
		height: 24px;
		line-height: 24px;
		vertical-align: middle;
		text-indent: 3px;
		margin-left: 4px;
	}

	.searchbtn1 {
		margin-left: 4px;
		cursor: pointer;
		color: #000;
		background: url(__STATIC__/img/btn_bg.gif) repeat-x;
		border: 1px solid #C0C0C0;
		padding: 0 12px;
		*padding: 0 6px;
		height: 26px;
	}

	.layui-table td,
	.layui-table th {
		font-size: 12px;
	}

	.layui-table th {
		font-weight: bold;
	}

	.dingjingorder {
		height: 25px;
		width: 40px;
		background-color: #65c001;
		color: #FFF;
		text-align: center;
		line-height: 25px;
		z-index: 100;
		display: block;
		position: absolute;
		top: 1px;
		right: 3px;
		border-radius: 11px;
		font-size: 12px;
	}

	.addvx {
		position: absolute;
		top: -5px;
		right: 1px;
		height: 14px;
		line-height: 14px;
		font-size: 16px;
		color: #666;
		font-family: "宋体";
	}

	.statebox {
		width: 40px;
		text-align: center;
		z-index: 100;
		display: block;
		position: absolute;
		font-size: 12px;
		top: -5px;
		right: 0px;
		border-radius: 0px;
		background: #4285f4;
		color: #efefef;
		height: 20px;
		line-height: 20px;
	}

	.layui-table-cell {
		overflow: initial;
	}

	#customer_detail {
		display: block;
		width: 435px;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	.rightbox {
		display: block;
		width: calc(100% - 435px);
		margin-left: 435px;
	}

	.unstatusbox {
		display: block;
		position: absolute;
		top: -5px;
		left: 0;
		width: 100%;
		height: 37px;
		background-color: #FF6600;
		text-align: center;
		color: #FFF;
	}

	.statusbox {
		position: absolute;
		top: 0px;
		right: 0px;
		color: #666;
		text-align: right;
		z-index: 100;
		display: block;
		font-size: 12px;
	}

	.layui-table-view .layui-form-checkbox {
		width: 16px;
		height: 16px;
		line-height: 16px;
		padding-right: 0;
	}

	.layui-table-view .layui-form-checkbox i {
		height: 16px;
		width: 16px;
		font-size: 14px;
	}

	.novisitlog {
		background-color: #9139db !important;
		color: #FFF;
	}

	.novisitlog a {
		color: #FFF;
	}

	.crmsearchlist {
		max-height: 760px;
		cursor: pointer;
	}
	.crmsearchlist-box{
		visibility: hidden;
	}
	.tablebox .layui-form.layui-border-box.layui-table-view {
		max-height: 400px !important;
		height: auto !important;
	}

	.searchbox .layui-form-select {
		float: left;
		width: 130px;
	}

	.searchbox input {
		border: 1px solid #e6e6e6 !important;
	}

	.layui-table-body {
		max-height: 400px !important;
		height: auto !important;
	}

	.layui-table-view .layui-table td {
		cursor: pointer;
		overflow: hidden;
	}

	.layui-form-checked {
		background-color: #37AF6E;
	}

	.layui-table-view .layui-form-checked i {
		color: #fff;
	}

	.summary_report h1 {
		text-align: center;
		margin-bottom: 20px;
		margin-top: 20px;
		letter-spacing: 2px;
		font-family: Arial, Helvetica, sans-serif;
	}
	.operate_report_op2{
		display: none;
	}
	
	.crmsearchlist-box .layui-table-cell{
		white-space: normal;
		height: auto;
		line-height: 1.2em;
		padding: 0;
	}
	.bgred{
		background-color: red;
	}
	.bgyellow{
		background-color: yellow;
	}
	.bggreen{
		background-color: green;
	}
</style>

<body class="clearfix">
	<iframe id="customer_detail" style="display: none;" src=""></iframe>
	<div class="crmbox summary_report">
		<form class="layui-form">
			<div class="searchtitlebox">
				<div style="margin-bottom:8px;">您当前的操作 · <b class="buildering-name">重点楼盘运营管控报表</b>


					<div class="searchbox clearfix operate_report_op2" style="width: 400px;float: right;margin-top: 0;">
						<div class="selectbox community1box" style="width: 400px;float: right;">
							<input style="width:160px" type="text" class="left searchtext" autocomplete="off" style="border-color: #ccc;" name="visitime" id="visitime" placeholder="选择时间"
							  readonly />
							<select name="community1" lay-search>
								<option value="">==小区名称==</option>
								{volist name="community" id="vo"}
								<option value="{$vo.id}">{$vo.name}</option>
								{/volist}
							</select>
							<button class="left searchbtn1" type="button" lay-submit lay-filter="search1">查看</button>
						</div>
					</div>
				</div>

			</div>

			<div class="searchbox clearfix operate_report_op1">
				<div class="selectbox community2box" style="width: 316px;float: none;margin: 40px auto;">
					<select name="community2" lay-search>
						<option value="">==小区名称==</option>
						{volist name="community" id="vo"}
						<option value="{$vo.id}">{$vo.name}</option>
						{/volist}
					</select>
					<button class="left searchbtn1" type="button" lay-submit lay-filter="search2">查看</button>
				</div>
			</div>
			<div class="crmsearchlist-box">
				<h1></h1>
				<div class="crmsearchlist">
					<table lay-filter="crmsearchlist" id="crmsearchlist"></table>
				</div>
			</div>
			
		</form>
	</div>

</body>

<script src="__LAYUI__/layui/layui.js"></script>

{/block}{block name="js"}
<script type="text/javascript">
	
	var reload = null,
		resizefun = null;
	layui.config({
		base: '__LAYUI__/',
		urlbase: '/sys'
	}).extend({
		index: 'lib/index' //主入口模块
	}).use(['table', 'laydate'], function() {
		var table = layui.table,
			laydate = layui.laydate,
			$ = layui.$;
		form = layui.form;
		var field = {};
		laydate.render({
		  elem: '#visitime',
		  max:0
		  ,trigger:'click',
		  range: true
		});
		
		form.on('submit(search1)', function(data) {
			
			var community_id = $('[name=community1]').val();
			
			$('.buildering-name').html($('.community1box .layui-form-select input').val()+'运营管控报表')
			$('.crmsearchlist-box h1').html($('.community1box .layui-form-select input').val()+'小区综合报表')
			var date = $('#visitime').val();
			field['community_id'] = community_id;
			field['date'] = date;
			//执行重载
			table.reload('crmsearchlist', {
				url: '{:url("community/operate_report")}',
				where: field,
				page: {
					curr: 1
				}
			});
		});
		
		
		
		form.on('submit(search2)', function(data) {
			var community_id = $('[name=community2]').val();
			if(!community_id){
				return false
			}
			$('.operate_report_op1').css('display','none');
			$('.operate_report_op2').css('display','block');
			$('.crmsearchlist-box').css('visibility','unset');
			
			
			var date = $('#visitime').val();
			field['date'] = date;
			$('[name=community1]').val(community_id);
			$('.buildering-name').html($('.community2box .layui-form-select input').val()+'运营管控报表')
			$('.crmsearchlist-box h1').html($('.community2box .layui-form-select input').val()+'小区综合报表')
			
			// $('.community1box input').val(community_id);
			field['community_id'] = community_id;
			form.render();
			//执行重载
			table.reload('crmsearchlist', {
				url: '{:url("community/operate_report")}',
				where: field,
				page: {
					curr: 1
				}
			});
		});


		table.render({
			elem: '#crmsearchlist',
			url: '',
			data: [],
			resize: true,

			//even: true,
			cols: [
				[{
						title: '日期',
						field: 'date',
						align: 'center',
						rowspan: 2,
					},
					{
						title: '每日必完成项',
						field: 'community_name',
						align: 'center',
						colspan: 6,
					},
					{
						title: '实时安排类',
						field: 'square',
						align: 'center',
						colspan: 6,
					},
					{
						title: '到店引流类',
						field: 'square',
						align: 'center',
						colspan: 6,
					},
					{
						title: '活动类',
						field: 'square',
						align: 'center',
						colspan: 7,
					},
					{
						title: '价值输出类',
						field: 'square',
						align: 'center',
						colspan: 5,
					},
					{
						title: '会议类',
						field: 'square',
						align: 'center',
						colspan: 4,
					}
				],
				[{
						title: '加微',					
						field: 'jiav',
						align: 'center',
						minWidth:30,
					},
					{
						title: '进群',
						field: 'into_owner_group',
						align: 'center',
						minWidth:30,
					},
					{
						title: '回访',
						field: 'last_contact_date',
						align: 'center',
						minWidth:30,
					},
					{
						title: '口碑',
						field: 'reputation_gather',
						align: 'center',
						minWidth:30,
					},
					{
						title: '运营',
						field: 'chat_group',
						align: 'center',
						minWidth:30,
					},
					{
						title: '日志',
						field: 'work_log',
						align: 'center',
						minWidth:30,
						
					},					
					{
						title: '社群剧本',
						field: 'group_script',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '种子客户',
						field: 'customer_worship',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: 'VR楼书',
						field: 'building_output',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '谈单演练',
						field: 'talk_drill',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '素材包',
						field: 'material_production',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '威智慧口碑',
						field: 'wei_opinions',
						align: 'center',
						minWidth:30,
						
					},					
					{
						title: '小区直播',
						field: 'community_broadcast',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '户型直播',
						field: 'housetype_broadcast',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '收房验房',
						field: 'house_inspection_broadcast',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '开工直播',
						field: 'start_work_broadcast',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '样板直播',
						field: 'sample_room_broadcast',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '定锚引流',
						field: 'anchoring_traffic',
						align: 'center',
						minWidth:30,
						
					},						
					{
						title: '样板征集',
						field: 'sample_room_collect',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '业主团购',
						field: 'owner_buy',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '业主见面',
						field: 'owner_meeting',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '工地直通',
						field: 'construction_direct',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '验房抢购',
						field: 'house_inspection',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '归家晚宴',
						field: 'home_dinner',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '客户答谢',
						field: 'customer_thanks',
						align: 'center',
						minWidth:30,
						
					},								
					{
						title: '户型分享',
						field: 'housetype_share',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '省钱攻略',
						field: 'decoration_saves_money',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '闭坑指南',
						field: 'decoration_closed_pit',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '十大空间',
						field: 'top_ten_spatial_planning',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '验收标准',
						field: 'decoration_acceptance_standards',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '周会',
						field: 'weekly_meeting',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '月会',
						field: 'month_meeting',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '对单会',
						field: 'single_meeting',
						align: 'center',
						minWidth:30,
						
					},
					{
						title: '培训会',
						field: 'train_meeting',
						align: 'center',
						minWidth:30,
						
					},
				]
			],
			page: true,
			limits: [10],
			limit: 10, //每页默认显示的数量,
			height: 'full-120',
			text: '对不起，加载出现异常！',
			done:function (res, page, count) {
			    var that = this.elem.next();
			    res.data.forEach(function (item,index) {
			        
			        var tr = that.find("[data-index=" + index + "]").children();
			            tr.each(function () {
			                var b = $(this).text();
							let arr =['anchoring_traffic',
							'building_output',
							'chat_group',
							'community_broadcast',
							'construction_direct',
							'customer_thanks',
							'customer_worship',
							'decoration_acceptance_standards',
							'decoration_closed_pit',
							'decoration_saves_money',
							'group_script',
							'home_dinner',
							'house_inspection',
							'house_inspection_broadcast',
							'housetype_broadcast',
							'housetype_share',
							'material_production',
							'month_meeting',
							'owner_buy',
							'owner_meeting',
							'sample_room_broadcast',
							'sample_room_collect',
							'single_meeting',
							'start_work_broadcast',
							'talk_drill',
							'top_ten_spatial_planning',
							'train_meeting',
							'weekly_meeting',
							'wei_opinions',
							'work_log',]
							
							var field =  $(this).attr('data-field');
							
							
			                if (arr.indexOf(field) != -1) {
								if(b=='1'){
									$(this).css("background-color", "red");//单元格背景颜色
									$(this).css("color", "red");//单元格字体颜色
								}else if(b=='2'){
									$(this).css("background-color", "yellow");//单元格背景颜色
									$(this).css("color", "yellow");//单元格字体颜色
								}else if(b=='3'){
									$(this).css("background-color", "green");//单元格背景颜色
									$(this).css("color", "green");//单元格字体颜色
								}else{
									// $(this).css("background-color", "#fff");//单元格背景颜色
									$(this).css("color", "transparent");//单元格字体颜色
									
								}
			                   
			                }
			               
			            })
			    })
			},
		});
		resizefun = function() {
			table.resize('crmsearchlist');
		};
		window.resizefun2 = function() {
			table.resize('crmsearchlist');
		};
		reload = function() {
			table.reload('crmsearchlist', {
				url: '{:url("community/operate_report")}',
				where: field
			}, true);
		};
	})

	function removealog(params) {
		$('#customer_detail').hide();
		$('.crmbox').removeClass('rightbox');
	}
</script>
{/block}