[feat][frontend] code evaluator route (#231) (#234)

wec4dre96-w · tpfz · Coda-bot · web-flow · commit 72edc895668e · 2025-10-21T18:01:12.000+08:00
* [feat][backend] code evaluator (#220) * feat: code evaluator --------- * fix: 补充路由 * fix: 评估器创建参数模型初始化 * fix: 隐藏筛选入口 * fix: 实验创建问题修复 * fix: 评估器问题修复 * fix: 回退配置文件 * fix: 回退配置文件 --------- Co-authored-by: tpfz <155960978+tpfz@users.noreply.github.com> Co-authored-by: Coda <coda@bytedance.com> Co-authored-by: liushengyang <liushengyang@bytedance.com>
diff --git a/frontend/packages/cozeloop/evaluate-components/src/stores/eval-target-store/prompt-definition/plugin-eval-target-form/index.tsx b/frontend/packages/cozeloop/evaluate-components/src/stores/eval-target-store/prompt-definition/plugin-eval-target-form/index.tsx
@@ -75,6 +75,11 @@ const PluginEvalTargetForm = (props: PluginEvalTargetFormProps) => {
   };
 
   const handleEvalTargetVersionChange = () => {
+    const currentMapping = formValues?.evalTargetMapping || {};
+    const objKeys = Object.keys(currentMapping);
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-expect-error
+    objKeys.forEach(k => onChange(`evalTargetMapping.${k}`, undefined));
     onChange('evalTargetMapping', undefined);
     onChange('target_runtime_param', undefined);
   };
diff --git a/frontend/packages/cozeloop/evaluate-pages/src/app.tsx b/frontend/packages/cozeloop/evaluate-pages/src/app.tsx
@@ -37,6 +37,11 @@ const App = () => {
         <Route path="evaluators" element={<EvaluatorListPage />} />
 
         <Route path="evaluators/create/llm" element={<EvaluatorCreatePage />} />
+
+        <Route
+          path="evaluators/create/llm/:id"
+          element={<EvaluatorCreatePage />}
+        />
         <Route
           path="evaluators/create/code"
           element={<CodeEvaluatorCreatePage />}
diff --git a/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-create/evaluator-detail.tsx b/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-create/evaluator-detail.tsx
@@ -97,61 +97,59 @@ function EvaluatorCreatePage() {
       })
       .catch(e => console.warn(e));
 
-  const renderContent = () => (
-    <>
-      <Form
-        initValues={
-          sourceService.data || {
-            evaluator_type: EvaluatorType.Prompt,
-          }
+  const formContent = (
+    <Form
+      initValues={
+        sourceService.data || {
+          evaluator_type: EvaluatorType.Prompt,
         }
-        className="flex-1 w-[800px] mx-auto form-default"
-        ref={formRef}
-        onValueChange={(values, changeValues) => {
-          setBlockLeave(true);
-        }}
-      >
-        <div className="h-[28px] mb-3 text-[16px] leading-7 font-medium coz-fg-plus">
-          {I18n.t('basic_info')}
-        </div>
-        <FormInput
-          label={I18n.t('name')}
-          field="name"
-          placeholder={I18n.t('please_input', { field: '' })}
-          required
-          maxLength={50}
-          trigger="blur"
-          rules={[
-            { required: true, message: I18n.t('please_input_name') },
-            { max: 50 },
-            { validator: sourceNameRuleValidator },
-            {
-              asyncValidator: async (_, value: string) => {
-                if (value) {
-                  const { pass } = await StoneEvaluationApi.CheckEvaluatorName({
-                    workspace_id: spaceID,
-                    name: value,
-                  });
-                  if (pass === false) {
-                    throw new Error(I18n.t('name_already_exists'));
-                  }
+      }
+      className="flex-1 w-[800px] mx-auto form-default"
+      ref={formRef}
+      onValueChange={(values, changeValues) => {
+        setBlockLeave(true);
+      }}
+    >
+      <div className="h-[28px] mb-3 text-[16px] leading-7 font-medium coz-fg-plus">
+        {I18n.t('basic_info')}
+      </div>
+      <FormInput
+        label={I18n.t('name')}
+        field="name"
+        placeholder={I18n.t('please_input', { field: '' })}
+        required
+        maxLength={50}
+        trigger="blur"
+        rules={[
+          { required: true, message: I18n.t('please_input_name') },
+          { max: 50 },
+          { validator: sourceNameRuleValidator },
+          {
+            asyncValidator: async (_, value: string) => {
+              if (value) {
+                const { pass } = await StoneEvaluationApi.CheckEvaluatorName({
+                  workspace_id: spaceID,
+                  name: value,
+                });
+                if (pass === false) {
+                  throw new Error(I18n.t('name_already_exists'));
                 }
-              },
+              }
             },
-          ]}
-        />
-        <FormTextArea
-          label={I18n.t('description')}
-          field="description"
-          placeholder={I18n.t('please_input_description')}
-          fieldStyle={{ paddingTop: 8 }}
-          maxCount={200}
-          maxLength={200}
-        />
-        <div className="h-7 mt-[10px]" />
-        <PromptConfigField refreshEditorModelKey={refreshEditorModelKey} />
-      </Form>
-    </>
+          },
+        ]}
+      />
+      <FormTextArea
+        label={I18n.t('description')}
+        field="description"
+        placeholder={I18n.t('please_input_description')}
+        fieldStyle={{ paddingTop: 8 }}
+        maxCount={200}
+        maxLength={200}
+      />
+      <div className="h-7 mt-[10px]" />
+      <PromptConfigField refreshEditorModelKey={refreshEditorModelKey} />
+    </Form>
   );
 
   return (
@@ -169,7 +167,7 @@ function EvaluatorCreatePage() {
       ) : (
         <>
           <div className="p-6 pt-[12px] flex-1 overflow-y-auto styled-scrollbar pr-[18px]">
-            {renderContent()}
+            {formContent}
           </div>
           <div className="flex-shrink-0 p-6">
             <div className="w-[800px] mx-auto flex flex-row justify-end gap-2">
diff --git a/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-create/prompt-field.tsx b/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-create/prompt-field.tsx
@@ -115,6 +115,9 @@ export function PromptField({
   const afterTemplateSelect = (payload: PromptEvaluator) => {
     promptEvaluatorFieldApi.setValue({
       ...promptEvaluator,
+      model_config:
+        formValues?.current_version?.evaluator_content?.prompt_evaluator
+          ?.model_config,
       message_list: payload.message_list,
       prompt_source_type: PromptSourceType.BuiltinTemplate,
       prompt_template_key: payload.prompt_template_key,
diff --git a/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-detail/index.tsx b/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-detail/index.tsx
@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 /* eslint-disable @coze-arch/max-line-per-function */
 import { useParams } from 'react-router-dom';
-import { useRef, useState } from 'react';
+import { type ReactNode, useRef, useState } from 'react';
 
 import { useRequest } from 'ahooks';
 import { I18n } from '@cozeloop/i18n-adapter';
@@ -109,6 +109,16 @@ function EvaluatorDetailPage() {
     },
   );
 
+  const formFieldContent = (
+    <div className={`${!selectedVersion ? '' : 'hidden'}`}>
+      <PromptConfigField
+        disabled={guard.data.readonly}
+        refreshEditorModelKey={refreshEditorModelKey}
+      />
+      <div className="h-6" />
+    </div>
+  );
+
   if (service.loading) {
     return (
       <div className="h-full flex items-center justify-center">
@@ -117,16 +127,18 @@ function EvaluatorDetailPage() {
     );
   }
 
-  const renderContent = () => {
-    if (selectedVersion) {
-      if (versionService.loading) {
-        return (
-          <div className="h-full w-full flex items-center justify-center">
-            <Spin spinning={true} />
-          </div>
-        );
-      }
-      return (
+  let evaluatorInfo: null | ReactNode = null;
+
+  if (selectedVersion) {
+    if (versionService.loading) {
+      evaluatorInfo = (
+        <div className="h-full w-full flex items-center justify-center">
+          <Spin spinning={true} />
+        </div>
+      );
+    }
+    if (!versionService.loading) {
+      evaluatorInfo = (
         <div className="flex-1 max-w-[800px] mx-auto">
           <div className="h-[28px] mb-3 text-[16px] leading-7 font-medium coz-fg-plus">
             {I18n.t('config_info')}
@@ -145,27 +157,8 @@ function EvaluatorDetailPage() {
         </div>
       );
     }
+  }
 
-    return (
-      <Form
-        initValues={evaluator}
-        className="flex-1 max-w-[800px] mx-auto"
-        ref={formRef}
-        onValueChange={values => {
-          // Demo 空间且没有管理权限，不保存
-          if (!isDemoSpace) {
-            autoSaveService.run(values);
-          }
-        }}
-      >
-        <PromptConfigField
-          disabled={guard.data.readonly}
-          refreshEditorModelKey={refreshEditorModelKey}
-        />
-        <div className="h-6" />
-      </Form>
-    );
-  };
   return (
     <div className="h-full overflow-hidden flex flex-col">
       <Header
@@ -197,7 +190,20 @@ function EvaluatorDetailPage() {
 
       <div className="flex-1 overflow-hidden flex flex-row">
         <div className="flex-1 overflow-y-auto p-6 flex styled-scrollbar pr-[18px]">
-          {renderContent()}
+          <Form
+            initValues={evaluator}
+            className="flex-1 max-w-[800px] mx-auto"
+            ref={formRef}
+            onValueChange={values => {
+              // Demo 空间且没有管理权限，不保存
+              if (!isDemoSpace) {
+                autoSaveService.run(values);
+              }
+            }}
+          >
+            {formFieldContent}
+            {evaluatorInfo}
+          </Form>
         </div>
         {versionListVisible && evaluator ? (
           <VersionListPane
diff --git a/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-list/evaluator-list-page.tsx b/frontend/packages/cozeloop/evaluate/src/pages/evaluator/evaluator-list/evaluator-list-page.tsx
@@ -109,7 +109,7 @@ function EvaluatorListPage() {
         if (record.evaluator_type === EvaluatorType.Code) {
           navigate(`create/code/${record.evaluator_id}`);
         } else {
-          navigate(`create/${record.evaluator_id}`);
+          navigate(`create/llm/${record.evaluator_id}`);
         }
       },
       showCancelButton: true,
diff --git a/frontend/packages/cozeloop/evaluate/src/pages/experiment/contrast/components/contrast-table/table-header.tsx b/frontend/packages/cozeloop/evaluate/src/pages/experiment/contrast/components/contrast-table/table-header.tsx
@@ -9,6 +9,7 @@ import {
   ColumnsManage,
   RefreshButton,
 } from '@cozeloop/evaluate-components';
+import { IS_HIDDEN_EXPERIMENT_DETAIL_FILTER } from '@cozeloop/biz-hooks-adapter';
 import {
   type ColumnEvaluator,
   type Experiment,
@@ -198,5 +199,10 @@ export default function ExperimentContrastTableHeader({
       <RefreshButton onRefresh={onRefresh} />
     </>
   );
-  return <TableHeader filters={filters} actions={actions} />;
+  return (
+    <TableHeader
+      filters={IS_HIDDEN_EXPERIMENT_DETAIL_FILTER ? null : filters}
+      actions={actions}
+    />
+  );
 }
diff --git a/frontend/packages/cozeloop/evaluate/src/pages/experiment/create/index.tsx b/frontend/packages/cozeloop/evaluate/src/pages/experiment/create/index.tsx
@@ -107,11 +107,11 @@ export default function ExperimentCreatePage() {
     // 保存当前步骤的值
     if (formRef?.current?.formApi) {
       const currentValues = formRef.current.formApi.getValues();
-      const nextStepValues = calcNextStepRenderValue(
+      const prevStepValues = calcNextStepRenderValue(
         createExperimentValues,
         currentValues,
       );
-      setCreateExperimentValues(nextStepValues);
+      setCreateExperimentValues(prevStepValues);
     }
 
     reportStep({
@@ -194,10 +194,12 @@ export default function ExperimentCreatePage() {
 
         if (values) {
           // 更新全局状态，确保包含最新的表单值
-          setCreateExperimentValues(prev => ({
-            ...prev,
-            ...values,
-          }));
+
+          setCreateExperimentValues(prev => {
+            const prevStepValues = calcNextStepRenderValue(prev, values);
+            return prevStepValues;
+          });
+
           // 设置下一步
           goNext();
         }
diff --git a/frontend/packages/cozeloop/evaluate/src/pages/experiment/detail/components/experiment-detail-table/index.tsx b/frontend/packages/cozeloop/evaluate/src/pages/experiment/detail/components/experiment-detail-table/index.tsx
@@ -11,6 +11,7 @@ import {
   type LogicField,
   type SemiTableSort,
 } from '@cozeloop/evaluate-components';
+import { IS_HIDDEN_EXPERIMENT_DETAIL_FILTER } from '@cozeloop/biz-hooks-adapter';
 import {
   type Experiment,
   FieldType,
@@ -422,7 +423,12 @@ export default function ({
       <TableForExperiment<ExperimentItem>
         service={service as Service}
         heightFull={true}
-        header={<TableHeader actions={actions} filters={filters} />}
+        header={
+          <TableHeader
+            actions={actions}
+            filters={IS_HIDDEN_EXPERIMENT_DETAIL_FILTER ? null : filters}
+          />
+        }
         pageSizeStorageKey="experiment_detail_page_size"
         empty={tableEmpty}
         tableProps={tableProps}

Original file line number	Diff line number	Diff line change
`@@ -109,7 +109,7 @@ function EvaluatorListPage() {`
`109`	`109`	`if (record.evaluator_type === EvaluatorType.Code) {`
`110`	`110`	navigate(`create/code/${record.evaluator_id}`);
`111`	`111`	`} else {`
`112`		- navigate(`create/${record.evaluator_id}`);
	`112`	+ navigate(`create/llm/${record.evaluator_id}`);
`113`	`113`	`}`
`114`	`114`	`},`
`115`	`115`	`showCancelButton: true,`