SanHQin 3 mesiacov pred
rodič
commit
14c58d4d9a

Rozdielové dáta súboru neboli zobrazené, pretože súbor je príliš veľký
+ 0 - 0
dist/static/css/app.5c68e68d870f7050844b32e8ace6cd83.css


Rozdielové dáta súboru neboli zobrazené, pretože súbor je príliš veľký
+ 0 - 0
dist/static/css/app.5c68e68d870f7050844b32e8ace6cd83.css.map


Rozdielové dáta súboru neboli zobrazené, pretože súbor je príliš veľký
+ 0 - 0
dist/static/js/app.bf066305150b58dbe9f8.js


Rozdielové dáta súboru neboli zobrazené, pretože súbor je príliš veľký
+ 0 - 0
dist/static/js/app.bf066305150b58dbe9f8.js.map


Rozdielové dáta súboru neboli zobrazené, pretože súbor je príliš veľký
+ 0 - 0
dist/static/js/manifest.161e82026ac2ae03ab6f.js.map


+ 235 - 235
src/components/pages/sassPlatform/view/dataCom/radarTeacher.vue

@@ -1,246 +1,246 @@
 <template>
-    <div class="data_body">
-        <div style="width: 100%; height: 100%" v-if="this.ooption.xdata.length">
-            <div id="charts_canvas" class="echart" style="width: 100%; height: 100%; "></div>
-        </div>
-        <div style="width: 100%; height: 100%;display: flex;align-items: center;justify-content: center;"
-            v-show="!this.ooption.xdata.length">暂无数据</div>
-    </div>
+  <div class="data_body">
+      <div style="width: 100%; height: 100%" v-if="this.ooption.xdata.length">
+          <div id="charts_canvas" class="echart" style="width: 100%; height: 100%; "></div>
+      </div>
+      <div style="width: 100%; height: 100%;display: flex;align-items: center;justify-content: center;"
+          v-show="!this.ooption.xdata.length">暂无数据</div>
+  </div>
 </template>
 
 <script>
 export default {
-    props: {
-        evCourseArray: {
-            type: Object,
-            default: function () {
-                return {}
-            }
-        },
-        evCourseArray2: {
-            type: Array,
-            default: []
-        },
-    },
-    data() {
-        return {
-            chartObj: null,
-            ooption: {
-                xdata: [],
-                xdata2: [],
-                sdata: [],
-            },
-            option: {
-                tooltip: {},
-                radar: {
-                    axisName: {
-                        color: "#000"
-                    },
-                    // shape: 'circle',
-                    indicator: [
-                        // { name: '目标一', max: 5 },
-                        // { name: '目标二', max: 5 },
-                        // { name: '目标三', max: 5 },
-                        // { name: '目标四', max: 5 },
-                        // { name: '目标五', max: 5 }
-                    ]
-                },
-                series: [
-                    {
-                        name: '教师考核',
-                        type: 'radar',
-                        data: [
-                            // {
-                            //     areaStyle: {
-                            //         opacity: 0.2,
-                            //         color: '#0061FF'
-                            //     },
-                            //     itemStyle: {
-                            //         color: '#0061FF',
-                            //         lineStyle: {
-                            //         color: '#0061FF'
-                            //         }
-                            //     },
-                            //     value: [],
-                            //     name: ''
-                            // }
-                        ]
-                    }
-                ]
-            },
-        };
-    },
-    methods: {
-        setChart(option) {
-            // 雷达图显示的标签
-            let newPromise = new Promise((resolve) => {
-                resolve();
-            });
-            //然后异步执行echarts的初始化函数
-            newPromise.then(() => {
-                const chartObj = this.$echarts.init(
-                    //劳动课程
-                    this.$el.querySelector("#charts_canvas")
-                );
-                this.option.radar.indicator = option.sdata;
-                if (option.xdata.length > 0) {
-                    this.option.series[0].data[0] = {
-                        // areaStyle: {
-                        //     opacity: 0.2,
-                        //     color: '#0061FF'
-                        // },
-                        itemStyle: {
-                            color: '#0061FF',
-                            lineStyle: {
-                                color: '#0061FF'
-                            }
-                        },
-                        value: option.xdata,
-                        name: '全体教师平均得分率'
-                    }
-                }
-                if (option.xdata2.length > 0) {
-                    this.option.series[0].data[1] = {
-                        // areaStyle: {
-                        //     opacity: 0.2,
-                        //     color: '#68bbc4'
-                        // },
-                        itemStyle: {
-                            color: '#68bbc4',
-                            lineStyle: {
-                                color: '#68bbc4'
-                            }
-                        },
-                        value: option.xdata2,
-                        name: '平均得分率'
-                    }
-                }
-                // this.option.series[0].data[0].value = option.xdata;
-                // 初始化雷达图
-                this.chartObj = chartObj;
-                this.chartObj.setOption(this.option);
-            });
-        },
-        setArray(array, type) {
-            this.ooption.sdata = Object.keys(this.evCourseArray).map((item) => {
-                return {
-                    name: item,
-                    max: 100,
-                };
-            });
-            if (type == 1) {
-                this.ooption.xdata = Object.keys(array).map((item) => {
-                    return array[item].cogScore;
-                })
-            }
-            if (this.evCourseArray2.length) {
-                let xdata2 = []
-                for(var i = 0; i < this.ooption.sdata.length; i++) {
-                    let name = this.ooption.sdata[i]
-                    for(var j = 0; j < this.evCourseArray2.length; j++) {
-                        if(this.evCourseArray2[j].name == name.name) {
-                            xdata2.push(this.evCourseArray2[j].cogScore)
-                            break
-                        }
-                    }
-                }
-                this.ooption.xdata2 = xdata2
-            }
-            if (!this.chartObj) {
-                this.setChart(this.ooption);
-            } else {
-                this.option.radar.indicator = this.ooption.sdata;
-                if (this.ooption.xdata.length > 0) {
-                    this.option.series[0].data[0] = {
-                        // areaStyle: {
-                        //     opacity: 0.2,
-                        //     color: '#0061FF'
-                        // },
-                        itemStyle: {
-                            color: '#0061FF',
-                            lineStyle: {
-                                color: '#0061FF'
-                            }
-                        },
-                        value: this.ooption.xdata,
-                        name: '全体教师平均得分率'
-                    }
-                }
-                if (this.ooption.xdata2.length > 0) {
-                    this.option.series[0].data[1] = {
-                        // areaStyle: {
-                        //     opacity: 0.2,
-                        //     color: '#68bbc4'
-                        // },
-                        itemStyle: {
-                            color: '#68bbc4',
-                            lineStyle: {
-                                color: '#68bbc4'
-                            }
-                        },
-                        value: this.ooption.xdata2,
-                        name: '平均得分率'
-                    }
-                }
-                this.chartObj.setOption(this.option);
-            }
-            setTimeout(() => {
-                if (this.chartObj) {
-                    this.chartObj.resize();
-                }
-            }, 200);
-            this.$forceUpdate();
-        },
-    },
-    watch: {
-        evCourseArray: {
-            immediate: true,
-            deep: true,
-            handler(newValue, oldValue) {
-                this.ooption.xdata = [];
-                this.setArray(newValue, 1)
-                this.$forceUpdate();
-            },
-        },
-        evCourseArray2: {
-            immediate: true,
-            deep: true,
-            handler(newValue, oldValue) {
-                this.ooption.xdata2 = [];
-                this.setArray(newValue, 2)
-                this.$forceUpdate();
-            },
-        },
-    },
-    mounted() {
-        this.ooption = {
-            xdata: [],
-            xdata2: [],
-            sdata: [],
-        }
-        this.setArray(this.evCourseArray, 1)
-        // this.setChart(this.ooption);
-        var _this = this;
-        window.addEventListener("resize", () => {
-            if (_this.chartObj) {
-                _this.chartObj.resize();
-            }
-        });
-    },
+  props: {
+      evCourseArray: {
+          type: Object,
+          default: function () {
+              return {}
+          }
+      },
+      evCourseArray2: {
+          type: Array,
+          default: []
+      },
+  },
+  data() {
+      return {
+          chartObj: null,
+          ooption: {
+              xdata: [],
+              xdata2: [],
+              sdata: [],
+          },
+          option: {
+              tooltip: {},
+              radar: {
+                  axisName: {
+                      color: "#000"
+                  },
+                  // shape: 'circle',
+                  indicator: [
+                      // { name: '目标一', max: 5 },
+                      // { name: '目标二', max: 5 },
+                      // { name: '目标三', max: 5 },
+                      // { name: '目标四', max: 5 },
+                      // { name: '目标五', max: 5 }
+                  ]
+              },
+              series: [
+                  {
+                      name: '教师考核',
+                      type: 'radar',
+                      data: [
+                          // {
+                          //     areaStyle: {
+                          //         opacity: 0.2,
+                          //         color: '#0061FF'
+                          //     },
+                          //     itemStyle: {
+                          //         color: '#0061FF',
+                          //         lineStyle: {
+                          //         color: '#0061FF'
+                          //         }
+                          //     },
+                          //     value: [],
+                          //     name: ''
+                          // }
+                      ]
+                  }
+              ]
+          },
+      };
+  },
+  methods: {
+      setChart(option) {
+          // 雷达图显示的标签
+          let newPromise = new Promise((resolve) => {
+              resolve();
+          });
+          //然后异步执行echarts的初始化函数
+          newPromise.then(() => {
+              const chartObj = this.$echarts.init(
+                  //劳动课程
+                  this.$el.querySelector("#charts_canvas")
+              );
+              this.option.radar.indicator = option.sdata;
+              if (option.xdata.length > 0) {
+                  this.option.series[0].data[0] = {
+                      // areaStyle: {
+                      //     opacity: 0.2,
+                      //     color: '#0061FF'
+                      // },
+                      itemStyle: {
+                          color: '#0061FF',
+                          lineStyle: {
+                              color: '#0061FF'
+                          }
+                      },
+                      value: option.xdata,
+                      name: '全体教师平均得分率'
+                  }
+              }
+              if (option.xdata2.length > 0) {
+                  this.option.series[0].data[1] = {
+                      // areaStyle: {
+                      //     opacity: 0.2,
+                      //     color: '#68bbc4'
+                      // },
+                      itemStyle: {
+                          color: '#68bbc4',
+                          lineStyle: {
+                              color: '#68bbc4'
+                          }
+                      },
+                      value: option.xdata2,
+                      name: '平均得分率'
+                  }
+              }
+              // this.option.series[0].data[0].value = option.xdata;
+              // 初始化雷达图
+              this.chartObj = chartObj;
+              this.chartObj.setOption(this.option);
+          });
+      },
+      setArray(array, type) {
+          this.ooption.sdata = Object.keys(this.evCourseArray).map((item) => {
+              return {
+                  name: item,
+                  max: 100,
+              };
+          });
+          if (type == 1) {
+              this.ooption.xdata = Object.keys(array).map((item) => {
+                  return array[item].cogScore;
+              })
+          }
+          if (this.evCourseArray2.length) {
+              let xdata2 = []
+              for(var i = 0; i < this.ooption.sdata.length; i++) {
+                  let name = this.ooption.sdata[i]
+                  for(var j = 0; j < this.evCourseArray2.length; j++) {
+                      if(this.evCourseArray2[j].name == name.name) {
+                          xdata2.push(this.evCourseArray2[j].cogScore)
+                          break
+                      }
+                  }
+              }
+              this.ooption.xdata2 = xdata2
+          }
+          if (!this.chartObj) {
+              this.setChart(this.ooption);
+          } else {
+              this.option.radar.indicator = this.ooption.sdata;
+              if (this.ooption.xdata.length > 0) {
+                  this.option.series[0].data[0] = {
+                      // areaStyle: {
+                      //     opacity: 0.2,
+                      //     color: '#0061FF'
+                      // },
+                      itemStyle: {
+                          color: '#0061FF',
+                          lineStyle: {
+                              color: '#0061FF'
+                          }
+                      },
+                      value: this.ooption.xdata,
+                      name: '全体教师平均得分率'
+                  }
+              }
+              if (this.ooption.xdata2.length > 0) {
+                  this.option.series[0].data[1] = {
+                      // areaStyle: {
+                      //     opacity: 0.2,
+                      //     color: '#68bbc4'
+                      // },
+                      itemStyle: {
+                          color: '#68bbc4',
+                          lineStyle: {
+                              color: '#68bbc4'
+                          }
+                      },
+                      value: this.ooption.xdata2,
+                      name: '平均得分率'
+                  }
+              }
+              this.chartObj.setOption(this.option);
+          }
+          setTimeout(() => {
+              if (this.chartObj) {
+                  this.chartObj.resize();
+              }
+          }, 200);
+          this.$forceUpdate();
+      },
+  },
+  watch: {
+      evCourseArray: {
+          immediate: true,
+          deep: true,
+          handler(newValue, oldValue) {
+              this.ooption.xdata = [];
+              this.setArray(newValue, 1)
+              this.$forceUpdate();
+          },
+      },
+      evCourseArray2: {
+          immediate: true,
+          deep: true,
+          handler(newValue, oldValue) {
+              this.ooption.xdata2 = [];
+              this.setArray(newValue, 2)
+              this.$forceUpdate();
+          },
+      },
+  },
+  mounted() {
+      this.ooption = {
+          xdata: [],
+          xdata2: [],
+          sdata: [],
+      }
+      this.setArray(this.evCourseArray, 1)
+      // this.setChart(this.ooption);
+      var _this = this;
+      window.addEventListener("resize", () => {
+          if (_this.chartObj) {
+              _this.chartObj.resize();
+          }
+      });
+  },
 };
 </script>
 
 <style scoped>
 .data_body {
-    height: 100%;
-    /* display: flex; */
-    position: relative;
-    border-radius: 5px;
-    /* border: 1px solid #eee; */
-    margin: 0 auto;
-    box-sizing: border-box;
-    padding: 0;
-    width: 90%;
-    background: #fff;
+  height: 100%;
+  /* display: flex; */
+  position: relative;
+  border-radius: 5px;
+  /* border: 1px solid #eee; */
+  margin: 0 auto;
+  box-sizing: border-box;
+  padding: 0;
+  width: 90%;
+  background: #fff;
 }
