report/app/admin/view/talent/filesShow.html

{extend name="layout/content"}
{block name="content"}
<style type="text/css">
    .spacing {
        margin-bottom: 10px;
        padding-right:4px;
        padding-left: 4px;
    }
    #talentInfoForm label {
        font-size: xx-small;
    }
    .has-feedback .form-control {
        padding-right: 5px;
    }
    #field ul li{
        list-style: none;
        display:inline-block;
        width:13%;
    }
    .imgs li{
        list-style: none;
        float: left;
        border: 1px solid #d8d1d1;
        text-align: center;
        height: 30px;
    }
    #field ul li input{
        vertical-align:middle;
        margin-right:5px;
        margin-top:1px;
    }
</style>
<table id="fileTable2" class="table-condensed" style="font-size: 10px;table-layout: fixed!important;" data-mobile-responsive="true" data-click-to-select="true">
    <thead>
        <tr>
            <th data-field="selectItem" data-checkbox="true"></th>
        </tr>
    </thead>
</table>
<script>
    function getFile(project, type, id, source, talent_condition, checkState) {
        var queryData = {};
        queryData['project'] = project;
        queryData['type'] = type;
        if (type == 1) {
            queryData['source'] = source;
            queryData['talent_condition'] = talent_condition;
            queryData['checkState'] = checkState;
        }
        var listUrl = "/common/api/listTalentFile";
        var field = "fileTypeId";
        $("#fileTable2").bootstrapTable({
            url: Feng.ctxPath + "/common/api/findCommonFileType",
            method: 'POST',
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            search: false, // 是否显示表格搜索，此搜索是客户端搜索，不会进服务端
            showRefresh: false, // 是否显示刷新按钮
            clickToSelect: true, // 是否启用点击选中行
            singleSelect: true, // 设置True 将禁止多选
            striped: true, // 是否显示行间隔色
            escape: true,
            pagination: false, // 设置为 true 会在表格底部显示分页条
            paginationHAlign: "left",
            paginationDetailHAlign: "right",
            sidePagination: "server", // 设置在哪里进行分页，可选值为 'client' 或者 'server'
            showColumns: false,
            detailView: true, //是否显示父子表
            pageList: [10, 30, 50],
            queryParams: function (params) {
                return $.extend(queryData, params)
            },
            rowStyle: function (row, index) {
                return {classes: "info"};
            },
            columns: [
                {field: 'selectItem', checkbox: false, visible: false},
                {title: '名称', field: 'name', visible: true, align: 'center', valign: 'middle', width: "70%", 'class': 'uitd_showTip',
                    formatter: function (value, row, index) {
                        if (row.must == 1) {
                            return '<i class="fa fa-paste"></i><span style="font-weight:bold;color:red;font-size:14px;font-family:宋体"> * </span> ' + value;
                        }
                        if (row.must == 2) {
                            return '<i class="fa fa-paste"></i>' + value;
                        }
                    }
                }
            ],
            onPostBody: function () {
                $("td.uitd_showTip").bind("mouseover", function () {
                    var htm = $(this).html();
                    $(this).webuiPopover({title: '详情', content: htm, trigger: 'hover'}).webuiPopover('show');
                });
            },
            onLoadSuccess: function (data) {
                $("#fileTable2").bootstrapTable('expandAllRows');
            },
            onExpandRow: function (index, row, $detail) {
                var ajax = new $ax(Feng.ctxPath + listUrl, function (data) {
                    if (data == null || data.length == 0) {
                        return;
                    }
                    var html = '<ul class="imgs"><li style="width: 80%;font-weight: bold;padding-top: 5px;">附件原名</li><li style="width: 10%;font-weight: bold;padding-top: 5px;">预览</li><li style="width: 10%;font-weight: bold;padding-top: 5px;">操作</li>';
                    for (var key in data) {
                        var sn = data[key].url.lastIndexOf(".");
                        var suffix = data[key].url.substring(sn + 1, data[key].url.length);
                        var imgStr = "";
                        if (suffix == "pdf" || suffix == "PDF") {
                            imgStr = "<button type='button'  onclick=\"Feng.showPdf('" + data[key].url + "','" + data[key].id + "','" + data[key].orignName + "')\" class=\"btn btn-xs btn-danger\"><i class=\"fa fa-file-pdf-o\" aria-hidden=\"true\"></i></button>";
                        } else if (suffix == "xlsx" || suffix == "XLSX" || suffix == 'xls' || suffix == 'XLS') {
                            imgStr = "<button type='button'  onclick=\"Feng.showExcel('" + data[key].url + "','" + data[key].id + "','" + data[key].orignName + "')\" class=\"btn btn-xs btn-danger\"><i class=\"fa fa-file-excel-o\" aria-hidden=\"true\"></i></button>";
                        } else {
                            imgStr = '<img class=\"imgUrl\"  src=\"' + data[key].url + '\" style=\"width:25px;height:25px;\">';
                        }
                        html = html + '<li style="display: none">' + data[key].id + '</li>\n' +
                                '<li style="width: 80%;padding-top: 5px;">' + data[key].orignName + '</li>\n' +
                                '<li style="width: 10%;">' + imgStr + '</li>\n' +
                                "<li style='width: 10%;padding-top: 2px;'><button type='button' onclick=\"downloadFile('" + data[key].id + "','" + data[key].type + "')\" class=\"btn btn-xs btn-success\"><i class=\"fa fa-download\" aria-hidden=\"true\"></i>下载</button></li>";
                    }
                    html = html + '</ul>';
                    $detail.html(html);
                    $(".imgs").viewer({
                        // toolbar:false,
                        fullscreen: false
                    });
                }, function (data) {
                    Feng.error("查询失败!" + data.responseJSON.message + "!");
                });
                var queryData = {};
                queryData["mainId"] = id;
                queryData[field] = row.id;
                ajax.set(queryData);
                ajax.start();
            }
        });
    }
</script>
{/block}