店铺收款码更新
This commit is contained in:
@@ -49,7 +49,7 @@
|
|||||||
</view><up-icon name="arrow-right" color="#999999" size="15"></up-icon>
|
</view><up-icon name="arrow-right" color="#999999" size="15"></up-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="page-cell" @tap="go.to('PAGES_SHOP_QRCODE')">
|
<view class="page-cell" @tap="go.to('PAGES_SHOP_QRCODE',{paymentQrcode: vdata.shopInfo.paymentQrcode})">
|
||||||
<view class="label">店铺收款码</view>
|
<view class="label">店铺收款码</view>
|
||||||
<view class="right"><up-icon name="arrow-right" color="#999999" size="15"></up-icon></view>
|
<view class="right"><up-icon name="arrow-right" color="#999999" size="15"></up-icon></view>
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
<view class="content">
|
<view class="content">
|
||||||
<view class="title">门店收款码</view>
|
<view class="title">门店收款码</view>
|
||||||
<view ref="qrcode" class="qrcode">
|
<view ref="qrcode" class="qrcode">
|
||||||
<up-qrcode :size="vdata.size" @result="result" val="uview-plus"></up-qrcode>
|
<up-qrcode :size="vdata.size" @result="result" :val="vdata.paymentQrcode"></up-qrcode>
|
||||||
</view>
|
</view>
|
||||||
<view class="bom">
|
<view class="bom">
|
||||||
<view @click="download">下载收款码</view>
|
<view @click="download">下载收款码</view>
|
||||||
@@ -17,21 +17,29 @@
|
|||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, ref, onMounted } from 'vue';
|
import { reactive, ref, onMounted } from 'vue';
|
||||||
import { onShow } from '@dcloudio/uni-app';
|
import { onLoad, onShow } from '@dcloudio/uni-app';
|
||||||
import ak from '@/commons/utils/ak.js';
|
import ak from '@/commons/utils/ak.js';
|
||||||
import { getShopList } from '@/http/yskApi/shop.js'
|
import { getShopList } from '@/http/yskApi/shop.js'
|
||||||
|
|
||||||
const vdata = reactive({
|
const vdata = reactive({
|
||||||
size: 0,
|
size: 0,
|
||||||
qrcodeUrl: null,
|
qrcodeUrl: null,
|
||||||
|
paymentQrcode: null,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
onLoad((options) => {
|
||||||
|
vdata.paymentQrcode = options.paymentQrcode;
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
onShow(() => {
|
onShow(() => {
|
||||||
// getshopList()
|
// getshopList()
|
||||||
|
|
||||||
})
|
})
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// getshopList()
|
|
||||||
|
// 设置二维码大小
|
||||||
let query = uni.createSelectorQuery().in(this);
|
let query = uni.createSelectorQuery().in(this);
|
||||||
query.select('.qrcode').boundingClientRect(data => {
|
query.select('.qrcode').boundingClientRect(data => {
|
||||||
if (data) {
|
if (data) {
|
||||||
@@ -41,29 +49,66 @@ onMounted(() => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 二维码图片
|
||||||
|
*/
|
||||||
let result = (e) => {
|
let result = (e) => {
|
||||||
// console.log(e)
|
|
||||||
vdata.qrcodeUrl = e;
|
vdata.qrcodeUrl = e;
|
||||||
|
console.log(vdata.qrcodeUrl)
|
||||||
|
let blob = dataURLtoBlob()
|
||||||
|
console.log(blob)
|
||||||
}
|
}
|
||||||
|
let dataURLtoBlob = (dataurl) => {
|
||||||
let download = () => {
|
var arr = vdata.qrcodeUrl.split(',')
|
||||||
// 这里是获取到的图片base64编码
|
var mime = arr[0].match(/:(.*?);/)[1]
|
||||||
getUrlBase64(vdata.qrcodeUrl).then(base64 => {
|
var bstr = atob(arr[1])
|
||||||
let elink = document.createElement('a')
|
var n = bstr.length
|
||||||
elink.href = base64
|
var u8arr = new Uint8Array(n)
|
||||||
const timedate = Date.parse(new Date())
|
while (n--) {
|
||||||
elink.download = `创意模板${timedate}.png`
|
u8arr[n] = bstr.charCodeAt(n)
|
||||||
elink.click()
|
}
|
||||||
|
return new Blob([u8arr], { type: mime })
|
||||||
|
}
|
||||||
|
let saveImageToPhotosAlbum = (imgSrc) => {
|
||||||
|
let base64 = imgSrc.replace(/^data:image\/\w+;base64,/, ""); //图片替换
|
||||||
|
let filePath = '123' + '/qrcode.png';
|
||||||
|
uni.getFileSystemManager().writeFile({
|
||||||
|
filePath: filePath, //创建一个临时文件名
|
||||||
|
data: base64, //写入的文本或二进制数据
|
||||||
|
encoding: 'base64', //写入当前文件的字符编码
|
||||||
|
success: (res) => {
|
||||||
|
uni.saveImageToPhotosAlbum({
|
||||||
|
filePath: filePath,
|
||||||
|
success: () => {
|
||||||
|
uni.showToast({
|
||||||
|
title: '保存成功',
|
||||||
|
icon: "none",
|
||||||
|
duration: 5000
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.log(err);
|
||||||
|
uni.showToast({
|
||||||
|
title: '保存失败',
|
||||||
|
icon: "none",
|
||||||
|
duration: 5000
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.log(err)
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
let getUrlBase64 = (url) => {
|
let getUrlBase64 = (url) => {
|
||||||
return new Promise(resolve => {
|
return new Promise(resolve => {
|
||||||
let canvas = document.createElement('canvas')
|
let canvas = document.createElement('canvas')
|
||||||
let ctx = canvas.getContext('2d')
|
let ctx = canvas.getContext('2d')
|
||||||
let img = new Image()
|
let img = new Image()
|
||||||
img.crossOrigin = 'Anonymous' //允许跨域
|
img.crossOrigin = 'Anonymous' //允许跨域
|
||||||
img.src = url
|
img.src = vdata.qrcodeUrl
|
||||||
img.onload = function() {
|
img.onload = function() {
|
||||||
canvas.height = 300
|
canvas.height = 300
|
||||||
canvas.width = 300
|
canvas.width = 300
|
||||||
@@ -75,6 +120,27 @@ let download = () => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let download = () => {
|
||||||
|
// 这里是获取到的图片base64编码
|
||||||
|
let link = document.createElement('a')
|
||||||
|
let url = vdata.qrcodeUrl//要下载的路径
|
||||||
|
// 这里是将url转成blob地址,
|
||||||
|
fetch(url).then(res => res.blob()).then(blob => { //将链接地址字符内容转变成blob地址
|
||||||
|
link.href = URL.createObjectURL(blob)
|
||||||
|
console.log(link.href)
|
||||||
|
link.download ='QrCode'
|
||||||
|
document.body.appendChild(link)
|
||||||
|
link.click()
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.page-wrapper {
|
.page-wrapper {
|
||||||
|
|||||||
Reference in New Issue
Block a user