From a44462fe0bad76ddfd180e54c41b79519cbfbcee Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期三, 13 八月 2025 14:57:47 +0800
Subject: [PATCH] 采购管理添加生成二维码功能
---
src/views/procurementManagement/procurementLedger/index.vue | 72 +++++++++++++++++++++++++++++++++++-
1 files changed, 70 insertions(+), 2 deletions(-)
diff --git a/src/views/procurementManagement/procurementLedger/index.vue b/src/views/procurementManagement/procurementLedger/index.vue
index b403fd1..82f31df 100644
--- a/src/views/procurementManagement/procurementLedger/index.vue
+++ b/src/views/procurementManagement/procurementLedger/index.vue
@@ -145,7 +145,7 @@
<el-table-column
fixed="right"
label="鎿嶄綔"
- min-width="60"
+ min-width="150"
align="center"
>
<template #default="scope">
@@ -156,6 +156,13 @@
@click="openForm('edit', scope.row)"
:disabled="scope.row.receiptPaymentAmount>0 || scope.row.recorderName !== userStore.nickName"
>缂栬緫</el-button
+ >
+ <el-button
+ link
+ type="success"
+ size="small"
+ @click="showQRCode(scope.row)"
+ >鐢熸垚浜岀淮鐮�</el-button
>
</template>
</el-table-column>
@@ -539,13 +546,28 @@
</div>
</template>
</el-dialog>
+
+ <!-- 浜岀淮鐮佹樉绀哄璇濇 -->
+ <el-dialog
+ v-model="qrCodeDialogVisible"
+ title="閲囪喘鍚堝悓鍙蜂簩缁寸爜"
+ width="400px"
+ center
+ >
+ <div style="text-align: center;">
+ <img :src="qrCodeUrl" alt="浜岀淮鐮�" style="width:200px;height:200px;" />
+ <div style="margin: 20px;">
+ <el-button type="primary" @click="downloadQRCode">涓嬭浇浜岀淮鐮佸浘鐗�</el-button>
+ </div>
+ </div>
+ </el-dialog>
</div>
</template>
<script setup>
import { getToken } from "@/utils/auth";
import pagination from "@/components/PIMTable/Pagination.vue";
-import { ref, onMounted } from "vue";
+import { ref, onMounted, reactive, toRefs, getCurrentInstance, nextTick } from "vue";
import { Search } from "@element-plus/icons-vue";
import { ElMessageBox } from "element-plus";
import { userListNoPage } from "@/api/system/user.js";
@@ -567,6 +589,7 @@
createPurchaseNo,
} from "@/api/procurementManagement/procurementLedger.js";
import useFormData from "@/hooks/useFormData.js";
+import QRCode from "qrcode";
const { proxy } = getCurrentInstance();
const tableData = ref([]);
const productData = ref([]);
@@ -589,6 +612,10 @@
import dayjs from "dayjs";
const userStore = useUserStore();
+
+// 浜岀淮鐮佺浉鍏冲彉閲�
+const qrCodeDialogVisible = ref(false);
+const qrCodeUrl = ref("");
// 鐢ㄦ埛淇℃伅琛ㄥ崟寮规鏁版嵁
const operationType = ref("");
@@ -1152,6 +1179,47 @@
}
};
+// 鏄剧ず浜岀淮鐮�
+const showQRCode = async (row) => {
+ try {
+ // 鏋勫缓浜岀淮鐮佸唴瀹癸紝鍙寘鍚噰璐悎鍚屽彿锛堢函鏂囨湰锛�
+ const qrContent = row.purchaseContractNumber || '';
+ // 妫�鏌ュ唴瀹规槸鍚︿负绌�
+ if (!qrContent || qrContent.trim() === '') {
+ proxy.$modal.msgWarning("璇ヨ娌℃湁閲囪喘鍚堝悓鍙凤紝鏃犳硶鐢熸垚浜岀淮鐮�");
+ return;
+ }
+ qrCodeUrl.value = await QRCode.toDataURL(qrContent, {
+ width: 200,
+ margin: 2,
+ color: {
+ dark: '#000000',
+ light: '#FFFFFF'
+ }
+ });
+ qrCodeDialogVisible.value = true;
+ } catch (error) {
+ console.error('鐢熸垚浜岀淮鐮佸け璐�:', error);
+ proxy.$modal.msgError("鐢熸垚浜岀淮鐮佸け璐ワ細" + error.message);
+ }
+};
+
+// 涓嬭浇浜岀淮鐮�
+const downloadQRCode = () => {
+ if (!qrCodeUrl.value) {
+ proxy.$modal.msgWarning("浜岀淮鐮佹湭鐢熸垚");
+ return;
+ }
+
+ const a = document.createElement('a');
+ a.href = qrCodeUrl.value;
+ a.download = `閲囪喘鍚堝悓鍙蜂簩缁寸爜_${new Date().getTime()}.png`;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ proxy.$modal.msgSuccess("涓嬭浇鎴愬姛");
+};
+
onMounted(() => {
getList();
});
--
Gitblit v1.9.3