Home Explore Help
Register Sign In
万载三中
/
wanzai_lingdaojiashi
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

no message

xiaoxin 2 years ago
parent
66dd5fd416
commit
2739efb8e5
11 changed files with 932 additions and 234 deletions
Unified View Show Diff Stats
  1. 4 4
      index.html
  2. 31 0
      src/api/school/index.ts
  3. 7 0
      src/api/user/index.ts
  4. BIN
      src/assets/images/2.png
  5. BIN
      src/assets/images/3.png
  6. 703 33
      src/components/school/schoolRight.vue
  7. 7 1
      src/components/student/studentCenter.vue
  8. 7 2
      src/components/student/studentLeft.vue
  9. 159 190
      src/components/student/studentRight.vue
  10. 1 1
      src/components/user/userRight.vue
  11. 13 3
      src/views/student.vue

+ 4 - 4
index.html
View File 

@@ -1,10 +1,10 @@
 
 <!DOCTYPE html>
 
 <!DOCTYPE html>
 
 <html lang="en">
 
 <html lang="en">
 
   <head>
 
   <head>
 
-    <meta charset="UTF-8">
 
-    <link rel="icon" href="/favicon.ico">
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-    <title>Vite App</title>
 
+    <meta charset="UTF-8" />
 
+    <link rel="icon" href="/favicon.ico" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+    <title>万载三中领导驾驶舱</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
     <div id="app"></div>
 
     <div id="app"></div>

+ 31 - 0
src/api/school/index.ts
View File 

@@ -9,6 +9,19 @@ enum API {
 
   VISITOR_URL = "/wanzai/api/driver/getVisitorTj",
 
   VISITOR_URL = "/wanzai/api/driver/getVisitorTj",
 
   // 预警推送信息接口地址
 
   // 预警推送信息接口地址
 
   WARNING_URL = "/wanzai/api/driver/queryPageSmartWarning",
 
   WARNING_URL = "/wanzai/api/driver/queryPageSmartWarning",
 
+  // 机动车通行记录接口
 
+  CARRECORD_URL = "/wanzai/api/smartCarAccess/getPage",
 
+  // 人员通行记录接口
 
+  PEOPLERECORD_URL = "/wanzai/api/smartAccess/getAccessPage",
 
+
 
+  // 门禁通行数量总数
 
+  TOTALCOUNT_URL = "/wanzai/api/smartAccess/totalCount",
 
+
 
+  // 获取年级列表数据
 
+  GRADELIST_URL = "/wanzai/api/smartGrade/querySmartGrades",
 
+
 
+  // 获取班级列表数据
 
+  CLASSLIST_URL = "/wanzai/api/smartClass/querySmartClasss",
 
 }
 
 }
 
 
 
 // 办学规模信息接口
 
 // 办学规模信息接口
 
@@ -22,3 +35,21 @@ export const reqGetSmartWarning = (data: smartWarningQuery) =>
 
   request.get(
 
   request.get(
 
     `${API.WARNING_URL}?currentPage=${data.currentPage}&pageCount=${data.pageCount}`
 
     `${API.WARNING_URL}?currentPage=${data.currentPage}&pageCount=${data.pageCount}`
 
   );
 
   );
 
+
 
+// 机动车通行记录
 
+export const reqGetCarRecord = (params: any) =>
 
+  request.get(API.CARRECORD_URL, { params });
 
+
 
+// 人员通行记录
 
+export const reqGetPeopleRecord = (params: any) =>
 
+  request.get(API.PEOPLERECORD_URL, { params });
 
+
 
+// 门禁通行数量总数
 
+export const reqGetTotalCount = () => request.get(API.TOTALCOUNT_URL);
 
+
 
+// 获取年级列表数据
 
+export const reqGetGradeList = () => request.get(API.GRADELIST_URL);
 
+
 
+// 获取班级列表数据
 
+export const reqGetClassList = (params: any) =>
 
+  request.get(API.CLASSLIST_URL, { params });

+ 7 - 0
src/api/user/index.ts
View File 

@@ -31,6 +31,9 @@ enum API {
 
 
 
   // 考勤记录列表数据
 
   // 考勤记录列表数据
 
   CHECKLIST = "/wanzai/api/smartAttendance/classHistoricalAttendance",
 
   CHECKLIST = "/wanzai/api/smartAttendance/classHistoricalAttendance",
 
+
 
+  // 获取个人亲密度列表
 
+  LIKELIST = "/wanzai/api/smartRelation/getList",
 
 }
 
 }
 
 
 
 // 获取用户汇总数据
 
 // 获取用户汇总数据
 
@@ -79,3 +82,7 @@ export const reqGetStudentCheckin = (params: any) =>
 
 // 考勤记录列表数据
 
 // 考勤记录列表数据
 
 export const reqGetCheckList = (params: any) =>
 
 export const reqGetCheckList = (params: any) =>
 
   request.get(API.CHECKLIST, { params });
 
   request.get(API.CHECKLIST, { params });
 
+
 
+// 获取个人亲密度列表
 
+export const reqGetLikeList = (data: any) =>
 
+  request.get(API.LIKELIST, { params: data });

BIN
src/assets/images/2.png
View File


BIN
src/assets/images/3.png
View File


+ 703 - 33
src/components/school/schoolRight.vue
View File 

@@ -7,29 +7,25 @@
 
     </div>
 
     </div>
 
     <!-- 内容区域 -->
 
     <!-- 内容区域 -->
 
     <div class="content">
 
     <div class="content">
 
-      <div class="sub_title">安全设施监控情况</div>
 
+      <!-- 门禁通行汇总区域 -->
 
+      <div class="sub_title">门禁通行汇总</div>
 
       <div class="device">
 
       <div class="device">
 
-        <div class="device_box">
 
+        <div class="device_box cursor" @click="handleClick(1)">
 
           <div class="box_img">
 
           <div class="box_img">
 
             <div class="box_num" ref="deviceDom">{{ deviceNum }}</div>
 
             <div class="box_num" ref="deviceDom">{{ deviceNum }}</div>
 
           </div>
 
           </div>
 
-          监控摄像头
 
+          机动车
 
         </div>
 
         </div>
 
 
 
-        <div class="device_box">
 
+        <div class="device_box cursor" @click="handleClick(2)">
 
           <div class="box_img">
 
           <div class="box_img">
 
             <div class="box_num" ref="deviceDom2">{{ deviceNum2 }}</div>
 
             <div class="box_num" ref="deviceDom2">{{ deviceNum2 }}</div>
 
           </div>
 
           </div>
 
-          报警器/监控器
 
-        </div>
 
-
 
-        <div class="device_box">
 
-          <div class="box_img">
 
-            <div class="box_num" ref="deviceDom3">{{ deviceNum3 }}</div>
 
-          </div>
 
-          消防设施
 
+          人员通行
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
+
 
