inAndOutput.jsp 14.8 KB

Raw Blame History Permalink

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>
<html>
<head>
    <title>导入导出数据</title>
    <script type="text/javascript" src="/formmode/js/jquery/jquery-1.8.3.min_wev8.js"></script>
    <script type="text/javascript" src="/formmode/js/jquery/hoverIntent/jquery.hoverIntent.minified_wev8.js"></script>
    <script type="text/javascript" src="/formmode/js/jquery/zTree3.5.15/js/jquery.ztree.all-3.5.min_wev8.js"></script>
    <script type="text/javascript" src="/formmode/js/jquery/nicescroll/jquery.nicescroll.min_wev8.js"></script>
    <script type="text/javascript" src="/formmode/js/FormmodeUtil_wev8.js"></script>
    <script type="text/javascript" src="/wui/theme/ecology8/jquery/js/zDialog_wev8.js"></script>
    <script type="text/javascript" src="/wui/theme/ecology8/jquery/js/zDrag_wev8.js"></script>
    <script type="text/javascript" src="/formmode/js/jquery/contextMenu/jquery.contextMenu_wev8.js"></script>
    <script src="/formmode/js/jquery/form/jquery.form_wev8.js"></script>
    <link type="text/css" rel="stylesheet" href="/wui/theme/ecology8/jquery/js/zDialog_e8_wev8.css"/>
    <link type="text/css" rel="stylesheet" href="/formmode/js/jquery/zTree3.5.15/css/zTreeStyle/zTreeStyle_wev8.css">
    <link rel="stylesheet" type="text/css" href="/formmode/js/jquery/contextMenu/jquery.contextMenu_wev8.css"/>
    <link type="text/css" rel="stylesheet" href="/cloudstore/resource/pc/com/v1/index.min.css" type="text/css">
    <!--页面样式-->
    <style>

        /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
        ::-webkit-scrollbar
        {
            width:4px;
            height:4px;
        }
        /*定义滚动条*/
        ::-webkit-scrollbar-track{
            background: #f6f6f6;
            border-radius:2px;
        }
        /*定义滑块 内阴影+圆角*/
        ::-webkit-scrollbar-thumb
        {
            background: #aaa;
            border-radius:2px;
        }
        ::-webkit-scrollbar-thumb:hover{
            background: #747474;
        }
        ::-webkit-scrollbar-corner{
            background: #f6f6f6;
        }

        h2{
            margin: 0;
        }

        .get p,.detail p{
            font-family: "microsoft yahei" !important;
        }

        .filetype-list li {
            cursor:pointer;
        }
        .filetype-list ul {
            height: 300px;
            line-height: 32px;
            font-size: 14px;
            overflow: auto;
            float: left;
            padding: 0 8px;
            margin: 0 0 0 -1px;
            box-sizing: border-box;
            background: #f2f2f2;
        }
        .filetype-list ul:nth-child(1){
            border: 1px solid #80b4ff;
            width: 130px;
            margin-left: 0;
        }
        .filetype-list ul:nth-child(2){
            border: 1px solid #80b4ff;
            width: 300px;
        }
        .filetype-list ul:nth-child(3){
            border: 1px solid #80b4ff;
            width: 100px;
        }
        .inputBox{
            position: relative;
            width: 400px;
            height: 50px;
            border: 1px solid #3385ff;
            color: #a0a0a0;
            font-size: 20px;
            border-radius: 4px;
            margin-top: 30px;
            box-shadow: 0 6px 10px #aaa;
        }
        .inputBox input{
            position: absolute;
            width: 100%;
            height: 100%;
            cursor: pointer;
            opacity: 0;
        }
        .inputtxt{
            position: absolute;
            padding: 0 16px;
            width: 100%;
            height: 100%;
            cursor: pointer;
            line-height: 48px;
            overflow: hidden;
            background-color: #fff;
            border-radius: 5px;
            font-size: 20px !important;
            font-family: "microsoft yahei" !important;
        }
        .modal-div. hideimg{
            left:-100%;
        }
        .checkBtn{
            width: 100%;
            height: 100%;
            background-color: #3385ff;
            line-height: 48px;
            text-align: center;
            color: #fff;
            cursor: pointer;
            opacity: 1;
            font-size: 20px !important;
            font-family: "microsoft yahei" !important;
        }
        .checkBtn:hover{
            box-shadow: 0px 5px 10px #ccc;
        }

        .am-panel-group .am-panel-hd+.am-panel-collapse .am-panel-bd{
            border: none;
        }
        .result-info-p p{
            margin: 0;
            font-size: 12px;
        }
        .result-info-p p:nth-child(2),.result-info-p p:nth-child(4){
            font-size: 14px;
            font-family: "microsoft yahei";
            color:#3385ff;
        }

        table,tbody,th,td{
            border: none!important
        }
        #do-not-say-2 font p{
            font-size: 14px;
            font-family: "microsoft yahei";
            color:#3385ff;
        }


        html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike,
        strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption,
        footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
            margin: 0;
            padding: 0;
            border: 0;
            box-sizing: border-box;
        }

        html, body{
            height:100%;
            width:100%;
            margin: 0 ;
            padding:0;
            overflow-x:  hidden;
        }
        ul,li,h4{list-style: none;margin: 0;padding: 0}
        .wrap>ul{border-radius: 5px }
        .wrap>ul>li{background: #3385ff;text-align: center;border-bottom: solid 1px #DED1D1;color:#fff;cursor: pointer;position: relative;}
        .wrap>ul>li:last-child{border-bottom: none;}
        .wrap>ul>li h4{padding:8px 0;}
        .wrap>ul li span.icon{position: absolute;top: 5px;right: 12px;font-size: 22px;color: #fff;display: inline-block;}
        .wrap>ul>li .child-ul{background: #fff;display: none; }
        .wrap>ul>li .child-ul li{color: #000;line-height: 40px;}
        .wrap>ul>li .child-ul li .result-li{padding-left: 10px;}
        .wrap>ul>li .child-ul li .result-li:hover{
            background: #f1f1f1;
        }
        .child-ul>li{
            text-align:left;
        }
        #pzBtn{
            border-radius: 5px;
        }

        .result-info-p p{
            color:#3385ff;
        }
        .result-info-p p span{
            color:#3385ff !important;
        }


        *{
            margin: 0px;
            padding: 0px;
        }
        body{
            width: 100%;
            height: 100%;
        }
        .content{
            width:100%;
            height: 100%;
            background-color: #0baee9;
            overflow: hidden;
            display: flex;
            text-align: center;
        }
        .modal-div{
            margin:200px auto;
            background-color: #ffffff;
            width: 660px;
            height: 480px;
            border: 1px solid black;
            border-radius: 5px;
            box-shadow: 10px 10px 5px #0a6332 ;
        }

        .tab span{
            display: inline-block;
            height: 80%;
            width:20%;
            margin: auto 30px;
        }


        .pageTitle div{
            display: inline-block;
            margin:auto 15px;
            height: 30px;
            line-height: 30px;
        }

        .pageTitle img{
            display: block;
            height: 100%;
            width: 100%;
        }


        .pageTitle p,.rightContent p{
            font-size: 12px;
        }

        .tabMenu li{
            display: inline-block;
            height: 100%;
            margin-left: 30px;
        }
        .tabMenu li:hover{
            cursor: pointer;
        }

        /*2.2.1 tab1:合同审核操作页面*/
        .contactList li{
            display: block;
            margin-top: 10px;
            font-size:18px;
        }
        .contactList ul li:first-child{
            color: #2cb5e2;
        }

        .check-summary li{
            display: inline-block;
            width: 20%;
        }
        .check-summary li span{
            font-size: 30px;
            display: inline;
        }
        .check-summary li:nth-child(even) span{
            color: #0A0000;
        }
        .check-summary li:nth-child(odd) span{
            color: #ff0000;
        }

        .child-ul div span{
            margin-right:24px;
        }


        .downloadBtn:hover{
            cursor:pointer;
            box-shadow: 0px 5px 10px #ccc;
        }

        .clearCheckBtn:hover{
            box-shadow: none;
        }

    </style>
</head>
<body>
<div class="content">
    <div class="modal-div ">
            <h1 style="margin-top: 20px;">知识树数据导入</h1>
        <%--<div class="downloadFile"  style="margin-top: 60px;margin-left:30px;">--%>
                <%--<input type="file" placeholder="选择下载的文件存储位置" class="background-color:#fff;border:1px solid #eee;outline:none;" id="downloaddfile" name="downfile" webkitdirectory multiple>--%>
        <%--</div>--%>
        <a href="/testknowledge.zip">测试直接通过超链接下载文件</a>
        <form id ="submitdownload" action="download.jsp"  method="post" enctype="multipart/form-data" id="fileForm">
        </form>
            <div class="downloadBtnInput" onclick="downloadFunc();" style="width: 100%;height: 15%; margin-top: 30px;">
                <div style="display:flex;margin-left:30px;height:100%;width:90%;align-items:center;">

                    <div id="pzBtn"  class="inputBox downloadBtn" style="margin:auto; height: 50px;width:100%;background-color: #3385ff">
                        <div style="display: flex;height:100%;width: 100%;">
                            <div style="height:100%;width: 50%;margin:0 auto;">
                                <div style="height: 100%;display:flex;vertical-align:middle;text-align: center;">
                                    <div style="height:100%;width:18%;margin-left:20px;">
                                        <img src="images/download.png" alt=""  style="height:100%;width:100%;">
                                    </div>
                                    <div style="height:100%;width:70%;font-size: 20px ;text-align: center;align-items: center ">
                                        <p id="downloadWord" class="checkBtn clearCheckBtn"  style="width: 100%;height: 100%;vertical-align: middle;" ><span style="display: inline-block;">下载数据</span></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="loadingImgDiv loadingImg hideimg" id="downloadLoading" style="display: none"><img src="images/loading.gif" ></div>


            <div class="uploadFile"  style="margin-top: 60px;margin-left:30px;">
                <form action="upload.jsp"  method="post" enctype="multipart/form-data" id="fileForm">
                    <input type="file" placeholder="选择需要上传的文件" class="background-color:#fff;border:1px solid #eee;outline:none;" id="uploadfile" name="uploadfile">
                </form>
            </div>
            <div class="uploadloadBtnInput" onclick="uploadFunc();" style="width: 100%;height: 15%; margin-top: 20px;">
                <div style="display:flex;margin-left:30px;height:100%;width:90%;align-items:center;">

                    <div id="pzBtn"  class="inputBox downloadBtn" style="margin:auto; height: 50px;width:100%;background-color: #3385ff">
                        <div style="display: flex;height:100%;width: 100%;">
                            <div style="height:100%;width: 50%;margin:0 auto;">
                                <div style="height: 100%;display:flex;vertical-align:middle;text-align: center;">
                                    <div style="height:100%;width:18%;margin-left:20px;">
                                        <img src="images/upload1.png" alt=""  style="height:100%;width:100%;">
                                    </div>
                                    <div style="height:100%;width:70%;font-size: 20px ;text-align: center;align-items: center ">
                                        <p id="uploadWord" class="checkBtn clearCheckBtn"  style="width: 100%;height: 100%;vertical-align: middle;" ><span style="display: inline-block;">上传数据</span></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="loadingImgDiv loadingImg hideimg" id="uploadLoading" style="display: none"><img src="images/loading.gif" ></div>

    </div>
</div>

<script type="text/javascript">
    // $(".downloadBtnInput").bind("click",downloadFunc());

    /**
     *下载数据
     */
    function downloadFunc() {

        //显示loading图标
        $("#downloadLoading").show();
        // $("#submitdownload").submit();
        $.ajax({
            type: "POST",
            url:"download.jsp",
            data:{},
            dataType: "",
            success : function (obj) {
                console.log(obj)
                if(obj){
                    window.open("/testknowledge.zip");
                }
                $("#downloadLoading").hide();
                alert("数据保存到E:/knowledge.json下");
            },
            error:function (obj) {
                alert("下载失败");
                $("#downloadLoading").hide();
            }
        });

    }

    function uploadFunc(){
        var filename = $("#uploadfile").val();
        if(null == filename || ''==filename){
            alert("请选择需要上传的文件");
            return;
        }
        var formData = new FormData($("#fileForm"));
        //显示loading图标
        $("#uploadLoading").show();
        $("#fileForm").ajaxSubmit({
                type: "POST",
                url:"upload.jsp?filename="+filename,
                enctype:"multipart/form-data",
                dataType: "",
                success : function (obj) {
                    if(obj){
                        alert("数据上传success");
                    }else{
                        alert("数据上传fail");
                    }

                    $("#uploadLoading").hide();
                },
                error:function (obj) {
                    alert("上传失败");
                    $("#uploadLoading").hide();
                }
        });
    }
</script>
</body>
</html>