提交准备开始训练数据

1

src/components/CDatePicker/index.tsx

@@ -26,7 +26,6 @@ export default defineComponent({
       console.log('更新日期', timer.value);
       emit('update:value', timer.value);
     };
-    console.log(props.timerValue, 'timerValue');
     timer.value =
       props.timerValue && props.timerValue.length > 0 ? props.timerValue : null;
     watch(

src/views/data-module/api.tsx

@@ -0,0 +1,10 @@
+import request from '@/utils/request';
+
+
+
+export const getTrainingStat = (params: any) => {
+  return request.post('/edu-app/lessonTraining/trainingStat', {
+    data: params
+    // requestType: 'form'
+  });
+};

src/views/data-module/index.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, ref } from 'vue';
+import { defineComponent, ref,watch } from 'vue';
 import styles from './index.module.less';
 import { NTabs, NTabPane, NSpace, NButton } from 'naive-ui';
 import { useRoute } from 'vue-router';
@@ -7,6 +7,7 @@ import CDatePicker from '/src/components/CDatePicker';
 import TrainData from '@/views/home/components/trainData';
 import PracticeData from '@/views/home/components/practiceData';
 import PracticeRanking from '@/views/home/components/practiceRanking';
+import { getNowDateAndMonday, getNowDateAndSunday } from '/src/utils/dateFormat';
 export default defineComponent({
   name: 'data-module',
   setup() {
@@ -20,6 +21,15 @@ export default defineComponent({
     const setTabs = (val: any) => {
       setTabsCaches(val, 'tabName', route);
     };
+    const timer = ref<[number, number]>([
+      getNowDateAndMonday(new Date().getTime()),
+      getNowDateAndSunday(new Date().getTime())
+    ]);
+
+    const updaeTimer = (value:any)=>{
+      console.log('监听改变',value)
+    }
+
     return () => (
       <div>
         <div class={styles.listWrap}>
@@ -35,7 +45,11 @@ export default defineComponent({
               suffix:()=><>
                         <div class={styles.homeStudyInfoDate}>
               <NSpace>
-                <CDatePicker separator={'-'} type="daterange"></CDatePicker>
+                      <CDatePicker
+                        separator={'-'}
+                        type="daterange"
+                        onUpdateValue={updaeTimer}
+                         timerValue={timer.value} ></CDatePicker>
                 <NButton type="primary" class={styles.searchBtn}>
                   搜索
                 </NButton>
@@ -47,13 +61,13 @@ export default defineComponent({
               </>
             }}>
             <NTabPane name="training " tab="训练统计">
-             <TrainData></TrainData>
+             <TrainData timer={timer.value}></TrainData>
             </NTabPane>
             <NTabPane name="practice" tab="练习数据">
-              <PracticeData></PracticeData>
+              <PracticeData  timer={timer.value}></PracticeData>
             </NTabPane>
             <NTabPane name="ranking" tab="练习排行">
-              <PracticeRanking></PracticeRanking>
+              <PracticeRanking  timer={timer.value}></PracticeRanking>
             </NTabPane>
           </NTabs>
 

src/views/home/components/practiceData.tsx

@@ -1,12 +1,20 @@
-import { Ref, defineComponent, reactive, ref } from 'vue';
+import { Ref, defineComponent, onMounted, reactive, ref } from 'vue';
 import styles from '../index.module.less';
 import { NButton, NDataTable, NNumberAnimation } from 'naive-ui';
 import numeral from 'numeral';
 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';
 export default defineComponent({
   name: 'home-practiceData',
-  setup() {
+  props:{
+    timer:{
+      type:Array,
+      defaut:()=>[]
+    }
+  },
+  setup(props,{expose}) {
     const chartRef = ref<HTMLDivElement | null>(null);
     const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
     const practiceFlag = ref(true);
@@ -105,9 +113,15 @@ export default defineComponent({
         }
       ];
     };
-    const getList = () => {
-      console.log('1');
+    const getList = async () => {
+      try{
+        const res = await getTrainingStat({  ...getTimes(props.timer, ['startTime', 'endTime'], 'YYYY-MM-DD')})
+
+      }catch(e){
+        console.log(e)
+      }
     };
+    expose({getList})
     const setChart = () => {
       setOptions({
         tooltip: {
@@ -215,7 +229,11 @@ export default defineComponent({
         // ]
       });
     };
-    setChart();
+    onMounted(()=>{
+      getList()
+      setChart();
+    })
+
     return () => (
       <>
         <div class={styles.homeTrainData}>

src/views/home/components/practiceRanking.tsx

@@ -15,7 +15,13 @@ import Pagination from '@/components/pagination';
 import add from './images/add.png';
 export default defineComponent({
   name: 'student-studentList',
-  setup(props, { emit }) {
+  props:{
+    timer:{
+      type:Array,
+      defaut:()=>[]
+    }
+  },
+  setup(props, { emit,expose }) {
     const state = reactive({
       searchWord: '',
       orchestraType: null,
@@ -70,7 +76,7 @@ export default defineComponent({
     const getList = () => {
       console.log('getList');
     };
-
+    expose({getList})
     const columns = () => {
       return [
         {

src/views/home/components/study.tsx

@@ -10,6 +10,7 @@ export default defineComponent({
   name: 'home-study',
   setup() {
     const chioseTab = ref('trainData');
+    const timer = ref([])
     return () => (
       <>
         <div class={styles.homeStudy}>
@@ -52,7 +53,10 @@ export default defineComponent({
             </div>
             <div class={styles.homeStudyInfoDate}>
               <NSpace>
-                <CDatePicker separator={'-'} type="daterange"></CDatePicker>
+                <CDatePicker
+                  separator={'-'}
+                  type="daterange"
+                  timerValue={timer.value}></CDatePicker>
                 <NButton type="primary" class={styles.searchBtn}>
                   搜索
                 </NButton>

src/views/home/components/trainData.tsx

@@ -1,12 +1,20 @@
-import { Ref, defineComponent, reactive, ref } from 'vue';
+import { Ref, defineComponent, onMounted, reactive, ref } from 'vue';
 import styles from '../index.module.less';
 import { NButton, NDataTable, NNumberAnimation } 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';
 export default defineComponent({
   name: 'home-trainData',
-  setup() {
+  props: {
+    timer: {
+      type: Array,
+      defaut: () => []
+    }
+  },
+  setup(props, { expose }) {
     const chartRef = ref<HTMLDivElement | null>(null);
     const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
     const qualifiedFlag = ref(true);
@@ -28,6 +36,14 @@ export default defineComponent({
       studentList: [50, 100, 80, 180, 70, 99, 300],
       payInfoList: [100, 200, 300, 450, 330, 200, 10]
     });
+    const totalDateRef = ref({
+      qualifiedRate: 9,
+      qualifiedStudentCount: 1,
+      submitStudentCount: 3,
+      totalStudentCount: 11,
+      trainingCount: 4,
+      trainingRate: 27, //
+    } as any);
     const state = reactive({
       loading: false,
       pagination: {
@@ -152,9 +168,16 @@ export default defineComponent({
         }
       ];
     };
-    const getList = () => {
-      console.log('1');
+    const getList = async () => {
+      try {
+        const res = await getTrainingStat({
+          ...getTimes(props.timer, ['startTime', 'endTime'], 'YYYY-MM-DD')
+        });
+      } catch (e) {
+        console.log(e);
+      }
     };
+    expose({ getList });
     const setChart = () => {
       setOptions({
         tooltip: {
@@ -330,7 +353,11 @@ export default defineComponent({
         // ]
       });
     };
-    setChart();
+    onMounted(() => {
+      getList();
+      setChart();
+    });
+
     return () => (
       <>
         <div class={styles.homeTrainData}>
@@ -339,7 +366,7 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={6}></NNumberAnimation>
+                    <NNumberAnimation from={0} to={totalDateRef.value.trainingCount}></NNumberAnimation>
                   </span>
                   次
                 </p>
@@ -348,7 +375,7 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={100}></NNumberAnimation>
+                    <NNumberAnimation from={0} to={totalDateRef.value.totalStudentCount}></NNumberAnimation>
                   </span>
                   人次
                 </p>
@@ -357,7 +384,7 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={40}></NNumberAnimation>
+                    <NNumberAnimation from={0} to={totalDateRef.value.submitStudentCount}></NNumberAnimation>
                   </span>
                   人次
                 </p>
@@ -367,7 +394,7 @@ export default defineComponent({
                 <p class={styles.TrainDataItemTitle}>
                   <span>
                     {' '}
-                    <NNumberAnimation from={0} to={30}></NNumberAnimation>
+                    <NNumberAnimation from={0} to={totalDateRef.value.qualifiedStudentCount}></NNumberAnimation>
                   </span>
                   人次
                 </p>
@@ -376,7 +403,7 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={40}></NNumberAnimation>%
+                    <NNumberAnimation from={0} to={totalDateRef.value.trainingRate}></NNumberAnimation>%
                   </span>
                 </p>
                 <p class={styles.TrainDataItemsubTitle}>训练提交率</p>
@@ -384,7 +411,7 @@ export default defineComponent({
               <div class={styles.TrainDataItem}>
                 <p class={styles.TrainDataItemTitle}>
                   <span>
-                    <NNumberAnimation from={0} to={30}></NNumberAnimation>%
+                    <NNumberAnimation from={0} to={totalDateRef.value.qualifiedRate}></NNumberAnimation>%
                   </span>
                 </p>
                 <p class={styles.TrainDataItemsubTitle}>训练合格率</p>