<script setup lang="ts">
import { ref } from 'vue';

// @ts-ignore
import { useVbenDrawer, useVbenForm } from '@vben/common-ui';

// @ts-ignore
import { dealTask } from '#/api/task/upload';

// @ts-ignore
import { drawerFormSchema } from './config-data';

const emit = defineEmits<{ reload: [] }>();

const [Form, formApi] = useVbenForm({
  showDefaultActions: false,
  schema: drawerFormSchema(),
});
// const isUpdateRef = ref<boolean>(false);
const taskParams = ref({
  taskId: '',
  taskName: '',
});

const [Drawer, drawerApi] = useVbenDrawer({
  async onOpenChange(isOpen: any) {
    if (!isOpen) {
      return;
    }
    try {
      drawerApi.drawerLoading(true);
      const { taskId, taskName } = drawerApi.getData();
      taskParams.value.taskId = taskId;
      taskParams.value.taskName = taskName;
    } catch (error) {
      console.error(error);
    } finally {
      drawerApi.drawerLoading(false);
    }
  },
  onClosed() {
    formApi.resetForm();
  },
  async onConfirm() {
    try {
      this.confirmLoading = true;
      const { valid } = await formApi.validate();
      if (!valid) {
        return;
      }
      const values = await formApi.getValues();
      // console.log('params', values);
      const params = {
        // ...formApi.getValues(),
        id: taskParams.value.taskId,
        attachment: values.attachment,
        attachmentName: values.attachmentName,
        remark: values.remark,
      };
      await dealTask(params);
      emit('reload');
      drawerApi.close();
    } catch (error) {
      console.error(error);
    } finally {
      this.confirmLoading = false;
    }
  },
});
</script>

<template>
  <Drawer :title="taskParams.taskName">
    <Form />
  </Drawer>
</template>
<style scoped lang="scss">
:deep(.el-input-number) {
  width: 100%;
}
</style>
