{% extends "../main.html" %}
{% block title %}采集/更新{% end %}
{% block content %}
<style>
h2 {padding-bottom:1rem;}
.search{margin-bottom:10px;}
.search input {
    font-size:12px;
    border-radius: 0;
}
#update-table thead tr, #table-roles thead tr , #table-permission thead tr{background:whitesmoke;}
#update-table tbody tr, #table-permission tbody tr{
    border-bottom:1px solid #f9f9f9;
}
#update-table tbody tr td, .pagination-detail, .pagination, #coll-configure-modal-right, #configure-modal-right, .modal-footer>button,
.select2-container, #permission-modal-right, #table-permission tbody tr td,.list-unstyled, #configure-body input, #coll-configure-body input{
    font-size: 12px;
    -webkit-font-smoothing: antialiased;
}
.select2-container{
    display: block;
    width: 100% !important;
}
.select-roles-card-body, .select-permission-card-body{
    border: 1px solid #ececec;
    height: 364px;
    overflow-y:auto;
    padding:.7rem 1.25rem .5rem 1.25rem;
}
.opertions{margin-right:10px;}
.alert-info{
    color: #555;
    background-color: #eaeaea;
    border-color: #eaeaea;
    border-radius: 0;
    font-size:12px;
    -webkit-font-smoothing: antialiased;
}
.alert-info b{
    font-weight:700;
    font-size:14px;
}
.alert-info .user-message{
    margin-bottom:10px;
}
.alert-info .user-notic{
    margin-top:10px;
}
.page-title{width:100%;}
.headers{padding-bottom:0;}
.contents{padding-top:0;}
#add_user{
    margin-right:10px;
    font-size:12px;
    border-radius: 0;
    font-weight:300;
}
#per-toolbar input , #per-toolbar span{
    border-radius: 0;
    font-size: 12px !important;
}
.notie-background-success{
    background-color:#57BF57;
}
.notie-background-error{
    background-color:#E1715B;
}
.notie-background-warning{
    background-color:#D6A14D;
}
#configure-body, #coll-configure-body{width:600px;}
.muted{color:#b30202;}
.modal-header{border-bottom: 1px solid #f3f3f3;}
.modal-footer{border-top: 1px solid #f3f3f3;justify-content:left;}
.modal-footer button {
    border-radius: 0;
    float:left;
}
#table-roles tbody tr td {
    padding:0.6rem;
}
#configure-modal-right .search, #permission-modal-right .search {
    width:100%;
}
#table-roles thead tr th{
    border:1px solid rgba(160, 175, 185, 0.15);
}
.select-roles .closes{float:right;}
.select-roles{padding:5px 5px 1px 10px; border-radius: 10px; border:1px solid #a7a7a7;cursor:pointer;}
.select-roles:hover{background:white;color:black;}
.cur-select-roles{
    display: inline-block;
    width: 180px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#add-roles-body .pagination-detail, #add-permission-body .pagination-detail {display:none;}
#add-permission-body{width:1024px;overflow: hidden;}
#add-permission-body .bootstrap-table{
    overflow-y: auto;
    height: 471px;
}
.select-users{padding:5px 5px 1px 10px; border-radius: 10px; border:1px solid #a7a7a7;cursor:pointer;}
.select-users .closes{float:right;}
.cur-select-users, .cur-select-permission{
    display: inline-block;
    width: 180px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cur-select-permission{
    width:230px !important;
}
.select-users:hover{background:white;color:black;}
.modal-footer .loading{
    width:18px;
    height: 17px;
}
</style>
<!-- ############ Content START-->
<div id="content" class="flex ">
        <!-- ############ Main START-->
        <div>
            <div class="page-hero page-container " id="page-hero">
                <div class="padding d-flex headers">
                    <div class="page-title">
                        <h2 class="text-md text-highlight">采集/更新</h2>
                        <div class="alert alert-info" role="alert">
                            <div class="user-message">采集/更新配置针对全局网站进行远程数据采集和本地更新</div>
                            <b>采集和更新的维度按栏目划分，通常的操作步骤如下：</b>
                            <div class="user-notic" style="margin-bottom:10px;">
                                - 采集数据：配置定时从远程服务器采集相应的文章或其他数据到本地库</br>
                                - 更新网站：配置定时从本地库更新发布文章或其他数据到相应的网站栏目。
                            </div>
                            <b>注意事项：</b>
                            <div class="user-notic">
                               - 执行周期如果配置为每一天，则今天也包含在内，否则要等到了周期之后才开始执行。</br>
                               - 采集文章数据会有些许数量偏差，请忽略</br>
                               - 每天可采集的数量到了次数后会采集不到内容，请第二天再操作。
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="page-content page-container" id="page-content">
                <div class="padding contents">
                    <table id="update-table" class="table table-theme v-middle" data-plugin="bootstrapTable" data-striped="false" data-detail-view="false" data-mobile-responsive="true">
                        <thead>
                            <tr>
                                <th style="width:20%;" colspan="1" data-field="username">任务名称</th>
                                <th style="width:20%;" colspan="1" data-field="beizhu">执行数量</th>
                                <th style="width:20%;" colspan="1" data-field="beizhu">执行周期</th>
                                <th style="width:20%;" colspan="1" data-field="times"><span class="d-none d-sm-block">执行时间</span></th>
                                <th style="width:20%;" colspan="1" data-field="opertions"><span class="d-none d-sm-block">操作</span></th>
                            </tr>
                        </thead>
                        <tbody>  
                            <tr data-index="0">
                                <td style="text-align: left; ">更新网站文章</td>
                                <td style="text-align: left; ">{{ pageupdate['amount'] }}</td>
                                <td style="text-align: left; "><span style="font-weight:700";>每 </span>{{ pageupdate['updatecycle'] }}<span style="font-weight:700";> 天</span></td>
                                <td style="text-align: left; ">{{ pageupdate['updatetime'] }}</td>
                                <td style="text-align: left; ">
                                    <a href="javascript:;" onclick="update_configure()"
                                        class="item-title opertions ">配置</a>
                                </td>
                            </tr>
                            <tr data-index="1">
                                <td style="text-align: left; ">采集文章数据</td>
                                <td style="text-align: left; ">{{ acquisition['acquisitions_num'] }}</td>
                                <td style="text-align: left; "><span style="font-weight:700";>每 </span>{{ acquisition['acquisition_cycle'] }}<span style="font-weight:700";> 天</span></td>
                                <td style="text-align: left; ">{{ acquisition['acquisition_time'] }}</td>
                                <td style="text-align: left; ">
                                    <a href="javascript:;" onclick="coll_configure()"
                                        class="item-title opertions ">配置</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- ############ Main END-->
    </div>
    <!-- ############ Content END-->
    <!-- .更新配置modal -->
    <form id="configure-form" onsubmit="return false" data-plugin="parsley" data-option="{}">
        {% module xsrf_form_html() %}
        <div id="configure-modal-right" class="modal fade" data-backdrop="static">
            <div class="modal-dialog modal-right">
                <div class="modal-content h-100 no-radius">
                    <div class="modal-header ">
                        <div class="modal-title text-md">更新配置</div>
                        <button class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="alert alert-warning" role="alert">
                        <i data-feather="alert-circle"></i>
                        <span class="mx-2">注意：此为全局设置，每次更新都会针对所有网站</span>
                    </div>
    
                    <div id="configure-body" class="modal-body">
                        <div class="form-group">
                            <label class="text-dark"><span class="muted">*</span> 更新数量</label>
                            <input value="{{ pageupdate['amount'] }}" autofocus="autofocus" name="amount" id="amount" type="text" class="form-control" data-parsley-type="number" data-parsley-type-message="" data-parsley-required-message="" required>
                            <label class="text-muted">设置每个域每次更新的文章数量</label>
                        </div>
                        <div class="form-group">
                            <label class="text-dark"><span class="muted">*</span> 更新周期</label>
                            <input value="{{ pageupdate['updatecycle'] }}" id="updatecycle" name="updatecycle" type="text" class="form-control" data-parsley-type="number" data-parsley-type-message="" data-parsley-required-message="" required>
                            <label class="text-muted">设置多长时间更新一次文章 / 最小单位: 天</label>
                        </div>
                        <div class="form-group">
                            <label class="text-dark"><span class="muted">*</span> 更新时间</label>
                            <input id="event-start-time" name="updatetime" type="time" class="form-control" value="{{ pageupdate['updatetime'] }}" required>
                            <label class="text-muted">每天的几点更新文章 / 最小单位: 天</label>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary">确定</button>
                        <button type="button" class="btn btn-light" data-dismiss="modal">关闭</button>
                    </div>
                </div>
                <!-- /.modal-content -->
            </div>
        </div>
    </form>
    <!-- / .更新配置modal -->

    <!-- .采集配置modal -->
    <form id="coll-configure-form" onsubmit="return false" data-plugin="parsley" data-option="{}">
            {% module xsrf_form_html() %}
            <div id="coll-configure-modal-right" class="modal fade" data-backdrop="static">
                <div class="modal-dialog modal-right">
                    <div class="modal-content h-100 no-radius">
                        <div class="modal-header ">
                            <div class="modal-title text-md">采集配置</div>
                            <button class="close" data-dismiss="modal">&times;</button>
                        </div>
                        <div class="alert alert-warning" role="alert">
                            <i data-feather="alert-circle"></i>
                            <span class="mx-2">注意：此为全局设置，每次采集都会针对所有网站</span>
                            </div>
        
                        <div id="coll-configure-body" class="modal-body">
                            <div class="form-group">
                                <label class="text-dark"><span class="muted">*</span> 采集数量</label>
                                <input autofocus="autofocus" value="{{ acquisition['acquisitions_num'] }}" name="acquisitions_num" id="acquisition_num" type="text" class="form-control" data-parsley-type="number" data-parsley-type-message=""
                                    data-parsley-required-message="" required>
                                <label class="text-muted">设置每个栏目每次采集的文章数量</label>
                            </div>
                            <div class="form-group">
                                <label class="text-dark"><span class="muted">*</span> 采集周期</label>
                                <input id="acquisition_cycle" name="acquisition_cycle" type="text" value="{{ acquisition['acquisition_cycle'] }}" class="form-control" data-parsley-type="number" data-parsley-type-message=""
                                    data-parsley-required-message="" required>
                                <label class="text-muted">设置多长时间采集一次文章</label>
                            </div>
                            <div class="form-group">
                                <label class="text-dark"><span class="muted">*</span> 采集时间</label>
                                <input id="event-start-time" name="acquisition_time" type="time" class="form-control" value="{{ acquisition['acquisition_time'] }}" required>
                                <label class="text-muted">几点开始采集文章</label>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary">确定</button>
                            <button type="button" class="btn btn-light" data-dismiss="modal">关闭</button>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
            </div>
        </form>
        <!-- / .采集配置modal -->

    {% include "../other/confirm.html" %}


{% end %}
{% block js %}
<script src="/static/libs/bootstrap-table/dist/bootstrap-table.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap-table/1.15.4/locale/bootstrap-table-zh-CN.js"></script>
<script src="/static/libs/notie/dist/notie.min.js"></script>
<script src="/static/js/.js"></script>
<script>

function submit_data(url, data, types){
    $.ajax({
        url: url,
        type: "POST",
        dataType: "json",
        data: data,
        timeout: 1000000,
        success: function (res) {
            if (res.statu == 1){
                if (types == "update"){
                    $('#configure-modal-right').modal('hide');
                }else{
                    $('#coll-configure-modal-right').modal('hide');
                }
                notie.alert({type: 1, text: res.msg, position: 'top'});
                window.location.reload();
            }else{
                notie.alert({type: 3, text: '<b>'+res.msg+'</b>', position: 'top'});
            }
        },
        error: function (res) {
            notie.alert({type: 3, text: '<b>网络错误</b>', position: 'top'});
            $('#configure-modal-right').modal('hide');
            $('#coll-configure-modal-right').modal('hide');
        }

    });
}

function update_configure(){
    $('#configure-modal-right').modal('show');
}

function coll_configure(){
    $('#coll-configure-modal-right').modal('show');
}

$("#configure-form").submit(function(e){
    var data = {
        "amount": $("input[name='amount']").val(),
        "updatecycle": $("input[name='updatecycle']").val(),
        "updatetime": $("input[name='updatetime']").val(),
        "_xsrf": $("#configure-form input[name='_xsrf']").val(),
    }
    var url = "/pageupdate_config"
    var types = "update"
    submit_data(url, data, types)
    
});

$("#coll-configure-form").submit(function(e){
    var data = {
        "acquisition_cycle": $("input[name='acquisition_cycle']").val(),
        "acquisitions_num": $("input[name='acquisitions_num']").val(),
        "acquisition_time": $("input[name='acquisition_time']").val(),
        "_xsrf": $("#configure-form input[name='_xsrf']").val(),
    }
    var url = "/acquisition_config"
    var types = "coll"

    $('#coll-configure-form .modal-footer button[type="submit"]').html('<div class="loading"></div>正在提交')
    $('#coll-configure-form .modal-footer button[type="button"]').attr("disabled",true);
    console.log("ok")

    submit_data(url, data, types)
    
});



</script>
{% end %}