gxwebsoft/mp-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(hjmCar): 优化导出二维码功能

Browse Source 
- 增加导出按钮的禁用状态和数量显示
- 修改导出逻辑，使用选中的车辆数据- 优化导出成功提示信息
- 更新导出文件名称和内容标题
This commit is contained in:
赵忠林
2025-09-17 11:12:44 +08:00
parent 77f3686e0f
commit 8840cf6c08
1 changed files with 18 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/views/hjm/hjmCar/components/search.vue
View File

@@ -41,7 +41,8 @@
:icon="h(QrcodeOutlined)"
@click="handleExport"
:loading="exportLoading"
>导出二维码</a-button
:disabled="!props.selection || props.selection.length === 0"
>导出二维码{{ props.selection && props.selection.length > 0 ? `(${props.selection.length})` : '' }}</a-button
>
<!-- <span class="text-red-500" v-if="where.organizationId">{{ where.organizationParentName }}(ID：{{where.organizationParentId}})</span>-->
<!-- <span class="text-red-500" v-if="where.organizationId">{{ where }}(ID：{{where.organizationId}})</span>-->
@@ -80,12 +81,14 @@
const props = withDefaults(
defineProps<{
// 选中的角色
selection?: [];
// 选中的车辆
selection?: HjmCar[];
// 全部部门
organizationList: Organization[];
}>(),
{}
{
selection: () => []
}
);
const emit = defineEmits<{
@@ -138,11 +141,11 @@
exportLoading.value = true;
message.loading('正在生成二维码文档，请稍候...', 0);
// 获取所有车辆数据
const carList = await listHjmCar(where);
// 使用选中的车辆数据
const carList = props.selection || [];
if (!carList || carList.length === 0) {
message.error('没有车辆数据可导出');
message.error('请先选择要导出的车辆');
return;
}
@@ -176,13 +179,13 @@
try {
await createWordDocument(qrCodeImages);
message.destroy();
message.success(`成功导出 ${qrCodeImages.length} 个车辆二维码`);
message.success(`成功导出 ${qrCodeImages.length} 个选中车辆的二维码`);
} catch (docError) {
console.warn('Word文档生成失败，使用HTML方式:', docError);
createHtmlDocument(qrCodeImages);
message.destroy();
message.success(
`成功生成 ${qrCodeImages.length} 个车辆二维码（HTML格式，可直接打印）`
`成功生成 ${qrCodeImages.length} 个选中车辆的二维码（HTML格式，可直接打印）`
);
}
} catch (error) {
@@ -203,7 +206,7 @@
// 添加标题
children.push(
new Paragraph({
text: '车辆二维码清单',
text: `选中车辆二维码清单 (共${qrCodeImages.length}辆)`,
alignment: AlignmentType.CENTER,
spacing: { after: 400 }
})
@@ -335,7 +338,7 @@
// 生成并下载文档
try {
const buffer = await Packer.toBlob(doc);
const fileName = `车辆二维码清单_${new Date()
const fileName = `选中车辆二维码清单_${new Date()
.toISOString()
.slice(0, 10)}.docx`;
saveAs(buffer, fileName);
@@ -346,7 +349,7 @@
const blob = new Blob([buffer], {
type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
});
const fileName = `车辆二维码清单_${new Date()
const fileName = `选中车辆二维码清单_${new Date()
.toISOString()
.slice(0, 10)}.docx`;
saveAs(blob, fileName);
@@ -363,7 +366,7 @@
<html>
<head>
<meta charset="UTF-8">
<title>车辆二维码清单</title>
<title>选中车辆二维码清单</title>
<style>
@page {
size: A4;
@@ -405,7 +408,7 @@
</style>
</head>
<body>
<div class="title">车辆二维码清单</div>
<div class="title">选中车辆二维码清单 (共${qrCodeImages.length}辆)</div>
<div class="qr-grid">
`;
@@ -439,7 +442,7 @@
} else {
// 如果弹窗被阻止，创建下载链接
const blob = new Blob([htmlContent], { type: 'text/html;charset=utf-8' });
const fileName = `车辆二维码清单_${new Date()
const fileName = `选中车辆二维码清单_${new Date()
.toISOString()
.slice(0, 10)}.html`;
saveAs(blob, fileName);