HSGroup
/
HSDataPortal


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368
							<%@ page import="com.lightinit.hsdataportal.dictionary.DicPlatformType" %>
<%@ page language="java" pageEncoding="UTF-8"
         contentType="text/html; charset=UTF-8"%>
<%@ page isELIgnored="false"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
    String basePath = request.getContextPath();
    String resourcePath = basePath + "/resource";
%>
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>API详情</title>
    <link rel="stylesheet" href="<%=basePath%>/resource/css/open/base.css" type="text/css">
    <jsp:include page="../common/head.jsp"></jsp:include>
</head>
<body>
<jsp:include page="../common/body_header.jsp"></jsp:include>
<div class="mid-xiangqing">
    <div class="mid0">
        <div class="mid00">
            <div class="mid01">
                <div class="mid01-left">
                    <div class="kuang">
                        <img src="${imageContextPath}${apiOpenViewModel.resourceImg}" class="icon00">
                    </div>
                    <div class="left-bottom">
                        &nbsp;<span class="bottom0">
                                        <img src="<%=resourcePath%>/images/icon_chakan.png" class="bottomimg">&nbsp;
                        <c:if test="${not empty apiOpenViewModel.viewTimes}"> (${apiOpenViewModel.viewTimes})</c:if>
                        <c:if test="${empty apiOpenViewModel.viewTimes}"> (0)</c:if>
                                    </span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        <span class="bottom0">
                                        <img src="<%=resourcePath%>/images/icon_xiazai.png" class="bottomimg"> &nbsp;(0)
                                    </span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        <span class="bottom0">
                                        <img src="<%=resourcePath%>/images/icon_wenben.png" class="bottomimg"> &nbsp;
                                         <c:if test="${empty apiOpenViewModel.followTotalCount}">(0)</c:if>
                                        <c:if test="${not empty apiOpenViewModel.followTotalCount}">(${apiOpenViewModel.followTotalCount})</c:if>
                                    </span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    </div>
                </div>
                <div class="mid01-right">
                    <div>
                        <span class="mingchen">${apiOpenViewModel.resourceName}</span>
                            <c:if test="${not empty apiOpenViewModel.serviceTag}">
                                <span class="biaoqian">${apiOpenViewModel.serviceTag}</span>
                            </c:if>
                    </div>
                    <div class="clearfix"></div>
                    <div class="jianjie">${apiOpenViewModel.resourceSummary}</div>
                    <div class="jiage0">
                        <div>
                            <span class="jiage1">价格：</span>
                            <c:if test="${apiOpenViewModel.publishSetting.chargeMethod eq mianfei}">
                                <span class="jiage3">免费</span>
                            </c:if>
                            <c:if test="${!apiOpenViewModel.publishSetting.chargeMethod eq mianfei}">
                                <span class="jiage2">￥</span>
                                <span class="jiage3">${apiOpenViewModel.publishSetting.packagePrice}/${apiOpenViewModel.publishSetting.packageMonths}月</span>
                            </c:if>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="clearfix"></div>
                    <div class="xinxi04">
                        <div class="xinxi00">
                            <div>
                                <span class="xinxi1">面向对象：</span>
                                <span class="xinxi2">${apiOpenViewModel.fourResourceCatelogModel.catelogCustomName}</span>
                            </div>
                            <div class="xinxi01">
                                <span class="xinxi1">发布机构：</span>
                                <span class="xinxi2">${apiOpenViewModel.fourResourceCatelogModel.catelogSectorName}</span>
                            </div>
                        </div>
                        <div class="xinxi02">
                            <div>
                                <span class="xinxi1">分类：</span>
                                <span class="xinxi002">${apiOpenViewModel.fourResourceCatelogModel.catelogThemeName}
                                </span>
                            </div>
                            <div class="xinxi01">
                                <span class="xinxi1">发布日期：</span>
                                <span class="xinxi2"><fmt:formatDate value="${apiOpenViewModel.auditedAt}" pattern="yyyy-MM-dd"/> </span>
                            </div>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    <div class="button0">
                        <button id="fnApplyInfoButton" class="button1" onclick="fnApplyInfo()">立即申请</button>
                        ${isFollow ==0 ? '<button class="button2" onclick="follow()" id="followId">关注</button>':'<button class="button2" onclick="follow()" id="delfollowId" >取消关注</button>'}
                    </div>
                </div>
            </div>
            <div class="clearfix"></div>
            <div class="mid02"><!----套餐介绍---->
                <div class="xuanxiang">
                    <span class="jieshao" id="diaoyong" onclick="apiInvoking()">API调用</span>
                    <span id="return" class="shili" onclick="apiReturn()">返回码</span>
                    <span class="shili" id="taocan" onclick="introduce()">套餐介绍</span>
                    <span class="kongbai"></span>
                </div>
                <div class="taocan">
                    <div id="diaoyongView" class="taocanfont">
                        <div class="js01">${apiOpenViewModel.resourceName}</div>
                        <c:if test="${not empty apiOpenViewModel.interfaceViewModels}">
                        <c:forEach items="${apiOpenViewModel.interfaceViewModels}" var="interfaceView">
                            <div class="js00">
                                <span class="jk">接口地址:</span>
                                <span class="jk0">${interfaceView.url}</span>
                            </div>
                            <div class="js00">
                                <span class="jk">支持格式:</span>
                                <span class="jk0">${interfaceView.responseFormat}</span>
                            </div>
                            <div class="js00">
                                <span class="jk">请求方式:</span>
                                <span class="jk0">${interfaceView.requestMethod}</span>
                            </div>
                            <div class="js00">
                                <span class="jk">参数和示例:</span>
                            </div>
                            <div class="js00">
                                <span class="jk">POST请求示例：@url@</span>
                            </div>
                            <div class="sl00">
                                    ${interfaceView.requestDemo}
                            </div>
                            <div class="qingqiucanshu">
                                <span class="jk">请求参数:</span>
                                <div class="canshu">
                                    <table>
                                        <tr class="cs01">
                                            <td>名称</td>
                                            <td>必填</td>
                                            <td>数据类型</td>
                                            <td>说明</td>
                                        </tr>
                                        <c:if test="${not empty interfaceView.interfaceInputs}">
                                            <c:forEach items="${interfaceView.interfaceInputs}" var="interfaceInput">
                                                <tr>
                                                    <td>${interfaceInput.paramName}</td>
                                                    <td>
                                                        <c:if test="${interfaceInput.isRequired==0}">必填</c:if>
                                                        <c:if test="${interfaceInput.isRequired!=0}">非必填</c:if>
                                                    </td>
                                                    <td>${interfaceInput.dataType}</td>
                                                    <td>${interfaceInput.description}</td>
                                                </tr>
                                            </c:forEach>
                                        </c:if>
                                    </table>
                                </div>
                            </div>
                            <div class="qingqiucanshu">
                                <span class="jk">返回参数:</span>
                                <div class="canshu">
                                    <div>
                                        <table>
                                            <tr class="cs01">
                                                <td>名称</td>
                                                <td>数据类型</td>
                                                <td>说明</td>
                                            </tr>
                                            <c:if test="${not empty interfaceView.interfaceOutputs}">
                                                <c:forEach items="${interfaceView.interfaceOutputs}" var="interfaceOutput">
                                                    <tr>
                                                        <td>${interfaceOutput.paramName}</td>
                                                        <td>${interfaceOutput.dataType}</td>
                                                        <td>${interfaceOutput.description}</td>
                                                    </tr>
                                                </c:forEach>
                                            </c:if>
                                        </table>
                                    </div>
                                </div>
                            </div>
                            <div class="js02">
                                <span class="jk">返回参数:</span>
                            </div>
                            <div class="sl00">
                                    ${interfaceView.responseDemo}
                            </div>
                        </c:forEach>
                        </c:if>
                    </div>
                    <div id="returnView" class="taocanfont">
                        <div>
                            <span>服务返回码</span>
                        </div>
                        <div>
                            <span>${apiOpenViewModel.returnCode}</span>
                        </div>
                    </div>
                    <div id="taocanView" class="taocanfont">
                        常规套餐包
                        <span class="taocanfont1">【更多次数、更多优惠请线下洽谈】</span>
                        <table >
                            <tr class="taocan1">
                                <td>名称</td>
                                <td>价格</td>
                                <td>次数/月数</td>
                                <td>说明</td>
                            </tr>
                            <c:if test="${not empty apiOpenViewModel.publishSetting}">
                                <tr>
                                    <td>${apiOpenViewModel.publishSetting.packageName}</td>
                                    <td>${apiOpenViewModel.publishSetting.packagePrice}元/${apiOpenViewModel.publishSetting.packageMonths}月</td>
                                    <td>${apiOpenViewModel.publishSetting.useTimesLimit}次/月</td>
                                    <td>${apiOpenViewModel.publishSetting.description}</td>
                                </tr>
                            </c:if>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="clearfix"></div>
