管理员审核页面优化调整

src/components/AuditButtonGroup/index.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="audit-button-group">
+    <el-badge :is-dot="isDot" class="mr-12">
+      <el-button type="primary" size="mini" @click="onClick('review')">查看</el-button>
+    </el-badge>
+    <template v-if="type === 'result'">
+      <el-button
+        :class="{ 'mr-12': marginRight }"
+        type="primary"
+        size="mini"
+        @click="onClick('result')"
+      >驳回</el-button>
+    </template>
+    <template v-if="type === 'audit'">
+      <el-button :class="{ 'mr-12': marginRight }" type="primary" size="mini" @click="onClick('audit')">审核</el-button>
+    </template>
+  </div>
+</template>
+<script>
+export default {
+  name: 'AuditButtonGroup',
+  props: {
+    isDot: {
+      type: Boolean,
+      default: false
+    },
+    type: {
+      type: String,
+      default: 'result',
+      validator: (value) => ['result', 'audit'].includes(value)
+    },
+    marginRight: {
+      type: Boolean,
+      default: false
+    }
+  },
+  methods: {
+    onClick(type) {
+      this.$emit('click', type)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.audit-button-group {
+  display: inline-block;
+
+  .mr-12 {
+    margin-right: 12px;
+  }
+}
+</style>

src/components/index.js

@@ -1,7 +1,9 @@
 import AuditStatus from './AuditStatus'
+import AuditButtonGroup from './AuditButtonGroup'
 
 const install = (Vue) => {
   Vue.component(AuditStatus.name, AuditStatus)
+  Vue.component(AuditButtonGroup.name, AuditButtonGroup)
 }
 
 export default {

src/views/admin/audit/club/list.vue

@@ -67,8 +67,9 @@
         </template>
       </el-table-column>
 
-      <el-table-column label="操作" width="240px" align="center">
+      <el-table-column label="操作" width="280px" align="center">
         <template slot-scope="{ row }">
+          <!-- <audit-button-group type="result" :is-dot="true" :margin-right="true" @click="onClick(row, $event)" /> -->
           <el-button
             v-if="row.auditStatus !== 1"
             type="warning"
@@ -88,12 +89,7 @@
     </el-table>
     <!-- 表格区域END -->
     <!-- 页码 -->
-    <pagination
-      :total="total"
-      :page.sync="listQuery.pageNum"
-      :limit.sync="listQuery.pageSize"
-      @pagination="getList"
-    />
+    <pagination :total="total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize" @pagination="getList" />
     <!-- 审核弹窗 -->
     <el-dialog title="授权机构审核" :visible.sync="dialogVisible" width="450px" @close="dialogClosed">
       <div class="auth-info">
@@ -170,6 +166,26 @@ export default {
   },
   methods: {
     ...mapMutations({ setMessageState: 'webSocket/SET_MESSAGE_STATE' }),
+
+    // 按钮组点击事件
+    onClick(row, type) {
+      const actions = {
+        review: this.onReview,
+        result: this.onResult,
+        audit: this.onAudit
+      }
+      actions[type](row)
+    },
+
+    // 预览
+    onReview(row) {},
+    // 驳回
+    onResult(row) {},
+    // 审核
+    onAudit(row) {
+      this.$router.push(`/audit/club/club-detail?authId=${row.authId}`)
+    },
+
     // 获取授权列表
     getList() {
       this.listLoading = true