完成作业提交界面大部分内容，剩余几个按钮和接入算法控件，以及传输上回没添加的组件。

AES-front/src/api/user.js

@@ -32,5 +32,8 @@ export default {
 
   getClassRanks:(config) => request.get('/problem/getClassRanks', config),//获取当前报告班级排名
 
-  getProblemInfo:(config) => request.get('/problem/getProblemInfo', config)//获取当前报告布置信息
+  getPostProblemInfo:(config) => request.get('/problem/getPostProblemInfo', config),//获取当前报告布置信息
+
+  findProblemById1:(config)=>request.get('/problem/findProblemById1',config)//获取当前报告具体信息
+
 }

AES-front/src/views/user/report-submit/components/leftparts.vue

@@ -0,0 +1,88 @@
+<template>
+  <div>
+    <el-card class="description-card">
+      <div slot="header" class="clearfix card-header">
+        <span class="subtitle">实验描述</span>
+      </div>
+      <div class="description-content">
+        {{ description }}
+      </div>
+    </el-card>
+    <el-card class="submit-card">
+      <div slot="header" class="clearfix card-header">
+        <span class="subtitle">实验提交</span>
+      </div>
+      <el-input
+          type="textarea"
+          :rows="4"
+          placeholder="请输入你的实验报告"
+          v-model="reportText"
+          class="submit-textarea"
+      ></el-input>
+      <el-button size="small" type="success">上传附件</el-button>
+
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue';
+import api from '@/api/user';
+import { useRoute } from 'vue-router';
+
+const route = useRoute();
+const ProblemId = route.params.examId;
+const description = ref(""); // 实验描述
+const reportText = ref(""); // 实验报告文本
+
+
+const getProblemInfo = async () => {
+  // 查询作业信息
+  try {
+    const res = await api.findProblemById1({ params: { ProblemId } });
+    description.value = res.data.description; // 更新作业名称
+  } catch (error) {
+    console.error("Failed to fetch problem info:", error);
+  }
+};
+
+// 生命周期钩子
+onMounted(() => {
+  getProblemInfo(); // 挂载时查询作业信息
+});
+
+
+</script>
+
+<style scoped>
+.card-header {
+  background-color: #f5f5f5; /* 加深灰色背景 */
+  border-bottom: 1px solid #dcdcdc; /* 灰色边框 */
+  padding: 10px; /* 内边距 */
+}
+
+.subtitle {
+  font-size: 18px;
+  font-weight: bold;
+}
+
+.description-card,
+.submit-card {
+  margin-bottom: 20px;
+  max-height: 300px;
+  overflow-y: auto;
+  width: 90%;
+}
+
+.description-content {
+  white-space: pre-wrap; /* 保留换行和空格 */
+  padding: 10px;
+}
+
+.submit-textarea {
+  margin-bottom: 20px;
+  width: 100%;
+}
+
+
+</style>

AES-front/src/views/user/report-submit/components/report-actions.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="button-container">
+    <n-button type="primary" size="medium" @click="onSave">保存</n-button>
+    <n-button type="success" size="medium" @click="onSaveAndSubmit">保存并提交</n-button>
+    <n-button type="warning" size="medium" @click="onWithdraw">申请撤回</n-button>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const isClicked = ref(false);
+
+const emit = defineEmits(['clickSave', 'clickSaveAndSubmit', 'clickWithdraw']);
+
+const onSave = () => {
+  // TODO: 实现保存逻辑
+  emit('clickSave');
+};
+
+const onSaveAndSubmit = () => {
+  // TODO: 实现保存并提交逻辑
+  emit('clickSaveAndSubmit');
+};
+
+const onWithdraw = () => {
+  // TODO: 实现申请撤回逻辑
+  emit('clickWithdraw');
+};
+</script>
+
+<style scoped>
+.button-container {
+  display: flex; /* 使用 Flexbox 布局 */
+  justify-content: center; /* 按钮水平居中 */
+  gap: 40px; /* 按钮之间的间距 */
+  margin-top: 0px; /* 与上方组件的间距 */
+}
+
+</style>

AES-front/src/views/user/report-submit/components/rightparts.vue

@@ -0,0 +1,77 @@
+<template>
+  <div>
+    <el-card class="description-card">
+      <div slot="header" class="clearfix card-header">
+        <span class="subtitle">教师评语</span>
+      </div>
+      <div class="description-content">
+        <span v-if="plagiarismStatus === '2'" class="plagiarism-warning">疑似抄袭！！<br></span>
+        <span v-if="comment" class="comment-text">{{ comment }}</span>
+        <span v-else class="no-comment-text">暂无评价</span>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+
+<script setup>
+import { ref, onMounted } from 'vue';
+import api from '@/api/user';
+import { useRoute } from 'vue-router';
+
+const route = useRoute();
+const examId = route.params.examId;
+const comment = ref(""); // 教师评语
+const plagiarismStatus = ref(0); // 初始化抄袭状态
+
+const getJudgeInfo = async () => {
+  // 查询批阅相关信息
+  try {
+    const res = await api.getStudentRank({ params: { examId } });
+    comment.value = res.data.comment; // 更新教师评语
+    plagiarismStatus.value = res.data.plagiarismStatus; // 更新抄袭状态
+  } catch (error) {
+    console.error("Failed to fetch problem info:", error);
+  }
+};
+
+// 生命周期钩子
+onMounted(() => {
+  getJudgeInfo(); // 挂载时查询批阅相关信息
+});
+</script>
+
+<style scoped>
+.description-card {
+  width: 80%;
+  margin: 0 auto;
+}
+
+.card-header {
+  text-align: left;
+}
+
+.subtitle {
+  font-size: 18px;
+  font-weight: bold;
+}
+
+.description-content {
+  white-space: pre-wrap;
+  padding: 10px;
+  height: 280px;
+  overflow-y: auto;
+  text-align: left;
+}
+
+.plagiarism-warning {
+  color: red;
+  font-weight: bold;
+}
+
+
+.no-comment-text {
+  color: #999999; /* 灰色 */
+  opacity: 0.8; /* 变淡 */
+}
+</style>

