更新

xiaochengxu/node_modules/image-tools/README.md

@@ -0,0 +1,76 @@
+# image-tools
+图像转换工具，可用于如下环境：uni-app、微信小程序、5+APP、浏览器（需允许跨域）
+
+## 使用方式
+
+### NPM
+
+```
+npm i image-tools --save
+```
+
+```js
+import { pathToBase64, base64ToPath } from 'image-tools'
+```
+
+### 直接下载
+
+```js
+// 以下路径需根据项目实际情况填写
+import { pathToBase64, base64ToPath } from '../../js/image-tools/index.js'
+```
+
+## API
+
+### pathToBase64
+
+从图像路径转换为base64，uni-app、微信小程序和5+APP使用的路径不支持网络路径，如果是网络路径需要先使用下载API下载下来。
+
+```js
+pathToBase64(path)
+  .then(base64 => {
+    console.log(base64)
+  })
+  .catch(error => {
+    console.error(error)
+  })
+```
+
+### base64ToPath
+
+将图像base64保存为文件，返回文件路径。
+
+```js
+base64ToPath(base64)
+  .then(path => {
+    console.log(path)
+  })
+  .catch(error => {
+    console.error(error)
+  })
+```
+
+## 提示
+
+可以利用promise来串行和并行的执行多个任务
+
+```js
+// 并行
+Promise.all(paths.map(path => pathToBase64(path)))
+  .then(res => {
+    console.log(res)
+    // [base64, base64...]
+  })
+  .catch(error => {
+    console.error(error)
+  })
+// 串行
+paths.reduce((promise, path) => promise.then(res => pathToBase64(path).then(base64 => (res.push(base64), res))), Promise.resolve([]))
+  .then(res => {
+    console.log(res)
+    // [base64, base64...]
+  })
+  .catch(error => {
+    console.error(error)
+  })
+```

xiaochengxu/node_modules/image-tools/index.js

