Mediation-Frontend/src/views/caseManagement/components/filingreviewDialog.vue

<template>
  <div>
    <!-- 立案审查 -->
    <el-dialog title="立案审查" :visible="showfilingreview" width="500px" @close="cancel" :destroy-on-close="true">
      <div class="radiobox">
        <el-radio-group v-model="radio" style="margin-bottom: 20px;">
          <el-radio :label="1">同意</el-radio>
          <el-radio :label="2">拒绝</el-radio>
        </el-radio-group>
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px">
          <!-- TODO -->
          <el-form-item label="拒绝原因" prop="caseCheckReject" v-if="radio == 2">
            <el-input type="textarea" :rows="2" placeholder="请输入拒绝原因" v-model="ruleForm.caseCheckReject"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" class="endbutton"><span>提 交</span></el-button>
        <el-button @click="cancel" class="endbutton1"><span> 取 消</span></el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import { submitCaseApplicationCheck } from "@/api/caseManagement/caseManagement.js";

export default {
  name: "filingreviewDialog",
  props: ["showfilingreview", "filingreviewdata", "queryParams"],
  data() {
    return {
      radio: 1,
      ruleForm: {},
      rules: {
        caseCheckReject: [
          {
            required: true,
            message: "拒绝原因不能为空",
            trigger: "blur",
          },
        ],
      }
    };
  },
  methods: {
    submitForm() {
      this.$refs["ruleForm"].validate((valid) => {
        if (valid) {
          let paramsdata = {
            agreeOrNotCheck: this.radio,
            ids: [this.filingreviewdata.id],
            caseCheckReject:this.ruleForm.caseCheckReject
          };
          submitCaseApplicationCheck(paramsdata)
            .then((res) => {
              this.$modal.msgSuccess("提交成功");
              this.cancel();
              this.$emit("getcaseApply", this.queryParams);
            })
            .catch((err) => { });
        }
      });
    },
    cancel() {
      this.$emit("cancelFilingreview");
    },
  },
};
</script>

<style lang="scss" scoped>
.radiobox {
  margin-left: 5%;
}

::v-deep .el-dialog {
  width: 800px;
  background: #ffffff;
  border-radius: 20px;
}

.endbutton {
  width: 124px;
  height: 37px;
  background: #0072ff;
  border-radius: 19px;

  span {
    width: 32px;
    height: 15px;
    font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color: #ffffff;
    // line-height: 48px;
  }
}

.endbutton1 {
  width: 124px;
  height: 37px;
  background: #ffffff;
  border: 1px solid #d0d0d0;
  border-radius: 19px;

  span {
    width: 31px;
    height: 13px;
    font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color: #959595;
  }
}
</style>