<style>
    .pagination {
        display: flex;
        justify-content: center;
        padding-left: 0;
        margin: 20px 0;
        border-radius: 4px;

    }
    .pagination > li {
        display: inline;
    }
    .pagination > li > a, .pagination > li > span {
        position: relative;
        float: left;
        padding: 6px 12px;
        margin-left: -1px;
        line-height: 1.42857143;
        color: #337ab7;
        text-decoration: none;
        background-color: #fff;
        border: 1px solid #ddd;
    }
    .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
        z-index: 2;
        color: #fff;
        cursor: default;
        background-color: #337ab7;
        border-color: #337ab7;
    }
</style>
<section class="admin-main">
    <div class="container-fluid">
        <div class="page-container">
            <div class="card">
                <div class="card-body">
                    <!-- class="col-lg-1 col-md-12 col-sm-12" -->
                    <div class="card-title row">
                        <div class="pl-4 pr-4">{$Title}</div>
                        <div class="col-lg-8 col-md-12 col-sm-12">
                            {foreach $PluginsAdminMenu as $v}
                                {if $v['custom']}
                                    <span  class="ml-2"><a  class="h5" href="{$v.url}" target="_blank">{$v.name}</a></span>
                                {else/}
                                    <span  class="ml-2"> <a  class="h5" href="{$v.url}">{$v.name}</a></span>
                                {/if}
                            {/foreach}
                        </div>
                    </div>
                    <div class="tab-content mt-4">

                        <div class="table-body auto-login-content">
                            <table class="table table-bordered table-hover">
                                <caption>选中的项目：<input type="text" name="distributeusername" id="distributeusername" value="" placeholder="用户名"> <button type="button" class="btn btn-danger btn-sm update-files">批量分配</button></caption>
                                <thead class="thead-light">
                                <tr>
                                    <th class="checkbox">
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input" id="customCheckHead" name="headCheckbox">
                                            <label class="custom-control-label" for="customCheckHead">&nbsp;</label>
                                        </div>
                                    </th>

                                    <th>域名</th>
                                    <th>注册时间</th>
                                    <th>到期时间</th>
                                    <th>分配用户</th>
                                    <th>状态</th>
                                </tr>
                                </thead>
                                <tbody>
                                {foreach $List as $key=>$item}
                                <tr>
                                    <td class="checkbox">
                                        {php}if(empty($DomainList[$item["DomainId"]]["uid"])){  {/php}
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input row-checkbox" data-file='{$item|json_encode}' id="customCheck{$key}">
                                            <label class="custom-control-label" for="customCheck{$key}">&nbsp;</label>
                                        </div>
                                        {php} }  {/php}
                                    </td>
                                    <td>{$item.DomainName}</td>
                                    <td>{$item.CreationDate}</td>
                                    <td>{$item.ExpirationDate}</td>
                                    <td>
                                        <div style="display: flex;">
                                            <input type="text" name="distributeusername" value="{php}echo $DomainList[$item["DomainId"]]["username"];{/php}" placeholder="用户名" style="border-right: 0;border-bottom-right-radius: 0;border-top-right-radius: 0;"> <button type="button" class="btn btn-danger btn-sm update-file" style="border-left: 0;border-bottom-left-radius: 0;border-top-left-radius: 0;" data-id='{$item|json_encode}'>分配</button>
                                        </div></td>
                                    <td>

                                    {switch $item.BuyStatus }
                                    {case ok}正常{/case}
                                    {case AboutToExpire}即将到期{/case}
                                    {case RegisterPending}注册中{/case}
                                    {case RegisterDoing}注册中{/case}
                                    {case RegisterFailed}注册失败{/case}
                                    {case RenewPending}续费期{/case}
                                    {case RenewDoing}续费中{/case}
                                    {case RedemptionPending}赎回期{/case}
                                    {case RedemptionDoing}赎回中{/case}
                                    {case TransferPending}转入中{/case}
                                    {case TransferTransing}转入中{/case}
                                    {case TransferFailed}转入失败{/case}
                                    {default /}未知状态{$item['BuyStatus']}
                                        {/switch}
                                    </td>

                                </tr>
                               {/foreach}
                                </tbody>
                            </table>
                            <div class="table-body" id="renewMsg" style="color: #ff0000;"></div>

                        </div>
                        <div class="myPagination"></div>
                        <div class="table-body">文档说明：<a href="https://html5code.org/type/zjmf.html" target="_blank">https://html5code.org/type/zjmf.html</a> </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<script src="/plugins/addons/qcloud_dominbygzhx/template/js/pagination.js"></script>