@@ -0,0 +1,196 @@
+function getLocalFilePath(path) {
+    if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf('_downloads') === 0) {
+        return path
+    }
+    if (path.indexOf('file://') === 0) {
+        return path
+    }
+    if (path.indexOf('/storage/emulated/0/') === 0) {
+        return path
+    }
+    if (path.indexOf('/') === 0) {
+        var localFilePath = plus.io.convertAbsoluteFileSystem(path)
+        if (localFilePath !== path) {
+            return localFilePath
+        } else {
+            path = path.substr(1)
+        }
+    }
+    return '_www/' + path
+}
+
+function dataUrlToBase64(str) {
+    var array = str.split(',')
+    return array[array.length - 1]
+}
+
+var index = 0
+function getNewFileId() {
+    return Date.now() + String(index++)
+}
+
+function biggerThan(v1, v2) {
+    var v1Array = v1.split('.')
+    var v2Array = v2.split('.')
+    var update = false
+    for (var index = 0; index < v2Array.length; index++) {
+        var diff = v1Array[index] - v2Array[index]
+        if (diff !== 0) {
+            update = diff > 0
+            break
+        }
+    }
+    return update
+}
+
+export function pathToBase64(path) {
+    return new Promise(function(resolve, reject) {
+        if (typeof window === 'object' && 'document' in window) {
+            if (typeof FileReader === 'function') {
+                var xhr = new XMLHttpRequest()
+                xhr.open('GET', path, true)
+                xhr.responseType = 'blob'
+                xhr.onload = function() {
+                    if (this.status === 200) {
+                        let fileReader = new FileReader()
+                        fileReader.onload = function(e) {
+                            resolve(e.target.result)
+                        }
+                        fileReader.onerror = reject
+                        fileReader.readAsDataURL(this.response)
+                    }
+                }
+                xhr.onerror = reject
+                xhr.send()
+                return
+            }
+            var canvas = document.createElement('canvas')
+            var c2x = canvas.getContext('2d')
+            var img = new Image
+            img.onload = function() {
+                canvas.width = img.width
+                canvas.height = img.height
+                c2x.drawImage(img, 0, 0)
+                resolve(canvas.toDataURL())
+                canvas.height = canvas.width = 0
+            }
+            img.onerror = reject
+            img.src = path
+            return
+        }
+        if (typeof plus === 'object') {
+            plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) {
+                entry.file(function(file) {
+                    var fileReader = new plus.io.FileReader()
+                    fileReader.onload = function(data) {
+                        resolve(data.target.result)
+                    }
+                    fileReader.onerror = function(error) {
+                        reject(error)
+                    }
+                    fileReader.readAsDataURL(file)
+                }, function(error) {
+                    reject(error)
+                })
+            }, function(error) {
+                reject(error)
+            })
+            return
+        }
+        if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
+            wx.getFileSystemManager().readFile({
+                filePath: path,
+                encoding: 'base64',
+                success: function(res) {
+                    resolve('data:image/png;base64,' + res.data)
+                },
+                fail: function(error) {
+                    reject(error)
+                }
+            })
+            return
+        }
+        reject(new Error('not support'))
+    })
+}
+
+export function base64ToPath(base64) {
+    return new Promise(function(resolve, reject) {
+        if (typeof window === 'object' && 'document' in window) {
+            base64 = base64.split(',')
+            var type = base64[0].match(/:(.*?);/)[1]
+            var str = atob(base64[1])
+            var n = str.length
+            var array = new Uint8Array(n)
+            while (n--) {
+                array[n] = str.charCodeAt(n)
+            }
+            return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { type: type })))
+        }
+        var extName = base64.split(',')[0].match(/data\:\S+\/(\S+);/)
+        if (extName) {
+            extName = extName[1]
+        } else {
+            reject(new Error('base64 error'))
+        }
+        var fileName = getNewFileId() + '.' + extName
+        if (typeof plus === 'object') {
+            var basePath = '_doc'
+            var dirPath = 'uniapp_temp'
+            var filePath = basePath + '/' + dirPath + '/' + fileName
+            if (!biggerThan(plus.os.name === 'Android' ? '1.9.9.80627' : '1.9.9.80472', plus.runtime.innerVersion)) {
+                plus.io.resolveLocalFileSystemURL(basePath, function(entry) {
+                    entry.getDirectory(dirPath, {
+                        create: true,
+                        exclusive: false,
+                    }, function(entry) {
+                        entry.getFile(fileName, {
+                            create: true,
+                            exclusive: false,
+                        }, function(entry) {
+                            entry.createWriter(function(writer) {
+                                writer.onwrite = function() {
+                                    resolve(filePath)
+                                }
+                                writer.onerror = reject
+                                writer.seek(0)
+                                writer.writeAsBinary(dataUrlToBase64(base64))
+                            }, reject)
+                        }, reject)
+                    }, reject)
+                }, reject)
+                return
+            }
+            var bitmap = new plus.nativeObj.Bitmap(fileName)
+            bitmap.loadBase64Data(base64, function() {
+                bitmap.save(filePath, {}, function() {
+                    bitmap.clear()
+                    resolve(filePath)
+                }, function(error) {
+                    bitmap.clear()
+                    reject(error)
+                })
+            }, function(error) {
+                bitmap.clear()
+                reject(error)
+            })
+            return
+        }
+        if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
+            var filePath = wx.env.USER_DATA_PATH + '/' + fileName
+            wx.getFileSystemManager().writeFile({
+                filePath: filePath,
+                data: dataUrlToBase64(base64),
+                encoding: 'base64',
+                success: function() {
+                    resolve(filePath)
+                },
+                fail: function(error) {
+                    reject(error)
+                }
+            })
+            return
+        }
+        reject(new Error('not support'))
+    })
+}

xiaochengxu/pages/cardHolder/cardHolder.vue

@@ -290,15 +290,62 @@
 		<poster :data="canvasData" background-color="#FFF" :width='750' :height='420' @on-success="posterSuccess"
 			ref="poster" @on-error="posterError"></poster>
 		<!-- #ifdef MP-WEIXIN -->
-		<u-popup :show="isPhone" mode="center" :round="10">
+		<!-- <u-popup :show="isPhone" mode="center" :round="10">
 			<view class='sq-view'>
 				<view class="text">
 					手机登录后才能查看名片哦~
 				</view>
 				<button class="confirm" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">授权手机号</button>
 			</view>
