Commit f63e1b40 authored by XieZhiXiong's avatar XieZhiXiong

chore: 完善组件

parent 14dae4e6
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2020-09-22 11:48:53 * @Date: 2020-09-22 11:48:53
* @LastEditors: XieZhiXiong * @LastEditors: XieZhiXiong
* @LastEditTime: 2020-09-22 11:53:03 * @LastEditTime: 2021-05-18 17:23:04
* @Description: 详情页头像与名字结合组件 * @Description: 详情页头像与名字结合组件
*/ */
import React from 'react'; import React from 'react';
...@@ -10,10 +10,18 @@ import styles from './index.less'; ...@@ -10,10 +10,18 @@ import styles from './index.less';
export interface AvatarWrapProps { export interface AvatarWrapProps {
info: { info: {
aloneTxt?: string, // 单独显示在头像中间的文件,不传的话从 name 从截取第一个字符 /**
* 单独显示在头像中间的文件,不传的话从 name 从截取第一个字符
*/
aloneTxt?: string,
/**
* 名称
*/
name: string, name: string,
level?: number,
}; };
/**
* 拓展展示
*/
extra?: React.ReactNode; extra?: React.ReactNode;
}; };
......
...@@ -2,12 +2,13 @@ ...@@ -2,12 +2,13 @@
* @Author: XieZhiXiong * @Author: XieZhiXiong
* @Date: 2021-05-12 11:04:26 * @Date: 2021-05-12 11:04:26
* @LastEditors: XieZhiXiong * @LastEditors: XieZhiXiong
* @LastEditTime: 2021-05-12 11:21:04 * @LastEditTime: 2021-05-19 15:59:37
* @Description: 按钮切换器 * @Description: 按钮切换器
*/ */
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Radio } from 'antd'; import { Radio } from 'antd';
import { RadioChangeEvent } from 'antd/lib/radio'; import { RadioChangeEvent } from 'antd/lib/radio';
import { SizeType } from 'antd/lib/config-provider/SizeContext';
import styles from './index.less'; import styles from './index.less';
export interface OptionItem { export interface OptionItem {
...@@ -34,6 +35,10 @@ interface IProps { ...@@ -34,6 +35,10 @@ interface IProps {
* 值 * 值
*/ */
value?: any, value?: any,
/**
* Radio.Group size
*/
size?: SizeType,
} }
const ButtonSwitch: React.FC<IProps> = (props: IProps) => { const ButtonSwitch: React.FC<IProps> = (props: IProps) => {
...@@ -41,6 +46,7 @@ const ButtonSwitch: React.FC<IProps> = (props: IProps) => { ...@@ -41,6 +46,7 @@ const ButtonSwitch: React.FC<IProps> = (props: IProps) => {
options, options,
onChange, onChange,
value, value,
size,
} = props; } = props;
const first = options.length ? options[0].value : ''; const first = options.length ? options[0].value : '';
const [radioValue, setRadioValue] = useState(first); const [radioValue, setRadioValue] = useState(first);
...@@ -73,7 +79,7 @@ const ButtonSwitch: React.FC<IProps> = (props: IProps) => { ...@@ -73,7 +79,7 @@ const ButtonSwitch: React.FC<IProps> = (props: IProps) => {
value={radioValue} value={radioValue}
optionType="button" optionType="button"
buttonStyle="solid" buttonStyle="solid"
size="small" size={size}
/> />
</div> </div>
); );
...@@ -81,6 +87,7 @@ const ButtonSwitch: React.FC<IProps> = (props: IProps) => { ...@@ -81,6 +87,7 @@ const ButtonSwitch: React.FC<IProps> = (props: IProps) => {
ButtonSwitch.defaultProps = { ButtonSwitch.defaultProps = {
onChange: undefined, onChange: undefined,
size: 'small',
}; };
export default ButtonSwitch; export default ButtonSwitch;
...@@ -32,15 +32,15 @@ export interface DataItem { ...@@ -32,15 +32,15 @@ export interface DataItem {
columnProps?: ColumnProps, columnProps?: ColumnProps,
} }
interface IProps extends MellowCardProps { export interface IProps extends MellowCardProps {
/** /**
* 数据 * 数据
*/ */
data: DataItem[], data: DataItem[],
/** /**
* column * column 列数,默认 3
*/ */
column: number column?: number
}; };
const defaultColumnProps: ColumnProps = { const defaultColumnProps: ColumnProps = {
...@@ -50,7 +50,7 @@ const defaultColumnProps: ColumnProps = { ...@@ -50,7 +50,7 @@ const defaultColumnProps: ColumnProps = {
}; };
const CustomizeColumn: React.FC<IProps> = (props: IProps) => { const CustomizeColumn: React.FC<IProps> = (props: IProps) => {
const { data, column, ...rest } = props; const { data, column = 3, ...rest } = props;
const { className } = rest; const { className } = rest;
const mergeCls = classNames(styles['customize-column'], className); const mergeCls = classNames(styles['customize-column'], className);
...@@ -77,4 +77,8 @@ const CustomizeColumn: React.FC<IProps> = (props: IProps) => { ...@@ -77,4 +77,8 @@ const CustomizeColumn: React.FC<IProps> = (props: IProps) => {
); );
}; };
CustomizeColumn.defaultProps = {
column: 3,
};
export default CustomizeColumn; export default CustomizeColumn;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment