表格样式修改第三次，以及全部记录显示状态功能完成

src/components/examine.vue

@@ -34,7 +34,7 @@
 
       <!-- 待审核的数据 -->
       <div v-if="isPending">
-        <el-table :data="currentTableData" border style="width: 100%; background-color: white;"
+        <el-table :data="currentTableData" stripe border 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="400">
@@ -63,19 +63,19 @@
 
       <!-- 已通过的数据 -->
       <div v-if="isApproved">
-        <el-table :data="currentApprovedData" border style="width: 100%; background-color: white;"
+        <el-table :data="currentApprovedData" stripe border style="width: 100%; background-color: white;"
           @selection-change="handleApprovedSelectionChange">
           <el-table-column type="selection" width="50" />
-          <el-table-column prop="company" label="组织名称" width="200">
+          <el-table-column prop="company" label="组织名称" width="350">
             <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
+          <el-table-column prop="phone" label="电话/邮箱" width="350" />
+          <el-table-column prop="name" label="姓名" width="350" show-overflow-tooltip
             :label-class-name="'address-column'" />
-          <el-table-column prop="submission_time" label="提交时间" width="200" />
-          <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">
+          <el-table-column prop="submission_time" label="提交时间" width="331" />
+          <el-table-column prop="remarks" label="备注" width="300" />
+          <el-table-column prop="Pending_time" label="审核时间" width="300" />
+          <el-table-column prop="open_organization" label="开通组织" width="300">
             <template slot="default" slot-scope="scope">{{ scope.row.open_organization }}</template>
           </el-table-column>
         </el-table>
@@ -87,19 +87,19 @@
 
       <!-- 已拒绝的数据 -->
       <div v-if="isRefused">
-        <el-table :data="currentRefusedData" border style="width: 100%; background-color: white;"
+        <el-table :data="currentRefusedData" stripe border style="width: 100%; background-color: white;"
           @selection-change="handleRefusedSelectionChange">
           <el-table-column type="selection" width="50" />
-          <el-table-column prop="company" label="组织名称" width="200">
+          <el-table-column prop="company" label="组织名称" width="320">
             <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
+          <el-table-column prop="phone" label="电话/邮箱" width="330" />
+          <el-table-column prop="name" label="姓名" width="350" show-overflow-tooltip
             :label-class-name="'address-column'" />
-          <el-table-column prop="submission_time" label="提交时间" width="200" />
-          <el-table-column prop="remarks" label="备注" width="180" />
-          <el-table-column prop="Pending_time" label="审核时间" width="200" />
-          <el-table-column label="操作" width="195">
+          <el-table-column prop="submission_time" label="提交时间" width="300" />
+          <el-table-column prop="remarks" label="备注" width="350" />
+          <el-table-column prop="Pending_time" label="审核时间" width="350" />
+          <el-table-column label="操作" width="283">
             <template slot-scope="{ row }">
               <button @click="ajax__move_to_pending_from_rejected(row.userid, row.companyNumber)"
                 style="color: #308fff; background: none; border: none; cursor: pointer; margin-left: 25px;">移动至待审核</button>
@@ -114,24 +114,27 @@
 
       <!-- 全部记录的数据 -->
       <div v-if="isAll">
-        <el-table :data="currentAllData" border style="width: 100%; background-color: white;"
+        <el-table :data="currentAllData" stripe border style="width: 100%; background-color: white;"
           @selection-change="handleAllSelectionChange">
           <el-table-column type="selection" width="50" />
-          <el-table-column prop="company" label="组织名称" width="200">
+          <el-table-column prop="company" label="组织名称" width="350">
             <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
+          <el-table-column prop="phone" label="电话/邮箱" width="350" />
+          <el-table-column prop="name" label="姓名" width="350" show-overflow-tooltip
             :label-class-name="'address-column'" />