+      <!-- 预警推送区域 -->
 
       <div class="sub_title">预警推送</div>
 
       <div class="sub_title">预警推送</div>
 
       <div class="form">
 
       <div class="form">
 
         <el-table :data="tableData" height="280">
 
         <el-table :data="tableData" height="280">
 
@@ -74,6 +70,8 @@
 
           </el-table-column>
 
           </el-table-column>
 
         </el-table>
 
         </el-table>
 
       </div>
 
       </div>
 
+
 
+      <!-- 实时监控画面区域 -->
 
       <div class="sub_title">
 
       <div class="sub_title">
 
         实时监控画面
 
         实时监控画面
 
         <span class="more" @click="handleCheckMore">查看更多 ></span>
 
         <span class="more" @click="handleCheckMore">查看更多 ></span>
 
@@ -91,6 +89,294 @@
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
+
 
+    <!-- 机动车弹窗区域 -->
 
+    <el-dialog
 
+      v-model="dialogVisible"
 
+      :close-on-click-modal="false"
 
+      :show-close="false"
 
+      width="770"
 
+    >
 
+      <div class="pop_box">
 
+        <!-- 标题区域 -->
 
+        <div class="box_title">车闸通行记录</div>
 
+        <div class="pop_close" @click="handleClose(1)">×</div>
 
+
 
+        <!-- 输入框区域 -->
 
+        <div class="search_box">
 
+          <el-input
 
+            v-model="carNumber"
 
+            style="width: 174px"
 
+            clearable
 
+            placeholder="请输入车牌号"
 
+          />
 
+
 
+          <div class="btn" @click="handleSearch">查询</div>
 
+        </div>
 
+
 
+        <!-- 筛选框区域 -->
 
+        <div class="select_box">
 
+          出口类型：
 
+          <el-select
 
+            v-model="typeValue"
 
+            placeholder="请选择出口类型"
 
+            clearable
 
+            style="width: 175px"
 
+          >
 
+            <el-option
 
+              v-for="item in typeOptions"
 
+              :key="item.value"
 
+              :label="item.label"
 
+              :value="item.value"
 
+            />
 
+          </el-select>
 
+
 
+          <span style="margin-left: 50px">时间：</span>
 
+          <el-date-picker
 
+            style="width: 140px"
 
+            v-model="timeValue"
 
+            type="datetimerange"
 
+            value-format="YYYY-MM-DD HH:mm:ss"
 
+            start-placeholder="请选择开始时间"
 
+            end-placeholder="请选择结束时间"
 
+          />
 
+        </div>
 
+
 
+        <!-- 表格 -->
 
+        <div class="form">
 
+          <el-table :data="tableData_pop" height="400">
 
+            <el-table-column label="车牌" prop="carNo" align="center">
 
+            </el-table-column>
 
+
 
+            <el-table-column label="图像" align="center">
 
+              <template #default="{ row }">
 
+                <el-image
 
+                  v-if="row.image"
 
+                  style="width: 51px; height: 51px"
 
+                  :src="row.image"
 
+                  hide-on-click-modal
 
+                  :preview-src-list="[row.image]"
 
+                  fit="cover"
 
+                  preview-teleported
 
+                />
 
+                <div v-else>暂无图片</div>
 
+              </template>
 
+            </el-table-column>
 
+
 
+            <el-table-column
 
+              prop="dataTime"
 
+              label="记录时间"
 
+              align="center"
 
+              show-overflow-tooltip
 
+            />
 
+
 
+            <el-table-column label="出口类型" align="center">
 
+              <template #default="{ row }">
 
+                {{ row.type == 1 ? "进" : "出" }}
 
+              </template>
 
+            </el-table-column>
 
+          </el-table>
 
+        </div>
 
+
 
+        <!-- 分页器区域 -->
 
+        <div class="pag">
 
+          <el-pagination
 
+            v-model:current-page="currentPage"
 
+            v-model:page-size="pageSize"
 
+            background
 
+            small
 
+            :pager-count="5"
 
+            layout="total, prev, pager, next, jumper"
 
+            :total="total"
 
+            @current-change="handleCurrentChange"
 
+          />
 
+        </div>
 
+      </div>
 
+    </el-dialog>
 
+
 
+    <!-- 人员通行弹窗区域 -->
 
+    <el-dialog
 
+      v-model="dialogVisible2"
 
+      :close-on-click-modal="false"
 
+      :show-close="false"
 
+      width="1158"
 
+    >
 
+      <div class="pop_box2">
 
+        <!-- 标题区域 -->
 
+        <div class="box_title">门禁通行汇总</div>
 
+        <div class="pop_close" @click="handleClose(2)">×</div>
 
+
 
+        <!-- 输入框区域 -->
 
+        <div class="search_box2">
 
+          <el-input
 
+            v-model="keyWord"
 
+            style="width: 174px"
 
+            clearable
 
+            placeholder="请输入关键字"
 
+          />
 
+
 
+          <div class="btn" @click="handleSearchPeople">查询</div>
 
+
 
+          <span style="margin-left: 30px">年级：</span>
 
+          <el-select
 
+            v-model="gradeValue"
 
+            placeholder="请选择年级："
 
+            style="width: 175px"
 
+            clearable
 
+            @change="changeGrade"
 
+          >
 
+            <el-option
 
+              v-for="item in gradeOptions"
 
+              :key="item.id"
 
+              :label="item.name"
 
+              :value="item.id"
 
+            />
 
+          </el-select>
 
+
 
+          <span style="margin-left: 30px">班级：</span>
 
+          <el-select
 
+            v-model="classValue"
 
+            placeholder="请选择班级："
 
+            style="width: 175px"
 
+            clearable
 
+          >
 
+            <el-option
 
+              v-for="item in classOptions"
 
+              :key="item.id"
 
+              :label="item.name"
 
+              :value="item.id"
 
+            />
 
+          </el-select>
 
+
 
+          <span style="margin-left: 30px">通行状态：</span>
 
+          <el-select
 
+            v-model="statusValue"
 
+            placeholder="请选择通行状态："
 
+            style="width: 175px"
 
+            clearable
 
+          >
 
+            <el-option
 
+              v-for="item in statusOptions"
 
+              :key="item.value"
 
+              :label="item.label"
 
+              :value="item.value"
 
+            />
 
+          </el-select>
 
+        </div>
 
+
 
+        <!-- 筛选框区域 -->
 
+        <div class="select_box2">
 
+          出口类型：
 
+          <el-select
 
+            v-model="typeValue2"
 
+            placeholder="请选择出口类型"
 
+            style="width: 175px"
 
+            clearable
 
+          >
 
+            <el-option
 
+              v-for="item in typeOptions2"
 
+              :key="item.value"
 
+              :label="item.label"
 
+              :value="item.value"
 
+            />
 
+          </el-select>
 
+
 
+          <span style="margin-left: 50px">时间：</span>
 
