登录按钮有问题，导出功能未实现

src/services/meetingService.js

@@ -1,7 +1,5 @@
 import axios from 'axios';
 
-//const API_URL = 'http://localhost:8080/meetings';
-
 class MeetingService {
     getAllMeetings() {
         return axios.get(`/api/meetings/listAll`);
@@ -17,14 +15,28 @@ class MeetingService {
     }
 
     updateMeeting(id, meeting) {
-        // 使用 POST 方法而不是 PUT 方法
+        // Convert meeting object to a map
-        return axios.post(`/api/meetings/updateMeeting`, meeting);
+        const meetingMap = {
+            id: id,
+            name: meeting.name,
+            organizer: meeting.organizer,
+            startTime: meeting.startTime,
+            endTime: meeting.endTime,
+            content: meeting.content,
+            status: meeting.status
+        };
+        return axios.post(`/api/meetings/updateMeeting`, meetingMap);
     }
 
     deleteMeeting(id) {
         // 使用 POST 方法并传递请求体
         return axios.post(`/api/meetings/deleteMeeting`, { id });
     }
+
+    searchMeetings(params) {
+        // 使用 POST 方法并传递请求体
+        return axios.post(`/api/meetings/searchMeetings`, params);
+    }
 }
 
 export default new MeetingService();

src/store/meetingManagement.js

@@ -23,6 +23,14 @@ const actions = {
             console.error('Failed to fetch meetings:', error);
         }
     },
+    async searchMeetings({ commit }, params) {
+        try {
+            const response = await MeetingService.searchMeetings(params);
+            commit('setMeetings', response.data);
+        } catch (error) {
+            console.error('Failed to search meetings:', error);
+        }
+    },
     async fetchMeetingById({ commit }, id) {
         try {
             const response = await MeetingService.getMeetingById(id);

src/views/meeting-management/MeetingManagement.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="meeting-management">
     <div class="header">
+      <el-input v-model="searchName" placeholder="会议名称" class="search-input"></el-input>
+      <el-input v-model="searchOrganizer" placeholder="创建人" class="search-input"></el-input>
+      <el-date-picker v-model="searchStartTime" type="datetime" placeholder="开始时间" class="search-input"></el-date-picker>
+      <el-button type="primary" @click="searchMeetings">搜索</el-button>
+      <el-button type="primary" @click="exportMeetings">导出会议</el-button>
       <el-button type="primary" @click="goToAddMeeting">添加会议</el-button>
     </div>
     <el-table :data="allMeetings" style="width: 100%">
@@ -24,13 +29,15 @@
         :page-sizes="[10, 20, 30, 40]"
         :page-size="pageSize"
         layout="total, sizes, prev, pager, next, jumper"
-        :total="total">
+        :total="total"
-    </el-pagination>
+    ></el-pagination>
   </div>
 </template>
 
 <script>
 import { mapActions, mapGetters } from 'vuex';
+import axios from 'axios';
+import MeetingService from "@services/meetingService.js";
 
 export default {
   name: 'MeetingManagement',
@@ -38,14 +45,17 @@ export default {
     return {
       currentPage: 1,
       pageSize: 10,
-      total: 0
+      total: 0,
+      searchName: '',
+      searchOrganizer: '',
+      searchStartTime: null
     };
   },
   computed: {
     ...mapGetters('meetingManagement', ['allMeetings'])
   },
   methods: {
-    ...mapActions('meetingManagement', ['fetchMeetings', 'deleteMeeting']),
+    ...mapActions('meetingManagement', ['fetchMeetings', 'searchMeetings', 'deleteMeeting']),
     goToAddMeeting() {
       this.$router.push({ name: 'AddMeeting' });
     },
@@ -53,15 +63,21 @@ export default {
       this.$router.push({ name: 'EditMeeting', params: { id } });
     },
     confirmDelete(id) {
-      this.$confirm('是否确认删除会议管理编号为 "' + id + '" 的数据项?', '系统提示', {
+      this.$confirm(
-        confirmButtonText: '确定',
+          '是否确认删除会议管理编号为 "' + id + '" 的数据项?',
-        cancelButtonText: '取消',
+          '系统提示',
-        type: 'warning'
+          {
-      }).then(() => {
+            confirmButtonText: '确定',
-        this.deleteMeeting(id).then(() => {
+            cancelButtonText: '取消',
-          this.fetchMeetings();
+            type: 'warning'
-        });
+          }
-      }).catch(() => {});
+      )
+          .then(() => {
+            this.deleteMeeting(id).then(() => {
+              this.fetchMeetings();
+            });
+          })
+          .catch(() => {});
     },
     handleSizeChange(val) {
       this.pageSize = val;
@@ -70,6 +86,37 @@ export default {
     handleCurrentChange(val) {
       this.currentPage = val;
       this.fetchMeetings();
+    },
+    searchMeetings() {
+      const params = {
+        name: this.searchName,
+        organizer: this.searchOrganizer,
+        startTime: this.searchStartTime ? this.searchStartTime.toISOString() : null
+      };
+      MeetingService.searchMeetings(params);
+    },
+    exportMeetings() {
+      axios
+          .post(
+              '/api/meetings/export',
+              {
+                name: this.searchName,
+                organizer: this.searchOrganizer,
+                startTime: this.searchStartTime ? this.searchStartTime.toISOString() : null
+              },
+              { responseType: 'blob' }
+          )
+          .then(response => {
+            const url = window.URL.createObjectURL(new Blob([response.data]));
+            const link = document.createElement('a');
+            link.href = url;
+            link.setAttribute('download', 'meetings.xlsx');
+            document.body.appendChild(link);
+            link.click();
+          })
+          .catch(error => {
+            console.error('导出失败', error);
+          });
     }
   },
   mounted() {
@@ -84,39 +131,29 @@ export default {
   background-color: #f5f5f5;
   border-radius: 8px;
 }
-
 .header {
   display: flex;
   justify-content: flex-end;
   margin-bottom: 20px;
 }
-
+.search-input {
+  margin-right: 10px;
+}
 .el-button {
-  background-color: #409eff;
+  margin-right: 10px;
-  border-color: #409eff;
-  color: #fff;
 }
-
-.el-button:hover {
-  background-color: #66b1ff;
-  border-color: #66b1ff;
-}
-
 .el-table {
   background-color: #fff;
   border-radius: 8px;
   overflow: hidden;
 }
-
 .el-pagination {
   margin-top: 20px;
   text-align: center;
 }
-
 .delete-button {
   color: #f56c6c;
 }
-
 .delete-button:hover {
   color: #ff7875;
 }