<%@ page language="java" errorPage="/error.jsp" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
<title>服务内容信息</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- bootstrap 3.0.2 -->
<link href="<c:url value='/styles/lib/bootstrap.min.css'/>" rel="stylesheet" type="text/css" />
<link href="<c:url value='/styles/lib/font-awesome.min.css'/>" rel="stylesheet" type="text/css" />
<link href='<c:url value='/styles/lib/ionicons.min.css' />' rel="stylesheet" type="text/css" />
<link href="<c:url value='/styles/lib/datatables/dataTables.bootstrap.css' />" rel="stylesheet" type="text/css" />
<link href="<c:url value='/styles/AdminLTE.css'/>" rel="stylesheet" type="text/css" />
<script src="${ctx }/scripts/lib/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="<c:url value='/plugin/layer/layer.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/bootstrap.min.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/visitor/exif.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/mobileBUGFix.mini.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/admin/service/serviceTypeInfo.js?vr=1.0'/>"></script>
 <style type="text/css">
.uploadimg {width: 400px; height: auto;}
.uploadbtns {width: 100%; height: 30px;}
 .uploadimgbtn {position: relative; float: left; width: 80px; height: 30px; background-color: #0eb83a; border-radius: 5px; cursor: pointer;}
.uploadimgbtn span {display: block; width: 100%; height: 30px; text-align: center; line-height: 30px; color: #fff; font-size: 14px; cursor: pointer;}
.uploadimgbtn input {position: absolute; top: 0; left:0; width: 100%; height: 30px; opacity: 0; cursor: pointer;}
.uploadbtns .uploadimgcancel {float: left; width: 80px; height: 28px; border: 1px solid #333; text-align: center; line-height: 28px; text-decoration: none; color: #333; border-radius: 5px; margin-left: 10px;}
.showimg ,.showimgApp,.showimgWechat{width: 68px; height: auto; padding: 4px; overflow: hidden; max-height: 100px; margin-top: 10px; background-color: #fff;}
.showimg img ,.showimgApp img,.showimgWechat img{width: 60px;}
</style>
<body>
	<input type="hidden" id="funcid" value="${funcid}">
	<input type="hidden" value="${ctx}" id="contextPath">
	<input type="hidden" id="id">
	<input type="hidden" id="actype">
	<input type="hidden" id="visitPrefix" value="${visitPrefix }">
	<input type="hidden" id="serviceStatus" value="${serviceStatus }"/>
	<input type="hidden" id="organizationId" value=""/>
	<section class="content">
		<div class="row">
			<div class="col-xs-12">
				<div class="boxlist">
					<!-- /.box-header -->
					<div class="box-body table-responsive">
						<form:form id="conditionform" action="${ctx}/service/type/serviceTypeInfoPage?funcid=${funcid}" method="POST">
							<input type="hidden" id="pageNo" name="pageNo" />
							<div class="form-group">
								<label>服务名称</label><input type="text" name="paramValue" value="${paramValue}" placeholder="服务名称(支持模糊查询)" style="width: 200px;"/>
								
								<label>服务类型</label>
								<select name="serviceType"  style="width: 403px;">
            								<c:forEach items="${serviceGroupType }" var="model">
            									<c:choose>
            									<c:when test="${model.itemcode==serviceType }">
            										<option value="${model.itemcode }" selected="selected">${model.itemname }</option>
            									</c:when>
            									<c:otherwise>
            										<option value="${model.itemcode }">${model.itemname }</option>
            									</c:otherwise>
            									</c:choose>
            								</c:forEach>
								</select>
							</div>
							
						</form:form>
						<div class="form-search-wp"> 
								<button class="btn btn-red" href="javascript:void(0);" id="btn-search" onclick="searchServiceTypeInfo()">查询</button>
								<perm:hasPermission permCode="pc:setting:service:add">
									<button class="btn btn-white" href="javascript:void(0);"   id="add-btn">新增</button>
								</perm:hasPermission>
								<perm:hasPermission permCode="pc:setting:service:edit">
									<button class="btn btn-white" onclick="manageServiceInfo('1');" >服务上架</button>
									<button class="btn btn-red" onclick="manageServiceInfo('0');" >服务下架</button>
								</perm:hasPermission>
							</div>
						<table id="example2" class="table table-bordered table-hover">
							<thead>
								<tr>
									<th></th>
									<th>服务名称</th>
									<th>服务分类</th>
									<th>服务类型</th>
									<th>服务图标</th>
									<th>结算方式</th>
									<th>是否押金</th>
									<th>地址类型</th>
									<th>是否注册</th>
									<th>是否签约</th>
									<th>创建时间</th>
									<th>创建人</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
							<c:forEach items="${page.items }" var="obj" varStatus="status">
								<tr>
									<%-- 
										<td width="5%">${ (page.currentPage-1)*page.pageSize+(status.index+1)}</td>
									 --%>
									<td width="5%"><input type="radio" value="${obj.id}" name="typeGroupId" id="0"/></td>
									<td>${obj.serviceName}</td>
									<td>
										<c:forEach items="${serviceGroupType }" var="model">
											<c:if test="${model.itemcode==obj.serviceType }">
												${model.itemname }
											</c:if>
										</c:forEach>
									</td>
									<td>
										<c:forEach items="${serviceCategory }" var="model">
											<c:if test="${model.itemcode==obj.serviceCategory }">
												${model.itemname }
											</c:if>
										</c:forEach>
									</td>
									<td><img class="showimg" alt="" src="${visitPrefix }${obj.serviceIcon}" ></td>
									<td>
										${obj.paymentName }
									</td>
									<td>
										<c:forEach items="${DepositTypeGroup }" var="model">
											<c:if test="${model.itemcode==obj.depositType }">
												${model.itemname }
											</c:if>
										</c:forEach>
									</td>
									<td>
										<c:forEach items="${jumpGroupType }" var="model">
											<c:if test="${model.itemcode==obj.linkUrlType }">
												${model.itemname }
											</c:if>
										</c:forEach>
									</td>
									<td>
										<c:forEach items="${registerStatusGroupType }" var="model">
											<c:if test="${model.itemcode==obj.registerStatus }">
												${model.itemname }
											</c:if>
										</c:forEach>
									</td>
									<td>
										<c:forEach items="${isSignContractGroupType }" var="model">
											<c:if test="${model.itemcode==obj.isSignContract }">
												${model.itemname }
											</c:if>
										</c:forEach>
									</td>
									<td><fmt:formatDate value="${obj.createTime}" pattern="yyyy-MM-dd  HH:mm:ss" /></td>
									<td>${obj.creator}</td>	
									<td>
										<a href="javascript:void(0);" class="btn btn-info" title="详情" onclick="showServiceTypeInfoDetails('${obj.id}')">
                                    			<span>详情</span>
                                    	</a>
										<perm:hasPermission permCode="pc:setting:service:edit">
											<a href="javascript:void(0);" onclick="showEidtServiceTypeInfo(${obj.id})" class="btn btn-back" title="修改">
												<span>修改</span>
                                    		</a>
										</perm:hasPermission>
										<perm:hasPermission permCode="pc:setting:service:delete">
                                    		<a href="javascript:void(0);" class="btn btn-danger" title="删除" onclick="delServiceTypeInfo('${obj.id}','${obj.serviceName}')">
                                    			<span>删除</span>
                                    		</a>
										</perm:hasPermission>
										<perm:hasPermission permCode="pc:setting:service:edit">
											<c:if test="${obj.depositType=='1'}">
												<a href="javascript:void(0);" onclick="showDepositItemInformationForm(${obj.id})" class="btn btn-back" title="修改">
													<span>押金细项操作</span>
												</a>
											</c:if>
										</perm:hasPermission>
                                   	</td>
								</tr>
							</c:forEach>
							</tbody>
						</table>
						<div class="btn-page">
		                    <!-- 页码 -->
		                    <div align="center" class="pages clearfix">
		                           <c:forEach items="${page.iterPages }" var="pageNo">
									<c:choose>
										<c:when test="${pageNo == page.currentPage }">
											<span class='current'>${pageNo }</span>
										</c:when>
										<c:when test="${pageNo != null}">
											<a href="javascript:void(0);" onclick='goPage(${pageNo});'>${pageNo}</a>
										</c:when>
										<c:otherwise>
											<em>...</em>
										</c:otherwise>
									</c:choose>
								</c:forEach>
								<strong>共<span style="color:black;font-weight:bold;font-size:16px;">${page.totalCount}</span>条</strong>
								<strong>跳转到第</strong><input type="text" id="gopage" style="width: 40px;" onkeyup="this.value=this.value.replace(/\D/g,'')" onkeypress="this.value=this.value.replace(/\D/g,'')"/><strong>页</strong>
								<a class="btn-sm  btn-red" href="javascript:goPage('gopage');" id='bindBtn'>确定</a>
		                	</div>
			            </div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<div class="modal fade" id="saveUpdateModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h4 class="modal-title" id="myModalLabel">
							
						</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal" role="form">
							<fieldset>
								<legend>服务内容信息</legend>
								<div class="form-group" style="background-color:white;">
									<label class="col-sm-3 control-label" for="serviceName" style="padding-top:0px;padding-left: 1px;"><span style="color: red;">*</span>服务名称：</label>
									 <div class="col-sm-3">
                             			<input class="form-control" id="serviceName" name="serviceName" type="text" placeholder="请输入服务名称"/>
                         			 </div>
                         			 <label class="col-sm-3 control-label" for="code" style="padding-top:0px;padding-left: 1px;"><span style="color: red;">*</span>服务编码：</label>
									 <div class="col-sm-3">
                             			<input class="form-control" id="code"  name="code" type="text" placeholder="请输入服务编码"/>
                         			 </div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=paymentType style="padding-top:0px;"><span style="color: red;">*</span>结算方式：</label>
									<div class="col-sm-3" style="padding-left: 20px;">
                             			<div class="switch switch-small">
										<c:forEach items="${paymentTypeGroup }" var="model">
											<input name="paymentTypeGroup" id="paymentType${model.itemcode }" type="checkbox" value="${model.itemcode }" />${model.itemname }
										</c:forEach>
										</div>
                         			 </div>
                         			 <label class="col-sm-3 control-label" for=paymentType style="padding-top:0px;"><span style="color: red;">*</span>是否押金：</label>
									<div class="col-sm-3" style="padding-left: 20px;">
                             			<select name="depositType"  id="depositType" class="form-control" style="width: 116px;">
            								<option value="">是否押金</option>
            								<c:forEach items="${DepositTypeGroup }" var="model">
												<option value="${model.itemcode }">${model.itemname }</option>
											</c:forEach>
										</select>
                         			 </div>
								</div>
								
							   <div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for="serviceRemark" style="padding-top:0px;"><span style="color: red;">*</span>服务描述：</label>
									<div class="col-sm-9">
                             			<input class="form-control" id="serviceRemark" name="serviceRemark" type="text" placeholder="请输入服务描述"/>
                         			 </div>
								</div>
								
								
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for="skipAddress" style="padding-top:0px;"><span style="color: red;">*</span>未认证地址：</label>
									<div class="col-sm-9">
                             			<input class="form-control" id="skipAddress" name="skipAddress" type="text" placeholder="请输入未认证服务跳转地址"/>
                         			 </div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for="jumpAddress" style="padding-top:0px;"><span style="color: red;">*</span>已认证地址：</label>
									<div class="col-sm-9">
                             			<input class="form-control" id="jumpAddress" name="jumpAddress" type="text" placeholder="请输入已认证服务跳转地址"/>
                         			 </div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=registerStatus style="padding-top:0px;"><span style="color: red;">*</span>是否注册：</label>
									<div class="col-sm-9" style="padding-left: 20px;">
                             			<select name="registerStatus"  id="registerStatus" class="form-control" style="width: 403px;">
            								<option value="">请选择是否注册</option>
            								<c:forEach items="${registerStatusGroupType }" var="model">
												<option value="${model.itemcode }">${model.itemname }</option>
											</c:forEach>
										</select>
                         			 </div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=linkUrlType style="padding-top:0px;"><span style="color: red;">*</span>跳转类型：</label>
									<div class="col-sm-9" style="padding-left: 20px;">
                             			<select name="linkUrlType"  id="linkUrlType" class="form-control" style="width: 403px;">
            								<option value="">请选择跳转类型</option>
            								<c:forEach items="${jumpGroupType }" var="model">
            									<option value="${model.itemcode }">${model.itemname }</option>
            								</c:forEach>
										</select>
                         			 </div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=serviceType style="padding-top:0px;"><span style="color: red;">*</span>服务类型：</label>
									<div class="col-sm-9" style="padding-left: 20px;">
                             			<select name="serviceTypes"  id="serviceType" class="form-control" style="width: 403px;">
            								<option value="">请选择服务类型</option>
            								<c:forEach items="${serviceGroupType }" var="model">
            									<option value="${model.itemcode }">${model.itemname }</option>
            								</c:forEach>
										</select>
                         			 </div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=isSignContract style="padding-top:0px;"><span style="color: red;">*</span>是否签约：</label>
									<div class="col-sm-9" style="padding-left: 20px;">
                             			<select name="isSignContract"  id="isSignContract" class="form-control" style="width: 403px;">
            								<option value="">是否签约</option>
            								<c:forEach items="${isSignContractGroupType }" var="model">
            									<option value="${model.itemcode }">${model.itemname }</option>
            								</c:forEach>
										</select>
                         			 </div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=serviceIcon style="padding-top:0px;"><span style="color: red;">*</span>服务图标：</label>
									<div class="col-sm-9">
										<div class="uploadimg">
											<div class="uploadbtns">
                								<label class="uploadimgbtn">
                								<input type="hidden" id="serviceIcon" name="serviceIcon"/>
			                   					 <input type="file" onchange="selectFileImage(this,1)" id="fileInput"/>
			                   					 <span>上传图片</span>
               				 						</label>
                									<a href="javascript:void(0);" class="uploadimgcancel">删除</a>
           				 					</div>
											<div class="showimg" style="padding-left: 2px;">
					                			<img src="${ctx }/images/common/inputImg.png" alt="" />
					            			</div>
										</div>
									</div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=serviceIcon style="padding-top:0px;">灰度APP图标：</label>
									<div class="col-sm-9">
										<div class="uploadimg">
											<div class="uploadbtns">
												<label class="uploadimgbtn">
													<input type="hidden" id="grayAppServiceIcon" name="grayAppServiceIcon"/>
													<input type="file" onchange="selectFileImage(this,2)" id="grayAppFileInput"/>
													<span>上传图片</span>
												</label>
												<a href="javascript:void(0);" class="uploadimgcancel" data-type="2">删除</a>
											</div>
											<div class="showimgApp" style="padding-left: 2px;">
												<img src="${ctx }/images/common/inputImg.png" alt="" />
											</div>
										</div>
									</div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=serviceIcon style="padding-top:0px;">灰度微信端图标：</label>
									<div class="col-sm-9">
										<div class="uploadimg">
											<div class="uploadbtns">
												<label class="uploadimgbtn">
													<input type="hidden" id="grayWechatServiceIcon" name="grayWechatServiceIcon"/>
													<input type="file" onchange="selectFileImage(this,3)" id="grayWechatFileInput"/>
													<span>上传图片</span>
												</label>
												<a href="javascript:void(0);" class="uploadimgcancel" data-type="3">删除</a>
											</div>
											<div class="showimgWechat" style="padding-left: 2px;">
												<img src="${ctx }/images/common/inputImg.png" alt="" />
											</div>
										</div>
									</div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for=serviceType style="padding-top:0px;"><span style="color: red;">*</span>服务分类：</label>
									<div class="col-sm-9" style="padding-left: 20px;">
										<select name="serviceCategory"  id="serviceCategory" class="form-control" style="width: 403px;">
											<option value="">请选择</option>
											<c:forEach items="${serviceCategory }" var="model">
												<option value="${model.itemcode }">${model.itemname }</option>
											</c:forEach>
										</select>
									</div>
								</div>
								<div class="form-group" style="background-color:white;padding-top: 10px;">
									<label class="col-sm-3 control-label" for="serviceRemark" style="padding-top:0px;">灰度跳转链接：</label>
									<div class="col-sm-9">
										<input class="form-control" id="grayUrl" name="grayUrl" type="text" placeholder="请输入链接地址"/>
									</div>
								</div>
							</fieldset>
						</form>
			        </div>
					<div class="modal-footer">
						<a href="javascript:void(0);" title="关闭" data-dismiss="modal" class="btn btn-info" style="float: right;"><span>关闭</span></a>
						<a href="javascript:void(0);" title="提交修改" class="btn btn-success" style="float: right;margin-right: 10px;" id="save" onclick="saveUpdateServiceTypeInfo()"><span>提交修改</span></a>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal -->
	</div>
	<div class="modal fade" id="saveUpdateDepositItem" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h4 class="modal-title" id="myDepositItem">
							
						</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal" role="form" id="depositItemForm">
							<input type="hidden" value="" id="serviceTypeInfoId"/>
							<fieldset>
								
								<div id="servicePz">
								
								</div>
							</fieldset>
						</form>
			        </div>
					<div class="modal-footer">
						<a href="javascript:void(0);" title="关闭" data-dismiss="modal" class="btn btn-info" style="float: right;"><span>关闭</span></a>
						<a href="javascript:void(0);" title="提交修改" class="btn btn-success" style="float: right;margin-right: 10px;" id="save" onclick="SaveUpdateDepositItem()"><span>提交修改</span></a>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal -->
	</div>
</body>
