{% extends 'base.html' %}

{% block content %}
{% load static  %}

<script src="{% static 'js/plugins/echarts/echarts.min.js' %}"></script>
<script src="{% static 'js/plugins/echarts/shine.js' %}"></script>
<script src="{% static 'js/utils.js'  %}"></script>
                    <script src="{% static 'js/warning.js' %}"></script>

<style type="text/css">
    body {
        background-color: #FFF !important;
    }
</style>
<div class="echarts" id="echarts" style="width:100%;height:100%;padding:20px"></div>


<script type="text/javascript">
    $(function () {
        var lineChart = echarts.init(document.getElementById("echarts"), "shine");
        $.get("{% url 'dataReport:getFundsNormalChartJson' %}", function (obj) {
            var option = {
                title: {
                    text: '药剂库存价值统计',
                    subtext: '',
                    x: 'center'
                },
                tooltip: {
                    trigger: 'item',
                    formatter: "{a} <br/>{b} : {c}元 ({d}%)"
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                    data: obj.data.legend
                },
                series: [
                    {
                        name: '在库价值',
                        type: 'pie',
                        radius: '55%',
                        center: ['50%', '60%'],
                        data: obj.data.data,
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            };
            var lineoption = option;
            lineChart.setOption(lineoption);
            $(window).resize(lineChart.resize);
        });
    })
</script>

{% endblock %}