描述：驳回

src/views/admin/meeting/ReservationList.vue

@@ -47,18 +47,35 @@
         <a v-if='editEnabel' @click='handleEdit(record)'>编辑</a>
         <a-divider type='vertical' />
         <a v-if='removeEnable' @click='delByIds([record.id])'>删除</a>
-         <a-tag v-if='record.statusValue == 0' color='green'>通过</a-tag>
-         <a-tag v-if='record.statusValue == 0 || record.statusValue == 1' color='volcano'>驳回</a-tag>
+         <a-tag @click='verifySuccess(record.id)' v-if='record.statusValue == 0' color='green'>通过</a-tag>
+         <a-tag @click='verifyReject(record.id)' v-if='record.statusValue == 0 || record.statusValue == 1'
+                color='volcano'>驳回</a-tag>
       </span>
     </s-table>
     <reservation-modal ref='modal' @ok='handleOk' />
+
+
+    <a-modal
+      title='驳回'
+      :visible='rejectModalVisible'
+      :confirm-loading='rejectConfirmLoading'
+      @ok='rejectHandleOk'
+      @cancel='rejectHandleCancel'
+      cancelText='取消'
+      okText='确认'
+    >
+      <div class='rejectView'>
+        <div class='label'>驳回原因</div>
+        <a-input class='content' v-model='rejectContent' placeholder='请输入驳回原因' />
+      </div>
+    </a-modal>
   </a-card>
 </template>
 
 <script>
 import { STable } from '@/components'
 
-import { delReservation, getReservationList } from '@/api/admin/meeting/reservation'
+import { delReservation, getReservationList, saveReservation } from '@/api/admin/meeting/reservation'
 import ReservationModal from './modules/ReservationModal.vue'
 import { checkPermission } from '@/utils/permissions'
 
@@ -141,7 +158,11 @@ export default {
       selectedRows: [],
       addEnable: checkPermission('meeting:reservation:add'),
       editEnabel: checkPermission('meeting:reservation:edit'),
-      removeEnable: checkPermission('meeting:reservation:remove')
+      removeEnable: checkPermission('meeting:reservation:remove'),
+      rejectModalVisible: false,
+      rejectConfirmLoading: false,
+      rejectModalId: null,
+      rejectContent: null
     }
   },
   filters: {},
@@ -177,6 +198,57 @@ export default {
         }
         this.selectedRowKeys = []
       })
+    },
+    verifySuccess(id) {
+      saveReservation({
+        id,
+        stauts: 1
+      }).then(res => {
+        if (res.code === 0) {
+          this.$message.success('审核通过')
+          this.handleOk()
+        } else {
+          this.$message.error(res.msg)
+        }
+        this.selectedRowKeys = []
+      })
+    },
+    verifyReject(id) {
+      this.rejectModalId = id
+      this.rejectModalVisible = true
+    },
+    rejectHandleOk() {
+      console.log('rejectHandleOk', this.rejectContent)
+      let id = this.rejectModalId
+      let cancelResaon = this.rejectContent
+      // 校验必填
+      if (!this.rejectContent) {
+        this.$message.error('驳回原因不能为空!')
+        return
+      }
+      // 设置确认加载状态
+      this.rejectConfirmLoading = true
+      // 调用接口
+      saveReservation({
+        id,
+        stauts: 4,
+        cancelResaon
+      }).then(res => {
+        if (res.code === 0) {
+          this.$message.success('操作成功')
+          this.rejectHandleCancel()
+          this.handleOk()
+        } else {
+          this.$message.error(res.msg)
+        }
+        this.selectedRowKeys = []
+      })
+    },
+    rejectHandleCancel() {
+      this.rejectModalId = null
+      this.rejectModalVisible = false
+      this.rejectConfirmLoading = false
+      this.rejectContent = null
     }
   },
   watch: {
@@ -195,3 +267,21 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+.rejectView {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+
+.rejectView .label {
+
+}
+
+.rejectView .content {
+  flex: 1;
+  margin-left: 10px;
+}
+
+</style>