src/renderer/src/views/classTask/container/classOverview/distribution/echarts.vue

@@ -15,11 +15,11 @@ const chartRef = ref(null);
 
 // 数据源
 const dataList = ref([
-  {name: '完美', value: 0,rating:1,max:100,min:100,},
+  {name: '优', value: 0,rating:1},
-  {name: '优秀', value: 0,rating:2,max:99,min:80,},
+  {name: '优-', value: 0,rating:2},
-  {name: '良好', value: 0,rating:3,max:79,min:70,},
+  {name: '良', value: 0,rating:3},
-  {name: '及格', value: 0,rating:4,max:69,min:60,},
+  {name: '良-', value: 0,rating:4},
-  {name: '不及格', value: 0,rating:5,max:59,min:0,},
+  {name: '差', value: 0,rating:5},
 ]);
 
 // 根据数据生成不同的颜色
@@ -81,13 +81,10 @@ function initChart() {
 }
 // 获取表的数据
 const showEcharts =() => {
-  useOverview.tableList.forEach((item,index) => {
+  useOverview.tableList.forEach(item => {
-    if(item.rating === 0) return // 没批改不计数
+    const index = dataList.value.findIndex(item1 => item1.rating === item.rating)
-    dataList.value.forEach((item1,index1) => {
+    if(index !== -1)
-      if(item1.min <= Number(item.scoingRate) && Number(item.scoingRate) <= item1.max ){
+      dataList.value[index].value ++
-        item1.value ++
-      }
-    })
   })
 }
 watch(() => useOverview.tableList,() => {

src/renderer/src/views/classTask/container/classOverview/distribution/stuList.vue

@@ -1,7 +1,7 @@
 <template>
   <el-tabs :tab-position="tabPosition" style="height: 100%" class="demo-tabs" @tabChange="handelChange">
     <template v-for="(item,index) in leftList" :key="index">
-      <el-tab-pane :label="item.label" style="text-align:left" stretch="true">
+      <el-tab-pane :label="item.label" style="text-align:left">
         <template v-if="item.stuList.length > 0">
           <template v-for="(stuItem,stuIndex) in item.stuList" :key="stuIndex">
             <el-tag style="margin:5px 10px 0 0" type="primary">{{stuItem.studentname}}</el-tag>
@@ -23,40 +23,29 @@ const useOverview = overviewStore()
 const tabPosition = ref('left')
 const leftList = ref([
   {
-    label:'完美',
+    label:'优',
     stuList:[],
-    rating:1,
+    rating:1
-    max:100,
-    min:100,
   },
   {
-    label:'优秀',
+    label:'优-',
     stuList:[],
-    rating:2,
+    rating:2
-    max:99,
-    min:80,
-
   },
   {
-    label:'良好',
+    label:'良',
     stuList:[],
-    rating:3,
+    rating:3
-    max:79,
-    min:70,
   },
   {
-    label:'及格',
+    label:'良-',
     stuList:[],
-    rating:4,
+    rating:4
-    max:69,
-    min:60,
   },
   {
-    label:'不及格',
+    label:'差',
     stuList:[],
-    rating:5,
+    rating:5
-    max:59,
-    min:0,
   },
 ])
 //切换展示区域学生
@@ -65,12 +54,9 @@ const handelChange = (item) => {
 }
 //取区域的学生
 const showStudents = (index) => {
+  console.log(useOverview.tableList,'lef')
   leftList.value[index].stuList = useOverview.tableList.filter(item => {
-    if(item.rating > 0){
+    if(item.rating == leftList.value[index].rating) return item
-      if(leftList.value[index].min <= Number(item.scoingRate || 0) && Number(item.scoingRate || 0) <= leftList.value[index].max ){
-        return item
-      }
-    }
   })
 }
 watch(() => useOverview.tableList,() => {
@@ -121,9 +107,9 @@ watch(() => useOverview.tableList,() => {
 :deep(.el-tabs__item.is-active){
   background-color: rgb(238, 241, 246);
 }
-:deep(.el-tabs--left .el-tabs__item.is-left, .el-tabs--right .el-tabs__item.is-left){
+:deep(.el-tabs--left .el-tabs__item.is-left){
   text-align: left;
-  justify-content: flex-start !important;
+  justify-content: flex-start;
 }
 
 </style>