zc_saas_admin/src/views/finance/withdrawal/audit.vue

<template>
  <div id="">
    <el-dialog
      :visible.sync="dialogVisible"
      width="560px"
      :show-close="false"
      :close-on-click-modal="false"
    >
      <div slot="title" class="hearders">
        <div class="leftTitle">业务员</div>
        <div class="rightBoxs">
          <img src="@/assets/images/Close@2x.png" alt="" @click="close" />
        </div>
      </div>
      <div>
        <el-form
          label-position="right"
          label-width="110px"
          :model="listData"
          :rules="rules"
          ref="listData"
        >
          <el-form-item label="申请详情">
            <div><span>tang</span><span>发起了提现申请</span></div>
            <div>本次提现金额：￥1500.00</div>
          </el-form-item>

          <el-form-item label="审核结果" prop="jg">
            <el-radio-group v-model="listData.jg">
              <el-radio :label="1">同意</el-radio>
              <el-radio :label="0">拒绝</el-radio>
            </el-radio-group>
          </el-form-item>

          <el-form-item label="审核意见" prop="yj">
            <el-input
              type="textarea"
              :rows="2"
              v-model="listData.yj"
            ></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button
          type="primary"
          :loading="disabledBtn"
          @click="submit('listData')"
          >确 定</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      disabledBtn: false,
      //   弹窗数据
      listData: {},
      //表单验证
      rules: {
        jg: [
          {
            required: true,
            message: "请选择审核结果",
            trigger: "change",
          },
        ],
        yj: [
          {
            required: true,
            message: "请输入审核意见",
            trigger: "blur",
          },
        ],
      },
    };
  },
  methods: {
    showBox(e) {
      this.dialogVisible = true;
    },
    submit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.rulesTableSumbit();
        } else {
          return false;
        }
      });
    },
    rulesTableSumbit() {
      this.disabledBtn = true;
      setTimeout(() => {
        this.$message.success("提交成功");
        this.disabledBtn = false;
        this.dialogVisible = false;
        this.search();
      }, 500);
    },
    close() {
      this.$refs.listData.clearValidate();
      this.dialogVisible = false;
    },
  },
};
</script>

<style lang="scss" scoped>
.header_img {
  & > .imageStyBoxShow {
    border-radius: 50%;
    overflow: hidden;
    width: 60px;
    height: 60px;
    margin-right: 10px;
    border: 1px solid #999;
  }
  .btns {
    border: 1px solid #333;
    color: #333;
    padding: 4px 6px;
    font-style: normal;
    border-radius: 8px;
    cursor: pointer;
    user-select: none;
  }
}
.title_i {
  text-align: center;
  font-size: 12px;
  color: rgba(134, 144, 156, 1);
}
</style>