<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Upload</title>
    <link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.0/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script>
    <link href="/css/upload.css" rel="stylesheet">
</head>
<body>
<a class="title text-center" href="/">Mgek图床</a>
<a href="/logout" style="color: white;background: #378de5;padding:5px 10px 5px 10px;position: fixed;top: 30px;right: 30px;font-size: 18px;text-decoration: none">登出</a>

<div class="form text-center">
 <form class="form form-horizontal" method="POST" enctype="multipart/form-data">
    {{ form.hidden_tag() }}
{#    {{ form.title }}#}
     <p class="file">{{ form.photo(multiple="multiple")}}选择图片</p><br>
    {{ form.submit }}
</form>
    <a style="float: left;margin-left: 20px;background-color: #fe4c40;color: white;padding: 5px 10px 5px 10px" href="/upload_new/">Ajax上传</a>
    <div id="namelist">
        <pre></pre>
    </div>
</div>
<div class="main">
    <div class="info list-group-item-success">
        <span class="count text-center">目前图片数量: {{ imgs|length }}</span>
        <span class="count2">最近图片: 50</span>
        <span class="count3" onclick="window.location.href='/upload_history/'">上传历史</span>
        <span class="count4" onclick="list_del()">批量操作</span>
        <span class="count5" id="count8" onclick="get_url()">直链获取</span>
        <span class="count5" id="count6" onclick="list_dow()">下载</span>
        <span class="count5" id="count5" onclick="del()">删除</span>
        <span class="count5" id="count7" onclick="cancel()">取消</span>
    </div>

    <div class="row">
        {% for img in imgs|reverse %}
            <a href="{{ '/edit/'~img.id }}" class="img col-md-2 col-sm-4" style="background-image:url('{{ img.url_t }}')"><input name="check" class="checkbox" type="checkbox" value="{{ img.id }}"></a>
        {% endfor %}
    </div>
</div>

<script>
    $(".file").on("change","input[type='file']",function(){
    alert('点击上传按钮，完成上传');
        var filePath=document.getElementById("photo").files;
        var filelist = [];
        for(var i=0;i<filePath.length;i++){
            filelist.push(filePath[i].name+'\n')
        }
        $("#namelist pre").html(filelist)
})
</script>
<script src="/js/del_list.js"></script>

</body>
</html>