home_patent.jsp 10.6 KB
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%--
  Created by IntelliJ IDEA.
  User: ouyangmao
  Date: 16/7/15
  Time: 上午8:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>国内专利</title>
    <link rel="stylesheet" type="text/css" href="/css/home.css">
    <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
</head>
<body>
    <jsp:include page="include/header.jsp"/>

    <div class="home-wrap">
        <div>
            <div class="case_type">
                <p></p>
            </div>
            <div class="service_type">
                <p></p>
            </div>
            <div class="paid_type">
                <p></p>
            </div>
            <div class="reduce_type">
                <p></p>
            </div>
            <%--<div>
                <p>数量:<input type="text" style="width: 40px;height: 20px"></p>
            </div>--%>
            <div>
                <span class="expense"></span>
                <%--<button class="submit_case">提交案件</button>--%>
                <form style="display: inline" id="submit_form" method="post">
                    <input type="hidden" name="caseType" id="input_ct">
                    <input type="hidden" name="serviceType" id="input_st">
                    <input type="hidden" name="paidType" id="input_pt">
                    <input type="hidden" name="reduceType" id="input_rt">
                    <input type="hidden" name="expense" id="input_es">
                    <button class="submit_case">提交案件</button>
                </form>
            </div>
        </div>
    </div>

    <jsp:include page="include/footer.jsp"/>
