ci4s
/
ci4sManagement-cloud
41
0
Fork 1
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

fix: 禁止图片拖动

This commit is contained in:
cp3hnu 2024-09-18 11:09:46 +08:00
parent d9b70dabee
commit eeb0d0c149
23 changed files with 88 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -46,7 +46,7 @@ function KFEmpty({
return (
<div className={classNames('kf-empty', className)} style={style}>
<img className="kf-empty__image" src={image} />
<img className="kf-empty__image" src={image} draggable={false} alt="" />
<div className="kf-empty__title">{title}</div>
<div className="kf-empty__content">{content}</div>
{hasFooter && (

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

@ -18,7 +18,7 @@ type ModalTitleProps = {
function ModalTitle({ title, image, style, className }: ModalTitleProps) {
return (
<div className={classNames('kf-modal-title', className)} style={style}>
{image && <img className={'kf-modal-title__image'} src={image} alt="" />}
{image && <img className={'kf-modal-title__image'} src={image} draggable={false} alt="" />}
{title}
</div>
);

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

@ -17,7 +17,7 @@ type SubAreaTitleProps = {
function SubAreaTitle({ title, image, style, className }: SubAreaTitleProps) {
return (
<div className={classNames('kf-subarea-title', className)} style={style}>
<img src={image} width={14} />
<img src={image} width={14} draggable={false} alt="" />
<span style={{ marginLeft: '8px' }}>{title}</span>
</div>
);

9
react-ui/src/pages/CodeConfig/components/CodeConfigItem/index.tsx
View File

@ -63,11 +63,16 @@ function CodeConfigItem({ item, onClick, onEdit, onRemove }: CodeConfigItemProps
</div>
<Flex justify="space-between">
<div className={styles['code-config-item__time']}>
<img style={{ width: '17px', marginRight: '6px' }} src={creatByImg} alt="" />
<img
style={{ width: '17px', marginRight: '6px' }}
src={creatByImg}
alt=""
draggable={false}
/>
<span>{item.create_by}</span>
</div>
<div className={styles['code-config-item__time']}>
<img style={{ width: '12px', marginRight: '5px' }} src={clock} alt="" />
<img style={{ width: '12px', marginRight: '5px' }} src={clock} alt="" draggable={false} />
<span>最近更新: {formatDate(item.update_time, 'YYYY-MM-DD')}</span>
</div>
</Flex>

2
react-ui/src/pages/Dataset/components/CategoryItem/index.tsx
View File

@ -23,12 +23,14 @@ function CategoryItem({ resourceType, item, isSelected, onClick }: CategoryItemP
style={{ width: '22px' }}
src={`/assets/images/${config.prefix}/${item.path}.png`}
alt=""
draggable={false}
/>
<img
className={styles['category-item__active-icon']}
style={{ width: '22px' }}
src={`/assets/images/${config.prefix}/${item.path}-hover.png`}
alt=""
draggable={false}
/>
<span className={styles['category-item__name']}>{item.name}</span>
</div>

9
react-ui/src/pages/Dataset/components/ResourceItem/index.tsx
View File

@ -39,11 +39,16 @@ function ResourceItem({ item, isPublic, onClick, onRemove }: ResourceItemProps)
<div className={styles['resource-item__description']}>{item.description}</div>
<Flex justify="space-between">
<div className={styles['resource-item__time']}>
<img style={{ width: '17px', marginRight: '6px' }} src={creatByImg} alt="" />
<img
style={{ width: '17px', marginRight: '6px' }}
src={creatByImg}
draggable={false}
alt=""
/>
<span>{item.create_by ?? ''}</span>
</div>
<div className={styles['resource-item__time']}>
<img style={{ width: '12px', marginRight: '5px' }} src={clock} alt="" />
<img style={{ width: '12px', marginRight: '5px' }} src={clock} draggable={false} alt="" />
<span>
{'最近更新: '}
{item.update_time ? formatDate(item.update_time, 'YYYY-MM-DD') : item.time_ago ?? ''}

8
react-ui/src/pages/Dataset/components/ResourcePage/index.tsx
View File

@ -18,8 +18,8 @@ function ResourcePage({ resourceType }: ResourcePageProps) {
const [activeTab, setActiveTab] = useState<string>(cacheState?.activeTab ?? CommonTabKeys.Public);
const [typeList, setTypeList] = useState<CategoryData[]>([]);
const [tagList, setTagList] = useState<CategoryData[]>([]);
const [activeType, setActiveType] = useState<number | undefined>(cacheState?.activeType);
const [activeTag, setActiveTag] = useState<number | undefined>(cacheState?.activeTag);
const [activeType, setActiveType] = useState<string | undefined>(cacheState?.activeType);
const [activeTag, setActiveTag] = useState<string | undefined>(cacheState?.activeTag);
const dataListRef = useRef<ResourceListRef>(null);
const config = resourceConfig[resourceType];
@ -34,12 +34,12 @@ function ResourcePage({ resourceType }: ResourcePageProps) {
// 选择类型
const chooseType = (record: CategoryData) => {
setActiveType((prev) => (prev === record.id ? undefined : record.id));
setActiveType((prev) => (prev === record.name ? undefined : record.name));
};
// 选择 Tag
const chooseTag = (record: CategoryData) => {
setActiveTag((prev) => (prev === record.id ? undefined : record.id));
setActiveTag((prev) => (prev === record.name ? undefined : record.name));
};
// 获取分类

2
react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx
View File

@ -116,6 +116,8 @@ function ExperimentInstanceComponent({
<img
style={{ width: '17px', marginRight: '7px' }}
src={experimentStatusInfo[item.status as ExperimentStatus]?.icon}
draggable={false}
alt=""
/>
<span
style={{ color: experimentStatusInfo[item.status as ExperimentStatus]?.color }}

7
react-ui/src/pages/Experiment/components/ExperimentStatusCell/index.tsx
View File

@ -14,7 +14,12 @@ function ExperimentStatusCell(status?: ExperimentStatus | null) {
}
return (
<div className={styles['experiment-status-cell']}>
<img style={{ width: '17px', marginRight: '7px' }} src={statusInfo[status]?.icon} />
<img
style={{ width: '17px', marginRight: '7px' }}
src={statusInfo[status]?.icon}
draggable={false}
alt=""
/>
<span
style={{ color: statusInfo[status]?.color }}
className={styles['experiment-status-cell__label']}

2
react-ui/src/pages/Experiment/components/TensorBoardStatus/index.tsx
View File

@ -70,6 +70,8 @@ function TensorBoardStatusCell({
className={styles['tensorBoard-status__icon']}
src={statusConfig[status].icon}
onClick={onClick}
draggable={false}
alt=""
/>
)}
</>

2
react-ui/src/pages/Experiment/index.jsx
View File

@ -385,6 +385,8 @@ function Experiment() {
style={{ width: '17px', marginRight: '6px' }}
key={index}
src={experimentStatusInfo[item].icon}
draggable={false}
alt=""
/>
);
})

1
react-ui/src/pages/Pipeline/components/ModelMenu/index.tsx
View File

@ -48,6 +48,7 @@ const ModelMenu = ({ onComponentDragEnd }: ModelMenuProps) => {
<img
style={{ height: '16px', marginRight: '15px' }}
src={`/assets/images/${ele.icon_path}.png`}
draggable={false}
alt=""
/>
)}

7
react-ui/src/pages/User/Center/components/AvatarCropper/index.tsx
View File

@ -116,7 +116,12 @@ const AvatarCropperForm: React.FC<AvatarCropperProps> = (props) => {
</Col>
<Col span={12} order={2}>
<div className={styles.avatarPreview}>
<img src={previewData} style={{ height: '100%', width: '100%' }} />
<img
src={previewData}
style={{ height: '100%', width: '100%' }}
draggable={false}
alt=""
/>
</div>
</Col>
</Row>

2
react-ui/src/pages/User/Center/index.tsx
View File

@ -141,7 +141,7 @@ const Center: React.FC = () => {
setCropperModalOpen(true);
}}
>
<img alt="" src={currentUser.avatar} />
<img src={currentUser.avatar} draggable={false} alt="" />
</div>
{renderUserInfo(currentUser)}
<Divider dashed />

5
react-ui/src/pages/User/Login/index.tsx
View File

@ -11,7 +11,7 @@ import styles from './login.less';
const LoginInputPrefix = ({ icon }: { icon: string }) => {
return (
<div className={styles['login-input-prefix']}>
<img className={styles['login-input-prefix__icon']} src={icon} alt="" />
<img className={styles['login-input-prefix__icon']} src={icon} alt="" draggable={false} />
<div className={styles['login-input-prefix__line']}></div>
</div>
);
@ -98,6 +98,7 @@ const Login = () => {
<img
src={require('@/assets/img/logo.png')}
style={{ width: '32px', marginRight: '12px' }}
draggable={false}
alt=""
/>
智能材料科研平台
@ -107,6 +108,7 @@ const Login = () => {
<img
src={require('@/assets/img/login-ai-logo.png')}
className={styles['user-login__left__title__img']}
draggable={false}
alt=""
/>
</div>
@ -116,6 +118,7 @@ const Login = () => {
<img
className={styles['user-login__left__bottom-img']}
src={require('@/assets/img/login-left-image.png')}
draggable={false}
alt=""
/>
</div>

2
react-ui/src/pages/Workspace/components/ExperimentTable/index.tsx
View File

@ -31,6 +31,8 @@ function ExperimentTable({ tableData = [], style }: ExperimentTableProps) {
src={experimentStatusInfo[item.status as ExperimentStatus]?.icon}
width={17}
height={17}
draggable={false}
alt=""
/>
</div>
<div className={styles['experiment-table__duration']}>

1
react-ui/src/pages/Workspace/components/QuickStart/WorkArrow.tsx
View File

@ -44,6 +44,7 @@ function WorkArrow({
<img
className={styles['work-arrow__img']}
src={require('@/assets/img/blue-triangle.png')}
draggable={false}
alt=""
width={10}
height={9}

2
react-ui/src/pages/Workspace/components/TotalStatistics/index.tsx
View File

@ -10,7 +10,7 @@ type TotalStatisticsProps = {
function TotalStatistics({ icon = '', title = '', count = 0, style }: TotalStatisticsProps) {
return (
<div className={styles['total-statistics']} style={style}>
<img className={styles['total-statistics__icon']} src={icon} />
<img className={styles['total-statistics__icon']} src={icon} draggable={false} alt="" />
<div>
<div className={styles['total-statistics__title']}>
<span>{title}</span>

20
react-ui/src/pages/Workspace/components/UserSpace/index.tsx
View File

@ -20,7 +20,15 @@ function UserSpace({ users = [] }: UserSpaceProps) {
className={styles['user-space__avatar']}
src={currentUser?.avatar}
alt=""
icon={<img src={require('@/assets/img/avatar-default.png')} width={56} height={56} />}
icon={
<img
src={require('@/assets/img/avatar-default.png')}
width={56}
height={56}
draggable={false}
alt=""
/>
}
></Avatar>
<div className={styles['user-space__name']}>{currentUser?.nickName}</div>
<div className={styles['user-space__role']}>{currentUser?.roleNames?.[0]?.roleName}</div>
@ -34,7 +42,7 @@ function UserSpace({ users = [] }: UserSpaceProps) {
<div className={styles['user-space__participant__count']}>8</div>
</Space>
<Flex align="center" gap={12} wrap="wrap">
{users?.map((item, index) => {
{users?.map((_item, index) => {
return (
<Avatar
key={index}
@ -42,7 +50,13 @@ function UserSpace({ users = [] }: UserSpaceProps) {
src={require(`@/assets/img/user-avatar/${index + 1}.png`)}
alt=""
icon={
<img src={require('@/assets/img/avatar-default.png')} width={36} height={36} />
<img
src={require('@/assets/img/avatar-default.png')}
width={36}
height={36}
draggable={false}
alt=""
/>
}
></Avatar>
);

18
react-ui/src/pages/Workspace/components/WorkspaceIntro/index.tsx
View File

@ -15,7 +15,13 @@ function WorkspaceIntro() {
type="primary"
style={{ marginRight: '20px' }}
icon={
<img src={require('@/assets/img/functional-material.png')} width={19} height={19} />
<img
src={require('@/assets/img/functional-material.png')}
width={19}
height={19}
draggable={false}
alt=""
/>
}
>
功能材料自主实验系统
@ -23,7 +29,13 @@ function WorkspaceIntro() {
<Button
type="default"
icon={
<img src={require('@/assets/img/molecular-material.png')} width={19} height={19} />
<img
src={require('@/assets/img/molecular-material.png')}
width={19}
height={19}
draggable={false}
alt=""
/>
}
>
分子材料自主实验系统
@ -34,6 +46,8 @@ function WorkspaceIntro() {
<img
className={styles['workspace-intro__icon']}
src={require('@/assets/img/workspace-intro-icon.png')}
draggable={false}
alt=""
/>
</div>
</div>

1
react-ui/src/pages/Workspace/index.less
View File

@ -53,6 +53,7 @@
width: 64px;
height: 64px;
background-color: white;
border-radius: 10px;
cursor: pointer;
}
}

3
react-ui/src/pages/Workspace/index.tsx
View File

@ -76,7 +76,8 @@ function Workspace() {
className={styles['workspace__robot-img']}
src={require('@/assets/img/robot.png')}
onClick={handleClick}
onDragStart={(e) => e.preventDefault()}
draggable={false}
alt=""
></img>
</Draggable>

1
react-ui/src/utils/ui.tsx
View File

@ -21,6 +21,7 @@ export function modalConfirm({ title, content, onOk, ...rest }: ModalFuncProps)
<img
src={require('@/assets/img/delete-icon.png')}
style={{ width: '120px', marginBottom: '24px' }}
draggable={false}
alt=""
/>
<div style={{ color: themes.textColor, fontSize: '16px', fontWeight: 500 }}>{title}</div>