Skip to content

Commit

Permalink
chore: test
Browse files Browse the repository at this point in the history
  • Loading branch information
KouSum committed May 10, 2024
1 parent 621a06b commit ae590b9
Show file tree
Hide file tree
Showing 8 changed files with 150 additions and 127 deletions.
4 changes: 2 additions & 2 deletions packages/semi-ui-vue/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -193,14 +193,14 @@ const App = defineComponent<ExampleProps>((props, {slots}) => {
{/*<TagInputDemo />*/}

{/*<AutoCompleteDemo/>*/}
<SelectDemo/>
{/*<SelectDemo/>*/}
{/*<SelectDemo2/>*/}
{/*<SelectDemo3/>*/}
{/*<TagDemo/>*/}
{/*<AvatarDemo/>*/}
{/*<RadioDemo />*/}

{/*<InputDemo />*/}
<InputDemo />
{/*<TypeDemo />*/}

{/*<div style={{color:'#E91E63',width: 100, display:'flex', flexWrap:'wrap'}}>*/}
Expand Down
83 changes: 41 additions & 42 deletions packages/semi-ui-vue/src/components/avatar/__test__/AvatarDemo.tsx
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
import {defineComponent, ref, h, Fragment, onMounted} from 'vue'
import Avatar from '../index'
import AvatarGroup from '../avatarGroup'
import { defineComponent, ref, h, Fragment, onMounted } from 'vue';
import Avatar from '../index';
import AvatarGroup from '../avatarGroup';

interface ExampleProps {
name?: string
name?: string;
}

export const vuePropsType = {
name: String
}
const AvatarDemo = defineComponent<ExampleProps>((props, {slots}) => {


const src = ref('https://sf6-cdn-tos.douyinstatic.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/avatarDemo.jpeg')
onMounted(()=>{
setInterval(()=>{
src.value = 'sd' + (new Date).toString()
}, 1000)
})
name: String,
};
const AvatarDemo = defineComponent<ExampleProps>((props, { slots }) => {
const src = ref(
'https://sf6-cdn-tos.douyinstatic.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/avatarDemo.jpeg'
);
onMounted(() => {
setInterval(() => {
src.value = 'sd' + new Date().toString();
}, 1000);
});

// return ()=>{
// return <Avatar
Expand All @@ -28,26 +28,26 @@ const AvatarDemo = defineComponent<ExampleProps>((props, {slots}) => {
return () => (
<div>
<div>
<Avatar size="extra-extra-small" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="extra-small" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="small" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="default" style={{ margin: 4 }}>
U
</Avatar>
<Avatar style={{ margin: 4 }}>U</Avatar>
<Avatar size="large" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="extra-large" style={{ margin: 4 }}>
U
</Avatar>
</div>
<Avatar size="extra-extra-small" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="extra-small" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="small" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="default" style={{ margin: 4 }}>
U
</Avatar>
<Avatar style={{ margin: 4 }}>U</Avatar>
<Avatar size="large" style={{ margin: 4 }}>
U
</Avatar>
<Avatar size="extra-large" style={{ margin: 4 }}>
U
</Avatar>
</div>
<div>
<Avatar style={{ margin: 4 }}>AS</Avatar>
<Avatar color="red" style={{ margin: 4 }}>
Expand Down Expand Up @@ -86,15 +86,15 @@ const AvatarDemo = defineComponent<ExampleProps>((props, {slots}) => {
<Avatar style={{ backgroundColor: '#87d068' }}>YZ</Avatar>
</AvatarGroup>

<br/>
<br />
<AvatarGroup overlapFrom={'end'}>
<Avatar color="red">LL</Avatar>
<Avatar>CX</Avatar>
<Avatar color="amber">RM</Avatar>
<Avatar style={{ color: '#f56a00', backgroundColor: '#fde3cf' }}>ZL</Avatar>
<Avatar style={{ backgroundColor: '#87d068' }}>YZ</Avatar>
</AvatarGroup>
<br/>
<br />
<AvatarGroup maxCount={3}>
<Avatar color="red">LL</Avatar>
<Avatar>CX</Avatar>
Expand All @@ -103,11 +103,10 @@ const AvatarDemo = defineComponent<ExampleProps>((props, {slots}) => {
<Avatar style={{ backgroundColor: '#87d068' }}>YZ</Avatar>
</AvatarGroup>
</div>
)
})
);
});

// @ts-ignore
AvatarDemo.props = vuePropsType

export default AvatarDemo
AvatarDemo.props = vuePropsType;

export default AvatarDemo;
50 changes: 29 additions & 21 deletions packages/semi-ui-vue/src/components/index.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import './_base/base.scss';
export { default as BaseFoundation } from "@douyinfe/semi-foundation/base/foundation";
export { useBaseComponent } from "./_base/baseComponent";
import {RuleItem} from "async-validator/dist-types/interface";
import {customRequestArgs} from "./upload";
export { default as BaseFoundation } from '@douyinfe/semi-foundation/base/foundation';
export { useBaseComponent } from './_base/baseComponent';
export type { SortableItemFuncArg } from './tagInput';

export { default as Button } from './button';
export { default as ButtonGroup } from './button/ButtonGroup';
Expand All @@ -17,7 +16,7 @@ export { default as Popover } from './popover';
export { default as Space } from './space';
export { default as Spin } from './spin';
export { default as SplitButtonGroup } from './button/splitButtonGroup';
export {type DropDownMenuItem} from "./dropdown";
export { type DropDownMenuItem } from './dropdown';
export { default as Tooltip } from './tooltip';
export { default as LocaleProvider } from './locale/localeProvider';

Expand All @@ -32,7 +31,7 @@ export {
export { default as Input } from './input';
export { default as TextArea } from './input/textArea';
export { Group as RadioGroup, Radio } from './radio';
export type { RadioChangeEvent } from './radio'
export type { RadioChangeEvent } from './radio';
export { default as AutoCompleteItems } from './autoComplete';
export { default as Avatar } from './avatar';
export { default as Cascader } from './cascader';
Expand All @@ -55,17 +54,23 @@ export { default as TimePicker } from './timePicker';
export { default as InputNumber } from './inputNumber/index';
export { default as Progress } from './progress/index';
export { default as Upload } from './upload/index';
export type { customRequestArgs, OnChangeProps, AfterUploadProps, BeforeUploadProps, FileItem, UploadListType } from './upload/interface'
export type {
customRequestArgs,
OnChangeProps,
AfterUploadProps,
BeforeUploadProps,
FileItem,
UploadListType,
} from './upload/interface';

export { default as Slider } from './slider/index';
export { default as Divider } from './divider/index';
export { default as Rating } from './rating/index';
export { default as Tree, TreeNode } from './tree/index';
export { default as TreeSelect } from './treeSelect/index';


export {Link} from "./anchor";
export {Link as AnchorLink} from "./anchor";
export { Link } from './anchor';
export { Link as AnchorLink } from './anchor';
export { default as Anchor } from './anchor';
export { default as AutoComplete } from './autoComplete';
export { default as AvatarGroup } from './avatar/avatarGroup';
Expand All @@ -83,7 +88,7 @@ export { default as Descriptions, DescriptionsItem, type Data as DescriptionsDat
export { default as Modal, ModalClass } from './modal';

export { default as List } from './list';
export { ListItem } from "./list";
export { ListItem } from './list';
export { default as InputGroup } from './input/inputGroup';
export { default as Nav } from './navigation/index';
export { default as NavItem } from './navigation/Item';
Expand All @@ -100,10 +105,7 @@ export type {

export { default as NotificationList, NotificationListClass as Notification } from './notification';
export { default as useNotification } from './notification/useNotification';
export type {
NoticeTransitionProps,
NoticeProps
} from './notification';
export type { NoticeTransitionProps, NoticeProps } from './notification';

export { default as OverflowList } from './overflowList';
export { default as Pagination } from './pagination';
Expand All @@ -120,16 +122,23 @@ export { default as Switch } from './switch';
* Table
*/
export { default as Table, TableMaker } from './table';
export type { ColumnProps, TablePaginationProps, Align, Data as TableColumnData } from './table/interface';
export type {TableStateRowSelection} from "./table/Table";
export type { ColumnProps, TablePaginationProps, Align, Data as TableColumnData } from './table/interface';
export type { TableStateRowSelection } from './table/Table';

export { default as Tabs } from './tabs';
export { default as TabPane } from './tabs/TabPane';
export { default as TagGroup } from './tag/group';
export { default as Timeline } from './timeline';
export { default as Toast, ToastFactory } from './toast';
export { default as Transfer } from './transfer';
export type { DataItem, SelectedPanelProps, SourcePanelProps } from './transfer';
export type {
DataItem,
SelectedPanelProps,
SourcePanelProps,
RenderSourceItemProps,
RenderSelectedItemProps,
} from './transfer';

export { default as Highlight } from './highlight';

export { default as LocaleConsumer } from './locale/localeConsumer';
Expand Down Expand Up @@ -172,7 +181,6 @@ export { default as Image } from './image';
export { Preview as ImagePreview } from './image';
export type { RuleItem, BaseFormProps } from './form/interface';


//v-model
export {
AutoCompleteVModel,
Expand All @@ -191,5 +199,5 @@ export {
TransferVModel,
TreeSelectVModel,
UploadVModel,
} from "./withVModel/index"
export {default as WithVModel} from "./withVModel/WithVModel"
} from './withVModel/index';
export { default as WithVModel } from './withVModel/WithVModel';
59 changes: 38 additions & 21 deletions packages/semi-ui-vue/src/components/input/__test__/InputDemo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import Input from '../index'
import TextArea from "../textArea";
import {IconSearch} from '@kousum/semi-icons-vue'
import {Text} from '../../typography'
import {InputGroup} from "../../index";
import { AutoComplete, InputGroup, Select, SelectOption } from '../../index';
import InputNumber from "../../inputNumber";

interface ExampleProps {
Expand All @@ -24,45 +24,62 @@ const InputDemo = defineComponent<ExampleProps>((props, {slots}) => {
// }, 1000)
})

function onChange(v:any) {
console.log(v)
function onChange(v: any) {
console.log(v);
}

return () => (
<div id={'a'}>

{/*<Input prefix={<IconSearch />} placeholder={'请输入'} showClear></Input>*/}
{/*<br/><br/>*/}
{/*<Input prefix="Prefix" showClear></Input>*/}
{/*<br/><br/>*/}
{/*<Input suffix={<IconSearch />} showClear></Input>*/}
{/*<br/><br/>*/}
{/*<Input disabled suffix={<Text strong type='secondary' style={{ marginRight: 8 }}>Suffix</Text>} showClear></Input>*/}
<br/><br/>
<br />
<br />
<Input showClear mode={'password'} placeholder={'click to clear'} onChange={onChange}></Input>
<Input showClear defaultValue={'defaultValue.value'} value={defaultValue.value}
placeholder={'click to clear'}></Input>
<Input
showClear
defaultValue={'defaultValue.value'}
value={defaultValue.value}
placeholder={'click to clear'}
></Input>
<Input showClear defaultValue={defaultValue.value} placeholder={'click to clear'}></Input>
{defaultValue.value}
<TextArea defaultValue={defaultValue.value} placeholder={'请输入'}/>
<TextArea value={defaultValue.value} placeholder={'请输入'}/>
<TextArea v-model={[defaultValue.value, 'value']} placeholder={'请输入'}/>
<TextArea maxCount={100} showClear/>
<TextArea defaultValue={defaultValue.value} placeholder={'请输入'} />
<TextArea value={defaultValue.value} placeholder={'请输入'} />
<TextArea v-model={[defaultValue.value, 'value']} placeholder={'请输入'} />
<TextArea maxCount={100} showClear />

<Input defaultValue='ies' validateStatus='warning'></Input>
<br/><br/>
<Input defaultValue='ies' validateStatus='error'></Input>
<br/><br/>
<Input defaultValue='ies'></Input>
<Input defaultValue="ies" validateStatus="warning"></Input>
<br />
<br />
<Input defaultValue="ies" validateStatus="error"></Input>
<br />
<br />
<Input defaultValue="ies"></Input>

<InputGroup>
<Input placeholder="Name" style={{ width: '100px' }} />
<InputNumber placeholder="Score" style={{ width: '140px' }} />
</InputGroup>
<br />
<br />

<InputNumber placeholder="Score" style={{ width: '140px' }} />
<br />
<br />
<InputGroup>
<Input placeholder="Name" style={{width: '100px'}}/>
<InputNumber placeholder="Score" style={{width: '140px'}}/>
<Select style={{ width: '100px' }} defaultValue="home">
<SelectOption value="home">Home</SelectOption>
<SelectOption value="work">Work</SelectOption>
</Select>
<AutoComplete data={['Beijing Haidian']} placeholder="Address: " style={{ width: 180 }}></AutoComplete>
</InputGroup>
<br/><br/>
<InputNumber placeholder="Score" style={{width: '140px'}}/>
</div>
)
);
})


Expand Down
2 changes: 1 addition & 1 deletion packages/semi-ui-vue/src/components/input/inputGroup.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@ const InputGroup = defineComponent<InputGroupProps>((props, { slots }) => {
);
}
return () => {
const { size, style, className, label, onBlur: groupOnBlur, onFocus: groupOnFocus, disabled: groupDisabled, ...rest } = props;
const { size, style, className, label, onBlur: groupOnBlur, onFocus: groupOnFocus, disabled: groupDisabled, labelPosition, ...rest } = props;
const children = slots.default ? slots.default() : null;
const groupCls = cls(
`${prefixCls}-group`,
Expand Down
Loading

0 comments on commit ae590b9

Please sign in to comment.