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

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

// @ts-ignore
import { ElMessage } from 'element-plus';

// @ts-ignore
import { getStationUserCount } from '#/api/system/user/user';
// @ts-ignore
import { handleMeeting } from '#/api/task/index';

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

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

// 会议参数
const meetingParams = ref({
  taskId: '',
  taskName: '',
});

// 初始化表单数据
const initialFormData = ref({
  attendeesCount: undefined,
  firstMeetingEnd: undefined,
  firstMeetingStart: undefined,
  id: undefined,
  meetingHost: '',
  meetingImages: '',
  meetingLocation: '',
  noticeAnnouncement: '',
  operationManagement: '',
  otherContent: '',
  performanceManagement: '',
  secondMeetingEnd: undefined,
  secondMeetingStart: undefined,
  securityCompliance: '',
  securityComplianceAttachment: '',
  serviceImprovement: '',
  totalCount: 0,
  visualImage: '',
});

// 创建表单实例
const [Form, formApi] = useVbenForm({
  showDefaultActions: false,
  schema: drawerFormSchema(),
  fieldMappingTime: [
    [
      'firstMeetingTime',
      ['firstMeetingStart', 'firstMeetingEnd'],
      'YYYY-MM-DD HH:mm:ss',
    ],
    [
      'secondMeetingTime',
      ['secondMeetingStart', 'secondMeetingEnd'],
      'YYYY-MM-DD HH:mm:ss',
    ],
  ],
});

// 创建抽屉实例
const [Drawer, drawerApi] = useVbenDrawer({
  async onOpenChange(isOpen: boolean) {
    if (!isOpen) {
      return;
    }
    try {
      drawerApi.drawerLoading(true);
      const { taskId, taskName, stationId } = drawerApi.getData();
      meetingParams.value.taskId = taskId;
      meetingParams.value.taskName = taskName;
      // 获取站点用户数量
      const { data } = await getStationUserCount(stationId);

      formApi.resetForm(initialFormData.value);
      initialFormData.value.totalCount = data;
      formApi.setFieldValue('totalCount', data);
      // 重置表单
    } catch (error) {
      console.error(error);
      ElMessage.error('加载会议数据失败');
    } finally {
      drawerApi.drawerLoading(false);
    }
  },
  onClosed() {
    formApi.resetForm(initialFormData.value);
  },
  async onConfirm() {
    try {
      this.confirmLoading = true;

      // 表单验证
      const { valid } = await formApi.validate();
      if (!valid) {
        return;
      }

      // 获取表单值
      const values = await formApi.getValues();

      // 处理会议照片字段
      delete values.meetingImagePaths;

      // 构造请求参数
      const params = {
        id: meetingParams.value.taskId,
        ...values,
      };

      // 调用API保存会议数据
      await handleMeeting(params);

      ElMessage.success('会议处理成功');
      emit('reload');
      drawerApi.close();
    } catch (error) {
      console.error(error);
      ElMessage.error('会议处理失败');
    } finally {
      this.confirmLoading = false;
    }
  },
});
</script>

<template>
  <Drawer :title="meetingParams.taskName">
    <Form />
  </Drawer>
</template>

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