<!--
 * @Author: liuJie
 * @Date: 2026-01-27 14:45:03
 * @LastEditors: liuJie
 * @LastEditTime: 2026-01-27 18:19:49
 * @Describe: file describe
-->
<template>
    <div class="space-y-4">
        <!-- 失败时重试 -->
        <div class="space-y-2">
            <div class="flex items-center justify-between">
                <label class="text-sm font-medium text-gray-700">失败时重试</label>
                <el-switch v-model="retryState" @change="toggleRetry" />
            </div>
            <div class="space-y-2" v-if="config.retryEnabled">
                <div class="pl-[22px]">
                    <p class="m-0 text-sm">最大重试次数</p>
                    <el-slider v-model="config.maxRetries" show-input />
                </div>
                <div class="pl-[22px]">
                    <p class="m-0 text-sm">重试间隔</p>
                    <el-slider v-model="config.retryInterval" show-input />
                </div>
            </div>
        </div>

        <!-- 异常处理 -->
        <div class="space-y-2">
            <label class="text-sm font-medium text-gray-700 flex items-center gap-1">
                异常处理
                <Icon icon="lucide:info" :height="14" :width="14" class="text-gray-400" />
            </label>
            <select v-model="config.errorHandling" @change="handleConfigChange"
                class="w-full px-3 py-2 text-sm border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white">
                <option value="none">无</option>
                <option value="stop">停止执行</option>
                <option value="continue">继续执行</option>
                <option value="retry">重试</option>
            </select>
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref, watch } from 'vue'
import { Icon } from '@iconify/vue'

interface TestConfig {
    retryEnabled: boolean
    errorHandling: string,
    maxRetries?: number
    retryInterval?: number
}

interface Props {
    modelValue: TestConfig
}

interface Emits {
    (e: 'update:modelValue', value: TestConfig): void
}

const props = defineProps<Props>()
const emit = defineEmits<Emits>()

const retryState = ref(false)
const config = ref<TestConfig>(props.modelValue || {
    retryEnabled: false,
    errorHandling: 'none',
    maxRetries: 3,
    retryInterval: 1000
})

watch(
    () => props.modelValue,
    (newVal) => {
        config.value = newVal || {
            retryEnabled: false,
            errorHandling: 'none'
        }
    }
)

const toggleRetry = () => {
    config.value.retryEnabled = !config.value.retryEnabled
    handleConfigChange()
}

const handleConfigChange = () => {
    emit('update:modelValue', config.value)
}
</script>