+          <el-date-picker
 
+            style="width: 140px"
 
+            v-model="timeValue"
 
+            type="datetimerange"
 
+            start-placeholder="请选择开始时间"
 
+            end-placeholder="请选择结束时间"
 
+            value-format="YYYY-MM-DD HH:mm:ss"
 
+          />
 
+        </div>
 
+
 
+        <!-- 表格 -->
 
+        <div class="form">
 
+          <el-table :data="tableData_pop2" height="400">
 
+            <el-table-column label="设备编号" prop="sn" align="center">
 
+            </el-table-column>
 
+
 
+            <el-table-column label="设备名称" prop="type" align="center">
 
+            </el-table-column>
 
+
 
+            <el-table-column label="部门" align="center" show-overflow-tooltip>
 
+              <template #default="{ row }">
 
+                {{ row.departmentName ? row.departmentName : "未知" }}
 
+              </template>
 
+            </el-table-column>
 
+
 
+            <el-table-column label="班级" align="center" show-overflow-tooltip>
 
+              <template #default="{ row }">
 
+                {{ row.className ? row.className : "未知" }}
 
+              </template>
 
+            </el-table-column>
 
+
 
+            <el-table-column label="姓名" prop="name" align="center">
 
+            </el-table-column>
 
+
 
+            <el-table-column label="人员编号" align="center">
 
+              <template #default="{ row }">
 
+                {{ row.cardNo ? row.cardNo : "未知" }}
 
+              </template>
 
+            </el-table-column>
 
+            <el-table-column label="图像" align="center">
 
+              <template #default="{ row }">
 
+                <el-image
 
+                  v-if="row.image"
 
+                  style="width: 51px; height: 51px"
 
+                  :src="row.image"
 
+                  hide-on-click-modal
 
+                  :preview-src-list="[row.image]"
 
+                  fit="cover"
 
+                  preview-teleported
 
+                />
 
+                <div v-else>暂无图片</div>
 
+              </template>
 
+            </el-table-column>
 
+            <el-table-column label="识别分组" align="center">
 
+              <template #default="{ row }">
 
+                <div v-if="row.openType == 0">白名单比对</div>
 
+                <div v-if="row.openType == 1">人证比对</div>
 
+                <div v-if="row.openType == 2">IC卡比对</div>
 
+              </template>
 
+            </el-table-column>
 
+            <el-table-column
 
+              label="记录时间"
 
+              prop="dateTime"
 
+              align="center"
 
+              width="150"
 
+            >
 
+            </el-table-column>
 
+            <el-table-column label="出口类型" align="center">
 
+              <template #default="{ row }">
 
+                {{ row.access == 0 ? "出" : "进" }}
 
+              </template>
 
+            </el-table-column>
 
+            <el-table-column label="通行" align="center">
 
+              <template #default="{ row }">
 
+                {{ row.resultStatus == 0 ? "失败" : "成功" }}
 
+              </template>
 
+            </el-table-column>
 
+          </el-table>
 
+        </div>
 
+
 
+        <!-- 分页器区域 -->
 
+        <div class="pag">
 
+          <el-pagination
 
+            v-model:current-page="currentPage"
 
+            v-model:page-size="pageSize"
 
+            background
 
+            small
 
+            :pager-count="5"
 
+            layout="total, prev, pager, next, jumper"
 
+            :total="total"
 
+            @current-change="handleCurrentChange2"
 
+          />
 
+        </div>
 
+      </div>
 
+    </el-dialog>
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 
 
@@ -98,22 +384,97 @@
 
 import { ref, onMounted, onUnmounted } from "vue";
 
 import { ref, onMounted, onUnmounted } from "vue";
 
 import { useRouter } from "vue-router";
 
 import { useRouter } from "vue-router";
 
 import { countUpNum } from "@/utils/countUpNum";
 
 import { countUpNum } from "@/utils/countUpNum";
 
-import { reqGetSmartWarning } from "@/api/school/index";
 
+import {
 
+  reqGetSmartWarning,
 
+  reqGetCarRecord,
 
+  reqGetPeopleRecord,
 
+  reqGetTotalCount,
 
+  reqGetGradeList,
 
+  reqGetClassList,
 
+} from "@/api/school/index";
 
 // @ts-ignore
 
 // @ts-ignore
 
 import { reqVideoLogin, reqVideoPull, reqVideoStop } from "@/api/video/index";
 
 import { reqVideoLogin, reqVideoPull, reqVideoStop } from "@/api/video/index";
 
+// 引入解密函数
 
+import { decryptDes } from "@/utils/des";
 
 
 
-// 监控摄像头数据
 
-const deviceNum = ref(150);
 
-// 报警器数据
 
-const deviceNum2 = ref(150);
 
-// 消防设施数据
 
-const deviceNum3 = ref(10);
 
-// 监控摄像头DOM元素
 
+// 机动车数据
 
+const deviceNum = ref(0);
 
+// 人员通行数据
 
+const deviceNum2 = ref(0);
 
+// 机动车DOM元素
 
 const deviceDom = ref();
 
 const deviceDom = ref();
 
-// 报警器DOM元素
 
+// 人员通行DOM元素
 
 const deviceDom2 = ref();
 
 const deviceDom2 = ref();
 
-// 消防设施DOM元素
 
-const deviceDom3 = ref();
 
+
 
+// 机动车弹窗显示隐藏控制
 
+const dialogVisible = ref(false);
 
+// 车牌号绑定数据
 
+const carNumber = ref("");
 
+// 出口类型绑定数据
 
+const typeValue = ref("");
 
+// 出口类型选项数据
 
+const typeOptions = [
 
+  {
 
+    value: "2",
 
+    label: "出",
 
+  },
 
+  {
 
+    value: "1",
 
+    label: "进",
 
+  },
 
+];
 
+// 时间绑定数据
 
+const timeValue = ref([]);
 
+// 机动车表格数据
 
+const tableData_pop = ref([]);
 
+
 
+// 当前页
 
+const currentPage = ref(1);
 
+// 每页多少条
 
+const pageSize = ref(5);
 
+// 总条数
 
+const total = ref(0);
 
+
 
+// 行人弹窗显示隐藏控制
 
+const dialogVisible2 = ref(false);
 
+// 关键字数据
 
+const keyWord = ref("");
 
+// 年级绑定数据
 
+const gradeValue = ref("");
 
+// 年级选项数组
 
+const gradeOptions = ref<any>([]);
 
+// 班级绑定数据
 
+const classValue = ref("");
 
+// 班级选项数组
 
+const classOptions = ref<any>([]);
 
+// 通行状态数据
 
+const statusValue = ref("");
 
+// 通行状态选项数组
 
+const statusOptions = [
 
+  {
 
+    value: "1",
 
+    label: "成功",
 
+  },
 
+  {
 
+    value: "0",
 
+    label: "失败",
 
+  },
 
+];
 