-</style>
+</style>

+ 79 - 64
src/components/pages/sassPlatform/view/dataCom/radarZong.vue

@@ -1,6 +1,9 @@
 <template>
   <div class="data_body">
-    <div style="width: 100%; height: 100%" v-if="this.ooption.xdata.length || this.ooption.xdata2.length">
+    <div
+      style="width: 100%; height: 100%"
+      v-if="this.ooption.xdata.length || this.ooption.xdata2.length"
+    >
       <div
         id="charts_canvas"
         class="echart"
@@ -86,6 +89,8 @@ export default {
       // 雷达图显示的标签
       let newPromise = new Promise(resolve => {
         resolve();
+      }).catch(err => {
+        console.log("👉err", err);
       });
       //然后异步执行echarts的初始化函数
       newPromise.then(() => {
@@ -95,7 +100,6 @@ export default {
         );
         this.option.radar.indicator = option.sdata;
         if (option.xdata.length > 0) {
-				
           this.option.series[0].data[0] = {
             // areaStyle: {
             //     opacity: 0.2,
@@ -110,10 +114,10 @@ export default {
             value: option.xdata,
             name: "全体教师平均得分率"
           };
-        }else{
-					// this.option.series[0].data.splice(0,1)
-					// this.option.series[0].data[0] = {};
-				}
+        } else {
+          // this.option.series[0].data.splice(0,1)
+          // this.option.series[0].data[0] = {};
+        }
         if (option.xdata2.length > 0) {
           this.option.series[0].data[1] = {
             // areaStyle: {
@@ -125,7 +129,7 @@ export default {
               // lineStyle: {
               //   color: "#68bbc4"
               // }
-							color: "#0061FF",
+              color: "#0061FF",
               lineStyle: {
                 color: "#0061FF"
               }
@@ -138,7 +142,9 @@ export default {
         }
         // this.option.series[0].data[0].value = option.xdata;
         // 初始化雷达图
-				this.option.series[0].data = this.option.series[0].data.filter(i=>Object.keys(i).length>0);
+        this.option.series[0].data = this.option.series[0].data.filter(
+          i => Object.keys(i).length > 0
+        );
         this.chartObj = chartObj;
         this.chartObj.setOption(this.option);
       });
@@ -175,60 +181,64 @@ export default {
               return array[item].cogScore;
             })
           : [];
-					this.ooption.xdata = []
-      }
-      if (!this.chartObj) {
-        this.setChart(this.ooption);
-      } else {
-        this.option.radar.indicator = this.ooption.sdata;
-        if (this.ooption.xdata.length > 0) {
-          this.option.series[0].data[0] = {
-            // areaStyle: {
-            //     opacity: 0.2,
-            //     color: '#0061FF'
-            // },
-            itemStyle: {
-              color: "#0061FF",
-              lineStyle: {
-                color: "#0061FF"
-              }
-            },
-            value: this.ooption.xdata,
-            name: "全体教师平均得分率"
-          };
-        }else{
-					this.option.series[0].data[0] = {};
-				}
-        if (this.ooption.xdata2.length > 0) {
-          this.option.series[0].data[1] = {
-            // areaStyle: {
-            //     opacity: 0.2,
-            //     color: '#68bbc4'
-            // },
-            itemStyle: {
-              // color: "#68bbc4",
-              // lineStyle: {
-              //   color: "#68bbc4"
-              // }
-							color: "#0061FF",
-              lineStyle: {
-                color: "#0061FF"
-              }
-            },
-            value: this.ooption.xdata2,
-            name: "平均得分率"
-          };
-        } else {
-          this.option.series[0].data[1] = {};
-        }
-				this.option.series[0].data = this.option.series[0].data.filter(i=>Object.keys(i).length>0);
-        this.chartObj.setOption(this.option);
+        this.ooption.xdata = [];
       }
-      setTimeout(() => {
-        if (this.chartObj) {
-          this.chartObj.resize();
-        }
-      }, 200);
+      // if (!this.chartObj) {
+      this.setChart(this.ooption);
+      // }
+      // else {
+      //   this.option.radar.indicator = this.ooption.sdata;
+      //   if (this.ooption.xdata.length > 0) {
+      //     this.option.series[0].data[0] = {
+      //       // areaStyle: {
+      //       //     opacity: 0.2,
+      //       //     color: '#0061FF'
+      //       // },
+      //       itemStyle: {
+      //         color: "#0061FF",
+      //         lineStyle: {
+      //           color: "#0061FF"
+      //         }
+      //       },
+      //       value: this.ooption.xdata,
+      //       name: "全体教师平均得分率"
+      //     };
+      //   } else {
+      //     this.option.series[0].data[0] = {};
+      //   }
+      //   if (this.ooption.xdata2.length > 0) {
+      //     this.option.series[0].data[1] = {
+      //       // areaStyle: {
+      //       //     opacity: 0.2,
+      //       //     color: '#68bbc4'
+      //       // },
+      //       itemStyle: {
+      //         // color: "#68bbc4",
+      //         // lineStyle: {
+      //         //   color: "#68bbc4"
+      //         // }
+      //         color: "#0061FF",
+      //         lineStyle: {
+      //           color: "#0061FF"
+      //         }
+      //       },
+      //       value: this.ooption.xdata2,
+      //       name: "平均得分率"
+      //     };
+      //   } else {
+      //     this.option.series[0].data[1] = {};
+      //   }
+
+      //   this.option.series[0].data = this.option.series[0].data.filter(
+      //     i => Object.keys(i).length > 0
+      //   );
+      //   this.chartObj.setOption(this.option);
+      // }
+      // setTimeout(() => {
+      //   if (this.chartObj) {
+      //     this.chartObj.resize();
+      //   }
+      // }, 200);
       this.$forceUpdate();
     }
   },