<jsp:include page="../common/body_footer.jsp"></jsp:include>
<input type="hidden" id="publishSettingId" name="publishSettingId" value="${apiOpenViewModel.publishSetting.id}">
<%--////////////////////////////////////////申请信息 ///////////////////////////////////////////////////////--%>
<div id="divApply" class="fade" style="display: none;">
    <div class="window">
        <div class="top00">
            <span class="p">申请信息</span>
            <img src="<%=resourcePath%>/images/icon_guanbi.png" alt="" class="guanbi" onclick="closeDivApply()">
        </div>
        <div class="form6">
            <form>
                <div class="application-font0">
                    <span class="application-font1">共享类型：</span>
                    <span class="application-font2">${apiOpenViewModel.shareType}</span>
                </div>
                <div class="application-font">
                    <span class="application-font1">资源名称：</span>
                    <span class="application-font2">${apiOpenViewModel.resourceName}</span>
                </div>

                <%--/////////////////////////////判断加入申请理由对话框//////////////////--%>
                <c:if test="${apiOpenViewModel.shareType eq '有条件共享'}">
                    <div  class="application-font">
                        <span class="application-font1">申请理由：</span>
                        <input type="text" class="application-font2" id="applyReason" name="applyReason" >
                    </div>
                </c:if>
                <%--/////////////////////////////////////////////////////////--%>
                <div class="jiage-xinxi" style="visibility: hidden;">
                    已选择<span class="shuzi">1</span>个套餐，应付：¥<span class="shuzi">${outputModel.packagePrice}</span>元
                </div>
                <div class="clearfix"></div>
                <div>
                    <div class="xieyi0">
                        <span><input type="checkbox" class="box0" id="isAgree" checked value="我已阅读并接受"></span>
                        <span class="fuwu00">阅读并接受<a class="xieyi" target="_blank" href="<%=basePath%>/share/static/agreement_service">《平台服务协议》</a></span>
                    </div>
                    <div class="jiarugwc" style="visibility: hidden;">加入购物车</div>
                    <div class="shenqing" onclick="fnApply()">立即申请</div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">

    //关注
    function follow() {
        if (!checkAuthentication()){
            return;
        }
        var settingId = $("#publishSettingId").val() ;
        $.post(
            '<%=basePath%>/share/api/follow.action',
            {settingId:settingId},
            function(datas){
                if(datas.stateCode==200){
                    if (datas.msg=='关注成功'){
                        alert('关注成功') ;
                        $('#fnApplyInfoButton ~ button:eq(0)').remove();
                        $('#fnApplyInfoButton').after('<button class="button2" onclick="follow()" id="delfollowId" >取消关注</button>');
                    }else{
                        alert('已取消关注') ;
                        $('#fnApplyInfoButton ~ button:eq(0)').remove();
                        $('#fnApplyInfoButton').after('<button class="button2" onclick="follow()" id="followId">关注</button>');
                    }
                }else {
                    alert(datas.msg);
                }
            },
            'json')
    }
    //打开申请页面
    function fnApplyInfo(){
        if (!checkAuthentication()){
            return;
        }
        var id=$('#publishSettingId').val();
        var applyReason=$('#applyReason').val();
        $.post("<%=basePath%>/share/api/isApply.action/"+id,{applyReason:applyReason},function(result){
            if (result){
                $('#divApply').show();
            }else {
                alert('不能再次申请') ;
            }
        }) ;

    }
    //关闭申请页面
    function closeDivApply(){
        $('#divApply').hide();
    }
    //申请
    function fnApply(){
        if (!checkAuthentication()){
            return;
        }
        if($('#isAgree').is(':checked')) {
            var id = $('#publishSettingId').val();
            var applyReason = $('#applyReason').val();
            $.post("<%=basePath%>/share/api/apply.action/" + id, {applyReason: applyReason}, function (result) {
                if (result.stateCode == 200) {
                    alert("申请成功");
                    window.location.href = "<%=basePath%>/share/myApi/list.htm";
                } else {
                    alert(result.msg);
                }
            });
        }else {
            alert('您还未接受协议！') ;
        }
    }
    /*///////////////////////////tab标签页切换//////////////////////////////////*/
    apiInvoking();

    function apiInvoking() {
        $("#diaoyong").attr("class", "jieshao");
        $("#return").attr("class", "shili");
        $("#taocan").attr("class", "shili");
        $("#diaoyongView").show();
        $("#returnView").hide();
        $("#taocanView").hide();

    }

    function apiReturn() {
        $("#diaoyong").attr("class", "shili");
        $("#return").attr("class", "jieshao");
        $("#taocan").attr("class", "shili");
        $("#diaoyongView").hide();
        $("#returnView").show();
        $("#taocanView").hide();
    }

    function introduce() {
        $("#diaoyong").attr("class", "shili");
        $("#return").attr("class", "shili");
        $("#taocan").attr("class", "jieshao");
        $("#diaoyongView").hide();
        $("#returnView").hide();
        $("#taocanView").show();
    }
</script>
</html>