-			<!-- <navigator hover-class="none" url="/pages/cardHolder/popup/coupon">领券</navigator> -->
-		</u-popup>
+		</u-popup> -->
+	   <u-modal :show="showAuthorizePhone" 
+				 :showConfirmButton="false">
+			<view class="slot-content">
+				<div class="auth-card">
+					<div class="img">
+						<img class="avatar-img"
+							   src="@/static/imgs/logo.png"
+							   mode="widthFix">
+					</div>
+					<!-- <div class="title">手机登录后才能查看名片哦~</div> -->
+					<div class="content">手机登录后才能查看名片哦~</div>
+				</div>
+				<div class="auth-btncard">
+					<div class="btn-unok"><u-button  :customStyle="customStyleUnOk" @click="showAuthorizePhone=false"> 拒绝</u-button></div>
+					<div class="btn-ok"><u-button  :customStyle="customStyleOk" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"> 允许</u-button></div>
+				</div>
+			</view>
+		</u-modal>
+		<u-modal :show="showAuthorizeUser" 
+				:showConfirmButton="false">
+			<view class="slot-content">
+				<div class="auth-card">
+					<div class="img">
+						<img class="avatar-img"
+							 src="/static/imgs/logo.png"
+							 mode="widthFix">
+					</div>
+					<div class="content">邀请您补全个人信息<br></br>（昵称、头像）</div>
+				<div style="margin-left: 100rpx;margin-right: 100rpx">
+					<u-form :model="userInfo" ref="uForm">
+						<u-form-item label="头像">
+							<button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar" slot="right">
+								<image class="avatar" :src="userInfo.head?userInfo.head:'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'"></image>
+							</button>
+						</u-form-item>
+						<u-form-item label="昵称">
+							<input type="nickname" :value="userInfo.nickname" class="weui-input" @blur="userNameInput" placeholder="请输入昵称"/>
+						</u-form-item>
+					</u-form>
+				</div>
+				</div>
+			<div class="auth-btncard">
+				<div class="btn-unok"><u-button :customStyle="customStyleUnOk" @click="showAuthorizeUser=false"> 拒绝</u-button></div>
+				<div class="btn-ok"><u-button  :customStyle="customStyleOk" @click="authUser"> 允许</u-button></div>
+			</div>
+			</view>
+		</u-modal>
+
 		<!-- #endif -->
 		<u-toast ref="uToast"></u-toast>
 	</view>
@@ -306,6 +353,7 @@
 
 <script>
 	import Poster from '../../components/zhangyuhao-poster/Poster.vue'
+	import { pathToBase64, base64ToPath } from 'image-tools'
 	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
 	export default {
 		mixins: [MescrollMixin],
@@ -314,7 +362,7 @@
 		},
 		data() {
 			return {
-				userInfo: {},
+				userInfo: {avatarUrl:'',nickName:''},
 				downOption: {
 					auto: false,
 				},
@@ -357,9 +405,23 @@
 				clicknum: 0,
 				noticeList: [],
 				status: 0,
+				// 是否弹出登录注册授权弹窗
+				showAuthorizeUser: false,
+				showAuthorizePhone: false,
+				customStyleUnOk: {
+					marginTop: '20rpx', // 注意驼峰命名，并且值必须用引号包括，因为这是对象
+					border:'none',
+					color:'gray'
+				},
+				customStyleOk: {
+					marginTop: '20rpx', // 注意驼峰命名，并且值必须用引号包括，因为这是对象
+					border:'none',
+					color:'#157DFB'
+				},
 			};
 		},
 		onShow() {
+			
 		},
 		mounted() {
 
@@ -378,6 +440,7 @@
 			} else {
 				if (uni.getLaunchOptionsSync().scene != 1154) {
 					this.login()
+					 
 				}
 			}
 			this.status = uni.getLaunchOptionsSync().scene
