trends/worklife/crm/backend/modules/user/views/dashboard/index.php

<?php
/* @var $this \yii\web\View */

use common\helpers\Utils;

$mt4user = Yii::$app->getUser()->getIdentity(false)->getMt4user();
$this->title = '首页';
?>

<div class="row">
    <div class="col-md-3">
        <?= $this->render('/common/_left_menu.php') ?>
    </div>
    <div class="col-md-9">
        <div class="ibox">
            <div class="ibox-title">
                <h5>账户信息</h5>
            </div>
            <div class="ibox-content">
                <table class="table table-striped">
                    <tbody>
                    <tr>
                        <th>账户</th>
                        <td><?= $mt4user['LOGIN'] ?></td>
                        <th>杠杆</th>
                        <td>1:<?= $mt4user['LEVERAGE'] ?></td>
                    </tr>
                    <tr>
                        <th>余额</th>
                        <td><?= $mt4user['BALANCE'] ?></td>
                        <th>保证金</th>
                        <td><?= $mt4user['MARGIN'] ?></td>
                    </tr>
                    <tr>
                        <th>可用保证金</th>
                        <td><?= $mt4user['MARGIN_FREE'] ?></td>
                        <th>保证金比例</th>
                        <td><?= $mt4user['MARGIN_LEVEL'] ?></td>
                    </tr>
                    <tr>
                        <th>净值</th>
                        <td><?= $mt4user['EQUITY'] ?></td>
                        <th>总交易次数</th>
                        <td><?= $historyTotalCount ?></td>
                    </tr>
                    <!--<tr>
                        <th>盈利交易</th>
                        <td><?= $historyWinCount ?> (<?= Utils::formatFloatOrInt($historyWinPercent, 5) ?>%)</td>
                        <th>亏损交易</th>
                        <td><?= $historyLossCount ?> (<?= Utils::formatFloatOrInt($historyLossPercent, 5) ?>%)</td>
                    </tr>-->
                    </tbody>
                </table>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="ibox-title">
                    <h5>总收益</h5>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-content" id="sumProfitByDay"></div>
                    </div>
                </div>
            </div>
        </div>
        <hr>
        <div class="row">
            <div class="col-md-12">
                <div class="ibox-title">
                    <h5>交易手数</h5>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-content" id="volumeSumByDay"></div>
                    </div>
                </div>
            </div>
        </div>
        <hr>
        <div class="row">
            <div class="col-md-4">
                <div class="ibox-title">
                    <h5>总笔数</h5>
                    <span class="pull-right label label-warning"><?= $historyTotalCount ?></span>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-pie-content" id="totalCount"></div>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="ibox-title">
                    <h5>交易货币分布</h5>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-pie-content" id="symbolCount"></div>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="ibox-title">
                    <h5>交易来源分布</h5>
                </div>
                <div class="ibox-content">
                    <div class="flot-chart">
                        <div class="flot-chart-pie-content" id="reasonCount"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<?php $this->beginBlock('footer_script'); ?>
<!-- Flot -->
<script src="<?= STATIC_URL ?>/ui/js/plugins/flot/jquery.flot.js"></script>
<script src="<?= STATIC_URL ?>/ui/js/plugins/flot/jquery.flot.tooltip.min.js"></script>
<script src="<?= STATIC_URL ?>/ui/js/plugins/flot/jquery.flot.resize.js"></script>
<script src="<?= STATIC_URL ?>/ui/js/plugins/flot/jquery.flot.pie.js"></script>
<script src="<?= STATIC_URL ?>/ui/js/plugins/flot/jquery.flot.time.js"></script>
<script>
    $(document).ready(function () {
        var sumProfitByDay = <?= $sumProfitByDay ?>;
        $.plot($('#sumProfitByDay'), [{
            data: sumProfitByDay
        }], {
            xaxes: [{
                mode: 'time',
                timeformat: '%y/%m/%d'
            }],
            colors: ['#1ab394'],
            grid: {
                color: '#999999',
                hoverable: true,
                clickable: true,
                tickColor: '#D4D4D4',
                borderWidth: 0,
                hoverable: true //IMPORTANT! this is needed for tooltip to work,
            },
            tooltip: true,
            tooltipOpts: {
                content: '截止 %x 的总收益 %y ',
                xDateFormat: '%y/%m/%d',
                onHover: function (flotItem, $tooltipEl) {
                    // console.log(flotItem, $tooltipEl);
                }
            }
        })
        var volumeSumByDay = <?= $volumeSumByDay ?>;
        $.plot($('#volumeSumByDay'), [{
            data: volumeSumByDay
        }], {
            xaxes: [{
                mode: 'time',
                timeformat: '%y/%m/%d'
            }],
            yaxis: {
                tickDecimals: 2
            },
            colors: ['#1ab394'],
            grid: {
                color: '#999999',
                hoverable: true,
                clickable: true,
                tickColor: '#D4D4D4',
                borderWidth: 0,
                hoverable: true //IMPORTANT! this is needed for tooltip to work,
            },
            tooltip: true,
            tooltipOpts: {
                content: '截止 %x 的总交易手数 %y 手',
                xDateFormat: '%y/%m/%d',
                onHover: function (flotItem, $tooltipEl) {
                    // console.log(flotItem, $tooltipEl);
                }
            }
        })
        var data1 = <?= $symbolCount ?>;
        if (!$.isEmptyObject(data1)) {
            var plotObj1 = $.plot($('#symbolCount'), data1, {
                series: {
                    pie: {
                        show: true
                    }
                },
                grid: {
                    hoverable: true
                },
                tooltip: true,
                tooltipOpts: {
                    content: '%p.0%, %s', // show percentages, rounding to 2 decimal places
                    shifts: {
                        x: 20,
                        y: 0
                    },
                    defaultTheme: false
                }
            })
        }
        
        var data2 = <?= $reasonCount ?>;
        if (!$.isEmptyObject(data2)) {
            var plotObj2 = $.plot($('#reasonCount'), data2, {
                series: {
                    pie: {
                        show: true
                    }
                },
                grid: {
                    hoverable: true
                },
                tooltip: true,
                tooltipOpts: {
                    content: '%p.0%, %s', // show percentages, rounding to 2 decimal places
                    shifts: {
                        x: 20,
                        y: 0
                    },
                    defaultTheme: false
                }
            })
        }
        
        var data3 = [
            {
                label: 'Win',
                data: <?= $historyWinCount ?>,
            },
            {
                label: 'Loss',
                data: <?= $historyLossCount ?>,
            }
        ]
        var plotObj3 = $.plot($('#totalCount'), data3, {
            series: {
                pie: {
                    show: true
                }
            },
            grid: {
                hoverable: true
            },
            tooltip: true,
            tooltipOpts: {
                content: '%p.0%, %s', // show percentages, rounding to 2 decimal places
                shifts: {
                    x: 20,
                    y: 0
                },
                defaultTheme: false
            }
        })
    })
</script>
<?php $this->endBlock(); ?>