build: 设备管理接口调试

src/api/equipment/index.ts

@@ -0,0 +1,16 @@
+import request from "@/utils/request";
+import {AxiosPromise} from "axios";
+import {EquipmentManage, EquipmentParams} from "@/api/equipment/types";
+
+/**
+ * 设备管理
+ * ///board/v1/equipment?school_id=95&teacher_id=11&sn=
+ */
+export function getEquipmentLists(params: EquipmentParams): AxiosPromise<EquipmentManage[]> {
+	return request({
+		url: "/board/v1/equipment",
+		method: "get",
+		params: params,
+	});
+}
+

src/api/equipment/types.ts

@@ -0,0 +1,43 @@
+/**
+ * 获取设备参数
+ */
+export interface EquipmentParams {
+	school_id: number;
+	teacher_id:number;
+	// 设备编号
+	sn: string;
+}
+/**
+ * 设备列表
+ */
+export interface EquipmentItem{
+	// 设备编号
+	sn: string;
+	// 使用者
+	name: string;
+	// 电话
+	phone: string;
+	software_version: string;
+	create_time: string;
+}
+/**
+ * 设备管理
+ */
+export interface EquipmentManage {
+	// 脑机
+	AI: EquipmentItem[];
+	// 水舞
+	SW: EquipmentItem[];
+	// 恐龙
+	KL: EquipmentItem[];
+	// 碰碰车
+	PP: EquipmentItem[];
+	// SUV
+	SU: EquipmentItem[];
+	// 赛车
+	SC: EquipmentItem[];
+	// UFO
+	UF: EquipmentItem[];
+	// 积木
+	JM: EquipmentItem[];
+}

src/api/teacher/index.ts

@@ -1,20 +1,30 @@
 import request from "@/utils/request";
 import {AxiosPromise} from "axios";
 import {GradeList} from "@/api/grade/types";
-import {TeacherEquipment, TeacherList} from "@/api/teacher/types";
+import {TeacherEquipment, TeacherList, TeacherManage} from "@/api/teacher/types";
 /**
- * 获取教师列表
+ * 获取教师管理列表
  */
