统计

src/main/vue/src/views/showStatistic/Dashboard.vue

@@ -33,11 +33,11 @@
 <script>
 import { GridLayout, GridItem } from 'vue-grid-layout';
 import DatasWidget from './DatasWidget';
-import ArtTypeWidget from './ArtTypeWidget';
+import ArtTypeWidget from '@/widgets/ArtTypeWidget';
 import ExamWidegt from './ExamWidegt';
 import PassWidget from './PassWidget';
 import RateWidget from './RateWidget';
-import PieChartWidget from '@/widgets/PieChartWidget';
+import RateYearWidget from './RateYearWidget';
 
 export default {
     created() {},
@@ -46,9 +46,9 @@ export default {
             layout: [
                 { x: 0, y: 0, w: 12, h: 5, i: '0', name: 'DatasWidget' },
                 { x: 0, y: 6, w: 6, h: 12, i: '2', name: 'PassWidget' },
-                { x: 6, y: 6, w: 6, h: 12, i: '3', name: 'ExamWidegt' },
-                { x: 0, y: 18, w: 6, h: 12, i: '4', name: 'ArtTypeWidget' },
-                { x: 6, y: 18, w: 6, h: 12, i: '4', name: 'PieChartWidget' },
+                { x: 6, y: 6, w: 6, h: 12, i: '4', name: 'ArtTypeWidget' },
+                { x: 0, y: 18, w: 6, h: 12, i: '3', name: 'ExamWidegt' },
+                { x: 6, y: 18, w: 6, h: 12, i: '5', name: 'RateYearWidget' },
                 { x: 0, y: 24, w: 12, h: 12, i: '6', name: 'RateWidget' }
             ],
             editable: false
@@ -67,7 +67,7 @@ export default {
         ArtTypeWidget,
         ExamWidegt,
         PassWidget,
-        PieChartWidget,
+        RateYearWidget,
         RateWidget
     }
 };

src/main/vue/src/views/showStatistic/RateWidget.vue

@@ -46,7 +46,7 @@ export default {
                         formatter: '{b}年<br/>{a0}: {c0}<br />{a1}: {c1}<br />{a2}: {c2}%'
                     },
                     legend: {
-                        data: ['通过数量', '未通过数量', '通过率']
+                        data: ['通过数量', '通过数量', '通过率']
                     },
                     xAxis: [
                         {

src/main/vue/src/views/showStatistic/RateYearWidget.vue

@@ -0,0 +1,99 @@
+<template>
+    <widget-card :bodyStyle="bodyStyle" ref="container">
+        <template #header>
+            <span>等级评定</span>
+            <el-select @change="setChart" style="float:right" v-model="chooseYear" size="mini" placeholder="请选择">
+                <el-option v-for="item in years" :key="item" :label="item" :value="item"> </el-option>
+            </el-select>
+        </template>
+        <div ref="chart" class="chart" style="flex-grow:1"></div>
+    </widget-card>
+</template>
+<script>
+import WidgetCard from '@/widgets/WidgetCard';
+import * as echarts from 'echarts';
+import widget from '@/mixins/widget';
+
+export default {
+    data() {
+        return {
+            myChart: null,
+            bodyStyle: {
+                display: 'flex'
+            },
+            types: [
+                { name: '优秀', complain: 20, unitType: 'GRADING_ORGANIZATION' },
+                { name: '合格', complain: 70, unitType: 'GRADING_ORGANIZATION' },
+                { name: '未参加', complain: 23, unitType: 'GRADING_ORGANIZATION' },
+                { name: '取消参评', complain: 5, unitType: 'GRADING_ORGANIZATION' }
+            ],
+            chooseYear: '2021'
+        };
+    },
+    computed: {
+        years() {
+            return Object.keys({ ...this.allData });
+        }
+    },
+    mounted() {
+        setTimeout(() => {
+            this.myChart = echarts.init(this.$refs.chart);
+            this.setChart();
+        });
+    },
+    methods: {
+        setChart() {
+            let res = [...this.types];
+            let data = [];
+
+            res.forEach(item => {
+                data.push({
+                    name: item.name,
+                    value: item.complain
+                });
+            });
+
+            let option = {
+                tooltip: {
+                    trigger: 'item',
+                    alwaysShowContent: true,
+                    formatter: '{a} <br/>{b}: {c} ({d}%)'
+                },
+                legend: {
+                    data: [...data].map(item => {
+                        return item.name;
+                    })
+                },
+                series: [
+                    {
+                        name: '投诉数量',
+                        type: 'pie',
+                        selectedMode: 'single',
+                        radius: [0, '60%'],
+                        label: {
+                            position: 'inner',
+                            fontSize: 14
+                        },
+                        labelLine: {
+                            show: false
+                        },
+                        data: data,
+                        select: {
+                            label: {
+                                show: true
+                            }
+                        }
+                    }
+                ]
+            };
+
+            this.myChart.setOption(option);
+        }
+    },
+    components: {
+        WidgetCard
+    },
+    mixins: [widget]
+};
+</script>
+<style lang="less" scoped></style>

src/main/vue/src/widgets/ArtTypeWidget.vue

@@ -21,7 +21,20 @@ export default {
             bodyStyle: {
                 display: 'flex'
             },
-            types: [],
+            types: [
+                { name: '南京艺术学院', complain: 20, unitType: 'ORGANIZATION' },
+                { name: '江苏省朗诵协会', complain: 10, unitType: 'ORGANIZATION' },
+                { name: '江苏省文化馆', complain: 13, unitType: 'ORGANIZATION' },
+                { name: '江苏省演艺集团', complain: 12, unitType: 'ORGANIZATION' },
+                { name: '江苏省戏剧学校', complain: 20, unitType: 'ORGANIZATION' },
+                { name: '江苏省音乐家协会', complain: 18, unitType: 'ORGANIZATION' },
+                { name: '中国艺术科技研究所', complain: 19, unitType: 'ORGANIZATION' },
+                { name: '北京迷笛演出有限公司', complain: 15, unitType: 'ORGANIZATION' },
+                { name: '北京舞蹈学院', complain: 8, unitType: 'ORGANIZATION' },
+                { name: '国家京剧院', complain: 6, unitType: 'ORGANIZATION' },
+                { name: '山东省中联舞蹈艺术研究院', complain: 9, unitType: 'ORGANIZATION' },
+                { name: '上海金口才朗诵演讲团', complain: 14, unitType: 'ORGANIZATION' }
+            ],
             chooseYear: '2021'
         };
     },
@@ -31,6 +44,10 @@ export default {
         }
     },
     mounted() {
+        setTimeout(() => {
+            this.myChart = echarts.init(this.$refs.chart);
+            this.setChart();
+        });
         // this.$http.post('/reportStatistic/all', { sort: 'complain,desc', size: 20 }, { body: 'json' }).then(res => {
         //     this.types = res.content;
         //     this.myChart = echarts.init(this.$refs.chart);
@@ -40,7 +57,7 @@ export default {
     methods: {
         setChart() {
             let res = [...this.types];
-            // console.log(res);
+
             let data = [];
             let data2 = [];
 
@@ -57,42 +74,6 @@ export default {
                     });
                 }
             });
-            // let total = { ...this.allData }[year].dengji;
-
-            // let allNum = res.reduce((pre, cur) => {
-            //     return pre + (cur.children.length || 1);
-            // }, 0);
-
-            // let num = 0;
-
-            // res.forEach((item, index) => {
-            //     let _nums = 0;
-            //     if (item.children.length > 0) {
-            //         item.children.forEach((child, childIndex) => {
-            //             let _childVal = this.getRandomMoney(allNum - num, total);
-            //             num++;
-            //             total -= _childVal;
-            //             _nums += _childVal;
-            //             data2.push({
-            //                 name: child.name,
-            //                 value: _childVal
-            //             });
-            //         });
-            //     } else {
-            //         let _childVal = this.getRandomMoney(allNum - num, total);
-            //         num++;
-            //         total -= _childVal;
-            //         _nums += _childVal;
-            //         data2.push({
-            //             name: item.name,
-            //             value: _childVal
-            //         });
-            //     }
-            //     data.push({
-            //         name: item.name,
-            //         value: _nums
-            //     });
-            // });
 
             let option = {
                 tooltip: {