变更

src/apis/assignment.ts

@@ -18,8 +18,8 @@ const assignmentApis = {
             }
         })
     },
-    createAssignment(courseId:number, assignment: AssignmentDTO){
-        return axiosInstance.post(`${ASSIGNMENT_PREFIX}`, assignment, {
+    createAssignment(courseId:number, assignmentDTO: AssignmentDTO){
+        return axiosInstance.post(`${ASSIGNMENT_PREFIX}`, assignmentDTO, {
             params: {
                 courseId
             }
@@ -33,6 +33,13 @@ const assignmentApis = {
             }
         })
     },
+    updateAssignment(assignmentId:number, assignmentDTO:AssignmentDTO){
+        return axiosInstance.put(`${ASSIGNMENT_PREFIX}`, assignmentDTO, {
+            params: {
+                assignmentId
+            }
+        })
+    }
 }
 
 export default assignmentApis

src/apis/course.ts

@@ -1,6 +1,6 @@
 import axiosInstance from "@/apis/axios.config";
 import type {CourseQuery} from "@/types/query";
-import type {CourseDTO, EnrollDTO} from "@/types/dto";
+import type {AssignmentQueryDTO, CourseDTO, CourseUpdateDTO, EnrollDTO} from "@/types/dto";
 
 const COURSE_PREFIX = "/api/course"
 
@@ -42,6 +42,21 @@ const courseApis = {
     },
     enrollCourse(enrollDTO: EnrollDTO){
         return axiosInstance.post(`${COURSE_PREFIX}/enroll`, enrollDTO)
+    },
+    updateCourse(courseId: number, courseUpdateDTO:CourseUpdateDTO){
+        return axiosInstance.put(`${COURSE_PREFIX}`, courseUpdateDTO, {
+            params: {
+                courseId
+            }
+        })
+    },
+    findAssignmentPage: (assignmentQueryDTO: AssignmentQueryDTO, page: number=0, size: number=10) => {
+        return axiosInstance.post(`${ASSIGNMENT_PREFIX}/query`, assignmentQueryDTO, {
+            params: {
+                page,
+                size
+            }
+        });
     }
 }
 

src/apis/user.ts

@@ -8,6 +8,13 @@ const userApis = {
         return axiosInstance.post(`${USER_PREFIX}/login`, {
             ...userForm
         })
+    },
+    findUserById: (id:number) => {
+        return axiosInstance.get(`${USER_PREFIX}`, {
+            params: {
+                id
+            }
+        })
     }
 }
 

src/components/ViewsWordEditor/ViewsWordEditor.vue

@@ -13,15 +13,23 @@
         class="full-modal"
         @close="handleClose"
     >
-      <iframe
-          :src="`https://view.officeapps.live.com/op/view.aspx?src=${props.docxInfo.docxUrl}`"
-          :title="docxInfo.docxTitle"
-          style="width: 100%; height: 75vh;"
-      ></iframe>
+      <template v-if="props.docxInfo.docxUrl">
+        <iframe
+            :src="`https://view.officeapps.live.com/op/view.aspx?src=${props.docxInfo.docxUrl}`"
+            :title="docxInfo.docxTitle"
+            style="width: 100%; height: 75vh;"
+        ></iframe>
+      </template>
+      <template v-else>
+        <div style="width: 100%; height: 75vh; font-size: 20px;">
+          暂无描述文件
+        </div>
+      </template>
+
       <template #footer>
         <div class="button-right">
-          <el-button @click="handleClose">取消</el-button>
-          <el-button type="primary" @click="handleClose">OK</el-button>
+          <el-button color="#597d3b" @click="handleClose">取消</el-button>
+          <el-button color="#597d3b" type="primary" @click="handleClose">OK</el-button>
         </div>
       </template>
     </el-dialog>

src/components/ViewsWordEditor/index.scss

@@ -1,6 +1,6 @@
 .view-word-editor{
   .full-modal {
-    height: 90vh;
+    //height: 85vh;
   }
   .button-right {
     display: flex;

src/layout/Header/Header.vue

@@ -36,27 +36,34 @@
     </el-col>
     <!--用户头像和昵称-->
     <el-col :span="3" :offset="7">
-      <div class="header-userName">
-        <!--如果是登录状态-->
-        <template v-if="store.token !== ''">
-          <!--用户有头像-->
-          <template v-if="store.user.userAvatar !== ''">
-          <el-avatar :size="32" :shape="'circle'" :src="store.user.userAvatar"/>
+      <el-dropdown @command="handleCommand" style="margin-top: 5px">
+        <div class="header-userName">
+          <!--如果是登录状态-->
+          <template v-if="store.token !== ''">
+            <!--用户有头像-->
+            <template v-if="store.user.userAvatar !== ''">
+            <el-avatar :size="32" :shape="'circle'" :src="store.user.userAvatar"/>
+            </template>
+            <!--用户没有头像-->
+            <template v-else>
+              <el-avatar :size="32" :shape="'circle'"> {{ store.user.name.charAt(0) }}</el-avatar>
+            </template>
+            <div class="nickName">
+              {{store.user.name}}
+            </div>
           </template>
-          <!--用户没有头像-->
+          <!--如果是未登录状态-->
           <template v-else>
-            <el-avatar :size="32" :shape="'circle'"> {{ store.user.name.charAt(0) }}</el-avatar>
+            <el-avatar :size="32" :shape="'circle'"> User</el-avatar>
+            <div class="nickName">user</div>
           </template>
-          <div class="nickName">
-            {{store.user.name}}
-          </div>
-        </template>
-        <!--如果是未登录状态-->
-        <template v-else>
-          <el-avatar :size="32" :shape="'circle'"> User</el-avatar>
-          <div class="nickName">user</div>
+        </div>
+        <template #dropdown>
+          <el-dropdown-menu>
+            <el-dropdown-item command="logout">退出登录</el-dropdown-item>
+          </el-dropdown-menu>
         </template>
-      </div>
+      </el-dropdown>
 <!--      <el-dropdown @command="handleCommand" style="position: absolute;top: 35%">-->
 <!--        <span style="color: blue">-->
 <!--            user-->
@@ -115,13 +122,14 @@
     },
   ]
 
