|
|
@@ -83,14 +83,42 @@
|
|
|
</el-table-column>
|
|
|
<el-table-column label="样式照片" min-width="420" align="center">
|
|
|
<template #default="{ row }">
|
|
|
- <span v-if="isViewMode || isAuditMode">{{ getStylePhotoDisplay(row) }}</span>
|
|
|
- <UploadFiles
|
|
|
+ <!-- <span v-if="isViewMode || isAuditMode">{{ getStylePhotoDisplay(row) }}</span> -->
|
|
|
+ <!-- <UploadFiles
|
|
|
v-else
|
|
|
- label="选择附件"
|
|
|
+ label="选择附件"
|
|
|
:file-list="getRowFileList(row)"
|
|
|
:max-count="1"
|
|
|
@uploadSuccess="(list: FileItem[]) => onStylePhotoSuccess(row, list)"
|
|
|
- />
|
|
|
+ /> -->
|
|
|
+ <el-upload
|
|
|
+ :key="row.id || row.$$uid || $index"
|
|
|
+ :ref="el => setUploadRef(row, el)"
|
|
|
+ v-model:file-list="row.pictureUrl"
|
|
|
+ :auto-upload="false"
|
|
|
+ list-type="picture-card"
|
|
|
+ :limit="1"
|
|
|
+ :disabled="isViewMode"
|
|
|
+ :on-change="(file) => handleApprovalImageChange(row, file)"
|
|
|
+ :on-exceed="handleApprovalImageExceed"
|
|
|
+ :on-remove="() => handleApprovalImageRemove(row)"
|
|
|
+ :class="{'hide': isViewMode}"
|
|
|
+ >
|
|
|
+ <el-icon><Plus /></el-icon>
|
|
|
+ <template #file="{ file }">
|
|
|
+ <div>
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.fileUrl" alt="" />
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-preview" v-if="isViewMode" @click="previewOnline(file.fileUrl)">
|
|
|
+ <el-icon><ZoomIn /></el-icon>
|
|
|
+ </span>
|
|
|
+ <span class="el-upload-list__item-delete" v-if="!isViewMode" @click.stop="handleApprovalDeleteClick()">
|
|
|
+ <el-icon><Delete /></el-icon>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-upload>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="物品尺寸/鞋码" min-width="150">
|
|
|
@@ -143,13 +171,14 @@
|
|
|
<el-table-column label="商品编号" min-width="150">
|
|
|
<template #default="{ row }">
|
|
|
<!-- v-if="isViewMode || isAuditMode || isCreateMode" -->
|
|
|
- <span>{{ row.productNo || row.equipmentId || '-' }}</span>
|
|
|
- <!-- <el-input
|
|
|
+ <!-- <span>{{ row.productNo || row.equipmentId || '-' }}</span> -->
|
|
|
+ <span v-if="isViewMode || isAuditMode">{{ row.equipmentId ?? '-' }}</span>
|
|
|
+ <el-input
|
|
|
v-else
|
|
|
- v-model="row.productNo"
|
|
|
+ v-model="row.equipmentId"
|
|
|
placeholder="请输入..."
|
|
|
clearable
|
|
|
- /> -->
|
|
|
+ />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="备注" min-width="150">
|
|
|
@@ -308,7 +337,7 @@
|
|
|
<el-button @click="basicDialogRef.closeDialog">取消</el-button>
|
|
|
</template>
|
|
|
</BasicDialog>
|
|
|
-
|
|
|
+ <PreviewOnline ref="previewOnlineRef" />
|
|
|
</main>
|
|
|
<footer class="safety-platform-container__footer">
|
|
|
<el-button @click="router.back()">返回</el-button>
|
|
|
@@ -331,10 +360,12 @@
|
|
|
<script setup lang="ts">
|
|
|
import { computed, onMounted, ref, reactive } from 'vue';
|
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
- import { ElMessage } from 'element-plus';
|
|
|
- import type { FormInstance, FormRules } from 'element-plus';
|
|
|
- import { Plus, Minus } from '@element-plus/icons-vue';
|
|
|
+ // import { ElMessage } from 'element-plus';
|
|
|
+ // import type { FormInstance, FormRules } from 'element-plus';
|
|
|
+ import { ElMessage , ElIcon, genFileId, FormInstance, FormRules, type UploadProps, type UploadUserFile, type UploadRawFile, type UploadInstance } from 'element-plus';
|
|
|
+ // import { Plus, Minus } from '@element-plus/icons-vue';
|
|
|
import UploadFiles from '@/components/UploadFiles/UploadFiles.vue';
|
|
|
+ import { uploadFileApi, UPLOAD_BIZ_TYPE } from '@/api/minio';
|
|
|
import type { FileItem } from '@/components/UploadFiles/types';
|
|
|
import { queryPersonalProtectiveEquipmentList } from '@/api/production-safety/personal-protective-equipment';
|
|
|
import type { PersonalProtectiveEquipment } from '@/api/production-safety/personal-protective-equipment';
|
|
|
@@ -364,6 +395,18 @@
|
|
|
import { getApprovalNodeInstanceList } from '@/api/approval/approval';
|
|
|
import { i } from 'vite/dist/node/types.d-jgA8ss1A';
|
|
|
import { te } from 'element-plus/es/locale';
|
|
|
+ import { Plus, Delete, ZoomIn } from '@element-plus/icons-vue';
|
|
|
+ import PreviewOnline from '@/views/disaster/components/PreviewOnline.vue';
|
|
|
+ const approvalImageFileList = ref<UploadUserFile[]>([]);
|
|
|
+ const uploadRefs = ref<Record<string, UploadInstance>>({});
|
|
|
+ // 为每行设置独立的upload ref
|
|
|
+ const setUploadRef = (row: PurchaseApplyItem, el: any) => {
|
|
|
+ if (el) {
|
|
|
+ const key = row.id || row.$$uid || 'default';
|
|
|
+ uploadRefs.value[key] = el;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ const previewOnlineRef = ref<InstanceType<typeof PreviewOnline>>();
|
|
|
|
|
|
const { approvalList, getApprovalList } =
|
|
|
useEmergencyHook()
|
|
|
@@ -520,7 +563,7 @@
|
|
|
const found = ppeOptions.value.find((p) => p.ppeName === ppeName);
|
|
|
if (found?.id) {
|
|
|
row.ppeId = found.id;
|
|
|
- row.equipmentId = found.id;
|
|
|
+ // row.equipmentId = found.id;
|
|
|
row.productNo = String(found.id);
|
|
|
}
|
|
|
}
|
|
|
@@ -560,6 +603,9 @@
|
|
|
form.applyNo = mainFromQuery.value.applyCode ?? '';
|
|
|
const res = await queryPurchaseApplyDetail(currentId.value);
|
|
|
if (res && Array.isArray(res) && res.length) {
|
|
|
+ res.forEach((d) => {
|
|
|
+ d.pictureUrl =JSON.parse(d.pictureUrl || '[]');
|
|
|
+ });
|
|
|
form.itemList = res.map((d) => detailToItem(d));
|
|
|
} else if (res && Array.isArray(res)) {
|
|
|
form.itemList = [defaultItem()];
|
|
|
@@ -738,7 +784,7 @@
|
|
|
auditSubmitting.value = true;
|
|
|
try {
|
|
|
await auditPurchaseApply({ id: currentId.value, status: 3, rejectReason: rejectReason.value.trim(), approvalOrder: Number(approvalOrder.value),templateId: form.approvalTemplateId });
|
|
|
- ElMessage.success('已提交审核不通过');
|
|
|
+ ElMessage.success('提交成功');
|
|
|
showRejectDialog.value = false;
|
|
|
router.back();
|
|
|
} catch (e) {
|
|
|
@@ -793,6 +839,78 @@
|
|
|
});
|
|
|
};
|
|
|
|
|
|
+ const handleApprovalImageChange = (row: PurchaseApplyItem, uploadFile: UploadUserFile) => {
|
|
|
+ if (!uploadFile.raw) return;
|
|
|
+
|
|
|
+ uploadFileApi({
|
|
|
+ file: uploadFile.raw,
|
|
|
+ bizType: UPLOAD_BIZ_TYPE['DICTIONARY'],
|
|
|
+ fileName: uploadFile.raw.name,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ // 更新当前行的图片URL
|
|
|
+ row.pictureUrl = [{
|
|
|
+ fileName: uploadFile.name || res.url.split('/').pop() || 'image',
|
|
|
+ fileUrl: res.url,
|
|
|
+ fileId: res.uid
|
|
|
+ }];
|
|
|
+
|
|
|
+ // 同时更新stylePhoto字段
|
|
|
+ row.stylePhoto = JSON.stringify([{
|
|
|
+ fileUrl: res.url,
|
|
|
+ fileName: uploadFile.name || res.url.split('/').pop() || 'image',
|
|
|
+ fileId: res.uid,
|
|
|
+ fileType: 'image',
|
|
|
+ fileSize: uploadFile.size ? (uploadFile.size / 1024).toFixed(2) + 'KB' : ''
|
|
|
+ }]);
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ ElMessage.error('图片上传失败,请重试');
|
|
|
+ });
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleApprovalImageExceed: UploadProps['onExceed'] = (files) => {
|
|
|
+ const uploadInstance = approvalUploadRef.value;
|
|
|
+ if (!uploadInstance) return;
|
|
|
+
|
|
|
+ uploadInstance.clearFiles();
|
|
|
+ const file = files[0] as UploadRawFile;
|
|
|
+ file.uid = genFileId();
|
|
|
+ uploadInstance.handleStart(file);
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleApprovalPictureCardPreview: UploadProps['onPreview'] = (fileUrl) => {
|
|
|
+
|
|
|
+ // dialogImageUrl.value = uploadFile.url || '';
|
|
|
+ // dialogVisible.value = true;
|
|
|
+ };
|
|
|
+
|
|
|
+ const resetApprovalImageUpload = () => {
|
|
|
+ // 清除所有行的图片数据
|
|
|
+ form.itemList.forEach(row => {
|
|
|
+ row.pictureUrl = [];
|
|
|
+ row.stylePhoto = '';
|
|
|
+ });
|
|
|
+ approvalImageFileList.value = [];
|
|
|
+ form.itemList[approvalUploadKey.value].imageUrl = [];
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleApprovalDeleteClick = () => {
|
|
|
+ resetApprovalImageUpload();
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleApprovalImageRemove = (row: PurchaseApplyItem) => {
|
|
|
+ // 清除当前行的图片数据
|
|
|
+ row.pictureUrl = [];
|
|
|
+ row.stylePhoto = '';
|
|
|
+ };
|
|
|
+
|
|
|
+ const previewOnline = (url: string | undefined) => {
|
|
|
+ if (url) {
|
|
|
+ previewOnlineRef.value?.open(url,'image');
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
loadPpeOptions();
|
|
|
getApprovalList();
|
|
|
@@ -845,4 +963,7 @@
|
|
|
.detail-reject-alert{
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
-</style>
|
|
|
+ ::v-deep.hide .el-upload--picture-card {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+</style>
|