From 6bd7b3c2be00614ae9c0bae7e662043bfa1df04e Mon Sep 17 00:00:00 2001
From: 周宾 <2802492122@qq.com>
Date: 星期五, 12 十二月 2025 11:25:23 +0800
Subject: [PATCH] 双奇点-仓储物流-入库管理 添加条形码显示
---
src/views/inventoryManagement/receiptManagement/index.vue | 65 ++++++++++++++++++++++++++++++++
1 files changed, 65 insertions(+), 0 deletions(-)
diff --git a/src/views/inventoryManagement/receiptManagement/index.vue b/src/views/inventoryManagement/receiptManagement/index.vue
index 2414a5c..0417a5a 100644
--- a/src/views/inventoryManagement/receiptManagement/index.vue
+++ b/src/views/inventoryManagement/receiptManagement/index.vue
@@ -44,6 +44,13 @@
<el-table-column fixed="right" label="鎿嶄綔" min-width="60" align="center">
<template #default="scope">
<el-button link type="primary" size="small" @click="openForm('edit', scope.row);" :disabled="scope.row.createUser !== userStore.id">缂栬緫</el-button>
+ <el-button
+ link
+ type="success"
+ size="small"
+ @click="showQRCode(scope.row)"
+ >鐢熸垚鏉″舰鐮�</el-button
+ >
</template>
</el-table-column>
</el-table>
@@ -127,6 +134,21 @@
</div>
</template>
</el-dialog>
+ <!-- 浜岀淮鐮佹樉绀哄璇濇 -->
+ <el-dialog
+ v-model="qrCodeDialogVisible"
+ title="鍟嗗搧鏉″舰鐮�"
+ width="400px"
+ center
+ >
+ <div style="text-align: center;">
+ <img id="barcode" style="width:200px;height: 50px;"/>
+ <!-- <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>
@@ -135,6 +157,8 @@
import { ref, reactive, toRefs, onMounted, getCurrentInstance } from 'vue'
import { ElMessageBox } from "element-plus";
import useUserStore from '@/store/modules/user'
+import QRCode from "qrcode";
+import JsBarcode from "jsbarcode";
import {
getStockInPage,
updateStockIn,
@@ -456,6 +480,47 @@
}
}
+// 浜岀淮鐮佺浉鍏冲彉閲�
+const qrCodeDialogVisible = ref(false);
+const qrCodeUrl = ref("");
+// 鏄剧ず浜岀淮鐮�
+const showQRCode = async (row) => {
+ try {
+ // 鏋勫缓浜岀淮鐮佸唴瀹癸紝鍙寘鍚噰璐悎鍚屽彿锛堢函鏂囨湰锛�
+ const qrContent = row.id || '';
+ // 妫�鏌ュ唴瀹规槸鍚︿负绌�
+ if (!qrContent) {
+ proxy.$modal.msgWarning("璇ヨ鍟嗗搧id锛屾棤娉曠敓鎴愭潯褰㈢爜");
+ return;
+ }
+ qrCodeDialogVisible.value = true;
+ await nextTick();
+ JsBarcode("#barcode", qrContent+'', {
+ width:10,
+ height:100,
+ displayValue: false
+ });
+ } catch (error) {
+ console.error('鐢熸垚鏉″舰鐮佸け璐�:', error);
+ proxy.$modal.msgError("鐢熸垚鏉″舰鐮佸け璐ワ細" + error.message);
+ }
+};
+const downloadQRCode = () => {
+ const imgSrc = document.getElementById('barcode').src
+ console.log(imgSrc)
+ const a = document.createElement('a');
+ if(!imgSrc){
+ proxy.$modal.msgWarning('鏆傛棤鏉″舰鐮�')
+ return
+ }
+ a.href = imgSrc;
+ a.download = `鍟嗗搧鏉″舰鐮乢${new Date().getTime()}.png`;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ proxy.$modal.msgSuccess("涓嬭浇鎴愬姛");
+};
+
// 鍏抽棴寮规
const closeDia = () => {
proxy.$refs.formRef.resetFields()
--
Gitblit v1.9.3