@@ -238,6 +248,7 @@ export default {
       deep: true,
       handler(newValue, oldValue) {
         this.ooption.xdata = [];
+        this.$forceUpdate();
         this.setArray(newValue, 1);
         this.$forceUpdate();
       }
@@ -247,11 +258,15 @@ export default {
       deep: true,
       handler(newValue, oldValue) {
         this.ooption.xdata2 = [];
-				if(Object.keys(newValue).length){
-					this.setArray(newValue, 2);
-				}
+        if (Object.keys(newValue).length) {
+          this.setArray(newValue, 2);
+        }
         this.$forceUpdate();
       }
+    },
+    chartObj(newValue, oldValue) {
+      console.log("👉newValue", newValue);
+      console.log("👉oldValue", oldValue);
     }
   },
   mounted() {

+ 518 - 410
src/components/pages/sassPlatform/view/databoard.vue

@@ -1,504 +1,612 @@
 <template>
-    <div class="pb_content" style="height: auto; width: calc(100%); margin: 0 auto;background: unset;">
-        <div class="bbox_serch">
-            <Cascader :options="typeInfo" v-if="typeInfo.length" @setTeacher="setTeacher"></Cascader>
+  <div
+    class="pb_content"
+    style="height: auto; width: calc(100%); margin: 0 auto;background: unset;"
+  >
+    <div class="bbox_serch">
+      <el-select
+        v-model="selectTime"
+        placeholder="请选择"
+        size="small"
+        style="margin:0 10px 0 10px;"
+        v-if="timeSort.length > 1"
+        @change="changeTimeSort"
+      >
+        <el-option
+          v-for="item in timeSort"
+          :key="item.id"
+          :label="item.label"
+          :value="item.id"
+        >
+        </el-option>
+      </el-select>
+      <Cascader
+        :options="typeInfo"
+        v-if="typeInfo.length"
+        @setTeacher="setTeacher"
+      ></Cascader>
+    </div>
+    <div class="bbox" v-loading="tabLoading">
+      <div class="bbox_nav">
+        <div class="teaLis">
+          <div
+            class="teal"
+            @click="cutPage(2)"
+            :class="[pType == 2 ? 'Tbor' : '']"
+            v-if="bArray.length"
+          >
+            专任教师
+          </div>
+          <div
+            class="teal"
+            @click="cutPage(1)"
+            :class="[pType == 1 ? 'Tbor' : '']"
+            v-if="aArray.length"
+          >
+            班主任
+          </div>
         </div>
-        <div class="bbox" v-loading="tabLoading">
-            <div class="bbox_nav">
-                <div class="teaLis">
-                    <div class="teal" @click="cutPage(2)" :class="[pType == 2 ? 'Tbor' : '']" v-if="bArray.length">
-                        专任教师
-                    </div>
-                    <div class="teal" @click="cutPage(1)" :class="[pType == 1 ? 'Tbor' : '']" v-if="aArray.length">
-                        班主任
-                    </div>
-                </div>
-                <el-select v-model="checkSet" @change="setArray" style="margin-left: auto">
-                    <el-option label="综合排序" value=""> </el-option>
-                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
-                    </el-option>
-                </el-select>
-
-            </div>
-            <div class="randarZong">
-                <radarZong :evCourseArray="zongJson" :evCourseArray2="zongJson2" v-if="checkSet"></radarZong>
-                <radarZong :evCourseArray="zongJson2" :evCourseArray2="{}" v-else></radarZong>
-            </div>
-            <div class="randarBox">
-                <div class="title">教师详情</div>
-                <div class="randarTeacher" v-for="(item, index) in tableData" :key="index">
-                    <div class="randarTitle">
-                        <span>{{ item.username }}</span>
-                        <span>{{ item.score }}</span>
-                    </div>
-                    <div class="randar">
-                        <radarTeacher :evCourseArray="zongJson2" :evCourseArray2="item.json"></radarTeacher>
-                    </div>
-                </div>
-            </div>
+        <el-select
+          v-model="checkSet"
+          @change="setArray"
+          style="margin-left: auto"
+        >
+          <el-option label="综合排序" value=""> </el-option>
+          <el-option
+            v-for="item in options"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="randarZong">
+        <radarZong
+          :evCourseArray="zongJson"
+          :evCourseArray2="zongJson2"
+          v-if="checkSet"
+        ></radarZong>
+        <radarZong
+          :evCourseArray="zongJson2"
+          :evCourseArray2="{}"
+          v-else
+        ></radarZong>
+      </div>
+      <div class="randarBox">
+        <div class="title">教师详情</div>
+        <div
+          class="randarTeacher"
+          v-for="(item, index) in tableData"
+          :key="index"
+        >
+          <div class="randarTitle">
+            <span>{{ item.username }}</span>
+            <span>{{ item.score }}</span>
+          </div>
+          <div class="randar">
+            <radarTeacher
+              :evCourseArray="zongJson2"
+              :evCourseArray2="item.json"
+            ></radarTeacher>
+          </div>
         </div>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
 var OpenCC = require("opencc-js");
 let converter = OpenCC.Converter({
-    from: 'hk',
-    to: 'cn'
-})
+  from: "hk",
+  to: "cn"
+});
 
 import radarZong from "./dataCom/radarZong.vue";
 import radarTeacher from "./dataCom/radarTeacher.vue";
 
 import Cascader from "./dataCom/cascader.vue";
 
