修改审核页面

src/components/examine.vue

@@ -20,14 +20,14 @@
         <div class="Search">
           <input type="text" placeholder="搜索记录" style="width: 120px; height: 40px; border-radius: 40px">
           <button class="search-button" @click="performSearch">
-            <!-- <img src="@/assets/搜索框.png" alt="搜索" class="search-icon" /> -->
+            <img src="@/assets/搜索框.png" alt="搜索" class="search-icon" />
           </button>
         </div>
       </div>
 
       <!-- 待审核的数据 -->
       <div v-if="isPending">
-        <el-table :data="currentTableData" style="width: 100%; background-color: white;">
+        <el-table :data="currentTableData" style="width: 100%; background-color: white;" @selection-change="handleSelectionChange">
           <el-table-column type="selection" width="50"></el-table-column>
           <el-table-column prop="company" label="组织名称" width="240">
             <template slot-scope="scope">{{ scope.row.company }}</template>
@@ -57,76 +57,70 @@
 
     <!-- 已通过的数据 -->
     <div v-if="isApproved">
-      <ElTable :data="currentApprovedData" style="width: 100%; background-color: white;">
-        <ElTableColumn type="selection" width="50" />
-        <ElTableColumn prop="company" label="组织名称" width="200">
-          <template #default="scope">{{ scope.row.company }}</template>
-        </ElTableColumn>
-        <ElTableColumn prop="phone" label="电话/邮箱" width="200" />
-        <ElTableColumn prop="name" label="姓名" width="200" show-overflow-tooltip :label-class-name="'address-column'" />
-        <ElTableColumn prop="submission_time" label="提交时间" width="180" />
-        <ElTableColumn prop="remarks" label="备注" width="180" />
-        <ElTableColumn prop="Pending_time" label="审核时间" width="200" />
-        <ElTableColumn prop="open_organization" label="开通组织" width="200">
-          <template #default="scope">{{ scope.row.open_organization }}</template>
-        </ElTableColumn>
-      </ElTable>
+      <el-table :data="currentApprovedData" style="width: 100%; background-color: white;"  @selection-change="handleApprovedSelectionChange">
+        <el-table-column type="selection" width="50" />
+        <el-table-column prop="company" label="组织名称" width="200">
+          <template slot="default" slot-scope="scope">{{ scope.row.company }}</template>
+        </el-table-column>
+        <el-table-column prop="phone" label="电话/邮箱" width="200" />
+        <el-table-column prop="name" label="姓名" width="200" show-overflow-tooltip :label-class-name="'address-column'" />
+        <el-table-column prop="submission_time" label="提交时间" width="180" />
+        <el-table-column prop="remarks" label="备注" width="180" />
+        <el-table-column prop="Pending_time" label="审核时间" width="200" />
+        <el-table-column prop="open_organization" label="开通组织" width="200">
+          <template slot="default" slot-scope="scope">{{ scope.row.open_organization }}</template>
+        </el-table-column>
+      </el-table>
       <!-- 分页组件 -->
-      <ElPagination :current-page="currentApprovedPage" :page-size="pageSize" :page-sizes="pageSizeOptions"
+      <el-pagination :current-page="currentApprovedPage" :page-size="pageSize" :page-sizes="pageSizeOptions"
         :total="approvedData.length" @size-change="handlePageSizeChange" @current-change="handleApprovedPageChange"
         layout="total,sizes,prev, pager, next, jumper" />
     </div>
 
-
-
     <!-- 已拒绝的数据 -->
     <div v-if="isRefused">
-      <ElTable :data="currentRefusedData" style="width: 100%; background-color: white;">
-        <ElTableColumn type="selection" width="50" />
-        <ElTableColumn prop="company" label="组织名称" width="200">
-          <template #default="scope">{{ scope.row.company }}</template>
-        </ElTableColumn>
-        <ElTableColumn prop="phone" label="电话/邮箱" width="200" />
-        <ElTableColumn prop="name" label="姓名" width="200" show-overflow-tooltip :label-class-name="'address-column'" />
-        <ElTableColumn prop="submission_time" label="提交时间" width="180" />
-        <ElTableColumn prop="remarks" label="备注" width="180" />
-        <ElTableColumn prop="Pending_time" label="审核时间" width="200" />
-        <ElTableColumn label="操作" width="200">
-          <template #default="scope">
-            <button @click="handleEdit(scope.row)"
-              style="color: #308fff; background: none; border: none; cursor: pointer; margin-left: 25px;">移动至待审核</button>
+      <el-table :data="currentRefusedData" style="width: 100%; background-color: white;"  @selection-change="handleRefusedSelectionChange">
+        <el-table-column type="selection" width="50" />
+        <el-table-column prop="company" label="组织名称" width="200">
+          <template slot="default" slot-scope="scope">{{ scope.row.company }}</template>
+        </el-table-column>
+        <el-table-column prop="phone" label="电话/邮箱" width="200" />
+        <el-table-column prop="name" label="姓名" width="200" show-overflow-tooltip :label-class-name="'address-column'" />
+        <el-table-column prop="submission_time" label="提交时间" width="180" />
+        <el-table-column prop="remarks" label="备注" width="180" />
+        <el-table-column prop="Pending_time" label="审核时间" width="200" />
+        <el-table-column label="操作" width="200">
+          <template slot="default" slot-scope="scope">
+            <button @click="handleEdit(scope.row)" style="color: #308fff; background: none; border: none; cursor: pointer; margin-left: 25px;">移动至待审核</button>
           </template>