-export function getTeacherList(
+export function getTeacherManage(
 	id: number,
 	keyword: string
-): AxiosPromise<TeacherList[]> {
+): AxiosPromise<TeacherManage[]> {
 	return request({
 		url: "/board/v1/teacher",
 		method: "get",
 		params: {school_id: id, search: keyword},
 	});
 }
+/**
+ * 获取教师下拉框列表
+ */
+export function getTeacherList(id: number): AxiosPromise<TeacherList[]> {
+	return request({
+		url: "/board/v1/teacher",
+		method: "get",
+		params: {school_id: id},
+	});
+}
 
 /**
  * 获取教师设备

src/api/teacher/types.ts

@@ -2,17 +2,20 @@ import {GradeList} from "@/api/grade/types";
 /**
  * 教师列表
  */
-export interface TeacherList {
+export interface TeacherManage {
 	lists: TeacherItem[];
 	// 数量
 	count: number;
 }
 
-export interface TeacherItem {
-	// 学生id
+export interface TeacherList {
+	// 教师id
 	id: number;
-	// 学生名称
+	// 教师名称
 	name: string;
+}
+
+export interface TeacherItem extends TeacherList{
 	// 注册时间
 	create_time: string;
 	// 折叠面板使用

src/views/dashboard/components/DataCard.vue

@@ -1,6 +1,7 @@
 <!-- 数据卡片 -->
 <script setup lang="ts">
 import { TransitionPresets, useTransition } from "@vueuse/core";
+import {watch} from "vue";
 
 const props = defineProps({
   classes: {
@@ -53,12 +54,27 @@ const trainingCount = ref(0);
 const trainingCountOutput = countNumber(trainingCount);
 // 监听数据变化
 watchEffect(() => {
+	console.log("card")
   classCount.value = <number>props.classes;
   teacherCount.value = <number>props.teachers;
   studentCount.value = <number>props.students;
   equipmentCount.value = <number>props.equipments;
   trainingCount.value = <number>props.trainings;
 });
+watch(
+	() => classCount,
+	(newValue) => {
+		console.log("classCount",newValue.value);
+		// classCount.value = <number>newValue.classes;
+		// teacherCount.value = <number>newValue.teachers;
+		// studentCount.value = <number>newValue.students;
+		// equipmentCount.value = <number>newValue.equipments;
+		// trainingCount.value = <number>newValue.trainings;
+	},{
+		deep:true,
+		immediate:true,
+	}
+);
 </script>
 <template>
   <el-row :gutter="40" class="data-card">

src/views/dashboard/index.vue

@@ -3,11 +3,11 @@ import DataCard from "@/views/dashboard/components/DataCard.vue";
 import LiquidChart from "@/views/charts-components/LiquidChart.vue";
 import CircleChart from "@/views/charts-components/CircleChart.vue";
 import PercentBarChart from "@/views/charts-components/PercentBarChart.vue";
-import { watch } from "vue";
-import { useUserStore } from "@/store/modules/user";
+import {watch} from "vue";
+import {useUserStore} from "@/store/modules/user";
 
-import { getDashboardData, getDashboardTop } from "@/api/dashboard";
-import { DashboardCard, DashboardData } from "@/api/dashboard/types";
+import {getDashboardData, getDashboardTop} from "@/api/dashboard";
+import {DashboardCard, DashboardData} from "@/api/dashboard/types";
 import {getGradeSelect} from "@/api/grade";
 import {GradeList} from "@/api/grade/types";
 
@@ -19,6 +19,7 @@ defineOptions({
 /**
  * 数据卡片
  */
+const cardStatus = ref(false);
 let cards: DashboardCard = reactive({
   grade: 0, // 全部班级
   teacher: 0, // 全部教师
@@ -30,6 +31,7 @@ async function getDataCard(schoolId: number) {
   getDashboardTop(schoolId)
     .then(({ data }) => {
       cards = <DashboardCard>{ ...data };
+			cardStatus.value = true;
     })
     .catch((error) => {
       console.log(error);
@@ -57,6 +59,7 @@ async function getGradeData(schoolId: number) {
  * 图表数据
  */
 const chartStatus = ref(false);
+const chartMessage = ref("加载中...");
 let chartData: DashboardData = reactive({
   frontAverage: 0, // 初期专注力估值
   afterAverage: 0, // 近期专注力估值
@@ -66,26 +69,21 @@ let chartData: DashboardData = reactive({
   afterProportion: { num: [], percentage: [] }, // 近期分期占比分析
 });
 async function getChartData(schoolId:number, gradeId: number) {
+	chartStatus.value = false;
   getDashboardData(schoolId, gradeId)
     .then(({ data }) => {
       chartData = <DashboardData>{ ...data };
-      if (chartData.frontAverage > 0) {
-        chartStatus.value = true;
-        dataStatus.value = 1;
-      }
+			chartStatus.value = true;
     })
     .catch((error) => {
-			dataStatus.value = 5;
-			dataMessage.value = error.message;
+			chartStatus.value = false;
+			chartMessage.value = error.message;
       console.log(error.message);
     });
 }
-// 数据状态：1正常，2训练次数小于3，3过期，4缺省，5接口直接返回缺省信息error.message
-const dataStatus = ref(5);
-const dataMessage = ref("加载中...");
+
 // 改变班级重新加载图表数据
 function changeGrade() {
-  dataStatus.value = 5;
   getChartData(userStore.schoolId, gradeId.value);
 }
 onMounted(() => {
@@ -102,7 +100,6 @@ watch(
     console.log("userStore.schoolId", newValue, oldValue);
     // 学校切换后重新加载数据
     gradeId.value = 0;
-    dataStatus.value = 5;
     getGradeData(newValue);
     getDataCard(newValue);
     getChartData(newValue,0);
@@ -113,14 +110,16 @@ watch(
 <template>
   <div class="dashboard-container">
     <!-- 数据卡片 -->
-    <DataCard
-      :key="cards.toString()"
-      :classes="cards.grade"
-      :teachers="cards.teacher"
-      :students="cards.student"
-      :equipments="cards.equipment"
-      :trainings="cards.game"
-    />
+		<template v-if="cardStatus">
+			<DataCard
+					:key="cards.toString()"
+					:classes="cards.grade"
+					:teachers="cards.teacher"
+					:students="cards.student"
+					:equipments="cards.equipment"
+					:trainings="cards.game"
+			/>
+		</template>
 
     <!-- 班级选择 及 案例展示 -->
     <div class="class-select clear">
@@ -141,13 +140,13 @@ watch(
     </div>
 
     <!-- Echarts 图表 -->
-    <el-row v-if="dataStatus == 1" :gutter="20">
+    <el-row v-if="chartStatus" :gutter="20">
       <el-col :md="24" :lg="12" :xl="8">
         <div class="charts-item">
           <p class="title">学员专注力平均值整体对比分析</p>
           <el-row justify="space-between">
             <el-col :xs="24" :sm="12">
-              <div v-if="chartStatus" class="item">
+              <div class="item">
                 <LiquidChart
                   id="liquidChart1"
                   :key="chartData.frontAverage"
@@ -163,7 +162,7 @@ watch(
               </div>
             </el-col>
             <el-col :xs="24" :sm="12">
-              <div v-if="chartStatus" class="item">
+              <div class="item">
                 <LiquidChart
                   id="liquidChart2"
                   :key="chartData.afterAverage"
@@ -181,7 +180,7 @@ watch(
           </el-row>
           <el-row justify="space-between">
             <el-col :xs="24" :sm="12">
-              <div v-if="chartStatus" class="item">
+              <div class="item">
                 <CircleChart
                   id="circleChart1"
                   :key="chartData.front"
@@ -199,7 +198,7 @@ watch(
               </div>
             </el-col>
             <el-col :xs="24" :sm="12">
-              <div v-if="chartStatus" class="item">
+              <div class="item">
                 <CircleChart
                   id="circleChart2"
                   :key="chartData.after.toString()"
@@ -225,7 +224,7 @@ watch(
           <p class="title">学员专注力评分分级占比分析</p>
           <el-row justify="space-between">
             <el-col :xs="24" :sm="24" :md="12" :lg="24" :xl="12">
-              <div v-if="chartStatus" class="bar">
+              <div class="bar">
                 <PercentBarChart
                   id="barChart1"
                   :key="chartData.frontProportion.toString()"
@@ -239,7 +238,7 @@ watch(
               </div>
             </el-col>
             <el-col :xs="24" :sm="24" :md="12" :lg="24" :xl="12">
-              <div v-if="chartStatus" class="bar">
+              <div class="bar">
                 <PercentBarChart
                   id="barChart2"
                   :key="chartData.afterProportion.toString()"
@@ -270,9 +269,9 @@ watch(
 <!--          <div v-if="dataStatus == 4" class="empty">-->
 <!--            <p>您的学校还没有任何训练数据！</p>-->
 <!--          </div>-->
-          <div v-if="dataStatus == 5" class="empty">
+          <div class="empty">
 						<img src="../../assets/empty.png" alt="数据为空">
-            <p>{{ dataMessage }}</p>
+            <p>{{ chartMessage }}</p>
           </div>
         </div>
       </el-col>
@@ -289,9 +288,9 @@ watch(
 <!--          <div v-if="dataStatus == 4" class="empty">-->
 <!--            <p>您的学校还没有任何训练数据！</p>-->
 <!--          </div>-->
-          <div v-if="dataStatus == 5" class="empty">
+          <div class="empty">
 						<img src="../../assets/empty.png" alt="数据为空">
-            <p>{{ dataMessage }}</p>
+            <p>{{ chartMessage }}</p>
           </div>
         </div>
       </el-col>

src/views/equipment/index.vue

@@ -1,460 +1,484 @@
 <script setup lang="ts">
-import {GradeList} from "@/api/grade/types";
+import {watch} from "vue";
+import {useUserStore} from "@/store/modules/user";
+import {TeacherList, TeacherManage} from "@/api/teacher/types";
+import {getTeacherList} from "@/api/teacher";
+import {EquipmentManage, EquipmentParams} from "@/api/equipment/types";
+import {getEquipmentLists} from "@/api/equipment";
 
+const userStore = useUserStore();
 defineOptions({
-  name: "EquipmentIndex",
-  inheritAttrs: false,
+	name: "EquipmentIndex",
+	inheritAttrs: false,
 });
-import { watch } from "vue";
-import { useUserStore } from "@/store/modules/user";
 
-const userStore = useUserStore();
-watch(
-  () => userStore.schoolId,
-  (newValue, oldValue) => {
-    console.log(newValue, oldValue);
-  }
-);
+
 let equipmentInfo = ref("");
 // 教师编号
 let teacherNumber = ref(0);
-const teacherData = ref<GradeList[]>([
-  {
-    id: 0,
-    name: "全部",
-  },
-]);
+// const teacherData = ref<GradeList[]>([
+//   {
+//     id: 0,
+//     name: "全部",
+//   },
+// ]);
+
+
+// 获取教师
+const teacherSelect = ref<TeacherList[]>();
+
+async function getTeacherData(schoolId: number) {
+	getTeacherList(schoolId)
+			.then(({data}) => {
+				const temp: TeacherManage = data;
+				teacherSelect.value = temp.lists;
+				teacherSelect.value?.unshift({id: 0, name: "全部教师"})
+			})
+			.catch((error) => {
+				console.log(error);
+			});
+}
+
+// 获取设备
+const equipmentParams: EquipmentParams = reactive({});
+let equipmentData: EquipmentManage = reactive({});
+const equipmentStatus = ref(false);
+const dataStatus = reactive({
+	AI: false,
+	SW: false,
+	KL: false,
+	PP: false,
+	SU: false,
+	SC: false,
+	UF: false,
+	JM: false,
+});
+const dataMessage = ref("加载中...");
+
+async function getEquipmentData(schoolId: number) {
+	equipmentParams.school_id = schoolId;
+	getEquipmentLists(equipmentParams)
+			.then(({data}) => {
+				equipmentData = <EquipmentManage>{...data};
+				dataStatus.AI = equipmentData?.AI.length > 0 || false;
+				dataStatus.SW = equipmentData?.SW.length > 0 || false;
+				dataStatus.KL = equipmentData?.KL.length > 0 || false;
+				dataStatus.PP = equipmentData?.PP.length > 0 || false;
+				dataStatus.SU = equipmentData?.SU.length > 0 || false;
+				dataStatus.SC = equipmentData?.SC.length > 0 || false;
+				dataStatus.UF = equipmentData?.UF.length > 0 || false;
+				dataStatus.JM = equipmentData?.JM.length > 0 || false;
+				equipmentStatus.value = dataStatus.AI || dataStatus.SW || dataStatus.KL || dataStatus.PP || dataStatus.SU || dataStatus.SC || dataStatus.UF || dataStatus.JM;
+				if (!equipmentStatus.value) {
+					dataMessage.value = "没有符合条件的搜索记录或该学校未绑定任何设备！";
+				}
+			})
+			.catch((error) => {
+				dataMessage.value = error.message;
+				console.log(error);
+			});
+}
+
+function getEquipmentSearch() {
+	getEquipmentData(userStore.schoolId);
+}
+
+onMounted(() => {
+	getTeacherData(userStore.schoolId);
+	getEquipmentData(userStore.schoolId);
+});
+watch(
+		() => userStore.schoolId,
+		(newValue) => {
+			// 学校切换后重新获取
+			equipmentParams.school_id = newValue;
+			equipmentParams.teacher_id = 0;
+			equipmentParams.sn = "";
+			getTeacherData(newValue);
+			getEquipmentData(newValue);
+		}
+);
 </script>
 
 <template>
-  <div class="equipment-container">
-    <!-- 设备查找 -->
-    <div class="equipment-search">
-      <el-select
-        v-model="teacherNumber"
-        placeholder="请选择使用者名称"
-        size="large"
-      >
-        <el-option
-          v-for="item in teacherData"
-          :key="item.id"
-          :label="item.name"
-          :value="item.id"
-        />
-      </el-select>
-      <el-input
-        v-model="equipmentInfo"
-        size="large"
-        placeholder="请输入设备编号"
-      />
-      <el-button size="large" type="primary">查找</el-button>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>水母星球脑机</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i nj"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i nj"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i nj"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i nj"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i nj"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i nj"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>智脑水舞</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i sw"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>智脑碰碰车</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i ppc"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>智脑赛车</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i sc"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>智脑恐龙</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i kl"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>智脑SUV</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i suv"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>智脑UFO</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i ufo"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="equipment-box">
-      <div class="title"><span>智脑积木</span><b>5</b>台</div>
-      <el-row :gutter="15">
-        <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
-          <div class="box-card">
-            <el-row>
-              <el-col :span="9" class="img">
-                <div class="i jm"></div>
-                <div class="value">AI30200274</div>
-              </el-col>
-              <el-col :span="15" class="info">
-                <div class="label mb-2">固件版本</div>
-                <div class="value mb-4">1.06-5-85E3FEB</div>
-                <div class="label mb-2">绑定时间</div>
-                <div class="value mb-4">2023-07-12 13:22</div>
-                <div class="label mb-2">使用者</div>
-                <div class="value mb-2">松阪老师</div>
-                <div class="value">13766278827</div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-  </div>
+	<div class="equipment-container">
+		<!-- 设备查找 -->
+		<div class="equipment-search">
+			<el-select
+					v-model="equipmentParams.teacher_id"
+					placeholder="请选择使用者名称"
+					size="large"
+			>
+				<el-option
+						v-for="item in teacherSelect"
+						:key="item.id"
+						:label="item.name"
+						:value="item.id"
+				/>
+			</el-select>
+			<el-input
+					v-model="equipmentParams.sn"
+					size="large"
+					placeholder="请输入设备编号"
+			/>
+			<el-button size="large" type="primary" @click="getEquipmentSearch()">查找</el-button>
+		</div>
+		<template v-if="equipmentStatus">
+			<div v-if="dataStatus.AI" class="equipment-box">
+				<div class="title"><span>水母星球脑机</span><b>{{ equipmentData.AI.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.AI" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i nj"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+			<div v-if="dataStatus.SW" class="equipment-box">
+				<div class="title"><span>智脑水舞</span><b>{{ equipmentData.SW.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.SW" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i sw"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+			<div v-if="dataStatus.KL" class="equipment-box">
+				<div class="title"><span>智脑恐龙</span><b>{{ equipmentData.KL.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.KL" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i sc"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+			<div v-if="dataStatus.PP" class="equipment-box">
+				<div class="title"><span>智脑碰碰车</span><b>{{ equipmentData.PP.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.PP" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i ppc"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+			<div v-if="dataStatus.SU" class="equipment-box">
+				<div class="title"><span>智脑SUV</span><b>{{ equipmentData.SU.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.SU" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i kl"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+			<div v-if="dataStatus.SC" class="equipment-box">
+				<div class="title"><span>智脑赛车</span><b>{{ equipmentData.SC.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.SC" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i suv"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+			<div v-if="dataStatus.UF" class="equipment-box">
+				<div class="title"><span>智脑UFO</span><b>{{ equipmentData.UF.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.UF" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i ufo"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+			<div v-if="dataStatus.JM" class="equipment-box">
+				<div class="title"><span>智脑积木</span><b>{{ equipmentData.JM.length }}</b>台</div>
+				<el-row :gutter="15">
+					<template v-for="item in equipmentData.JM" :key="item.sn">
+						<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
+							<div class="box-card">
+								<el-row>
+									<el-col :span="9" class="img">
+										<div class="i jm"></div>
+										<div class="value">{{ item.sn }}</div>
+									</el-col>
+									<el-col :span="15" class="info">
+										<div class="label mb-2">固件版本</div>
+										<div class="value mb-4">{{ item.software_version }}</div>
+										<div class="label mb-2">绑定时间</div>
+										<div class="value mb-4">{{ item.create_time }}</div>
+										<div class="label mb-2">使用者</div>
+										<div class="value mb-2">{{ item.name }}</div>
+										<div class="value">{{ item.phone }}</div>
+									</el-col>
+								</el-row>
+							</div>
+						</el-col>
+					</template>
+				</el-row>
+			</div>
+		</template>
+		<template v-else>
+			<div class="empty">
+				<img src="../../assets/empty.png" alt="数据为空">
+				<p>{{ dataMessage }}</p>
+			</div>
+		</template>
+	</div>
 </template>
 
 <style lang="scss" scoped>
 .equipment-container {
-  position: relative;
-  padding: 20px 30px;
+	position: relative;
+	padding: 20px 30px;
 }
+
 .equipment-search {
-  margin-bottom: 20px;
-  font-size: 16px;
-  .el-select {
-    width: 180px;
-    margin: 0 20px 0 0;
-  }
-  .el-input {
-    width: 180px;
-    margin: 0;
-  }
-  :deep(.el-input__inner) {
-    font-size: 16px;
-  }
-  .el-button {
-    font-size: 16px;
-    padding: 0 26px;
-    margin: 0 20px;
-    border-radius: 12px;
-  }
+	margin-bottom: 20px;
+	font-size: 16px;
+
+	.el-select {
+		width: 180px;
+		margin: 0 20px 0 0;
+	}
+
+	.el-input {
+		width: 180px;
+		margin: 0;
+	}
+
+	:deep(.el-input__inner) {
+		font-size: 16px;
+	}
+
+	.el-button {
+		font-size: 16px;
+		padding: 0 26px;
+		margin: 0 20px;
+		border-radius: 12px;
+	}
+}
+.empty{
+	padding:200px 0;
 }
 /* 自定义 el-select 样式 */
 :deep(.el-input__wrapper) {
-  background: #ffffff;
-  border-radius: 12px;
+	background: #ffffff;
+	border-radius: 12px;
 }
+
 :deep(.el-input__wrapper) {
-  box-shadow: none !important;
+	box-shadow: none !important;
 }
+
 :deep(.el-select) {
-  --el-select-input-focus-border-color: none !important;
+	--el-select-input-focus-border-color: none !important;
 }
+
 :deep(.el-select .el-input__wrapper.is-focus) {
-  box-shadow: none !important;
+	box-shadow: none !important;
 }
+
 :deep(.el-select:hover:not(.el-select--disabled) .el-input__wrapper) {
-  box-shadow: none !important;
+	box-shadow: none !important;
 }
+
 .equipment-box {
-  .title {
-    font-size: 16px;
-    color: #4284f2;
-    text-indent: 0.5em;
-    span {
-      font-size: 24px;
-      display: inline-block;
-      min-width: 180px;
-    }
-    b {
-      font-size: 28px;
-    }
-  }
-  .box-card {
-    background: #ffffff;
-    border-radius: 30px;
-    border: 1px solid #e6e8eb;
-    position: relative;
-    padding: 20px 0;
-    font-size: 14px;
-    margin-bottom: 10px;
-    .info {
-      border-left: 1px solid #e0e6f1;
-      padding-left: 28px;
-      line-height: 14px;
-      .label {
-        color: #999999;
-      }
-      .value {
-        color: #23283c;
-      }
-    }
-    .img {
-      text-align: center;
-      .i {
-        width: 120px;
-        height: 120px;
-        margin: 0 auto;
-        &.nj {
-          background: url("../../assets/equipment/NJ.png") center center
-            no-repeat;
-        }
-        &.sw {
-          background: url("../../assets/equipment/SW.png") center center
-            no-repeat;
-        }
-        &.kl {
-          background: url("../../assets/equipment/KL.png") center center
-            no-repeat;
-        }
-        &.suv {
-          background: url("../../assets/equipment/SUV.png") center center
-            no-repeat;
-        }
-        &.ufo {
-          background: url("../../assets/equipment/UFO.png") center center
-            no-repeat;
-        }
-        &.ppc {
-          background: url("../../assets/equipment/PPC.png") center center
-            no-repeat;
-        }
-        &.sc {
-          background: url("../../assets/equipment/SC.png") center center
-            no-repeat;
-        }
-        &.jm {
-          background: url("../../assets/equipment/JM.png") center center
-            no-repeat;
-        }
-      }
-    }
-  }
+	.title {
+		font-size: 16px;
+		color: #4284f2;
+		text-indent: 0.5em;
+
+		span {
+			font-size: 24px;
+			display: inline-block;
+			min-width: 180px;
+		}
+
+		b {
+			font-size: 28px;
+		}
+	}
+
+	.box-card {
+		background: #ffffff;
+		border-radius: 30px;
+		border: 1px solid #e6e8eb;
+		position: relative;
+		padding: 20px 0;
+		font-size: 14px;
+		margin-bottom: 10px;
+
+		.info {
+			border-left: 1px solid #e0e6f1;
+			padding-left: 28px;
+			line-height: 14px;
+
+			.label {
+				color: #999999;
+			}
+
+			.value {
+				color: #23283c;
+			}
+		}
+
+		.img {
+			text-align: center;
+
+			.i {
+				width: 120px;
+				height: 120px;
+				margin: 0 auto;
+
+				&.nj {
+					background: url("../../assets/equipment/NJ.png") center center no-repeat;
+				}
+
+				&.sw {
+					background: url("../../assets/equipment/SW.png") center center no-repeat;
+				}
+
+				&.kl {
+					background: url("../../assets/equipment/KL.png") center center no-repeat;
+				}
+
+				&.suv {
+					background: url("../../assets/equipment/SUV.png") center center no-repeat;
+				}
+
+				&.ufo {
+					background: url("../../assets/equipment/UFO.png") center center no-repeat;
+				}
+
+				&.ppc {
+					background: url("../../assets/equipment/PPC.png") center center no-repeat;
+				}
+
+				&.sc {
+					background: url("../../assets/equipment/SC.png") center center no-repeat;
+				}
+
+				&.jm {
+					background: url("../../assets/equipment/JM.png") center center no-repeat;
+				}
+			}
+		}
+	}
 }
 </style>

src/views/student/download.vue

@@ -105,7 +105,7 @@ const downloadHandle = (name:string)=>{
 
 <template>
 	<div class="container">
-		<el-dialog v-model="dialogVisible" title="已生成【训练效果分析报告】下载预览，您可以：">
+		<el-dialog v-model="dialogVisible" title="已生成【训练效果分析】离线报告，您可以：">
 			<el-button @click="dialogVisible=false">预览</el-button>
 			<el-button @click="downloadHandle(chartData.name)"  color="#626aef" class="mr-3">下载报告</el-button>
 			<router-link :to="'/student/result?id='+getUrlParam('id')"><el-button  color="#626aef" plain>返回上一页</el-button></router-link>
@@ -339,8 +339,9 @@ const downloadHandle = (name:string)=>{
 .container{
   min-width: 100%;
   min-height:100%;
-  background: #1e2e64 url("../../assets/404/404.png") no-repeat;
-	:deep(.el-dialog__body){text-align:center;}
+  //background: #1e2e64 url("../../assets/404/404.png") no-repeat;
+  background: #1e2e64;
+	:deep(.el-dialog){text-align:center;max-width:600px;}
 }
 .download-btn{
   position: fixed;

src/views/teacher/index.vue

@@ -2,8 +2,8 @@
 import { watch } from "vue";
 import { useUserStore } from "@/store/modules/user";
 
-import {getTeacherEquipment, getTeacherGrade, getTeacherList} from "@/api/teacher";
-import {TeacherItem, TeacherList} from "@/api/teacher/types";
+import {getTeacherEquipment, getTeacherGrade, getTeacherManage} from "@/api/teacher";
+import {TeacherItem, TeacherManage} from "@/api/teacher/types";
 
 const userStore = useUserStore();
 defineOptions({
@@ -22,9 +22,9 @@ let teacherCount = ref(0);
 let searchKeyword = ref("");
 // 获取教师
 async function getTeacherData(schoolId: number, keyword: string) {
-  getTeacherList(schoolId, keyword)
+  getTeacherManage(schoolId, keyword)
     .then(({ data }) => {
-      const temp: TeacherList = data;
+      const temp: TeacherManage = data;
       teacherData.value = temp.lists;
       teacherCount.value = temp.count;
 			dataStatus.value = 1;
@@ -76,12 +76,6 @@ watch(
     getTeacherData(newValue, "");
   }
 );
-watch(
-  () => userStore.schoolId,
-  (newValue, oldValue) => {
-    console.log(newValue, oldValue);
-  }
-);
 </script>
 
 <template>