zhangwy
/
Gsmarket


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603
							
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>MarketQry</title>
	<link href="~/easyui/themes/default/easyui.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="~/easyui/themes/icon.css" />
	<link href="~/Content/css/bootstrap.min.css" rel="stylesheet" />
	<link href="~/Content/js/plugins/layer/skin/layer.css" rel="stylesheet" />
	<script src="~/Content/js/jquery.min.js"></script>
	<script src="~/Content/js/bootstrap.min.js"></script>
	<script src="~/easyui/jquery.easyui.min.js"></script>
	<script src="~/easyui/jquery.easyui.mobile.js"></script>
	<script src="~/easyui/locale/easyui-lang-zh_CN.js"></script>
	<script src="~/Content/js/plugins/layer/laydate/laydate.js"></script>
	<script src="~/Content/js/plugins/layer/layer.min.js"></script>
	<script src="~/js/Utils.js"></script>
	<script src="~/Content/plugins/HtmlToPdfJs/html2canvas.js"></script>
	<script src="~/Content/plugins/HtmlToPdfJs/jsPdf.js"></script>

	<link href="~/Content/css/Style/Markets.css" rel="stylesheet" />
	<script src="~/Content/js/js/MarketJs.js"></script>
	
</head>
<body>
<div id="BodyDiv">
<section class="hidden">
	<input id="hid_MarketType" name="hid_MarketType" type="hidden" value="0" />
</section>
		
<section style="height:95vh; padding: 10px 20px;">
	 <div class="row tbToolBar" id="tbToolBar">
		<div class="toolbar">
			<a href="#" class="easyui-linkbutton" iconCls="icon-application_view_detail" plain="true" onclick="btn_Detail();">查看详情</a>
		</div>
		<div class="toolbar-search">
					
		</div>	
        <div class="toolbar-search">
            <div id="Search" class="easyui-panel" title="请展开面板输入查询条件" style="width: 300px; height: 330px; padding: 10px;"
                 data-options="iconCls:'icon-heart',collapsible:true,minimizable:false,maximizable:false,closable:false,collapsed:true,tools:[
				{
					iconCls:'icon-search',
					handler:function(){LoadTable(true)}
				}]">

                <table>

                    <tr>
                        <td><label for="SearchNames">市场名称</label></td>
                        <td><input class="easyui-textbox" type="text" id="SearchNames" name="SearchNames" style="height: 25px; width: 150px" data-options="" /></td>
                    </tr>

                    <tr>
                        <td><label for="SearchMarketID">注册号码</label></td>
                        <td><input class="easyui-textbox" type="text" id="SearchMarketID" name="SearchMarketID" style="height: 25px; width: 150px" data-options="" /></td>
                    </tr>
                    <tr>
                        <td><label for="SearchRegionID">所属辖区</label></td>
                        <td>
                            <select class="easyui-combobox" type="text" id="SearchRegionID" name="SearchRegionID" style="height: 25px; width: 150px">
                                <option value="">全部</option>
                                @Html.Raw(ViewBag.SelRegionInfo)
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td><label for="SearchLicenseNo">执照编码</label></td>
                        <td><input class="easyui-textbox" type="text" id="SearchLicenseNo" name="SearchLicenseNo" style="height: 25px; width: 150px" data-options="" /></td>
                    </tr>
                    <tr>
                        <td><label for="SearchLicenseName">执照名称</label></td>
                        <td><input class="easyui-textbox" type="text" id="SearchLicenseName" name="SearchLicenseName" style="height: 25px; width: 150px" data-options="" /></td>
                    </tr>

                    <tr>
                        <td><label for="SearchMarketTypeName">市场类型</label></td>
                        <td>
                            <select class="easyui-combobox" type="text" id="SearchMarketTypeName" name="SearchMarketTypeName" style="height: 25px; width: 150px" data-options="">
                                <option value="">全部</option>
                                @Html.Raw(ViewBag.SelMarketTypeInfo)
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" style="text-align: center; width: 100%">
                            <a href="#" class="easyui-linkbutton" iconCls="icon-search" style="width: 100%; height: 25px" onclick="LoadTable(true);">查询</a>
                        </td>
                    </tr>
                </table>

            </div>
        </div>
				
	</div>
	<table id="dgTable" class="easyui-datagrid" style="height: 100%;"
	       data-options="singleSelect: true,
				method: 'post',
				multiSort: false,
				toolbar: '#tbToolBar',
				fitColumns: true,
				@*rownumbers: true,*@
				remoteSort: false,
				loadFilter: pagerFilter,
				onDblClickRow: function () {
                      btn_Detail();
                    },
				pagination: true,
				pageSize: 50,
				pageList: [20, 50, 100]
		   ">
		<thead>
		<tr>
			<th data-options="field:'Names',width:160">市场名称</th>
			<th data-options="field:'PractiseTime',width:65">开业时间</th>
			<th data-options="field:'Principal',width:50">负责人</th>
			<th data-options="field:'LinkMan',width:50">联系人</th>
			<th data-options="field:'LinkTel',width:70">联系电话</th>
			<th data-options="field:'FrontForUnit',width:160">主办单位</th>
			<th data-options="field:'ManageUnit',width:160">管理单位</th>
			<th data-options="field:'RegionNames',width:65,">所在辖区</th>
		</tr>
		</thead>
	</table>