-
 export default {
-    name: 'testDataBoard',
-    components: { radarZong, radarTeacher, Cascader },
-    data() {
-        return {
-            userid: this.$route.query.userid, //用户id
-            oid: this.$route.query.oid, //学校id
-            org: this.$route.query.org, //组织id
-            pType: 2,
-            teacherName: '',
-            tabLoading: false,
-            tableData: [],
-            zongJson: {},
-            zongJson2: {},
-            checkSet: "",
-            options: [],
-            data: [],
-            typeInfo: [],
-            teacherArray: [],
-            aArray:[],
-            bArray:[],
-        };
-    },
-    computed: {
-        getScore() {
-            return (item) => {
-                let score = 0;
-                for (var i = 0; i < item.length; i++) {
-                    score += item[i].cogScore
-                }
-                score = (score / item.length).toFixed(0);
-                return score;
+  name: "testDataBoard",
+  components: { radarZong, radarTeacher, Cascader },
+  data() {
+    return {
+      userid: this.$route.query.userid, //用户id
+      oid: this.$route.query.oid, //学校id
+      org: this.$route.query.org, //组织id
+      pType: 2,
+      teacherName: "",
+      tabLoading: false,
+      tableData: [],
+      zongJson: {},
+      zongJson2: {},
+      checkSet: "",
+      options: [],
+      data: [],
+      typeInfo: [],
+      teacherArray: [],
+      aArray: [],
+      bArray: [],
+      timeSort: [],
+      selectTime: ""
+    };
+  },
+  computed: {
+    getScore() {
+      return item => {
+        let score = 0;
+        for (var i = 0; i < item.length; i++) {
+          score += item[i].cogScore;
+        }
+        score = (score / item.length).toFixed(0);
+        return score;
+      };
+    }
+  },
+  methods: {
+    getPageBase2(type) {
+      let params = {
+        typ: type,
+        org: this.org,
+        oid: this.oid
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectTestExamineBase", params)
+        .then(res => {
+          console.log("1111111111111111111111", res.data);
+
+          if (type == 1) {
+            this.aArray = res.data[0];
+          } else {
+            this.bArray = res.data[0];
+            if (!this.bArray.length) {
+              this.cutPage(2);
             }
+          }
+          this.timeSort = res.data[0].map(item => {
+            return {
+              label: item.timeName,
+              id: item.time,
+              time: item.timeName.split("~")[0]
+            };
+          });
+          if (this.timeSort.length > 0) {
+            this.selectTime = this.timeSort[0].id;
+          }
+        })
+        .catch(error => {
+          console.log(error);
+        });
+    },
+    goTo(path) {
+      this.$router.push(path);
+    },
+    cutPage(type) {
+      this.checkSet = "";
+      this.pType = type;
+      this.getData();
+    },
+    scoreChildren(children) {
+      let score = 0;
+      children.forEach(item => {
+        if (item.sco2 && parseFloat(item.sco2) > 0) {
+          score += parseFloat(item.sco2);
         }
+      });
+      return score;
     },
-    methods: {
-        getPageBase2(type) {
-            let params = {
-                typ: type,
-                org: this.org,
-                oid: this.oid
-            };
-            this.ajax
-                .get(this.$store.state.api + "selectTestExamineBase", params)
-                .then(res => {
-                console.log('1111111111111111111111', res.data);
-
-                if(type == 1){
-                    this.aArray = res.data[0];
-                }else {
-                    this.bArray = res.data[0];
-                    if(!this.bArray.length){
-                        this.cutPage(2)
-                    }
-                }
-                })
-                .catch(error => {
-                console.log(error);
-            });
-        },
-        goTo(path) {
-            this.$router.push(path);
-        },
-        cutPage(type) {
-            this.checkSet = ""
-            this.pType = type
-            this.getData()
-        },
-        scoreChildren(children) {
-            let score = 0;
-            children.forEach(item => {
-                if (item.sco2 && parseFloat(item.sco2) > 0) {
-                    score += parseFloat(item.sco2);
+    getData() {
+      this.tabLoading = true;
+      let params = [
+        {
+          oid: this.oid,
+          org: this.org,
+          type: this.pType,
+          tname: this.teacherName
+        }
+      ];
+      // console.log(params);
+      this.ajax
+        .post(this.$store.state.api + "selectTestExaminePersonData2", params)
+        .then(res => {
+          let data = res.data[0];
+
+          data.forEach(e => {
+            e.json = JSON.parse(e.json);
+          });
+
+          if (this.selectTime && this.timeSort.length > 1) {
+            data = data.filter(item => item.time == this.selectTime);
+          }
+
+          data.forEach(e => {
+            e.evaSca = 0;
+            e.cogSco = 0;
+            e.step = 0;
+            e.allStep = 0;
+
+            e.json.forEach(i => {
+              i.evaScore = 0; // 自评
+              i.cogScore = 0; //考核
+              i.score = 0; //考核
+              i.children.forEach(k => {
+                e.evaSca = e.evaSca + k.sco1 * 1;
+                e.cogSco = e.cogSco + k.sco2 * 1;
+                i.evaScore = i.evaScore + k.sco1 * 1;
+                i.cogScore = i.cogScore + k.sco2 * 1;
+                i.score = i.score + k.score * 1;
+                e.allStep++;
+                if (!!k.sco2 * 1) {
+                  e.step++;
                 }
+              });
             });
-            return score;
-        },
-        getData() {
-            this.tabLoading = true;
-            let params = [{
-                oid: this.oid,
-                org: this.org,
-                type: this.pType,
-                tname: this.teacherName
-            }];
-            // console.log(params);
-            this.ajax
-                .post(this.$store.state.api + "selectTestExaminePersonData2", params)
-                .then(res => {
-                    let data = res.data[0];
-
-                    data.forEach(e => {
-                        e.json = JSON.parse(e.json);
-                    });
-
-                    data.forEach(e => {
-                        e.evaSca = 0;
-                        e.cogSco = 0;
-                        e.step = 0;
-                        e.allStep = 0;
-
-                        e.json.forEach(i => {
-                            i.evaScore = 0 // 自评
-                            i.cogScore = 0 //考核
-                            i.score = 0 //考核
-                            i.children.forEach(k => {
-                                e.evaSca = e.evaSca + k.sco1 * 1;
-                                e.cogSco = e.cogSco + k.sco2 * 1;
-                                i.evaScore = i.evaScore + k.sco1 * 1;
-                                i.cogScore = i.cogScore + k.sco2 * 1;
-                                i.score = i.score + k.score * 1;
-                                e.allStep++;
-                                if (!!k.sco2 * 1) {
-                                    e.step++;
-                                }
-                            });
-                        });
-                    });
-
-                    data.forEach(e => {
-                        if (e.step == e.allStep) {
-                            e.state = "已完成";
-                        } else {
-                            e.state = "未完成";
-                        }
-                        if (!e.tea) {
-                            e.tea = "";
-                        }
-                        e.evaSca = e.evaSca.toFixed(0);
-                        e.cogSco = e.cogSco.toFixed(0);
-                    });
-                    let _data = []
-                    let zongJson = {}
-                    // zongJson.count = data.length
-                    data.forEach((e, index) => {
-                        _data[index] = {}
-                        _data[index].username = e.username
-                        _data[index].evaSca = e.evaSca
-                        _data[index].cogSco = e.cogSco
-                        _data[index].json = []
-
-                        e.json.forEach((i, iindex) => {
-                            if (converter(i.name) == converter("科组评价") || converter(i.name) == converter("行政巡查")) {
-                                return;
-                            }
-                            _data[index].json[iindex] = {}
-                            _data[index].json[iindex].name = i.name
-                            let _evaScore = parseInt((i.evaScore * (100 / i.score)).toFixed(0))
-                            let _cogScore = parseInt((i.cogScore * (100 / i.score)).toFixed(0))
-                            _data[index].json[iindex].evaScore = _evaScore  // 自评
-                            _data[index].json[iindex].cogScore = _cogScore // 考核
-                            zongJson[i.name] ? "" : zongJson[i.name] = {}
-                            zongJson[i.name].evaScore ? zongJson[i.name].evaScore += _evaScore : zongJson[i.name].evaScore = _evaScore
-                            zongJson[i.name].cogScore ? zongJson[i.name].cogScore += _cogScore : zongJson[i.name].cogScore = _cogScore
-                        });
-                    });
-                    let zongArray = Object.keys(zongJson)
-                    for (var i = 0; i < zongArray.length; i++) {
-                        zongJson[zongArray[i]].evaScore = (zongJson[zongArray[i]].evaScore / data.length).toFixed(0)
-                        zongJson[zongArray[i]].cogScore = (zongJson[zongArray[i]].cogScore / data.length).toFixed(0)
-                    }
-
-                    this.tableData = _data
-                        .filter((e) => {
-                            e.score = this.getScore(e.json);
-                            return e;
-                        })
-                        .sort((a, b) => b.score - a.score);
-                    console.log(this.tableData);
-                    this.zongJson = zongJson
-                    this.zongJson2 = zongJson
-                    console.log(zongJson);
-                    this.options = Object.keys(zongJson).map(item => {
-                        return { label: item, value: item }
-                    })
-                    this.data = data
-                    console.log(data);
-
-                    this.tabLoading = false;
-                })
-                .catch(error => {
-                    this.tabLoading = false;
-                    console.log(error);
-                });
-        },
-        setTeacher(array){
-            this.teacherArray = array
-            this.setArray()
-        },
-        setArray() {
-            let checkSet = this.checkSet
-            let _data = []
-            let zongJson = {}
-            let data = JSON.parse(JSON.stringify(this.data))
-            if(this.teacherArray.length){
-                data = data.filter((e) => {
-                    return this.teacherArray.includes(e.userid)
-                })
-            }
-            data.forEach((e, index) => {
-                _data[index] = {}
-                _data[index].username = e.username
-                if (checkSet == "") {
-                    _data[index].evaSca = e.evaSca
-                    _data[index].cogSco = e.cogSco
-                    _data[index].json = []
-                }
-
+          });
 
-                e.json.forEach((i, iindex) => {
-                    if (converter(i.name) == converter("科组评价") || converter(i.name) == converter("行政巡查")) {
-                        return;
-                    }
-                    if (checkSet == i.name) {
-                        _data[index].evaSca = i.evaScore
-                        _data[index].cogSco = i.cogScore
-                        _data[index].json = []
-                        i.children.forEach((ic, icindex) => {
-                            _data[index].json[icindex] = {}
-                            _data[index].json[icindex].name = ic.name
-                            let _evaScore = parseInt((ic.sco1 * 1 * (100 / ic.score)).toFixed(0))
-                            let _cogScore = parseInt((ic.sco2 * 1 * (100 / ic.score)).toFixed(0))
-                            _data[index].json[icindex].evaScore = _evaScore  // 自评
-                            _data[index].json[icindex].cogScore = _cogScore // 考核
-                            zongJson[ic.name] ? "" : zongJson[ic.name] = {}
-                            zongJson[ic.name].evaScore ? zongJson[ic.name].evaScore += _evaScore : zongJson[ic.name].evaScore = _evaScore
-                            zongJson[ic.name].cogScore ? zongJson[ic.name].cogScore += _cogScore : zongJson[ic.name].cogScore = _cogScore
-                        })
-                    } else if (checkSet == "") {
-                        _data[index].json[iindex] = {}
-                        _data[index].json[iindex].name = i.name
-                        let _evaScore = parseInt((i.evaScore * (100 / i.score)).toFixed(0))
-                        let _cogScore = parseInt((i.cogScore * (100 / i.score)).toFixed(0))
-                        _data[index].json[iindex].evaScore = _evaScore  // 自评
-                        _data[index].json[iindex].cogScore = _cogScore // 考核
-                        zongJson[i.name] ? "" : zongJson[i.name] = {}
-                        zongJson[i.name].evaScore ? zongJson[i.name].evaScore += _evaScore : zongJson[i.name].evaScore = _evaScore
-                        zongJson[i.name].cogScore ? zongJson[i.name].cogScore += _cogScore : zongJson[i.name].cogScore = _cogScore
-                    }
-
-                });
-            });
-            let zongArray = Object.keys(zongJson)
-            for (var i = 0; i < zongArray.length; i++) {
-                zongJson[zongArray[i]].evaScore = (zongJson[zongArray[i]].evaScore / data.length).toFixed(0)
-                zongJson[zongArray[i]].cogScore = (zongJson[zongArray[i]].cogScore / data.length).toFixed(0)
+          data.forEach(e => {
+            if (e.step == e.allStep) {
+              e.state = "已完成";
+            } else {
+              e.state = "未完成";
+            }
+            if (!e.tea) {
+              e.tea = "";
             }
-            this.tableData = _data.filter((e) => {
-                e.score = this.getScore(e.json);
-                return e;
+            e.evaSca = e.evaSca.toFixed(0);
+            e.cogSco = e.cogSco.toFixed(0);
+          });
+          let _data = [];
+          let zongJson = {};
+          // zongJson.count = data.length
+          data.forEach((e, index) => {
+            _data[index] = {};
+            _data[index].username = e.username;
+            _data[index].evaSca = e.evaSca;
+            _data[index].cogSco = e.cogSco;
+            _data[index].json = [];
+
+            e.json.forEach((i, iindex) => {
+              if (
+                converter(i.name) == converter("科组评价") ||
+                converter(i.name) == converter("行政巡查")
+              ) {
+                return;
+              }
+              _data[index].json[iindex] = {};
+              _data[index].json[iindex].name = i.name;
+              let _evaScore = parseInt(
+                (i.evaScore * (100 / i.score)).toFixed(0)
+              );
+              let _cogScore = parseInt(
+                (i.cogScore * (100 / i.score)).toFixed(0)
+              );
+              _data[index].json[iindex].evaScore = _evaScore; // 自评
+              _data[index].json[iindex].cogScore = _cogScore; // 考核
+              zongJson[i.name] ? "" : (zongJson[i.name] = {});
+              zongJson[i.name].evaScore
+                ? (zongJson[i.name].evaScore += _evaScore)
+                : (zongJson[i.name].evaScore = _evaScore);
+              zongJson[i.name].cogScore
+                ? (zongJson[i.name].cogScore += _cogScore)
+                : (zongJson[i.name].cogScore = _cogScore);
+            });
+          });
+          let zongArray = Object.keys(zongJson);
+          for (var i = 0; i < zongArray.length; i++) {
+            zongJson[zongArray[i]].evaScore = (
+              zongJson[zongArray[i]].evaScore / data.length
+            ).toFixed(0);
+            zongJson[zongArray[i]].cogScore = (
+              zongJson[zongArray[i]].cogScore / data.length
+            ).toFixed(0);
+          }
+
+          this.tableData = _data
+            .filter(e => {
+              e.score = this.getScore(e.json);
+              return e;
             })
             .sort((a, b) => b.score - a.score);
-            console.log(this.tableData);
-            this.zongJson2 = zongJson
-            console.log(zongJson);
-        },
-        //获取分类类名
-        getTypeInfo() {
-            this.tabLoading = true;
-            let params = {
-                oid: this.oid
-            };
-            this.ajax
-                .get(this.$store.state.api + "selectPerInfoAllTea", params)
-                .then((res) => {
-                    this.typeInfo = res.data[0];
-                    let typeInfo = res.data[1];
-                    this.typeInfo.forEach((e) => {
-                        e.child = [];
-                        e.value = '';
-                        typeInfo.forEach((i) => {
-                            if (e.id == i.parentid) {
-                                e.child.push({ id: i.id, name: i.name })
-                            }
-                        })
-                    })
-                    this.getData()
-                })
-                .catch((err) => {
-                    this.tabLoading = false;
-                    console.error(err);
-                });
-        },
+          console.log(this.tableData);
+          this.zongJson = zongJson;
+          this.zongJson2 = zongJson;
+          console.log(zongJson);
+          this.options = Object.keys(zongJson).map(item => {
+            return { label: item, value: item };
+          });
+          this.data = data;
+          console.log(data);
+
+          this.tabLoading = false;
+        })
+        .catch(error => {
+          this.tabLoading = false;
+          console.log(error);
+        });
     },
-    mounted() {
-        this.getPageBase2(1)
-        this.getPageBase2(2)
-        this.getTypeInfo()
+    setTeacher(array) {
+      this.teacherArray = array;
+      this.setArray();
     },
+    setArray() {
+      let checkSet = this.checkSet;
+      let _data = [];
+      let zongJson = {};
+      let data = JSON.parse(JSON.stringify(this.data));
+      if (this.teacherArray.length) {
+        data = data.filter(e => {
+          return this.teacherArray.includes(e.userid);
+        });
+      }
+      data.forEach((e, index) => {
+        _data[index] = {};
+        _data[index].username = e.username;
+        if (checkSet == "") {
+          _data[index].evaSca = e.evaSca;
+          _data[index].cogSco = e.cogSco;
+          _data[index].json = [];
+        }
+
+        e.json.forEach((i, iindex) => {
+          if (
+            converter(i.name) == converter("科组评价") ||
+            converter(i.name) == converter("行政巡查")
+          ) {
+            return;
+          }
+          if (checkSet == i.name) {
+            _data[index].evaSca = i.evaScore;
+            _data[index].cogSco = i.cogScore;
+            _data[index].json = [];
+            i.children.forEach((ic, icindex) => {
+              _data[index].json[icindex] = {};
+              _data[index].json[icindex].name = ic.name;
+              let _evaScore = parseInt(
+                (ic.sco1 * 1 * (100 / ic.score)).toFixed(0)
+              );
+              let _cogScore = parseInt(
+                (ic.sco2 * 1 * (100 / ic.score)).toFixed(0)
+              );
+              _data[index].json[icindex].evaScore = _evaScore; // 自评
+              _data[index].json[icindex].cogScore = _cogScore; // 考核
+              zongJson[ic.name] ? "" : (zongJson[ic.name] = {});
+              zongJson[ic.name].evaScore
+                ? (zongJson[ic.name].evaScore += _evaScore)
+                : (zongJson[ic.name].evaScore = _evaScore);
+              zongJson[ic.name].cogScore
+                ? (zongJson[ic.name].cogScore += _cogScore)
+                : (zongJson[ic.name].cogScore = _cogScore);
+            });
+          } else if (checkSet == "") {
+            _data[index].json[iindex] = {};
+            _data[index].json[iindex].name = i.name;
+            let _evaScore = parseInt((i.evaScore * (100 / i.score)).toFixed(0));
+            let _cogScore = parseInt((i.cogScore * (100 / i.score)).toFixed(0));
+            _data[index].json[iindex].evaScore = _evaScore; // 自评
+            _data[index].json[iindex].cogScore = _cogScore; // 考核
+            zongJson[i.name] ? "" : (zongJson[i.name] = {});
+            zongJson[i.name].evaScore
+              ? (zongJson[i.name].evaScore += _evaScore)
+              : (zongJson[i.name].evaScore = _evaScore);
+            zongJson[i.name].cogScore
+              ? (zongJson[i.name].cogScore += _cogScore)
+              : (zongJson[i.name].cogScore = _cogScore);
+          }
+        });
+      });
+      let zongArray = Object.keys(zongJson);
+      for (var i = 0; i < zongArray.length; i++) {
+        zongJson[zongArray[i]].evaScore = (
+          zongJson[zongArray[i]].evaScore / data.length
+        ).toFixed(0);
+        zongJson[zongArray[i]].cogScore = (
+          zongJson[zongArray[i]].cogScore / data.length
+        ).toFixed(0);
+      }
+      this.tableData = _data
+        .filter(e => {
+          e.score = this.getScore(e.json);
+          return e;
+        })
+        .sort((a, b) => b.score - a.score);
+      console.log(this.tableData);
+      this.zongJson2 = zongJson;
+      console.log(zongJson);
+    },
+    //获取分类类名
+    getTypeInfo() {
+      this.tabLoading = true;
+      let params = {
+        oid: this.oid
+      };
+      this.ajax
+        .get(this.$store.state.api + "selectPerInfoAllTea", params)
+        .then(res => {
+          this.typeInfo = res.data[0];
+          let typeInfo = res.data[1];
+          this.typeInfo.forEach(e => {
+            e.child = [];
+            e.value = "";
+            typeInfo.forEach(i => {
+              if (e.id == i.parentid) {
+                e.child.push({ id: i.id, name: i.name });
+              }
+            });
+          });
+          this.getData();
+        })
+        .catch(err => {
+          this.tabLoading = false;
+          console.error(err);
+        });
+    },
+    changeTimeSort() {
+      this.cutPage(2);
+    }
+  },
+  mounted() {
+    this.getPageBase2(1);
+    this.getPageBase2(2);
+    this.getTypeInfo();
+  }
 };
 </script>
 
 <style scoped>
-.bbox_serch{
-    width: 100%;
-    margin-bottom: 10px;
-    display: flex;
-    align-items: center;
-    background-color: #E6EAF0;
+.bbox_serch {
+  width: 100%;
+  margin-bottom: 10px;
+  display: flex;
+  align-items: center;
+  background-color: #e6eaf0;
 }
 
 .top {
-    display: flex;
-    justify-content: space-between;
-    width: 100% !important;
-    box-sizing: border-box;
-    margin: 0px auto;
-    padding: 10px 0;
-    height: 54px;
+  display: flex;
+  justify-content: space-between;
+  width: 100% !important;
+  box-sizing: border-box;
+  margin: 0px auto;
+  padding: 10px 0;
+  height: 54px;
 }
 
-
 .subClick {
-    font-size: 16px;
-    cursor: pointer;
-    margin-left: 10px;
-    /* color: #ab582f; */
-    color: #409eff;
+  font-size: 16px;
+  cursor: pointer;
+  margin-left: 10px;
+  /* color: #ab582f; */
+  color: #409eff;
 }
 
 .sub_head {
-    position: relative;
-    font-size: 20px;
-    font-weight: bold;
-    padding: 0 15px;
+  position: relative;
+  font-size: 20px;
+  font-weight: bold;
+  padding: 0 15px;
 }
 
 .sub_head::after {
-    content: "";
-    width: 100%;
-    background: #3681FC;
-    height: 2px;
-    position: absolute;
-    left: 0;
-    bottom: -8px;
+  content: "";
+  width: 100%;
+  background: #3681fc;
+  height: 2px;
+  position: absolute;
+  left: 0;
+  bottom: -8px;
 }
 
 .subClick {
-    /* font-size: 16px; */
-    font-size: 20px;
-    cursor: pointer;
-    /* margin-left: 17.5px; */
-    /* color: #ab582f; */
-    /* color: #409eff; */
-    color: #999;
-    padding: 0 15px;
+  /* font-size: 16px; */
+  font-size: 20px;
+  cursor: pointer;
+  /* margin-left: 17.5px; */
+  /* color: #ab582f; */
+  /* color: #409eff; */
+  color: #999;
+  padding: 0 15px;
 }
 
 .subClick:hover {
-    color: #000;
+  color: #000;
 }
 
-.sub_head+.subClick,
-.subClick+.subClick,
-.subClick+.sub_head {
-    margin-left: 17.5px;
+.sub_head + .subClick,
+.subClick + .subClick,
+.subClick + .sub_head {
+  margin-left: 17.5px;
 }
 
 .bbox {
-    background: #fff;
-    border-radius: 0 5px 5px 5px;
-    padding: 15px 0;
-    box-sizing: border-box;
-    min-height: 900px;
+  background: #fff;
+  border-radius: 0 5px 5px 5px;
+  padding: 15px 0;
+  box-sizing: border-box;
+  min-height: 900px;
 }
 
 .bbox_nav {
-    display: flex;
-    width: 100%;
-    box-sizing: border-box;
-    padding: 0 20px;
-    align-items: center;
+  display: flex;
+  width: 100%;
+  box-sizing: border-box;
+  padding: 0 20px;
+  align-items: center;
 }
 
 .teaLis {
-    display: flex;
+  display: flex;
 }
 
 .teal {
-    padding: 10px 20px;
-    cursor: pointer;
+  padding: 10px 20px;
+  cursor: pointer;
 }
 
 .Tbor {
-    border-bottom: 2px rgba(54, 129, 252, 1) solid;
-    font-weight: 600;
+  border-bottom: 2px rgba(54, 129, 252, 1) solid;
+  font-weight: 600;
 }
 
-
 .randarZong {
-    max-width: 100%;
-    width: 500px;
-    height: 500px;
-    margin: 0 auto;
+  max-width: 100%;
+  width: 500px;
+  height: 500px;
+  margin: 0 auto;
 }
 
 .randarBox {
-    padding: 20px;
-    width: 100%;
-    box-sizing: border-box;
-    display: flex;
-    flex-wrap: wrap;
+  padding: 20px;
+  width: 100%;
+  box-sizing: border-box;
+  display: flex;
+  flex-wrap: wrap;
 }
 
 .randarBox .title {
-    width: 100%;
-    font-size: 18px;
-    font-weight: 700;
-    margin-bottom: 20px;
+  width: 100%;
+  font-size: 18px;
+  font-weight: 700;
+  margin-bottom: 20px;
 }
 
 .randarTeacher {
-    width: calc(100% / 4 - 20px);
-    margin-right: 20px;
-    margin-bottom: 20px;
+  width: calc(100% / 4 - 20px);
+  margin-right: 20px;
+  margin-bottom: 20px;
 }
 
-
 .randarTitle {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 10px;
 }
 
-.randarTitle>span:nth-child(1) {}
+.randarTitle > span:nth-child(1) {
+}
 
-.randarTitle>span:nth-child(2) {}
+.randarTitle > span:nth-child(2) {
+}
 
 .randar {
-    width: calc(100%);
-    height: 350px;
-    border: 1px solid #e4e4e4;
-    border-radius: 5px;
+  width: calc(100%);
+  height: 350px;
+  border: 1px solid #e4e4e4;
+  border-radius: 5px;
 }
 
 @media screen and (max-width: 1280px) {
-    .randarTeacher {
-        width: calc(100% / 2 - 20px);
-    }
+  .randarTeacher {
+    width: calc(100% / 2 - 20px);
+  }
 }
 
 @media screen and (max-width: 800px) {
-    .randarTeacher {
-        width: calc(100%);
-        margin-right: 0;
-    }
+  .randarTeacher {
+    width: calc(100%);
+    margin-right: 0;
+  }
 }
 </style>

Niektoré súbory nie sú zobrazené, pretože je v týchto rozdielových dátach zmenené mnoho súborov