AES-front/src/views/user/report-submit/index.vue

@@ -32,8 +32,6 @@ const examId  = route.params.examId;
 const classId  = route.params.classId;
 const loading = ref(true);
 const title = ref(""); // 从API获取的作业名称
-const examScores = ref([]);
-const examName = ref("");
 const countdown = ref(""); // 用于显示倒计时
 // 将结束时间转换为Date对象
 let endTime = null; // 结束时间初始化为null
@@ -57,10 +55,6 @@ const paginationReactive = reactive({
     queryExamScores()
   }
 });
-// 列配置
-const columns = [
-  // ... 列配置
-];
 
 
 const queryExamScores = async () => {
@@ -69,7 +63,7 @@ const queryExamScores = async () => {
     //查询作业名称信息（直接复用查询排名）
     const res1 = await api.getStudentRank({ params: { examId } });
     //查询作业时间等信息
-    const res = await api.getProblemInfo({ params: { classId, examId } });
+    const res = await api.getPostProblemInfo({ params: { classId, examId } });
 
     title.value = res1.data.title; // 更新作业名称
     // 将结束时间转换为Date对象
@@ -161,11 +155,9 @@ onMounted(() => {
 
 .bottom {
   position: fixed; /* 使用固定定位 */
-  left: 50%; /* 水平居中 */
+  left: 35%;
   transform: translateX(-50%); /* 使用transform调整实际位置 */
-  bottom: 0; /* 定位到页面底部 */
   width: 100%; /* 宽度占满整个容器 */
-  text-align: center; /* 文本居中 */
 }
 
 </style>

AES/src/main/java/com/example/aes/problem/controller/ProblemController.java

@@ -196,6 +196,20 @@ public class ProblemController {
 
     }
 
+    @GetMapping("/findProblemById1")//直接从前端传单个数据的方法
+    public RespBean findProblemById(Integer ProblemId) {
+        if (ProblemId == null) {
+            // 处理没有提供 ProblemId 的情况，例如返回错误信息或默认值
+            return RespBean.error("ProblemId 不能为空");
+        }
+        List<Problem> problems = problemServiceI.findProblemById(ProblemId);
+        if (problems == null || problems.isEmpty()) {
+            // 处理没有找到问题的情况
+            return RespBean.error("未找到对应的作业信息");
+        }
+        return RespBean.ok("查询作业成功", problems.get(0));
+    }
+
     @PostMapping("/findPostProblem")
     public RespBean findPostProblem(@RequestBody PMPostProblem pmPostProblem) {
         List<PostProblem> postProblems = problemServiceI.findPostProblem(pmPostProblem.getProblemId(), pmPostProblem.getClassId());
@@ -326,15 +340,15 @@ public class ProblemController {
     }
 
     //获取当前作业班级排名信息
-    @GetMapping("/getProblemInfo")
+    @GetMapping("/getPostProblemInfo")
-    public RespBean getProblemInfo(Integer classId, Integer examId) {
+    public RespBean getPostProblemInfo(Integer classId, Integer examId) {
         List<PostProblem> PostProblem = problemServiceI.findPostProblem(examId,classId);
         if (!PostProblem.isEmpty()) {
             // 直接获取列表中的第一个元素
             PostProblem postProblem = PostProblem.get(0);
-            return RespBean.ok("获取实验具体信息成功！", postProblem);
+            return RespBean.ok("获取教师布置实验具体信息成功！", postProblem);
         } else {
-            return RespBean.error("获取实验具体信息失败！");
+            return RespBean.error("获取教师布置实验具体信息失败！");
         }
     }
 }

AES/src/main/resources/application.properties

@@ -5,7 +5,7 @@ server.port=8082
 spring.datasource.type=com.alibaba.druid.pool.DruidDataSource
 jdbc_url=jdbc:mysql://localhost:3306/aes?useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8&useSSL=false&allowPublicKeyRetrieval=True
 jdbc_username=root
-jdbc_password=123456
+jdbc_password=13661744518xh
 #spring.datasource.url=jdbc:mysql://localhost:3306/aes?useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8&useSSL=false&allowPublicKeyRetrieval=True
 #spring.datasource.username=root
 #spring.datasource.password=123456