You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 lines
22 KiB
1 lines
22 KiB
{"version":3,"sources":["uni-app:///main.js","webpack:///C:/Users/18634/Desktop/项目/catering-front-end-meal/pages/user/qrcode/qrcode.vue?510a","webpack:///C:/Users/18634/Desktop/项目/catering-front-end-meal/pages/user/qrcode/qrcode.vue?513c","webpack:///C:/Users/18634/Desktop/项目/catering-front-end-meal/pages/user/qrcode/qrcode.vue?7d95","webpack:///C:/Users/18634/Desktop/项目/catering-front-end-meal/pages/user/qrcode/qrcode.vue?d69b","uni-app:///pages/user/qrcode/qrcode.vue","webpack:///C:/Users/18634/Desktop/项目/catering-front-end-meal/pages/user/qrcode/qrcode.vue?b8ed","webpack:///C:/Users/18634/Desktop/项目/catering-front-end-meal/pages/user/qrcode/qrcode.vue?2db4"],"names":["wx","__webpack_require_UNI_MP_PLUGIN__","__webpack_require__","createPage","Page","data","QRCodeText","QRCodeSrc","posterSrc","postercanvas_width","postercanvas_height","posterTemplates","onLoad","uni","title","mask","methods","loadData","url","success","res","item","content","uQRCode","canvasId","text","size","create","x","posterTemplate","setTimeout","canvas_width","canvas_height","backgroundSrc","logoSrc","name","save","filePath","wanlshopqrlist001","ctx","width","height","fileType","options","wanlshopqr"],"mappings":";;;;;;;;;;;;;AAAA;AAGA;AACA;AAHA;AACAA,EAAE,CAACC,iCAAiC,GAAGC,mBAAmB;AAG1DC,UAAU,CAACC,eAAI,CAAC,C;;;;;;;;;;;;;ACLhB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAmH;AACnH;AAC0D;AACL;AACa;;;AAGlE;AACqK;AACrK,gBAAgB,+KAAU;AAC1B,EAAE,4EAAM;AACR,EAAE,iFAAM;AACR,EAAE,0FAAe;AACjB;AACA;AACA;AACA;AACA;AACA,EAAE,qFAAU;AACZ;AACA;;AAEA;AACe,gF;;;;;;;;;;;;ACvBf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAAG;AACH;AACA,MAAM;AACN;AACA;AACA;AACA,OAAO;AACP;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;ACxBA;AAAA;AAAA;AAAA;AAAgmB,CAAgB,0nBAAG,EAAC,C;;;;;;;;;;;;;;;;;;;;;ACgCpnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eACA;EACAC;IACA;MACAC;MACAC;MACAC;MACAC;MAAA;MACAC;MAAA;MACAC;IACA;EACA;EACAC;IACA;IACAC;MACAC;MACAC;IACA;IACA;MACA;IACA;MACA;MACA;IACA;;IACA;EACA;EACAC;IACA;IACAC;MAAA;MAAA;QAAA;UAAA;YAAA;cAAA;gBACA;kBACAC;kBACAC;oBACA;oBACAC;sBACA;wBACA;wBACAP;0BACAK;0BACAC;4BACAE;0BACA;wBACA;wBACA;wBACAR;0BACAK;0BACAC;4BACAE;0BACA;wBACA;sBACA;oBACA;oBACA;oBACA;oBACA;sBACAR;wBACAC;wBACAQ;wBACAH;0BACA;wBACA;sBACA;oBACA;sBACAN;wBACAC;wBACAC;sBACA;oBACA;oBACA;oBACAQ;sBACAC;sBACAC;sBACAC;sBACAP;wBACA;wBACA;wBACA;sBACA;oBACA;kBACA;gBACA;cAAA;cAAA;gBAAA;YAAA;UAAA;QAAA;MAAA;IACA;IACAQ;MAAA;MACA;QACA;MACA;MACAd;QACAC;QACAC;MACA;MACA;QACAa;MACA;MACAC;MAEA;MACA;MAEA;MACAC;QACA;UACA;YACA;cACAN;cACAO;cACAC;cACAC;cACAC;cACAC;cACAV;cACAlB;cACAY;gBACA;gBACAN;cACA;YACA;YACA;UACA;YACA;cACAW;cACAO;cACAC;cACAzB;cACAY;gBACA;gBACAN;cACA;YACA;YACA;QAAA;MAEA;IACA;IACAuB;MAAA;MACAvB;QACAwB;QACAlB;UACA;QACA;MACA;IACA;IACAmB;MACA;QAAAN;QAAAC;QAAAC;QAAAC;QAAAV;QAAAlB;MACA;MACA;MACA;MACAgC;;MAEA;MACA;QACAC;QACAC;MACA;MACA;MACA;MACA;MACA;MACAF;MACA;MACA;MACA;MACA;MACA;MACA;MACAA;MACAA;MACA;MACAA;MACAA;MACA;MACAA;MACA;MACAA;MACA;MACAA;;MAEA;MACA;QACAJ;MACA;MACA;MACA;MACA;MACA;MACA;MACAI;MACAA;MACA;MACAA;;MAEA;MACA;MACA;MACA;MACA;MACAA;MACAA;MACA;MACAA;;MAEA;MACA;MACA;MACA;MACA;MACA;MACA;MACAA;;MAEA;MACAA;QACA;QACA1B;UACAW;UACAkB;UACAvB;YACAwB;UACA;QACA;MACA;IACA;IACAC;MACA;QAAAZ;QAAAzB;MACA;MACA;MACA;MACAgC;MACA;MACAA;MACA;MACAA;QACA;QACA1B;UACAW;UACAkB;UACAvB;YACAwB;UACA;QACA;MACA;IACA;EACA;AACA;AAAA,2B;;;;;;;;;;;;;AChRA;AAAA;AAAA;AAAA;AAAk3B,CAAgB,m3BAAG,EAAC,C;;;;;;;;;;;ACAt4B;AACA,OAAO,KAAU,EAAE,kBAKd","file":"pages/user/qrcode/qrcode.js","sourcesContent":["import 'uni-pages';\n// @ts-ignore\nwx.__webpack_require_UNI_MP_PLUGIN__ = __webpack_require__;\nimport Vue from 'vue'\nimport Page from './pages/user/qrcode/qrcode.vue'\ncreatePage(Page)","import { render, staticRenderFns, recyclableRender, components } from \"./qrcode.vue?vue&type=template&id=689870a4&\"\nvar renderjs\nimport script from \"./qrcode.vue?vue&type=script&lang=js&\"\nexport * from \"./qrcode.vue?vue&type=script&lang=js&\"\nimport style0 from \"./qrcode.vue?vue&type=style&index=0&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\runtime\\\\componentNormalizer.js\"\nvar component = normalizer(\n script,\n render,\n staticRenderFns,\n false,\n null,\n null,\n null,\n false,\n components,\n renderjs\n)\n\ncomponent.options.__file = \"pages/user/qrcode/qrcode.vue\"\nexport default component.exports","export * from \"-!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\loaders\\\\templateLoader.js??vue-loader-options!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\webpack-preprocess-loader\\\\index.js??ref--17-0!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\template.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\webpack-uni-app-loader\\\\page-meta.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\index.js??vue-loader-options!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\style.js!./qrcode.vue?vue&type=template&id=689870a4&\"","var components\nvar render = function () {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n var l0 = _vm.__map(_vm.posterTemplates, function (x, xi) {\n var $orig = _vm.__get_orig(x)\n var g0 = _vm.$wanlshop.oss(x.thumbnail_url, 0, 88)\n return {\n $orig: $orig,\n g0: g0,\n }\n })\n _vm.$mp.data = Object.assign(\n {},\n {\n $root: {\n l0: l0,\n },\n }\n )\n}\nvar recyclableRender = false\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns, recyclableRender, components }","import mod from \"-!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\babel-loader\\\\lib\\\\index.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\webpack-preprocess-loader\\\\index.js??ref--13-1!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\script.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\index.js??vue-loader-options!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\style.js!./qrcode.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\babel-loader\\\\lib\\\\index.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\webpack-preprocess-loader\\\\index.js??ref--13-1!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\script.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\index.js??vue-loader-options!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\style.js!./qrcode.vue?vue&type=script&lang=js&\"","<template>\r\n\t<view>\r\n\t\t<view class=\"edgeInsetTop\"></view>\r\n\t\t<view class=\"page-background\"></view>\r\n\t\t<canvas class=\"qrcode-canvas\" canvas-id=\"qrcode\" style=\"width: 200px;height: 200px;\" />\r\n\t\t<view class=\"page-container\">\r\n\t\t\t<view class=\"content\">\r\n\t\t\t\t<view class=\"poster-image\"><image v-if=\"posterSrc\" :src=\"posterSrc\" mode=\"aspectFit\"></image></view>\r\n\t\t\t\t<canvas class=\"poster-canvas\" canvas-id=\"poster\" :style=\"{ width: `${postercanvas_width}px`, height: `${postercanvas_height}px` }\" />\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t\t<view class=\"page-foot\">\r\n\t\t\t<view class=\"template-list\">\r\n\t\t\t\t<view class=\"template-item\" v-for=\"(x, xi) in posterTemplates\" :key=\"xi\" @tap=\"create(x)\" :class=\"{ checked: x.checked }\" :style=\"{ width: x.thumbnail_width+'px' }\">\r\n\t\t\t\t\t<image :src=\"$wanlshop.oss(x.thumbnail_url, 0, 88)\" />\r\n\t\t\t\t</view>\r\n\t\t\t\t<!-- #ifdef H5 -->\r\n\t\t\t\t\t<view class=\"tips text-sm wanl-gray\">\r\n\t\t\t\t\t\t<text class=\"wlIcon-31tishi\"></text> 长按图片保存\r\n\t\t\t\t\t</view>\r\n\t\t\t\t<!-- #endif -->\r\n\t\t\t\t<!-- #ifndef H5 -->\r\n\t\t\t\t\t<view class=\"tips text-sm wanl-orange\" @tap=\"save()\">\r\n\t\t\t\t\t\t<text class=\"wlIcon-image margin-right-xs\"></text>保存到相册\r\n\t\t\t\t\t</view>\r\n\t\t\t\t<!-- #endif -->\r\n\t\t\t</view>\r\n\t\t</view>\r\n\t</view>\r\n</template>\r\n\r\n<script>\r\nimport uQRCode from '@/common/uqrcode.js';\r\nexport default {\r\n\tdata() {\r\n\t\treturn {\r\n\t\t\tQRCodeText: '',\r\n\t\t\tQRCodeSrc: '',\r\n\t\t\tposterSrc: '',\r\n\t\t\tpostercanvas_width: 0, // 画布宽度\r\n\t\t\tpostercanvas_height: 0, // 画布高度\r\n\t\t\tposterTemplates: []\r\n\t\t};\r\n\t},\r\n\tonLoad(option) {\r\n\t\t// 提示\r\n\t\tuni.showLoading({\r\n\t\t\ttitle: '二维码生成中',\r\n\t\t\tmask: true\r\n\t\t});\r\n\t\tif(option.url){\r\n\t\t\tthis.QRCodeText = option.url\r\n\t\t}else{\r\n\t\t\tthis.QRCodeText = this.$store.state.common.appConfig.domain + '&QRtype=user';\r\n\t\t\t// this.QRCodeText = this.$store.state.common.appConfig.domain +'/pages/user/info?id='+ this.$store.state.user.id +'&QRtype=user';\r\n\t\t}\r\n\t\tthis.loadData();\r\n\t},\r\n\tmethods: {\r\n\t\t// 二维码配置\r\n\t\tasync loadData(option) {\r\n\t\t\tthis.$api.post({\r\n\t\t\t\turl: '/wanlshop/common/qrcode',\r\n\t\t\t\tsuccess: res => {\r\n\t\t\t\t\t// 下载到本地\r\n\t\t\t\t\tres.forEach((item, index, arr) => {\r\n\t\t\t\t\t\tif (item.template != 'wanlshopqr') {\r\n\t\t\t\t\t\t\t// 远程下载背景\r\n\t\t\t\t\t\t\tuni.downloadFile({\r\n\t\t\t\t\t\t\t\turl: this.$wanlshop.oss(item.background_url, 350, 0),\r\n\t\t\t\t\t\t\t\tsuccess: e => {\r\n\t\t\t\t\t\t\t\t\titem.background_url = e.tempFilePath;\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t// 远程下载图标\r\n\t\t\t\t\t\t\tuni.downloadFile({\r\n\t\t\t\t\t\t\t\turl: this.$wanlshop.oss(item.logo_src, 40, 40),\r\n\t\t\t\t\t\t\t\tsuccess: e => {\r\n\t\t\t\t\t\t\t\t\titem.logo_src = e.tempFilePath;\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t});\r\n\t\t\t\t\t// 赋值\r\n\t\t\t\t\tthis.posterTemplates = res;\r\n\t\t\t\t\tif(res.length == 0){\r\n\t\t\t\t\t\tuni.showModal({\r\n\t\t\t\t\t\t title: '重要提示',\r\n\t\t\t\t\t\t content: '平台尚未配置二维码,请到后台系统管理【配置二维码】',\r\n\t\t\t\t\t\t success: (r)=> {\r\n\t\t\t\t\t\t\t\tthis.$wanlshop.back(1);\r\n\t\t\t\t\t\t }\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t}else{\r\n\t\t\t\t\t\tuni.showLoading({\r\n\t\t\t\t\t\t\ttitle: '加载配置中',\r\n\t\t\t\t\t\t\tmask: true\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t}\r\n\t\t\t\t\t// 生成二维码\r\n\t\t\t\t\tuQRCode.make({\r\n\t\t\t\t\t\tcanvasId: 'qrcode',\r\n\t\t\t\t\t\ttext: this.QRCodeText,\r\n\t\t\t\t\t\tsize: 200,\r\n\t\t\t\t\t\tsuccess: res => {\r\n\t\t\t\t\t\t\tthis.QRCodeSrc = res;\r\n\t\t\t\t\t\t\t// 默认生成第一张海报\r\n\t\t\t\t\t\t\tthis.create(this.posterTemplates[0]);\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t});\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t},\r\n\t\tcreate(posterTemplate) {\r\n\t\t\tif (posterTemplate.checked) {\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t\tuni.showLoading({\r\n\t\t\t\ttitle: '海报生成中',\r\n\t\t\t\tmask: true\r\n\t\t\t});\r\n\t\t\tthis.posterTemplates.forEach(x => {\r\n\t\t\t\tx.checked = false;\r\n\t\t\t});\r\n\t\t\tposterTemplate.checked = true;\r\n\r\n\t\t\tthis.postercanvas_width = posterTemplate.canvas_width;\r\n\t\t\tthis.postercanvas_height = posterTemplate.canvas_height;\r\n\r\n\t\t\tthis.posterSrc = '';\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tswitch (posterTemplate.template) {\r\n\t\t\t\t\tcase 'wanlshopqrlist001':\r\n\t\t\t\t\t\tthis.wanlshopqrlist001({\r\n\t\t\t\t\t\t\tcanvasId: 'poster',\r\n\t\t\t\t\t\t\tcanvas_width: posterTemplate.canvas_width,\r\n\t\t\t\t\t\t\tcanvas_height: posterTemplate.canvas_height,\r\n\t\t\t\t\t\t\tbackgroundSrc: posterTemplate.background_url,\r\n\t\t\t\t\t\t\tlogoSrc: posterTemplate.logo_src,\r\n\t\t\t\t\t\t\tname: this.$store.state.user.username,\r\n\t\t\t\t\t\t\ttext: '长按扫描二维码~',\r\n\t\t\t\t\t\t\tQRCodeSrc: this.QRCodeSrc,\r\n\t\t\t\t\t\t\tsuccess: res => {\r\n\t\t\t\t\t\t\t\tthis.posterSrc = res;\r\n\t\t\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t\tbreak;\r\n\t\t\t\t\tcase 'wanlshopqr':\r\n\t\t\t\t\t\tthis.wanlshopqr({\r\n\t\t\t\t\t\t\tcanvasId: 'poster',\r\n\t\t\t\t\t\t\tcanvas_width: posterTemplate.canvas_width,\r\n\t\t\t\t\t\t\tcanvas_height: posterTemplate.canvas_height,\r\n\t\t\t\t\t\t\tQRCodeSrc: this.QRCodeSrc,\r\n\t\t\t\t\t\t\tsuccess: res => {\r\n\t\t\t\t\t\t\t\tthis.posterSrc = res;\r\n\t\t\t\t\t\t\t\tuni.hideLoading();\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t});\r\n\t\t\t\t\t\tbreak;\r\n\t\t\t\t}\r\n\t\t\t}, 100);\r\n\t\t},\r\n\t\tsave() {\r\n\t\t\tuni.saveImageToPhotosAlbum({\r\n\t\t\t\tfilePath: this.posterSrc,\r\n\t\t\t\tsuccess: () => {\r\n\t\t\t\t\tthis.$wanlshop.msg('保存成功');\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t},\r\n\t\twanlshopqrlist001(options) {\r\n\t\t\tlet { canvas_width, canvas_height, backgroundSrc, logoSrc, name, text, QRCodeSrc } = options;\r\n\t\t\t// 绑定画布\r\n\t\t\tvar ctx = uni.createCanvasContext(options.canvasId);\r\n\t\t\t// 清除画布\r\n\t\t\tctx.clearRect(0, 0, canvas_width, canvas_height);\r\n\r\n\t\t\t// 获取背景图片信息\r\n\t\t\tlet backgroundImageInfo = {\r\n\t\t\t\twidth: '500',\r\n\t\t\t\theight: '667'\r\n\t\t\t};\r\n\t\t\t// 设置背景图片宽高\r\n\t\t\tlet backgroundWidth = canvas_width;\r\n\t\t\tlet backgroundHeight = (backgroundImageInfo.height * canvas_width) / backgroundImageInfo.width;\r\n\t\t\t// 填充背景图片\r\n\t\t\tctx.drawImage(backgroundSrc, 0, 0, backgroundWidth, backgroundHeight);\r\n\t\t\t// 设置标志图片宽高坐标\r\n\t\t\tlet logoWidth = 80;\r\n\t\t\tlet logoHeight = 80;\r\n\t\t\tlet logoX = 36;\r\n\t\t\tlet logoY = backgroundHeight + (canvas_height - backgroundHeight) / 2 - logoHeight / 2;\r\n\t\t\t// 绘制为圆形标志\r\n\t\t\tctx.save();\r\n\t\t\tctx.beginPath();\r\n\t\t\t// 先画个圆 前两个参数确定了圆心 (x,y) 坐标 第三个参数是圆的半径 四参数是绘图方向 默认是false,即顺时针\r\n\t\t\tctx.arc(logoWidth / 2 + logoX, logoHeight / 2 + logoY, logoWidth / 2, 0, Math.PI * 2, false);\r\n\t\t\tctx.closePath();\r\n\t\t\t// 画好了圆 剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因\r\n\t\t\tctx.clip();\r\n\t\t\t// 填充标志图片\r\n\t\t\tctx.drawImage(logoSrc, logoX, logoY, logoWidth, logoHeight);\r\n\t\t\t// 恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 还可以继续绘制\r\n\t\t\tctx.restore();\r\n\r\n\t\t\t// 名称最大长度限制 10,超出为省略号\r\n\t\t\tif (name.length > 10) {\r\n\t\t\t\tname = name.substring(0, 10) + '...';\r\n\t\t\t}\r\n\t\t\t// 计算文字定位距离\r\n\t\t\tlet nameX = logoX + logoWidth + 10;\r\n\t\t\tlet nameY = logoY + 32;\r\n\t\t\tlet nameFontSize = 20;\r\n\t\t\t// 设置名称文字样式\r\n\t\t\tctx.setFillStyle('#000000');\r\n\t\t\tctx.setFontSize(nameFontSize);\r\n\t\t\t// 填充名称到画布\r\n\t\t\tctx.fillText(name, nameX, nameY);\r\n\r\n\t\t\t// 计算文字定位距离\r\n\t\t\tlet textX = nameX;\r\n\t\t\tlet textY = nameY + 32;\r\n\t\t\tlet textFontSize = 16;\r\n\t\t\t// 设置分享文案文字样式\r\n\t\t\tctx.setFillStyle('#999999');\r\n\t\t\tctx.setFontSize(textFontSize);\r\n\t\t\t// 填充分享文案到画布\r\n\t\t\tctx.fillText(text, textX, textY);\r\n\r\n\t\t\t// 设置二维码图片宽高\r\n\t\t\tlet QRCodeWidth = 100;\r\n\t\t\tlet QRCodeHeight = 100;\r\n\t\t\t// 计算二维码图片定位距离\r\n\t\t\tlet QRCodeX = canvas_width - QRCodeWidth - 36;\r\n\t\t\tlet QRCodeY = backgroundHeight + (canvas_height - backgroundHeight) / 2 - QRCodeHeight / 2;\r\n\t\t\t// 填充二维码图片\r\n\t\t\tctx.drawImage(QRCodeSrc, QRCodeX, QRCodeY, QRCodeWidth, QRCodeHeight);\r\n\r\n\t\t\t// 输出到画布中\r\n\t\t\tctx.draw(false, () => {\r\n\t\t\t\t// 绘图全部完成后生成文件路径\r\n\t\t\t\tuni.canvasToTempFilePath({\r\n\t\t\t\t\tcanvasId: options.canvasId,\r\n\t\t\t\t\tfileType: 'jpg',\r\n\t\t\t\t\tsuccess: res => {\r\n\t\t\t\t\t\toptions.success && options.success(res.tempFilePath);\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t\t});\r\n\t\t},\r\n\t\twanlshopqr(options) {\r\n\t\t\tlet { canvas_width, canvas_height, QRCodeSrc } = options;\r\n\t\t\t// 绑定画布\r\n\t\t\tvar ctx = uni.createCanvasContext(options.canvasId);\r\n\t\t\t// 清除画布\r\n\t\t\tctx.clearRect(0, 0, canvas_width, canvas_height);\r\n\t\t\t// 填充二维码图片,并设置边距\r\n\t\t\tctx.drawImage(QRCodeSrc, 15, 15, canvas_width - 30, canvas_height - 30);\r\n\t\t\t// 输出到画布中\r\n\t\t\tctx.draw(false, () => {\r\n\t\t\t\t// 绘图全部完成后生成文件路径\r\n\t\t\t\tuni.canvasToTempFilePath({\r\n\t\t\t\t\tcanvasId: options.canvasId,\r\n\t\t\t\t\tfileType: 'jpg',\r\n\t\t\t\t\tsuccess: res => {\r\n\t\t\t\t\t\toptions.success && options.success(res.tempFilePath);\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t\t});\r\n\t\t}\r\n\t}\r\n};\r\n</script>\r\n\r\n<style>\r\n.page-background {\r\n\tposition: fixed;\r\n\ttop: 0;\r\n\tright: 0;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n\tz-index: 10;\r\n\tbackground-color: #f1f1f1;\r\n}\r\n\r\n.page-container {\r\n\tposition: relative;\r\n\tz-index: 20;\r\n}\r\n\r\n.qrcode-canvas {\r\n\tposition: fixed;\r\n\tright: 100vw;\r\n\tbottom: 100vh;\r\n\tz-index: -999;\r\n}\r\n\r\n.content {\r\n\twidth: 100%;\r\n\theight: calc(100vh - 44px - 150px);\r\n\toverflow-y: scroll;\r\n}\r\n\r\n.poster-image {\r\n\twidth: 100%;\r\n\theight: 100%;\r\n\tmin-height: 500rpx;\r\n\tpadding: 80rpx;\r\n\tbox-sizing: border-box;\r\n}\r\n\r\n.poster-image image {\r\n\twidth: 100%;\r\n\theight: 100%;\r\n}\r\n\r\n.poster-canvas {\r\n\tposition: fixed;\r\n\tright: 100vw;\r\n\tbottom: 100vh;\r\n}\r\n\r\n.page-foot {\r\n\tposition: fixed;\r\n\tright: 0;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n\tz-index: 30;\r\n\tbackground-color: #e5e5e5;\r\n\tpadding-bottom: env(safe-area-inset-bottom);\r\n}\r\n\r\n.template-list {\r\n\tdisplay: flex;\r\n\tposition: relative;\r\n\theight: 100px;\r\n}\r\n.template-list .tips {\r\n\tposition: absolute;\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tjustify-items: center;\r\n\tjustify-content: center;\r\n\ttop: -60rpx;\r\n\twidth: 100%;\r\n}\r\n.template-list .tips .wlIcon-31tishi{\r\n\tfont-size: 32rpx;\r\n}\r\n.template-item {\r\n\tposition: relative;\r\n\theight: 88px;\r\n\tmargin: 6px 0 6px 6px;\r\n}\r\n\r\n.template-item::before {\r\n\tcontent: '';\r\n\tposition: absolute;\r\n\tz-index: 10;\r\n\ttop: 0;\r\n\tright: 0;\r\n\tbottom: 0;\r\n\tleft: 0;\r\n}\r\n\r\n.template-item.checked::before {\r\n\tborder: 2px solid #44aa33;\r\n}\r\n\r\n.template-item image {\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\theight: 100%;\r\n}\r\n</style>\r\n","import mod from \"-!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\mini-css-extract-plugin\\\\dist\\\\loader.js??ref--6-oneOf-1-0!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\css-loader\\\\dist\\\\cjs.js??ref--6-oneOf-1-1!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\loaders\\\\stylePostLoader.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\webpack-preprocess-loader\\\\index.js??ref--6-oneOf-1-2!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\postcss-loader\\\\src\\\\index.js??ref--6-oneOf-1-3!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\index.js??vue-loader-options!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\style.js!./qrcode.vue?vue&type=style&index=0&lang=css&\"; export default mod; export * from \"-!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\mini-css-extract-plugin\\\\dist\\\\loader.js??ref--6-oneOf-1-0!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\css-loader\\\\dist\\\\cjs.js??ref--6-oneOf-1-1!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\loaders\\\\stylePostLoader.js!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\webpack-preprocess-loader\\\\index.js??ref--6-oneOf-1-2!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\postcss-loader\\\\src\\\\index.js??ref--6-oneOf-1-3!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\vue-cli-plugin-uni\\\\packages\\\\vue-loader\\\\lib\\\\index.js??vue-loader-options!D:\\\\HBuilderX\\\\plugins\\\\uniapp-cli\\\\node_modules\\\\@dcloudio\\\\webpack-uni-mp-loader\\\\lib\\\\style.js!./qrcode.vue?vue&type=style&index=0&lang=css&\"","// extracted by mini-css-extract-plugin\n if(module.hot) {\n // 1699454290090\n var cssReload = require(\"D:/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/hmr/hotModuleReplacement.js\")(module.id, {\"hmr\":true,\"publicPath\":\"../../\",\"locals\":false});\n module.hot.dispose(cssReload);\n module.hot.accept(undefined, cssReload);\n }\n "],"sourceRoot":""} |