提交

1

src/views/data-module/index.tsx

@@ -18,6 +18,9 @@ export default defineComponent({
         activeTab.value = val.form.tabName;
       }
     });
+    const TrainDataRef = ref()
+    const PracticeDataRef = ref()
+    const PracticeRankingRef = ref()
     const setTabs = (val: any) => {
       setTabsCaches(val, 'tabName', route);
     };
@@ -25,11 +28,19 @@ export default defineComponent({
       getNowDateAndMonday(new Date().getTime()),
       getNowDateAndSunday(new Date().getTime())
     ]);
+    const onSearch = ()=>{
+      console.log(TrainDataRef.value)
+      if(TrainDataRef.value){
+        TrainDataRef.value.getList()
+      }
+      if(PracticeDataRef.value){
+        PracticeDataRef.value.getList()
+      }
+      if(PracticeRankingRef.value){
+        PracticeRankingRef.value.getList()
+      }
 
-    const updaeTimer = (value:any)=>{
-      console.log('监听改变',value)
     }
-
     return () => (
       <div>
         <div class={styles.listWrap}>
@@ -48,9 +59,8 @@ export default defineComponent({
                       <CDatePicker
                         separator={'-'}
                         type="daterange"
-                        onUpdateValue={updaeTimer}
                          timerValue={timer.value} ></CDatePicker>
-                <NButton type="primary" class={styles.searchBtn}>
+                <NButton type="primary" class={styles.searchBtn} onClick={()=>onSearch()}>
                   搜索
                 </NButton>
                 <NButton type="primary" ghost class={styles.resetBtn}>
@@ -61,13 +71,13 @@ export default defineComponent({
               </>
             }}>
             <NTabPane name="training " tab="训练统计">
-             <TrainData timer={timer.value}></TrainData>
+             <TrainData ref={TrainDataRef} timer={timer.value}></TrainData>
             </NTabPane>
             <NTabPane name="practice" tab="练习数据">
-              <PracticeData  timer={timer.value}></PracticeData>
+              <PracticeData ref={PracticeDataRef}  timer={timer.value}></PracticeData>
             </NTabPane>
             <NTabPane name="ranking" tab="练习排行">
-              <PracticeRanking  timer={timer.value}></PracticeRanking>
+              <PracticeRanking ref={PracticeRankingRef}  timer={timer.value}></PracticeRanking>
             </NTabPane>
           </NTabs>
 

src/views/home/components/practiceData.tsx

@@ -6,6 +6,7 @@ import { useECharts } from '@/hooks/web/useECharts';
 import Pagination from '/src/components/pagination';
 import { getTrainingStat } from '@/views/data-module/api'
 import { getTimes } from '/src/utils/dateFormat';
+import { useRoute, useRouter } from 'vue-router';
 export default defineComponent({
   name: 'home-practiceData',
   props:{
@@ -229,6 +230,7 @@ export default defineComponent({
         // ]
       });
     };
+
     onMounted(()=>{
       getList()
       setChart();

src/views/home/components/trainData.tsx

@@ -1,11 +1,14 @@
-import { Ref, defineComponent, onMounted, reactive, ref } from 'vue';
+import { Ref, computed, defineComponent, onMounted, reactive, ref,watch } from 'vue';
 import styles from '../index.module.less';
-import { NButton, NDataTable, NNumberAnimation } from 'naive-ui';
+import { NButton, NDataTable, NNumberAnimation, NSpace } from 'naive-ui';
 import numeral from 'numeral';
 import { useECharts } from '@/hooks/web/useECharts';
 import Pagination from '/src/components/pagination';
 import { getTimes } from '/src/utils/dateFormat';
 import { getTrainingStat } from '../../data-module/api';
+import { useRoute, useRouter } from 'vue-router';
+import { getTrainingList } from '../../classList/api';
+
 export default defineComponent({
   name: 'home-trainData',
   props: {
@@ -19,6 +22,8 @@ export default defineComponent({
     const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
     const qualifiedFlag = ref(true);
     const unqualifiedFlag = ref(true);
+    const router = useRouter();
+    const route = useRoute()
     const payForm = reactive({
       height: '360px',
       width: '100%',
@@ -33,16 +38,16 @@ export default defineComponent({
         '2022-10-15',
         '2022-10-16'
       ],
-      studentList: [50, 100, 80, 180, 70, 99, 300],
-      payInfoList: [100, 200, 300, 450, 330, 200, 10]
+      studentList: [],
+      payInfoList: []
     });
     const totalDateRef = ref({
-      qualifiedRate: 9,
-      qualifiedStudentCount: 1,
-      submitStudentCount: 3,
-      totalStudentCount: 11,
-      trainingCount: 4,
-      trainingRate: 27, //
+      qualifiedRate: 0,
+      qualifiedStudentCount: 0,
+      submitStudentCount: 0,
+      totalStudentCount: 0,
+      trainingCount: 0,
+      trainingRate: 0 //
     } as any);
     const state = reactive({
       loading: false,
@@ -99,6 +104,10 @@ export default defineComponent({
       ] as any,
       goCourseVisiable: false
     });
+    const currentTimer = computed(()=>{
+      console.log('改变值')
+      return props.timer
+    })
     const columns = () => {
       return [
         {
@@ -107,17 +116,23 @@ export default defineComponent({
         },
         {
           title: '布置时间',
-          key: 'createTime'
+          key: 'createTime',
+          render(row: any) {
+            return <>{row.createTime}</>;
+          }
         },
         {
           title: '截止时间',
-          key: 'endTime'
+          key: 'expireDate',
+          render(row: any) {
+            return <>{row.expireDate}</>;
+          }
         },
         {
           title: '训练状态',
           key: 'status',
           render(row: any) {
-            return row.status == 'ing' ? (
+            return row.status == 0 ? (
               <div class={styles.indDot}>
                 {' '}
                 <span></span> 进行中
@@ -131,51 +146,104 @@ export default defineComponent({
         },
         {
           title: '布置人数',
-          key: 'studentNum'
+          key: 'expectNum'
         },
         {
           title: '提交人数',
-          key: 'submitNum'
+          key: 'trainingNum'
         },
         {
           title: '合格人数',
-          key: 'quantityNum'
+          key: 'standardNum'
         },
         {
           title: '提交率',
-          key: 'submitRate',
+          key: 'trainingRate',
           render(row: any) {
-            return <span>{row.submitRate}%</span>;
+            return <>{row.trainingRate}%</>;
           }
         },
         {
           title: '合格率',
-          key: 'quantityRate',
+          key: 'qualifiedRate',
           render(row: any) {
-            return <span>{row.quantityRate}%</span>;
+            return <>{row.qualifiedRate}%</>;
           }
         },
+        // {
+        //   title: '',
+        //   key: 'sex',
+        //   render(row: any) {
+        //     return <>{row.sex == '0' ? '女' : '男'}</>;
+        //   }
+        // },
         {
           title: '操作',
           key: 'id',
           render(row: any) {
             return (
-              <NButton text type="primary">
-                详情
-              </NButton>
+              <NSpace>
+                <NButton
+                  text
+                  type="primary"
+                  onClick={() => gotoWorkDetail(row)}>
+                  详情
+                </NButton>
+              </NSpace>
             );
           }
         }
       ];
     };
+    const gotoWorkDetail = (row: any) => {
+      console.log(row);
+      router.push({
+        path: '/afterWorkDetail',
+        query: {
+          ...route.query,
+          teacherName: row.teacherName,
+          trainingId: row.id,
+          id:row.classGroupId,
+          name:row.classGroupName
+        }
+      });
+    };
     const getList = async () => {
+      console.log(currentTimer.value,'currentTimer.value')
       try {
         const res = await getTrainingStat({
-          ...getTimes(props.timer, ['startTime', 'endTime'], 'YYYY-MM-DD')
+          ...getTimes(currentTimer.value, ['startTime', 'endTime'], 'YYYY-MM-DD')
         });
+        totalDateRef.value = {...res.data}
+        payForm.dateList = res.data.trainingStatDetails.map((item:any)=>{
+          return item.date
+        })
+        payForm.payInfoList = res.data.trainingStatDetails.map((item:any)=>{
+          return item.qualifiedStudentCount
+        })
+        payForm.studentList = res.data.trainingStatDetails.map((item:any)=>{
+          return item.unqualifiedStudentCount
+        })
+
+        setChart();
       } catch (e) {
         console.log(e);
       }
+
+      try {
+        const res = await getTrainingList({
+          ...state.pagination,
+          ...getTimes(currentTimer.value, ['startTime', 'endTime'], 'YYYY-MM-DD')
+        });
+
+        state.tableList = res.data.rows;
+
+        state.pagination.pageTotal = res.data.total;
+        state.loading = false;
+      } catch (e) {
+        state.loading = false;
+        console.log(e);
+      }
     };
     expose({ getList });
     const setChart = () => {
@@ -355,7 +423,7 @@ export default defineComponent({
     };
     onMounted(() => {
       getList();
-      setChart();
+
     });
 
     return () => (
@@ -366,7 +434,9 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={totalDateRef.value.trainingCount}></NNumberAnimation>
+                    <NNumberAnimation
+                      from={0}
+                      to={totalDateRef.value.trainingCount}></NNumberAnimation>
                   </span>
                   次
                 </p>
@@ -375,7 +445,11 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={totalDateRef.value.totalStudentCount}></NNumberAnimation>
+                    <NNumberAnimation
+                      from={0}
+                      to={
+                        totalDateRef.value.totalStudentCount
+                      }></NNumberAnimation>
                   </span>
                   人次
                 </p>
@@ -384,7 +458,11 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={totalDateRef.value.submitStudentCount}></NNumberAnimation>
+                    <NNumberAnimation
+                      from={0}
+                      to={
+                        totalDateRef.value.submitStudentCount
+                      }></NNumberAnimation>
                   </span>
                   人次
                 </p>
@@ -394,7 +472,11 @@ export default defineComponent({
                 <p class={styles.TrainDataItemTitle}>
                   <span>
                     {' '}
-                    <NNumberAnimation from={0} to={totalDateRef.value.qualifiedStudentCount}></NNumberAnimation>
+                    <NNumberAnimation
+                      from={0}
+                      to={
+                        totalDateRef.value.qualifiedStudentCount
+                      }></NNumberAnimation>
                   </span>
                   人次
                 </p>
@@ -403,7 +485,10 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={totalDateRef.value.trainingRate}></NNumberAnimation>%
+                    <NNumberAnimation
+                      from={0}
+                      to={totalDateRef.value.trainingRate}></NNumberAnimation>
+                    %
                   </span>
                 </p>
                 <p class={styles.TrainDataItemsubTitle}>训练提交率</p>
@@ -411,7 +496,10 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={totalDateRef.value.qualifiedRate}></NNumberAnimation>%
+                    <NNumberAnimation
+                      from={0}
+                      to={totalDateRef.value.qualifiedRate}></NNumberAnimation>
+                    %
                   </span>
                 </p>
                 <p class={styles.TrainDataItemsubTitle}>训练合格率</p>