<script setup lang="ts">
  import { useForm, BasicForm } from '/@/components/Form';
  import { formSchemas, FormFieldsValueType, TCPConfigurationType } from './config';
  import { TransportTypeEnum } from '/@/enums/deviceEnum';
  import { ref } from 'vue';
  import { ScriptTypeEnum } from '/@/views/rule/script/TcpConversionScript/config';

  const props = defineProps({
    deviceTypeStr: {
      type: String,
      default: '',
    },
  });

  const serviceType = ref<string>(props.deviceTypeStr);

  const [register, formActionType] = useForm({
    schemas: formSchemas(serviceType.value),
    showActionButtonGroup: false,
    layout: 'horizontal',
    labelWidth: 140,
  });

  const { updateSchema } = formActionType || {};
  const setServiceType = (type) => {
    updateSchema({
      field: 'upScriptId',
      componentProps: {
        scriptType: ScriptTypeEnum.TRANSPORT_TCP_UP,
        serviceType: type,
      },
    });

    serviceType.value = type;
  };

  const getFormFieldsValue = async (): Promise<TCPConfigurationType> => {
    await formActionType.validate();
    const result = formActionType.getFieldsValue() as FormFieldsValueType;
    const { splitRange, protocol, tcpAuthType, hexLength, filterPrefix, upScriptId } = result;
    return {
      protocol,
      type: TransportTypeEnum.TCP,
      tcpAuthType,
      upScriptId,
      combinationInfo: {
        ...splitRange,
        hexLength: hexLength!,
        filterPrefix,
      },
    };
  };

  const setFormFieldsValue = (value: TCPConfigurationType) => {
    const { upScriptId, protocol, combinationInfo, tcpAuthType } = value;
    const { subBeginIndex, subEndIndex, hexLength, filterPrefix } = combinationInfo || {};

    const data: FormFieldsValueType = {
      splitRange: {
        subBeginIndex: subBeginIndex!,
        subEndIndex: subEndIndex!,
      },
      hexLength,
      filterPrefix,
      upScriptId,
      protocol,
      tcpAuthType,
    };

    formActionType.setFieldsValue(data);
  };

  defineExpose({
    getFormData: getFormFieldsValue,
    // resetFormData:,
    setFormData: setFormFieldsValue,
    setServiceType,
  });
</script>

<template>
  <BasicForm @register="register" class="tcp-configuration-form w-1/2" />
</template>

<style lang="less" scoped>
  .tcp-configuration-form {
    :deep {
      .ant-input-number {
        min-width: initial;
        width: 100%;
      }
    }
  }
</style>