<%@ page language="java" pageEncoding="utf-8"%>
<%@ page language="java" import="com.fadu.web.util.Constant" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<% 
	String token = (String)session.getAttribute(Constant.Session.TOKEN) ;
	String openid = (String)session.getAttribute(Constant.Session.DWLSD_OPENID);
%>
<c:set var="contextPath" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="wap-font-scale" content="no">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
    <title>多问</title>
	<script src="${contextPath}/static/js/flexible.min.js"></script>
	<link rel="stylesheet" type="text/css" href="${contextPath}/static/weixin/cd/css/sprite.css">
	<link rel="stylesheet" type="text/css" href="${contextPath}/static/weixin/cd/css/common.css">
	<link rel="stylesheet" type="text/css" href="${contextPath}/static/weixin/cd/css/main.css">
	<link rel="stylesheet" type="text/css" href="${contextPath}/static/weixin/common/js/upload/upload.css">
	<link rel="stylesheet" type="text/css" href="${contextPath}/static/weixin/cd/css/viewImg.css">
</head>
<body class="bg-lgreen">
	<div class="page">
		<header class="top bg-blue text-center fc-white fs-16 ub ub-pj">
			<a href="javascript:history.back(-1);" class="pad-l-30">
				<span class="icon icon-back"></span>
			</a>
			<span>订单详情</span>
			<span class="pad-l-40 pad-r-30"></span>
		</header>
		<div class="bg-white fs-12 pad-tb-20 pad-l-25">订单号 ${orderId}</div>
		<div>
			<div class="mar-l-25 mar-t-20 mar-b-10 fc-xxxlgrey fs-12">基本信息</div>
			<ul class="bg-white pos-relate list-bottom br-top1 br-bottom1 order-detail-list">
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">查档类型</span>
					<span class="mar-l-15" id="cdTypeName"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">查档地区</span>
					<span class="mar-l-15" id="areaFullName"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">服务价格</span>
					<span class="mar-l-15" id="price"></span>
				</li>
			</ul>
		</div>
		<div>
			<div class="mar-l-25 mar-t-20 mar-b-10 fc-xxxlgrey fs-12">提交申请的资料</div>
			<ul class="bg-white pos-relate list-bottom br-top1 br-bottom1 order-detail-list">
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">公司名称</span>
					<span class="mar-l-15" id="textName1"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">公司名称</span>
					<span class="mar-l-15" id="textName2"></span>
				</li>				
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">姓名</span>
					<span class="mar-l-15" id="textName3"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide" > 
					<span class="fc-xxxlgrey">户籍地址</span>
					<span class="mar-l-15" id="textAddress3"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"  > 
					<span class="fc-xxxlgrey">身份证号码/出生日期</span>
					<span class="mar-l-15" id="textNumber3"></span>
				</li>				
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">名称</span>
					<span class="mar-l-15" id="textName4"></span>
				</li>				
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">身份证号码</span>
					<span class="mar-l-15" id="textNumber4"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">房产地址</span>
					<span class="mar-l-15" id="textAddress5"></span>
				</li>				
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">车牌号码</span>
					<span class="mar-l-15" id="textNumber6"></span>
				</li>				
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1" > 
					<span class="fc-xxxlgrey">查档要求</span>
					<span class="mar-l-15" id="textOther"></span>
				</li>
				
				<!-- <li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 ub" > 
					<span class="mar-r-15 fc-xxxlgrey">委托查档材料</span>
					<div id="cdMater">
					</div>
				</li> -->
			</ul>
		</div>
		
		<div class="hide">
			<div class="mar-l-25 mar-t-20 mar-b-10 fc-xxxlgrey fs-12">申请所需材料</div>
			<ul class="pad-l-15 bg-white pos-relate br-top1 br-bottom1 list-bottom-width100" id="needMaterial">		
				<li class="pos-relate br-bottom1">
					<div class="pad-r-15 pad-tb-20 ub ub-ac ub-pj touchact application-material-title">
						<div class="clear">
							<span class="fc-xxxlgrey">1.民事诉讼状</span>
						</div>
						<span class="icon icon-down-blue2"></span>
					</div>
					<div class="pos-relate br-top1 pad-tb-15 hide">
						<div class="pad-r-15 scroll-y uploader-box">
							<div class="uploader-pic-box">
								<img class="uploader-pic uploader-preview" src="https://duowen-test.oss-cn-shenzhen.aliyuncs.com/cd/2017/3/0a682181-1448-469c-a2c0-c00b58284a9f0.jpg?x-oss-process=image/resize,w_200,h_200" />
								<img class="uploader-pic uploader-preview" src="https://duowen-test.oss-cn-shenzhen.aliyuncs.com/cd/2017/3/0a682181-1448-469c-a2c0-c00b58284a9f0.jpg?x-oss-process=image/resize,w_200,h_200" />
							</div>
						</div>
					</div>
				</li>
			</ul>
		</div>
		
		
		<div class="mar-b-35 hide" id="rpInfo">
			<div class="mar-l-25 mar-t-20 mar-b-10 fc-xxxlgrey fs-12">收货信息</div>
			<ul class="bg-white pos-relate list-bottom br-top1 br-bottom1 order-detail-list">				
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">收货人</span>
					<span class="mar-l-15" id="rpName"></span>
				</li>			
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">电话</span>
					<span class="mar-l-15" id="rpTel"></span>
				</li>				
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">收货地址</span>
					<span class="mar-l-15" id="rpAddress"></span>
				</li>
			</ul>
		</div>
		<div class="mar-b-35 hide" id="payInfo">
			<div class="mar-l-25 mar-t-20 mar-b-10 fc-xxxlgrey fs-12">支付</div>
			<ul class="bg-white pos-relate list-bottom br-top1 br-bottom1 order-detail-list">
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">服务费用</span>
					<span class="mar-l-15" id="costS"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1 hide"> 
					<span class="fc-xxxlgrey">档案打印费</span>
					<span class="mar-l-15" id="costP"></span>
				</li>
			</ul>
		</div>
		<div class="mar-b-35 hide" id="lawyerInfo">
			<div class="mar-l-25 mar-t-20 mar-b-10 fc-xxxlgrey fs-12">接单律师信息</div>
			<ul class="bg-white pos-relate list-bottom br-top1 br-bottom1 order-detail-list">
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">姓名</span>
					<span class="mar-l-15" id="lawyerName"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">电话</span>
					<span class="mar-l-15" id="lawyerTel"></span>
				</li>
				<li class="pad-tb-20 pad-l-25 pos-relate br-bottom1"> 
					<span class="fc-xxxlgrey">地址</span>
					<span class="mar-l-15" id="lawyerAddress"></span>
				</li>
			</ul>
		</div>
	</div>
	<script type="text/javascript" src="${contextPath}/static/js/jquery-1.12.0.min.js"></script>
	<script type="text/javascript" src="${contextPath}/static/weixin/cd/js/main.js"></script>
	<script type="text/javascript" src="${contextPath}/static/js/jstorage.js"></script>
	<script type="text/javascript" src="${contextPath}/static/weixin/cd/js/util.js"></script>
	<script type="text/javascript" src="${contextPath}/static/weixin/common/js/lory.min.js"></script>
    <script type="text/javascript" src="${contextPath}/static/weixin/common/js/viewImg.js"></script>
	
	<script type="text/javascript">
		var baseUrl = '<%=com.fadu.app.util.AppConfig.url_duowenapp_b%>';
		var openid = '<%=openid==null?"":openid%>';
		var token = '<%=token==null?"":token%>';
		$(document).ready(function() {
			postData(baseUrl + '/B/android', JSON.stringify({actionCode:'B618',orderId:'${orderId}',step:0,token:token}), orderDetailSucc, postDataDefaultErrorCallback);
			
		});
		
		function orderDetailSucc(data){
			if(data){
				if(data.success){
					var bean = data;
					$("#areaFullName").html(bean.areaFullName);
					$("#price").html(bean.price);
					$("#cdTypeName").html(getOrderTypeName(bean.orderType));
					if($("#textName"+bean.orderType))
						$("#textName"+bean.orderType).html(bean.textName).parent().removeClass('hide');
					if($("#textAddress"+bean.orderType))
						$("#textAddress"+bean.orderType).html(bean.textAddress).removeClass('hide');
					if($("#textNumber"+bean.orderType))
						$("#textNumber"+bean.orderType).html(bean.textNumber).removeClass('hide');
					$("#textOther").html(bean.textOther);
					
					if(bean){
						$("#needMaterial").html(getNeedMaterialHtml(bean.cdMaterials));
						if(bean.cdMaterials && bean.cdMaterials.length>0){
							$("#needMaterial").parent().removeClass('hide');
						}
						initViewImg($);//初始化图片弹出效果
					}
					
					//设置接单律师信息
					if(bean.lawyerName!=null && bean.lawyerName!="" && bean.orderState>2){//待查收律师才有已付款状态
						$("#lawyerInfo").removeClass('hide');
						$("#lawyerName").html(bean.lawyerName);
						$("#lawyerTel").html(bean.lawyerTel);
						$("#lawyerAddress").html(bean.lawyerAddress);
					}					
					//设置收件人信息
					if(bean.rpName!=null && bean.rpName!=""){
						$("#rpInfo").removeClass('hide');
						$("#rpTel").html(bean.rpTel);
						$("#rpName").html(bean.rpName);
						$("#rpAddress").html(bean.rpAddress);
					}					
					//设置支付信息
					if(bean.costS!=null && bean.costS!=""){
						$("#payInfo").removeClass('hide');
						$("#costS").html(bean.costS);
						if(bean.costP!=null && bean.costP!=""){
							$("#costP").html(bean.costP).removeClass('hide');
						}
					}					
					//处理图片显示
					$('.application-material-title').click(function(){
						materialClick(this);
					});
				}else{
					showMsg(data.message);
				}
			}else{
				showMsg("网络异常！");
			}
		}		
		
		function getNeedMaterialHtml(cdMaterials){
			html = "";
			for(var i=0; i<cdMaterials.length; i++){
				html += '<li class="pos-relate br-bottom1">';
				html += '	<div class="pad-r-15 pad-tb-20 ub ub-ac ub-pj touchact application-material-title">';
				html += '		<div class="clear">';
				html += '			<span class="fc-xxxlgrey">' + (i+1) + "." + cdMaterials[i].name+'</span>';
				html += '		</div>';
				html += '		<span class="icon icon-down-blue2"></span>';
				html += '	</div>';
				html += '	<div class="pos-relate br-top1 pad-tb-15 hide">';
				html += '		<div class="pad-r-15 scroll-y uploader-box">';
				html += '			<div class="uploader-pic-box">';
				html += '				<ul class="img-list" > ';
				for(var j=0; j<cdMaterials[i].attachs.length; j++){
					html += '				<li class="view-img" style="display:inline" data-image="' + cdMaterials[i].attachs[j].path +'" ><img class="uploader-pic uploader-preview" src="' + cdMaterials[i].attachs[j].pathSL + '"/></li>';
				}
				html += '				</ul>';
				html += '			</div>';
				html += '		</div>';
				html += '	</div>';
				html += '</li>';
			}			
			return html;
		}
	</script>
</body>
</html>