<template>
  <div>
    <BasicModal
      v-bind="$attrs"
      width="30rem"
      :title="getTitle"
      @register="register"
      @cancel="handleCancel"
      @ok="handleOk"
      destroyOnClose
    >
      <div>
        <BasicForm @register="registerForm" />
      </div>
    </BasicModal>
  </div>
</template>
<script setup lang="ts">
import {BasicModal, useModalInner} from "/@/components/Modal";
import {BasicForm, useForm} from "/@/components/Form";
import {computed, ref, unref} from "vue";
import {useI18n} from "/@/hooks/web/useI18n";
import {schemas} from "../index";
import {getUserListByOrg} from "/@/api/equipment/ledger";
import {useUserStore} from "/@/store/modules/user";
import {saveOrder} from "/@/api/repair/order";
import {useMessage} from "/@/hooks/web/useMessage";
const { t } = useI18n();
const isUpdate = ref<Boolean>(false);
const recordInfo = ref<any>({});
// 定义人员选项
const userOptions = ref<any[]>([]);
const userInfo = useUserStore();
const { createMessage } = useMessage();

const emit = defineEmits(['handleReload', 'register']);

const getTitle = computed(() =>
  !unref(isUpdate)
    ? t('repair.order.createOrderText')
    : t('repair.order.editOrderText')
);

const [registerForm, { getFieldsValue, setFieldsValue, validate,updateSchema }] = useForm({
  labelWidth: 140,
  schemas,
  actionColOptions: {
    span: 14,
  },
  showActionButtonGroup: false,
});

const [register, { closeModal, setModalProps }] = useModalInner(async (data) => {
  setModalProps({ confirmLoading: false, loading: true });
  isUpdate.value = data?.isUpdate;
  recordInfo.value = data?.record;
  // 更新 formSchema 中的 org 字段，绑定 change 事件
  updateSchema({
    field: 'org',
    componentProps: {
      onChange: handleOrgChange,
    },
  });
  if (data?.record) {
    setFieldsValue(data?.record);
  }
  setModalProps({ loading: false });
});

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

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


const handleCancel = () => {
  closeModal();
};

const handleOk = async () => {
  await validate();
  let values = getFieldsValue();
  if (unref(isUpdate)) {
    values = { ...values, id: unref(recordInfo).id,  situationImg: values.situationImg?.[0]?.url};
  }else {
    values = { ...values,  situationImg: values.situationImg?.[0]?.url};
  }
  await saveOrder(values);
  createMessage.success(t('common.operationSuccessText'));
  emit('handleReload');
  handleCancel();
};

</script>