初始
This commit is contained in:
汤凯
599
src/view/homeView.vue
Normal file
599
src/view/homeView.vue
Normal file
@@ -0,0 +1,599 @@
|
||||
<template>
|
||||
<div v-loading="loading" class="h-[calc(100vh-144px)] flex px-[40px]">
|
||||
<div
|
||||
v-if="!(teacherList.data && teacherList.data.length)"
|
||||
class="w-full h-full bg-white relative flex justify-center items-center"
|
||||
>
|
||||
<div class="no_data"></div>
|
||||
</div>
|
||||
<a-menu
|
||||
v-if="teacherList.data && teacherList.data.length"
|
||||
id="dddddd"
|
||||
style="width: 256px"
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
mode="inline"
|
||||
class="h-full overflow-y-scroll mr-[20px]"
|
||||
>
|
||||
<a-menu-item
|
||||
v-for="item in teacherList.data"
|
||||
:key="item.teacherId"
|
||||
@titleClick="titleClick"
|
||||
@click="handleClick(item)"
|
||||
>
|
||||
<div class="flex justify-between">
|
||||
<div>{{ item.name }}</div>
|
||||
<div
|
||||
@click="showTeacherDetail"
|
||||
v-if="
|
||||
item.teacherId == selectedKeys[0] &&
|
||||
userStore.userInfo.data &&
|
||||
userStore.userInfo.data.isLeader
|
||||
"
|
||||
class="mr-[20px]"
|
||||
>
|
||||
详情
|
||||
</div>
|
||||
</div>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
|
||||
<div
|
||||
v-if="teacherList.data && teacherList.data.length"
|
||||
class="w-[calc(100%-280px)] h-full"
|
||||
>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="stuList.data"
|
||||
:scroll="{ y: 'calc(100vh - 264px)' }"
|
||||
:pagination="{ pageSize: 50 }"
|
||||
class="h-[calc(100%-300px)]"
|
||||
>
|
||||
<template #action="{ record }">
|
||||
<span
|
||||
@click="toStudetail(record)"
|
||||
class="text-[#1677ff] cursor-pointer"
|
||||
>
|
||||
详情
|
||||
</span>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-model="stuDetailVisible"
|
||||
:close-on-click-modal="false"
|
||||
title="学生详情"
|
||||
width="800"
|
||||
class="stu_detail"
|
||||
>
|
||||
<div class="w-full text-[16px]">
|
||||
<div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">姓名：</div>
|
||||
<div class="text-[#666]">{{ stuDetail.data.name || "-" }}</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">学生号：</div>
|
||||
<div class="text-[#666]">{{ stuDetail.data.studentId || "-" }}</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">性别：</div>
|
||||
<div class="text-[#666]">{{ stuDetail.data.gender || "-" }}</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">院系：</div>
|
||||
<div class="text-[#666]">
|
||||
{{
|
||||
(stuDetail.data.department && stuDetail.data.department.name) ||
|
||||
"-"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">专业：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ (stuDetail.data.major && stuDetail.data.major.name) || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">班级：</div>
|
||||
<div class="text-[#666]">
|
||||
{{
|
||||
(stuDetail.data.academicClass &&
|
||||
stuDetail.data.academicClass.name) ||
|
||||
"-"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">书院：</div>
|
||||
<div class="text-[#666]">
|
||||
{{
|
||||
(stuDetail.data.college && stuDetail.data.college.name) || "-"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">班级：</div>
|
||||
<div class="text-[#666]">
|
||||
{{
|
||||
(stuDetail.data.collegeClass &&
|
||||
stuDetail.data.collegeClass.name) ||
|
||||
"-"
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="mb-[10px]">学生评估：</div>
|
||||
<el-input
|
||||
v-model="stuDetail.data.evaluation"
|
||||
style="width: 100%"
|
||||
:rows="12"
|
||||
type="textarea"
|
||||
placeholder="评估中"
|
||||
:disabled="true"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-model="teacherDetailVisible"
|
||||
:close-on-click-modal="false"
|
||||
title="教师详情"
|
||||
width="800"
|
||||
class="teacher_detail"
|
||||
>
|
||||
<div class="w-full text-[16px]">
|
||||
<div v-if="teacherDail.data">
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">姓名：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.name || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">职工号：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.teacherId || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">职性别：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.gender || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">出生年份：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.birthYear || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">职称：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.title || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">学历：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.education || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">毕业院校：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.graduationSchool || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="text-[#333]">联系方式：</div>
|
||||
<div class="text-[#666]">
|
||||
{{ teacherDail.data.telphone || "-" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="flex-shrink-0 text-[#333]">著作：</div>
|
||||
<div
|
||||
v-if="teacherDail.data.books && teacherDail.data.books.length"
|
||||
class="text-[#666]"
|
||||
>
|
||||
{{
|
||||
teacherDail.data.books.map((item) => item.bookTitle).join("、")
|
||||
}}
|
||||
</div>
|
||||
<div v-else>-</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="flex-shrink-0 text-[#333]">专利：</div>
|
||||
<div
|
||||
v-if="teacherDail.data.patents && teacherDail.data.patents.length"
|
||||
class="text-[#666]"
|
||||
>
|
||||
{{
|
||||
teacherDail.data.patents
|
||||
.map((item) => item.patentName)
|
||||
.join("、")
|
||||
}}
|
||||
</div>
|
||||
<div v-else>-</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="flex-shrink-0 text-[#333]">授课科目：</div>
|
||||
<div
|
||||
v-if="
|
||||
teacherDail.data.subjects && teacherDail.data.subjects.length
|
||||
"
|
||||
class="text-[#666]"
|
||||
>
|
||||
{{
|
||||
teacherDail.data.subjects
|
||||
.map((item) => item.subjectName)
|
||||
.join("、")
|
||||
}}
|
||||
</div>
|
||||
<div v-else>-</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="flex-shrink-0 text-[#333]">科研项目：</div>
|
||||
<div
|
||||
v-if="
|
||||
teacherDail.data.researchProjects &&
|
||||
teacherDail.data.researchProjects.length
|
||||
"
|
||||
class="text-[#666]"
|
||||
>
|
||||
{{
|
||||
teacherDail.data.researchProjects
|
||||
.map((item) => item.projectName)
|
||||
.join("、")
|
||||
}}
|
||||
</div>
|
||||
<div v-else>-</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="flex-shrink-0 text-[#333]">科研奖励：</div>
|
||||
<div
|
||||
v-if="
|
||||
teacherDail.data.teachingAwards &&
|
||||
teacherDail.data.teachingAwards.length
|
||||
"
|
||||
class="text-[#666]"
|
||||
>
|
||||
{{
|
||||
teacherDail.data.teachingAwards
|
||||
.map((item) => item.projectName)
|
||||
.join("、")
|
||||
}}
|
||||
</div>
|
||||
<div v-else>-</div>
|
||||
</div>
|
||||
<div class="flex mb-[10px]">
|
||||
<div class="flex-shrink-0 text-[#333]">科研论文：</div>
|
||||
<div
|
||||
v-if="
|
||||
teacherDail.data.researchPapers &&
|
||||
teacherDail.data.researchPapers.length
|
||||
"
|
||||
class="pre_wrap text-[#666]"
|
||||
>
|
||||
{{
|
||||
teacherDail.data.researchPapers
|
||||
.map((item) => item.paperTitle)
|
||||
.join(";\n")
|
||||
}}
|
||||
</div>
|
||||
<div v-else>-</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="mb-[10px]">教师评估：</div>
|
||||
<el-input
|
||||
v-model="teacherDail.data.evaluation"
|
||||
style="width: 100%"
|
||||
:rows="6"
|
||||
type="textarea"
|
||||
placeholder="评估中"
|
||||
:disabled="true"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { fetchEventSource } from "@microsoft/fetch-event-source";
|
||||
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { watch } from "vue";
|
||||
|
||||
import {
|
||||
loginAPI,
|
||||
getTeacherListApi,
|
||||
getStuListApi,
|
||||
getStuInfoApi,
|
||||
getTeacherInfoApi,
|
||||
getTeacherDifyApi,
|
||||
getStuDetailApi,
|
||||
getStudentDifyApi,
|
||||
} from "@/request/api";
|
||||
import { useUserStore } from "@/store/user.ts";
|
||||
import { ElMessage } from "element-plus";
|
||||
let loading = ref(false);
|
||||
let userStore: any = useUserStore();
|
||||
const stuDetailVisible: any = ref(false);
|
||||
const stuDetail: any = reactive({ data: {} });
|
||||
|
||||
const selectedKeys = ref([]);
|
||||
// const openKeys = ref(["sub1"]);
|
||||
const columns = [
|
||||
{
|
||||
title: "学生号",
|
||||
dataIndex: "studentId",
|
||||
key: "studentId",
|
||||
},
|
||||
{
|
||||
title: "姓名",
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
},
|
||||
{
|
||||
title: "年级",
|
||||
dataIndex: "currentGrade",
|
||||
key: "currentGrade",
|
||||
},
|
||||
{
|
||||
title: "院系",
|
||||
dataIndex: "departmentName",
|
||||
key: "departmentName",
|
||||
},
|
||||
{
|
||||
title: "专业",
|
||||
dataIndex: "majorName",
|
||||
key: "majorName",
|
||||
},
|
||||
{
|
||||
title: "书院",
|
||||
dataIndex: "collegeName",
|
||||
key: "collegeName",
|
||||
},
|
||||
{
|
||||
title: "班级",
|
||||
dataIndex: "collegeClassName",
|
||||
key: "collegeClassName",
|
||||
},
|
||||
{
|
||||
title: "详情",
|
||||
key: "action",
|
||||
slots: { customRender: "action" },
|
||||
},
|
||||
];
|
||||
const teacherList = reactive({
|
||||
data: [],
|
||||
});
|
||||
const teacherDetailVisible: any = ref(false);
|
||||
|
||||
const teacherDail = reactive({ data: { evaluation: "" } });
|
||||
const stuList = reactive({
|
||||
data: [],
|
||||
});
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const nowSelecTeacher = reactive({ data: {} });
|
||||
watch(
|
||||
() => userStore.menuInfo,
|
||||
(N, O) => {
|
||||
getTeacherList();
|
||||
console.log("menuInfo1111111", userStore.menuInfo.key);
|
||||
}
|
||||
);
|
||||
watch(
|
||||
selectedKeys,
|
||||
() => {
|
||||
getStuList();
|
||||
},
|
||||
{
|
||||
immediate: false,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
onMounted(async () => {
|
||||
getTeacherList();
|
||||
});
|
||||
onActivated(async () => {
|
||||
getTeacherList();
|
||||
});
|
||||
let ipAddress = "http://zb89ba6d.natappfree.cc";
|
||||
|
||||
// async function getStuDetail() {
|
||||
// let res = await getStuDetailApi();
|
||||
// console.log("学生详情", res);
|
||||
// }
|
||||
|
||||
async function getAIDetail(sseUrl: any, query: any) {
|
||||
const controller = new AbortController();
|
||||
const { signal } = controller;
|
||||
fetchEventSource(sseUrl, {
|
||||
method: "POST",
|
||||
mode: "cors",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
Accept: "text/event-stream",
|
||||
Authorization: "Bearer " + userStore.userInfo.data.auth,
|
||||
// credentials: "include",
|
||||
},
|
||||
credentials: "include",
|
||||
// body: mes.replace(/\\/g, '\\\\'),
|
||||
body: JSON.stringify({ query: JSON.stringify(query), user: "1" }),
|
||||
signal,
|
||||
openWhenHidden: true,
|
||||
onmessage(e) {
|
||||
console.log("e", e);
|
||||
let temdata = "";
|
||||
const chunk = e.data;
|
||||
if (chunk === "[DONE]") {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
temdata += chunk;
|
||||
console.log("temdata", temdata);
|
||||
} catch (error) {
|
||||
console.error("Message update failed:", error);
|
||||
controller.abort();
|
||||
}
|
||||
},
|
||||
onclose() {
|
||||
console.log("Connection closed");
|
||||
controller.abort();
|
||||
},
|
||||
onerror(error) {
|
||||
console.error("Error----------------->:", error);
|
||||
controller.abort();
|
||||
throw error;
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function toStudetail(data) {
|
||||
console.log("data", data);
|
||||
loading.value = true;
|
||||
let res = await getStuInfoApi(data.id);
|
||||
loading.value = false;
|
||||
stuDetailVisible.value = true;
|
||||
|
||||
// let res2 = await getTeacherDifyApi(JSON.stringify(res.data));
|
||||
|
||||
// getAIDetail(ipAddress + `/mentors/dify`, res.data);
|
||||
|
||||
if (res.code == 200) {
|
||||
// res.data.academicClassName = res.data?.academicClass?.name || "-";
|
||||
// res.data.evaluation = res2.data;
|
||||
stuDetail.data = res.data;
|
||||
console.log("stuDetail.data", stuDetail.data);
|
||||
|
||||
console.log("res.data", JSON.stringify(res.data));
|
||||
}
|
||||
let res2 = await getStudentDifyApi(JSON.stringify(res.data));
|
||||
stuDetail.data.evaluation = res2.data;
|
||||
console.log("res2.data");
|
||||
|
||||
console.log("stuDetail.data", stuDetail.data);
|
||||
|
||||
// router.push({
|
||||
// path: "/stu-detail",
|
||||
// query: {
|
||||
// id: data.studentId,
|
||||
// },
|
||||
// });
|
||||
}
|
||||
async function getTeacherList() {
|
||||
let res = await getTeacherListApi(userStore.menuInfo.key);
|
||||
console.log("res", res);
|
||||
if (res?.data) {
|
||||
teacherList.data.splice(0);
|
||||
selectedKeys.value[0] = res?.data[0]?.teacherId || null;
|
||||
nowSelecTeacher.data = res?.data[0] || {};
|
||||
|
||||
teacherList.data.push(...res?.data);
|
||||
}
|
||||
}
|
||||
async function getStuList() {
|
||||
console.log("getStuList", selectedKeys.value);
|
||||
let res = await getStuListApi({ teacherId: selectedKeys.value[0] });
|
||||
stuList.data.splice(0);
|
||||
|
||||
if (res?.data?.students?.length) {
|
||||
res?.data?.students.forEach((item) => {
|
||||
item.collegeClassName = item?.collegeClass?.name || "-";
|
||||
item.collegeName = item?.college?.name || "-";
|
||||
item.majorName = item?.major?.name || "-";
|
||||
item.departmentName = item?.department?.name || "-";
|
||||
// item.collegeClassName = item.collegeClass.name;
|
||||
// item.collegeClassName = item.collegeClass.name;
|
||||
});
|
||||
stuList.data.push(...res.data.students);
|
||||
}
|
||||
}
|
||||
async function showTeacherDetail() {
|
||||
loading.value = true;
|
||||
let res = await getTeacherInfoApi(nowSelecTeacher.data.id);
|
||||
loading.value = false;
|
||||
|
||||
if (res.code == 200) {
|
||||
if (res.data) {
|
||||
console.log("res.data", JSON.stringify(res.data));
|
||||
|
||||
teacherDail.data = res.data;
|
||||
}
|
||||
|
||||
teacherDetailVisible.value = true;
|
||||
// console.log("teacherDetailVisible.value", teacherDetailVisible.value);
|
||||
} else {
|
||||
ElMessage.error("获取数据失败，请稍后重试！");
|
||||
}
|
||||
let resDify = await getTeacherDifyApi(JSON.stringify(res.data));
|
||||
teacherDail.data.evaluation = resDify.data;
|
||||
}
|
||||
function handleClick(data) {
|
||||
nowSelecTeacher.data = data;
|
||||
}
|
||||
const titleClick = (e: Event) => {
|
||||
console.log("titleClick", e);
|
||||
};
|
||||
function toAboutPage() {
|
||||
router.push({
|
||||
path: "/about",
|
||||
query: {
|
||||
title: "666",
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function toTestPage() {
|
||||
router.push({
|
||||
path: "/test/" + 888,
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.no_data {
|
||||
background: url("../assets/web/noData.png");
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
// background-image: url("../assets/web/noData.png");
|
||||
// background-repeat: no-repeat;
|
||||
// background-color: #333;
|
||||
// position: absolute;
|
||||
// left: 50%;
|
||||
// top: 50%;
|
||||
z-index: 100;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
.pre_wrap {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
// .ant-table-wrapper {
|
||||
// height: 100%;
|
||||
// }
|
||||
// :deep(.ant-spin-nested-loading) {
|
||||
// height: 100%;
|
||||
// }
|
||||
// :deep(.ant-spin-container) {
|
||||
// height: 100%;
|
||||
// }
|
||||
:deep(.ant-menu-item) {
|
||||
// padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
:deep(.stu_detail) {
|
||||
background: linear-gradient(180deg, #e6fffc 0%, #ffffff 30%);
|
||||
}
|
||||
:deep(.teacher_detail) {
|
||||
background: linear-gradient(180deg, #e6efff 0%, #ffffff 30%);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user