YH_Web_UI/WebUI/CallCenterWe.../equipmentOpe.../js/floorManage.js

/**
 * 楼层管理
 * */

var table = $('#table1'); //左边表格
var tableRight = $('#table2');
var bs; //字典标识
$(document).ready(function() {
	$('.tool_bars').authorizeButton();
	initTable(); //左边表格
	initTableRight(bs); //右边表格

	/*搜索*/
	$("#sc_btns").click(function() {
		initTable();
	})
	//项目信息
	GetEquipName($('#projectid'))
})
//加载左边的数据表格
function initTable() {
	//先销毁表格
	table.bootstrapTable('destroy');
	//初始化表格,动态从服务器加载数据
	table.bootstrapTable({
		method: "get", //使用get请求到服务器获取数据
		url: huayi.config.callcenter_url + "configurationapi/api/FloorManage/getbuildlistsbypage", //获取数据的Servlet地址
		contentType: "application/x-www-form-urlencoded",
		striped: true,
		striped: true, //表格显示条纹
		pagination: true, //启动分页
		pageSize: 10, //每页显示的记录数
		pageNumber: 1, //当前第几页
		pageList: [10, 15, 20, 30, 50, 100], //记录数可选列表
		search: false, //是否启用查询
		showColumns: false, //显示下拉框勾选要显示的列
		showRefresh: false, //显示刷新按钮
		sidePagination: "server", //表示服务端请求
		//设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
		//设置为limit可以获取limit, offset, search, sort, order
		queryParamsType: "undefined",
		queryParams: function queryParams(params) { //设置查询参数
			var param = {
				pageindex: params.pageNumber,
				pagesize: params.pageSize,
				keyword: $("#KeyWord").val(),
				projectid: $('#projectid').val()

			};
			return param;
		},
		onLoadSuccess: function(data) { //加载成功时执行
			//layer.msg("加载成功");
			var newDataL = {};
			newDataL.state = data.state;
			newDataL.message = data.message;
			newDataL.rows = data.data.rows;
			newDataL.total = data.data.total;
			$('#table1').bootstrapTable('load', newDataL);
			$('.tool_downs').authorizeOperateButton();
		},
		onLoadError: function() { //加载失败时执行
			//layer.msg("加载数据失败", { time: 1500, icon: 2 });
		}
	});
}
/*获取选中行对象*/
table.on("click-row.bs.table", function(e, row, ele) {
	$('.success').removeClass('success'); //去除之前选中的行的，选中样式
	$(ele).addClass('success'); //添加当前选中的 success样式用于区别
	bs = row.id;
	initTableRight(bs); //加载右侧的表格数据
});

function oper(val, row) {
	return '<div class="pull-right tool_downs">' +
		'<a class="del" title="删除" style="margin-right:5px;" authorize="yes" id="HY_deleteL_' + row.id + '" onclick="btn_deleteL(\'' + row.id + '\')"><i class="shanChu"></i></a>' +
		'<a class="xg" title="修改" authorize="yes" id="HY_editL_' + row.id + '" onclick="btn_editL(\'' + row.id + '\')"><i class="xiuGai"></i></a>' +
		'</div>' +
		'<div class="pull-left">' + val + '</div>'
}

function setCodeLeft(val, row, index) {
	var page = table.bootstrapTable("getPageCode");
	return page.pageSize * (page.pageNumber - 1) + index + 1;
}
//左侧添加
function btn_addL() {
	layer.open({
		type: 2,
		content: "template/addOrEditBuild.html",
		title: '添加楼信息',
		area: ['50%', '95%'], //宽高
	});
}

//左侧删除
function btn_deleteL(ids) {
	layer.confirm('确定删除选中记录？', {
		icon: 7,
		btn: ['是', '否'] //按钮
	}, function() {
		/*发送请求*/
		$.post(huayi.config.callcenter_url + "configurationapi/api/FloorManage/deletebuild", {
			ids: ids
		}, function(result) {
			result = JSON.parse(result);
			if(result.state.toLowerCase() == "success") {
				layer.msg("删除成功");
				$('#table1').bootstrapTable('refresh');
			}
		})
	});
}

//左侧修改
function btn_editL(ids) {
	layer.open({
		type: 2,
		content: "template/addOrEditBuild.html?ids=" + ids,
		title: '修改楼信息',
		area: ['50%', '95%'], //宽高
	});
}

/*
 右侧开始*****************************************************
 * */

