|
@@ -1,21 +1,51 @@
|
|
|
-import React, { useCallback, useMemo, useState } from 'react'
|
|
|
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
|
|
|
import { Button, Checkbox } from 'antd'
|
|
|
import MyTable from '@/components/MyTable'
|
|
|
import { Y33tableC } from '@/utils/tableData'
|
|
|
import ImageLazy from '@/components/ImageLazy'
|
|
|
import MyPopconfirm from '@/components/MyPopconfirm'
|
|
|
-import Y33setType from '../Y2look/Y33setType'
|
|
|
+import Y33setType, { infoType } from '../Y2look/Y33setType'
|
|
|
import YtableVideo from '@/components/YtableVideo'
|
|
|
import { GoodFileType } from '@/pages/B_enterTibet/B3goodsTable/B3GaddNew/type'
|
|
|
import { selectObj } from '@/utils/select'
|
|
|
import { fileImgArr, fileVideoArr } from '@/store/action/layout'
|
|
|
+import { resJiLianFu } from '@/utils/history'
|
|
|
+import { baseURL } from '@/utils/http'
|
|
|
+import { API_C2dels, API_C2downS, API_goodFileList } from '@/store/action/C2files'
|
|
|
+import { MessageFu } from '@/utils/message'
|
|
|
|
|
|
type Props = {
|
|
|
isLook?: boolean
|
|
|
+ sId: number
|
|
|
}
|
|
|
|
|
|
-function Y33com({ isLook }: Props) {
|
|
|
- const [btnAc, setBtnAc] = useState('全部')
|
|
|
+function Y33com({ isLook, sId }: Props) {
|
|
|
+ const [fileList, setFileList] = useState<GoodFileType[]>([])
|
|
|
+
|
|
|
+ const getListFu = useCallback(async () => {
|
|
|
+ const res = await API_goodFileList(sId)
|
|
|
+ if (res.code === 0) {
|
|
|
+ setFileList(res.data || [])
|
|
|
+ }
|
|
|
+ }, [sId])
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ getListFu()
|
|
|
+ }, [getListFu])
|
|
|
+
|
|
|
+ // 附件表格对象
|
|
|
+ const tableObj = useMemo(() => {
|
|
|
+ let obj: any = {
|
|
|
+ '': fileList
|
|
|
+ }
|
|
|
+ fileList.forEach(v => {
|
|
|
+ if (obj[v.type]) obj[v.type].push(v)
|
|
|
+ else obj[v.type] = [v]
|
|
|
+ })
|
|
|
+ return obj
|
|
|
+ }, [fileList])
|
|
|
+
|
|
|
+ const [btnAc, setBtnAc] = useState('')
|
|
|
|
|
|
// 多选
|
|
|
const [checkArr, setCheckArr] = useState<number[]>([])
|
|
@@ -40,8 +70,9 @@ function Y33com({ isLook }: Props) {
|
|
|
)
|
|
|
})
|
|
|
|
|
|
- if (['全部', '图像', '视频'].includes(btnAc))
|
|
|
- arr.push({
|
|
|
+ return [
|
|
|
+ ...arr,
|
|
|
+ {
|
|
|
width: 100,
|
|
|
title: '缩略图/视频',
|
|
|
render: (item: GoodFileType) => {
|
|
@@ -58,20 +89,39 @@ function Y33com({ isLook }: Props) {
|
|
|
' - '
|
|
|
)
|
|
|
}
|
|
|
- })
|
|
|
-
|
|
|
- return arr
|
|
|
- }, [btnAc, checkArr, checkFu, isLook])
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '附件类型',
|
|
|
+ render: (item: GoodFileType) => selectObj['附件类型'].find(v => v.key === item.type)?.name
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '附件用途',
|
|
|
+ render: (item: GoodFileType) => (item.effect ? resJiLianFu(item.effect) : '(空)')
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, [checkArr, checkFu, isLook])
|
|
|
+
|
|
|
+ // 点击删除
|
|
|
+ const delFu = useCallback(
|
|
|
+ async (data: number[]) => {
|
|
|
+ const res = await API_C2dels(data)
|
|
|
+ if (res.code === 0) {
|
|
|
+ MessageFu.success('删除成功')
|
|
|
+ getListFu()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ [getListFu]
|
|
|
+ )
|
|
|
|
|
|
const tableLastBtn = useMemo(() => {
|
|
|
return [
|
|
|
{
|
|
|
title: '操作',
|
|
|
- render: (item: any) => {
|
|
|
+ render: (item: GoodFileType) => {
|
|
|
return (
|
|
|
<>
|
|
|
<Button size='small' type='text'>
|
|
|
- <a href={item.src} download target='_blank' rel='noreferrer'>
|
|
|
+ <a href={baseURL + item.filePath} download target='_blank' rel='noreferrer'>
|
|
|
下载
|
|
|
</a>
|
|
|
</Button>
|
|
@@ -82,16 +132,16 @@ function Y33com({ isLook }: Props) {
|
|
|
type='text'
|
|
|
onClick={() =>
|
|
|
setTypeMo({
|
|
|
- leiXin: item.type,
|
|
|
- yongTu: '',
|
|
|
- flag: '单个',
|
|
|
- show: true
|
|
|
+ ids: [item.id],
|
|
|
+ type: item.type,
|
|
|
+ effect: item.effect,
|
|
|
+ flag: '单个'
|
|
|
})
|
|
|
}
|
|
|
>
|
|
|
设置
|
|
|
</Button>
|
|
|
- <MyPopconfirm txtK='删除' onConfirm={() => {}} />
|
|
|
+ <MyPopconfirm txtK='删除' onConfirm={() => delFu([item.id])} />
|
|
|
</>
|
|
|
) : null}
|
|
|
</>
|
|
@@ -99,9 +149,29 @@ function Y33com({ isLook }: Props) {
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
- }, [isLook])
|
|
|
-
|
|
|
- const [typeMo, setTypeMo] = useState({ leiXin: '', yongTu: '', flag: '', show: false })
|
|
|
+ }, [delFu, isLook])
|
|
|
+
|
|
|
+ const [typeMo, setTypeMo] = useState({} as infoType)
|
|
|
+
|
|
|
+ // 点击批量下载
|
|
|
+ const downsFu = useCallback(async () => {
|
|
|
+ const res = await API_C2downS(checkArr)
|
|
|
+ if (res.code === 0) {
|
|
|
+ MessageFu.success('下载成功')
|
|
|
+ // 动态创建 a 标签
|
|
|
+ const link = document.createElement('a')
|
|
|
+ link.href = baseURL + res.data
|
|
|
+ link.style.display = 'none'
|
|
|
+
|
|
|
+ // 插入 DOM 并触发点击
|
|
|
+ document.body.appendChild(link)
|
|
|
+ link.click()
|
|
|
+
|
|
|
+ // 清理
|
|
|
+ document.body.removeChild(link)
|
|
|
+ setCheckArr([])
|
|
|
+ }
|
|
|
+ }, [checkArr])
|
|
|
|
|
|
return (
|
|
|
<div className='Y33com'>
|
|
@@ -109,9 +179,9 @@ function Y33com({ isLook }: Props) {
|
|
|
<div className='Y33topll'>
|
|
|
{[{ name: '全部', key: '' }, ...selectObj['附件类型']].map(v => (
|
|
|
<Button
|
|
|
- key={v.name}
|
|
|
- onClick={() => setBtnAc(v.name)}
|
|
|
- type={btnAc === v.name ? 'primary' : 'default'}
|
|
|
+ key={v.key}
|
|
|
+ onClick={() => setBtnAc(v.key)}
|
|
|
+ type={btnAc === v.key ? 'primary' : 'default'}
|
|
|
>
|
|
|
{v.name}
|
|
|
</Button>
|
|
@@ -119,7 +189,7 @@ function Y33com({ isLook }: Props) {
|
|
|
</div>
|
|
|
{isLook ? (
|
|
|
<div className='Y33toprr'>
|
|
|
- <Button type='primary' disabled={checkArr.length === 0}>
|
|
|
+ <Button type='primary' disabled={checkArr.length === 0} onClick={downsFu}>
|
|
|
批量下载
|
|
|
</Button>
|
|
|
 
|
|
@@ -128,10 +198,10 @@ function Y33com({ isLook }: Props) {
|
|
|
disabled={checkArr.length === 0}
|
|
|
onClick={() =>
|
|
|
setTypeMo({
|
|
|
- leiXin: '',
|
|
|
- yongTu: '',
|
|
|
- flag: '批量',
|
|
|
- show: true
|
|
|
+ ids: checkArr,
|
|
|
+ type: '',
|
|
|
+ effect: '',
|
|
|
+ flag: '多个'
|
|
|
})
|
|
|
}
|
|
|
>
|
|
@@ -145,29 +215,16 @@ function Y33com({ isLook }: Props) {
|
|
|
<MyTable
|
|
|
classKey='Y33comTable'
|
|
|
yHeight={isLook ? 640 : 666}
|
|
|
- list={[
|
|
|
- {
|
|
|
- id: 1,
|
|
|
- type: '图像',
|
|
|
- fileName: 'https://houseoss.4dkankan.com/project/DEMO/staticResource/touxiang.jpg'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- type: '视频',
|
|
|
- fileName: 'https://houseoss.4dkankan.com/project/DEMO/staticResource/loop.mp4'
|
|
|
- },
|
|
|
- {
|
|
|
- id: 3,
|
|
|
- type: '3D'
|
|
|
- }
|
|
|
- ]}
|
|
|
- columnsTemp={Y33tableC('详情')}
|
|
|
+ list={tableObj[btnAc] || []}
|
|
|
+ columnsTemp={Y33tableC('新增')}
|
|
|
lastBtn={tableLastBtn}
|
|
|
startBtn={startBtn}
|
|
|
pagingInfo={false}
|
|
|
/>
|
|
|
|
|
|
- {typeMo.show ? <Y33setType info={typeMo} closeFu={() => setTypeMo({} as any)} /> : null}
|
|
|
+ {typeMo.flag ? (
|
|
|
+ <Y33setType succFu={getListFu} info={typeMo} closeFu={() => setTypeMo({} as infoType)} />
|
|
|
+ ) : null}
|
|
|
</div>
|
|
|
)
|
|
|
}
|