Open cancan0200 opened 7 months ago
``import React, { useState } from 'react' import { DraggableGrid } from 'react-native-draggable-grid' import { getImageUrl } from '@utils' import { ScrollView } from '@tarojs/components' import _ from 'lodash'
import './index.rn.scss' import { View, Text, Image } from 'react-native'
export default function Drag(props: any) { const { handleClickAdd, handleClickDel, tabList } = props const [folderList, setFolderList] = useState(tabList)
const getTabName = (tab) => { return tab.folderName && tab.folderName.length > 5 ? tab.folderName.substr(0, 5) + '...' : tab.folderName }
const onItemPress = (item) => { console.log('item', item) if (item.folderId === 'add') { // 新增文件夹 handleClickAdd && handleClickAdd() } } const onClickDel = (item) => { handleClickDel && handleClickDel(item) } const renderItem = (item: any, order: number) => { const name = getTabName(item) const style = {}
if (order % 4 === 0) { style.borderLeftWidth = 1 } if (order === 0 || order === 1 || order === 2 || order === 3) { style.borderTopWidth = 1 } if (item.folderId === 'add') { style.borderWidth = 0 } return ( <View key={item.key} className='drag-item' style={style} > {item.key !== 'add' && <View className="drag-item-box" > <Text className='drag-item-text'>{name}</Text> </View> } {/* */} {item.key !== 'add' && <View className='drag-item-box-del' onClick={(item) => onClickDel(item)}> <Image className='drag-item-box-del-img' src={require('@assets/images/icon_upload_gray.png')} /> </View>} {item.key === 'add' && <View className='drag-item-add'> <Image className='drag-item-add-img' source={require('@assets/images/icon_upload_gray.png')} /> </View> } </View> )
}
const onDragRelease = (data) => { const { onDragRelease } = props setFolderList(data) onDragRelease && onDragRelease(data) } const dataList = _.cloneDeep(folderList).filter(item => item.folderId !== '*').map(item => { return { ...item, key: item.folderId } })
dataList.push({ folderId: 'add', disabledDrag: false }) return (
) }
``import React, { useState } from 'react' import { DraggableGrid } from 'react-native-draggable-grid' import { getImageUrl } from '@utils' import { ScrollView } from '@tarojs/components' import _ from 'lodash'
import './index.rn.scss' import { View, Text, Image } from 'react-native'
export default function Drag(props: any) { const { handleClickAdd, handleClickDel, tabList } = props const [folderList, setFolderList] = useState(tabList)
const getTabName = (tab) => { return tab.folderName && tab.folderName.length > 5 ? tab.folderName.substr(0, 5) + '...' : tab.folderName }
const onItemPress = (item) => { console.log('item', item) if (item.folderId === 'add') { // 新增文件夹 handleClickAdd && handleClickAdd() } } const onClickDel = (item) => { handleClickDel && handleClickDel(item) } const renderItem = (item: any, order: number) => { const name = getTabName(item) const style = {}
}
const onDragRelease = (data) => { const { onDragRelease } = props setFolderList(data) onDragRelease && onDragRelease(data) } const dataList = _.cloneDeep(folderList).filter(item => item.folderId !== '*').map(item => { return { ...item, key: item.folderId } })
dataList.push({ folderId: 'add', disabledDrag: false }) return (
) }