feat: 审核列表页面按钮增加权限控制

frontend/src/views/ReviewList.vue

@@ -7,7 +7,7 @@
                 <el-space class="action-bar-item-container action-bar-action-left">
                     <el-button-group class="ml-4">
                         <el-button type="primary" :icon="Refresh" @click="resetFilterAndRefreshTableList">刷新</el-button>
-                        <el-button type="primary" :icon="Box" @click="doBatchListing">批量上线</el-button>
+                        <el-button type="primary" :icon="Box" @click="doBatchListing" v-if="showBatchListing">批量上线</el-button>
                     </el-button-group>
                 </el-space>
                 <el-space class="action-bar-item-container action-bar-action-right">
@@ -56,14 +56,14 @@
         </el-header>
         <el-main>
             <el-table ref="spiderTable" :data="listState.list" stripe :row-style="getRowStyle" @selection-change="handleSelectionChange" v-loading="listState.loading">
-                <el-table-column type="selection" width="55" />
+                <el-table-column type="selection" width="55" :selectable="tableRowSelectable" v-if="isAdmin" />
                 <el-table-column prop="code" label="代码" align="center" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="site" label="网站" align="center" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="channel" label="栏目" align="center" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="stateText" label="爬虫状态" width="80" align="center" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="claimText" label="认领状态" width="100" align="center" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="href" label="栏目地址" show-overflow-tooltip></el-table-column>
-                <el-table-column prop="modifyuser" label="维护人" width="120" align="center" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="modifyuser" label="维护人" width="80" align="center" show-overflow-tooltip></el-table-column>
                 <el-table-column label="操作" width="160" align="center">
                     <template #default="scope">
                   <!-- <el-tooltip content="标注" placement="top">
@@ -90,33 +90,32 @@
                 </el-table-column>
                 <el-table-column label="功能" width="120" align="center">
                     <template #default="scope">
-                        <!-- 审核人员：打回和通过 -->
-                        <div v-if="isReviewer">
-                            <el-tooltip content="通过" placement="top">
-                                <el-button size="small" :class="{ active: scope.row._action_clicked_submit }" :disabled="actionButtonDisabled.reviewerSubmit(scope.row)" @click="tableEvents.reviewerSubmit(scope.$index, scope.row)">
-                                    <el-icon><CircleCheck /></el-icon>
-                                </el-button>
-                            </el-tooltip>
-                            <el-tooltip content="打回" placement="top" v-if="actionButtonDisabled.showRollback(scope.row)">
-                                <el-button size="small" :class="{ active: scope.row._action_clicked_rollback }" :disabled="actionButtonDisabled.reviewerRollback(scope.row)" @click="tableEvents.reviewerRollback(scope.$index, scope.row)">
-                                    <el-icon><CircleClose /></el-icon>
-                                </el-button>
-                            </el-tooltip>
-                            
-                        </div>
-                        <!-- 管理员：上线和退回 -->
-                        <div v-if="isAdmin">
-                            <el-tooltip content="上线" placement="top">
-                                <el-button size="small" :class="{ active: scope.row._action_clicked_submit }" :disabled="actionButtonDisabled.adminSubmit(scope.row)" @click="tableEvents.adminSubmit(scope.$index, scope.row)">
-                                    <el-icon><UploadFilled /></el-icon>
-                                </el-button>
-                            </el-tooltip>
-                            <el-tooltip content="退回" placement="top" v-if="actionButtonDisabled.showRollback(scope.row)">
-                                <el-button size="small" :class="{ active: scope.row._action_clicked_rollback }" @click="tableEvents.adminRollback(scope.$index, scope.row)">
-                                    <el-icon><DArrowLeft /></el-icon>
-                                </el-button>
-                            </el-tooltip>
-                        </div>
+                    <!-- 审核人员：打回和通过 -->
+                    <div v-if="tableActionShow.reviewerGroup(scope.row)">
+                        <el-tooltip content="通过" placement="top">
+                            <el-button size="small" :class="{ active: scope.row._action_clicked_submit }" :disabled="actionButtonDisabled.reviewerSubmit(scope.row)" @click="tableEvents.reviewerSubmit(scope.$index, scope.row)">
+                                <el-icon><CircleCheck /></el-icon>
+                            </el-button>
+                        </el-tooltip>
+                        <el-tooltip content="打回" placement="top">
+                            <el-button size="small" :class="{ active: scope.row._action_clicked_rollback }" :disabled="actionButtonDisabled.reviewerRollback(scope.row)" @click="tableEvents.reviewerRollback(scope.$index, scope.row)">
+                                <el-icon><CircleClose /></el-icon>
+                            </el-button>
+                        </el-tooltip>
+                    </div>
+                    <!-- 管理员：上线和退回 -->
+                    <div v-if="tableActionShow.adminGroup(scope.row)">
+                        <el-tooltip content="上线" placement="top" v-if="tableActionShow.adminSubmit(scope.row)">
+                            <el-button size="small" :class="{ active: scope.row._action_clicked_submit }" :disabled="actionButtonDisabled.adminSubmit(scope.row)" @click="tableEvents.adminSubmit(scope.$index, scope.row)">
+                                <el-icon><UploadFilled /></el-icon>
+                            </el-button>
+                        </el-tooltip>
+                        <el-tooltip content="退回" placement="top" v-if="tableActionShow.adminRollback(scope.row)">
+                            <el-button size="small" :class="{ active: scope.row._action_clicked_rollback }" @click="tableEvents.adminRollback(scope.$index, scope.row)">
+                                <el-icon><DArrowLeft /></el-icon>
+                            </el-button>
+                        </el-tooltip>
+                    </div>
                     </template>
                 </el-table-column>
             </el-table>
