商户收款二维码下载

src/views/canteen/boxesInfo/index.vue

@@ -7,7 +7,7 @@
 						<el-input placeholder="请输入包厢名称" v-model="state.queryForm.name" />
 					</el-form-item>
 					<el-form-item>
-						<el-button icon="search" type="primary" @click="getDataList"> 查询 </el-button>
+						<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
 						<el-button icon="Refresh" @click="resetQuery">重置</el-button>
 					</el-form-item>
 				</el-form>

src/views/wallet/mch-manage/index.vue

@@ -67,7 +67,10 @@
 				</el-table-column>
 				<el-table-column prop="collectionCode" width="150" label="商户收款二维码" show-overflow-tooltip>
 					<template #default="{ row }">
-						<preview-image :src="row.collectionCode" />
+						<div class="flex flex-col justify-center items-center">
+							<preview-image :src="row.collectionCode" />
+							<el-button size="small" type="primary" link @click="downloadCollectionCode(row)">下载</el-button>
+						</div>
 					</template>
 				</el-table-column>
 				<el-table-column prop="merchantType" label="商户类型" show-overflow-tooltip :min-width="100">
@@ -161,6 +164,7 @@ import { useDict } from "/@/hooks/dict"
 import FormDialog from "./form.vue"
 import Setting from "./setting.vue"
 import { useUserInfo } from "/@/stores/userInfo"
+import { downBlobFile as downCollectionCodeBlobFile } from "/@/utils/other"
 
 const { merchant_type, wallet_type, yes_no_type } = useDict("merchant_type", "wallet_type", "yes_no_type")
 
@@ -256,4 +260,10 @@ const handleDelete = async (ids: string[]) => {
 		useMessage().error(err.msg)
 	}
 }
+
+// 点击二维码下载
+const downloadCollectionCode = (row: any) => {
+	if (!row.collectionCode) return useMessage().error("二维码链接不存在")
+	downCollectionCodeBlobFile(row.collectionCode, {}, `${row.name} 收款二维码.png`)
+}
 </script>