//右侧 楼层表格
function initTableRight(ids) {
	//先销毁表格
	$('#table2').bootstrapTable('destroy');
	//初始化表格,动态从服务器加载数据
	$("#table2").bootstrapTable({
		method: "get", //使用get请求到服务器获取数据
		url: huayi.config.callcenter_url + "configurationapi/api/FloorManage/getlistsbypage", //获取数据的Servlet地址
		contentType: "application/x-www-form-urlencoded",
		striped: true, //表格显示条纹
		pagination: true, //启动分页
		pageSize: 10, //每页显示的记录数
		pageNumber: 1, //当前第几页
		pageList: [10, 20, 50, 100], //记录数可选列表
		search: false, //是否启用查询
		showColumns: false, //显示下拉框勾选要显示的列
		showRefresh: false, //显示刷新按钮
		sidePagination: "server", //表示服务端请求
		//设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
		//设置为limit可以获取limit, offset, search, sort, order
		queryParamsType: "undefined",
		queryParams: function queryParams(params) { //设置查询参数
			var param = {
				pageindex: params.pageNumber,
				pagesize: params.pageSize,
				buildid: ids
			};
			return param;
		},
		onLoadSuccess: function(data) { //加载成功时执行
			//layer.msg("加载成功");
			var newData = {};
			newData.state = data.state;
			newData.message = data.message;
			newData.rows = data.data.rows;
			newData.total = data.data.total;
			$('#table2').bootstrapTable('load', newData);
			$('.codeBox').hide();
			$('.tool_downs').authorizeOperateButton();
		},
		onLoadError: function() { //加载失败时执行
			//layer.msg("加载数据失败", { time: 1500, icon: 2 });
		}
	});
}

/* 楼层 删除提示*/
function btn_deleteR() {
	var ids = $.map($('#table2').bootstrapTable('getSelections'),
		function(row) {
			return row.id;
		});
	/*判断长度*/
	if(ids.length <= 0) {
		layer.confirm('没有可删除的选项？', {
			icon: 7,
			btn: ['确定'] //按钮
		});
		return;
	}

	removeR(ids)
}

function removeR(ids) {
	layer.confirm('确定删除选中记录？', {
		icon: 7,
		btn: ['是', '否'] //按钮
	}, function() {
		/*发送请求*/
		$.post(huayi.config.callcenter_url + "configurationapi/api/FloorManage/delete", {
			ids: ids
		}, function(result) {
			result = JSON.parse(result);
			if(result.state.toLowerCase() == "success") {
				layer.msg("删除成功");
				$('#table2').bootstrapTable('refresh');
			}
		})
	});

}

/* 楼层增加弹框*/
function btn_addR() {
	if(bs) {
		layer.open({
			type: 2,
			content: "template/addFloorManage.html?floorId=" + bs,
			title: '添加楼层信息',
			area: ['50%', '95%'], //宽高
		});
	} else {
		layer.confirm('请选择楼信息！', {
			icon: 7,
			btn: ['确定']
		});
		return;
	}

}
/* 楼层修改弹窗*/
function btn_editR(ids) {
	if(bs) {
		layer.open({
			type: 2,
			content: "template/addFloorManage.html?ids=" + ids + "&floorId=" + bs,
			title: '修改楼层信息',
			area: ['50%', '95%'], //宽高
		});
	} else {
		layer.confirm('请选择楼信息！', {
			icon: 7,
			btn: ['确定']
		});
		return;
	}
}

//楼层   格式化操作
function formatterOperate(val, row) {
	var str = '<ul class="tool_downs">' +
		'<li><a class="aBtn" authorize="yes" id="HY_editR_' + row.id + '" onclick="btn_editR(\'' + row.id + '\')">编辑</a><li>' +
		'<li><a class="aBtn" authorize="yes" id="HY_deleteR_' + row.id + '" onclick="removeR(\'' + row.id + '\')">删除</a><li>' +
		'<li><a class="aBtn" authorize="yes" id="HY_seeQR_' + row.id + '" onclick="btn_seeQR(\'' + row.id + '\', \''+ row.floorname +'\', \''+ row.remark +'\',\''+ row.projectname +'\')">查看二维码</a><li>' +
		'<li><a class="aBtn" authorize="yes" id="HY_exportQR_' + row.id + '" onclick="btn_exportQR(\'' + row.id + '\')">导出二维码</a><li>' +
		'</ul>' +
		
		'<div class="codeBox" id="codeBox_' + row.id + '">'+
			'<input type="hidden" id="qrCode_' + row.id + '" />' +
			// '<p class="code_title">需维修请微信扫码</p>'+
			'<p class="code_title">请微信扫码</p>'+
			'<p style="font-size: 12px; font-family:微软雅黑; color: #000;margin-top: 2px;margin-bottom: 10px;letter-spacing: 0px;">（首次扫码时请先关注公众号后再进行扫码）</p>'+
			'<div id="codeHtml" id="codeHtml_' + row.id + '" class="codeHtml">'+
				'<div id="code_' + row.id + '"></div>'+
			'</div>'+
			'<p style="font-size: 18px; color: #000000; font-family: 微软雅黑; font-weight: bold; padding: 0; margin: 16px auto 0 auto; width: 230px; text-align: justify; height: 22px; line-height: 22px;">'+ row.projectname +
				'<i style="display: inline-block; width: 100%"></i>'+
			'</p>'+
			'<p style="font-size: 16px; color: #333333; font-family: 微软雅黑; text-align: center; width: 230px; padding: 0; margin: 0 auto 5px auto;">技术支持</p>'+
			// '<img src="../img/floor_logo.png" class="logo_img">'+
			'<p class="promptMsg">'+
				'<span class="line">'+ row.floorname + '&nbsp;&nbsp;&nbsp;&nbsp;' + row.remark +'</span>'+
			'</p>'+
		'</div>';
	return str;
}

