瀏覽代碼

feat: :sparkles: 学校级数据看板-图表渲染

chaooo 1 年之前
父節點
當前提交
b09ae5637b

+ 2 - 2
src/api/student/index.ts

@@ -1,6 +1,6 @@
 import request from "@/utils/request";
 import {AxiosPromise} from "axios";
-import {StudentBoard, StudentManage, StudentParams} from "@/api/student/types";
+import {ReportExcel, StudentBoard, StudentManage, StudentParams} from "@/api/student/types";
 
 /**
  * 学生管理
@@ -27,7 +27,7 @@ export function getStudentBoard(id: number, school_id: number): AxiosPromise<Stu
 /**
  * 报告原始数据下载
  */
-export function getStudentReportExcel(school_id: number): AxiosPromise<StudentBoard> {
+export function getStudentReportExcel(school_id: number): AxiosPromise<ReportExcel[]> {
   return request({
     url: "/board/v1/game-export",
     method: "get",

+ 5 - 5
src/components/Charts/LineChart.vue

@@ -55,11 +55,11 @@ const tipFormatter = (params: any) => {
   return label.join("<br>");
 };
 const getXAxisData = () => {
-  let l1 = props.dataSets?.[0].length | 0;
-  let l2 = props.dataSW?.[0].length | 0;
-  let l3 = props.dataKL?.[0].length | 0;
-  let l4 = props.dataZZL?.[0].length | 0;
-  let len = Math.max(l1, l2, l3, l4);
+  let l1: number = props.dataSets?.[0].length | 0;
+  let l2: number = props.dataSW?.[0].length | 0;
+  let l3: number = props.dataKL?.[0].length | 0;
+  let l4: number = props.dataZZL?.[0].length | 0;
+  let len: number = Math.max(l1, l2, l3, l4);
   len = len > 15 ? len : 15;
   let result = [];
   for (let i = 0; i < len; i++) {

+ 17 - 7
src/views/admin/components/ComboCharts.vue

@@ -59,6 +59,7 @@ async function getPieChartData(params: AreaChartParams) {
 const lineStatus = ref(false);
 const lineMessage = ref("加载中...");
 const lineChartData = ref<AreaLineData>();
+let curveDataKey = ref("");
 const curveData = ref<number[][]>();
 const swCurveData = ref<number[][]>();
 const klCurveData = ref<number[][]>();
@@ -83,12 +84,17 @@ async function getLineChartData(params: AreaChartParams) {
 }
 async function getLineChartDataSub(result: Ref<number[][] | undefined>, params: AreaChartParams) {
   let tempData: AreaLineData;
-  getAreaBoardLines(params).then(({data}) => {
-    tempData = data;
-    result.value = [];
-    result.value?.push(tempData?.curve || []);
-    result.value?.push(tempData?.num || []);
-  });
+  getAreaBoardLines(params)
+    .then(({data}) => {
+      tempData = data;
+      result.value = [];
+      result.value?.push(tempData?.curve || []);
+      result.value?.push(tempData?.num || []);
+    })
+    .catch((error) => {
+      result.value = [[], []];
+      console.log(error.message);
+    });
 }
 /**
  * 筛选条件
@@ -115,12 +121,16 @@ watchEffect(() => {
   // 折线图数据
   dataParams.device_id = 0;
   getLineChartData(dataParams);
+  curveDataKey.value = curveData.toString();
   dataParams.device_id = 1;
   getLineChartDataSub(swCurveData, dataParams);
+  curveDataKey.value += swCurveData.toString();
   dataParams.device_id = 6;
   getLineChartDataSub(klCurveData, dataParams);
+  curveDataKey.value += klCurveData.toString();
   dataParams.device_id = 7;
   getLineChartDataSub(zzlCurveData, dataParams);
+  curveDataKey.value += zzlCurveData.toString();
 });
 </script>
 
@@ -220,7 +230,7 @@ watchEffect(() => {
           <template v-if="lineStatus">
             <line-chart
               id="lineChart1"
-              :key="dataParams?.toString()"
+              :key="curveDataKey"
               :dataSets="curveData || [[], []]"
               :dataSW="swCurveData || [[], []]"
               :dataKL="klCurveData || [[], []]"

+ 4 - 5
src/views/admin/excel/index.vue

@@ -16,8 +16,8 @@ defineOptions({
   name: "ComplexTable",
   inheritAttrs: false,
 });
-
-const getList = (schoolId) => {
+const list = ref<ReportExcel[]>([]);
+const getList = (schoolId: number) => {
   getStudentReportExcel(schoolId)
     .then(({data}) => {
       console.log(data);
@@ -74,7 +74,6 @@ const handleDownload = () => {
     window.history.back();
   });
 };
-const list = ref<ReportExcel[]>([]);
 const formatJson = (filterVal: string[]) => {
   return list.value.map((v: any) =>
     filterVal.map((j: any) => {
@@ -103,8 +102,8 @@ const formatJson = (filterVal: string[]) => {
 
 onMounted(async () => {
   let schoolId = 0;
-  if (getUrlParam("school") && getUrlParam("school") * 1 > 0) {
-    schoolId = getUrlParam("school") * 1;
+  if (getUrlParam("school") && Number(getUrlParam("school")) > 0) {
+    schoolId = Number(getUrlParam("school"));
   }
   getList(schoolId);
 });

+ 2 - 2
src/views/admin/school/index.vue

@@ -8,7 +8,7 @@ import ComboCharts from "@/views/admin/components/ComboCharts.vue";
 import {trimInput} from "@/utils";
 import {StudentItem, StudentParams} from "@/api/student/types";
 import {getStudentLists} from "@/api/student";
-import {useRouter} from "vue-router";
+import {RouteLocationRaw, useRouter} from "vue-router";
 import SvgIcon from "@/components/SvgIcon/index.vue";
 
 const router = useRouter();
@@ -138,7 +138,7 @@ function getSchoolSearch() {
   getStudentData();
 }
 
-function pathTo(url: String) {
+function pathTo(url: RouteLocationRaw) {
   // 记录搜索条件
   sessionStorage.setItem("schoolChartParams", JSON.stringify(dataParams));
   sessionStorage.setItem("schoolStudentParams", JSON.stringify(studentParams));

+ 6 - 6
src/views/admin/training/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {useRouter} from "vue-router";
+import {RouteLocationRaw, useRouter} from "vue-router";
 import {TrainingItem, TrainingStudentParams} from "@/api/training/types";
 import {getTrainingListByStudent} from "@/api/training";
 import {getUrlParam} from "@/utils";
@@ -38,18 +38,18 @@ function getTrainingSearch() {
 function alertError() {
   ElMessage.error("本次训练采集的数据不足,无法分析并生成有效报告!");
 }
-function pathTo(url: String) {
+function pathTo(url: RouteLocationRaw) {
   // 记录搜索条件
   sessionStorage.setItem("studentsParams", JSON.stringify(pageParams));
   // 路由跳转
   router.push(url);
 }
 onMounted(() => {
-  if (getUrlParam("id") && getUrlParam("id") * 1 > 0) {
-    pageParams.baby_id = getUrlParam("id") * 1;
+  if (getUrlParam("id") && Number(getUrlParam("id")) > 0) {
+    pageParams.baby_id = Number(getUrlParam("id"));
   }
-  if (getUrlParam("grade") && getUrlParam("grade") * 1 > 0) {
-    pageParams.grade_id = getUrlParam("grade") * 1;
+  if (getUrlParam("grade") && Number(getUrlParam("grade")) > 0) {
+    pageParams.grade_id = Number(getUrlParam("grade"));
   }
   // 获取记录的搜索条件
   let params = sessionStorage.getItem("studentsParams");

+ 2 - 2
src/views/customer/student/download.vue

@@ -73,8 +73,8 @@ function goBack() {
 const dialogVisible = ref(false);
 onMounted(() => {
   let schoolId: number = userStore.schoolId;
-  if (getUrlParam("school") && getUrlParam("school") * 1 > 0) {
-    schoolId = getUrlParam("school") * 1;
+  if (getUrlParam("school") && Number(getUrlParam("school")) > 0) {
+    schoolId = Number(getUrlParam("school"));
   }
   // 图表数据
   getChartData(schoolId);

+ 2 - 2
src/views/customer/student/index.vue

@@ -5,7 +5,7 @@ import {getGradeSelect} from "@/api/grade";
 import {getStudentLists} from "@/api/student";
 import {StudentItem, StudentParams} from "@/api/student/types";
 import {trimInput} from "@/utils";
-import {useRouter} from "vue-router";
+import {RouteLocationRaw, useRouter} from "vue-router";
 
 const router = useRouter();
 const userStore = useUserStore();
@@ -67,7 +67,7 @@ function getStudentSearch() {
 function alertError() {
   ElMessage.error("该学生训练数据还不足以进行训练效果分析,请至少完成16次专注力训练后再来查看。");
 }
-function pathTo(url: String) {
+function pathTo(url: RouteLocationRaw) {
   // 记录搜索条件
   sessionStorage.setItem("studentsParams", JSON.stringify(pageParams));
   // 路由跳转

+ 2 - 2
src/views/customer/student/result.vue

@@ -62,8 +62,8 @@ function starElement(index: number, compare: number) {
 
 onMounted(() => {
   let schoolId: number = userStore.schoolId;
-  if (getUrlParam("school") && getUrlParam("school") * 1 > 0) {
-    schoolId = getUrlParam("school") * 1;
+  if (getUrlParam("school") && Number(getUrlParam("school")) > 0) {
+    schoolId = Number(getUrlParam("school"));
   }
   // 图表数据
   getChartData(schoolId);

+ 2 - 2
src/views/customer/training/index.vue

@@ -5,7 +5,7 @@ import {TrainingItem, TrainingParams} from "@/api/training/types";
 import {getGradeSelect} from "@/api/grade";
 import {getTrainingLists} from "@/api/training";
 import {trimInput} from "@/utils";
-import {useRouter} from "vue-router";
+import {RouteLocationRaw, useRouter} from "vue-router";
 
 const router = useRouter();
 const userStore = useUserStore();
@@ -72,7 +72,7 @@ function getTrainingSearch() {
 function alertError() {
   ElMessage.error("本次训练采集的数据不足,无法分析并生成有效报告!");
 }
-function pathTo(url: String) {
+function pathTo(url: RouteLocationRaw) {
   // 记录搜索条件
   sessionStorage.setItem("trainingParams", JSON.stringify(pageParams));
   // 路由跳转