first commit

2026-03-28 23:09:02 +08:00
commit dac42e3b0c
3512 changed files with 181637 additions and 0 deletions
--- a/uni_modules/tuniaoui-wx-user-info/changelog.md
+++ b/uni_modules/tuniaoui-wx-user-info/changelog.md
@@ -0,0 +1,4 @@
+## 1.0.1（2022-11-22）
+更新使用文档
+## 1.0.0（2022-11-22）
+适配微信新版获取用户头像、昵称信息
--- a/uni_modules/tuniaoui-wx-user-info/components/tuniaoui-wx-user-info/tuniaoui-wx-user-info.vue
+++ b/uni_modules/tuniaoui-wx-user-info/components/tuniaoui-wx-user-info/tuniaoui-wx-user-info.vue
@@ -0,0 +1,379 @@
+<template>
+	<view v-if="openModal" class="wx-authorization-modal">
+		<view class="wam__mask" @touchmove.prevent="" @tap.stop="closeModal"></view>
+
+		<!-- 内容区域 -->
+		<view class="wam__wrapper">
+			<!-- 关闭按钮 -->
+			<view class="wam__close-btn" @tap.stop="closeModal">
+				<text class="tn-icon-close"></text>
+			</view>
+			<!-- 标题 -->
+			<view class="wam__title">获取您的昵称、头像</view>
+			<!-- tips -->
+			<view class="wam__sub-title">
+				获取用户头像、昵称，主要用于向用户提供具有辨识度的用户中心界面
+			</view>
+
+			<!-- 头像选择 -->
+			<view class="wam__avatar">
+				<view class="button-shadow">
+					<button class="button" open-type="chooseAvatar" @chooseavatar="chooseAvatarEvent">
+						<view v-if="userInfo.avatar" class="avatar__image">
+							<image class="image" :src="userInfo.avatar" mode="aspectFill"></image>
+						</view>
+						<view v-else class="avatar__empty">
+							<image class="image" :src="header" mode="aspectFill"></image>
+						</view>
+						<view class="avatar--icon">
+							<view class="tn-icon-camera-fill"></view>
+						</view>
+					</button>
+				</view>
+			</view>
+
+			<!-- 昵称输入 -->
+			<view class="wam__nickname">
+				<view class="nickname__data">
+					<input class="input" type="nickname" v-model="userInfo.nickname" placeholder="请输入昵称"
+						placeholder-style="color: #AAAAAA;">
+				</view>
+			</view>
+
+
+			<!-- 保存按钮 -->
+			<view class="wam__submit-btn" :class="[{
+          'disabled': !userInfo.avatar || !userInfo.nickname
+        }]" hover-class="tn-btn-hover-class" :hover-stay-time="150" @tap.stop="submitUserInfo">
+				保 存
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		options: {
+			// 在微信小程序中将组件节点渲染为虚拟节点，更加接近Vue组件的表现(不会出现shadow节点下再去创建元素)
+			virtualHost: true
+		},
+		props: {
+			nickname: {
+				type: String,
+				default: ''
+			},
+			header: {
+				type: String,
+				default: 'data:image/jpg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAA8AAD/4QMraHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjMtYzAxMSA2Ni4xNDU2NjEsIDIwMTIvMDIvMDYtMTQ6NTY6MjcgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzYgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjREMEQwRkY0RjgwNDExRUE5OTY2RDgxODY3NkJFODMxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjREMEQwRkY1RjgwNDExRUE5OTY2RDgxODY3NkJFODMxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NEQwRDBGRjJGODA0MTFFQTk5NjZEODE4Njc2QkU4MzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NEQwRDBGRjNGODA0MTFFQTk5NjZEODE4Njc2QkU4MzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAGBAQEBQQGBQUGCQYFBgkLCAYG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'
+			},
+			value: {
+				type: Boolean,
+				default: false
+			}
+		},
+		data() {
+			return {
+				openModal: false,
+				userInfo: {
+					avatar: '',
+					nickname: ''
+				},
+				base64Avatar: '',
+				ossdata: {}
+			}
+		},
+		mounted() {
+			this.userInfo.nickname = this.nickname
+			this.userInfo.avatar = this.header
+			this.getOssData()
+		},
+		watch: {
+			nickname(e) {
+				console.log(123);
+				this.userInfo.nickname = e
+			},
+			header(e) {
+				console.log(234);
+				this.userInfo.avatar = e
+			},
+			value: {
+				handler(val) {
+					this.openModal = val
+				},
+				immediate: true
+			}
+		},
+		methods: {
+			getOssData() {
+				this.$http.get('/com/oss/uptoken').then(({
+					data
+				}) => {
+					this.ossdata = data;
+				})
+			},
+			// 头像选择
+			chooseAvatarEvent(e) {
+				const {
+					avatarUrl
+				} = e.detail
+				this.userInfo.avatar = avatarUrl
+				let ext = avatarUrl.split('.').pop();
+				let key = this.ossdata.dir + Math.random() + '.' + ext;
+
+				uni.uploadFile({
+					url: this.ossdata.host, //仅为示例，非真实的接口地址
+					filePath: this.userInfo.avatar,
+					name: 'file',
+					formData: {
+						key: key,
+						OSSAccessKeyId: this.ossdata.accessid,
+						policy: this.ossdata.policy,
+						'success_action_status': '200',
+						Signature: this.ossdata.signature,
+					},
+					success: (res) => {
+						if (res.statusCode == 200) {
+							this.userInfo.avatar = this.ossdata.host + '/' + key;
+						}
+					}
+				});
+			},
+
+			// 更新用户信息
+			submitUserInfo() {
+				// 判断是否已经选择了用户头像和输入了用户昵称
+				console.log(this.userInfo);
+				if (!this.userInfo.avatar || !this.userInfo.nickname) {
+					return uni.showToast({
+						icon: 'none',
+						title: '请选择头像和输入用户信息'
+					})
+				}
+				
+				if (this.userInfo.nickname.length > 8) {
+					uni.showToast({
+						title: '最多8个字符',
+						icon: 'none'
+					})
+					return;
+				}
+				
+				// 更新完成事件
+				this.$emit('updated', this.userInfo)
+
+			},
+
+			// 关闭弹框
+			closeModal() {
+				this.$emit('input', false)
+			},
+
+
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import '../../static/iconfont.css';
+
+	.wx-authorization-modal {
+		position: fixed;
+		left: 0;
+		top: 0;
+		width: 100vw;
+		height: 100vh;
+		z-index: 99998;
+
+		view {
+			box-sizing: border-box;
+		}
+
+		.image {
+			width: 100%;
+			height: 100%;
+			border-radius: inherit;
+		}
+
+		.wam {
+
+			/* mask */
+			&__mask {
+				position: absolute;
+				left: 0;
+				top: 0;
+				width: 100%;
+				height: 100%;
+				background-color: rgba(0, 0, 0, 0.5);
+				opacity: 0;
+				animation: showMask 0.25s ease 0.1s forwards;
+			}
+
+			/* close-btn */
+			&__close-btn {
+				position: absolute;
+				top: 30rpx;
+				right: 30rpx;
+				z-index: 99999;
+			}
+
+			/* wrapper */
+			&__wrapper {
+				position: absolute;
+				left: 0;
+				bottom: 0;
+				width: 100%;
+				background-color: #FFFFFF;
+				border-radius: 20rpx 20rpx 0rpx 0rpx;
+				padding: 40rpx;
+				padding-top: 60rpx;
+				padding-bottom: 40rpx;
+				padding-bottom: calc(constant(safe-area-inset-bottom) + 40rpx);
+				padding-bottom: calc(env(safe-area-inset-bottom) + 40rpx);
+				transform-origin: center bottom;
+				transform: scaleY(0);
+				animation: showWrapper 0.25s ease 0.1s forwards;
+				z-index: 99999;
+			}
+
+			/* title */
+			&__title {
+				font-size: 34rpx;
+			}
+
+			/* sub-title */
+			&__sub-title {
+				font-size: 26rpx;
+				color: #AAAAAA;
+				margin-top: 16rpx;
+				padding-bottom: 30rpx;
+			}
+
+			/* 头像选择 */
+			&__avatar {
+				width: 100%;
+				margin-top: 30rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+
+				.button-shadow {
+					border: 8rpx solid rgba(255, 255, 255, 0.05);
+					box-shadow: 0rpx 0rpx 80rpx 0rpx rgba(0, 0, 0, 0.15);
+					border-radius: 50%;
+				}
+
+				.button {
+					position: relative;
+					width: 160rpx;
+					height: 160rpx;
+					border-radius: 50%;
+					overflow: visible;
+					background-image: repeating-linear-gradient(45deg, #E4E9EC, #F8F7F8);
+					color: #FFFFFF;
+					background-color: transparent;
+					padding: 0;
+					margin: 0;
+					font-size: inherit;
+					line-height: inherit;
+					border: none;
+
+					&::after {
+						border: none;
+					}
+				}
+
+				.avatar {
+
+					&__empty,
+					&__image {
+						width: 100%;
+						height: 100%;
+						border-radius: inherit;
+					}
+
+					&--icon {
+						position: absolute;
+						right: -10rpx;
+						bottom: -6rpx;
+						width: 60rpx;
+						height: 60rpx;
+						// transform: translate(50%, 50%);
+						background-color: #1D2541;
+						color: #FFFFFF;
+						border-radius: 50%;
+						border: 6rpx solid #FFFFFF;
+						line-height: 1;
+						font-size: 36rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+					}
+				}
+			}
+
+			/* 昵称 */
+			&__nickname {
+				margin-top: 40rpx;
+
+				.nickname {
+
+					&__data {
+						margin-top: 16rpx;
+						width: 100%;
+						padding: 26rpx 20rpx;
+						border-radius: 10rpx;
+						background-color: #F8F7F8;
+
+						.input {
+							color: #080808;
+						}
+					}
+				}
+			}
+
+			/* 保存按钮 */
+			&__submit-btn {
+				width: 100%;
+				background-color: #05C160;
+				color: #FFFFFF;
+				margin-top: 60rpx;
+				border-radius: 10rpx;
+				padding: 25rpx;
+				font-size: 32rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+
+				&.disabled {
+					background-color: #E6E6E6;
+				}
+			}
+
+
+		}
+	}
+
+	.tn-btn-hover-class {
+		box-shadow: inset 10rpx 2rpx 40rpx 0rpx rgba(0, 0, 0, 0.05);
+	}
+
+	@keyframes showMask {
+		0% {
+			opacity: 0;
+		}
+
+		100% {
+			opacity: 1;
+		}
+	}
+
+	@keyframes showWrapper {
+		0% {
+			transform: scaleY(0);
+		}
+
+		100% {
+			transform: scaleY(1);
+		}
+	}
+</style>
--- a/uni_modules/tuniaoui-wx-user-info/package.json
+++ b/uni_modules/tuniaoui-wx-user-info/package.json
@@ -0,0 +1,82 @@
+{
+  "id": "tuniaoui-wx-user-info",
+  "displayName": "图鸟UI-微信用户信息设置弹框",
+  "version": "1.0.1",
+  "description": "设置微信用户头像、昵称信息",
+  "keywords": [
+    "微信小程序",
+    "微信小程序用户信息",
+    "图鸟UI"
+],
+  "repository": "",
+"engines": {
+  },
+  "dcloudext": {
+    "type": "component-vue",
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "插件不采集任何数据",
+      "permissions": "无"
+    },
+    "npmurl": ""
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "Vue": {
+          "vue2": "y",
+          "vue3": "u"
+        },
+        "App": {
+          "app-vue": "n",
+          "app-nvue": "n"
+        },
+        "H5-mobile": {
+          "Safari": "n",
+          "Android Browser": "n",
+          "微信浏览器(Android)": "n",
+          "QQ浏览器(Android)": "n"
+        },
+        "H5-pc": {
+          "Chrome": "n",
+          "IE": "n",
+          "Edge": "n",
+          "Firefox": "n",
+          "Safari": "n"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "n",
+          "百度": "n",
+          "字节跳动": "n",
+          "QQ": "n",
+          "钉钉": "n",
+          "快手": "n",
+          "飞书": "n",
+          "京东": "n"
+        },
+        "快应用": {
+          "华为": "n",
+          "联盟": "n"
+        }
+      }
+    }
+  }
+}
--- a/uni_modules/tuniaoui-wx-user-info/readme.md
+++ b/uni_modules/tuniaoui-wx-user-info/readme.md
@@ -0,0 +1,84 @@
+
+# 使用说明
+
+使用方法：
+
+```
+<template>
+	<view class="login-page">
+    <!-- 授权登录按钮 -->
+    <view class="submit-btn"  @tap.stop="openAuthorizationModal">
+      授权登录
+    </view>
+    
+    
+    <wx-user-info-modal
+      v-model="showAuthorizationModal"
+      @updated="updatedUserInfoEvent"
+    ></wx-user-info-modal>
+	</view>
+</template>
+
+<script>
+  import WxUserInfoModal from '@/uni_modules/tuniaoui-wx-user-info/components/tuniaoui-wx-user-info/tuniaoui-wx-user-info.vue'
+  
+	export default {
+    components: { WxUserInfoModal },
+		data() {
+			return {
+				showAuthorizationModal: false
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+
+      // 打开获取用户信息弹框
+      openAuthorizationModal() {
+        this.showAuthorizationModal = true
+      },
+      
+      // 获取到的用户信息
+      updatedUserInfoEvent(info) {
+        console.log('获取到的用户信息', info)
+      },
+      
+      
+		}
+	}
+</script>
+
+<style>
+	.login-page {
+    width: 100vw;
+    height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  
+  /* 授权按钮 */
+  .submit-btn {
+    width: 100%;
+    background-color: #05C160;
+    color: #FFFFFF;
+    margin-top: 60rpx;
+    border-radius: 10rpx;
+    padding: 25rpx;
+    font-size: 32rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 30rpx;
+  }
+</style>
+
+```
+
+参数说明：
+
+| 参数       | 说明                                                 |
+| :-------- | ---------------------------------------------------- |
+| v-model   | 弹出、关闭设置用户信息弹框                               |
+
--- a/uni_modules/tuniaoui-wx-user-info/static/iconfont.css
+++ b/uni_modules/tuniaoui-wx-user-info/static/iconfont.css
@@ -0,0 +1,25 @@
+@charset "UTF-8";
+
+@font-face {
+  font-family: "tuniaoFont"; /* Project id 3784643 */
+  src: 
+       url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAN8AAsAAAAAB4gAAAMvAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDBgqCQIIdATYCJAMMCwgABCAFhH8HPRuYBiMRpmvPIfurAzsYPj7DCVbrRAmElfXCs4V6xacO8aHO69VXu54tTy8h0hcJ7ufgieY+3+xscrn9B8wKQQFBywplLZCw9SwcOyZ5pKsoAQAbcICJTr7AjPPqr06NRkeIAemFpXv8cje1+/LkuLvD789WJZUANjOe9F76qptDOSMUui/Ua0WQKpZGXaqf5hHZdAD6x8tRJtRKtQd7j5UKkk6lWywYkGADCZBnGLugJd6CAI4GOjH956Ep4k7imdNkYTGFAkm2nJyPrBNwA7YhWwgQ/K4bLXITD8wl8xxuBN+XwyYJwOAp5jFjOwNbPNwd3l3WiyFAv3sCBLjcAB6gQM3GjLLSbJpDo1ANiqsiFiX7WAQzqTcMA06j/pb/eAbEx8yMAaAChg3sDjs6COwub8IAoAD4PEZkA7iAZClPKdicmJLc2OiZcQC3cV613sc3Ab9W7YItQtio9YgdKGjgr+ANlbg5gPvXFacv8IyvKTH4pcjV7VIcfnuIAUd3VCbxcCIKj++rvr/hpx/iwxd4/5mxDXeILbBp2+ByMIlGMuQEU3gjiVaMcXk8Dn2gWo5wuRwuIldLRqRwWogvmCRXE9/kSvrVQP4iFDVWRSbRakMk/AtcBYVpO6rpah1V9J/m/Wt+q8WfsOV+S5KFTGD5dwW9KFstZUs5smuYK3V495zwUG+r/Izf0PWtbWj/HUQsAL9u+cGK8NCiAgRnaRJ49fqljrxWc4PaKs4pQwBlMLUeAzgcEGLakvg5nCZ3zgTBkZzAEEUuFEeJyMrq4BGhGT6OPjiqGd4eIZkLKGKjgTKuAAgpPIAhjmdQUngnsrJdeKTxBz4pkgjHjJQeFqFMXv8PQqg0QP+F2cbAdoHqFmaM52jYlcbNoeTq4CtPkjzHAE1Zl0QvFEjGmp9fY6vKwBI9kOvIuQhJ4kJWy0k1dVXFVXcpbfTmIIRKA/RfmG0M7G1T3cKM8VwMXGlEnR1KY0uU+CTJnM1ODk1ZdxJdSOjYdGOp+TW2k6szsNg8qIvIuQipetFCVstpQCB1lcXHXUl5ZOpfdBvgMI9QMaJi8TZdzLS36K8/ueDZOWMAAA==') format('woff2'),
+       url('//at.alicdn.com/t/c/font_3784643_5jru9pe5fad.woff?t=1669045092678') format('woff'),
+       url('//at.alicdn.com/t/c/font_3784643_5jru9pe5fad.ttf?t=1669045092678') format('truetype');
+}
+
+[class*='tn-icon-'] {
+  font-family: 'tuniaoFont' !important;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  text-align: center;
+  text-decoration: none;
+}
+
+.tn-icon-close:before {
+  content: "\e74d";
+}
+
+.tn-icon-camera-fill:before {
+  content: "\e75d";
+}