<template>
  <a-modal
    :visible="visible"
    title="采集配置"
    @ok="handleOk"
    @cancel="handleCancel"
    @update:visible="handleUpdateVisible"
    :confirm-loading="confirmLoading"
    width="500px"
  >
    <a-form ref="formRef" :model="formData" layout="vertical">
      <a-form-item field="collect_method" label="采集方式">
        <a-radio-group v-model="formData.collect_method" type="button">
          <a-radio value="api">API</a-radio>
          <a-radio value="snmp">SNMP</a-radio>
        </a-radio-group>
      </a-form-item>

      <template v-if="formData.collect_method === 'api'">
        <a-form-item field="agent_config" label="采集地址(HTTP/HTTPS GET)">
          <a-input v-model="formData.agent_config" placeholder="周期采集地址，返回 JSON 格式指标数组" />
        </a-form-item>
      </template>
      <template v-else>
        <a-form-item field="snmp_target" label="SNMP目标地址">
          <a-input v-model="formData.snmp_target" placeholder="例如 192.168.1.10" />
        </a-form-item>
        <a-form-item field="snmp_community" label="Community">
          <a-input v-model="formData.snmp_community" placeholder="SNMP v2c community" />
        </a-form-item>
      </template>

      <a-form-item field="collect_on" label="启用周期采集">
        <a-switch v-model="formData.collect_on" />
      </a-form-item>

      <a-form-item v-if="formData.collect_on" field="collect_interval" label="采集间隔(秒)">
        <a-input-number v-model="formData.collect_interval" placeholder="默认60秒" :min="10" :max="3600" style="width: 100%" />
      </a-form-item>

      <a-alert type="warning" style="margin-top: 16px">快速修改采集配置，无需编辑完整表单</a-alert>
    </a-form>
  </a-modal>
</template>

<script lang="ts" setup>
import { ref, reactive, watch } from 'vue'
import { Message } from '@arco-design/web-vue'
import type { FormInstance } from '@arco-design/web-vue'
import { patchSecurityServiceCollect, type SecurityServicePatchData } from '@/api/ops/security'

interface Props {
  visible: boolean
  record?: any
}

const props = withDefaults(defineProps<Props>(), {
  record: () => ({}),
})

const emit = defineEmits(['update:visible', 'success'])

const formRef = ref<FormInstance>()
const confirmLoading = ref(false)

const formData = reactive({
  collect_method: 'api' as 'api' | 'snmp',
  agent_config: '',
  snmp_target: '',
  snmp_community: '',
  collect_on: true,
  collect_interval: 60,
})

watch(
  () => props.visible,
  (val) => {
    if (val && props.record) {
      formData.collect_method = props.record.collect_method || 'api'
      formData.agent_config = props.record.agent_config || ''
      formData.snmp_target = props.record.snmp_target || ''
      formData.snmp_community = props.record.snmp_community || ''
      formData.collect_on = props.record.collect_on ?? true
      formData.collect_interval = props.record.collect_interval || 60
    }
  }
)

const handleOk = async () => {
  try {
    confirmLoading.value = true

    const patchData: SecurityServicePatchData = {
      collect_method: formData.collect_method,
      agent_config: formData.collect_method === 'api' ? formData.agent_config : undefined,
      snmp_target: formData.collect_method === 'snmp' ? formData.snmp_target : undefined,
      snmp_community: formData.collect_method === 'snmp' ? formData.snmp_community : undefined,
      collect_on: formData.collect_on,
      collect_interval: formData.collect_interval,
    }

    await patchSecurityServiceCollect(props.record.id, patchData)
    Message.success('采集配置已更新')
    emit('success')
    handleCancel()
  } catch (error) {
    console.error('更新采集配置失败:', error)
    Message.error('更新失败')
  } finally {
    confirmLoading.value = false
  }
}

const handleUpdateVisible = (value: boolean) => {
  emit('update:visible', value)
}

const handleCancel = () => {
  emit('update:visible', false)
}
</script>