@@ -255,6 +254,7 @@ const modifyUserSelectDisabled = computed(() => filters.claimtype === 0)
 // })
 const isReviewer = computed(() => [USER_ROLE_REVIEWER].includes(userRole.value))
 const isAdmin = computed(() => [USER_ROLE_ADMIN].includes(userRole.value))
+const showBatchListing = computed(() => isAdmin.value)
 
 const changeFilterDefaultValue = () => {
     // 根据用户身份
@@ -387,7 +387,7 @@ const handleCurrentChange = (val) => {
     getTableList()
 };
 
-// 获取维护人劣列表
+// 获取维护人列表
 const getModifyUserList = async () => {
     const r = await store.dispatch('rulesList/getModifyUserList')
     const { data, err, msg } = r
@@ -446,27 +446,50 @@ const openEditDialog = (row) => {
     }
 }
 
+// 管理员身份  待审核和未通过。通过打回按钮显示不能点
+// 管理员身份  已通过，只有上线，其他不展示
+// 管理员   已上线。只有退回按钮
+
+
+// 操作按钮组的显示隐藏控制
+const tableActionShow = {
+    reviewerGroup(row) {
+        // 已通过和已上线的不展示
+        const canOnline = row.state === 3 // 已通过
+        const alreadyOnline = row.state === 11 // 已上线
+        const pass = canOnline || alreadyOnline
+        return !pass
+    },
+    adminGroup(row) {
+        if (isAdmin.value) {
+            return true
+        } else {
+            return false
+        }
+    },
+    adminSubmit(row) {
+        // 只有审核通过才能上线，否则不展示
+        const canOnline = row.state === 3
+        return canOnline
+    },
+    adminRollback(row) {
+        // 只有已上线，才展示退回
+        return row.state === 11
+    }
+}
 const actionButtonDisabled = {
     reviewerSubmit(row) {
-        // 只有待审核的才能审核
-        // 未通过的爬虫不能点通过和打回
-        const canSubmit = row.state === 1
-        return !canSubmit
+        // 只有待审核的才能点击
+        const canClick = row.state === 1
+        return !canClick
     },
     reviewerRollback(row) {
-        // 待审核爬虫才能打回
-        // 未通过的爬虫不能点通过和打回
-        const canSubmit = row.state === 1
-        return !canSubmit
+        return this.reviewerSubmit(row)
     },
     adminSubmit(row) {
-        // 只有审核通过才能上线，否则禁用
+        // 只有审核通过才能上线，否则不展示
         const canOnline = row.state === 3
         return !canOnline
-    },
-    showRollback(row) {
-        // 审核员、管理员已通过的爬虫不显示打回按钮
-        return row.state !== 3
     }
 }
 
@@ -699,6 +722,7 @@ const tableEvents = {
         ElMessageBox.confirm('确认通过？', '提示',
             {
                 customClass: 'j-confirm-message-box',
+                type: 'warning',
                 confirmButtonText: '确认',
                 cancelButtonText: '取消',
                 showCancelButton: false,
@@ -718,6 +742,7 @@ const tableEvents = {
         ElMessageBox.confirm('确认上线？', '提示',
             {
                 customClass: 'j-confirm-message-box',
+                type: 'warning',
                 confirmButtonText: '确认',
                 cancelButtonText: '取消',
                 showCancelButton: false,
@@ -733,6 +758,7 @@ const tableEvents = {
         ElMessageBox.confirm('确认退回？', '提示',
             {
                 customClass: 'j-confirm-message-box',
+                type: 'warning',
                 confirmButtonText: '确认',
                 cancelButtonText: '取消',
                 showCancelButton: false,
@@ -747,6 +773,10 @@ const tableEvents = {
     },
 }
 
+const tableRowSelectable = (row) => {
+    return row.state === 3
+}
+
 // 执行批量上线
 const doBatchListing = () => {
     if (listState.selected.length <= 0) {