1

src/components/pages/dataBoard/teacher/chartList/teaAct.vue

@@ -8,16 +8,17 @@
         :row-class-name="tableRowClassName"
         class="tableClass"
       >
-        <el-table-column prop="rank" label="排行" min-width="50" align="center">
+        <el-table-column label="排行" min-width="50" align="center">
+          <template slot-scope="scope">{{ scope.$index + 1 }}</template>
         </el-table-column>
         <el-table-column
           prop="name"
-          label="类别名称"
+          label="课程名称"
           min-width="80"
           align="center"
         >
         </el-table-column>
-        <el-table-column prop="sum" label="授课次数" min-width="80" align="center">
+        <el-table-column prop="sum" label="作业数量" min-width="80" align="center">
         </el-table-column>
       </el-table>
     </div>
@@ -26,21 +27,26 @@
 
 <script>
 export default {
+  props: {
+    cWorkSum: {
+      type: Array,
+    },
+  },
   data() {
     return {
       tableData: [
-        { rank: "1", name: "一年级", sum: "2356" },
-        { rank: "2", name: "二年级", sum: "2256" },
-        { rank: "3", name: "三年级", sum: "2156" },
-        { rank: "4", name: "四年级", sum: "1356" },
-        { rank: "5", name: "五年级", sum: "1256" },
-        { rank: "6", name: "六年级", sum: "1056" },
-        { rank: "7", name: "七年级", sum: "956" },
-        { rank: "8", name: "八年级", sum: "856" },
+        // { rank: "1", name: "一年级", sum: "2356" },
+        // { rank: "2", name: "二年级", sum: "2256" },
+        // { rank: "3", name: "三年级", sum: "2156" },
+        // { rank: "4", name: "四年级", sum: "1356" },
+        // { rank: "5", name: "五年级", sum: "1256" },
+        // { rank: "6", name: "六年级", sum: "1056" },
+        // { rank: "7", name: "七年级", sum: "956" },
+        // { rank: "8", name: "八年级", sum: "856" },
       ],
     };
   },
-  methods: {
+  methods:{
     tableRowClassName({ row, rowIndex }) {
       if ((rowIndex + 1) % 2 === 0) {
         return "even_row";
@@ -48,6 +54,31 @@ export default {
         return "";
       }
     },
+    setArray(array){
+      this.tableData = []
+      for(var i = 0;i<array.length;i++){
+        this.tableData.push({
+          sum:array[i].count,
+          name:array[i].title
+        })
+      }
+      this.tableData = this.tableData.sort(function(a,b){
+        return b.sum - a.sum;
+      })
+    }
+  },
+  watch: {
+    cWorkSum: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        this.setArray(newValue)
+        this.$forceUpdate();
+      },
+    },
+  },
+  mounted() {
+    this.setArray(this.cWorkSum)
   },
 };
 </script>

src/components/pages/dataBoard/teacher/chartList/workTime.vue

