From f26f29d84e0a68831a6af14dab3eec5500496d2e Mon Sep 17 00:00:00 2001
From: spring <2396852758@qq.com>
Date: 星期三, 28 五月 2025 16:48:52 +0800
Subject: [PATCH] 初始化项目
---
components/tki-qrcode/tki-qrcode.vue | 210 ++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 210 insertions(+), 0 deletions(-)
diff --git a/components/tki-qrcode/tki-qrcode.vue b/components/tki-qrcode/tki-qrcode.vue
new file mode 100644
index 0000000..f1bb6de
--- /dev/null
+++ b/components/tki-qrcode/tki-qrcode.vue
@@ -0,0 +1,210 @@
+<template xlang="wxml" minapp="mpvue">
+ <view class="tki-qrcode">
+ <!-- #ifndef MP-ALIPAY -->
+ <canvas class="tki-qrcode-canvas" :canvas-id="cid" :style="{width:cpSize+'px',height:cpSize+'px'}" />
+ <!-- #endif -->
+ <!-- #ifdef MP-ALIPAY -->
+ <canvas :id="cid" :width="cpSize" :height="cpSize" class="tki-qrcode-canvas" />
+ <!-- #endif -->
+ <image v-show="show" :src="result" :style="{width:cpSize+'px',height:cpSize+'px'}" />
+ </view>
+</template>
+
+<script>
+import QRCode from "./qrcode.js"
+let qrcode
+export default {
+ name: "tki-qrcode",
+ props: {
+ cid: {
+ type: String,
+ default: 'tki-qrcode-canvas'
+ },
+ size: {
+ type: Number,
+ default: 200
+ },
+ unit: {
+ type: String,
+ default: 'upx'
+ },
+ show: {
+ type: Boolean,
+ default: true
+ },
+ val: {
+ type: String,
+ default: ''
+ },
+ background: {
+ type: String,
+ default: '#ffffff'
+ },
+ foreground: {
+ type: String,
+ default: '#000000'
+ },
+ pdground: {
+ type: String,
+ default: '#000000'
+ },
+ icon: {
+ type: String,
+ default: ''
+ },
+ iconSize: {
+ type: Number,
+ default: 40
+ },
+ lv: {
+ type: Number,
+ default: 3
+ },
+ onval: {
+ type: Boolean,
+ default: false
+ },
+ loadMake: {
+ type: Boolean,
+ default: false
+ },
+ usingComponents: {
+ type: Boolean,
+ default: true
+ },
+ showLoading: {
+ type: Boolean,
+ default: true
+ },
+ loadingText: {
+ type: String,
+ default: '浜岀淮鐮佺敓鎴愪腑'
+ },
+ },
+ data() {
+ return {
+ result: '',
+ }
+ },
+ methods: {
+ _makeCode() {
+ let that = this
+ if (!this._empty(this.val)) {
+ qrcode = new QRCode({
+ context: that, // 涓婁笅鏂囩幆澧�
+ canvasId:that.cid, // canvas-id
+ usingComponents: that.usingComponents, // 鏄惁鏄嚜瀹氫箟缁勪欢
+ showLoading: that.showLoading, // 鏄惁鏄剧ずloading
+ loadingText: that.loadingText, // loading鏂囧瓧
+ text: that.val, // 鐢熸垚鍐呭
+ size: that.cpSize, // 浜岀淮鐮佸ぇ灏�
+ background: that.background, // 鑳屾櫙鑹�
+ foreground: that.foreground, // 鍓嶆櫙鑹�
+ pdground: that.pdground, // 瀹氫綅瑙掔偣棰滆壊
+ correctLevel: that.lv, // 瀹归敊绾у埆
+ image: that.icon, // 浜岀淮鐮佸浘鏍�
+ imageSize: that.iconSize,// 浜岀淮鐮佸浘鏍囧ぇ灏�
+ cbResult: function (res) { // 鐢熸垚浜岀淮鐮佺殑鍥炶皟
+ that._result(res)
+ },
+ });
+ } else {
+ uni.showToast({
+ title: '浜岀淮鐮佸唴瀹逛笉鑳戒负绌�',
+ icon: 'none',
+ duration: 2000
+ });
+ }
+ },
+ _clearCode() {
+ this._result('')
+ qrcode.clear()
+ },
+ _saveCode() {
+ let that = this;
+ if (this.result != "") {
+ uni.saveImageToPhotosAlbum({
+ filePath: that.result,
+ success: function () {
+ uni.showToast({
+ title: '浜岀淮鐮佷繚瀛樻垚鍔�',
+ icon: 'success',
+ duration: 2000
+ });
+ }
+ });
+ }
+ },
+ _result(res) {
+ this.result = res;
+ this.$emit('result', res)
+ },
+ _empty(v) {
+ let tp = typeof v,
+ rt = false;
+ if (tp == "number" && String(v) == "") {
+ rt = true
+ } else if (tp == "undefined") {
+ rt = true
+ } else if (tp == "object") {
+ if (JSON.stringify(v) == "{}" || JSON.stringify(v) == "[]" || v == null) rt = true
+ } else if (tp == "string") {
+ if (v == "" || v == "undefined" || v == "null" || v == "{}" || v == "[]") rt = true
+ } else if (tp == "function") {
+ rt = false
+ }
+ return rt
+ }
+ },
+ watch: {
+ size: function (n, o) {
+ if (n != o && !this._empty(n)) {
+ this.cSize = n
+ if (!this._empty(this.val)) {
+ setTimeout(() => {
+ this._makeCode()
+ }, 100);
+ }
+ }
+ },
+ val: function (n, o) {
+ if (this.onval) {
+ if (n != o && !this._empty(n)) {
+ setTimeout(() => {
+ this._makeCode()
+ }, 0);
+ }
+ }
+ }
+ },
+ computed: {
+ cpSize() {
+ if(this.unit == "upx"){
+ return uni.upx2px(this.size)
+ }else{
+ return this.size
+ }
+ }
+ },
+ mounted: function () {
+ if (this.loadMake) {
+ if (!this._empty(this.val)) {
+ setTimeout(() => {
+ this._makeCode()
+ }, 0);
+ }
+ }
+ },
+}
+</script>
+<style>
+.tki-qrcode {
+ position: relative;
+}
+.tki-qrcode-canvas {
+ position: fixed;
+ top: -99999upx;
+ left: -99999upx;
+ z-index: -99999;
+}
+</style>
--
Gitblit v1.9.3