{extend name="public/baseNew" /}
{block name="body"}
<style type="text/css">
    #shareLink{
        width: auto;
        height: 34px;
        white-space: nowrap;
        line-height: 34px;
        border: 1px solid #ccc;
        float: left;
        padding: 0 10px;
        margin: 0 10px;
    }
    #sub_btn{
        width: auto;
        height: 34px;
        background: #337ab7;
        float: left;
        border: none;
        border-radius: 4px;
        color: #fff;
    }
</style>
    <div class="container">
        <div class="list-logo">
            <img src="__PUBLIC__images/logo.c.png" onerror="javascript:this.src='__PUBLIC__images/logo.suxuan.png';" style="max-width: 260px;" >
            {if condition="$share"}
            {else}
                <a href="/logout" style="float: right">
                    <span class="glyphicon glyphicon-off" style="margin-right: 5px"></span>退出
                </a>
            {/if}
        </div>
        <h2 class="text-center">{$userInfo.nickname}的底片</h2>
        <div class="row">
            <div class="col-md-12 col-xs-12">
                <div class="btn-group top-menu" role="group" aria-label="...">
                    <button type="button" class="btn btn-primary">我的文件</button>
                    <!--button type="button" class="btn btn-info" data-toggle="modal" data-target="#myShare">我的分享</button-->
                    <div id="shareLink">{$shareLink}</div>

                </div>

                <!--新加面包屑导航-->
                {if condition="isset($nav)"}
                    <ul class="breadcrumb">{$nav}</ul>
                {/if}
                <ul class="list-group">
                    {volist name="fileList" id="file" empty="<li class='list-group-item'>当前目录没有文件</li>"}
                    <!-- 分享目录 -->
                    {if condition="$share"}
                       <li class="list-group-item">
                            {if condition="$file[dir]==1"}
                                {if condition="$file[down] != ''"}
                                <span class="badge glyphicon glyphicon-download-alt" down-url="{:url('index/download',['uid'=>$userInfo.id, 'path'=>$file['down']],'','')}" > </span>
                                {/if}
                                <span class="glyphicon glyphicon-folder-open" aria-hidden="true"></span> <a href="{:url('/',['share'=>$share, 'path'=>$file['path_en']])}">{$file.path}</a>
                            {else}
                                <span class="badge glyphicon glyphicon-download-alt" down-url="{:url('index/download',['uid'=>$userInfo.id, 'path'=>$file['path_en']])}" > </span>
                                <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span> {$file.path}
                            {/if}
                        </li>
                    <!-- 非分享目录 -->
                    {else}
                        <li class="list-group-item">
                            <!--span class="badge glyphicon glyphicon-share-alt" data-toggle="modal" data-target="#myModal"> </span-->
                            {if condition="$file[dir]==1"}
                            <span class="badge glyphicon glyphicon-download-alt" down-url="{:url('index/downloadAll',['uid'=>$userInfo.id, 'path'=>$file['path_en']])}" > </span>
                            <span class="glyphicon glyphicon-folder-open" aria-hidden="true"></span> <a href="{:url('index/index',['path'=>$file['path_en']])}">{$file.path}</a>
                            {else}
                            <span class="badge glyphicon glyphicon-download-alt" down-url="{:url('index/download',['path'=>$file['path_en']])}" > </span>
                            <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span> {$file.path}
                            {/if}
                        </li>
                    {/if}
                    {/volist}
                </ul>
            </div>
        </div>
    </div>


    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title text-center">分享</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label class="col-sm-3 col-xs-5 control-label">请输入密码</label>
                            <div class="col-sm-9 col-xs-6">
                                <input type="password" class="form-control" placeholder="Password">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 col-xs-5 control-label">请再次输入密码</label>
                            <div class="col-sm-9 col-xs-6">
                                <input type="password" class="form-control" placeholder="Password">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <span class="btn btn-primary" id="share">分享</span>
                </div>
            </div>
        </div>
    </div>


    <div class="modal fade" id="shareModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title text-center">分享地址</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label class="col-sm-2 col-xs-3 control-label">地址</label>
                            <div class="col-sm-10 col-xs-8">
                                <input type="password" class="form-control" placeholder="Password">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="myShare" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title text-center">我的分享</h4>
                </div>
                <div class="modal-body" style="max-height: 300px;overflow: auto">
                    <div class="table-responsive">
                        <table class="table table-bordered table-hover">
                            <tr>
                                <th>地址</th>
                                <th>时间</th>
                                <th>操作</th>
                            </tr>
                            <tr>
                                <td>http://v3.bootcss.com/javascript/#modals-usage</td>
                                <td>2017-10-23</td>
                                <td>删除</td>
                            </tr>
                            <tr>
                                <td>http://v3.bootcss.com/javascript/#modals-usage</td>
                                <td>2017-10-23</td>
                                <td>删除</td>
                            </tr>
                            <tr>
                                <td>http://v3.bootcss.com/javascript/#modals-usage</td>
                                <td>2017-10-23</td>
                                <td>删除</td>
                            </tr>
                            <tr>
                                <td>http://v3.bootcss.com/javascript/#modals-usage</td>
                                <td>2017-10-23</td>
                                <td>删除</td>
                            </tr>
                            <tr>
                                <td>http://v3.bootcss.com/javascript/#modals-usage</td>
                                <td>2017-10-23</td>
                                <td>删除</td>
                            </tr>
                            <tr>
                                <td>http://v3.bootcss.com/javascript/#modals-usage</td>
                                <td>2017-10-23</td>
                                <td>删除</td>
                            </tr>
                            <tr>
                                <td>http://v3.bootcss.com/javascript/#modals-usage</td>
                                <td>2017-10-23</td>
                                <td>删除</td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>
                </div>
            </div>
        </div>
    </div>
    <script>
        $(function(){
            $("#share").click(function(){
                $('#myModal').modal('hide');
                $('#shareModel').modal('show');
            })
            $('.glyphicon-download-alt').each(function(){
				
                $(this).click(function(){
					{if condition="$isWeixin eq 1"}
						alert("微信内无法下载，点击右上角在浏览器中打开");
						return false;
					{/if}
                    window.open($(this).attr('down-url'));
                });
                
            })
        })
    </script>
{/block}