Files
template-10519/src/hjm/violation/Items.tsx
赵忠林 52d2d7c773 feat(violation):重构违章列表页面并新增组件- 移除原有列表展示逻辑,使用Items组件渲染列表项
- 新增FixedButton组件用于底部固定按钮- 实现无限滚动加载功能替换原有分页
- 调整搜索栏样式和位置,优化用户体验- 根据用户角色过滤数据展示内容- 添加车辆图片字段支持
- 注释掉处理状态选择功能,待后续完善
2025-10-29 14:41:47 +08:00

60 lines
2.4 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import {useEffect} from "react";
import {Image, Space,Button} from '@nutui/nutui-react-taro'
import Taro from '@tarojs/taro'
import {View} from '@tarojs/components'
import {HjmViolation} from "@/api/hjm/hjmViolation/model";
import navTo from "@/utils/common";
interface BestSellersProps {
data: HjmViolation[];
}
const BestSellers = (props: BestSellersProps) => {
const reload = () => {
// 可以在这里添加重新加载逻辑
}
useEffect(() => {
reload()
}, [])
return (
<View className={'px-2 mb-4'}>
<View className={'flex flex-col justify-between items-center rounded-lg px-3'}>
{props.data?.map((item, index) => {
return (
<View key={item.id || index} className={'flex bg-white rounded-lg w-full p-3 mb-3'}
onClick={() => Taro.navigateTo({url: `/hjm/violation/detail?id=${item.code}`})}>
<View className={'flex flex-col'}>
<Image src={item.image && JSON.parse(item.image)[0].url} mode={'scaleToFill'}
radius="10%" width="70" height="70" className={'mb-1'}/>
{item.userId == Taro.getStorageSync('UserId') && (
<Button type={'default'} size="small" onClick={() => navTo(`/hjm/violation/add?id=${item.id}`)}></Button>
)}
</View>
<View className={'mx-3 flex flex-col'}>
<Space direction={'vertical'}>
<View className={'car-no text-lg font-bold'}>{item.title}</View>
<View className={'flex text-xs text-gray-500'}><span
className={'text-gray-700'}>{item.code}</span></View>
<View className={'flex text-xs text-gray-500'}><span
className={'text-gray-700'}>{item.comments}</span></View>
<View className={'flex text-xs text-gray-500'}><span
className={'text-gray-700'}>{item.createTime}</span></View>
</Space>
</View>
</View>
)
})}
{(!props.data || props.data.length === 0) && (
<View className={'flex justify-center items-center py-10'}>
<View className={'text-gray-500 text-sm'}></View>
</View>
)}
</View>
<View style={{height: '170px'}}></View>
</View>
)
}
export default BestSellers