<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="keywords" content="">
    <meta name="author" content="">
    <meta name="robots" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="Fillow : Fillow Saas Admin  Bootstrap 5 Template">
    <meta property="og:title" content="Fillow : Fillow Saas Admin  Bootstrap 5 Template">
    <meta property="og:description" content="Fillow : Fillow Saas Admin  Bootstrap 5 Template">
    <meta name="format-detection" content="telephone=no">

    <!-- PAGE TITLE HERE -->
    <title>Fxpool User Dashboard</title>

    <!-- FAVICONS ICON -->
    <!-- Datatable -->
    <link href="static/css/jquery.dataTables.min.css" rel="stylesheet">

    <link href="static/css/nice-select.css" rel="stylesheet">
    <link href="static/css/owl.carousel.css" rel="stylesheet">
    <link rel="stylesheet" href="static/css/nouislider.min.css">

    <!-- Style css -->
    <link href="static/css/style.css" rel="stylesheet">

</head>

<body>

    <!--*******************
        Preloader start
    ********************-->
    <div id="preloader">
        <div class="lds-ripple">
            <div>

            </div>
            <div></div>
        </div>
    </div>
    <!--*******************
        Preloader end
    ********************-->

    <!--**********************************
        Main wrapper start
    ***********************************-->
    <div id="main-wrapper">
        <!--**********************************
            Nav header start
        ***********************************-->
        <div class="nav-header">
            <a class="brand-logo">
                <svg class="logo-abbr" width="55" height="55" viewbox="0 0 55 55" fill="none" xmlns="http://www.w3.org/2000/svg">
					<path fill-rule="evenodd" clip-rule="evenodd" d="M27.5 0C12.3122 0 0 12.3122 0 27.5C0 42.6878 12.3122 55 27.5 55C42.6878 55 55 42.6878 55 27.5C55 12.3122 42.6878 0 27.5 0ZM28.0092 46H19L19.0001 34.9784L19 27.5803V24.4779C19 14.3752 24.0922 10 35.3733 10V17.5571C29.8894 17.5571 28.0092 19.4663 28.0092 24.4779V27.5803H36V34.9784H28.0092V46Z" fill="url(#paint0_linear)"></path>
					<defs>
					</defs>
				</svg>
                <div class="brand-title">
                    <h2 class="">Fxpool.</h2>
                    <span class="brand-sub-title">Fxpool Dashboard</span>
                </div>

                <div class="nav-control">
                    <div class="hamburger">
                        <span class="line"></span><span class="line"></span><span class="line"></span>
                    </div>
                </div>
        </div>
        <!--**********************************
            Nav header end
        ***********************************-->

        <!--**********************************
            Chat box start
        ***********************************-->

        <!--**********************************
            Chat box End
        ***********************************-->

        <!--**********************************
            Header start
        ***********************************-->
        <div class="header border-bottom">
            <div class="header-content">
                <nav class="navbar navbar-expand">
                    <div class="collapse navbar-collapse justify-content-between">
                        <div class="header-left">
                            <div class="dashboard_bar">
                                {{.coinType}}矿工监控面板<a href="https://www.etherchain.org/account/{{.MinerName}}" target="_blank">{{.MinerName}}</a>
                            </div>
                        </div>
                        <ul class="navbar-nav header-right">
                            <li class="nav-item dropdown notification_dropdown">
                                <div class="dropdown-menu dropdown-menu-end">
                                    <div id="DZ_W_Notification1" class="widget-media dlab-scroll p-3" style="height:380px;">
                                        <ul class="timeline">
                                            <li>
                                                <div class="timeline-panel">
                                                    <div class="media me-2">
                                                       
                                                    </div>
                                                    <div class="media-body">
                                                        <h6 class="mb-1">Dr sultads Send you Photo</h6>
                                                        <small class="d-block">29 July 2020 - 02:26 PM</small>
                                                    </div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="timeline-panel">
                                                    <div class="media me-2 media-info">
                                                        KG
                                                    </div>
                                                    <div class="media-body">
                                                        <h6 class="mb-1">Resport created successfully</h6>
                                                        <small class="d-block">29 July 2020 - 02:26 PM</small>
                                                    </div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="timeline-panel">
                                                    <div class="media me-2 media-success">
                                                        <i class="fa fa-home"></i>
                                                    </div>
                                                    <div class="media-body">
                                                        <h6 class="mb-1">Reminder : Treatment Time!</h6>
                                                        <small class="d-block">29 July 2020 - 02:26 PM</small>
                                                    </div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="timeline-panel">
                                                    <div class="media me-2">
                                                        
                                                    </div>
                                                    <div class="media-body">
                                                        <h6 class="mb-1">Dr sultads Send you Photo</h6>
                                                        <small class="d-block">29 July 2020 - 02:26 PM</small>
                                                    </div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="timeline-panel">
                                                    <div class="media me-2 media-danger">
                                                        KG
                                                    </div>
                                                    <div class="media-body">
                                                        <h6 class="mb-1">Resport created successfully</h6>
                                                        <small class="d-block">29 July 2020 - 02:26 PM</small>
                                                    </div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="timeline-panel">
                                                    <div class="media me-2 media-primary">
                                                        <i class="fa fa-home"></i>
                                                    </div>
                                                    <div class="media-body">
                                                        <h6 class="mb-1">Reminder : Treatment Time!</h6>
                                                        <small class="d-block">29 July 2020 - 02:26 PM</small>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <a class="all-notification" href="javascript:void(0);">See all notifications <i class="ti-arrow-end"></i></a>
                                </div>
                            </li>
                            <li class="nav-item dropdown notification_dropdown">
                                <div class="dropdown-menu dropdown-menu-end">
                                    <div id="DZ_W_TimeLine02" class="widget-timeline dlab-scroll style-1 ps ps--active-y p-3 height370">
                                        <ul class="timeline">
                                            <li>
                                                <div class="timeline-badge primary"></div>
                                                <a class="timeline-panel text-muted" href="javascript:void(0);">
                                                    <span>10 minutes ago</span>
                                                    <h6 class="mb-0">Youtube, a video-sharing website, goes live <strong class="text-primary">$500</strong>.</h6>
                                                </a>
                                            </li>
                                            <li>
                                                <div class="timeline-badge info">
                                                </div>
                                                <a class="timeline-panel text-muted" href="javascript:void(0);">
                                                    <span>20 minutes ago</span>
                                                    <h6 class="mb-0">New order placed <strong class="text-info">#XF-2356.</strong></h6>
                                                    <p class="mb-0">Quisque a consequat ante Sit amet magna at volutapt...</p>
                                                </a>
                                            </li>
                                            <li>
                                                <div class="timeline-badge danger">
                                                </div>
                                                <a class="timeline-panel text-muted" href="javascript:void(0);">
                                                    <span>30 minutes ago</span>
                                                    <h6 class="mb-0">john just buy your product <strong class="text-warning">Sell $250</strong></h6>
                                                </a>
                                            </li>
                                            <li>
                                                <div class="timeline-badge success">
                                                </div>
                                                <a class="timeline-panel text-muted" href="javascript:void(0);">
                                                    <span>15 minutes ago</span>
                                                    <h6 class="mb-0">StumbleUpon is acquired by eBay. </h6>
                                                </a>
                                            </li>
                                            <li>
                                                <div class="timeline-badge warning">
                                                </div>
                                                <a class="timeline-panel text-muted" href="javascript:void(0);">
                                                    <span>20 minutes ago</span>
                                                    <h6 class="mb-0">Mashable, a news website and blog, goes live.</h6>
                                                </a>
                                            </li>
                                            <li>
                                                <div class="timeline-badge dark">
                                                </div>
                                                <a class="timeline-panel text-muted" href="javascript:void(0);">
                                                    <span>20 minutes ago</span>
                                                    <h6 class="mb-0">Mashable, a news website and blog, goes live.</h6>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </nav>
            </div>
        </div>
        
        <div class="content-body">
            <!-- row -->
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-12">
                        <div class="row">
                            <div class="col-xl-12">
                                <div class="col-xl-12">
                                    <div class="card-header border-0 pb-0">
                                        <h4 class="fs-20 font-w700 mb-0" id="UserDashboardTotalWorker"></h4>
                                        <h4 class="fs-20 font-w700 mb-0" id="UserDashboardTotalHashRate"></h4>
                                        <h4 class="fs-20 font-w700 mb-0" id="UserDashboardTotalOneHoursShares"></h4>
                                        <h4 class="fs-20 font-w700 mb-0" id="UserDashboardTotalShares"></h4>
                                    </div>
                                    <div id="UserrevenueMapShares" class="revenueMap"></div>
                                </div>
                            </div>
                            <div class="col-12">
                                <div class="card">
                                    <div class="card-header">
                                        <h4 class="card-title">在线矿机列表</h4>
                                    </div>
                                    <div class="card-body">
                                        <div class="table-responsive">
                                            <table id="table-user-dashboard" class="display" style="min-width: 845px">
                                                <thead>
                                                    <tr>
                                                        <th>矿机名字</th>
                                                        <th>连接端口</th>
                                                        <th>当前算力</th>
                                                        <th>1小时份额</th>
                                                        <th>总的份额</th>
                                                        <th>抽水份额/占比</th>
                                                        <th>挖矿/抽水难度</th>
                                                        <th>矿池延迟</th>
                                                        <th>状态</th>
                                                        <th>上次发现</th>
                                                    </tr>
                                                </thead>
                                                <tbody id="userDashboard">
                                                    <!--js动态添加-->
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--**********************************
            Content body end
        ***********************************-->
        <!--**********************************
            Footer start
        ***********************************-->
        <div class="footer">
            <div class="copyright">
                <p>Copyright © Designed &amp; Developed by <a href="http://www.fxpool.org" target="_blank">Fxpool</a> 2021</p>
            </div>
        </div>
        <!--**********************************
            Footer end
        ***********************************-->

        <!--**********************************
           Support ticket button start
        ***********************************-->

        <!--**********************************
           Support ticket button end
        ***********************************-->


    </div>
    <!--**********************************
        Main wrapper end
    ***********************************-->

    <!--**********************************
        Scripts
    ***********************************-->
    <!-- Required vendors -->
    <script src="static/js/global.min.js"></script>
    <script src="static/js/Chart.bundle.min.js"></script>
    <script src="static/js/jquery.nice-select.min.js"></script>

    <!-- Apex Chart -->
    <script src="static/js/apexchart.js"></script>

    <script src="static/js/Chart.bundle.min.js"></script>

    <!-- Chart piety plugin files -->
    <script src="static/js/jquery.peity.min.js"></script>
    <script src="static/js/owl.carousel.js"></script>

    <!-- Datatable -->
    <script src="static/js/jquery.dataTables.min.js"></script>
    <script src="static/js/datatables.init.js"></script>

    <script src="static/js/custom.min.js"></script>
    <script src="static/js/dlabnav-init.js"></script>
    <script src="static/js/demo-userdash.js"></script>
    <script>
        var thisCoinType = "{{.coinType}}";
        function secondsFormat(s) {
            var day = Math.floor(s / (24 * 3600)); // Math.floor()向下取整 
            var hour = Math.floor((s - day * 24 * 3600) / 3600);
            var minute = Math.floor((s - day * 24 * 3600 - hour * 3600) / 60);
            var second = s - day * 24 * 3600 - hour * 3600 - minute * 60;
            return day + "天" + hour + "时" + minute + "分" + second + "秒";
        }
        function timestampToTime(timestamp) {
            var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
            var Y = date.getFullYear() + '-';
            var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
            var D = date.getDate() + ' ';
            var h = date.getHours() + ':';
            var m = date.getMinutes() + ':';
            var s = date.getSeconds();
            return Y+M+D+h+m+s;
        }
        /* "use strict" */
        function UserrevenueMap() {
            var options = {
                series: [{
                    name: '算力',
                    data: [0],
                    color: 'rgba(44,160,44,0.7)',
                },
                {
                    name: '矿机',
                    data: [0],
                    color: 'rgba(108,115,57,0.7)',
                },{
                    name: '1小时份额',
                    data: [0],
                    color: 'rgba(228,115,17,0.7)',
                },{
                    name: '抽水转换率',
                    data: [0],
                    color: 'rgba(247,163,92,0.7)',
                }],
                chart: {
                    type: 'line',
                    height: 300,
                    toolbar: {
                        show: false,
                    },
                },
                plotOptions: {
                    bar: {
                        horizontal: false,
                        columnWidth: '70%',
                        endingShape: 'rounded'
                    },
                },
                colors: ['#886CC0'],
                dataLabels: {
                    enabled: false,
                },
                markers: {
                    shape: "circle",
                },

                legend: {
                    show: true,
                },
                stroke: {
                    show: true,
                    width: 5,
                    curve: 'smooth',
                    colors: ['var(--primary)'],
                },
                grid: {
                    borderColor: '#eee',
                    show: true,
                    xaxis: {
                        lines: {
                            show: false,
                        }
                    },
                    yaxis: {
                        lines: {
                            show: false,
                        }
                    },
                },
                xaxis: {
                    categories: [],
                    show: false,
                    labels: {
                        style: {
                            colors: '#7E7F80',
                            fontSize: '13px',
                            fontFamily: 'Poppins',
                            fontWeight: 100,
                            cssClass: 'apexcharts-xaxis-label',
                        },
                        show: false
                    },
                    crosshairs: {
                        show: false,
                    }
                },
                yaxis: [
                {
                    show: false,
                    labels: {
                        offsetX: -15,
                        style: {
                            colors: '#7E7F80',
                            fontSize: '14px',
                            fontFamily: 'Poppins',
                            fontWeight: 100,
                        },
                        formatter: function(y) {
                            return y.toFixed(0) + "台";
                        }
                    },
                },
                {
                    show: false,
                    labels: {
                        offsetX: -15,
                        style: {
                            colors: '#7E7F80',
                            fontSize: '14px',
                            fontFamily: 'Poppins',
                            fontWeight: 100,
                        },
                        formatter: function(y) {
                            return CalHash(y);
                        }
                    },
                },{
                    show: false,
                    labels: {
                        offsetX: -15,
                        style: {
                            colors: '#7E7F80',
                            fontSize: '14px',
                            fontFamily: 'Poppins',
                            fontWeight: 100,
                        },
                        formatter: function(y) {
                            return y.toFixed(0) + "份";
                        }
                    },
                },{
                    show: false,
                    labels: {
                        offsetX: -15,
                        style: {
                            colors: '#7E7F80',
                            fontSize: '14px',
                            fontFamily: 'Poppins',
                            fontWeight: 100,
                        },
                        formatter: function(y) {
                            return y.toFixed(2) + "%";
                        }
                    },
                }],
                fill: {
                    opacity: 1,
                    colors: '#FAC7B6'
                },
                tooltip: {
                    y:[ 
                    {
                        formatter: function(val) {
                                return CalHash(val);
                            }
                        },
                        {
                            formatter: function(val) {
                                return val +"台";
                            }
                        },
                        {
                            formatter: function(val) {
                                return val +"份";
                            }
                        },
                        {
                            formatter: function(val) {
                                return val.toFixed(2) + "%";
                            }
                        }
                    ]
                }
            }; //jiangmin
            var chartBar1 = new ApexCharts(document.querySelector("#UserrevenueMapShares"), options);
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && xhr.status == 400) {
                    window.location.href="/login";
                    return;
                }
                if (xhr.readyState == 4 && xhr.status == 200) {
                    var data = xhr.responseText;
                    data = JSON.parse(data);
                    for (var p in data.history_info) {
                        options.series[0].data[p] = data.history_info[p].worker_on_line_cnt;
                        options.series[1].data[p] = data.history_info[p].hash_rate;
                        options.series[2].data[p] = data.history_info[p].shares_1_hours;
                        options.series[3].data[p] = data.history_info[p].average_fee_point*100;
                        options.xaxis.categories[p] = timestampToTime(data.history_info[p].time);
                    }
                    document.getElementById("UserrevenueMapShares").innerHTML="";
                    chartBar1.render();
                }
            }
            xhr.open('GET', 'api/minerInfoHistory/'+thisCoinType+'?minerName={{.MinerName}}', true)
            xhr.send();
        }
        function CalHash(v){
            var tmptmp = v.toFixed(2)+"Sol";
            // sol m g t p e
            if( v>1000){
                tmptmp = (v/(1000)).toFixed(2)+"KH";
            }
            if( v>1000*1000){
                tmptmp = (v/(1000*1000)).toFixed(2)+"MH";
            }
            if( v>1000*1000*1000){
                tmptmp = (v/(1000*1000*1000)).toFixed(2)+"GH";
            }
            if( v>1000*1000*1000*1000){
                tmptmp = (v/(1000*1000*1000*1000)).toFixed(2)+"TH";
            }
            if( v>1000*1000*1000*1000*1000){
                tmptmp = (v/(1000*1000*1000*1000*1000)).toFixed(2)+"PH";
            }
            if( v>1000*1000*1000*1000*1000*1000){
                tmptmp = (v/(1000*1000*1000*1000*1000*1000)).toFixed(2)+"PH";
            }
           return tmptmp;
        }
        function CalDiff(v){
            var tmptmp = v.toFixed(3)+"Sol";
            // sol m g t p e
            if( v>1000){
                tmptmp = (v/(1000)).toFixed(3)+"K";
            }
            if( v>1000*1000){
                tmptmp = (v/(1000*1000)).toFixed(3)+"M";
            }
            if( v>1000*1000*1000){
                tmptmp = (v/(1000*1000*1000)).toFixed(3)+"G";
            }
            if( v>1000*1000*1000*1000){
                tmptmp = (v/(1000*1000*1000*1000)).toFixed(3)+"T";
            }
            if( v>1000*1000*1000*1000*1000){
                tmptmp = (v/(1000*1000*1000*1000*1000)).toFixed(3)+"P";
            }
            if( v>1000*1000*1000*1000*1000*1000){
                tmptmp = (v/(1000*1000*1000*1000*1000*1000)).toFixed(3)+"P";
            }
           return tmptmp;
        }
        function UserDashboardHttpDataGet() {
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && xhr.status == 400) {
                    window.location.href="/login";
                    return;
                }
                if (xhr.readyState == 4 && xhr.status == 200) {
                    var data = xhr.responseText;
                    data = JSON.parse(data);
                    var divelementstr = "";
                    for (var p in data.worker) {
                        var this_hashrate = CalHash(data.worker[p].current_hash_rate);
                        var lastFindTime = secondsFormat(data.worker[p].last_find_time);
                        var onlineFlag = "";
                        if(data.worker[p].is_on_line ==true){
                            onlineFlag = '<span class="text-success">在线</span>'
                        }else{
                            onlineFlag = '<span class="text-danger">离线</span>'
                        }
                        divelementstr += '<tr>'+
                        '<td>' + data.worker[p].name + '</td>' + 
                        '<td>' + data.worker[p].listen_info + '</td>' + 
                        '<td>' + this_hashrate + '</td>' + 
                        '<td>' + data.worker[p].shares_1_hours + '</td>' + 
                        '<td>' + data.worker[p].total_share +'/<span class="text-danger">'+ data.worker[p].invalid_share+'</span>'+ '</td>' + 
                        '<td>' + data.worker[p].total_fee_shares +'/'+ (data.worker[p].fee_proportion_real*100).toFixed(2)+'%'+ '</td>' + 
                        '<td>' + CalDiff(data.worker[p].difficulty) +'/'+ CalDiff(data.worker[p].fee_difficulty)+ '</td>' +
                        '<td>' + data.worker[p].pool_delay+'ms' + '</td>' +
                        '<td>' + onlineFlag + '</td>' +
                        '<td>' + lastFindTime + "前"+ '</td>' + 
                        '</tr>';
                    }
                    document.getElementById("userDashboard").innerHTML = divelementstr;
                    //加载数据后面好选择使用
                    var tableuserlist = $('#table-user-dashboard').DataTable({
                        createdRow: function(row, data, index) {
                            $(row).addClass('selected')
                        },
                        language: {
                            paginate: {
                                next: '<i class="fa fa-angle-double-right" aria-hidden="true"></i>',
                                previous: '<i class="fa fa-angle-double-left" aria-hidden="true"></i>'
                            }
                        }
                    });
                    tableuserlist.on('click', 'tbody tr', function() {
                        var $row = tableuserlist.row(this).nodes().to$();
                        var hasClass = $row.hasClass('selected');
                        if (hasClass) {
                            $row.removeClass('selected')
                        } else {
                            $row.addClass('selected')
                        }
                    })
                    tableuserlist.rows().every(function() {
                        this.nodes().to$().removeClass('selected')
                    });
                }
            }
            xhr.open('GET', 'api/minerInfoByName/'+thisCoinType+'?minerName={{.MinerName}}', true);
            xhr.send();
        }

        function cardsCenter() {
            /* testimonial one function by = owl.carousel.js */
            jQuery('.card-slider').owlCarousel({
                loop: true,
                margin: 0,
                nav: true,
                //center:true,
                slideSpeed: 3000,
                paginationSpeed: 3000,
                dots: true,
                navText: ['<i class="fas fa-arrow-left"></i>', '<i class="fas fa-arrow-right"></i>'],
                responsive: {
                    0: {
                        items: 1
                    },
                    576: {
                        items: 1
                    },
                    800: {
                        items: 1
                    },
                    991: {
                        items: 1
                    },
                    1200: {
                        items: 1
                    },
                    1600: {
                        items: 1
                    }
                }
            })
        }
        function MinerBaseInfo() {
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && xhr.status == 400) {
                    window.location.href="/login";
                    return;
                }
                if (xhr.readyState == 4 && xhr.status == 200) {
                    var data = xhr.responseText;
                    data = JSON.parse(data);
                    document.getElementById("UserDashboardTotalWorker").innerHTML ="在线:"+ data.base_info.total_on_line_clients+'/<span class="text-danger">'+ data.base_info.total_off_on_line_clients+'</span>台';
                    document.getElementById("UserDashboardTotalHashRate").innerText ="算力:"+ CalHash(data.base_info.total_hash_rate);
                    document.getElementById("UserDashboardTotalOneHoursShares").innerText = "1小时份额:"+ data.base_info.total_1_hours_shares+" 份";
                    document.getElementById("UserDashboardTotalShares").innerHTML ="总份额:"+ data.base_info.total_shares+'/<span class="text-danger">'+data.base_info.total_invalid_share+'</span>份';
                }
            }
            var intervalId = window.setInterval(function clock() {
                xhr.open('GET', 'api/minerInfoByName/'+thisCoinType+'?minerName={{.MinerName}}', true);
                xhr.send();
            }, 3 * 1000);
            xhr.open('GET', 'api/minerInfoByName/'+thisCoinType+'?minerName={{.MinerName}}', true);
            xhr.send();
        }
        jQuery(window).on('load', function() {
            setTimeout(function() {
                cardsCenter();
                MinerBaseInfo();
                UserDashboardHttpDataGet();
                UserrevenueMap();
            }, 1000);
        });
    </script>
</body>

</html>