<template>
  <div>
    <el-dialog title="审核" v-model="isShowDialog" draggable width="400px">
      <el-form ref="formRef" :model="formData.auditData" :rules="rules" >
        <el-form-item label="失效时间" prop="expiedTime">
          <el-date-picker
                    v-model="formData.auditData.expiedTime"
                    type="datetime"
                    value-format="YYYY-MM-DD HH:mm:ss"
                    placeholder="请选择失效时间" >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="onCancel" icon="ele-CircleClose" size="default">取 消</el-button>
          <el-button type="primary" @click="confirmAudit">确定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import {reactive, ref, watch} from "vue";
import {oilSdkTableModel,FueilingSdkAuthInput} from "/src/api/admin/deviceAuthorization/oilSdkAuthorDto";
import {OilSdkAuthorAPI} from "/src/api/admin/deviceAuthorization/oilSdkAuthor";
import eventBus from "/src/utils/mitt";
import {FormRules} from "element-plus";

/**数据对象 */
const formData = reactive({
  loading: false,
  //isShowDialog: false,
  auditData:[] as FueilingSdkAuthInput
})
/**有效时间选择校验*/
const validateDate = (rule: any, value: any, callback: any) => {
  if(new Date(value).getTime() > Date.now()){
    callback()
  }else{
    callback(new Error('选择的时间已失效'))
  }
}

/**表单校验*/
const rules = reactive<FormRules>({
  expiedTime: [
    { type: 'date', required: true, message: '请选择失效期', trigger: 'blur' },
    { validator: validateDate, trigger: 'blur' }
  ],
})
const isShowDialog = ref(false);
const formRef = ref()

const openDialog = (val:any[]) => {
  //console.log(val)
  formData.auditData = JSON.parse(JSON.stringify(val))
  //console.log(formData.auditData)
  //formData.isShowDialog = true
  //formData.isShowDialog = true
  isShowDialog.value = true;
}

const onCancel = () => {
  isShowDialog.value=false
}

const confirmAudit =async () => {
  formRef.value.validate(async (valid: boolean) =>{
    if(!valid) return
    formData.auditData=formData.auditData.map(item=>{
      item.expiedTime=formData.auditData.expiedTime
      item.state = '正常' ? 1 : 0 ?? 0
      return item
    })
    formData.loading = true
    // eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
    let res = {} as any
    res = await new OilSdkAuthorAPI().updateForms(formData.auditData,{ showSuccessMessage: true }).catch(() => {
      formData.loading = false
    })

    if(res?.success){
      //console.log('2')
      //console.log(formData.auditData)
      eventBus.emit('refreshView')
      isShowDialog.value = false
      formData.auditData = {} as oilSdkTableModel
    }

    formData.loading = false
  })
}

/***监听弹窗关   闭表单验证*/
watch(() => isShowDialog.value,(newVal) => {
  if(newVal) formRef.value?.resetFields()
})

defineExpose({
  openDialog,
})


</script>
<style scoped lang="scss">

</style>
