|
@@ -101,10 +101,19 @@ const SelectCloudNew: React.FC<CLOUDNEW.SelectCloudNewProps> = ({ visible, defau
|
|
// 选择
|
|
// 选择
|
|
const onCheckboxChange = (checked: boolean, item: any) => {
|
|
const onCheckboxChange = (checked: boolean, item: any) => {
|
|
let newCheckedFolderList: any[] = JSON.parse(JSON.stringify(checkedFolderList))
|
|
let newCheckedFolderList: any[] = JSON.parse(JSON.stringify(checkedFolderList))
|
|
- if (checked) { // 选中
|
|
|
|
- newCheckedFolderList.push({ ...item, materialType: 0 })
|
|
|
|
- } else { // 取消
|
|
|
|
- newCheckedFolderList = newCheckedFolderList.filter(i => i.id !== item.id)
|
|
|
|
|
|
+ if (active || active === 0) {
|
|
|
|
+ if (checked) { // 选中
|
|
|
|
+ newCheckedFolderList[active] = { ...item, materialType: 0 }
|
|
|
|
+ } else { // 取消
|
|
|
|
+ message.warning('请选择其他图片替换')
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ if (checked) { // 选中
|
|
|
|
+ newCheckedFolderList.push({ ...item, materialType: 0 })
|
|
|
|
+ } else { // 取消
|
|
|
|
+ newCheckedFolderList = newCheckedFolderList.filter(i => i.id !== item.id)
|
|
|
|
+ }
|
|
}
|
|
}
|
|
setCheckedFolderList(newCheckedFolderList)
|
|
setCheckedFolderList(newCheckedFolderList)
|
|
};
|
|
};
|
|
@@ -138,7 +147,7 @@ const SelectCloudNew: React.FC<CLOUDNEW.SelectCloudNewProps> = ({ visible, defau
|
|
{checkedFolderList.length > 0 ? <>
|
|
{checkedFolderList.length > 0 ? <>
|
|
<div className={style.selectedCloud}>
|
|
<div className={style.selectedCloud}>
|
|
<div style={{ width: checkedFolderList.length * 58 + (checkedFolderList.length - 1) * 8 }}>
|
|
<div style={{ width: checkedFolderList.length * 58 + (checkedFolderList.length - 1) * 8 }}>
|
|
- {checkedFolderList.map((item, index) => <div key={item.id} className={`${style.selectedCloud_col} ${active === index ? style.active : ''}`} onClick={() => setActive(index)}>
|
|
|
|
|
|
+ {checkedFolderList.map((item, index) => <div key={item.id + '_' + index} className={`${style.selectedCloud_col} ${active === index ? style.active : ''}`} onClick={() => isGroup && setActive(index)}>
|
|
<div className={style.cz}>
|
|
<div className={style.cz}>
|
|
{item.material_type === 'video' && <PlayVideo videoUrl={item.oss_url}>{(onPlay) => <a onClick={onPlay}><PlayCircleOutlined /></a>}</PlayVideo>}
|
|
{item.material_type === 'video' && <PlayVideo videoUrl={item.oss_url}>{(onPlay) => <a onClick={onPlay}><PlayCircleOutlined /></a>}</PlayVideo>}
|
|
<a style={{ color: 'red' }} onClick={() => setCheckedFolderList(data => data.filter(i => i.id !== item.id))}><DeleteOutlined /></a>
|
|
<a style={{ color: 'red' }} onClick={() => setCheckedFolderList(data => data.filter(i => i.id !== item.id))}><DeleteOutlined /></a>
|
|
@@ -147,6 +156,7 @@ const SelectCloudNew: React.FC<CLOUDNEW.SelectCloudNewProps> = ({ visible, defau
|
|
</div>)}
|
|
</div>)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
+ {!!active && <a style={{ color: 'red' }} onClick={() => setActive(undefined)}>清除单独修改</a>}
|
|
<a style={{ color: 'red' }} onClick={() => setCheckedFolderList([])}>清除所有</a>
|
|
<a style={{ color: 'red' }} onClick={() => setCheckedFolderList([])}>清除所有</a>
|
|
</> : <div></div>}
|
|
</> : <div></div>}
|
|
<Space>
|
|
<Space>
|
|
@@ -197,7 +207,7 @@ const SelectCloudNew: React.FC<CLOUDNEW.SelectCloudNewProps> = ({ visible, defau
|
|
}
|
|
}
|
|
setCheckedFolderList(newCheckedFolderList)
|
|
setCheckedFolderList(newCheckedFolderList)
|
|
}}
|
|
}}
|
|
- disabled={checkedFolderList?.length >= num || !!active}
|
|
|
|
|
|
+ disabled={checkedFolderList?.length >= num || !!active || active === 0}
|
|
indeterminate={indeterminateFolder}
|
|
indeterminate={indeterminateFolder}
|
|
checked={checkFolderAll}
|
|
checked={checkFolderAll}
|
|
>全选</Checkbox>
|
|
>全选</Checkbox>
|
|
@@ -273,11 +283,11 @@ const SelectCloudNew: React.FC<CLOUDNEW.SelectCloudNewProps> = ({ visible, defau
|
|
<Spin spinning={getMaterialDataList.loading}>
|
|
<Spin spinning={getMaterialDataList.loading}>
|
|
<div className={style.content_scroll} ref={ref} {...dropAreaProps}>
|
|
<div className={style.content_scroll} ref={ref} {...dropAreaProps}>
|
|
{isDragOver && <div className={`${style.placeholder} ${isDragOver ? style.dragOver : ''}`}><span>拖动文件到这里</span></div>}
|
|
{isDragOver && <div className={`${style.placeholder} ${isDragOver ? style.dragOver : ''}`}><span>拖动文件到这里</span></div>}
|
|
- {getMaterialDataList?.data?.records?.length > 0 ? <Checkbox.Group value={checkedFolderList?.map(item => item.id)} style={{ width: '100%' }}>
|
|
|
|
|
|
+ {getMaterialDataList?.data?.records?.length > 0 ? <Checkbox.Group value={checkedFolderList?.filter((_, index) => (active || active === 0) ? index === active : true)?.map(item => item.id)} style={{ width: '100%' }}>
|
|
<div className={style.content_scroll_div}>
|
|
<div className={style.content_scroll_div}>
|
|
{getMaterialDataList?.data?.records.map((item: any) => {
|
|
{getMaterialDataList?.data?.records.map((item: any) => {
|
|
- const isSelect = checkedFolderList?.map(item => item.id).includes(item.id)
|
|
|
|
- const disabled = checkedFolderList.length >= num && !isSelect
|
|
|
|
|
|
+ const isSelect = checkedFolderList?.filter((_, index) => (active || active === 0) ? index === active : true)?.map(item => item.id).includes(item.id)
|
|
|
|
+ const disabled = (active || active === 0) ? false : (checkedFolderList.length >= num && !isSelect)
|
|
return <div key={item.id} className={style.content_row} style={{ width: rowNum ? (1 / rowNum * 100) + '%' : 200 }}>
|
|
return <div key={item.id} className={style.content_row} style={{ width: rowNum ? (1 / rowNum * 100) + '%' : 200 }}>
|
|
<Card
|
|
<Card
|
|
hoverable
|
|
hoverable
|
|
@@ -362,6 +372,8 @@ const SelectCloudNew: React.FC<CLOUDNEW.SelectCloudNewProps> = ({ visible, defau
|
|
setCheckedFolderList={setCheckedFolderList}
|
|
setCheckedFolderList={setCheckedFolderList}
|
|
accountCreateLogs={accountCreateLogs}
|
|
accountCreateLogs={accountCreateLogs}
|
|
putInType={putInType}
|
|
putInType={putInType}
|
|
|
|
+ active={active}
|
|
|
|
+ setActive={setActive}
|
|
/>}
|
|
/>}
|
|
|
|
|
|
|
|
|