shalu-agent-workflow/apps/web/src/components/setter/CodeSetter.vue

<template>
    <div class="bg-white w-full">
        <div class="w-full">
            <!-- Content -->
            <div class="p-4">
                <div class="space-y-6">
                    <!-- 输入变量 -->
                    <InputVariables v-model="formData.inputVariables" />

                    <!-- 代码编辑器 -->
                    <CodeEditor v-model="formData.code" v-model:language="formData.language" />

                    <!-- 输出变量 -->
                    <OutputVariables v-model="formData.outputVariables" />

                    <!-- 测试配置 -->
                    <TestConfig v-model="formData.testConfig" />
                </div>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { reactive } from 'vue'
import InputVariables from '@/components/SetterCommon/Code/InputVariables.vue'
import CodeEditor from '@/components/SetterCommon/Code/CodeEditor.vue'
import OutputVariables from '@/components/SetterCommon/Code/OutputVariables.vue'
import TestConfig from '@/components/SetterCommon/Code/TestConfig.vue'

interface Variable {
    id: string
    name: string
}

interface OutputVariable {
    id: string
    name: string
    type: string
}

interface TestConfigData {
    retryEnabled: boolean
    errorHandling: string
}

// const props = withDefaults(defineProps<{
// }>(), {
// })
//
// const emit = defineEmits<{
// }>()

const formData = reactive({
    // 输入变量, 变量默认值
    inputVariables: [
        // { id: 'var_1', name: 'arg1' },
    ] as Variable[],
    // 代码内容
    code: `function main(arg1, arg2) {
            return {
                "result": arg1 + arg2,
            }`,
    // 编程语言
    language: 'JavaScript',
    // 输出变量
    outputVariables: [
        // { id: 'output_1', name: 'result', type: 'String' }
    ] as OutputVariable[],
    // 测试配置
    testConfig: {
        retryEnabled: false,
        errorHandling: 'none'
    } as TestConfigData
})

</script>