-        </ElTableColumn>
-      </ElTable>
+        </el-table-column>
+      </el-table>
       <!-- 分页组件 -->
-      <ElPagination :current-page="currentRefusedPage" :page-size="pageSize" :page-sizes="pageSizeOptions"
+      <el-pagination :current-page="currentRefusedPage" :page-size="pageSize" :page-sizes="pageSizeOptions"
         :total="RefusedData.length" @size-change="handlePageSizeChange" @current-change="handleRefusedPageChange"
         layout="total,sizes,prev, pager, next, jumper" />
     </div>
 
-
-
-
     <!-- 全部记录的数据 -->
     <div v-if="isAll">
-      <ElTable :data="currentAllData" style="width: 100%; background-color: white;">
-        <ElTableColumn type="selection" width="50" />
-        <ElTableColumn prop="company" label="组织名称" width="200">
-          <template #default="scope">{{ scope.row.company }}</template>
-        </ElTableColumn>
-        <ElTableColumn prop="phone" label="电话/邮箱" width="200" />
-        <ElTableColumn prop="name" label="姓名" width="200" show-overflow-tooltip :label-class-name="'address-column'" />
-        <ElTableColumn prop="submission_time" label="提交时间" width="180" />
-        <ElTableColumn prop="remarks" label="备注" width="180" />
-        <ElTableColumn prop="Pending_time" label="审核时间" width="200" />
-        <ElTableColumn label="操作" width="200" prop="status">
-          <template #default="scope">
+      <el-table :data="currentAllData" style="width: 100%; background-color: white;"  @selection-change="handleAllSelectionChange">
+        <el-table-column type="selection" width="50" />
+        <el-table-column prop="company" label="组织名称" width="200">
+          <template slot="default" slot-scope="scope">{{ scope.row.company }}</template>
+        </el-table-column>
+        <el-table-column prop="phone" label="电话/邮箱" width="200" />
+        <el-table-column prop="name" label="姓名" width="200" show-overflow-tooltip :label-class-name="'address-column'" />
+        <el-table-column prop="submission_time" label="提交时间" width="180" />
+        <el-table-column prop="remarks" label="备注" width="180" />
+        <el-table-column prop="Pending_time" label="审核时间" width="200" />
+        <el-table-column label="操作" width="200" prop="status">
+          <template slot="default" slot-scope="scope">
             {{ getStatusText(scope.row.status) }}
           </template>
-        </ElTableColumn>
-      </ElTable>
+        </el-table-column>
+      </el-table>
       <!-- 分页组件 -->
-      <ElPagination :current-page="currentAllPage" :page-size="pageSize" :page-sizes="[5, 10, 25,]"
+      <el-pagination :current-page="currentAllPage" :page-size="pageSize" :page-sizes="[5, 10, 25]"
         :total="AllData.length" @size-change="handlePageSizeChange" @current-change="handleAllPageChange"
         layout="total,sizes,prev, pager, next, jumper" />
     </div>
@@ -214,6 +208,19 @@ export default {
           return '未知';
       }
     },
+    // 多选框选择事件处理
+    handleSelectionChange(selection) {
+      this.selectedPendingData = selection;
+    },
+    handleApprovedSelectionChange(selection) {
+      this.selectedApprovedData = selection;
+    },
+    handleRefusedSelectionChange(selection) {
+      this.selectedRefusedData = selection;
+    },
+    handleAllSelectionChange(selection) {
+      this.selectedAllData = selection;
+    },
     // 待审核的分页逻辑
     handlePageChange(page) {
       this.currentPage = page;
@@ -273,8 +280,10 @@ export default {
     toggleCompany(index) {
       this.showCompanyList[index] = !this.showCompanyList[index];
     },
+
     // 待审核
     showPending() {
+      console.log("Clicked Pending!");
       this.isPending = true;
       this.isApproved = false;
       this.isRefused = false;
@@ -282,6 +291,7 @@ export default {
     },
     // 已通过
     showApproved() {
+      console.log("Clicked Approved!");
       this.isPending = false;
       this.isApproved = true;
       this.isRefused = false;
@@ -289,6 +299,7 @@ export default {
     },
     // 已拒绝
     showRefused() {
+      // console.log("Clicked Refused!");
       this.isPending = false;
       this.isApproved = false;
       this.isRefused = true;
@@ -336,12 +347,6 @@ export default {
           })); // 将数据存储到 tableData 中
           // 打印映射后的用户信息
           console.log(this.tableData);
-          // this.$message({
-          //   message: "查询成功",
-          //   type: "success",
-          // });
-          // console.log("返回结果为：", res.data);  // 打印返回的查询结果
-          // this.tableData = res.data; // 将查询结果存储到 tableData 中
         })
         .catch((err) => {
           // 处理失败的响应
@@ -632,14 +637,9 @@ export default {
 </script>
 
 <style>
-body{
-  margin: 0px;
-  padding: 0px;
-}
 .content {
   width: 1410px;
-  position: relative;
-  /* 设置为相对定位，以便子元素可以绝对定位 */
+  /* position: relative; */
 }
 
 /* 搜索框容器样式 */