fix
This commit is contained in:
吴红兵
247
src/views/purchase/purchasingrequisition/DocAuditViewDialog.vue
Normal file
247
src/views/purchase/purchasingrequisition/DocAuditViewDialog.vue
Normal file
@@ -0,0 +1,247 @@
|
||||
<template>
|
||||
<el-dialog v-model="visible" title="招标文件审批详情" width="90%" top="5vh" destroy-on-close append-to-body>
|
||||
<template #header>
|
||||
<div class="dialog-header">
|
||||
<span class="dialog-title">
|
||||
<el-icon><DocumentChecked /></el-icon>
|
||||
招标文件审批详情 - {{ applyData.purchaseNo || applyId }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="8">
|
||||
<el-card shadow="never" class="info-card">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">采购申请信息</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-descriptions :column="1" border size="small">
|
||||
<el-descriptions-item label="采购编号">{{ applyData.purchaseNo || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="项目名称">{{ applyData.projectName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="采购金额">{{ applyData.budget ? Number(applyData.budget).toLocaleString() + ' 元' : '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="招标代理">{{ applyData.agentName || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="审批状态">
|
||||
<el-tag v-if="applyData.fileFlowStatus === '0'" type="primary">运行中</el-tag>
|
||||
<el-tag v-else-if="applyData.fileFlowStatus === '1'" type="success">完成</el-tag>
|
||||
<el-tag v-else-if="applyData.fileFlowStatus === '2'" type="danger">作废</el-tag>
|
||||
<el-tag v-else-if="applyData.fileFlowStatus === '3'" type="info">终止</el-tag>
|
||||
<el-tag v-else type="warning">未发起</el-tag>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="file-card">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">招标文件</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-table :data="docList" border stripe size="small" v-if="docList.length > 0" max-height="300">
|
||||
<el-table-column type="index" label="序号" width="50" />
|
||||
<el-table-column prop="fileName" label="文件名称" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" label="上传时间" width="160" />
|
||||
<el-table-column label="操作" width="120" align="center">
|
||||
<template #default="scope">
|
||||
<el-button type="primary" link size="small" icon="View" @click="handlePreview(scope.row)">预览</el-button>
|
||||
<el-button type="success" link size="small" icon="Download" @click="handleDownload(scope.row)">下载</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-empty v-else description="暂无招标文件" :image-size="60" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="16">
|
||||
<el-card shadow="never" class="flow-card">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="card-title">审批流程</span>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="applyData.fileFlowInstId">
|
||||
<FlowCommentTimeline :key="String(applyData.fileFlowInstId) + 'doc'" :curr-job="fileFlowJob" />
|
||||
</template>
|
||||
<el-empty v-else description="暂未发起审批流程" :image-size="80" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<template #footer>
|
||||
<el-button @click="visible = false">关闭</el-button>
|
||||
</template>
|
||||
|
||||
<el-dialog v-model="previewVisible" :title="previewTitle" width="80%" top="5vh" destroy-on-close append-to-body>
|
||||
<div class="preview-container">
|
||||
<iframe v-if="previewUrl" :src="previewUrl" class="preview-iframe" />
|
||||
</div>
|
||||
</el-dialog>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from 'vue';
|
||||
import { DocumentChecked } from '@element-plus/icons-vue';
|
||||
import { useMessage } from '/@/hooks/message';
|
||||
import { getObj, getDocList, previewFileById, downloadFileById } from '/@/api/purchase/purchasingrequisition';
|
||||
|
||||
const FlowCommentTimeline = defineAsyncComponent(() => import('/@/views/jsonflow/comment/timeline.vue'));
|
||||
|
||||
interface DocItem {
|
||||
id: string;
|
||||
fileName: string;
|
||||
fileUrl: string;
|
||||
createTime?: string;
|
||||
}
|
||||
|
||||
const visible = ref(false);
|
||||
const applyId = ref('');
|
||||
const applyData = ref<any>({});
|
||||
const docList = ref<DocItem[]>([]);
|
||||
const previewVisible = ref(false);
|
||||
const previewTitle = ref('');
|
||||
const previewUrl = ref('');
|
||||
|
||||
const fileFlowJob = computed(() => {
|
||||
if (!applyData.value.fileFlowInstId) return null;
|
||||
return {
|
||||
id: applyData.value.id,
|
||||
flowInstId: applyData.value.fileFlowInstId,
|
||||
};
|
||||
});
|
||||
|
||||
const open = async (id: string, row?: any) => {
|
||||
applyId.value = id || '';
|
||||
visible.value = true;
|
||||
docList.value = [];
|
||||
applyData.value = row || {};
|
||||
|
||||
if (!row || !row.fileFlowInstId) {
|
||||
try {
|
||||
const res = await getObj(id);
|
||||
applyData.value = res?.data || {};
|
||||
} catch (e) {
|
||||
console.error('获取采购申请详情失败', e);
|
||||
useMessage().error('获取采购申请详情失败');
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// 加载招标文件列表
|
||||
if (applyData.value.id) {
|
||||
try {
|
||||
const docsRes = await getDocList(applyData.value.id);
|
||||
const docs = docsRes?.data || [];
|
||||
if (Array.isArray(docs) && docs.length > 0) {
|
||||
docList.value = docs.map((d: any) => ({
|
||||
id: d.id || d.fileId,
|
||||
fileName: d.fileName || d.fileTitle || '招标文件',
|
||||
fileUrl: d.fileUrl,
|
||||
createTime: d.createTime,
|
||||
}));
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('获取招标文件列表失败', e);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const handlePreview = async (row: DocItem) => {
|
||||
if (!row.id) {
|
||||
useMessage().warning('文件ID不存在');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const blob = await previewFileById(row.id);
|
||||
previewUrl.value = window.URL.createObjectURL(blob);
|
||||
previewTitle.value = row.fileName || '文件预览';
|
||||
previewVisible.value = true;
|
||||
} catch (e) {
|
||||
console.error('预览失败', e);
|
||||
useMessage().error('预览失败');
|
||||
}
|
||||
};
|
||||
|
||||
const handleDownload = async (row: DocItem) => {
|
||||
if (!row.id) {
|
||||
useMessage().warning('文件ID不存在');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const blob = await downloadFileById(row.id);
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = row.fileName || '招标文件.pdf';
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (e) {
|
||||
console.error('下载失败', e);
|
||||
useMessage().error('下载失败');
|
||||
}
|
||||
};
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'refresh'): void;
|
||||
}>();
|
||||
|
||||
defineExpose({
|
||||
open,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.dialog-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dialog-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.info-card,
|
||||
.file-card,
|
||||
.flow-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.preview-container {
|
||||
width: 100%;
|
||||
height: 75vh;
|
||||
}
|
||||
|
||||
.preview-iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
|
||||
:deep(.el-card__header) {
|
||||
padding: 12px 16px;
|
||||
}
|
||||
|
||||
:deep(.el-card__body) {
|
||||
padding: 12px 16px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user