-  const handleSelect = (index)=>{
+  const handleSelect = (index:string)=>{
     emitter.emit('change-page', index)
   }
 
-  const handleCommand = (command)=>{
+  const handleCommand = (command:string)=>{
     if(command==="logout"){
-      window.sessionStorage.clear()
+      localStorage.clear()
+      store.clear()
       router.push({path: "/login"})
     }
   }

src/router/index.ts

@@ -34,9 +34,12 @@ const router = createRouter({
           component: () => import("../views/CourseSquare/component/CourseDetails/index.vue")
         },
         {
-          path: 'allCourse',
-          name: 'allCourse',
-          component: () => import("../views/CourseSquare/component/AllCourse/AllCourse.vue")
+          path: 'moreCourse',
+          name: 'moreCourse',
+          component: () => import("../views/CourseSquare/component/AllCourse/MoreCourse.vue"),
+          props(route) {
+            return route.query
+          },
         },
         {
           path: 'myCourse',

src/store/index.ts

@@ -16,6 +16,10 @@ export const useStore = defineStore('user', {
         },
         setUser(user: IUser) {
             this.user = user;
+        },
+        clear(){
+            this.user = null;
+            this.token = ''
         }
     },
     // 持久化，pinia-plugin-persistedstate

src/types/dto.ts

@@ -7,6 +7,21 @@ export interface AssignmentDTO {
     endTime: string; // 结束时间不能缺失 (ISO 8601 日期时间字符串)
 }
 
+export interface AssignmentQueryDTO {
+    assignmentId?: number;
+    teacherId?: number;
+    courseId?: number;
+    assignmentName?: string;
+    status?: AssignmentStatus;
+}
+
+export enum AssignmentStatus {
+    NOT_STARTED = "NOT_STARTED",
+    PROCEEDING = "PROCEEDING",
+    FINISHED = "FINISHED"
+}
+
+
 export interface EnrollDTO {
     studentId:number;
     courseId:number;
@@ -23,3 +38,14 @@ export interface CourseDTO {
     description: string; // 课程描述不能缺失
     enrollCode: string; // 选课码不能缺失
 }
+
+export interface CourseUpdateDTO {
+    courseName: string; // 课程名不能缺失
+    teacherIds: number[]; // 老师Id不能缺失
+    courseImages?: string[]; // 可选
+    targetGrade?: string; // 可选
+    startTime: string; // 起始时间不能缺失 (ISO 8601 日期时间字符串)
+    endTime: string; // 截止时间不能缺失 (ISO 8601 日期时间字符串)
+    description: string; // 课程描述不能缺失
+    enrollCode: string; // 选课码不能缺失
+}

src/types/vo.ts

@@ -49,6 +49,30 @@ export interface IAssignment {
     status: string;
 }
 
+export interface AssignmentVO {
+    assignmentId: number;
+
+    assignmentName: string;
+
+    description: string;
+
+    descriptionFile: string|null; // 作业要求，Word/Pdf文件
+
+    attachments: string[]|null; // 作业附件
+
+    teacherId: number; // 发布作业的老师的Id
+
+    courseId: number; // 哪个课程下的assignment
+
+    startTime: string;
+
+    endTime: string;
+
+    createTime: string;
+
+    status: string;
+}
+
 export interface IAssignmentTableColumn {
     title: string;
     dataIndex: 'desc' | 'publisher' | 'startDate' | 'endDate' | 'details' | 'writing' | 'assignmentId';
@@ -61,6 +85,7 @@ export interface IAssignmentTableItem {
     startDate: string;
     endDate: string;
     assignmentId: number;
+    descriptionFile?: string
 }
 
 

src/views/CoursePage/CoursePage.vue

@@ -4,42 +4,56 @@
   Created Date: 2024-7-2
 -->
 <template>
-  <el-card style="margin: 10px auto 0;height: 625px; width: 80%" shadow="never">
-    <el-button :icon="Refresh" circle></el-button>
+  <el-card style="margin: 10px auto 0;height: 90vh; width: 80%" shadow="never">
+    <el-button :icon="Refresh" circle @click="doRefresh"></el-button>
     <template v-if="role == 'teachers'">
       <el-button @click="visible = !visible" color="#597d3b">新增课程</el-button>
     </template>
-    <el-select
-        v-model="state"
-        placeholder="状态"
-        size="default"
-        style="width: 150px; margin-left: 10px;"
-    >
-      <el-option
-          v-for="item in stateOptions"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-      />
-    </el-select>
-
-    <el-table :data="dataForm.records" height="500" style="width: 100%">
+<!--    <el-select-->
+<!--        v-model="state"-->
+<!--        placeholder="状态"-->
+<!--        size="default"-->
+<!--        style="width: 150px; margin-left: 10px;"-->
+<!--    >-->
+<!--      <el-option-->
+<!--          v-for="item in stateOptions"-->
+<!--          :key="item.value"-->
+<!--          :label="item.label"-->
+<!--          :value="item.value"-->
+<!--      />-->
+<!--    </el-select>-->
+
+    <el-table :data="pageInfo.records" style="width: 100%" height="80vh">
+      <template #empty>
+        暂无课程
+      </template>
       <el-table-column type="index"/>
       <el-table-column prop="courseName" label="课程名称"/>
       <el-table-column prop="description" label="描述"/>
       <el-table-column prop="endTime" label="截止时间" sortable/>
-      <el-table-column>
+      <el-table-column label="操作">
         <template #default="scope">
-          <el-button text @click="handleShowDetail(scope.row.courseId)" style="margin-right: 0; margin-left: 0;padding-left: 5px; padding-right: 5px">
-            <el-icon style="margin-right: 3px"><ZoomIn/></el-icon>
+          <el-button @click="handleShowDetail(scope.row.courseId)" style="margin-right: 0; margin-left: 0;padding-left: 10px; padding-right: 10px" color="#597D3B">
+            <el-icon style="margin-right: 3px" ><ZoomIn/></el-icon>
             详情
           </el-button>
         </template>
       </el-table-column>
     </el-table>
+
+    <el-pagination
+        small
+        style="font-size: 16px;margin-top: 10px;margin-left: 450px"
+        @current-change="handleCurrentChange"
+        :current-page="queryInfo.pageNow"
+        :page-size="queryInfo.pageSize"
+        layout="total, prev, pager, next, jumper"
+        :total="pageInfo.total">
+    </el-pagination>
+
   </el-card>
 
-  <el-dialog v-model="visible">
+  <el-dialog v-model="visible" title="新增课程">
     <el-form :model="newCourse">
       <el-form-item label="课程名称">
         <el-input v-model="newCourse.courseName" placeholder="请输入名称"></el-input>
@@ -72,7 +86,7 @@
 <script lang="ts" setup>
   import useApis from "@/apis";
   import {useStore} from "@/store";
-  import {onMounted, reactive, ref} from "vue";
+  import {inject, onMounted, reactive, ref} from "vue";
   import type {CourseVO} from "@/types/vo";
   import {Refresh, ZoomIn} from "@element-plus/icons-vue";
   import router from "@/router";
@@ -81,11 +95,17 @@
 
   const apis = useApis()
   const store = useStore()
+  const doRefresh:Function = inject("reload")
   const role:'teachers' | 'student' = store.user.role === 'STUDENT' ?   'student':'teachers';
 
   let visible = ref(false)
 
-  let dataForm = reactive<{
+  const queryInfo = reactive({
+    pageNow: 1,
+    pageSize: 10,
+  })
+
+  let pageInfo = reactive<{
     records: CourseVO[],
     current: number,// 当前页码
     size: number, // 分页大小
@@ -110,7 +130,10 @@
     enrollCode: ""
   })
 
-  function formatDate(date) {
+  /*
+  时间格式转换方法
+   */
+  function formatDate(date:string) {
     const d = new Date(date);
     const year = d.getFullYear();
     const month = String(d.getMonth() + 1).padStart(2, '0');
@@ -149,11 +172,11 @@
 
   const fetchCourseByUserId = () => {
     if (role === 'student') {
-      apis.getCourseByStudentId(store.user.id)
+      apis.getCourseByStudentId(store.user.id, queryInfo.pageNow, queryInfo.pageSize)
           .then((res: any) => {
             let data = res.data.data
             console.log(data)
-            Object.assign(dataForm, {...data})
+            Object.assign(pageInfo, {...data})
           })
           .catch((err: any) => {
             console.error(err);
@@ -161,11 +184,11 @@
           .finally(() => {
           });
     } else if (role === "teachers") {
-      apis.getCourseByTeacherId(store.user.id)
+      apis.getCourseByTeacherId(store.user.id, queryInfo.pageNow, queryInfo.pageSize)
           .then((res: any) => {
             let data = res.data.data
             console.log(data)
-            Object.assign(dataForm, {...data})
+            Object.assign(pageInfo, {...data})
           })
           .catch((err: any) => {
             console.error(err);
@@ -175,8 +198,14 @@
     }
   }
 
+  const handleCurrentChange =(index:number)=>{
+    queryInfo.pageNow=index;
+    fetchCourseByUserId();
+  }
+
   onMounted(() => {
     fetchCourseByUserId()
+    console.log("我的课程挂载")
   })
 
   // TODO:状态选择

src/views/CourseSquare/component/AllCourse/AllCourse.scss

@@ -1,65 +0,0 @@
-.course-content {
-  position: relative;
-  width: 100%;
-  overflow: hidden;
-  margin: 40px auto 0 auto;
-
-  .course-content-container {
-    overflow: hidden;
-    margin: 0 auto;
-    height: 100%;
-    width: 1100px;
-    background-color: #ffffff;
-    border: solid 1px #d0d0d0;
-    border-radius: 7px;
-
-    .course-items-container {
-      display: flex;
-      justify-content: center;
-      gap: 10px;
-      //background-color: red;
-      margin: 20px 0;
-      //height: 100%;
-      //width: 1100px;
-
-    }
-
-    .el-card__body {
-      padding: 0;
-    }
-
-    .course-item {
-      flex: 1;
-      max-width: 200px;
-      box-sizing: border-box;
-      //padding: 10px;
-      height: 270px;
-      line-height: 30px;
-      //margin-bottom: 10px;
-
-      .course-item-img {
-        width: 100%;
-        height: 100%;
-        object-fit: cover;
-      }
-
-      .course-item-content {
-        font-size: 14px;
-        padding: 0 10px;
-      }
-
-      &.active {
-        cursor: pointer;
-      }
-    }
-
-    .course-item-hidden {
-      flex: 1;
-      max-width: 200px;
-      height: 270px;
-      box-sizing: border-box;
-      line-height: 30px;
-      opacity: 0;
-    }
-  }
-}

src/views/CourseSquare/component/AllCourse/AllCourse.vue

@@ -1,117 +0,0 @@
-<template>
-  <div class="course-content">
-    <div class="course-content-container">
-      <div class="course-items-container">
-        <el-card v-for="item in getCoursesSlice(0, 5)" :key="item.courseId" class="course-item active" @click="handleClick(item.courseId)">
-          <div style="width: 200px; height: 120px">
-            <img :src="item.courseImages[0]" :alt="item.courseName" class="course-item-img">
-          </div>
-          <div class="course-item-content">
-            <div style="font-weight: bold">{{item.courseName}}</div>
-            <div>{{item.description}}</div>
-            <div>{{item.teacherIds.join("\n")}}</div>
-          </div>
-        </el-card>
-
-        <template v-if="getCoursesSlice(0, 5).length < 5">
-          <el-card v-for="item in 5 - getCoursesSlice(0, 5).length" :key="item" class="course-item-hidden">
-          </el-card>
-        </template>
-
-      </div>
-      <div class="course-items-container">
-        <el-card v-for="item in getCoursesSlice(5, 10)" :key="item.courseId" class="course-item active" @click="handleClick(item.courseId)">
-          <div style="width: 200px; height: 120px">
-            <img :src="item.courseImages[0]" :alt="item.courseName" class="course-item-img">
-          </div>
-          <div class="course-item-content">
-            <div style="font-weight: bold">{{item.courseName}}</div>
-            <div>{{item.description}}</div>
-            <div>{{item.teacherIds.join("\n")}}</div>
-          </div>
-        </el-card>
-
-        <template v-if="getCoursesSlice(5, 10).length < 5">
-          <el-card v-for="item in 5 - getCoursesSlice(5, 10).length" :key="item" class="course-item-hidden">
-          </el-card>
-        </template>
-      </div>
-
-      <el-pagination
-          small
-          style="font-size: 16px;margin-top: 10px;margin-left: 450px"
-          @current-change="handleCurrentChange"
-          :current-page="queryInfo.pageNow"
-          :page-size="queryInfo.pageSize"
-          layout="total, prev, pager, next, jumper"
-          :total="pageInfo.total">
-      </el-pagination>
-
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import './AllCourse.scss'
-import {onMounted, reactive} from "vue";
-import useApis from "@/apis";
-import type {CourseQuery} from "@/types/query";
-import router from "@/router";
-
-const apis = useApis()
-
-const queryInfo = reactive({
-  pageNow: 1,
-  pageSize: 10,
-})
-
-let pageInfo = reactive({
-  total: 0,
-  courseData: []
-})
-
-// 处理课程卡片的点击事件
-const handleClick = (value:number) => {
-  router.push(`/home/courseDetail/${value}`)
-}
-
-const handleCurrentChange =(index:number)=>{
-  queryInfo.pageNow=index;
-  fetchAllCourse();
-}
-
-const fetchAllCourse = () => {
-  const query = reactive<CourseQuery>({
-    courseId:null,
-    teacherId:null,
-    studentId:null,
-    courseName:null,
-    semester:null,
-  })
-  apis.getAllCourse(query, queryInfo.pageNow, queryInfo.pageSize)
-      .then((res: any) => {
-        console.log(res)
-        pageInfo.courseData = res.data.data.records
-        pageInfo.total = res.data.data.total
-      })
-      .catch((err: any) => {
-        console.error("错误信息",err);
-      })
-      .finally(() => {});
-}
-
-//只获取前五个课程
-const getCoursesSlice = (start:number, end:number) => {
-  return pageInfo.courseData.slice(start, end)
-}
-
-onMounted(()=>{
-  fetchAllCourse()
-})
-</script>
-
-<script lang="ts">
-export default {
-  name: "AllCourse"
-}
-</script>

src/views/CourseSquare/component/Course/index.vue

@@ -131,7 +131,13 @@
   }
 
   const handleMore = () => {
-    router.push("/home/allCourse")
+    router.push({
+      name: 'moreCourse',
+      query: {
+        title: props.title,
+        type: props.type
+      }
+    })
   }
 
   // 处理课程卡片的点击事件
@@ -160,8 +166,8 @@
   const fetchAllCourse = () => {
     apis.getAllCourse(query, 0, 10)
         .then((res: any) => {
-          console.log(res)
           courses.course = res.data.data.records
+          processCourses()
         })
         .catch((err: any) => {
           console.error("错误信息",err);
@@ -173,8 +179,8 @@
     if(role === 'student'){
       apis.getCourseByStudentId(store.user.id)
           .then((res: any) => {
-            console.log("学生", res.data.data.records)
             courses.course = res.data.data.records
+            processCourses()
           })
           .catch((err: any) => {
             console.error(err);
@@ -183,8 +189,8 @@
     } else if(role === "teachers"){
       apis.getCourseByTeacherId(store.user.id)
           .then((res: any) => {
-            console.log("教师", res.data.data.records)
             courses.course = res.data.data.records
+            processCourses()
           })
           .catch((err: any) => {
             console.error(err);
@@ -193,6 +199,23 @@
     }
   }
 
+  /*
+  用于显示教师姓名
+   */
+  const processCourses = () => {
+    for(let i:number = 0; i < courses.course.length; i++){
+      for(let j = 0; j < courses.course[i].teacherIds.length; j++){
+        apis.findUserById(courses.course[i].teacherIds[j])
+            .then((res:any) => {
+              courses.course[i].teacherIds[j] = res.data.data.records[0].name
+            })
+            .catch((err:any) => {
+              console.log("错误信息",err)
+            })
+      }
+    }
+  }
+
   onMounted(()=>{
     fetchData()
   })

src/views/CourseSquare/component/CourseDetails/component/CourseHomeworkTable.vue

@@ -6,10 +6,10 @@
 <template>
   <el-card>
     <template v-if="props.role == 'teachers'">
-      <el-button color="#597d3b">新建作业</el-button>
+      <el-button color="#597d3b" @click="cleanNewAssignmentInfo(); changeDialog('add')" v-if="props.isShowNewHomework">新建作业</el-button>
     </template>
     <template v-if="props.tableData.length > 0">
-      <el-table :data="props.tableData" stripe style="width: 100%">
+      <el-table :data="props.tableData" stripe style="width: 100%" height="100%">
         <el-table-column
             v-for="column in props.columns"
             :prop="column.dataIndex"
@@ -18,12 +18,12 @@
         </el-table-column>
         <el-table-column label="详情">
           <template #default="scope">
-            <el-button color="#888" circle/>
+            <el-button color="#888" circle @click="openEditor(scope.row.descriptionFile, scope.row.assignmentName)"/>
           </template>
         </el-table-column>
         <el-table-column :label="role == 'teachers'? '编辑':'写作'">
           <template #default="scope">
-            <el-button color="#888" circle @click="handleWriting(scope.row.assignmentId)"/>
+            <el-button color="#888" circle @click="handleFunctionButton(scope.row.assignmentId)"/>
           </template>
         </el-table-column>
       </el-table>
@@ -32,25 +32,225 @@
       <div style="text-align: center;">暂无作业</div>
     </template>
   </el-card>
+
+  <el-dialog v-model="dialogConfig.visible" :title="dialogConfig.title">
+    <el-form :model="newAssignmentInfo">
+      <!--      <el-form-item label="课程图片">-->
+      <el-form-item label="作业名称">
+        <el-input v-model="newAssignmentInfo.assignmentName" placeholder="请输入名称"></el-input>
+      </el-form-item>
+      <el-form-item label="作业描述">
+        <el-input v-model="newAssignmentInfo.description" placeholder="请输入描述"></el-input>
+      </el-form-item>
+      <el-form-item label="描述文件">
+        <el-input v-model="newAssignmentInfo.descriptionFile" placeholder="请输入文件地址"></el-input>
+      </el-form-item>
+      <el-form-item label="课程图片">
+        <el-input v-model="newAssignmentInfo.attachments[0]" placeholder="请输入图片链接"></el-input>
+      </el-form-item>
+      <el-form-item label="开始时间">
+        <el-date-picker v-model="newAssignmentInfo.startTime" type="datetime" placeholder="截止时间" style="width: 180px"/>
+      </el-form-item>
+      <el-form-item label="截止时间">
+        <el-date-picker v-model="newAssignmentInfo.endTime" type="datetime" placeholder="截止时间" style="width: 180px"/>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="dialogConfig.visible = false; cleanNewAssignmentInfo()">取消</el-button>
+        <el-button type="primary" @click="handleSubmit">确定</el-button>
+      </div>
+    </template>
+  </el-dialog>
+  <ViewsWordEditor :alert="alertProps" :docxInfo="docxInfo"></ViewsWordEditor>
 </template>
 
 
 <script lang="ts" setup>
-import {defineProps, onMounted} from 'vue';
-  import type {IAssignmentTableColumn, IAssignmentTableItem} from "@/types/vo";
-import router from "@/router";
+import {defineProps, inject, onMounted, reactive, ref} from 'vue';
+  import type {AssignmentVO, IAssignmentTableColumn, IAssignmentTableItem} from "@/types/vo";
+  import router from "@/router";
+  import type {AssignmentDTO} from "@/types/dto";
+  import useApis from "@/apis";
+  import {ElNotification} from "element-plus";
+  import {useFormatDate} from "@/hooks/useFormatDate";
+  import assignment from "@/apis/assignment";
+import ViewsWordEditor from "@/components/ViewsWordEditor/ViewsWordEditor.vue";
 
   const props = defineProps<{
     tableData: IAssignmentTableItem[],
     columns: IAssignmentTableColumn[],
-    role: string
+    role: string,
+    courseId: number,
+    isShowNewHomework: boolean
   }>()
 
+  const apis = useApis()
+  const doRefresh:Function = inject("reload")
+  const {formatDate} = useFormatDate()
+
+  const dialogConfig = reactive({
+    type: "",
+    visible: false,
+    title: "",
+    disable: false
+  })
+
+  const changeDialog = (type:string)=>{
+    dialogConfig.visible=true;
+    switch (type){
+      case "add": {
+        dialogConfig.type="add";
+        dialogConfig.disable=false;
+        dialogConfig.title="新增作业";
+        break;
+      }
+      case "edit": {
+        dialogConfig.type="edit";
+        dialogConfig.disable=false;
+        dialogConfig.title="编辑作业";
+        break;
+      }
+    }
+  }
+
+  let open = ref(false)
+
+  const alertProps = reactive({
+    open: open.value,
+    onOk: () => (open.value = false),
+    onCancel: () => (open.value = false),
+  });
+
+  const docxInfo = reactive({
+    docxUrl: null,
+    docxTitle: null,
+  });
+
+const openEditor = (url: string, title: string) => {
+  open.value = true;
+  Object.assign(alertProps, {
+    open: open.value,
+    // onOk: () => (open.value = false),
+    onCancel: () => {
+      open.value = false
+      Object.assign(alertProps,{
+        open: open.value,
+        onOk: () => (open.value = false),
+        onCancel: () => (open.value = false),
+      })
+      Object.assign(docxInfo, {
+        docxUrl: url,
+        docxTitle: title,
+      })
+    },
+  })
+  Object.assign(docxInfo, {
+    docxUrl: url,
+    docxTitle: title,
+  })
+};
+
+  let newAssignmentInfo = reactive<AssignmentDTO>({
+    assignmentName: '',
+    description: '',
+    descriptionFile: '',
+    attachments: [''],
+    startTime: '',
+    endTime: ''
+  })
+
+  const cleanNewAssignmentInfo = () => {
+    Object.assign(newAssignmentInfo, {
+      assignmentName: '',
+      description: '',
+      descriptionFile: '',
+      attachments: [''],
+      startTime: '',
+      endTime: ''
+    })
+  }
+
+  const setNewAssignmentInfo = (assignment: AssignmentVO) => {
+    Object.assign(newAssignmentInfo, {
+      assignmentName: assignment.assignmentName,
+      description: assignment.description,
+      descriptionFile: assignment.descriptionFile,
+      attachments: assignment.attachments,
+      startTime: assignment.startTime,
+      endTime: assignment.endTime
+    })
+  }
+
+  // 用于记录当前编辑的作业的id
+  let IAssignmentId = ref(0)
+  const handleFunctionButton = (assignmentId:number) => {
+    if(props.role == 'student'){
+      handleWriting(assignmentId)
+    } else if(props.role == 'teachers'){
+      apis.getAssignmentById(assignmentId)
+          .then((res:any) => {
+            setNewAssignmentInfo(res.data.data)
+            IAssignmentId.value = res.data.data.assignmentId
+          })
+      changeDialog('edit')
+    }
+  }
+
   const handleWriting = (assignmentId:number) => {
     router.push(`/home/assignment/${assignmentId}/edit`);
     // Location.reload()
   }
 
+
+  const handleSubmit = () => {
+    newAssignmentInfo.endTime = formatDate(newAssignmentInfo.endTime);
+    newAssignmentInfo.startTime = formatDate(newAssignmentInfo.startTime);
+    if(dialogConfig.type === 'add'){
+      apis.createAssignment(props.courseId, newAssignmentInfo)
+          .then((res) => {
+            if(res.data.code===200) {
+              ElNotification({
+                title: '新增成功',
+                type: 'success',
+              })
+            }else {
+              ElNotification({
+                title: '新增失败',
+                type: 'error',
+              })
+            }
+            dialogConfig.visible = false
+            cleanNewAssignmentInfo()
+
+          })
+          .catch((err) => {
+            console.log(err)
+          })
+    } else if(dialogConfig.type === 'edit'){
+      apis.updateAssignment(IAssignmentId.value, newAssignmentInfo)
+          .then((res:any) => {
+            if(res.data.code===200) {
+              ElNotification({
+                title: '修改成功',
+                type: 'success',
+              })
+            }else {
+              ElNotification({
+                title: '修改失败',
+                type: 'error',
+              })
+            }
+            dialogConfig.visible = false
+            cleanNewAssignmentInfo()
+          })
+          .catch((err) => {
+            console.log(err)
+          })
+    }
+    doRefresh();
+  }
+
   onMounted(() => {
     console.log(props)
   })

src/views/CourseSquare/component/CourseDetails/index.vue

@@ -42,35 +42,42 @@
             </div>
           </template>
           <template v-else>
-            <CourseHomeworkTable :columns="columns" :tableData="homeworkList" :role="role"/>
+            <CourseHomeworkTable :columns="columns" :tableData="homeworkList" :role="role" :courseId="dataForm.courseId" :isShowNewHomework="showEdit && role == 'teachers'"/>
           </template>
         </el-tab-pane>
       </el-tabs>
     </div>
   </div>
 
-  <el-dialog v-model="visible">
-    <el-form :model="dataForm">
+  <el-dialog v-model="visible" title="编辑课程">
+    <el-form :model="newCourseInfo">
+<!--      <el-form-item label="课程图片">-->
       <el-form-item label="课程名称">
-        <el-input v-model="dataForm.courseName" placeholder="请输入名称"></el-input>
+        <el-input v-model="newCourseInfo.courseName" placeholder="请输入名称"></el-input>
       </el-form-item>
       <el-form-item label="面向年级">
-        <el-input v-model="dataForm.targetGrade" placeholder="请输入年级"></el-input>
+        <el-input v-model="newCourseInfo.targetGrade" placeholder="请输入年级"></el-input>
       </el-form-item>
       <el-form-item label="描述">
-        <el-input v-model="dataForm.description" placeholder="请输入描述"></el-input>
+        <el-input v-model="newCourseInfo.description" placeholder="请输入描述"></el-input>
+      </el-form-item>
+      <el-form-item label="课程图片">
+        <el-input v-model="newCourseInfo.courseImages[0]" placeholder="请输入图片链接"></el-input>
       </el-form-item>
       <el-form-item label="开始时间">
-        <el-date-picker v-model="dataForm.startTime" type="datetime" placeholder="截止时间" style="width: 180px"/>
+        <el-date-picker v-model="newCourseInfo.startTime" type="datetime" placeholder="截止时间" style="width: 180px"/>
       </el-form-item>
       <el-form-item label="截止时间">
-        <el-date-picker v-model="dataForm.endTime" type="datetime" placeholder="截止时间" style="width: 180px"/>
+        <el-date-picker v-model="newCourseInfo.endTime" type="datetime" placeholder="截止时间" style="width: 180px"/>
+      </el-form-item>
+      <el-form-item label="选课码">
+        <el-input v-model="newCourseInfo.enrollCode" placeholder="请输入选课码"></el-input>
       </el-form-item>
     </el-form>
     <template #footer>
       <div class="dialog-footer">
         <el-button @click="visible = false">取消</el-button>
-        <el-button type="primary" >确定</el-button>
+        <el-button type="primary" @click="handleSubmit">确定</el-button>
       </div>
     </template>
   </el-dialog>
@@ -78,7 +85,7 @@
 
 <script setup lang="ts">
 import {onMounted, reactive, ref} from 'vue';
-import {ElTabs, ElTabPane, ElTable, ElTableColumn, ElAvatar, ElMessage} from 'element-plus';
+import {ElTabs, ElTabPane, ElTable, ElTableColumn, ElAvatar, ElMessage, ElNotification} from 'element-plus';
 import './index.scss'
 import type {CourseVO, IAssignment, IAssignmentTableColumn, IAssignmentTableItem} from "@/types/vo";
 import {useRoute} from "vue-router";
@@ -86,7 +93,8 @@ import useApis from "@/apis";
 import CourseHomeworkTable from "@/views/CourseSquare/component/CourseDetails/component/CourseHomeworkTable.vue";
 import type {AssignmentQuery} from "@/types/query";
 import {useStore} from "@/store";
-import type {EnrollDTO} from "@/types/dto";
+import type {CourseUpdateDTO, EnrollDTO} from "@/types/dto";
+import {useFormatDate} from "@/hooks/useFormatDate";
 
 const apis = useApis()
 const store = useStore()
@@ -104,8 +112,8 @@ let visible = ref(false)
 let dataForm = reactive<CourseVO>({
   courseId: null,
   courseName: '',
-  teacherIds: null,
-  courseImages: null,
+  teacherIds: [],
+  courseImages: [''],
   targetGrade: '',
   startTime: '',
   endTime: '',
@@ -113,6 +121,17 @@ let dataForm = reactive<CourseVO>({
   description: '',
 })
 
+let newCourseInfo = reactive<CourseUpdateDTO>({
+  courseName: '',
+  teacherIds: [],
+  courseImages: [''],
+  targetGrade: '',
+  startTime: '',
+  endTime: '',
+  description: '',
+  enrollCode: '',
+})
+
 //用于查询课程包含的作业
 let query = reactive<AssignmentQuery>({
   assignmentId:null,
@@ -160,7 +179,7 @@ const getCourse = () => {
       .then((res: any) => {
         let data = res.data.data.records[0]
         Object.assign(dataForm, {...data})
-        console.log(dataForm)
+        getNewCourseInfo(dataForm)
       })
       .catch((err: any) => {
         console.error(err);
@@ -168,11 +187,31 @@ const getCourse = () => {
       .finally(() => {});
 }
 
+const getNewCourseInfo = (dataForm: CourseVO) => {
+  Object.assign(newCourseInfo, {
+    courseName: dataForm.courseName,
+    teacherIds: dataForm.teacherIds,
+    courseImages: dataForm.courseImages,
+    targetGrade: dataForm.targetGrade,
+    startTime: dataForm.startTime,
+    endTime: dataForm.endTime,
+    description: dataForm.description,
+    enrollCode: ''
+  })
+}
+
 const getHomeworkList = () => {
   apis.getAssignmentByQuery(query)
       .then((res: any) => {
         let data = res.data.data.records
         homeworkList.value = convertHomeworkList(data)
+        // TODO
+        for(let i = 0; i < data.length; i++){
+          apis.findUserById(data[i].teacherId)
+              .then((res: any) => {
+                data[i].teacherId = res.data.data.records[0].name
+              })
+        }
       })
       .catch((err: any) => {
         console.error(err);
@@ -182,7 +221,7 @@ const getHomeworkList = () => {
 }
 
 /*
-  是否显示选课码输入框选课
+  学生，是否显示选课码输入框选课
  */
 const isShowCode = () => {
   apis.getCourseByStudentId(store.user.id)
@@ -208,7 +247,7 @@ let enrollDTO = reactive<EnrollDTO>({
 })
 
 /*
-  加入课程
+  学生，加入课程
  */
 const enroll = () => {
   enrollDTO.enrollCode = enrollCode.value
@@ -230,7 +269,7 @@ const enroll = () => {
 }
 
 /*
-  是否显示编辑课程
+  教师，是否显示编辑课程按钮
  */
 const isShowEdit = () => {
   apis.getCourseByTeacherId(store.user.id)
@@ -250,7 +289,7 @@ const isShowEdit = () => {
 }
 
 /*
-  将后端传来的数据进行整形，便于前端展示
+  将后端传来的作业数据进行整形，便于前端展示
  */
 const convertHomeworkList = (data:IAssignment[]) => {
   let newHomeworkList: IAssignmentTableItem[] = ([])
@@ -258,15 +297,54 @@ const convertHomeworkList = (data:IAssignment[]) => {
     let item:IAssignmentTableItem = {
       desc: data[i].assignmentName,
       publisher: data[i].teacherId.toString(),
-      startDate: data[i].startTime,
-      endDate: data[i].endTime,
-      assignmentId: data[i].assignmentId
+      startDate: formatDate(data[i].startTime),
+      endDate: formatDate(data[i].endTime),
+      assignmentId: data[i].assignmentId,
+      descriptionFile: data[i].descriptionFile != null ? data[i].descriptionFile: null
     }
     newHomeworkList.push(item)
   }
   return newHomeworkList
 }
 
+/*
+  时间格式转换方法
+   */
+function formatDate(date:string) {
+  const d = new Date(date);
+  const year = d.getFullYear();
+  const month = String(d.getMonth() + 1).padStart(2, '0');
+  const day = String(d.getDate()).padStart(2, '0');
+  const hours = String(d.getHours()).padStart(2, '0');
+  const minutes = String(d.getMinutes()).padStart(2, '0');
+  const seconds = String(d.getSeconds()).padStart(2, '0');
+  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+}
+
+const handleSubmit = () => {
+  newCourseInfo.endTime = formatDate(newCourseInfo.endTime)
+  newCourseInfo.startTime = formatDate(newCourseInfo.startTime)
+  apis.updateCourse(dataForm.courseId, newCourseInfo)
+    .then((res:any) => {
+      if(res.data.code===200) {
+        ElNotification({
+          title: '修改成功',
+          type: 'success',
+        })
+        visible.value = false
+      }else {
+        ElNotification({
+          title: '修改失败',
+          type: 'error',
+        })
+        visible.value = false
+      }
+    })
+    .catch((err) => {
+      console.log(err)
+    })
+}
+
 onMounted(() => {
   getCourse()
   getHomeworkList()

src/views/Home/Role.vue

@@ -5,7 +5,7 @@
 -->
 <template>
   <div class="home-container">
-    <router-view></router-view>
+    <router-view v-if="isRouterAlive"></router-view>
   </div>
 </template>
 
@@ -13,12 +13,24 @@
   import './role.scss'
   import {useStore} from "@/store";
   import emitter from "@/utils/emitter";
-  import {onUnmounted, ref} from "vue";
+  import {nextTick, onUnmounted, provide, ref} from "vue";
   import router from "@/router";
 
   const store = useStore()
   const role:'teachers' | 'student' = store.user.role === 'STUDENT' ?   'student':'teachers';
 
+  // 整体用于刷新数据
+  const isRouterAlive = ref(true);
+  const reload = ()=>{
+    isRouterAlive.value = false;
+    console.log("刷新前")
+    nextTick(()=>{
+      isRouterAlive.value = true;
+      console.log("刷新后")
+    });
+  };
+  provide("reload",reload);
+
   const changePage = (value: string) => {
     console.log(role)
     if(role == 'student'){

src/views/HomeworkPage/index.vue

@@ -4,8 +4,8 @@
   Created Date: 2024-7-3
 -->
 <template>
-  <el-card style="margin: 10px auto 0;height: 625px; width: 80%" shadow="never">
-    <el-button :icon="Refresh" circle></el-button>
+  <el-card style="margin: 10px auto 0;height: 90vh; width: 80%" shadow="never">
+    <el-button :icon="Refresh" circle @click="doRefresh"></el-button>
     <el-select
         v-model="state"
         placeholder="状态"
@@ -19,97 +19,143 @@
           :value="item.value"
       />
     </el-select>
-    <el-select
-        v-model="state"
-        placeholder="课程"
-        size="default"
-        style="width: 150px; margin-left: 10px;"
-    >
-      <el-option
-          v-for="item in stateOptions"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-      />
-    </el-select>
+    <el-input v-model="assignmentName" placeholder="请输入作业名称" clearable style="width: 180px;"/>
+    <el-button @click="handleSearch" color="#597D3B">
+      <el-icon style="margin-right: 3px" ><Search/></el-icon>
+      查询
+    </el-button>
 
-    <el-table :data="homeworkList.tableData" style="width: 100%; height: 100%">
+    <el-table :data="pageInfo.tableData" style="width: 100%" height="80vh">
+      <template #empty>
+        暂无作业
+      </template>
       <el-table-column type="index"/>
       <el-table-column prop="assignmentName" label="课程名称"/>
       <el-table-column prop="description" label="描述"/>
       <el-table-column prop="endTime" label="截止时间" sortable/>
       <el-table-column prop="status" label="状态" sortable/>
-      <el-table-column>
+      <el-table-column label="操作">
         <template #default="scope">
-          <el-button text @click="handleShowDetail(scope.row.assignmentId)" style="margin-right: 0; margin-left: 0;padding-left: 5px; padding-right: 5px">
+          <el-button @click="handleShowDetail(scope.row.assignmentId)" style="margin-right: 0; margin-left: 0;padding-left: 10px; padding-right: 10px" color="#597D3B">
             <el-icon style="margin-right: 3px"><ZoomIn/></el-icon>
             详情
           </el-button>
         </template>
       </el-table-column>
     </el-table>
+
+    <el-pagination
+        small
+        style="font-size: 16px;margin-top: 10px;margin-left: 450px"
+        @current-change="handleCurrentChange"
+        :current-page="pageInfo.pages"
+        :page-size="pageInfo.size"
+        layout="total, prev, pager, next, jumper"
+        :total="pageInfo.total">
+    </el-pagination>
   </el-card>
 </template>
 
 <script lang="ts" setup>
-import {Refresh, ZoomIn} from "@element-plus/icons-vue";
-import {onMounted, reactive, ref} from "vue";
-import useApis from "@/apis";
-import {useStore} from "@/store";
-import type {CourseVO, IAssignment} from "@/types/vo";
-import router from "@/router";
-
-const apis = useApis()
-const store = useStore()
-const role:'teachers' | 'student' = store.user.role === 'STUDENT' ?   'student':'teachers';
-
-let homeworkList = reactive<{
-  tableData: IAssignment[]
-}>({
-  tableData: []
-})
-
-const handleShowDetail = (assignmentId:number) => {
-  router.push(`/home/homeworkDetail/${assignmentId}`)
+  import {Refresh, ZoomIn, Search} from "@element-plus/icons-vue";
+  import {inject, onMounted, reactive, ref} from "vue";
+  import useApis from "@/apis";
+  import {useStore} from "@/store";
+  import type {CourseVO, IAssignment} from "@/types/vo";
+  import router from "@/router";
+  import {type AssignmentQueryDTO, AssignmentStatus} from "@/types/dto";
+  import assignment from "@/apis/assignment";
 
-}
+  const apis = useApis()
+  const store = useStore()
+  const doRefresh:Function = inject("reload")
+  const role:'teachers' | 'student' = store.user.role === 'STUDENT' ?   'student':'teachers';
 
-const fetchHomeworkListByCourseId = (courseId:number) => {
-  apis.getAssignmentByCourseId(courseId)
-      .then((res: any) => {
-        let data = res.data.data.records
-        for(let i = 0; i < data.length; i++) {
-          homeworkList.tableData.push(data[i])
-        }
-      })
-      .catch((err: any) => {
-        console.error(err);
-      })
-      .finally(() => {
-      });
-}
+  // 获取的所有作业
+  let homeworkList = reactive<{
+    tableData: IAssignment[]
+  }>({
+    tableData: []
+  })
 
-const fetchHomeworkListByUserId = () => {
-  if (role === 'student') {
-    apis.getCourseByStudentId(store.user.id)
-        .then((res: any) => {
-          let data:CourseVO[] = res.data.data.records
-          for(let i = 0; i < data.length; i++){
-            fetchHomeworkListByCourseId(data[i].courseId)
-          }
-        })
-        .catch((err: any) => {
-          console.error(err);
-        })
-        .finally(() => {
-        });
-  } else if (role === "teachers") {
-    apis.getCourseByTeacherId(store.user.id)
+  // 符合查询条件的作业
+  let processedHomeworkList = reactive<{
+    tableData: IAssignment[],
+  }>({
+    tableData: [],
+  })
+
+  // 最终展示的作业
+  let pageInfo = reactive<{
+    tableData: IAssignment[],
+    size: number, // 分页大小
+    pages: number, // 总页数
+    total: number
+  }>({
+    tableData: [],
+    size: 10,
+    pages: 1,
+    total: null,
+  })
+
+  const handleShowDetail = (assignmentId:number) => {
+    router.push(`/home/homeworkDetail/${assignmentId}`)
+
+  }
+
+  const handleCurrentChange = (pageNum: number) => {
+    Object.assign(pageInfo, {
+      tableData: getSlice(pageNum),
+      size: 10,
+      pages: pageNum,
+      total: processedHomeworkList.tableData.length,
+    })
+  }
+
+  const fetchHomeworkListByUserId = () => {
+    if (role === 'student') {
+      apis.getCourseByStudentId(store.user.id)
+          .then((res: any) => {
+            let data:CourseVO[] = res.data.data.records
+            for(let i = 0; i < data.length; i++){
+              fetchHomeworkListByCourseId(data[i].courseId)
+            }
+          })
+          .catch((err: any) => {
+            console.error(err);
+          })
+          .finally(() => {
+          });
+    } else if (role === "teachers") {
+      apis.getCourseByTeacherId(store.user.id)
+          .then((res: any) => {
+            let data:CourseVO[] = res.data.data.records
+            for(let i = 0; i < data.length; i++){
+              fetchHomeworkListByCourseId(data[i].courseId)
+            }
+          })
+          .catch((err: any) => {
+            console.error(err);
+          })
+          .finally(() => {
+          });
+    }
+  }
+
+  const fetchHomeworkListByCourseId = (courseId:number) => {
+    apis.getAssignmentByCourseId(courseId)
         .then((res: any) => {
-          let data:CourseVO[] = res.data.data.records
-          for(let i = 0; i < data.length; i++){
-            fetchHomeworkListByCourseId(data[i].courseId)
+          let data = res.data.data.records
+          for(let i = 0; i < data.length; i++) {
+            homeworkList.tableData.push(data[i])
           }
+          processedHomeworkList.tableData = homeworkList.tableData
+          Object.assign(pageInfo, {
+            tableData: getSlice(1),
+            size: 10,
+            pages: 1,
+            total: processedHomeworkList.tableData.length,
+          })
         })
         .catch((err: any) => {
           console.error(err);
@@ -117,29 +163,73 @@ const fetchHomeworkListByUserId = () => {
         .finally(() => {
         });
   }
-}
 
-onMounted(() => {
-  fetchHomeworkListByUserId()
-  console.log(homeworkList)
-})
-
-// TODO:状态选择
-let state = ref(null)
-const stateOptions = [
-  {
-    value: 0,
-    label: "已提交"
-  },
-  {
-    value: 1,
-    label: "未提交"
-  },
-  {
-    value: 2,
-    label: "已截止"
-  },
-]
+  // let options = reactive({
+  //     listData:[]
+  // })
+  // let loading = ref(false)
+  // const HomeworkListRemoteMethod = (query:string) => {
+  //   options.listData = [];
+  //   if (query) {
+  //     loading.value = true;
+  //     homeworkList.tableData.filter((item) => {
+  //       if(item.assignmentName.includes(query)){
+  //         options.listData.push({
+  //           value: item.assignmentId,
+  //           label: item.assignmentName
+  //         })
+  //       }
+  //     })
+  //     loading.value = false;
+  //     console.log(options.listData)
+  //   }
+  // }
+
+  const handleSearch = () => {
+    processedHomeworkList.tableData = []
+    for(let i = 0; i < homeworkList.tableData.length; i++){
+      let assignmentItem = homeworkList.tableData[i]
+      let input = true;
+      if(state.value != null && state.value != assignmentItem.status) input = false;
+      if(assignmentName.value != '' && !assignmentItem.assignmentName.includes(assignmentName.value)) input = false;
+      if(input) processedHomeworkList.tableData.push(assignmentItem);
+      Object.assign(pageInfo, {
+        tableData: getSlice(1),
+        size: 10,
+        pages: 1,
+        total: processedHomeworkList.tableData.length,
+      })
+    }
+  }
+
+  //用于分页展示，截取数据
+  const getSlice = (page: number) => {
+    return processedHomeworkList.tableData.slice(page - 1, page + 10 - 1)
+  }
+
+  onMounted(() => {
+    fetchHomeworkListByUserId()
+    console.log(homeworkList)
+  })
+
+  let state = ref(null)
+  const stateOptions = [
+    {
+      value: AssignmentStatus.NOT_STARTED,
+      label: "未发布"
+    },
+    {
+      value: AssignmentStatus.PROCEEDING,
+      label: "进行中"
+    },
+    {
+      value: AssignmentStatus.FINISHED,
+      label: "已截止"
+    },
+  ]
+
+  let assignmentName = ref('')
+
 </script>
 
 <script lang="ts">