<link rel="stylesheet" href="<?php echo base_url();?>public/js/vendor/smalot_bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css">
<script src="<?php echo base_url();?>public/js/vendor/smalot_bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script src="<?php echo base_url();?>public/js/vendor/smalot_bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<style>
    .fixed-table-toolbar {
        display: none;
    }

    .fileinput-button {
        position: relative;
        top: -5px;
    }

    .fileinput-button input{
        position:absolute;
        top: 0px;
        opacity: 0;
        -ms-filter: 'alpha(opacity=0)';
    }
</style>
<div class="content_wrapper">

    <div class="container-fluid">
<!--        <div class="row">-->
<!--            <div class="col-sm-12">-->
<!--                <aside>-->
<!--                    <section>-->
<!--                        <div class="container-fluid">-->
<!--                            <input type="button" style="display: none;margin-bottom: 10px;width: 80px;" class="btn btn-info" value="上传" id="btn"/>-->
<!--                            <span id="filespan" class="btn btn-info fileinput-button">-->
<!--                                <span id="filespan2">上传资源文件</span>-->
<!--                                <input type="file" id="upfile">-->
<!--                            </span>-->
<!--                        </div>-->
<!--                    </section>-->
<!--                </aside>-->
<!--            </div>-->
<!--        </div>-->
        <div class="row">
            <div class="col-sm-12">
                <aside>
                    <header><i class="fa fa-fw fa-file"></i>资源管理</header>
                    <section>
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="table-responsive">
                                        <table id="example" class="table table-striped table-bordered table-hover" cellspacing="0" width="100%">
                                            <thead>
                                            <tr>
                                                <th>上传用户</th>
                                                <th>文件路径</th>
                                                <th>文件名</th>
                                                <th>上传时间</th>
                                                <th>操作</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <?php foreach($list as $k => $v) { ?>
                                            <tr>
                                                <td><?php echo $v['uploader'];?></td>
                                                <td><?php echo $v['zipPath'];?></td>
                                                <td><?php echo $v['filename']?></td>
                                                <td><?php echo date('Y-m-d H:i:s', $v['createTime']);?></td>
                                                <td><button>解压</button></td>
                                            </tr>
                                            <?php } ?>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>
                </aside>
            </div>
        </div>
    </div>

</div>

<script type="text/javascript">
    $("#btn").click(function(){
        var formData = new FormData();
        formData.append("file",document.getElementById("upfile").files[0]);
        $.ajax({
            type: "POST", // 数据提交类型
            url: "Debug/actionFileUpload/", // 发送地址
            data: formData, //发送数据
            async: true, // 是否异步
            processData: false, //processData 默认为false，当设置为true的时候,jquery ajax 提交的时候不会序列化 data，而是直接使用data
            contentType: false, //
            xhr: function() {        //ajax进度条，直接拿过去就可以用
                var xhr = $.ajaxSettings.xhr();
                if (xhr.upload) {
                    xhr.upload.addEventListener("progress", function (e) {
                        var loaded = e.loaded; //已经上传大小情况
                        var tot = e.total; //附件总大小
                        var per = Math.floor(100 * loaded / tot); //已经上传的百分比
                        console.log(per)
                        $('#progress-bar').css('width',per+'%');
                    }, false);
                    return xhr;
                }
            },
            success: function(data) { // 成功回调
                data = JSON.parse(data);
                if(data.ret == 0){
                    window.location.reload();
                }else {
                    msgTip = $('#msg-tip');
                    msgTip.messager().warn('上传失败');
                }
            }
        });
    });

    $("#filespan").on("change", "input[type='file']", function() {
        var filePath = $(this).val();
        //如果仅上传图片 if(filePath.indexOf("jpg") != -1 || filePath.indexOf("png") != -1) {
        if (filePath) {
            $('#filespan2').html(filePath);
            $('#btn').show();
        } else {
            $('#filespan2').html("上传资源文件");
            $('#btn').hide();
        }
    });


    //选择日期
    $('.datetimepicker').datetimepicker({
        format: 'yyyy-mm-dd hh:ii',
        locale: 'zh-cn'
    });

    $(".goback").click(function(){
        window.history.go(-1);
    });
</script>