index-b19afcd7.js
3.45 KB
import{d as _,k as p,u as f,a8 as a,_ as v,a9 as E,aa as t,a0 as s,f as o,E as g,a3 as D,a4 as b}from"./vue-5a35c3f5.js";import{Q as q}from"./index-7ea16098.js";import{aW as B,bm as w,_ as A}from"./index.js";import{P as y}from"./index-f532aa07.js";import"./antd-6b087f69.js";import"./download-3d468407.js";import"./base64Conver-39fc0d26.js";import"./useContentViewHeight-d0a5c58e.js";import"./useWindowSizeFn-cc2fb57c.js";import"./onMountedOrActivated-52afb7a7.js";const h="https://www.vvbin.cn",k=_({components:{CollapseContainer:B,QrCode:q,PageWrapper:y},setup(){const e=p(null),r=p(null);function d(){const u=f(e);u&&u.download("文件名")}function i(){const u=f(r);u&&u.download("Qrcode")}function c({ctx:u}){u instanceof CanvasRenderingContext2D&&(u.fillStyle="black",u.font='16px "微软雅黑"',u.textBaseline="bottom",u.textAlign="center",u.fillText("你帅你先扫",100,195,200))}return{onQrcodeDone:c,qrCodeUrl:h,LogoImg:w,download:d,downloadDiy:i,qrRef:e,qrDiyRef:r}}});const C=e=>(D("data-v-7ed4b118"),e=e(),b(),e),U={class:"flex flex-wrap"},I=C(()=>s("div",{class:"msg"},"(在线logo会导致图片跨域，需要下载图片需要自行解决跨域问题)",-1)),Q=C(()=>s("div",{class:"msg"},"要进行扩展绘制则不能将tag设为img",-1));function x(e,r,d,i,c,u){const l=a("QrCode"),n=a("CollapseContainer"),m=a("a-button"),F=a("PageWrapper");return v(),E(F,{title:"二维码组件使用示例"},{default:t(()=>[s("div",U,[o(n,{title:"基础示例",canExpan:!0,class:"text-center mb-6 qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl},null,8,["value"])]),_:1}),o(n,{title:"渲染成img标签示例",class:"text-center mb-6 qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,tag:"img"},null,8,["value"])]),_:1}),o(n,{title:"配置样式示例",class:"text-center mb-6 qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,options:{color:{dark:"#55D187"}}},null,8,["value"])]),_:1}),o(n,{title:"本地logo示例",class:"text-center mb-6 qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,logo:e.LogoImg},null,8,["value","logo"])]),_:1}),o(n,{title:"在线logo示例",class:"text-center mb-6 qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,logo:"https://vebn.oss-cn-beijing.aliyuncs.com/vben/logo.png",options:{color:{dark:"#55D187"}}},null,8,["value"])]),_:1}),o(n,{title:"logo配置示例",class:"text-center mb-6 qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,logo:{src:"https://vebn.oss-cn-beijing.aliyuncs.com/vben/logo.png",logoSize:.2,borderSize:.05,borderRadius:50,bgColor:"blue"}},null,8,["value","logo"])]),_:1}),o(n,{title:"下载示例",class:"text-center qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,ref:"qrRef",logo:e.LogoImg},null,8,["value","logo"]),o(m,{class:"mb-2",type:"primary",onClick:e.download},{default:t(()=>[g(" 下载 ")]),_:1},8,["onClick"]),I]),_:1}),o(n,{title:"配置大小示例",class:"text-center qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,width:300},null,8,["value"])]),_:1}),o(n,{title:"扩展绘制示例",class:"text-center qrcode-demo-item"},{default:t(()=>[o(l,{value:e.qrCodeUrl,width:200,options:{margin:5},ref:"qrDiyRef",logo:e.LogoImg,onDone:e.onQrcodeDone},null,8,["value","logo","onDone"]),o(m,{class:"mb-2",type:"primary",onClick:e.downloadDiy},{default:t(()=>[g(" 下载 ")]),_:1},8,["onClick"]),Q]),_:1})])]),_:1})}const T=A(k,[["render",x],["__scopeId","data-v-7ed4b118"],["__file","E:/allcode/erp/test7901/order-erp-front/src/views/demo/comp/qrcode/index.vue"]]);export{T as default};