From 6a700e9d4b6274343dd5e0e00398d989251973da Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com> Date: Sun, 15 Jun 2025 00:43:58 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=EF=BC=9A=E4=BF=9D=E9=99=A9?= =?UTF-8?q?=E6=94=AF=E6=8C=815=E5=BC=A0=E5=9B=BE=E7=89=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hjm/BestSellers.tsx | 6 +- src/hjm/bx/bx-add.tsx | 28 ++- src/hjm/bx/bx.tsx | 61 +++--- src/hjm/location.tsx | 8 +- src/hjm/query.tsx | 302 +++++++++++++++++++++++++++--- src/hjm/trajectory/trajectory.tsx | 8 +- src/user/car/BestSellers.tsx | 6 +- 7 files changed, 350 insertions(+), 69 deletions(-) diff --git a/src/hjm/BestSellers.tsx b/src/hjm/BestSellers.tsx index fceddf9..1ab0a97 100644 --- a/src/hjm/BestSellers.tsx +++ b/src/hjm/BestSellers.tsx @@ -18,8 +18,10 @@ const BestSellers = (props: any) => { return (
Taro.navigateTo({url: '/hjm/query?id=' + item.code})}> - + { item.image && ( + + )}
{item.code}
diff --git a/src/hjm/bx/bx-add.tsx b/src/hjm/bx/bx-add.tsx index d0d6bfc..1b4fcf3 100644 --- a/src/hjm/bx/bx-add.tsx +++ b/src/hjm/bx/bx-add.tsx @@ -29,6 +29,7 @@ function BxAdd() { const [bxFiled2, setBxFiled2] = useState() const [carInfo, setCarInfo] = useState(null) const [fileList, setFileList] = useState([]) // 图片文件列表 + const [lastSubmitTime, setLastSubmitTime] = useState(0) // 最后提交时间 const [formData, setFormData] = useState({ carId: undefined, accidentType: undefined, @@ -64,7 +65,6 @@ function BxAdd() { }) pageHjmCar({driverId: Taro.getStorageSync('UserId')}).then(res => { const car = res?.list[0]; - setLoading(true) if (car) { setCarInfo(car) setFormData(prev => ({ @@ -217,6 +217,26 @@ function BxAdd() { // 提交表单 const handleSubmit = async () => { + // 防止重复提交 - 检查loading状态 + if (loading) { + Taro.showToast({ + title: '正在提交中，请稍候...', + icon: 'loading' + }) + return + } + + // 防止快速连续点击 - 2秒内不允许重复提交 + const now = Date.now() + if (now - lastSubmitTime < 2000) { + Taro.showToast({ + title: '请勿频繁提交', + icon: 'none' + }) + return + } + setLastSubmitTime(now) + // 表单验证 if (!formData.carId) { Taro.showToast({ @@ -278,6 +298,8 @@ function BxAdd() { icon: 'success' }) + formData.image = '' + setTimeout(() => { Taro.navigateBack() }, 2000) @@ -513,9 +535,11 @@ function BxAdd() {
diff --git a/src/hjm/bx/bx.tsx b/src/hjm/bx/bx.tsx index 5a7ac74..2dcf256 100644 --- a/src/hjm/bx/bx.tsx +++ b/src/hjm/bx/bx.tsx @@ -13,6 +13,7 @@ import Taro from '@tarojs/taro' import {pageHjmBxLog} from "@/api/hjm/hjmBxLog"; import {HjmBxLog} from "@/api/hjm/hjmBxLog/model"; + /** * 报险记录列表页面 */ @@ -45,7 +46,12 @@ const Bx: React.FC = () => { keywords: keywords.trim() }) - setList(res?.list || []) + setList(res?.list.map(d => { + console.log(d,'ddd') + d.image = JSON.parse(d.image); + console.log(d) + return d; + }) || []) } catch (error) { console.error('获取报险记录失败:', error) Taro.showToast({ @@ -227,14 +233,16 @@ const Bx: React.FC = () => { {/* 事故照片预览 */} {item.image && ( -
- +
+ {item.image.map((image) => ( + + ))}
)} @@ -262,27 +270,20 @@ const Bx: React.FC = () => {
{/* 浮动添加按钮 */} -
- -
+ {/*
*/} + {/* */} + {/* 一键报险*/} + {/* */} + {/*
*/} ) } diff --git a/src/hjm/location.tsx b/src/hjm/location.tsx index 768cd4f..7b62418 100644 --- a/src/hjm/location.tsx +++ b/src/hjm/location.tsx @@ -3,7 +3,7 @@ import {Map} from '@tarojs/components' import {Search} from '@nutui/icons-react-taro' import {Button, Input} from '@nutui/nutui-react-taro' import {useRouter} from '@tarojs/taro' -import {getHjmCar, getHjmCarByCode} from "@/api/hjm/hjmCar"; +import {getHjmCarByCode} from "@/api/hjm/hjmCar"; import {HjmCar} from "@/api/hjm/hjmCar/model"; import './location.scss' @@ -50,7 +50,7 @@ const Location = () => { } const reload = () => { - const id = Number(params.id); + const code = params.id; setScale(14) // 执行搜索 if (keywords) { @@ -74,8 +74,8 @@ const Location = () => { return false; } // 获取车辆信息 - if (id) { - getHjmCar(id).then(data => { + if (code) { + getHjmCarByCode(code).then(data => { setItem(data) setLatitude(data.latitude) setLongitude(data.longitude) diff --git a/src/hjm/query.tsx b/src/hjm/query.tsx index 950914d..c9cda8d 100644 --- a/src/hjm/query.tsx +++ b/src/hjm/query.tsx @@ -2,7 +2,8 @@ import {useEffect, useState} from "react"; import Taro, {useRouter} from '@tarojs/taro' import {getHjmCarByCode, pageHjmCar, updateHjmCar} from "@/api/hjm/hjmCar"; import {HjmCar} from "@/api/hjm/hjmCar/model"; -import './location.scss' +import './location.scss'; +import { Swiper } from '@nutui/nutui-react-taro' import {copyText} from "@/utils/common"; import {View} from '@tarojs/components' import { @@ -13,11 +14,21 @@ import { Cell, Image } from '@nutui/nutui-react-taro' +import { ImagePreview } from '@nutui/nutui-react-taro' import {Scan} from '@nutui/icons-react-taro' import {pageDictData} from "@/api/system/dict-data"; import {DictData} from "@/api/system/dict-data/model"; import {myUserVerify} from "@/api/system/userVerify"; -import {uploadFile} from "@/api/system/file"; + +// 图片数据接口 +interface UploadedImageData { + url?: string; + src?: string; + name?: string; + uid?: string; + message?: string; + type?: string; +} /** * 文章终极列表 @@ -28,6 +39,8 @@ const Query = () => { const [keywords, setKeywords] = useState() const [dict, setDict] = useState([]) const [adminId, setAdminId] = useState() + const [showPreview, setShowPreview] = useState(false) + const [fileList, setFileList] = useState([]) // 图片文件列表 const [FormData, setFormData] = useState( { // 自增ID @@ -135,25 +148,133 @@ const Query = () => { }); } - // 拍照上传功能 - const takePhoto = () => { - uploadFile().then(res => { - setFormData({ - ...FormData, - image: res.url + // 选择并上传图片 + const handleChooseImage = () => { + if (fileList.length >= 5) { + Taro.showToast({ + title: '最多只能上传5张图片', + icon: 'none' }) + return + } + + Taro.chooseImage({ + count: 5 - fileList.length, // 剩余可选择的数量 + sizeType: ['compressed'], + sourceType: ['album', 'camera'], + success: (res) => { + console.log('选择图片成功:', res) + + // 逐个上传选中的图片 + res.tempFilePaths.forEach((filePath, index) => { + uploadSingleImage(filePath, index) + }) + }, + fail: (err) => { + console.log('选择图片失败:', err) + Taro.showToast({ + title: '选择图片失败', + icon: 'error' + }) + } }) } - // 删除图片 - // const removeImage = (index: number) => { - // const newImages = uploadedImages.filter((_, i) => i !== index); - // setUploadedImages(newImages); - // setFormData({ - // ...FormData, - // image: newImages.join(',') - // }); - // } + // 上传单张图片 + const uploadSingleImage = (filePath: string, index: number) => { + const TenantId = Taro.getStorageSync('TenantId') + + Taro.uploadFile({ + url: 'https://server.gxwebsoft.com/api/oss/upload', + filePath: filePath, + name: 'file', + header: { + 'content-type': 'application/json', + TenantId + }, + success: (res) => { + try { + const data = JSON.parse(res.data); + console.log('上传成功', data) + if (data.code === 0) { + // 更新文件列表 + const newFile = { + name: `图片${Date.now()}_${index}`, + url: data.data.url, + status: 'success', + message: '上传成功', + type: 'image', + uid: `${Date.now()}_${index}`, + } + + setFileList(prev => { + const newList = [...prev, newFile] + // 同时更新表单数据 - 使用JSON格式存储 + const imageData: UploadedImageData[] = newList.map(f => ({ + url: f.url, + name: f.name, + uid: f.uid + })) + setFormData(prevForm => ({ + ...prevForm, + image: JSON.stringify(imageData) + })) + return newList + }) + + Taro.showToast({ + title: '上传成功', + icon: 'success' + }) + } else { + Taro.showToast({ + title: data.message || '上传失败', + icon: 'error' + }) + } + } catch (error) { + console.error('解析响应失败:', error) + Taro.showToast({ + title: '上传失败', + icon: 'error' + }) + } + }, + fail: (err) => { + console.log('上传请求失败', err); + Taro.showToast({ + title: '上传失败', + icon: 'error' + }) + } + }) + } + + // 处理文件删除 + const handleFileRemove = (file: any) => { + console.log('删除文件:', file) + const newFileList = fileList.filter(f => f.uid !== file.uid) + setFileList(newFileList) + + // 更新表单数据 - 使用JSON格式存储 + if (newFileList.length === 0) { + setFormData(prev => ({ + ...prev, + image: undefined + })) + } else { + const imageData: UploadedImageData[] = newFileList.map(f => ({ + url: f.url, + src: f.url, + name: f.name, + uid: f.uid + })) + setFormData(prev => ({ + ...prev, + image: JSON.stringify(imageData) + })) + } + } // 打开地图选择位置 // const chooseLocation = async () => { @@ -197,6 +318,29 @@ const Query = () => { if(data){ setFormData(data) setKeywords(data.code) + + // 解析图片数据 + if (data.image) { + try { + const parsedImages: UploadedImageData[] = JSON.parse(data.image) + setFileList(parsedImages.map((img) => ({ + url: img.url, + src: img.url + }))) + } catch (error) { + // 如果解析失败，可能是旧格式的单个URL + if (typeof data.image === 'string' && data.image.trim()) { + setFileList([{ + src: data.image, + url: data.image, + message: '上传成功', + type: 'image', + uid: `legacy_${Date.now()}`, + }]) + } + } + } + if (data.status == 0) { Taro.setNavigationBarTitle({ title: '安装设备' @@ -326,11 +470,90 @@ const Query = () => { name="image" required rules={[{message: '请上传照片'}]} - onClick={takePhoto} > -
- +
+ {/* 显示已上传的图片 */} + {fileList.map((file) => ( +
+ {file.name} + +
+ ))} + + {/* 添加图片按钮 */} + {fileList.length < 5 && ( +
+ + + + 添加图片 + +
+ )} + + {/* 显示上传数量提示 */} + {fileList.length > 0 && ( +
+ 已上传{fileList.length}张图片（最多5张） +
+ )}
@@ -349,7 +572,36 @@ const Query = () => { {/* 已安装 */} {FormData?.status == 1 ? (
- + {/* 显示多张图片 */} +
+ setShowPreview(false)} + /> + + {fileList.map((item) => ( + // @ts-ignore + + setShowPreview(true)} + src={item.url} + /> + + ))} + +
copyText(`${FormData?.code}`)}> 车辆编号：{FormData?.code} @@ -372,11 +624,11 @@ const Query = () => { 电子围栏：{FormData.fenceName} -
+