Feat: Adjust the style of mcp and checkbox. #10427 (#11150)

### What problem does this PR solve?

Feat: Adjust the style of mcp and checkbox. #10427

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/agent/form/agent-form/index.tsx

@@ -41,6 +41,7 @@ import { PromptEditor } from '../components/prompt-editor';
 import { QueryVariable } from '../components/query-variable';
 import { AgentTools, Agents } from './agent-tools';
 import { StructuredOutputDialog } from './structured-output-dialog';
+import { StructuredOutputPanel } from './structured-output-panel';
 import { useBuildPromptExtraPromptOptions } from './use-build-prompt-options';
 import { useShowStructuredOutputDialog } from './use-show-structured-output-dialog';
 import { useValues } from './use-values';
@@ -275,13 +276,16 @@ function AgentForm({ node }: INextOperatorForm) {
             </section>
           </Collapse>
           <Output list={outputList}></Output>
-          <section>
+          <section className="space-y-2">
             <div className="flex justify-between items-center">
-              structured_output
+              {t('flow.structuredOutput.structuredOutput')}
               <Button variant={'outline'} onClick={showStructuredOutputDialog}>
                 {t('flow.structuredOutput.configuration')}
               </Button>
             </div>
+            <StructuredOutputPanel
+              value={initialStructuredOutput}
+            ></StructuredOutputPanel>
           </section>
         </FormWrapper>
       </Form>

web/src/pages/agent/form/agent-form/structured-output-panel.tsx

@@ -0,0 +1,13 @@
+import { JSONSchema, JsonSchemaVisualizer } from '@/components/jsonjoy-builder';
+
+export function StructuredOutputPanel({ value }: { value: JSONSchema }) {
+  return (
+    <section className="h-48">
+      <JsonSchemaVisualizer
+        schema={value}
+        readOnly
+        showHeader={false}
+      ></JsonSchemaVisualizer>
+    </section>
+  );
+}

web/src/pages/dataflow-result/index.tsx

@@ -190,7 +190,7 @@ const Chunk = () => {
             <BreadcrumbSeparator />
             <BreadcrumbItem>
               <BreadcrumbPage>
-                {knowledgeId ? documentInfo?.name : t('dataflow.viewResult')}
+                {knowledgeId ? documentInfo?.name : t('flow.viewResult')}
               </BreadcrumbPage>
             </BreadcrumbItem>
           </BreadcrumbList>

web/src/pages/profile-setting/mcp/edit-mcp-dialog.tsx

@@ -124,7 +124,7 @@ export function EditMcpDialog({
           form={form}
           setFieldChanged={setFieldChanged}
         ></EditMcpForm>
-        <Card>
+        <Card className="bg-transparent">
           <CardContent className="p-3">
             <Collapse
               title={