Browse Source

docs: add onfinish action

pull/174/head
cp3hnu 11 months ago
parent
commit
0295112a6d
4 changed files with 23 additions and 13 deletions
  1. +2
    -2
      react-ui/src/components/ParameterSelect/index.tsx
  2. +8
    -1
      react-ui/src/stories/CodeSelect.stories.tsx
  3. +5
    -9
      react-ui/src/stories/ParameterSelect.stories.tsx
  4. +8
    -1
      react-ui/src/stories/ResourceSelect.stories.tsx

+ 2
- 2
react-ui/src/components/ParameterSelect/index.tsx View File

@@ -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';
/** 是否只是展示信息 */


+ 8
- 1
react-ui/src/stories/CodeSelect.stories.tsx View File

@@ -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>
);
},


+ 5
- 9
react-ui/src/stories/ParameterSelect.stories.tsx View File

@@ -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: {


+ 8
- 1
react-ui/src/stories/ResourceSelect.stories.tsx View File

@@ -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>
);
},


Loading…
Cancel
Save