+// 出口类型绑定数据
 
+const typeValue2 = ref("");
 
+// 出口类型选项数据
 
+const typeOptions2 = [
 
+  {
 
+    value: "0",
 
+    label: "出",
 
+  },
 
+  {
 
+    value: "1",
 
+    label: "进",
 
+  },
 
+];
 
+// 行人表格数据
 
+const tableData_pop2 = ref([]);
 
 
 
 // 预警推送数据
 
 // 预警推送数据
 
 const tableData = ref([]);
 
 const tableData = ref([]);
 
@@ -121,11 +482,6 @@ const tableData = ref([]);
 
 // 路由器实例
 
 // 路由器实例
 
 const $router = useRouter();
 
 const $router = useRouter();
 
 
 
-// 当前页
 
-const currentPage = ref(1);
 
-// 每页多少条
 
-const pageCount = ref(10);
 
-
 
 // 监控列表
 
 // 监控列表
 
 const videoList = ref<any>([
 
 const videoList = ref<any>([
 
   {
 
   {
 
@@ -151,8 +507,8 @@ const videoList = ref<any>([
 
 ]);
 
 ]);
 
 
 
 onMounted(() => {
 
 onMounted(() => {
 
-  // 让数字动起来
 
-  getCountUpNum();
 
+  // 获取通行总数
 
+  getTotalCount();
 
 
 
   // 获取预警推送信息
 
   // 获取预警推送信息
 
   getSmartWarning();
 
   getSmartWarning();
 
@@ -169,11 +525,26 @@ onUnmounted(() => {
 
   stopVideo();
 
   stopVideo();
 
 });
 
 });
 
 
 
+// 获取通行总数
 
+const getTotalCount = async () => {
 
+  const res = await reqGetTotalCount();
 
+  // console.log(res);
 
+  if ((res as any).code == 200) {
 
+    const result = JSON.parse(decryptDes(res.data));
 
+    // console.log(result);
 
+    deviceNum.value = result.carCount;
 
+    deviceNum2.value = result.accessCount;
 
+
 
+    // 让数字动起来
 
+    getCountUpNum();
 
+  }
 
+};
 
+
 
 // 获取预警推送信息
 
 // 获取预警推送信息
 
 const getSmartWarning = async () => {
 
 const getSmartWarning = async () => {
 
   const res = await reqGetSmartWarning({
 
   const res = await reqGetSmartWarning({
 
-    currentPage: currentPage.value,
 
-    pageCount: pageCount.value,
 
+    currentPage: 1,
 
+    pageCount: 10,
 
   });
 
   });
 
   // console.log(res);
 
   // console.log(res);
 
   if ((res as any).code == 200) {
 
   if ((res as any).code == 200) {
 
@@ -220,11 +591,141 @@ const stopVideo = () => {
 
   });
 
   });
 
 };
 
 };
 
 
 
+const handleClick = (type: number) => {
 
+  timeValue.value = [];
 
+  total.value = 0;
 
+  currentPage.value = 1;
 
+
 
+  // type 1代表机动车 2代表人员通行
 
+  if (type === 1) {
 
+    // console.log("机动车");
 
+
 
+    carNumber.value = "";
 
+    typeValue.value = "";
 
+    tableData_pop.value = [];
 
+
 
+    getCarRecord();
 
+    dialogVisible.value = true;
 
+  } else if (type === 2) {
 
+    // console.log("人员通行");
 
+
 
+    getGradeList();
 
+
 
+    keyWord.value = "";
 
+    gradeValue.value = "";
 
+    classValue.value = "";
 
+    statusValue.value = "";
 
+    typeValue2.value = "";
 
+
 
+    getPeopleRecord();
 
+    dialogVisible2.value = true;
 
+  }
 
+};
 
+
 
+// 获取机动车记录
 
+const getCarRecord = async () => {
 
+  const res = await reqGetCarRecord({
 
+    currentPage: currentPage.value,
 
+    pageCount: pageSize.value,
 
+    keyWord: carNumber.value,
 
+    type: typeValue.value,
 
+    startTime: timeValue.value ? timeValue.value[0] : "",
 
+    endTime: timeValue.value ? timeValue.value[1] : "",
 
+  });
 
+  // console.log(res);
 
+  if ((res as any).code == 200) {
 
+    const result = JSON.parse(decryptDes(res.data));
 
+    // console.log(result);
 
+    tableData_pop.value = result.list;
 
+    total.value = result.totalCount;
 
+  }
 
+};
 
+
 
+// 获取人员通行记录
 
+const getPeopleRecord = async () => {
 
+  const res = await reqGetPeopleRecord({
 
+    currentPage: currentPage.value,
 
+    pageCount: pageSize.value,
 
+    keyWord: keyWord.value,
 
+    gradeId: gradeValue.value,
 
+    classId: classValue.value,
 
+    resultStatus: statusValue.value,
 
+    inOut: typeValue2.value,
 
+    startTime: timeValue.value ? timeValue.value[0] : "",
 
+    endTime: timeValue.value ? timeValue.value[1] : "",
 
+  });
 
+  // console.log(res);
 
+  if ((res as any).code == 200) {
 
+    const result = JSON.parse(decryptDes(res.data));
 
+    // console.log(result);
 
+    tableData_pop2.value = result.list;
 
+    total.value = result.totalCount;
 
+  }
 
+};
 
+
 
+const handleSearchPeople = () => {
 
+  currentPage.value = 1;
 
+
 
+  getPeopleRecord();
 
+};
 
+
 
+// 获取年级列表数据
 
+const getGradeList = async () => {
 
+  const res = await reqGetGradeList();
 
+  // console.log(res);
 
+  if ((res as any).code == 200) {
 
+    const result = JSON.parse(decryptDes(res.data));
 
+    // console.log(result);
 
+    gradeOptions.value = result;
 
+  }
 
+};
 
+
 
+// 切换年级时触发的回调
 
+const changeGrade = async () => {
 
+  const res = await reqGetClassList({
 
+    gradeId: gradeValue.value,
 
+  });
 
+  // console.log(res);
 
+  if ((res as any).code == 200) {
 
+    const result = JSON.parse(decryptDes(res.data));
 
+    // console.log(result);
 
+    classOptions.value = result;
 
+  }
 
+};
 
+
 
+// 点击关闭图标时的回调
 
+const handleClose = (type: number) => {
 
+  if (type === 1) {
 
+    dialogVisible.value = false;
 
+  } else if (type === 2) {
 
+    dialogVisible2.value = false;
 
+  }
 
+};
 
+
 
+// 机动车弹窗切换分页器的回调
 
+const handleCurrentChange = (v: number) => {
 
+  // console.log(v);
 
+  currentPage.value = v;
 
+  getCarRecord();
 
+};
 
+
 
+// 人员通行弹窗切换分页器的回调
 
+const handleCurrentChange2 = (v: number) => {
 
+  // console.log(v);
 
+  currentPage.value = v;
 
+  getPeopleRecord();
 
+};
 
+
 
+// 点击查询按钮回调
 
+const handleSearch = () => {
 
+  currentPage.value = 1;
 
+  getCarRecord();
 
+};
 
+
 
 // 让数字动起来
 
 // 让数字动起来
 
 const getCountUpNum = () => {
 
 const getCountUpNum = () => {
 
   countUpNum(deviceDom.value, deviceNum.value);
 
   countUpNum(deviceDom.value, deviceNum.value);
 
   countUpNum(deviceDom2.value, deviceNum2.value);
 
   countUpNum(deviceDom2.value, deviceNum2.value);
 
-  countUpNum(deviceDom3.value, deviceNum3.value);
 
 };
 
 };
 
 </script>
 
 </script>
 
 
 
@@ -305,6 +806,10 @@ const getCountUpNum = () => {
 
           }
 
           }
 
         }
 
         }
 
       }
 
       }
 