//楼层 查看二维码
function btn_seeQR(ids, floorName, remark, proname) {
	layer.open({
		type: 2,
		content: "template/seeFloorQRcode.html?ids=" + ids + "&floorName=" + floorName + "&remark=" + remark + "&proname=" + proname,
		title: '查看二维码',
		area: ['50%', '99%'], //宽高
	});
}

// 楼层导出二维码
function btn_exportQR(ids) {
	$('.codeBox').show();
	var index = layer.load();
	if($.isArray(ids)) {
		var zip = new JSZip();
		$.each(ids, function(i, v) {
			getQcodes(v);
			html2canvas($('#codeBox_' + v))
				.then(function(canvas) {
					var context = canvas.getContext('2d');
					// 【重要】关闭抗锯齿
					context.mozImageSmoothingEnabled = false;
					context.webkitImageSmoothingEnabled = false;
					context.msImageSmoothingEnabled = false;
					context.imageSmoothingEnabled = false;
					if(canvas.msToBlob) { //IE9+浏览器
						var blob = canvas.msToBlob();
						zip.file("floorQRcode_" + v + ".png", blob, {
							type: 'blob'
						});
					} else { //firefox,chrome
						// 【重要】默认转化的格式为png,也可设置为其他格式
						var imgEl = Canvas2Image.convertToImage(canvas, 380, 410, "png"); //转成图片
	
						//imgURL = zip.folder("");//可以自定义文件夹
						zip.file("floorQRcode_" + v + ".png", $(imgEl).attr("src").substring(22), {
							base64: true
						});
					}
				})
				.then(function() {
					if(ids.length == zip.file(/^floorQRcode/).length) {
						zip.generateAsync({
							type: "blob"
						}).then(function(content) {
							//console.log(content);
							// see FileSaver.js
							layer.close(index);
							saveAs(content, "报修二维码.zip");
							$('.codeBox').hide();
						}, function(err) {
							$('.codeBox').hide();
							layer.confirm(err, {
								btn: ['确定'] //按钮
							});
							return;
						});
					}
				});

		});
	} else {
		getQcodes(ids);
		html2canvas($('#codeBox_' + ids)).then(function(canvas) {
			var context = canvas.getContext('2d');
			// 【重要】关闭抗锯齿
			context.mozImageSmoothingEnabled = false;
			context.webkitImageSmoothingEnabled = false;
			context.msImageSmoothingEnabled = false;
			context.imageSmoothingEnabled = false;
			layer.close(index);
			if(canvas.msToBlob) { //IE9+浏览器
				var blob = canvas.msToBlob();
				window.navigator.msSaveBlob(blob, "报修二维码.png");
				$('.codeBox').hide();
			} else { //firefox,chrome
				Canvas2Image.saveAsImage(canvas, 380, 410, "png", "报修二维码"); //保存图片
				$('.codeBox').hide();
			}
		});
	}
}
// 楼层批量导出二维码
function btn_exportQRs() {
	var ids = $.map($('#table2').bootstrapTable('getSelections'),
		function(row) {
			return row.id;
		});
	/*判断长度*/
	if(ids.length <= 0) {
		layer.confirm('请选择楼层', {
			icon: 7,
			btn: ['确定'] //按钮
		});
		return;
	}
	btn_exportQR(ids);
}

// 楼层获取二维码
function getQcodes(ids) {
	var qrUrl = "http://wechat.nuodajituan.com/index.html?menucode=KSBX&id=" + ids + "&type=1"; //楼层
	$("#qrCode_" + ids).val(qrUrl);
	$('#code_' + ids).html('');
	var qrcode = new QRCode(document.getElementById("code_" + ids), {
		width: 230,
		height: 230,
	});
	var elText = document.getElementById("qrCode_" + ids);
	qrcode.makeCode(elText.value);
}

//项目信息
function GetEquipName(obj) {
	obj.empty();
	obj.append('<option selected="selected" value="">请选择项目名称</option>');
	$.getJSON(huayi.config.callcenter_url + "equipmentapi/api/ProjectInfo/getlistdrop", function(data) {
		if(data.state.toLowerCase() == "success") {
			var content = data.data;
			$(content).each(function(i, n) {
				$("<option value='" + n.id + "'>" + n.text + "</option>").appendTo(obj);
			})
			obj.selectpicker('refresh');
		}
	})
}