@@ -418,6 +481,32 @@
 			}
 		},
 		methods: {
+				//获取昵称输入内容
+				userNameInput(e){
+					this.userInfo.nickname = e.detail.value
+				},
+				onChooseAvatar(e) {
+					  console.log(e.detail.avatarUrl)
+					 pathToBase64( e.detail.avatarUrl).then(path => {
+					  this.userInfo.head = path
+					  console.log(path)
+					}).catch(error => {
+					  console.log(error)
+					})
+					// this.userInfo.head = e.detail.avatarUrl;
+				},
+				authUser(){
+					if(this.userInfo.nickname==''){
+						that.$refs.uToast.show({
+							type: 'error',
+							message: "请输入您的昵称",
+						})
+						return;
+					}
+					this.getTokenAsync1()
+					
+				},
+			
 			downCallback(){
 				this.mescroll.resetUpScroll()
 			},
@@ -450,66 +539,45 @@
 					let data = this.$WXBizDataCrypt.prototype.decryptData(encryptedData, iv, appId, sessionKey)
 
 					console.log('解密后 data: ', data)
+					this.showAuthorizePhone = false
 					this.getTokenAsync(data)
 				}
 
 			},
 			async getTokenAsync(val) {
 				let that = this
-				uni.getUserInfo({
-					provider: 'weixin',
-					success: function(info) {
-						console.log("info", info)
-						that.userInfo.nickname = info.userInfo.nickName
-						that.userInfo.head = info.userInfo.avatarUrl
-						that.userInfo.phone = val.phoneNumber
-						that.$request.baseRequest('commonUserApp', 'edit', {
-							commonUserInfo: JSON.stringify(that.userInfo)
-						}, failres => {
-							that.$refs.uToast.show({
-								type: 'error',
-								message: failres.errmsg,
-							})
-							uni.hideLoading()
-						}).then(res1 => {
-							that.userInfo = res1.data
-							uni.setStorageSync("userInfo", that.userInfo)
-							that.mescroll.resetUpScroll()
-						})
-					}
+				that.userInfo.phone = val.phoneNumber
+				that.$request.baseRequest('commonUserApp', 'edit', {
+					commonUserInfo: JSON.stringify(that.userInfo)
+				}, failres => {
+					that.$refs.uToast.show({
+						type: 'error',
+						message: failres.errmsg,
+					})
+					uni.hideLoading()
+				}).then(res1 => {
+					that.userInfo = res1.data
+					uni.setStorageSync("userInfo", that.userInfo)
+					that.showAuthorizeUser = true
+					that.mescroll.resetUpScroll()
+				})
+			},
+			async getTokenAsync1() {
+				let that = this
+				that.$request.baseRequest('commonUserApp', 'edit', {
+					commonUserInfo: JSON.stringify(that.userInfo)
+				}, failres => {
+					that.$refs.uToast.show({
+						type: 'error',
+						message: failres.errmsg,
+					})
+					uni.hideLoading()
+				}).then(res1 => {
+					that.userInfo = res1.data
+					uni.setStorageSync("userInfo", that.userInfo)
+					that.showAuthorizeUser = false
+					that.mescroll.resetUpScroll()
 				})
-				// that.userInfo.phone = val.phoneNumber
-				// that.userInfo.userId = that.userInfo.id
-				// 	console.log(that.userInfo)
-				// 	that.$request.baseRequest('user', 'syncUserInfo', that.userInfo).then(syncRes => {
-
-				// 		this.$request.baseRequest('sunMemberInfoApp', 'add', {
-				// 			sunMemberInfo: JSON.stringify({
-				// 				name: that.userInfo.nickname,
-				// 				phone: val.phoneNumber,
-				// 				sex: '1'
-				// 			})
-				// 		}, failres => {
-				// 			console.log('res+++++', failres.errmsg)
-				// 			this.$refs.uToast.show({
-				// 				type: 'error',
-				// 				message: failres.errmsg,
-				// 			})
-				// 			uni.hideLoading()
-				// 		}).then(res => {
-				// 			if (res.errno == 200) {
-
-				// 				uni.setStorageSync('userInfo', that.userInfo)
-				// 				that.$store.commit('login', that.userInfo)
-				// 				// that.$api.setUserInfo(that.userInfo)
-				// 				uni.hideLoading()
-				// 				// that.liangxinLogin()
-				// 				that.init()
-				// 				this.isShowAlert = false
-				// 			}
-
-				// 		})
-				// 	})
 			},
 			delVal() {
 				this.searchVal = ""
@@ -1077,6 +1145,7 @@
 						}).then(res => {
 							console.log(res.data)
 							that.isPhone = true
+							that.showAuthorizePhone = true
 							that.userInfo = res.data
 						})
 					},
@@ -1534,4 +1603,59 @@
 		background-color: green;
 		overflow: scroll !important;
 	}
+	.auth-btncard{
+	    .btn-unok{
+	        width: 50%;
+	        float: left;
+	    }
+	    .btn-ok{
+	        width: 50%;
+	        float: left;
+	        margin: 0;
+	        padding: 0;
+	        border: 0px solid transparent;  //自定义边框
+	        outline: none;    //消除默认点击蓝色边框效果
+	        u-button{
+	            margin: 0;
+	            padding: 0;
+	            border: 0px solid transparent;  //自定义边框
+	            outline: none;    //消除默认点击蓝色边框效果
+	        }
+	    }
+	}
+	.auth-card{
+	    text-align: center;
+	    .avatar-img{
+	        width: 150rpx;
+	        height: 150rpx;
+	        overflow: hidden;
+	        border-radius: 100%;
+	        margin-top: 30rpx;
+	    }
+	    .title{
+	        font-size: 20rpx;
+	    }
+	    .content{
+	        margin-top: 10rpx;
+	        margin-bottom: 30rpx;
+	    }
+	}
+	.avatar-wrapper{
+		width: 150rpx;
+		height: 100rpx;
+		color: #333 !important;
+		text-align: center !important;
+		border: none !important;
+		border-radius:0 !important;
+		background-color:transparent !important;
+	}
+	.avatar-wrapper::after {
+		border: none !important;
+	}
+	.avatar{
+		width: 100rpx;
+		height: 100rpx;
+		overflow: hidden;
+		border-radius: 100%;
+	}
 </style>