[mod]修改echarts图组件，增加课程信息统计

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/CourseInformationStatisticsBig.vue

@@ -1,24 +1,25 @@
+<!--课程信息统计-->
 <template>
     <div class="courseInformationStatistics">
         <div class="titleStyle">课程分布情况一览表</div>
         <div class="content">
             <div class="leftContent">
-                <div>课程总数：<span class="textColor">118&nbsp;门</span></div>
+                <div>课程总数：<span class="textColor">{{classCount}}&nbsp;门</span></div>
                 <div class="whiteBor"></div>
-                <div>国家课程：<span class="textColor">118&nbsp;门</span></div>
-                <div>地方课程：<span class="textColor">118&nbsp;门</span></div>
-                <div>校本课程：<span class="textColor">118&nbsp;门</span></div>
+                <div>国家课程：<span class="textColor" >{{country}}&nbsp;门</span></div>
+                <div>地方课程：<span class="textColor" >{{place}}&nbsp;门</span></div>
+                <div>校本课程：<span class="textColor" >{{school}}&nbsp;门</span></div>
             </div>
             <div class="rightContent">
                 <!-- 内容 -->
                 <m-echarts
-                        :echartStyle="s"
-                        :titleText="a"
-                        :tooltipFormatter="b"
-                        :opinion="c"
-                        :seriesName="d"
-                        :opinionData="e"
-                        v-on:currentEchartData="getEchartData"
+                        :echartStyle="courseInformation.style"
+                        :tooltipFormatter="courseInformation.b"
+                        :opinion="courseInformation.xAxis"
+                        :seriesName="courseInformation.count"
+                        :opinionData="courseInformation.opinionData"
+                        v-on:courseInformation="getSelectCourseCount"
+                        v-if="barFlag"
                 ></m-echarts>
             </div>
         </div>
@@ -27,34 +28,80 @@
 </template>
 
 <script>