</section>
	
<section>
	<div id="winModal" class="easyui-window winModal" title="市场信息详情" style="width: 1000px;padding:10px;"
	     iconCls="icon-save" data-options="modal:true,closed:true">
		<div class="easyui-layout" data-options="fit:true" style="height:99%">
			<div data-options="region:'center'" style="padding:0 25px;" >
				<!--StartPrint-->
				<div id="Print_Doc" style="margin-bottom: 15px;text-align: center;">
					<table id="MarketDetail" class="modal-table container-fluid">
						<thead>
							<tr>
								<th colspan="20" style="text-align: center">
									<h4 class="title"><span id="MarketName"></span><span class="">—基础信息明细</span></h4>
								</th>
							</tr>
						</thead>
						<tr>
							<td class="tdName"><strong>&nbsp;市场类型</strong>：</td>
							<td id="MarketTypeID" class="tdVal" colspan="3"></td>
							<td class="tdName"><strong>位置</strong>：</td>
							<td id="Address" class="tdVal" colspan="3"></td>
						</tr>
						<tr>
							<td class="tdName"><strong>&nbsp;面积</strong>：</td>
							<td class="tdVal"><span id="Area"></span><strong style="margin-left: 5px;">平方米</strong></td>
							<td class="tdName"><strong>经营户总数</strong>：</td>
							<td id="MarketSellerNum" class="tdVal"></td>
							<td class="tdName"><strong>规划审批</strong>：</td>
							<td id="AuditFlag" class="tdVal"></td>
							<td class="tdName"><strong>营业额</strong>：</td>
							<td class="tdVal"><span id="Turnover"></span><strong style="margin-left: 5px;">万元</strong></td>
						</tr>
						<tr>
							<td class="tdName"><strong>&nbsp;提升方案</strong>：</td>
							<td id="TdUpgrade" class="tdVal">已改造</td>
							<td class="tdName"><strong>开业时间</strong>：</td>
							<td id="PractiseTime" class="tdVal">2015/2/10</td>
							<td class="tdName"><strong>负责人</strong>：</td>
							<td id="Principal" class="tdVal">刘文明</td>
							<td class="tdName"><strong>电话</strong>：</td>
							<td id="Telephone" class="tdVal"></td>
						</tr>
						<tr>
							<td class="tdName"><strong>&nbsp;所属辖区</strong>：</td>
							<td id="RegionID" class="tdVal" colspan="3"></td>
							<td class="tdName"><strong>联系人</strong>：</td>
							<td id="LinkMan" class="tdVal"></td>
							<td class="tdName"><strong>联系人电话</strong>：</td>
							<td id="LinkTel" class="tdVal">13962119856</td>
						</tr>
						<tr>
							<td class="tdName"><strong>&nbsp;主办单位</strong>：</td>
							<td id="FrontForUnit" class="tdVal" colspan="3"></td>
							<td class="tdName"><strong> 管理单位</strong>：</td>
							<td id="ManageUnit" class="tdVal" colspan="3"></td>
						</tr>
						<tr>
							<td class="tdName"><strong>&nbsp;备注</strong>：</td>
							<td id="TdRemark" class="tdVal" colspan="7"></td>
						</tr>

					</table>

					<table id="Warrant" class="modal-table container-fluid">
						<thead>
							<tr>
								<th colspan="20" style="text-align: center">
									<h4 class="title">市场证件明细</h4>
								</th>
							</tr>
							<tr>
								<th class="Warrant_Id">序号</th>
								<th class="Warrant_Name">证件名称</th>
								<th class="Warrant_Number">证件号码</th>
								<th class="Warrant_StartTime">起始日期</th>
								<th class="Warrant_EndTime">截止日期</th>
								<th class="Warrant_Flag">附件</th>
							</tr>
						</thead>
						<tbody id="Warrant_Tbody">
							<tr>
								<td class="Warrant_Id"></td>
								<td class="Warrant_Name"></td>
								<td class="Warrant_Number"></td>
								<td class="Warrant_StartTime"></td>
								<td class="Warrant_EndTime"></td>
								<td class="Warrant_Flag"></td>
							</tr>
						</tbody>
					</table>

					<table id="EvalRpt" class="modal-table container-fluid">
						<thead>
							<tr>
								<th colspan="20" style="text-align: center">
									<h4 class="title">信用评比情况</h4>
								</th>
							</tr>
							<tr>
								<th class="EvalRpt_Sort">序号</th>
								<th class="EvalRpt_State">信誉等级</th>
								<th class="EvalRpt_Score">得分</th>
								<th class="EvalRpt_Time">评级时间</th>
							</tr>
						</thead>
						<tbody id="EvalRpt_Tbody">
							<tr>
								<td class="EvalRpt_Sort"></td>
								<td class="EvalRpt_State"></td>
								<td class="EvalRpt_Score"></td>
								<td class="EvalRpt_Time"></td>

							</tr>
						</tbody>
					</table>
					
					<table id="Img_1" class="modal-table container-fluid">
						<thead>
							<tr>
								<th colspan="20" style="text-align: center">
									<h4  class="title">市场分布示意图</h4>
								</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td class="tdImg">
									<img id="img_1" src="" alt="暂无图片" />
								</td>
							</tr>
						</tbody>
					</table>
					<table id="Img_2" class="modal-table container-fluid">
						<thead>
							<tr>
								<th colspan="20" style="text-align: center">
									<h4 class="title">市场管理人员网络图</h4>
								</th>
						</thead>
						<tbody>
							<tr>
								<td class="tdImg">
									<img id="img_2" s src="" alt="暂无图片" />
								</td>
							</tr>
						</tbody>
					</table>
					
				</div>
				<!--EndPrint-->
				<div class="" style="margin-bottom: 15px;text-align: center; display: @ViewBag.IsPrint; position: relative;z-index:10000">
					<button type="button" onclick="Print();" >直接打印</button>
					<button type="button" class="but5" onclick="PreView()" >打印预览</button>
				</div>
					
				
			</div>
			<div data-options="region:'south',border:false" style="text-align:right;height:45px; padding:13px 20px 0;">
				<a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)" onclick="$('#winModal').window('close');" style="width:80px">取消</a>
			</div>
		</div>
		
	</div>
	