+
 
+      .cursor {
 
+        cursor: pointer;
 
+      }
 
     }
 
     }
 
 
 
     .form {
 
     .form {
 
@@ -367,6 +872,148 @@ const getCountUpNum = () => {
 
       }
 
       }
 
     }
 
     }
 
   }
 
   }
 
+
 
+  .pop_box {
 
+    position: relative;
 
+    padding: 22px 36px 0 22px;
 
+    width: 770px;
 
+    height: 670px;
 
+    color: #fff;
 
+    border-radius: 16px;
 
+    background-color: rgba(31, 58, 87, 0.8);
 
+
 
+    .box_title {
 
+      padding-left: 36px;
 
+      width: 710px;
 
+      height: 35px;
 
+      font-size: 16px;
 
+      color: #bbe2fe;
 
+      background-image: url(@/assets/images/2.png);
 
+      background-size: cover;
 
+    }
 
+
 
+    .pop_close {
 
+      position: absolute;
 
+      top: 14px;
 
+      right: 38px;
 
+      width: 24px;
 
+      height: 24px;
 
+      line-height: 18px;
 
+      text-align: center;
 
+      color: #a6a6a6;
 
+      font-size: 25px;
 
+      border-radius: 2px;
 
+      border: 1px solid #a6a6a6;
 
+      cursor: pointer;
 
+    }
 
+
 
+    .search_box {
 
+      display: flex;
 
+      margin-top: 35px;
 
+      margin-bottom: 18px;
 
+
 
+      .btn {
 
+        display: flex;
 
+        justify-content: center;
 
+        align-items: center;
 
+        margin-left: 10px;
 
+        width: 58px;
 
+        height: 32px;
 
+        cursor: pointer;
 
+        background-image: linear-gradient(
 
+          to top,
 
+          rgba(26, 94, 232, 0.8),
 
+          rgba(61, 198, 239, 0.4),
 
+          rgba(29, 242, 228, 0.8)
 
+        );
 
+      }
 
+    }
 
+
 
+    .select_box {
 
+      display: flex;
 
+      justify-content: space-between;
 
+      align-items: center;
 
+      margin-bottom: 16px;
 
+    }
 
+
 
+    .pag {
 
+      display: flex;
 
+      justify-content: flex-end;
 
+      margin-top: 28px;
 
+    }
 
+  }
 
+
 
+  .pop_box2 {
 
+    position: relative;
 
+    padding: 22px 36px 0 22px;
 
+    width: 1158px;
 
+    height: 670px;
 
+    color: #fff;
 
+    border-radius: 16px;
 
+    background-color: rgba(31, 58, 87, 0.8);
 
+
 
+    .box_title {
 
+      padding-left: 36px;
 
+      width: 1095px;
 
+      height: 35px;
 
+      font-size: 16px;
 
+      color: #bbe2fe;
 
+      background-image: url(@/assets/images/3.png);
 
+      background-size: cover;
 
+    }
 
+
 
+    .pop_close {
 
+      position: absolute;
 
+      top: 14px;
 
+      right: 38px;
 
+      width: 24px;
 
+      height: 24px;
 
+      line-height: 18px;
 
+      text-align: center;
 
+      color: #a6a6a6;
 
+      font-size: 25px;
 
+      border-radius: 2px;
 
+      border: 1px solid #a6a6a6;
 
+      cursor: pointer;
 
+    }
 
+
 
+    .search_box2 {
 
+      display: flex;
 
+      align-items: center;
 
+      margin-top: 35px;
 
+      margin-bottom: 18px;
 
+
 
+      .btn {
 
+        display: flex;
 
+        justify-content: center;
 
+        align-items: center;
 
+        margin-left: 10px;
 
+        width: 58px;
 
+        height: 32px;
 
+        cursor: pointer;
 
+        background-image: linear-gradient(
 
+          to top,
 
+          rgba(26, 94, 232, 0.8),
 
+          rgba(61, 198, 239, 0.4),
 
+          rgba(29, 242, 228, 0.8)
 
+        );
 
+      }
 
+    }
 
+
 
+    .select_box2 {
 
+      display: flex;
 
+      justify-content: space-between;
 
+      align-items: center;
 
+      padding-right: 364px;
 
+      margin-bottom: 16px;
 
+    }
 
+
 
+    .pag {
 
+      display: flex;
 
+      justify-content: flex-end;
 
+      margin-top: 28px;
 
+    }
 
+  }
 
 }
 
 }
 
 
 
 /*最外层透明*/
 
 /*最外层透明*/
 
