Merge branch 'beta' of https://git.cocorobo.cn/CocoRoboLabs/pbl-teacher-table into beta

src/components/pages/dataBoard/course/chartList/toolUse.vue

@@ -12,6 +12,11 @@
 
 <script>
 export default {
+  props: {
+    toolArray: {
+      type: Array,
+    },
+  },
   data() {
     return {
       chartObj: null,
@@ -39,21 +44,22 @@ export default {
             labelLine: {
               show: true,
             },
-            data: [
-              { value: 123, name: "思维类" },
-              { value: 200, name: "评价类" },
-              { value: 250, name: "学科类" },
-              { value: 450, name: "其他类" },
-              { value: 300, name: "逻辑类" },
-              { value: 100, name: "动作类" },
-            ],
+            // data: [
+            //   { value: 123, name: "思维类" },
+            //   { value: 200, name: "评价类" },
+            //   { value: 250, name: "学科类" },
+            //   { value: 450, name: "其他类" },
+            //   { value: 300, name: "逻辑类" },
+            //   { value: 100, name: "动作类" },
+            // ],
+            data: [],
           },
         ],
       },
     };
   },
   methods: {
-    setChart() {
+    setChart(arrArray) {
       // 雷达图显示的标签
       let newPromise = new Promise((resolve) => {
         resolve();
@@ -63,14 +69,33 @@ export default {
         const chartObj = this.$echarts.init(
           this.$el.querySelector("#charts_canvas")
         );
+        this.option.series[0].data = arrArray;
         // 初始化雷达图
         this.chartObj = chartObj;
         this.chartObj.setOption(this.option);
       });
     },
   },
+  watch: {
+    toolArray: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        let _array = newValue;
+
+        if (!this.chartObj) {
+          this.setChart(_array);
+        } else {
+          this.option.series[0].data = _array;
+          this.chartObj.setOption(this.option);
+        }
+        this.$forceUpdate();
+      },
+    },
+  },
   mounted() {
-    this.setChart(this.option);
+    let _array = this.toolArray;
+    this.setChart(_array);
     var _this = this;
     window.addEventListener("resize", () => {
       if (_this.chartObj) {
@@ -78,9 +103,6 @@ export default {
       }
     });
   },
-  created() {
-    this.setChart();
-  },
 };
 </script>
 

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

@@ -28,7 +28,10 @@
           <div class="title">工具使用</div>
         </div>
         <div class="dataBox">
-          <ToolUse style="height: calc(100% - 40px)"></ToolUse>
+          <ToolUse
+            style="height: calc(100% - 40px)"
+            :toolArray="toolList"
+          ></ToolUse>
         </div>
       </div>
     </div>
@@ -54,7 +57,11 @@
               </div>
             </div>
             <CateRank
-              style="height: calc(100% - 72px); margin-top: 10px"
+              style="
+                height: calc(100% - 72px);
+                margin-top: 10px;
+                overflow: auto;
+              "
             ></CateRank>
           </div>
           <div class="halfBox middleBox" style="align-items: flex-start">
@@ -131,6 +138,7 @@ export default {
       wCount: 0,
       cCount: 0,
       groupedArrayByMonth: [],
+      toolList: [],
       reInc: 0,
     };
   },
@@ -152,7 +160,8 @@ export default {
           this.wCount = res.data[0].length;
           this.cCount = res.data[1].length;
           var workArray = res.data[0];
-          let workList = [];
+          var courseList = res.data[1];
+          var cList = [];
           //将数据根据time里面的月份分成多个数组
           var groupedArrayByMonth = [];
           const date = new Date();
@@ -189,12 +198,68 @@ export default {
               }
             }
           }
-          this.reInc = (
-            (groupedArrayByMonth[groupedArrayByMonth.length - 1].course /
-              groupedArrayByMonth[groupedArrayByMonth.length - 2].course) *
-            100
-          ).toFixed(1);
+          if (
+            groupedArrayByMonth[groupedArrayByMonth.length - 1].course == 0 ||
+            groupedArrayByMonth[groupedArrayByMonth.length - 2].course == 0
+          ) {
+            this.reInc = 0;
+          } else {
+            this.reInc = (
+              (groupedArrayByMonth[groupedArrayByMonth.length - 1].course /
+                groupedArrayByMonth[groupedArrayByMonth.length - 2].course) *
+              100
+            ).toFixed(1);
+          }
           this.groupedArrayByMonth = groupedArrayByMonth;