@@ -12,9 +12,18 @@
 
 <script>
 export default {
+  props: {
+    workTime: {
+      type: Array,
+    },
+  },
   data() {
     return {
       chartObj: null,
+      ooption: {
+        ydata: [],
+        teacher: [],
+      },
       option: {
         tooltip: {
           trigger: "axis",
@@ -35,13 +44,15 @@ export default {
         },
         yAxis: {
           type: "category",
-          data: ["六年级", "五年级", "四年级", "三年级", "二年级", "一年级"],
+          // data: ["六年级", "五年级", "四年级", "三年级", "二年级", "一年级"],
+          data:[]
         },
         series: [
           {
             name: "2011",
             type: "bar",
-            data: [60, 110, 25, 130, 65, 80],
+            // data: [60, 110, 25, 130, 65, 80],
+            data:[],
             itemStyle: {
               normal: {
                 color: function (params) {
@@ -55,7 +66,7 @@ export default {
     };
   },
   methods: {
-    setChart() {
+    setChart(option) {
       // 雷达图显示的标签
       let newPromise = new Promise((resolve) => {
         resolve();
@@ -63,16 +74,54 @@ export default {
       //然后异步执行echarts的初始化函数
       newPromise.then(() => {
         const chartObj = this.$echarts.init(
+          //劳动课程
           this.$el.querySelector("#charts_canvas")
         );
+        this.option.yAxis.data = option.ydata;
+        this.option.series[0].data = option.teacher;
         // 初始化雷达图
         this.chartObj = chartObj;
         this.chartObj.setOption(this.option);
       });
     },
   },
+  watch: {
+    workTime: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        this.ooption = {
+          ydata: [],
+          teacher: [],
+        };
+        let _array = newValue;
+        for (var i = 0; i < _array.length; i++) {
+          this.ooption.ydata.push(_array[i].name);
+          this.ooption.teacher.push(_array[i].text);
+        }
+
+        if (!this.chartObj) {
+          this.setChart(this.ooption);
+        } else {
+          this.option.yAxis.data = this.ooption.ydata;
+          this.option.series[0].data = this.ooption.teacher;
+          this.chartObj.setOption(this.option);
+        }
+        this.$forceUpdate();
+      },
+    },
+  },
   mounted() {
-    this.setChart(this.option);
+    this.ooption = {
+      ydata: [],
+      teacher: [],
+    };
+    let _array = this.workTime;
+    for (var i = 0; i < _array.length; i++) {
+      this.ooption.ydata.push(_array[i].name);
+          this.ooption.teacher.push(_array[i].text + "小时");
+    }
+    this.setChart(this.ooption);
     var _this = this;
     window.addEventListener("resize", () => {
       if (_this.chartObj) {
@@ -80,9 +129,6 @@ export default {
       }
     });
   },
-  created() {
-    this.setChart();
-  },
 };
 </script>
 

src/components/pages/dataBoard/teacher/index.vue

@@ -38,7 +38,10 @@
           <div class="title">教师活跃度</div>
         </div>
         <div class="dataBox">
-          <TeaAct style="height: calc(100% - 20px)"></TeaAct>
+          <TeaAct
+            style="height: calc(100% - 20px)"
+            :cWorkSum="cWorkSum"
+          ></TeaAct>
         </div>
       </div>
     </div>
@@ -84,7 +87,9 @@
         </div>
         <div class="dataBox">
           <div class="allBox">
-            <div class="allBox_left"><FunPlot :pusaDep="pusaDep"></FunPlot></div>
+            <div class="allBox_left">
+              <FunPlot :pusaDep="pusaDep"></FunPlot>
+            </div>
             <div class="allBox_right">
               <div class="depth">
                 <span>上传课程</span>
@@ -278,7 +283,10 @@
               <div>{{ (loginTime / count).toFixed(0) }}小时</div>
             </div>
           </div>
-          <WorkTime style="height: calc(100% - 62px)"></WorkTime>
+          <WorkTime
+            style="height: calc(100% - 62px)"
+            :workTime="workTime"
+          ></WorkTime>
         </div>
       </div>
     </div>
@@ -344,6 +352,8 @@ export default {
         { value: 0, name: "授课" },
         { value: 0, name: "评价" },
       ],
+      cWorkSum: [],
+      workTime: [],
     };
   },
   mounted() {
@@ -549,21 +559,56 @@ export default {
             tevaTeachers: _tevaTeachers,
             sevaTeachers: _sevaTeachers,
           };
-          
+
           let _loginCount = res.data[21][0].count; //漏斗图查询登录
           let _workTeaCount = res.data[22][0].count; //漏斗图查询有交作业的课程老师数量
           // let allCount = _loginCount + _upCourseTeachers + _workTeaCount + _sevaTeachers;
-          for(var i = 0;i<this.pusaDep.length;i++){
-            if(this.pusaDep[i].name == "登录"){
-              this.pusaDep[i].value = ((_loginCount / _teachers) * 100).toFixed(0);
-            }else if(this.pusaDep[i].name == "创建"){
-              this.pusaDep[i].value = ((_upCourseTeachers / _teachers) * 100).toFixed(0);
-            }else if(this.pusaDep[i].name == "授课"){
-              this.pusaDep[i].value = ((_workTeaCount / _teachers) * 100).toFixed(0);
-            }else if(this.pusaDep[i].name == "评价"){
-              this.pusaDep[i].value = ((_sevaTeachers / _teachers) * 100).toFixed(0);
+          for (var i = 0; i < this.pusaDep.length; i++) {
+            if (this.pusaDep[i].name == "登录") {
+              this.pusaDep[i].value = ((_loginCount / _teachers) * 100).toFixed(
+                0
+              );
+            } else if (this.pusaDep[i].name == "创建") {
+              this.pusaDep[i].value = (
+                (_upCourseTeachers / _teachers) *
+                100
+              ).toFixed(0);
+            } else if (this.pusaDep[i].name == "授课") {
+              this.pusaDep[i].value = (
+                (_workTeaCount / _teachers) *
+                100
+              ).toFixed(0);
+            } else if (this.pusaDep[i].name == "评价") {
+              this.pusaDep[i].value = (
+                (_sevaTeachers / _teachers) *
+                100
+              ).toFixed(0);
             }
           }
+
+          let _cWorkSum = res.data[23]; //查询课程名称和作业数量
+          if (_cWorkSum.length > 8) {
+            this.cWorkSum = _cWorkSum.slice(0, 8);
+          } else {
+            this.cWorkSum = _cWorkSum;
+          }
+
+          let _workTime = res.data[24]; //查询教研室在线时长
+          var mergedArray = [];
+          _workTime.forEach((obj) => {
+            var foundItem = mergedArray.find((item) => item.name === obj.name);
+            if (foundItem) {
+              foundItem.text = String(
+                Number(foundItem.text) + Number(obj.text)
+              );
+            } else {
+              mergedArray.push({ name: obj.name, text: obj.text });
+            }
+          });
+          mergedArray.forEach((obj) => {
+            obj.text = (Number(obj.text) / 3600).toFixed(2); // 秒转小时，并保留两位小数
+          });
+          this.workTime = mergedArray;
           this.$forceUpdate();
         })
         .catch((err) => {