-          <el-table-column prop="submission_time" label="提交时间" width="200" />
-          <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">
+          <el-table-column prop="submission_time" label="提交时间" width="300" />
+          <el-table-column prop="remarks" label="备注" width="350" />
+          <el-table-column prop="Pending_time" label="审核时间" width="300" />
+          <el-table-column label="操作" width="283" prop="status">
             <template slot="default" slot-scope="scope">
-              {{ getStatusText(scope.row.status) }}
-            </template>
-          </el-table-column>
-        </el-table>
+          <!-- 根据状态值显示不同颜色的按钮 -->
+          <el-button :type="getButtonType(scope.row.status)" :disabled="false" style="border-radius: 5px; padding: 4px 12px; font-size: 14px;">
+            {{ getStatusText(scope.row.status) }}
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
         <!-- 分页组件 -->
         <el-pagination :current-page="currentAllPage" :page-size="pageSize" :page-sizes="[5, 10, 25]"
           :total="AllData.length" @size-change="handlePageSizeChange" @current-change="handleAllPageChange"
@@ -208,18 +211,24 @@ export default {
     },
   },
   methods: {
-    // 根据状态值返回对应的文本
-    getStatusText(status) {
-      switch (status) {
-        case 0:
-          return '待审核';
-        case 1:
-          return '已通过';
-        case 2:
-          return '已拒绝';
-        default:
-          return '未知';
-      }
+     // 获取状态文本
+     getStatusText(status) {
+      const statusMap = {
+        0: "待审核",
+        1: "已通过",
+        2: "已拒绝"
+      };
+      return statusMap[status] || "未知状态"; 
+    },
+
+    // 获取状态对应的按钮类型
+    getButtonType(status) {
+      const typeMap = {
+        0: "primary",  // 待审核 -> 蓝色
+        1: "success",  // 已通过 -> 绿色
+        2: "danger",   // 已拒绝 -> 红色
+      };
+      return typeMap[status] || "default";  // 默认为默认按钮类型
     },
     // 多选框选择事件处理
     handleSelectionChange(selection) {
@@ -449,16 +458,30 @@ export default {
             ...approvedRes.data[0], // 已通过数据
             ...refusedRes.data[0],  // 已拒绝数据
           ];
-
-          this.AllData = AllData.map(user => ({
-            company: user.schoolName || '未知',
-            phone: user.contact_info || '未知',
-            name: user.name || '未知',
-            submission_time: user.create_at || '未知',
-            remarks: user.remark || '未知',
-            Pending_time: user.active_at || '未知', // 处理时间对应 update_time
-            // status: this.getStatusText(user.r_type), // 显示状态
-          }));
+          // 打印出整个 AllData 数据，查看是否有 r_type 字段
+          console.log("AllData:", AllData);
+
+        // // 确认每个 user 对象中是否有 r_type 字段
+        // AllData.forEach(user => {
+        //   console.log('user:', user);  // 打印 user 对象
+        //   console.log('r_type:', user.r_type);  // 确认 r_type 的值
+        // });
+
+            this.AllData = AllData.map(user => {
+              const status = user.type !== undefined && user.type !== null ? user.type : 0;  // 使用 type 替代 r_type
+              console.log('status:', status);  // 确保 status 被正确输出
+            // console.log('r_type:', user.r_type);  // 打印 r_type 的值以调试
+            return {
+              company: user.schoolName || '未知',
+              phone: user.contact_info || '未知',
+              name: user.name || '未知',
+              submission_time: user.create_at || '未知',
+              remarks: user.remark || '未知',
+              Pending_time: user.active_at || '未知',
+              status: status,  // 保持原始的数字状态值
+              userid: user.id || '未知',
+    };
+  });
 
           console.log(this.AllData);
         })
@@ -766,6 +789,11 @@ export default {
   height: 60px;
 }
 
+/* 自定义斑马线的背景色 */
+.el-table .success-row {
+  background-color: #f0f9eb;
+}
+
 .address-column {
   margin: 0;
   /* 调整边距 */