fix(style): catalog size tags overflow

This commit is contained in:
jialin
2025-01-09 09:26:42 +08:00
parent 39b6c00c6d
commit fb4666195c
14 changed files with 243 additions and 102 deletions
+28 -10
View File
@@ -27,6 +27,28 @@ const CatalogItem: React.FC<CatalogItemProps> = (props) => {
e.target.src = fallbackImg;
};
const renderTag = (sItem: any) => {
return (
<Tag
key={sItem}
className="tag-item"
style={{
marginRight: 0,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
padding: '2px 6px',
borderRadius: 4,
fontSize: 12,
opacity: 0.7,
height: 22
}}
>
{sItem}B
</Tag>
);
};
return (
<div
onClick={handleOnClick}
@@ -81,7 +103,7 @@ const CatalogItem: React.FC<CatalogItemProps> = (props) => {
<span className="flex-center">
{_.map(data.licenses, (license: string, index: number) => {
return (
<span key={license} className="flex-center m-r-16">
<span key={license} className="flex-center m-r-8">
<IconFont type="icon-justice1" className="m-r-5"></IconFont>
<span>{license}</span>
</span>
@@ -113,15 +135,11 @@ const CatalogItem: React.FC<CatalogItemProps> = (props) => {
<>
<span className="dot"></span>
<div className="box">
<TagWrapper>
{data.sizes.map((sItem, i) => {
return (
<Tag key={sItem} className="tag-item">
{sItem}B
</Tag>
);
})}
</TagWrapper>
<TagWrapper
gap={8}
dataList={data.sizes}
renderTag={renderTag}
></TagWrapper>
</div>
</>
)}
@@ -15,7 +15,7 @@ import {
ThunderboltFilled
} from '@ant-design/icons';
import { useIntl } from '@umijs/max';
import { Col, Divider, Row, Space, Tag, Tooltip } from 'antd';
import { Button, Col, Divider, Row, Space, Tag, Tooltip } from 'antd';
import dayjs from 'dayjs';
import _ from 'lodash';
import React, { useCallback } from 'react';
@@ -282,6 +282,21 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
? { percent: item.download_progress }
: undefined
}
extra={
item.state === InstanceStatusMap.Error ? (
<Button
type="link"
size="small"
onClick={() =>
handleChildSelect('viewlog', item, list)
}
>
{intl.formatMessage({
id: 'models.list.more.logs'
})}
</Button>
) : null
}
statusValue={{
status:
item.state === InstanceStatusMap.Downloading &&