<script>
    let queryToJson=function (hash){
        let str=hash?window.location.hash:window.location.search
        if( !str ) return { };
        if(str) str=str.substr(1);
        if( !str ) return { };
        let arr = str.split('&');
        let data={ };
        $.each( arr, function (k,v) {

            if(v.indexOf("=")>-1){
                let d=v.indexOf("=");
                data[ decodeURIComponent(v.substr(0,d)) ]=decodeURIComponent(v.substr(d+1));

            }

        } );
        return data;
    }
    let jsonToQuery=function (json){
        return  Object.keys(json).map(function (key) {
            return json[key]? (key + "=" + encodeURIComponent(json[key])):"";
        }).join("&");
    }
    let ajax=function (option){
        $.ajax({
                dataType: "json",
                type: option.type||"post",

                headers: {
                    "X-Requested-With": "XMLHttpRequest",

                },
                url: option.url||"",
                data:option.data,
                async:true,
                success: function (t) {



                    if( t.status==1 ){
                        if(option.success)  option.success(t.info);
                    }else{
                        if(option.error) option.error(t.info);
                    }
                },

                error: function (request, status, errorThrown) {
                    if(option.error) option.error("网络错误，请重试");
                }
            }
        );
    }
    $(function (){
        $('#customCheckHead').off("click").on('click',function () {
            let checked=$(this).prop("checked");
            $(this).closest('table').find('input[type="checkbox"]').prop("checked",checked);
        })
        let update=function (data,username,callback,error){
            ajax({
                data:{
                    action:'set',
                    username:username,
                    domain:JSON.stringify(data)
                },
                success:function (r){
                    callback();

                },error:function (r){
                    $('#renewMsg').html(r);
                    if(error){
                        error(r);
                    }
                }
            })
        }
        $('.update-files').off("click").on("click",function (){
            $('#renewMsg').html('');
            let self=$(this),data=[],username=$('#distributeusername').val();
            if(!username){
                $('#renewMsg').html('请输入要分配的用户名');
                return false;
            }
            self.closest('table').find('input[data-file][type="checkbox"]:checked').each(function (item){
               let s= $(this).data("file");
                data.push(s);

            })

            if(data.length<1){
                $('#renewMsg').html('请选择要分配的域名');
                return false;
            }
            update(data,username,function (){
                self.closest('table').find('input[data-file][type="checkbox"]:checked').each(function (item){
                    $(this).closest('tr').find('td:eq(4)').find("input").val(username);


                })
                self.closest('table').find('input[data-file][type="checkbox"]:checked').remove();

            })

        })
        $('.update-file').off("click").on("click",function (){
            $('#renewMsg').html('');
            let self=$(this),data=[],username=self.prev("input").val();
            if(!username){
                $('#renewMsg').html('请输入要分配的用户名');
                return false;
            }
            data.push(self.data("id"));

            if(data.length<1){
                $('#renewMsg').html('请选择要分配的域名');
                return false;
            }
            update(data,username,function (){
                self.html("转移成功");
            },function (r){
                self.html(r);
            });
            // update(0,count);
        })
        let count="{$count}";
        let pageNumber="{$Page}";
        $(".myPagination").Pagination({
            page:parseInt(pageNumber),
            count:parseInt(count),
            groups: 10,
            prev:'上一页',
            next:'下一页',
            first:'首页',
            last:'末页',
            limit:100,
            onPageChange:function (page) {
                if(parseInt(pageNumber)!=parseInt(page)){
                    let query=queryToJson();
                    query.page=page;
                    top.location.href="./addons?"+jsonToQuery(query)
                }

            }
        });
    })
</script>