@@ -406,4 +1053,27 @@ const getCountUpNum = () => {
 
 ::v-deep(.el-scrollbar__view) {
 
 ::v-deep(.el-scrollbar__view) {
 
   // animation: run 12s linear infinite;
 
   // animation: run 12s linear infinite;
 
 }
 
 }
 
+
 
+::v-deep(.el-dialog),
 
+::v-deep(.el-dialog__header),
 
+::v-deep(.el-dialog__body) {
 
+  padding: 0;
 
+  background-color: transparent;
 
+}
 
+
 
+::v-deep(.el-input__wrapper) {
 
+  background-color: rgba(48, 75, 95, 0.6);
 
+}
 
+
 
+::v-deep(.el-pagination__goto),
 
+::v-deep(.el-pagination__total),
 
+::v-deep(.el-pagination__classifier),
 
+::v-deep(.el-pagination .el-input__inner) {
 
+  color: #fff;
 
+}
 
+
 
+::v-deep(.el-range-input),
 
+::v-deep(.el-input__inner) {
 
+  color: #fff;
 
+}
 
 </style>
 
 </style>

+ 7 - 1
src/components/student/studentCenter.vue
View File 

@@ -97,7 +97,7 @@
 
 </template>
 
 </template>
 
 
 
 <script setup lang="ts">
 
 <script setup lang="ts">
 
-import { ref, onMounted } from "vue";
 
+import { ref, onMounted, watch } from "vue";
 
 import { useRoute } from "vue-router";
 
 import { useRoute } from "vue-router";
 
 import * as Echarts from "echarts";
 
 import * as Echarts from "echarts";
 
 // 引入用户肖像相关的接口
 
 // 引入用户肖像相关的接口
 
@@ -110,6 +110,12 @@ import {
 
 // 引入解密函数
 
 // 引入解密函数
 
 import { decryptDes } from "@/utils/des";
 
 import { decryptDes } from "@/utils/des";
 
 
 
+const $props = defineProps(["userId"]);
 
+
 
+watch($props, () => {
 
+  // console.log($props.userId);
 
+});
 
+
 
 const $route = useRoute();
 
 const $route = useRoute();
 
 
 
 // 雷达图实例
 
 // 雷达图实例

+ 7 - 2
src/components/student/studentLeft.vue
View File 

@@ -86,17 +86,22 @@
 
 </template>
 
 </template>
 
 
 
 <script setup lang="ts">
 
 <script setup lang="ts">
 
-import { ref, onMounted } from "vue";
 
+import { ref, onMounted, watch } from "vue";
 
 import { useRoute } from "vue-router";
 
 import { useRoute } from "vue-router";
 
 import * as Echarts from "echarts";
 
 import * as Echarts from "echarts";
 
 import { countUpNum } from "@/utils/countUpNum";
 
 import { countUpNum } from "@/utils/countUpNum";
 
-
 
 // 引入用户画像相关的接口
 
 // 引入用户画像相关的接口
 
 import { reqGetStudentAttendance } from "@/api/user/index";
 
 import { reqGetStudentAttendance } from "@/api/user/index";
 
 // 引入解密函数
 
 // 引入解密函数
 
 //@ts-ignore
 
 //@ts-ignore
 
 import { decryptDes } from "@/utils/des.ts";
 
 import { decryptDes } from "@/utils/des.ts";
 
 
 
+const $props = defineProps(["userId"]);
 
+
 
+watch($props, () => {
 
+  // console.log($props.userId);
 
+});
 
+
 
 const $route = useRoute();
 
 const $route = useRoute();
 
 
 
 // 准时数据
 
 // 准时数据

+ 159 - 190
src/components/student/studentRight.vue
View File 

@@ -4,32 +4,67 @@
 
     <div class="container_box">
 
     <div class="container_box">
 
       <div class="box_title">
 
       <div class="box_title">
 
         <img src="@/assets/images/box-icon.png" />
 
         <img src="@/assets/images/box-icon.png" />
 
-        成绩统计
 
+        亲密度汇总
 
       </div>
 
       </div>
 
 
 
-      <!-- 筛选框区域 -->
 
-      <div class="box_select">
 
-        <span>考试名称</span>
 
-        <el-select
 
-          v-model="examName"
 
-          placeholder="请选择学期"
 
-          style="width: 206px"
 
-          @change="handleChange"
 
-        >
 
-          <el-option
 
-            v-for="(item, index) in optionsTime"
 
-            :key="index"
 
-            :label="(item as any).totalName"
 
-            :value="(item as any).totalName"
 
-          />
 
-        </el-select>
 
+      <!-- 时间筛选区域 -->
 
+      <div class="box_search">
 
+        <el-date-picker
 
+          style="width: 280px"
 
+          v-model="timeValue"
 
+          type="daterange"
 
+          value-format="YYYY-MM-DD"
 
+          start-placeholder="请选择开始日期"
 
+          end-placeholder="请选择结束日期"
 
+          @change="changeTime"
 
+        />
 
       </div>
 
       </div>
 
 
 
-      <!-- 图表展示区域 -->
 
-      <div v-if="examName" class="box_chart" ref="barChart"></div>
 
+      <div class="box_form form box_form2">
 
+        <el-table :data="likeList" height="210">
 
+          <el-table-column label="排名" align="center" width="50">
 
+            <template #="scope">
 
+              {{
 
+                ((currentPage - 1) * pageSize + scope.$index + 1)
 
+                  .toString()
 
+                  .padStart(2, 0)
 
+              }}
 
+            </template>
 
+          </el-table-column>
 
+
 
+          <el-table-column label="姓名" align="center">
 
+            <template #="{ row }">
 
+              <div class="name" @click="clickName(row)">
 
+                {{ row.relationName }}
 
+              </div>
 
+            </template>
 
+          </el-table-column>
 
+
 
+          <el-table-column prop="gradeName" label="年级" align="center" />
 
 
 
-      <!-- 没有数据时展示 -->
 
-      <div v-if="!examName" class="box_nodata">暂无数据</div>
 
+          <el-table-column
 
+            prop="className"
 
+            label="班级"
 
+            align="center"
 
+            show-overflow-tooltip
 
+          />
 
+          <el-table-column prop="count" label="亲密值" align="center" />
 
+        </el-table>
 
+      </div>
 
+
 
+      <div class="pag">
 
+        <el-pagination
 
+          v-model:current-page="currentPage"
 
+          v-model:page-size="pageSize"
 
+          background
 
+          small
 
+          :pager-count="5"
 
+          hide-on-single-page
 
+          layout="total, prev, pager, next, jumper"
 
+          :total="total"
 
+          @current-change="handleCurrentChange"
 
+        />
 
+      </div>
 
     </div>
 
     </div>
 
 
 
     <!-- 考评记录区域 -->
 
     <!-- 考评记录区域 -->
 
@@ -40,7 +75,7 @@
 
       </div>
 
       </div>
 
 
 
       <div class="box_form form">
 
       <div class="box_form form">
 
-        <el-table :data="tableData">
 
+        <el-table :data="tableData" height="290">
 
           <el-table-column
 
           <el-table-column
 
             prop="term"
 
             prop="term"
 
             label="考评时间"
 
             label="考评时间"
 
@@ -57,38 +92,32 @@
 
 <script setup lang="ts">
 
 <script setup lang="ts">
 
 import { ref, onMounted } from "vue";
 
 import { ref, onMounted } from "vue";
 
 import { useRoute } from "vue-router";
 
 import { useRoute } from "vue-router";
 
-import * as Echarts from "echarts";
 
 // 引入用户画像相关的接口
 
 // 引入用户画像相关的接口
 
-import {
 
-  reqGetExamName,
 
-  reqGetHisExamData,
 
-  reqGetEvaluateData,
 
-} from "@/api/user/index";
 
+import { reqGetEvaluateData, reqGetLikeList } from "@/api/user/index";
 
 // 引入解密函数
 
 // 引入解密函数
 
 import { decryptDes } from "@/utils/des";
 
 import { decryptDes } from "@/utils/des";
 
 
 
+const $emit = defineEmits(["changeStudent"]);
 
+
 
 const $route = useRoute();
 
 const $route = useRoute();
 
 
 
 // 用户id
 
 // 用户id
 
 const userId = ref();
 
 const userId = ref();
 
 // 用户信息
 
 // 用户信息
 
 const userInfo = ref();
 
 const userInfo = ref();
 
-// 柱状图实例
 
-let myBarChart: any;
 
-// 柱状图DOM
 
-const barChart = ref();
 
 
 
-// 当前选择的学期
 
-const examName = ref("");
 
+// 绑定时间数据
 
+const timeValue = ref([]);
 
 
 
-// 成绩统计学期筛选框数组
 
-const optionsTime = ref([]);
 
+// 当前页
 
+const currentPage = ref(1);
 
+//  每页多少条
 
+const pageSize = ref(4);
 
+// 总条数
 
+const total = ref(0);
 
 
 
-// 图表X轴学科数组数据
 
-const subjectList = ref<any>([]);
 
-
 
-// 图表Y轴成绩数组数据
 
-const valueList = ref<any>([]);
 
+// 亲密度列表
 
+const likeList = ref([]);
 
 
 
 // 考评记录数组
 
 // 考评记录数组
 
 const tableData = ref<any>([]);
 
 const tableData = ref<any>([]);
 
@@ -98,29 +127,28 @@ onMounted(() => {
 
   userInfo.value = obj;
 
   userInfo.value = obj;
 
   userId.value = obj.id;
 
   userId.value = obj.id;
 
 
 
-  // 获取考试名称数组
 
-  getExamName();
 
+  // 获取亲密度列表
 
+  getLikeList();
 
 
 
   // 获取考评记录数据
 
   // 获取考评记录数据
 
   getEvaluateData();
 
   getEvaluateData();
 
 });
 
 });
 
 
 
