| @@ -10,12 +10,12 @@ import { useEffect, useState } from 'react'; | |||
| import FormInfo from '../FormInfo'; | |||
| import { paramSelectConfig } from './config'; | |||
| type ParameterSelectObject = { | |||
| export type ParameterSelectObject = { | |||
| value: any; | |||
| [key: string]: any; | |||
| }; | |||
| interface ParameterSelectProps extends SelectProps { | |||
| export interface ParameterSelectProps extends SelectProps { | |||
| /** 类型 */ | |||
| dataType: 'dataset' | 'model' | 'service' | 'resource'; | |||
| /** 是否只是展示信息 */ | |||
| @@ -1,8 +1,9 @@ | |||
| import CodeSelect, { type ParameterInputValue } from '@/components/CodeSelect'; | |||
| import { action } from '@storybook/addon-actions'; | |||
| import { useArgs } from '@storybook/preview-api'; | |||
| import type { Meta, StoryObj } from '@storybook/react'; | |||
| import { fn } from '@storybook/test'; | |||
| import { Col, Form, Row } from 'antd'; | |||
| import { Button, Col, Form, Row } from 'antd'; | |||
| import { http, HttpResponse } from 'msw'; | |||
| import { codeListData } from './mockData'; | |||
| @@ -62,6 +63,7 @@ export const InForm: Story = { | |||
| labelAlign="left" | |||
| size="large" | |||
| autoComplete="off" | |||
| onFinish={action('onFinish')} | |||
| > | |||
| <Row gutter={8}> | |||
| <Col span={10}> | |||
| @@ -75,6 +77,11 @@ export const InForm: Story = { | |||
| </Form.Item> | |||
| </Col> | |||
| </Row> | |||
| <Row gutter={8}> | |||
| <Button htmlType="submit" type="primary"> | |||
| 提交 | |||
| </Button> | |||
| </Row> | |||
| </Form> | |||
| ); | |||
| }, | |||
| @@ -1,4 +1,5 @@ | |||
| import ParameterSelect, { ParameterSelectValue } from '@/components/ParameterSelect'; | |||
| import ParameterSelect, { type ParameterSelectObject } from '@/components/ParameterSelect'; | |||
| import { action } from '@storybook/addon-actions'; | |||
| import { useArgs } from '@storybook/preview-api'; | |||
| import type { Meta, StoryObj } from '@storybook/react'; | |||
| import { fn } from '@storybook/test'; | |||
| @@ -33,9 +34,6 @@ const meta = { | |||
| // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs | |||
| tags: ['autodocs'], | |||
| // More on argTypes: https://storybook.js.org/docs/api/argtypes | |||
| argTypes: { | |||
| // backgroundColor: { control: 'color' }, | |||
| }, | |||
| // Use `fn` to spy on the onClick arg, which will appear in the actions panel once invoked: https://storybook.js.org/docs/essentials/actions#action-args | |||
| args: { onChange: fn() }, | |||
| } satisfies Meta<typeof ParameterSelect>; | |||
| @@ -53,7 +51,7 @@ export const Primary: Story = { | |||
| }, | |||
| render: function Render(args) { | |||
| const [{ value }, updateArgs] = useArgs(); | |||
| function handleChange(value?: ParameterSelectValue) { | |||
| function handleChange(value?: string | ParameterSelectObject) { | |||
| updateArgs({ value: value }); | |||
| args.onChange?.(value); | |||
| } | |||
| @@ -75,7 +73,7 @@ export const Object: Story = { | |||
| }, | |||
| render: function Render(args) { | |||
| const [{ value }, updateArgs] = useArgs(); | |||
| function handleChange(value?: ParameterSelectValue) { | |||
| function handleChange(value?: string | ParameterSelectObject) { | |||
| updateArgs({ value: value }); | |||
| args.onChange?.(value); | |||
| } | |||
| @@ -95,9 +93,7 @@ export const InForm: Story = { | |||
| labelCol={{ flex: '80px' }} | |||
| labelAlign="left" | |||
| size="large" | |||
| onFinish={(values) => { | |||
| console.log('onFinish', values); | |||
| }} | |||
| onFinish={action('onFinish')} | |||
| autoComplete="off" | |||
| initialValues={{ | |||
| dataset: { | |||
| @@ -3,10 +3,11 @@ import ResourceSelect, { | |||
| requiredValidator, | |||
| ResourceSelectorType, | |||
| } from '@/components/ResourceSelect'; | |||
| import { action } from '@storybook/addon-actions'; | |||
| import { useArgs } from '@storybook/preview-api'; | |||
| import type { Meta, StoryObj } from '@storybook/react'; | |||
| import { fn } from '@storybook/test'; | |||
| import { Col, Form, Row } from 'antd'; | |||
| import { Button, Col, Form, Row } from 'antd'; | |||
| import { http, HttpResponse } from 'msw'; | |||
| import { | |||
| datasetDetailData, | |||
| @@ -100,6 +101,7 @@ export const InForm: Story = { | |||
| labelAlign="left" | |||
| size="large" | |||
| autoComplete="off" | |||
| onFinish={action('onFinish')} | |||
| > | |||
| <Row gutter={8}> | |||
| <Col span={10}> | |||
| @@ -150,6 +152,11 @@ export const InForm: Story = { | |||
| </Form.Item> | |||
| </Col> | |||
| </Row> | |||
| <Row gutter={8}> | |||
| <Button htmlType="submit" type="primary"> | |||
| 提交 | |||
| </Button> | |||
| </Row> | |||
| </Form> | |||
| ); | |||
| }, | |||