<template>
    <a-modal v-model:visible="okVisible" :modal-style="{width:'420px'}" body-class="okmodal" @ok="handleConfirm"
      @cancel="handleClose" >
      <template #title>
        提示
      </template>
      <a-form :model="form" :rules="rules" ref="modalFormRef" size="medium" label-align="left" auto-label-width>
      <a-form-item field="cancel_remarks" label="理由" >
        <a-textarea v-model.trim="form.cancel_remarks" allow-clear placeholder="请输入取消订单理由"></a-textarea>
      </a-form-item>
    </a-form>
    <template #footer>
      <a-button @click="handleClose"><template #icon><icon-close /></template>取消</a-button>
      <a-button type="primary" @click="handleConfirm"><template #icon><icon-check /></template>确认</a-button>
    </template>

    </a-modal>
</template>
<script setup>
import { reactive, toRefs, getCurrentInstance } from 'vue';
import { Message } from '@arco-design/web-vue';
const { proxy } = getCurrentInstance();
const form = reactive({
      cancel_remarks: ''
    });
const props = defineProps({
  // 是否显示
  okVisible: {
    type: Boolean,
    default: false,
  },
  id:{
    type: String,
    default:'',
  },
  dealType:{
    type: String,
    default:'',
  },
  title:{
    type: String,
    default:'',
  },
  api: {
    type: Function,
  },
});
const emits = defineEmits(['closeChange']);
const {okVisible,title,id,api} = toRefs(props);

// Akiraka 20230210 关闭弹窗
const handleClose = () =>  {
  emits('closeChange',false);
 // alert(flag)
}
// Akiraka 20230210 删除数据校验
const rules = reactive({
  cancel_remarks:  [{ required: true, message: '请输入取消订单理由' }]
});
// Akiraka 20230210 确认按钮 => 开始数据检查
const handleConfirm = () => {
  proxy.$refs.modalFormRef.validate(async(valid) => {
    if (!valid) {
      const {code}= await api.value(id.value,form);
      if(code==200){
        Message.success("取消成功");
          proxy.$refs.modalFormRef.resetFields();
      }else{
        proxy.$notification.error(response.message);
      }
      emits('closeChange',true);
    // api.value(id.value,form).then(response => {
    //     // Akiraka 20230210 关闭弹窗
    //     if(response.code==200){
    //       Message.success("取消成功");
    //       proxy.$refs.modalFormRef.resetFields();
    //     }else{
    //       proxy.$notification.error(response.message);
    //     }
    //     emits('closeChange',true);
    //   })
    }
  })
  }
</script>