-// 获取考试名称数组
 
-const getExamName = async () => {
 
-  const res = await reqGetExamName({
 
+// 获取亲密度列表
 
+const getLikeList = async () => {
 
+  const res = await reqGetLikeList({
 
     userId: userId.value,
 
     userId: userId.value,
 
+    currentPage: currentPage.value,
 
+    pageCount: pageSize.value,
 
+    startTime: timeValue.value?.length ? timeValue.value[0] + " 00:00:00" : "",
 
+    endTime: timeValue.value?.length ? timeValue.value[1] + " 00:00:00" : "",
 
   });
 
   });
 
   // console.log(res);
 
   // console.log(res);
 
   if ((res as any).code == 200) {
 
   if ((res as any).code == 200) {
 
     const result = JSON.parse(decryptDes(res.data));
 
     const result = JSON.parse(decryptDes(res.data));
 
     // console.log(result);
 
     // console.log(result);
 
-    optionsTime.value = result;
 
-
 
-    if (result.length) {
 
-      examName.value = result[0].totalName;
 
-      // 获取学生各科成绩
 
-      getScoreInfo();
 
-    }
 
+    likeList.value = result.list;
 
+    total.value = result.totalCount;
 
   }
 
   }
 
 };
 
 };
 
 
 
@@ -137,114 +165,29 @@ const getEvaluateData = async () => {
 
   }
 
   }
 
 };
 
 };
 
 
 
-// 获取学生各科成绩
 
-const getScoreInfo = async () => {
 
-  const temObj: any = optionsTime.value.find(
 
-    (ele: any) => ele.totalName === examName.value
 
-  );
 
-  // console.log(temObj);
 
-
 
-  const res = await reqGetHisExamData({
 
-    userId: userId.value,
 
-    semesterId: temObj.semesterId,
 
-    examTypeId: temObj.examTypeId,
 
-  });
 
-  // console.log(res);
 
-
 
-  if ((res as any).code == 200) {
 
-    const result = JSON.parse(decryptDes(res.data));
 
-    // console.log(result);
 
-
 
-    if (result.length) {
 
-      result.forEach((ele: any) => {
 
-        subjectList.value.push(ele.subjectName);
 
-        valueList.value.push(ele.score);
 
-      });
 
-    }
 
-
 
-    // 初始化柱状图
 
-    initBarChart();
 
-  }
 
+// 时间改变回调
 
+const changeTime = () => {
 
+  // console.log(timeValue.value);
 
+  currentPage.value = 1;
 
+  getLikeList();
 
 };
 
 };
 
 
 
-// 初始化柱状图
 
-const initBarChart = () => {
 
-  myBarChart = Echarts.init(barChart.value);
 
-
 
-  const options = {
 
-    tooltip: {
 
-      trigger: "axis",
 
-      axisPointer: {
 
-        type: "shadow",
 
-      },
 
-    },
 
-    grid: {
 
-      top: "13%",
 
-      left: "8%",
 
-      right: "4%",
 
-      bottom: "18%",
 
-    },
 
-    xAxis: {
 
-      type: "category",
 
-      data: subjectList.value,
 
-      axisTick: {
 
-        show: false,
 
-      },
 
-      axisLabel: {
 
-        margin: 12,
 
-        interval: 0,
 
-        fontSize: 14,
 
-        color: "#fff",
 
-      },
 
-    },
 
-    yAxis: {
 
-      name: "分数",
 
-      nameTextStyle: {
 
-        fontSize: 14,
 
-        color: "#fff",
 
-      },
 
-      type: "value",
 
-      axisLabel: {
 
-        color: "#fff",
 
-      },
 
-      splitLine: {
 
-        show: true,
 
-        lineStyle: {
 
-          color: "rgba(108, 128, 151, 0.5)",
 
-        },
 
-      },
 
-    },
 
-    series: [
 
-      {
 
-        data: valueList.value,
 
-        type: "bar",
 
-        barWidth: "20%",
 
-        label: {
 
-          show: true,
 
-          position: "top",
 
-          distance: 5,
 
-          color: "#14B6F3",
 
-          fontSize: 14,
 
-        },
 
-        itemStyle: {
 
-          color: new Echarts.graphic.LinearGradient(0, 1, 0, 0, [
 
-            { offset: 0, color: "#0336FF" },
 
-            { offset: 1, color: "#01B4FF" },
 
-          ]),
 
-        },
 
-      },
 
-    ],
 
-  };
 
-
 
-  myBarChart.setOption(options);
 
+// 分页器页数改变回调
 
+const handleCurrentChange = (v: number) => {
 
+  // console.log(v);
 
+  currentPage.value = v;
 
+  getLikeList();
 
 };
 
 };
 
 
 
-// 筛选框切换回调
 
-const handleChange = () => {
 
-  myBarChart.dispose();
 
-  subjectList.value = [];
 
-  valueList.value = [];
 
-  getScoreInfo();
 
+// 点击表格名字触发的回调
 
+const clickName = (row: any) => {
 
+  // console.log(row);
 
+  // userId.value = row.relationId;
 
+  // $emit("changeStudent", userId.value);
 
+  // timeValue.value = [];
 
+  // currentPage.value = 1;
 
+  // getLikeList();
 
+  // getEvaluateData();
 
 };
 
 };
 
 </script>
 
 </script>
 
 
 