-    import mEcharts from './utils/PieEcharts'
+    import mEcharts from './utils/PieEcharts';
+    import InterfaceConfig from './utils/interfaceConfig';
     export default {
         name: 'CourseInformationStatisticsBig',
         components: {
             mEcharts
         },
-        data(){
+        data:function(){
             return {
-                b:'销售数量',
-                c:['香蕉','苹果','橘子'],
-                d:'销售统计',
-                e:[
-                    {value:3, name:'香蕉'},
-                    {value:3, name:'苹果'},
-                    {value:3, name:'橘子'}
-                ],
-                s: {
-                    height: ''
-                }
+                barFlag:false,
+                courseInformation:{
+                    b:'课程数',
+                    xAxis:[],
+                    count:'课程分布',
+                    opinionData:[
+
+                    ],
+                    style: {
+                        height: ''
+                    }
+                },
+                classCount:"",
+                country:"",
+                place:"",
+                school:"",
             }
+
         },
         created(){
             // 获取屏幕高度
-            this.s.height = '370px';
+            this.courseInformation.style.height = '370px';
+        },
+        mounted() {
+            this.getSelectCourseCount();
         },
         methods: {
-            getEchartData(val){
-                console.log(val);
+            getSelectCourseCount:function () {
+                let params={
+                    bureauId:this.BaseConfig.person_info_my.bureau_id,
+                };
+                this.InterfaceConfig.callInterface([{
+                    url:InterfaceConfig.getSelectCourseCount.url,
+                    params:params,
+                    method:InterfaceConfig.getSelectCourseCount.method,
+                    isTestLogin:InterfaceConfig.getSelectCourseCount.isTestLogin,
+                    isOfficeInterface:false
+                }],(result)=> {
+                    console.log(result[0].data.success,"**********")
+                    if(result[0].data.success){
+                        this.barFlag=true;
+                        let data=result[0].data;
+                        let xAxis=[];
+                        let opinionData=[];
+                        let country=[];
+                        let classCount=[];
+                        let place=[];
+                        let school=[];
+                        if(data.list.length!==0){
+                            data.list.forEach((item,index)=>{
+                                xAxis.push(item.xAxis);
+                                opinionData.push({name:item.xAxis,value:item.count});
+                            });
+                            console.log(xAxis,"xAxis");
+                            console.log(opinionData,"opinionData");
+                            //
+                            this.courseInformation.xAxis=xAxis;
+                            this.courseInformation.opinionData=opinionData;
+                            this.classCount=data.list[0].count+data.list[1].count+data.list[2].count;
+                            this.country=data.list[0].count;
+                            this.place=data.list[1].count;
+                            this.school=data.list[2].count;
+                        }
+                    }
+                })
             }
         }
     }

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/CourseInformationStatisticsSmall.vue

@@ -0,0 +1,125 @@
+<!--课程信息统计-->
+<template>
+    <div class="courseInformationStatistics">
+        <div class="titleStyle">课程分布情况一览表</div>
+        <div class="content">
+                <m-echarts
+                        :echartStyle="courseInformation.style"
+                        :tooltipFormatter="courseInformation.b"
+                        :opinion="courseInformation.xAxis"
+                        :seriesName="courseInformation.count"
+                        :opinionData="courseInformation.opinionData"
+                        v-on:courseInformation="getSelectCourseCount"
+                        v-if="barFlag"
+                       >
+                ></m-echarts>
+            <div>课程总数：<span class="textColor">{{classCount}}&nbsp;门</span></div>
+            <div class="lineContent">
+                <div>国家：<span class="textColor">{{country}}&nbsp;门</span></div>
+                <div>地方：<span class="textColor">{{place}}&nbsp;门</span></div>
+                <div>校本：<span class="textColor">{{school}}&nbsp;门</span></div>
+            </div>
+        </div>
+
+    </div>
+</template>
+
+<script>
+    import mEcharts from './utils/PieEcharts';
+    import InterfaceConfig from './utils/interfaceConfig';
+    export default {
+        name: 'CourseInformationStatisticsBig',
+        components: {
+            mEcharts
+        },
+        data(){
+            return {
+                barFlag:false,
+                courseInformation:{
+                    b:'课程数',
+                    xAxis:[],
+                    count:'课程分布',
+                    opinionData:[
+
+                    ],
+                    style: {
+                        height: ''
+                    }
+                },
+                classCount:"",
+                country:"",
+                place:"",
+                school:"",
+            }
+        },
+        created(){
+            // 获取屏幕高度
+            this.courseInformation.style.height = '370px';
+        },
+        mounted() {
+            this.getSelectCourseCount();
+        },
+        methods: {
+            getSelectCourseCount:function () {
+                let params={
+                    bureauId:this.BaseConfig.person_info_my.bureau_id,
+                };
+                this.InterfaceConfig.callInterface([{
+                    url:InterfaceConfig.getSelectCourseCount.url,
+                    params:params,
+                    method:InterfaceConfig.getSelectCourseCount.method,
+                    isTestLogin:InterfaceConfig.getSelectCourseCount.isTestLogin,
+                    isOfficeInterface:false
+                }],(result)=> {
+                    if(result[0].data.success){
+                        this.barFlag=true;
+                        let data=result[0].data;
+                        let xAxis=[];
+                        let opinionData=[];
+                        if(data.list.length!==0){
+                            data.list.forEach((item,index)=>{
+                                xAxis.push(item.xAxis);
+                                opinionData.push({name:item.xAxis,value:item.count});
+                            });
+                            console.log(xAxis,"xAxis");
+                            console.log(opinionData,"opinionData");
+                            //
+                            this.courseInformation.xAxis=xAxis;
+                            this.courseInformation.opinionData=opinionData;
+                            this.classCount=data.list[0].count+data.list[1].count+data.list[2].count;
+                            this.country=data.list[0].count;
+                            this.place=data.list[1].count;
+                            this.school=data.list[2].count;
+                        }
+                    }
+                })
+            }
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    .courseInformationStatistics {
+        font-size: 1rem;
+        margin: 1rem;
+        .titleStyle {
+            text-align: center;
+            height: 2rem;
+        }
+        .content{
+            text-align: center;
+            .textColor{
+                color: #02A7F2;
+                font-weight: bold;
+            }
+        }
+        .lineContent{
+            margin-top: 10px;
+        }
+        .lineContent div{
+            float: left;
+            width: 33.3%;
+        }
+    }
+
+</style>

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/image/blueBook.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="30px" height="34px" xmlns="http://www.w3.org/2000/svg">
+  <g transform="matrix(1 0 0 1 -485 -291 )">
+    <path d="M 30 3.71155957935735  C 29.9319029211295 1.67963068938656  28.365952083739 0.0496592015579354  26.3942366407011 0.0496592015579354  L 23 0.0496592015579354  L 23 14.3140386348588  L 20.2040720447907 11.8001014449854  L 17 14.3140386348588  L 17 0  L 3.53766628042843 0  C 1.56444800389484 0.0496592015579354  0 1.67963068938656  0 3.71155957935735  L 0 30.2816275754625  C 0 32.3254789444985  1.56444800389484 33.9503407984421  3.53766628042843 34  L 26.4618640895813 34  C 28.3659521129503 33.9503407984421  29.9995303700097 32.3203693106134  30 30.2816275754625  L 30 3.71155957935735  Z M 5.38164102239533 6.43669477117819  L 5.38164102239533 27.6263239805258  C 5.38164102239533 28.4421613300876  4.8376158812074 29.1217419084713  4.22596329113924 29.1217419084713  C 3.61431070107108 29.1217419084713  3.06878272638754 28.4404581187926  3 27.6263239805258  L 3 6.43669477117819  C 3.06878272638754 5.62085742161636  3.61280786757546 4.94127684323272  4.22596329113924 4.94127684323272  C 4.83911871470302 4.94127684323272  5.38164102239533 5.61915421032132  5.38164102239533 6.43669477117819  Z " fill-rule="nonzero" fill="#61a5e8" stroke="none" transform="matrix(1 0 0 1 485 291 )" />
+  </g>
+</svg>

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/image/book.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1621479411225" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4902" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M817.14688 813.33248l-307.33312 40.46336-301.25568-40.46336c-33.52576 0-60.6976-27.17696-60.6976-60.6976V246.81472c0-33.52576 27.17184-60.6976 60.6976-60.6976l301.25568 41.47712 307.328-41.47712c33.52576 0 60.6976 27.17184 60.6976 60.6976v505.81504c0.00512 33.52576-27.17184 60.70272-60.69248 60.70272z m0 0" fill="#E4E4E4" p-id="4903"></path><path d="M509.95712 407.99232a21.97504 21.97504 0 0 1-21.98016-21.98016V158.6432a21.98528 21.98528 0 0 1 43.96032 0v227.36896a21.98016 21.98016 0 0 1-21.98016 21.98016z m278.57408 194.39616l-279.6288 32.9728-277.6832-32.9728a21.98016 21.98016 0 0 1-9.84576-41.64096c3.87072-1.9456 8.2944-2.5088 12.60032-1.9968l274.75968 32.64512 277.0688-32.65024c4.29568-0.50688 8.70912 0.06144 12.57472 2.00192a21.98016 21.98016 0 0 1-9.84576 41.64096z m0 157.30176l-279.6288 32.97792-277.6832-32.97792a21.97504 21.97504 0 1 1 0-43.96032l277.51424 32.96768 279.80288-32.96768a21.98528 21.98528 0 1 1-0.00512 43.96032z m0 0" fill="#949494" p-id="4904"></path><path d="M947.9936 70.912c-10.32192-2.8416-21.19168-3.04128-31.80544-1.60256l-395.74528 53.40672c-7.77728 1.0496-15.6672 1.03936-23.42912-0.03584L110.51008 69.47328c-14.5152-2.00192-29.4912-0.72704-42.9824 4.97664-29.58336 12.5184-50.34496 41.80992-50.34496 75.95008v686.91456c0 44.06784 34.57536 80.05632 78.08 82.31424a110.9504 110.9504 0 0 1 8.64768 0.6912l393.38496 52.84352c7.58784 1.01376 15.2832 1.024 22.87104 0.03072l181.02272-23.83872a24.4224 24.4224 0 0 0 21.0176-27.4432l-0.1024-0.768a24.4224 24.4224 0 0 0-27.29472-20.992l-155.74016 19.88096a237.2096 237.2096 0 0 1-60.53888-0.07168l-382.0288-49.6896a30.47424 30.47424 0 0 0-2.46272-0.18944 27.12064 27.12064 0 0 1-17.88416-7.84896 26.8288 26.8288 0 0 1-7.92064-19.01568V151.12192c0-13.82912 10.48576-25.216 23.9872-26.7264a21.7344 21.7344 0 0 1 5.25312 0.11776L478.3104 174.08a236.7488 236.7488 0 0 0 60.53888 0.0768l389.1456-49.65376a21.632 21.632 0 0 1 5.1456-0.11264c6.07744 0.67072 11.776 3.37408 16.13824 7.71072a26.84416 26.84416 0 0 1 7.91552 19.0208V843.2128h-0.00512a26.82368 26.82368 0 0 1-7.91552 19.01568 27.136 27.136 0 0 1-17.92 7.85408 29.08672 29.08672 0 0 0-2.4064 0.1792l-38.85056 4.96128a24.41728 24.41728 0 1 0 6.28224 48.43008l25.52832-3.36384a105.22112 105.22112 0 0 1 8.4224-0.66048c43.55584-2.2016 78.19776-38.2208 78.19776-82.32448V150.4c-0.01024-37.9392-25.64608-69.89312-60.53376-79.488z" fill="#949494" p-id="4905"></path></svg>

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/utils/BarEcharts.vue

@@ -0,0 +1,112 @@
+<template>
+    <div>
+        <!-- echart表格 -->
+        <div  ref="bar_dv" :style="echartStyle"></div>
+    </div>
+</template>
+
+<script>
+    import * as echarts from 'echarts';
+    export default {
+        // 样式
+        props: {
+            echartStyle: {
+                type: Object,
+                default(){
+                    return {}
+                }
+            },
+            id: {
+                type: String,
+                default(){
+                    return "barChart"
+                }
+            }, xAxisData: {
+                type: Array,
+                default(){
+                    return []
+                }
+            },
+            legendData: {
+                type: Array,
+                default(){
+                    return []
+                }
+            },
+            seriesData: {
+                type: Array,
+                default(){
+                    return []
+                }
+            },
+            xAxisName: {
+                type: String,
+                default(){
+                    return null
+                }
+            },
+            yAxisName: {
+                type: String,
+                default(){
+                    return null
+                }
+            },
+
+        },
+        data(){
+            return {
+                //
+            }
+        },
+
+        methods: {
+            drawLine(id) {
+                this.charts = echarts.init(this.$refs.bar_dv);
+                this.charts.setOption({
+                    xAxis: {
+                        type: "category",
+                        // boundaryGap: false,
+                        data: this.xAxisData,
+                        name:this.xAxisName,
+                    },
+                    yAxis: {
+                        type: "value",
+                        name:this.yAxisName
+                    },
+                    grid: {
+                        left: '15',
+                        right: '40',
+                        bottom: '30',
+                        containLabel: true
+                    },
+                    legend: {
+                        bottom: '5',
+                        name:"自动接警",
+                        data: this.legendData
+                    },
+                    series: this.seriesData,
+                    tooltip : {
+                        trigger: 'axis',
+                        axisPointer: {
+                            type: 'cross',
+                            label: {
+                                backgroundColor: '#6a7985'
+                            }
+                        }
+                    }
+                });
+            },
+        },
+        mounted() {
+            this.$nextTick(function() {
+                this.drawLine('barChart')
+            })
+        },
+    };
+</script>
+
+<style scoped>
+    #barChart{
+        width: 100%;
+    }
+</style>

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/utils/LineEcharts.vue

@@ -1,7 +1,7 @@
 <template>
     <div>
         <!-- echart表格 -->
-        <div id="lineChart" :style="echartStyle"></div>
+        <div ref="line_dv" :style="echartStyle"></div>
     </div>
 </template>
 
@@ -45,7 +45,7 @@
 
         methods: {
             drawLine(id) {
-                this.charts = echarts.init(document.getElementById(id));
+                this.charts = echarts.init(this.$refs.line_dv);
                 this.charts.setOption({
                     xAxis: {
                         type: "category",

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/utils/PieEcharts.vue

@@ -2,7 +2,7 @@
 <template>
     <div>
         <!-- echart表格 -->
-        <div id="myChart" :style="echartStyle"></div>
+        <div ref="pie_dv" id="myChart" :style="echartStyle"></div>
     </div>
 </template>
 
@@ -71,7 +71,7 @@
             },
             // 绘制饼状图
             drawPie(id){
-                this.charts = echarts.init(document.getElementById(id));
+                this.charts = echarts.init(this.$refs.pie_dv);
                 this.charts.on("click", this.eConsole);
                 this.charts.setOption({
                     title: {

src/views/superFusionPlatform/mainPlatform/moduleAndLayout/moduleCom/educationalWisdom/utils/interfaceConfig.js

@@ -39,6 +39,16 @@ const InterfaceConfig = {
      * page_size 必填 number 每页条数
      * */
     "getEvaluateTeacherPageList":{url:"/evaluateCourse/getEvaluateTeacherPageList",method:"get",isTestLogin:false},
+    /*
+   *选排课-课程信息统计
+   * bureauId 必填 number 机构ID
+   * */
+    "getSelectCourseCount":{url:"/selectCourse/statistics/subjectCourse/getSelectCourseCount",method:"get",isTestLogin:false},
+    /*
+   *选排课-学生选科统计
+   * bureauId 必填 number 机构ID
+   * */
+    "getStudentApplyCount":{url:"/selectCourse/statistics/subjectCourse/getStudentApplyCount",method:"get",isTestLogin:false},
 };
 
 export default InterfaceConfig