</body>
</html>
<script>
    var selectTypeFlag={};
    var allData;
    /***
     *加载国内专利
     */
    function load_case_form(){
        $.ajax({
            url:"/home_patent_type_list",
            async:false,
            type:"POST",
            dataType:"JSON",
            success:function(res){
                var data = res.data;
                allData=data;
                //案件类型
                var caseItem = $(".case_type");
                if(data.caseTypeList){
                    var ulItem = $("<ul></ul>").appendTo(caseItem);
                    var ulItem2 = $("<ul></ul>").appendTo(caseItem);
                    ulItem.html("");
                    $.each(data.caseTypeList,function(i,ct){
                        var caseTypeLi = $("<li onclick=setCaseType(\'"+ct.id+"\',this)></li>").text(ct.title).attr("name",ct.name).attr("data",ct.id).appendTo(ulItem);
                        //默认选择
                        if(i==0){
                            caseTypeLi.css("background","#1287cd");
                            selectTypeFlag['caseType']=ct.name;
                        }
                        //描述信息
                        if(i==0&&ct.description!=null){
                            $("<li></li>").text(ct.description).appendTo(ulItem2);
                        }
                    });
                }

                //服务类型
                var serviceItem = $(".service_type");
                if(data.serviceTypeList){
                    var ulItem = $("<ul></ul>").appendTo(serviceItem);
                    var ulItem2 = $("<ul></ul>").appendTo(serviceItem);
                    ulItem.html("");
                    $.each(data.serviceTypeList,function(i,st){
                        var serviceTypeLi = $("<li onclick=setServiceType("+st.id+",this)></li>").text(st.title).attr("name",st.name).attr("data",st.id).appendTo(ulItem);
                        //默认选择
                        if(i==0){
                            serviceTypeLi.css("background","#1287cd");
                            selectTypeFlag['serviceType']=st.name;
                        }
                        //描述信息
                        if(i==0&&st.description!=null){
                            $("<li></li>").text(st.description).appendTo(ulItem2);
                        }
                    });
                }

                //支付类型
                var paidItem = $(".paid_type");
                if(data.serviceTypeList){
                    var ulItem = $("<ul></ul>").appendTo(paidItem);
                    var ulItem2 = $("<ul></ul>").appendTo(paidItem);
                    ulItem.html("");
                    $.each(data.paidTypeList,function(i,pt){
                        var paidTypeLi = $("<li onclick=setPayType("+pt.id+",this)></li>").text(pt.title).attr("name",pt.name).attr("data",pt.id).appendTo(ulItem);
                        //默认选择
                        if(i==0){
                            paidTypeLi.css("background","#1287cd");
                            selectTypeFlag['paidType']=pt.name;
                        }
                        //描述信息
                        if(i==0&&pt.description!=null){
                            $("<li></li>").text(pt.description).appendTo(ulItem2);
                        }
                    });
                }

                var reduceItem = $(".reduce_type");
                if(data.reduceTypeList){
                    var ulItem = $("<ul></ul>").appendTo(reduceItem);
                    var ulItem2 = $("<ul></ul>").appendTo(reduceItem);
                    ulItem.html("");
                    $.each(data.reduceTypeList,function(i,rt){
                        var reduceTypeLi = $("<li onclick=setReduceType("+rt.id+",this)></li>").text(rt.title).attr("name",rt.name).attr("data",rt.id).appendTo(ulItem);
                        if(i==0){
                            reduceTypeLi.css("background","#1287cd");
                            reduceItem.hide();
                        }
                        if(i==0&&rt.description!=null){
                            $("<li></li>").text(rt.description).appendTo(ulItem2);
                        }
                    });
                }
            },
            error:function(err){

            }
        });
    }
    load_case_form();

    /***
     *计算价格
     */
    function load_expense(caseType,serviceType,paidType,reduceType){
        $.ajax({
            url:"/caculate_price",
            type:"POST",
            dataType:"JSON",
            async:true,
            data:{
                caseType:caseType,
                serviceType:serviceType,
                paidType:paidType,
                reduceType:reduceType
            },
            success:function(res){
                $(".expense").val(res.data);
            },
            error:function(err){

            }
        });
    }

    /***
    * caseType_description
    * @param id
     */
    function setCaseType(id,that){
        var description;
        $.each(allData.caseTypeList,function(i,ct){
            if(id==ct.id){
                description = ct.description;
            }
        });
        //设置case类型
        selectTypeFlag['caseType']=$(that).attr("name");
        $(that.parentNode.childNodes).css("background","#fff")
        $(that).css("background","#1287cd");
        //设置描述
        var descLi = that.parentNode.nextSibling.firstChild;
        $(descLi).text(description);
        loadExpense();
    }
    /***
     * serviceType_description
     * @param id
     */
    function setServiceType(id,that){
        var description;
        $.each(allData.serviceTypeList,function(i,st){
            if(id==st.id){
                description = st.description;
            }
        });
        //设置service类型
        selectTypeFlag['serviceType']=$(that).attr("name");
        $(that.parentNode.childNodes).css("background","#fff")
        $(that).css("background","#1287cd");
        //设置描述
        var descLi = that.parentNode.nextSibling.firstChild;
        $(descLi).text(description);
        loadExpense();
    }

    function setPayType(id,that){
        if(id==1){
            //设置not_paid类型
            $(that.parentNode.childNodes).css("background","#fff")
            $(that).css("background","#1287cd");
            $(".reduce_type").hide();
            selectTypeFlag['reduceType']=null;
        }else{
            //设置paid类型
            $(that.parentNode.childNodes).css("background","#fff")
            $(that).css("background","#1287cd");
            $(".reduce_type").show();
            selectTypeFlag['reduceType']=$("[name=P85]").attr("name");
        }
        selectTypeFlag['paidType']=$(that).attr("name");
        loadExpense();
    }

    function setReduceType(id,that){
        $(that.parentNode.childNodes).css("background","#fff")
        $(that).css("background","#1287cd");
        selectTypeFlag['reduceType']=$(that).attr("name");
        loadExpense();
    }

    function loadExpense(){
        $.ajax({
            url:"/caculate_price",
            type:"POST",
            dataType:"JSON",
            async:true,
            data:{
                caseType:selectTypeFlag['caseType'],
                serviceType:selectTypeFlag['serviceType'],
                paidType:selectTypeFlag['paidType'],
                reduceType:selectTypeFlag['reduceType']
            },
            success:function(res){
                $(".expense").text(res.data);
                selectTypeFlag['expense']=res.data;
            },
            error:function(err){

            }
        });
    }
    //加载费用
    loadExpense();

    $(".submit_case").click(function(){
        var caseType = selectTypeFlag['caseType'];
        var serviceType = selectTypeFlag['serviceType'];
        var paidType = selectTypeFlag['paidType'];
        var reduceType = selectTypeFlag['reduceType'];
        var expense = selectTypeFlag['expense'];
        submit(caseType,serviceType,paidType,reduceType,expense);
    });

    function submit(caseType,serviceType,paidType,reduceType,expense){
        /*$.ajax({
            url:"/submit_case",
            type:"POST",
            dataType:"JSON",
            async:false,
            data:{
                caseType:caseType,
                serviceType:serviceType,
                paidType:paidType,
                reduceType:reduceType,
                expense:expense
            },
            success:function(res){
                alert(res.data);
            },
            error:function(err){
                alert(err);
            }
        });*/
        $("input#input_ct").val(caseType);
        $("input#input_st").val(serviceType);
        $("input#input_pt").val(paidType);
        $("input#input_rt").val(reduceType);
        $("input#input_es").val(expense);
        $("form#submit_form").attr("action","/submit_case");
        $("form#submit_form").submit();

    }
</script>