tax-cash-flow-analysis.js 8.09 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199
frameworkModule.directive("dashboardTaxCashFlowAnalysis", ['$translate', '$filter', 'region', function ($translate, $filter, region) {
    'use strict';

    return {
        restrict: "A",
        templateUrl: "/app/dashboard/tax-cash-flow-analysis/tax-cash-flow-analysis.html",
        replace: true,
        scope: {
            options: "=dashboardTaxCashFlowAnalysis"
        },
        controller: "dashboardTaxCashFlowAnalysisController",
        link: function ($scope, $element, $attr) {
            var colourArray = ['#a32020', '#eb8c00', '#db536a', '#dc6900', '#e0301e', '#602320', '#3f3f40', '#968c6d'];

            var chartsContainer = $($element).find(".charts-container");
            var cashFlowChart = echarts.init(chartsContainer[0], 'vintage');

            //用于使echart自适应高度和宽度,通过窗体高宽计算容器高宽
            var resizeEchart = function (width) {
                width = width || $element.width();

                // 如果渲染页面时该控件处于隐藏状态,则$element.width()会为0,此时不去重新计算
                if (width > 0) {
                    $element.find('.charts-container').width(width + 'px');
                    $element.find('.charts-container').show();
                }
                else {
                    $element.find('.charts-container').hide();
                }
            };

            var resizeCashFlowChart = function () {
                //重置容器高宽
                resizeEchart();
                cashFlowChart.resize();
            };

            // display
            //  1 资产构成
            //  2 负债构成
            if ($scope.display === 1) {
                chartsContainer.css("height", 350);
                cashFlowChart.setOption({
                    title: {
                        subtext: '单位(千元)'
                    },
                    dataZoom: {
                        show: true,
                        realtime: true,
                        start: 0,
                        end: 34,
                        //zoomLock: false
                    },
                    grid: {
                        x2: 50,
                        y: 50
                    },
                    tooltip: {
                        trigger: 'axis',
                        formatter: function (params) {
                            return params[0].name + '<br/>'
                                + params[0].seriesName + ' : ' + params[0].value.toString().replace(/(\d{1,2})(?=(\d{3})+\.)/g, '$1,') + ' 千元<br/>'
                                + params[1].seriesName + ' : ' + params[1].value.toString().replace(/(\d{1,2})(?=(\d{3})+\.)/g, '$1,') + ' 千元<br/>'
                        }
                    },
                    color: colourArray,
                    legend: {
                        data: ['预测税额', '实交税额']
                    },
                    xAxis: [
                        {
                            type: 'category',
                            data: $scope.categoryAxisData
                        }
                    ],
                    yAxis: [
                        {
                            type: 'value',
                            name: '金额',
                            axisLabel: {
                                formatter: '{value}'
                            }
                        }

                    ],
                    series: [
                        {
                            name: '预测税额',
                            type: 'bar',
                            barWidth: 20,
                            yAxisIndex: 0,
                            label: {
                                normal: {
                                    show: true,
                                    position: 'top'
                                }
                            },
                            data: $scope.valueAxisData[0]
                        },
                        {
                            name: '实交税额',
                            type: 'bar',
                            barWidth: 20,
                            yAxisIndex: 0,
                            label: {
                                normal: {
                                    show: true,
                                    position: 'top'
                                }
                            },
                            data: $scope.valueAxisData[1]
                        }
                    ]
                });
            }

            if ($scope.display === 2) {
                chartsContainer.css("height", 300);
                cashFlowChart.setOption({
                    tooltip: {
                        trigger: 'axis',
                        formatter: function (params) {
                            return params[0].name + '<br/>'
                                + params[0].seriesName + ' : ' + params[0].value + ' %<br/>'
                                + params[1].seriesName + ' : ' + params[1].value + ' %<br/>'
                        }
                    },
                    legend: {
                        data: [$translate.instant('ReturnRatioMunicipalLevel'), $translate.instant('ReturnRatioDistrictLevel')]
                    },
                    color: colourArray,
                    toolbox: {
                        show: false,
                        feature: {
                            mark: {show: true},
                            dataView: {show: true, readOnly: false},
                            magicType: {show: true, type: ['line', 'bar', 'stack', 'tiled']},
                            restore: {show: true},
                            saveAsImage: {show: true}
                        }
                    },
                    grid: [{
                        left: region === 'zh-CN' ? '10%': '205px'
                    }],
                    calculable: true,
                    xAxis: [
                        {
                            type: 'value'
                        }
                    ],
                    yAxis: [
                        {
                            type: 'category',
                            data: [$translate.instant('OtherTaxes'), $translate.instant('LocalEducationAttach'), $translate.instant('EducationAttach'),
                                $translate.instant('ConstructionTax'), $translate.instant('CIT'), $translate.instant('VAT')]
                        }
                    ],
                    series: [
                        {
                            name: $translate.instant('ReturnRatioMunicipalLevel'),
                            type: 'bar',
                            stack: '总量',
                            itemStyle: {
                                normal: {
                                    label: {
                                        show: true, position: 'insideRight', formatter: function (x) {
                                            if (x.data == 0) {
                                                return '';
                                            }

                                            return x.data + ' %';
                                        }
                                    }
                                }
                            },
                            data: [0.00, 0.00, 0.00, 5.25, 3.75, 5.10]
                        },
                        {
                            name: $translate.instant('ReturnRatioDistrictLevel'),
                            type: 'bar',
                            stack: '总量',
                            itemStyle: {normal: {label: {show: true, position: 'insideRight', formatter: '{c} %'}}},
                            data: [60.00, 40.00, 20.00, 64.75, 50.00, 5.10]
                        }
                    ]
                });
            }

            resizeCashFlowChart();

            //用于使echart自适应宽度
            $(window).bind('resize', resizeCashFlowChart);

            $scope.$on('$destroy', function () {
                $(window).unbind('resize', resizeCashFlowChart);
            });
        }
    };
}]);