@@ -277,44 +220,37 @@ const handleChange = () => {
 
       }
 
       }
 
     }
 
     }
 
 
 
-    .box_select {
 
-      display: flex;
 
-      align-items: center;
 
-      margin: 31px 0 31px 170px;
 
-      font-size: 14px;
 
-
 
-      span {
 
-        margin-right: 13px;
 
-      }
 
-    }
 
-
 
-    .box_chart {
 
-      height: 270px;
 
-    }
 
-
 
-    .box_nodata {
 
-      margin-top: 150px;
 
-      text-align: center;
 
+    .box_search {
 
+      padding-left: 28px;
 
+      margin-top: 30px;
 
+      height: 35px;
 
     }
 
     }
 
 
 
     .box_form {
 
     .box_form {
 
+      padding-left: 28px;
 
       padding-right: 44px;
 
       padding-right: 44px;
 
       margin-top: 48px;
 
       margin-top: 48px;
 
       height: 287px;
 
       height: 287px;
 
       overflow: hidden;
 
       overflow: hidden;
 
+
 
+      .name {
 
+        cursor: pointer;
 
+      }
 
     }
 
     }
 
-  }
 
-}
 
 
 
-// 修改select背景颜色
 
-::v-deep(.el-input__wrapper) {
 
-  background: transparent;
 
-  background-color: rgba(48, 75, 95, 0.5);
 
-}
 
+    .box_form2 {
 
+      margin-top: 30px;
 
+      height: 210px;
 
+    }
 
 
 
-// 修改select筛选框文字颜色
 
-::v-deep(.el-input__inner) {
 
-  color: #fff;
 
+    .pag {
 
+      display: flex;
 
+      justify-content: flex-end;
 
+      margin-top: 20px;
 
+      margin-left: -20px;
 
+      width: 465px;
 
+    }
 
+  }
 
 }
 
 }
 
 
 
 /*最外层透明*/
 
 /*最外层透明*/
 
@@ -330,7 +266,7 @@ const handleChange = () => {
 
 .form ::v-deep(.el-table td),
 
 .form ::v-deep(.el-table td),
 
 ::v-deep(.el-table th.el-table__cell.is-leaf) {
 
 ::v-deep(.el-table th.el-table__cell.is-leaf) {
 
   background-color: transparent !important;
 
   background-color: transparent !important;
 
-  color: white;
 
+  color: #d0deee;
 
   font-size: 12px;
 
   font-size: 12px;
 
   border-color: rgba(255, 255, 255, 0.1);
 
   border-color: rgba(255, 255, 255, 0.1);
 
   height: 40px;
 
   height: 40px;
 
@@ -350,8 +286,41 @@ const handleChange = () => {
 
   padding: 0;
 
   padding: 0;
 
 }
 
 }
 
 
 
-// 动画滚动
 
-// ::v-deep(.el-scrollbar__view) {
 
-//   animation: run 12s linear infinite;
 
-// }
 
+// 修改分页器未选中时的样式
 
+::v-deep(.el-pagination.is-background .btn-next),
 
+::v-deep(.el-pagination.is-background .btn-prev),
 
+::v-deep(.el-pagination.is-background .el-pager li:not(.disabled)) {
 
+  margin: 0 3px;
 
+  background-color: transparent;
 
+  border: 1px solid #707070;
 
+  color: #fff;
 
+}
 
+
 
+// 修改分页器选中时的样式
 
+::v-deep(
 
+    .el-pagination.is-background .el-pager li:not(.is-disabled).is-active
 
+  ) {
 
+  color: #70b7fa;
 
+  border: 1px solid #70b7fa;
 
+}
 
+
 
+::v-deep(.el-pagination__goto),
 
+::v-deep(.el-pagination__total),
 
+::v-deep(.el-pagination__classifier) {
 
+  color: #fff;
 
+}
 
+
 
+::v-deep(.el-input__wrapper) {
 
+  background: transparent;
 
+  background-color: rgba(48, 75, 95, 0.5);
 
+}
 
+
 
+::v-deep(.el-input__inner) {
 
+  color: #fff;
 
+}
 
+
 
+::v-deep(.el-range-input),
 
+::v-deep(.el-input__inner) {
 
+  color: #fff;
 
+}
 
 </style>
 
 </style>

+ 1 - 1
src/components/user/userRight.vue
View File 

@@ -195,7 +195,7 @@ onMounted(() => {
 
   // 获取学生汇总数据
 
   // 获取学生汇总数据
 
   getStudentInfo();
 
   getStudentInfo();
 
   // 获取教师汇总数据
 
   // 获取教师汇总数据
 
-  getTeacherInfo();
 
+  // getTeacherInfo();
 
 });
 
 });
 
 
 
 // 获取学生汇总数据
 
 // 获取学生汇总数据

+ 13 - 3
src/views/student.vue
View File 

@@ -5,9 +5,9 @@
 
 
 
     <!-- 主体内容区域 -->
 
     <!-- 主体内容区域 -->
 
     <div class="content">
 
     <div class="content">
 
-      <StudentLeft />
 
-      <StudentCenter />
 
-      <StudentRight />
 
+      <StudentLeft :userId="userId" />
 
+      <StudentCenter :userId="userId" />
 
+      <StudentRight @changeStudent="changeStudent" />
 
     </div>
 
     </div>
 
 
 
     <!-- 关闭按钮区域 -->
 
     <!-- 关闭按钮区域 -->
 
@@ -16,17 +16,27 @@
 
 </template>
 
 </template>
 
 
 
 <script setup lang="ts">
 
 <script setup lang="ts">
 
+import { ref } from "vue";
 
 import { useRouter } from "vue-router";
 
 import { useRouter } from "vue-router";
 
 import StudentLeft from "@/components/student/studentLeft.vue";
 
 import StudentLeft from "@/components/student/studentLeft.vue";
 
 import StudentCenter from "@/components/student/studentCenter.vue";
 
 import StudentCenter from "@/components/student/studentCenter.vue";
 
 import StudentRight from "@/components/student/studentRight.vue";
 
 import StudentRight from "@/components/student/studentRight.vue";
 
 
 
+// 路由器实例
 
 const router = useRouter();
 
 const router = useRouter();
 
 
 
+// 用户id
 
+const userId = ref("");
 
+
 
 // 点击关闭按钮回调
 
 // 点击关闭按钮回调
 
 const handleClose = () => {
 
 const handleClose = () => {
 
   router.push("user");
 
   router.push("user");
 
 };
 
 };
 
+
 
+// 子组件触发的事件
 
+const changeStudent = (data: string) => {
 
+  userId.value = data;
 
+};
 
 </script>
 
 </script>
 
 
 
 <style lang="scss" scoped>
 
 <style lang="scss" scoped>