duxingchen/KCGL
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改拍照的大小以及增加放大缩小编辑等功能

Browse Source
This commit is contained in:
dxc
2026-02-10 09:59:32 +08:00
parent a0ed92319c
commit 2d0593078b
3 changed files with 425 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
inventory-web/src/views/stock/inbound/product.vue
View File

@ -353,7 +353,7 @@
<script setup lang="ts">
import { ref, reactive, onMounted, watch } from 'vue'
import { Plus, Setting, Refresh, Search, Box, House, Link, InfoFilled, Printer, Camera, Picture } from '@element-plus/icons-vue'
// 修复：引入 ElLoading
// 修复点：引入 ElLoading
import { ElMessage, ElLoading } from 'element-plus'
import dayjs from 'dayjs'
import { getProductList, createProductInbound, updateProductInbound, deleteProductInbound, searchMaterialBase } from '@/api/inbound/product'
@ -389,6 +389,7 @@ const inspectionFileList = ref<any[]>([]) // 检测报告
const cameraDialogVisible = ref(false)
const cameraRef = ref<InstanceType<typeof WebRtcCamera> | null>(null)
// 定义当前触发拍照的字段
const currentCameraField = ref<'product_photo' | 'quality_report_link' | 'inspection_report_link'>('product_photo')
const quality_url = ref('')
const inspection_url = ref('')
@ -573,6 +574,10 @@ const triggerCamera = (field: any) => {
currentCameraField.value = field;
cameraDialogVisible.value = true;
}
// ------------------------------------------------------------------------
// 修复核心：拍照上传回调逻辑
// ------------------------------------------------------------------------
const handleCameraConfirm = async (file: File) => {
if (!beforeAvatarUpload(file)) {
cameraDialogVisible.value = false;
@ -581,23 +586,33 @@ const handleCameraConfirm = async (file: File) => {
const formData = new FormData();
formData.append('file', file);
// 修复点：使用 ElLoading
const loadingMsg = ElLoading.service({ text: '照片上传中...', background: 'rgba(0, 0, 0, 0.7)' });
// 使用 ElLoading.service 替代报错的 ElMessage.loading
const loadingMsg = ElLoading.service({
lock: true,
text: '照片处理中...',
background: 'rgba(0, 0, 0, 0.7)'
});
let success = false;
try {
const res: any = await uploadFile(formData);
if (res.code === 200) {
const newUrl = res.data.url;
const field = currentCameraField.value;
const field = currentCameraField.value; // 根据触发时记录的字段
// 添加到表单数据
form[field].push(newUrl);
// 更新对应的显示列表
const previewItem = { name: newUrl.split('/').pop(), url: getImageUrl(newUrl) };
if (field === 'product_photo') {
productPhotoList.value.push({ name: newUrl.split('/').pop(), url: getImageUrl(newUrl) });
productPhotoList.value.push(previewItem);
} else if (field === 'quality_report_link') {
qualityFileList.value.push({ name: newUrl.split('/').pop(), url: getImageUrl(newUrl) });
qualityFileList.value.push(previewItem);
} else if (field === 'inspection_report_link') {
inspectionFileList.value.push({ name: newUrl.split('/').pop(), url: getImageUrl(newUrl) });
inspectionFileList.value.push(previewItem);
}
ElMessage.success('拍照上传成功');
success = true;
} else {