<template>
  <BasicDrawer
    destroyOnClose
    v-bind="$attrs"
    showFooter
    width="35%"
    :maskClosable="true"
    :title="businessText"
    @register="registerDrawer"
    wrapClassName="report-drawer"
    @ok="handleSubmit"
    @close="handleClose"
  >
    <BasicForm @register="registerForm">

    </BasicForm>
  </BasicDrawer>
</template>
<script setup lang="ts">
import {nextTick, reactive, ref} from "vue";
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
import { SchemaFiled} from "../../config/enum";
import {BasicForm,useForm} from "/@/components/Form";
import {formSchema} from "../../config/data";
import {useHooks} from "/@/views/report/config/hooks/index.hooks";
import {getUserListByOrg,ledgerEditDetailPage,saveLedger } from "/@/api/equipment/ledger"
import {useUserStore} from "/@/store/modules/user";
import {useThrottleFn} from "@vueuse/shared/index";
import {useMessage} from "/@/hooks/web/useMessage";
import {useI18n} from "/@/hooks/web/useI18n";
const {
  setDefaultTime,
  disableCustomWeekly,
  setPropsForModal,
  removeFields,
} = useHooks();
const userInfo = useUserStore();
const restData = reactive({
  data: {},
});
const { createMessage } = useMessage();
const { t } = useI18n();
const emits = defineEmits(['success', 'register']);
const [registerForm, { validate, resetFields, setFieldsValue, updateSchema, setProps }] = useForm(
  {
    labelWidth: 140,
    schemas: formSchema,
    showActionButtonGroup: false,
    fieldMapToTime: [[SchemaFiled.DATE_RANGE, [SchemaFiled.START_TS, SchemaFiled.END_TS]]],
  }
);
// 定义人员选项
const userOptions = ref<any[]>([]);

// 监听 org 字段的变化
const handleOrgChange = async (orgId: string) => {
  if (!orgId) {
    userOptions.value = []; // 清空人员选项
    updateSchema({
      field: 'directorId',
      componentProps: { options: [] },
    });
    return;
  }
  const _data = {
    page: '1',
    pageSize: '999',
    tenantId: userInfo.getUserInfo.tenantId!,
    organizationId: orgId
  }
  // 调用接口 B 获取人员数据
  const userList = await getUserListByOrg(_data);
  console.log(userList,'userList')
  userOptions.value = userList?.items.map(user => ({
    label: user.username,
    value: user.id,
  }));

  // 更新 user 字段的选项
  updateSchema({
    field: 'directorId',
    componentProps: { options: userOptions.value },
  });
};




const businessText = ref('');
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
  try {
    await nextTick();
    handleClose();
    businessText.value = data.text;
    // 更新 formSchema 中的 org 字段，绑定 change 事件
    updateSchema({
      field: 'org',
      componentProps: {
        onChange: handleOrgChange,
      },
    });
    setFieldsValue(setDefaultTime());
    updateSchema(disableCustomWeekly(0));
    setDrawerProps(setPropsForModal(businessText.value));
    if (businessText.value === 'add') return;
    const rest = await ledgerEditDetailPage({id: data.record?.id});
    restData.data = rest ?? {};

    await setFieldsValue({
      ...restData.data,
    });

  } finally {
    setDrawerProps({ loading: false });
  }
});
const handleClose = () => {
  resetValue();
}
//重置表单
const resetValue = () => {
  resetFields();
};

const handleSubmit = () => {
  useThrottle();
};

const useThrottle = useThrottleFn(() => {
  getValue();
}, 2000);

const getValue = async () => {
  try {
    setDrawerProps({ confirmLoading: true });
    const values = await validate();
    if (!values) return;
    const data = {
      ...values,
      buyDate: values.buyDate?.format('YYYY-MM-DD hh:mm:ss'),
      productDate: values.productDate?.format('YYYY-MM-DD hh:mm:ss'),
      receiveDate: values.receiveDate?.format('YYYY-MM-DD hh:mm:ss'),
      registeDate: values.registeDate?.format('YYYY-MM-DD hh:mm:ss'),
    };
    removeFields.forEach((item) => {
      Reflect.deleteProperty(data, item);
    });
    businessText.value === 'add'
      ? await saveLedger(data)
      : saveLedger({ ...restData.data, ...data });
    createMessage.success(
      t(businessText.value !== 'add' ? 'common.editSuccessText' : 'common.createSuccessText')
    );
    closeDrawer();
    handleClose();
    setTimeout(() => {
      emits('success');
    }, 500);
  } finally {
    setDrawerProps({ confirmLoading: false });
  }
};

</script>