</section>

</div>
<script>
	//查看市场详情
	function btn_Detail() {
		var rows = $('#dgTable').datagrid('getSelections');
		if (rows.length === 1) {
			var row = rows[0];
			console.log(row);
			//var regionId = $("#SearchRegionId").find("option[value='" + row.RegionID + "']").html();
			//var marketTypeId = $("#SearchMarketTypeID").find("option[value='" + row.MarketTypeID + "']").html();
			var auditFlag;
			switch (row.AuditFlag) {
			case "1":
				auditFlag = "已改造";
				break;
			case "2":
				auditFlag = "拟改造";
				break;
			case "3":
				auditFlag = "待定";
				break;
			case "4":
				auditFlag = "正在改造";
				break;
			default:
				auditFlag = "无";
				break;
			}
			$("#MarketName").html(row.Names);
			//$("#MarketID").html(row.MarketID).attr("readonly", "readonly");
			$("#RegionID").html(row.RegionNames);
			$("#PractiseTime").html(row.PractiseTime);
			$("#Area").html(row.Area);
			$("#MarketSellerNum").html(row.MarketSellerNum);
			$("#Principal").html(row.Principal);
			$("#LinkMan").html(row.LinkMan);
			$("#FrontForUnit").html(row.FrontForUnit);
			$("#Address").html(row.Address);
			$("#Name").html(row.Names);
			$("#MarketTypeID").html(row.MarketTypeName);
			$("#Upgrade").html(row.Upgrade);
			$("#Turnover").html(row.Turnover);
			$("#AuditFlag").html(auditFlag);
			$("#Telephone").html(row.Telephone);
			$("#LinkTel").html(row.LinkTel);
			$("#ManageUnit").html(row.ManageUnit);
			$("#Remark").html(row.Remark);
			LoadWarrant(row.MarketID);
			LoadEvalRpt(row.MarketID);
			LoadImg("#img_1", row.MarketID, 1);
			LoadImg("#img_2", row.MarketID, 2);
			$("#winModal input").attr("disabled", "disabled");
			$("#winModal textarea").attr("disabled", "disabled");
			$("#winModal").window("open");

		} else {
			layer.alert('请选择一条记录进行设置', { icon: 7, title: '提示信息' });
		}
	}
	
	function LoadTable(collapsed) {
	    collapsed = collapsed || false;
	    if (collapsed===true) {
	        $("#Search").panel("collapse", true);
	    }

	    $('#dgTable').datagrid({
	        url: '@Url.Action("MarketsListResult", "GetResult")',
	        onDblClickRow: function () {
                btn_Detail();
	        },
	        queryParams: {
	            IsLock: 0,
	            MarketType: $("#hid_MarketType").val(),
	            Names: $("#SearchNames").textbox("getValue"),
	            MarketID: $("#SearchMarketID").textbox("getValue"),
                RegionID: $("#SearchRegionID").combobox("getValue"),
	            LicenseNo: $("#SearchLicenseNo").textbox("getValue"),
	            LicenseName: $("#SearchLicenseName").textbox("getValue"),
                MarketTypeName: $("#SearchMarketTypeName").combobox("getValue")
	        }
	    });
	}
	$(function() {
	    setTimeout(LoadTable(false), 500);
	});

	function CreatePdf(doc) {
		var w = doc.width();
		var h = doc.height();//要将 canvas 的宽高设置成容器宽高的 2 倍  
		var canvas = document.createElement("canvas");
		canvas.width = w * 2;
		canvas.height = h * 2;
		canvas.style.width = w + "px";
		canvas.style.height = h + "px";
		var context = canvas.getContext("2d");//然后将画布缩放，将图像放大两倍画到画布上  
		context.scale(2, 2);
		html2canvas(doc.get(0),
			{
				onrendered: function(canvas) {

					var contentWidth = canvas.width;
					var contentHeight = canvas.height;

					//一页pdf显示html页面生成的canvas高度;
					var pageHeight = contentWidth / 592.28 * 841.89;
					//未生成pdf的html页面高度
					var leftHeight = contentHeight;
					//页面偏移
					var position = 0;
					//a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
					var imgWidth = 595.28;
					var imgHeight = 592.28 / contentWidth * contentHeight;

					var pageData = canvas.toDataURL('image/jpeg', 1.0);

					var pdf = new jsPDF();

					//有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)
					//当内容未超过pdf一页显示的范围，无需分页
					if (leftHeight < pageHeight) {
						pdf.addImage(pageData, 'JPEG', 20, 0, imgWidth-20, imgHeight);
					} else {
						while (leftHeight > 0) {
							pdf.addImage(pageData, 'JPEG', 20, position, imgWidth-20, imgHeight);
							leftHeight -= pageHeight;
							position -= 841.89;
							//避免添加空白页
							if (leftHeight > 0) {
								pdf.addPage();
							}
						}
					}
					pdf.save('content.pdf');
				}
			});
	}

	function CreatePdf2() {
		// We'll make our own renderer to skip this editor
		var specialElementHandlers = {
			'#editor': function (element, renderer) {
				return true;
			},
			'.controls': function (element, renderer) {
				return true;
			}
		};
		var pdf = new jsPDF();
		
		// remove all scripts
		var html = $("#Print_Doc")[0].innerHTML;
		html = html.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');
		var iframe = document.createElement('IFRAME');
		iframe.setAttribute('style', 'position:absolute;width:0;height:0;left:-500px;top:-500px;');
		iframe.setAttribute("id", "Iframe");
		document.body.appendChild(iframe);
		var doc = iframe.contentWindow.document;
		// 引入打印的专有CSS样式，根据实际修改
		doc.write("<LINK rel=\"stylesheet\" type=\"text/css\" href=\"../Content/css/Style/Print.css\">");
		doc.write('<div id="print">' + html + '</div>');
		doc.close();
		console.log(doc);

		iframe.contentWindow.focus();
		var pdfDoc = document.getElementById('Iframe').contentWindow.document.getElementById('print');
		console.log(pdfDoc);
		pdf.fromHTML(pdfDoc, 15, 0, {
			'width': 400,
			'elementHandlers': specialElementHandlers
		});
		pdf.save('content.pdf');
	}
	function CreatePdf3() {
		var pdf = new jsPDF('p', 'pt', 'letter');
		var printHtml = $("#Print_Doc")[0].innerHTML;
		//console.log(printHtml);
		html2pdf(printHtml, pdf, function (pdf) {
			console.log("save");
			pdf.save("11.pdf");
		});
	}

	function html2pdf(html, pdf, callback) {
		var canvas = pdf.canvas;
		if (!canvas) {
			alert('jsPDF canvas plugin not installed');
			return;
		}
		canvas.pdf = pdf;
		pdf.annotations = {
			_nameMap: [],
			createAnnotation: function (href, bounds) {
				var x = pdf.context2d._wrapX(bounds.left);
				var y = pdf.context2d._wrapY(bounds.top);
				var page = pdf.context2d._page(bounds.top);
				var options;
				var index = href.indexOf('#');
				if (index >= 0) {
					options = {
						name: href.substring(index + 1)
					};
				} else {
					options = {
						url: href
					};
				}
				pdf.link(x, y, bounds.right - bounds.left, bounds.bottom - bounds.top, options);
			},
			setName: function (name, bounds) {
				var x = pdf.context2d._wrapX(bounds.left);
				var y = pdf.context2d._wrapY(bounds.top);
				var page = pdf.context2d._page(bounds.top);
				this._nameMap[name] = {
					page: page,
					x: x,
					y: y
				};
			}

		};
		canvas.annotations = pdf.annotations;
		pdf.context2d._pageBreakAt = function (y) {
			this.pageBreaks.push(y);
		};
		pdf.context2d._gotoPage = function (pageOneBased) {
			while (pdf.internal.getNumberOfPages() < pageOneBased) {
				pdf.addPage();
			}
			pdf.setPage(pageOneBased);
		}
		//var promise;
		if (typeof html === 'string') {
			// remove all scripts
			html = html.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');

			var iframe = document.createElement('iframe');
			iframe.setAttribute('style', 'position:absolute;width:0;height:0;left:-500px;top:-500px;');
			iframe.setAttribute("id", "Iframe");
			iframe.setAttribute("name", "Iframe");
			//iframe.style.width = canvas.width;
			//iframe.src = "";
			//iframe.document.domain =
			document.body.appendChild(iframe);
			var doc = iframe.contentDocument;
			if (doc == undefined) {
				doc = iframe.contentWindow.document;
			}
			if (doc == undefined) {
				return;
			}
			//iframe.setAttribute('style', 'position:absolute;right:0; top:0; bottom:0; height:100%; width:500px');

			doc.open();
			doc.write("<LINK rel=\"stylesheet\" type=\"text/css\" href=\"../Content/css/Style/Print.css\">");
			doc.write("");
			doc.write("<div id=\"print\" style=\"text-align:center;margin:10px auto;width:805px\">" + html+"</div>");
			doc.close();
			html2canvas(document.getElementById('Iframe').contentWindow.document.getElementById('print'), {
				canvas: canvas,
				onrendered: function () {
					if (callback) {
						if (iframe) {
							iframe.parentElement.removeChild(iframe);
						}
						callback(pdf);
					}
				}
			});

		} else {
			var body = html;
			html2canvas(body, {
				canvas: canvas,
				onrendered: function () {
					if (callback) {
						//if (iframe) {
						//	iframe.parentElement.removeChild(iframe);
						//}
						callback(pdf);
					}
				}
			});
		}

	}

	function DownloadPdf() {
		var html = $("#Print_Doc")[0].innerHTML;
		var url = "/GetResult/PdfCreate";
		var htmlStr =
			'<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><LINK rel="stylesheet" type="text/css" href="../../Content/css/Style/Print.css"></head><body><div style="text-align:center;margin:10px auto;width:805px">' +
				html +
				'</div></body>';
		console.log(htmlStr);
		var form = $("<form></form>").attr("action", url).attr({ "method": "post", "target": "_blank" });
		form.append($("<input></input>").attr("type", "hidden").attr("name", "htmlStr").attr("value", htmlStr));
		form.appendTo('body').submit().remove();
	}
	
</script>
	
</body>

</html>