ezhizao_yzbh_vue/src/views/business/deduction/feedbackDialog.vue

<template>
  <el-dialog
    title="反馈信息"
    v-model="formOpen"
    width="500px"
    append-to-body
    draggable
    @close="cancel"
  >
    <el-form ref="dictRef" :model="form" label-width="100">
      <el-form-item label="失败类型：">
        <el-select
          v-model.trim="form.failureType"
          size="small"
          type="text"
          placeholder="失败类型"
          :clearable="true"
          style="width: 130px"
        >
          <el-option
            v-for="item in types"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item v-if="form.failureType !== 0" label="失败说明：">
        <el-input
          v-model.trim="form.failureResult"
          size="small"
          type="text"
          placeholder="失败原因"
          :clearable="true"
          style="width: 220px"
        />
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button
          type="primary"
          size="small"
          icon="Finished"
          @click="submitForm"
          >确 定</el-button
        >
        <el-button @click="cancel" icon="close" size="small">取 消</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
import { ref } from "vue";

const { proxy } = getCurrentInstance();

const props = defineProps({
  verify: {
    type: Function,
    default: () => {},
  },
});
const types = ref([
  {
    value: 0,
    label: "余额不足",
  },
  {
    value: 1,
    label: "其他",
  },
]);
const { verify } = toRefs(props);
const currentMonth = ref(proxy.moment().format("YYYY-MM-01"));

const formOpen = ref(false);
const form = ref({});

function submitForm() {
  if (form.value.failureType !== 0 && !form.value.failureResult) {
    proxy.$modal.msgError("请输入扣款失败说明");
    return;
  }
  proxy.$modal
    .confirm("确认驳回么？")
    .then((_) => {
      verify.value(form.value);
      cancel();
    })
    .catch((_) => {
      proxy.$modal.msg("取消驳回");
    });
}

function cancel() {
  formOpen.value = false;
  reset();
}

function open(options) {
  formOpen.value = true;
  form.value = options;
}

function reset() {
  form.value = {};
}

// 暴露给父组件的方法
defineExpose({
  open,
});
</script>