+          for (var i = 0; i < courseList.length; i++) {
+            cList.push(JSON.parse(courseList[i].chapters));
+          }
+          var toolList = [
+            [10, 65], //互动类
+            [7, 1, 52, 3, 48], //思维类
+            [49], //协作类
+            [4, 45, 15, 16, 50, 41, 47], //测评类
+            [40], //评价类
+            [18, 21, 22, 23, 24, 32, 57, 63], //编程类
+            [28, 31, 39, 66, 67, 68], //学科类
+          ];
+          var toolAllArray = [
+            { name: "互动类", value: 0 },
+            { name: "思维类", value: 0 },
+            { name: "协作类", value: 0 },
+            { name: "测评类", value: 0 },
+            { name: "评价类", value: 0 },
+            { name: "编程类", value: 0 },
+            { name: "学科类", value: 0 },
+          ];
+          for (var p = 0; p < toolList.length; p++) {
+            for (var i = 0; i < cList.length; i++) {
+              for (var j = 0; j < cList[i].length; j++) {
+                for (
+                  var k = 0;
+                  k < cList[i][j].chapterInfo[0].taskJson.length;
+                  k++
+                ) {
+                  for (
+                    var q = 0;
+                    q <
+                    cList[i][j].chapterInfo[0].taskJson[k].toolChoose.length;
+                    q++
+                  ) {
+                    if (
+                      toolList[p].indexOf(
+                        cList[i][j].chapterInfo[0].taskJson[k].toolChoose[q]
+                          .tool[0]
+                      ) != -1
+                    ) {
+                      toolAllArray[p].value++;
+                    }
+                  }
+                }
+              }
+            }
+          }
+          this.toolList = toolAllArray;
         })
         .catch((err) => {
           this.isLoading = false;

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

@@ -12,13 +12,27 @@
 
 <script>
 export default {
+  props: {
+    monthArray: {
+      type: Array,
+    },
+  },
   data() {
     return {
       chartObj: null,
+      ooption: {
+        xdata: [],
+        teacher: [],
+      },
       option: {
+        tooltip: {
+          trigger: "axis",
+        },
         xAxis: {
           type: "category",
-          data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
+          boundaryGap: true,
+          // data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
+          data: [],
         },
         yAxis: {
           type: "value",
@@ -32,20 +46,17 @@ export default {
         },
         series: [
           {
-            data: [400, 510, 510, 350, 320, 510],
-            symbolSize: 10,
+            name: "教师",
             type: "line",
-            lineStyle: {
-              width: 3, // 设置线宽度
-              color: "#0E65F7", // 设置线颜色
-            },
+            // data: [220, 182, 191, 234, 290, 330]
+            data: [],
           },
         ],
       },
     };
   },
   methods: {
-    setChart() {
+    setChart(option) {
       // 雷达图显示的标签
       let newPromise = new Promise((resolve) => {
         resolve();
@@ -53,16 +64,54 @@ export default {
       //然后异步执行echarts的初始化函数
       newPromise.then(() => {
         const chartObj = this.$echarts.init(
+          //劳动课程
           this.$el.querySelector("#charts_canvas")
         );
+        this.option.xAxis.data = option.xdata;
+        this.option.series[0].data = option.teacher;
         // 初始化雷达图
         this.chartObj = chartObj;
         this.chartObj.setOption(this.option);
       });
     },
   },
+  watch: {
+    monthArray: {
+      immediate: true,
+      deep: true,
+      handler(newValue, oldValue) {
+        this.ooption = {
+          xdata: [],
+          teacher: [],
+        };
+        let _array = newValue;
+        for (var i = 0; i < _array.length; i++) {
+          this.ooption.xdata.push(_array[i].Month + "月");
+          this.ooption.teacher.push(_array[i].teacher);
+        }
+
+        if (!this.chartObj) {
+          this.setChart(this.ooption);
+        } else {
+          this.option.xAxis.data = this.ooption.xdata;
+          this.option.series[0].data = this.ooption.teacher;
+          this.chartObj.setOption(this.option);
+        }
+        this.$forceUpdate();
+      },
+    },
+  },
   mounted() {
-    this.setChart(this.option);
+    this.ooption = {
+      xdata: [],
+      teacher: [],
+    };
+    let _array = this.monthArray;
+    for (var i = 0; i < _array.length; i++) {
+      this.ooption.xdata.push(_array[i].Month + "月");
+      this.ooption.teacher.push(_array[i].teacher);
+    }
+    this.setChart(this.ooption);
     var _this = this;
     window.addEventListener("resize", () => {
       if (_this.chartObj) {
@@ -70,9 +119,6 @@ export default {
       }
     });
   },
-  created() {
-    this.setChart();
-  },
 };
 </script>
 

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

@@ -9,12 +9,12 @@
         <div class="dataBox">
           <div class="teafre">
             <div class="teaLeft">
-              <div>用户总数</div>
+              <div>教师总数</div>
               <div>{{ count }}</div>
             </div>
             <div class="teaLeft teaRigth">
-              <div>活跃频次</div>
-              <div>20.3%</div>
+              <div>周使用频次</div>
+              <div>{{weekCount}}</div>
             </div>
           </div>
           <div class="teafre" style="margin: 10px auto">
@@ -27,7 +27,7 @@
               <div>{{ (loginCount / count).toFixed(0) }}</div>
             </div>
           </div>
-          <TeaFre style="height: calc(100% - 150px)"></TeaFre>
+          <TeaFre style="height: calc(100% - 150px)" :monthArray="loginCountMonthArray"></TeaFre>
         </div>
       </div>
       <div class="bottom">
@@ -35,7 +35,7 @@
           <div class="title">教师活跃度</div>
         </div>
         <div class="dataBox">
-          <TeaAct style="height: calc(100% - 40px)"></TeaAct>
+          <TeaAct style="height: calc(100% - 20px)"></TeaAct>
         </div>
       </div>
     </div>
@@ -246,8 +246,8 @@ export default {
       count: 0,
       loginCount: 0,
       loginTime: 0,
-      courseCount: 0,
-      teacherCount: 0,
+      loginCountMonthArray:[],
+      weekCount:0
     };
   },
   mounted() {
@@ -262,14 +262,52 @@ export default {
         },
       ];
       this.ajax
-        .post(this.$store.state.api + "selectDataBoardSchool", params)
+        .post(this.$store.state.api + "selectDataBoardTeacher", params)
         .then((res) => {
           this.isLoading = false;
           this.count = res.data[0][0].count;
           this.loginCount = res.data[1][0].loginCount;
-          this.loginTime = parseInt(res.data[3][0].time) / 60 / 60;
-          this.courseCount = res.data[5][0].courseCount;
-          this.teacherCount = res.data[6][0].count;
+          this.loginTime = parseInt(res.data[2][0].time) / 60 / 60;
+
+
+
+          let loginCountMonthArray = [];
+          const date = new Date()
+          var Month = date.getMonth() + 1
+          var Year = date.getFullYear()
+          for (var i = Month; i > Month - 6; i--) {
+            if (i <= 0) {
+              loginCountMonthArray.push({
+                Year: Year - 1,
+                Month: 12 + i,
+                teacher: 0,
+              })
+            } else {
+              loginCountMonthArray.push({
+                Month: i,
+                Year: Year,
+                teacher: 0,
+              })
+            }
+          }
+
+          loginCountMonthArray = loginCountMonthArray.reverse()
+          let teacherLoginCountYear = res.data[3] // 教师半年登录次数统计
+
+          for (var i = 0; i < teacherLoginCountYear.length; i++) {
+            let _date = new Date(teacherLoginCountYear[i].create_at)
+            var _month = _date.getMonth() + 1
+            var _year = _date.getFullYear()
+            for (var j = 0; j < loginCountMonthArray.length; j++) {
+              if (_month == loginCountMonthArray[j].Month && _year == loginCountMonthArray[j].Year) {
+                loginCountMonthArray[j].teacher++
+                break;
+              }
+            }
+          }
+
+          this.loginCountMonthArray = loginCountMonthArray;
+          this.weekCount = res.data[4][0].count
         })
         .catch((err) => {
           this.isLoading = false;