审核接口对接 - - vue

点击审核按钮，弹出弹窗，可输入审核意见，点击通过按钮通过审核，点击驳回按钮不通过审核。

与后端对接，后端的swagger：

前端写接口的api文件：

//审批请示--数据审批
export function approval(param) {
    return request({
        url: "/xxxx/xxxx/approval",
        method: "post",
        headers: {
            "Content-Type": "application/json" // 如果写成contentType会报错
        },
        data: param
    });
}

vue文件中的template中：

<template slot-scope="scope">
              <el-button
                @click="beforeApproval(scope.row.id)"
                type="text"
                size="small"
              >
                审核 </el-button
              ><el-dialog
                title="审 批"
                :visible.sync="dialogVisible"
                width="30%"
                :before-close="handleClose"
              >
                <div class="checkBody">
                  <span class="checkWord">审批意见</span>
                  <textarea
                    class="checkContent"
                    placeholder="请输入审批意见"
                    maxlength="200"
                    @input="descInput"
                    v-model="orders"
                    onchange="this.value=this.value.substring(0, 200)"
                    onkeydown="this.value=this.value.substring(0, 200)"
                    onkeyup="this.value=this.value.substring(0, 200)"
                  >
                ></textarea
                  >
                </div>
                <span class="wordStatic">{{ numbers }} / 200</span>
                <span slot="footer" class="dialog-footer">
                  <el-button @click="dialogVisible = false">取 消</el-button>
                  <el-button @click="approvalRes(0)">驳回</el-button>
                  <el-button type="primary" @click="approvalRes(1)"
                    >通过</el-button
                  >
                </span>
              </el-dialog>
            </template>

import { approval } from "@/api/cimApi/userApi";

methods中：

// 审批时获取当前列的id 并显示弹窗
    beforeApproval(id) {
      this.approvalId = id;
      this.dialogVisible = true;
    },
    // 审批请示-审核
    approvalRes(num) {
      let param = {
        id: this.approvalId,
        state: num,
        opinion: this.orders
      };
      approval(param).then(() => {
        this.$message.success("审批完成");
        this.dialogVisible = false;
        this.approvalFormData();
      });
    }

在通过与驳回按钮时，传递实参0和1，两个按钮调用同一个方法，在调用方法时传递num形参，拼接接口所需要的数据时，不必在进行判断，直接传递即可。

获取当前列的id时，利用插槽获取。