Zory 4 недель назад
Родитель
Сommit
b8425086cc
49 измененных файлов с 3490 добавлено и 45 удалено
  1. 89 0
      components/login/halfScreen.vue
  2. 5 1
      main.js
  3. 13 1
      pages.json
  4. 9 7
      pages/index/index.vue
  5. 4 3
      pages/revenue/revenue.vue
  6. 122 0
      pages/task/filter.vue
  7. 199 18
      pages/task/task.vue
  8. 94 14
      pages/user/user.vue
  9. BIN
      static/mine/favorite.png
  10. BIN
      static/mine/history.png
  11. BIN
      static/mine/service.png
  12. BIN
      static/mine/setting.png
  13. BIN
      static/mine/signed-icon.png
  14. 104 0
      uni_modules/uni-popup/changelog.md
  15. 45 0
      uni_modules/uni-popup/components/uni-popup-dialog/keypress.js
  16. 330 0
      uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue
  17. 143 0
      uni_modules/uni-popup/components/uni-popup-message/uni-popup-message.vue
  18. 188 0
      uni_modules/uni-popup/components/uni-popup-share/uni-popup-share.vue
  19. 7 0
      uni_modules/uni-popup/components/uni-popup/i18n/en.json
  20. 8 0
      uni_modules/uni-popup/components/uni-popup/i18n/index.js
  21. 7 0
      uni_modules/uni-popup/components/uni-popup/i18n/zh-Hans.json
  22. 7 0
      uni_modules/uni-popup/components/uni-popup/i18n/zh-Hant.json
  23. 45 0
      uni_modules/uni-popup/components/uni-popup/keypress.js
  24. 26 0
      uni_modules/uni-popup/components/uni-popup/popup.js
  25. 90 0
      uni_modules/uni-popup/components/uni-popup/uni-popup.uvue
  26. 518 0
      uni_modules/uni-popup/components/uni-popup/uni-popup.vue
  27. 108 0
      uni_modules/uni-popup/package.json
  28. 15 0
      uni_modules/uni-popup/readme.md
  29. 8 0
      uni_modules/uni-scss/changelog.md
  30. 1 0
      uni_modules/uni-scss/index.scss
  31. 82 0
      uni_modules/uni-scss/package.json
  32. 4 0
      uni_modules/uni-scss/readme.md
  33. 7 0
      uni_modules/uni-scss/styles/index.scss
  34. 3 0
      uni_modules/uni-scss/styles/setting/_border.scss
  35. 66 0
      uni_modules/uni-scss/styles/setting/_color.scss
  36. 55 0
      uni_modules/uni-scss/styles/setting/_radius.scss
  37. 56 0
      uni_modules/uni-scss/styles/setting/_space.scss
  38. 167 0
      uni_modules/uni-scss/styles/setting/_styles.scss
  39. 24 0
      uni_modules/uni-scss/styles/setting/_text.scss
  40. 146 0
      uni_modules/uni-scss/styles/setting/_variables.scss
  41. 19 0
      uni_modules/uni-scss/styles/tools/functions.scss
  42. 31 0
      uni_modules/uni-scss/theme.scss
  43. 62 0
      uni_modules/uni-scss/variables.scss
  44. 31 0
      uni_modules/uni-transition/changelog.md
  45. 131 0
      uni_modules/uni-transition/components/uni-transition/createAnimation.js
  46. 292 0
      uni_modules/uni-transition/components/uni-transition/uni-transition.vue
  47. 112 0
      uni_modules/uni-transition/package.json
  48. 11 0
      uni_modules/uni-transition/readme.md
  49. 6 1
      utils/css/main.css

+ 89 - 0
components/login/halfScreen.vue

@@ -0,0 +1,89 @@
+<template>
+	<view>
+		<uni-popup ref="loginPop" type="bottom" border-radius="10px 10px 0 0" background-color="#ffffff" :mask-click="false">
+			<view class="login-popup">
+				<view class="login-title">
+					<view class="login-logo">
+						<view class="logo"><image src="/static/rank/avatar.jpeg" mode="widthFix"></image></view>
+						<view class="name">蓝微Star</view>
+					</view>
+					<view class="login-close" @click="closeLogin"><text class="cuIcon-close"></text></view>
+				</view>
+				<view class="login-desc">为了更好的为您提供服务,本次操作需要您关联手机号码</view>
+				<view class="login-footer">
+					<view :class="checkTrueState?'checkBox active':'checkBox'" @click="checkTrue">
+						<text class="cuIcon-check"></text>
+					</view>
+					<view @click="checkTrue">我已阅读并同意</view>
+					<text @click="toWeb('privacy')">用户协议、</text><text @click="toWeb('privacy')">隐私协议</text>
+				</view>
+				<view class="logi-btn">
+					<button class="u-button full" @click="getUserInfo" v-if="checkTrueState">快捷一键登录</button>
+					<button class="u-button full" @click="toLoginCheck" v-else>快捷登录</button>
+					<button class="u-button" @click="closeLogin">暂不登录</button>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			checkTrueState:false
+		}
+	},
+	methods: {
+		closeLogin(){
+			uni.showTabBar()
+			this.$refs.loginPop.close()
+		},
+		checkTrue(){
+			this.checkTrueState = !this.checkTrueState;
+		},
+		toWeb(type){
+			
+		},
+		toLoginCheck(){
+			if (!this.checkTrueState) {
+				uni.showToast({
+					title: "请先阅读同意用户协议",
+					icon:"none"
+				})
+				return ;
+			}
+		},
+		getUserInfo(){
+			
+		},
+		open() {
+			uni.hideTabBar();
+			this.$nextTick(()=>{
+				this.$refs.loginPop.open()
+			})
+		}
+	}
+}
+</script>
+
+<style>
+.login-popup{padding: 20rpx;min-height: 30vh;}
+.login-popup .login-title{display: flex;align-items: center;justify-content: space-between;}
+.login-popup .login-title .login-logo{display: flex;align-items: center;gap: 15rpx;}
+.login-popup .login-title .login-logo image{width: 50rpx;height: 50rpx;border-radius: 100%;}
+.login-popup .login-title .name{font-weight: bold;font-family: "bluevBold";color: #000;font-size: 28rpx;}
+.login-desc{line-height: 2;color: #666;font-size: 24rpx;margin: 20rpx 0;text-align: center;}
+
+.login-footer{font-size: 28rpx;color: #666;height: 20%;display: flex;align-items: center;justify-content: center;}
+.login-footer text{color: #85DFFE;}
+.checkBox{width: 36upx;height: 36upx;margin-right: 20upx;border: 2upx solid #85DFFE;position: relative;border-radius: 36upx;display: flex;align-items: center;justify-content: center;}
+.checkBox text{display: block;color: #fff;}
+.checkBox.active{background-color: #85DFFE;}
+.checkBox.active text{color: #fff;}
+
+.logi-btn{width: 60%;margin: 20upx auto;height: 40%;}
+.logi-btn .u-button{font-size: 28upx;height: 80upx;border-radius: 40upx;line-height: 80upx;margin-top: 40upx;color: #333;border: 2upx solid rgba(33, 34, 38, 1);background-color: #fff;}
+.logi-btn .u-button::after{border: 0;}
+.logi-btn .u-button.full{background-color: rgba(33, 34, 38, 1);color: #fff;}
+</style>

+ 5 - 1
main.js

@@ -1,7 +1,11 @@
 import App from './App'
 
 import cuCustom from './components/statusBar/cu-custom'
-Vue.component('cu-custom',cuCustom)
+Vue.component('cu-custom',cuCustom)
+
+
+import halfLogin from './components/login/halfScreen'
+Vue.component('half-login',halfLogin)
 
 // #ifndef VUE3
 import Vue from 'vue'

+ 13 - 1
pages.json

@@ -69,6 +69,18 @@
 				"disableScroll": true,
 				"usingComponents": true
 			}
+		},
+		{
+			"path": "components/login/halfScreen",
+			"style": {
+				"navigationBarTitleText": ""
+			}
+		},
+		{
+			"path": "pages/task/filter",
+			"style": {
+				"navigationBarTitleText": ""
+			}
 		}
 	],
 	"globalStyle": {
@@ -79,7 +91,7 @@
 	},
 	"tabBar": {
 		"backgroundColor": "#ffffff",
-		"borderStyle": "white",
+		"borderStyle": "black",
 		"selectedColor": "#212226",
 		"list": [
 			{

+ 9 - 7
pages/index/index.vue

@@ -51,7 +51,7 @@
 					</view>
 				</view>
 				<view class="home-content">
-					<view class="banner">
+					<view class="banner" @click="test">
 						<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/home-top-banner.png" mode="widthFix"></image>
 					</view>
 					<view class="quick-nav">
@@ -140,7 +140,8 @@
 					</view>
 				</view>
 			</scroll-view>
-		</block>
+		</block>
+		<halfLogin ref="loginCom"></halfLogin>
 	</view>
 </template>
 
@@ -148,7 +149,8 @@
 var app;
 export default {
 	data() {
-		return {
+		return {
+			loginState:true,
 			loading:false,
 			scrollHeight:0,
 			starData:[
@@ -193,6 +195,10 @@ export default {
 		pageScroll(event) {
 			var scrollHeight = event.detail.scrollTop;
 			app.scrollHeight = scrollHeight;
+		},
+		test(){
+			this.$refs.loginCom.open();
+			this.loginState = true;
 		}
 	}
 }
@@ -273,8 +279,4 @@ page{background-color: #f8f8f8;}
 	max-height: 200rpx;
 	border-radius: 100%;
 }
-.scroll-content{
-	width: 100%;
-	height: 100vh;
-}
 </style>

+ 4 - 3
pages/revenue/revenue.vue

@@ -2,7 +2,8 @@
 	<view class="content">
 		<cu-custom bgColor="bg-bluev-head">
 			<block slot="content">收益</block>
-		</cu-custom>		
+		</cu-custom>	
+		<halfLogin ref="loginCom"></halfLogin>	
 	</view>
 </template>
 
@@ -10,8 +11,8 @@
 var app;
 export default {
 	data() {
-		return {
-			
+		return {
+			loginState:false
 		}
 	},
 	onLoad() {

+ 122 - 0
pages/task/filter.vue

@@ -0,0 +1,122 @@
+<template>
+	<view class="task-status">
+		<view class="platform">
+			<view class="platform-item active">
+				<view class="name">全部</view>
+				<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/tab-active-badge.png"></image>
+			</view>
+			<view class="platform-item">
+				<view class="name">抖音</view>
+				<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/tab-active-badge.png"></image>
+			</view>
+			<view class="platform-item">
+				<view class="name">快手</view>
+				<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/tab-active-badge.png"></image>
+			</view>
+			<view class="platform-item">
+				<view class="name">小红书</view>
+				<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/tab-active-badge.png"></image>
+			</view>
+			<view class="platform-item">
+				<view class="name">视频号</view>
+				<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/tab-active-badge.png"></image>
+			</view>
+		</view>
+		<view class="filter" @click="showFilter(1)">
+			<view class="filter-item" v-for="(item,indx) in filterData" :key="indx">
+				{{item.name}}
+				<text class="cuIcon-triangledownfill"></text>
+			</view>
+		</view>
+		
+		<uni-popup ref="filterPop" type="bottom" border-radius="10px 10px 0 0" background-color="#ffffff" :mask-click="false">
+			<view class="filter-popup">
+				<view class="title">
+					<view class="name">
+						<text>任务筛选</text>
+						<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/tab-active-badge.png"></image>
+					</view>
+					<view class="close" @click="showFilter(2)"><text class="cuIcon-close"></text></view>
+				</view>
+				<view class="filter-option-body">
+					<view class="filter-check" v-for="(item,indx) in filterData" :key="indx">
+						<view class="name">{{item.name}}</view>
+						<view class="children">
+							<view :class="sub.index==0?'children-item active':'children-item'" v-for="(sub,inddx) in item.children" :key="inddx">
+								{{ sub.name }}
+							</view>
+						</view>
+					</view>
+				</view>
+				<view class="filter-btn-group">
+					<view class="u-button full">确定</view>
+					<view class="u-button" @click="showFilter(2)">取消</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			filterData:this.data
+		}
+	},
+	props: {
+		data: {
+			type: Array,
+			default: []
+		},
+	},
+	methods: {
+		showFilter(type){
+			if (type == 1) {
+				uni.hideTabBar()
+				this.$refs.filterPop.open();
+			}
+			if (type == 2){
+				uni.showTabBar() 
+				this.$refs.filterPop.close();
+			}
+		},
+	}
+}
+</script>
+
+<style>
+
+
+.filter-popup{height: 60vh;}
+
+.filter-popup .filter-option-body{padding: 20rpx;}
+.filter-popup .filter-option-body .filter-check{}
+.filter-popup .filter-option-body .filter-check .name{font-size: 28rpx;color: #000;}
+.filter-popup .filter-option-body .filter-check .children{display: flex;align-items: center;gap: 20rpx;flex-wrap: wrap;}
+.filter-popup .filter-option-body .filter-check .children-item{background-color: rgba(246, 246, 246, 1);border-radius: 6rpx;color: rgba(89, 91, 98, 1);font-size: 24rpx;padding: 15rpx 20rpx;text-align: center;margin: 20rpx 0;}
+.filter-popup .filter-option-body .filter-check .children-item.active{background-color: rgba(89, 91, 98, 1);color: #fff;}
+
+.filter-popup .title{display: flex;align-items: center;justify-content: space-between;padding: 20rpx;}
+.filter-popup .title .name{font-size: 32rpx;color: #000;font-weight: 800;position: relative;}
+.filter-popup .title .name text{position: relative;z-index: 999;font-family: "bluevBold";}
+.filter-popup .title .name image{width: 82rpx;height: 52rpx;position: absolute;right: -20rpx;bottom: 0;z-index: 99;}
+
+.filter-popup .filter-option-body{height: calc(100% - 200rpx);overflow-y: auto;}
+.filter-popup .filter-btn-group{display: flex;align-items: center;gap: 20rpx;padding: 20rpx;}
+.filter-btn-group .u-button{font-size: 28upx;height: 80upx;border-radius: 10upx;line-height: 80upx;margin-top: 40upx;color: #333;border: 2upx solid rgba(33, 34, 38, 1);background-color: #fff;flex: 1;text-align: center;font-family: "bluevBold";}
+.filter-btn-group .u-button::after{border: 0;}
+.filter-btn-group .u-button.full{background-color: rgba(33, 34, 38, 1);color: #fff;}
+
+.task-status .filter{display: flex;align-items: center;justify-content: space-around;gap: 10rpx;}
+.task-status .filter .filter-item{display: flex;align-items: center;background-color: rgba(246, 246, 246, 1);border-radius: 12rpx;color: rgba(89, 91, 98, 1);flex: 1;font-size: 24rpx;justify-content: center;padding: 10rpx;}
+.task-status .filter .filter-item.active{background-color: rgba(89, 91, 98, 1);color: #fff;}
+.task-status .filter .filter-item text{margin-left: auto;margin-right: 0;color: rgba(200, 200, 200, 1);font-size: 28rpx;}
+
+.task-status .platform{display: flex;align-items: center;font-size: 32rpx;color: #666;justify-content: space-around;margin: 20rpx 0;}
+.task-status .platform .platform-item{display: flex;align-items: center;position: relative;}
+.task-status .platform .platform-item .name{position: relative;z-index: 999;}
+.task-status .platform .platform-item image{width: 82rpx;height: 52rpx;position: absolute;right: -20rpx;bottom: 0;z-index: 99;display: none;}
+.task-status .platform .platform-item.active image{display: block;}
+.task-status .platform .platform-item.active{color: #000;font-weight: 800;font-family: "bluevBold";}
+</style>

+ 199 - 18
pages/task/task.vue

@@ -1,40 +1,215 @@
 <template>
-	<view class="content">
-		<view class="task-header">
-			<cu-custom>
-				<block slot="content">任务广场</block>
-			</cu-custom>
-			<view class="sub-name">任务多,变现快!</view>
-			<view class="sub-logo" :style="style"><image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/task-star-small.png" mode="widthFix"></image></view>
-		</view>
-		<view class="task-content">
-			
-		</view>
+	<view class="content">
+		<scroll-view scroll-y="true" class="scroll-content" :enhanced="true" :bounces="false" :show-scrollbar="false" @scroll="pageScroll">
+			<view class="task-header">
+				<cu-custom :bgColor="scrollHeight>20?'bg-bluev-head':'none'">
+					<block slot="content">任务广场</block>
+				</cu-custom>
+				<view class="sub-name">任务多,变现快!</view>
+				<view class="sub-logo" :style="style"><image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/task-star-small.png" mode="widthFix"></image></view>
+			</view>
+			<view class="fixed-filter" :style="fixedStyle" v-if="scrollHeight>20">
+				<filterMain :data="filterData" @success="searchFilter"></filterMain>
+			</view>
+			<view class="task-content">
+				<view class="home-search">
+					<image src="https://blue-data.oss-cn-guangzhou.aliyuncs.com/star/search-icon.png" mode="widthFix"></image>
+					<input type="text" class="search-input" placeholder="搜一搜最新任务" />
+				</view>
+				<view class="task-status" v-if="scrollHeight<20">
+					<filterMain :data="filterData" @success="searchFilter"></filterMain>
+				</view>
+				<view class="star-task-list">
+					<view class="task-item" v-for="(item,indx) in 10" :key="indx">
+						<view class="item-body">
+							<view class="item-img">
+								<image src="https://p9-dy.byteimg.com/obj/ecom-shop-material/jpeg_m_e3fa80e91300b16e0df15e2bcbd8c003_sx_426270_www800-800" mode="aspectFill"></image>
+							</view>
+							<view class="item-info">
+								<view class="title">【官方正品】金纺柔顺剂宝宝衣物适用0漂白剂抗静电蓬松不僵硬CW-星川任务-202</view>
+								<view class="item-tags">
+									<view class="tag-item">抖音</view>
+									<view class="tag-item">手拍</view>
+									<view class="tag-item">真人出境</view>
+								</view>
+								<view class="item-price">
+									<view class="item-platform">抖音L1</view>
+									<view class="price-txt"><text>¥</text>20.0w</view>
+								</view>
+							</view>
+						</view>
+						<view class="item-foot">
+							<view class="item-join">
+								<view class="cu-avatar-group">
+									<view class="cu-avatar round sm" v-for="(item,index) in avatar" :key="index" :style="[{ backgroundImage:'url(' + avatar[index] + ')' }]"></view>
+								</view>
+								<view class="join-text"><text>180</text>/200人已参加</view>
+							</view>
+							<view class="foot-btn">
+								<button class="btn disabled" :disabled="true">立即参加</button>
+							</view>
+						</view>
+					</view>
+				</view>
+				<view class="star-task-more"></view>
+			</view>
+		</scroll-view>
+		<halfLogin ref="loginCom"></halfLogin>
 	</view>
 </template>
 
 <script>
-var app;
-export default {
+var app;
+import filterMain from "./filter";
+export default {
+	components: {
+		filterMain
+	},
 	data() {
 		return {
-			style:""
+			style:"",
+			fixedStyle:"",
+			scrollHeight:0,
+			avatar: [
+				'https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg',
+				'https://ossweb-img.qq.com/images/lol/web201310/skin/big81005.jpg',
+				'https://ossweb-img.qq.com/images/lol/web201310/skin/big25002.jpg',
+				'https://ossweb-img.qq.com/images/lol/web201310/skin/big91012.jpg'
+			],
+			filterData:[
+				{
+					"name":"任务状态",
+					"children":[
+						{
+							"name":"全部",
+							"hide":"任务状态",
+							"index":0
+						},
+						{
+							"name":"招募中",
+							"hide":"招募中",
+							"index":1
+						},
+						{
+							"name":"已终止",
+							"hide":"已终止",
+							"index":2
+						}
+					]
+				},
+				{
+					"name":"平台等级",
+					"children":[
+						{
+							"name":"全部",
+							"hide":"平台等级",
+							"index":0
+						},
+						{
+							"name":"LV.1",
+							"hide":"LV.1",
+							"index":1
+						},
+						{
+							"name":"LV.2",
+							"hide":"LV.2",
+							"index":2
+						},
+						{
+							"name":"LV.3",
+							"hide":"LV.3",
+							"index":3
+						},
+						{
+							"name":"LV.4",
+							"hide":"LV.4",
+							"index":4
+						}
+					]
+				},
+				{
+					"name":"任务奖励",
+					"children":[
+						{
+							"name":"不限",
+							"hide":"任务奖励",
+							"index":0
+						},
+						{
+							"name":"100以下",
+							"hide":"100以下",
+							"index":1
+						},
+						{
+							"name":"100-500",
+							"hide":"100-500",
+							"index":2
+						},
+						{
+							"name":"500以上",
+							"hide":"以上",
+							"index":3
+						}
+					]
+				},
+				{
+					"name":"排序方式",
+					"children":[
+						{
+							"name":"不限",
+							"hide":"排序方式",
+							"index":0
+						},
+						{
+							"name":"综合排序",
+							"hide":"综合",
+							"index":1
+						},
+						{
+							"name":"奖励最高",
+							"hide":"最高",
+							"index":2
+						},
+						{
+							"name":"奖励最低",
+							"hide":"最低",
+							"index":3
+						},
+						{
+							"name":"最新发布",
+							"hide":"最新",
+							"index":4
+						}
+					]
+				}
+			]
 		}
 	},
 	onLoad() {
 		app = this;
 		var StatusBar= this.StatusBar;
+		var CustomBar= this.CustomBar;
 		var style = `top:${StatusBar}px;`;
-		app.style = style;
+		app.style = style;
+		app.fixedStyle = `top:${CustomBar}px;`;
 	},
 	methods: {
-
+		pageScroll(event) {
+			var scrollHeight = event.detail.scrollTop;
+			app.scrollHeight = scrollHeight;
+		},
+		searchFilter(){
+			
+		}
 	}
 }
 </script>
 
 <style lang="scss">
-page{background-color: #f8f8f8;}
+page{background-color: #f8f8f8;}
+
+.fixed-filter{position: fixed;background-image: linear-gradient(180deg, #f8f8f8 9%, #fff 100%);z-index: 999;padding: 10rpx 20rpx;right: 0;left: 0;}
+
 .task-header{position: relative;background-image: linear-gradient(180deg, #85DFFE 9%, #D5F4FF 62.55%, #f8f8f8 100%);height: 290rpx;}
 .task-header .sub-name{font-size: 32rpx;font-weight: 800;font-family: "bluevBold";padding-left: 20rpx;padding-top: 20rpx;}
 .task-header .sub-logo{
@@ -48,5 +223,11 @@ page{background-color: #f8f8f8;}
 	/* #endif */
 }
 .task-header .sub-logo image{width: 220rpx;max-height: 220rpx;}
-.task-content{background-image: linear-gradient(180deg, #ffffff, #f8f8f8);height: 100vh;border-radius: 40upx 40upx 0 0;}
+.task-content{background-image: linear-gradient(180deg, #ffffff 1%, #f8f8f8 100%);border-radius: 40upx 40upx 0 0;padding: 20rpx;}
+
+.home-search-loading{margin: 20rpx;height: 68rpx;}
+.home-search{display: flex;align-items: center;background-color: rgba(246, 246, 246, 1);border-radius: 10rpx;height: 68rpx;padding: 0 20rpx;gap: 20rpx;}
+.home-search image{width: 32rpx;height: 32rpx;}
+.home-search .search-input{font-size: 24rpx;width: 100%;border: 0;height: 100%;box-sizing: none;box-shadow: none;}
+
 </style>

+ 94 - 14
pages/user/user.vue

@@ -55,10 +55,64 @@
 					</view>
 				</view>
 				<view class="user-menu-service">
-					<view class=""></view>
+					<view class="title">我的服务</view>
+					<view class="service-body">
+						<view class="service-item">
+							<view class="icon"><image src="/static/mine/task.png" mode="widthFix"></image></view>
+							<view class="name">我的任务</view>
+						</view>
+						<view class="service-item">
+							<view class="icon"><image src="/static/mine/income.png" mode="widthFix"></image></view>
+							<view class="name">我的收益</view>
+						</view>
+						<view class="service-item">
+							<view class="icon"><image src="/static/mine/certify.png" mode="widthFix"></image></view>
+							<view class="name">达人认证</view>
+						</view>
+						<view class="service-item">
+							<view class="icon"><image src="/static/mine/service-bind.png" mode="widthFix"></image></view>
+							<view class="name">帐号绑定</view>
+						</view>
+					</view>
+				</view>
+				<view class="user-menu-normal" v-for="(item,indx) in 2" :key="indx">
+					<view class="title">常用功能</view>
+					<view class="normal-body">
+						<view class="normal-item">
+							<view class="icon"><image src="/static/mine/common-favorite.png" mode="widthFix"></image></view>
+							<view class="name">我的收藏</view>
+							<view class="more"><text class="cuIcon-right"></text></view>
+						</view>
+						<view class="normal-item">
+							<view class="icon"><image src="/static/mine/common-history.png" mode="widthFix"></image></view>
+							<view class="name">浏览记录</view>
+							<view class="more"><text class="cuIcon-right"></text></view>
+						</view>
+						<view class="normal-item">
+							<view class="icon"><image src="/static/mine/common-cooperate.png" mode="widthFix"></image></view>
+							<view class="name">商务合作</view>
+							<view class="more"><text class="cuIcon-right"></text></view>
+						</view>
+						<view class="normal-item">
+							<view class="icon"><image src="/static/mine/common-leader.png" mode="widthFix"></image></view>
+							<view class="name">成为团长</view>
+							<view class="more"><text class="cuIcon-right"></text></view>
+						</view>
+						<view class="normal-item">
+							<view class="icon"><image src="/static/mine/common-address.png" mode="widthFix"></image></view>
+							<view class="name">收货地址</view>
+							<view class="more"><text class="cuIcon-right"></text></view>
+						</view>
+						<view class="normal-item">
+							<view class="icon"><image src="/static/mine/setting.png" mode="widthFix"></image></view>
+							<view class="name">设置</view>
+							<view class="more"><text class="cuIcon-right"></text></view>
+						</view>
+					</view>
 				</view>
 			</view>
 		</scroll-view>
+		<halfLogin ref="loginCom"></halfLogin>
 	</view>
 </template>
 
@@ -84,19 +138,20 @@ export default {
 
 <style lang="scss">
 page{background-color: #f8f8f8;}
-.user-body .user-level-body .level-foot{display: flex;align-items: center;justify-content: space-between;gap: 20rpx;}
-.user-body .user-level-body .level-foot .level-step{background-color: #E4E4E4;height: 10rpx;flex: 1;border-radius: 10rpx;}
-.user-body .user-level-body .level-foot .level-step .success{background-color: #87E0FF;height: 10rpx;border-radius: 10rpx;}
-.user-body .user-level-body .level-foot .level-num{color: #999;font-size: 22rpx;}
-.user-body .user-level-body .level-foot .level-num text{color: #666;}
-.user-body .user-level-body .level-mid{margin: 10rpx 0;font-size: 22rpx;color: #8C8C8C;}
-.user-body .user-level-body .level-top{display: flex;align-items: center;justify-content: space-between;}
-.user-body .user-level-body .level-top .level-name{color: #000;font-weight: 800;font-family: "bluevBold";font-size: 30rpx;}
-.user-body .user-level-body .level-top .level-more{color: #666;font-size: 22rpx;}
 
-.user-header{position: relative;background: linear-gradient(180deg, #87e0ff 10%, #CFEEF858 55%, #f8f8f8 100%);}
-.user-header .header-bg{position: absolute;top: 0;left: 0;right: 0;z-index: 9998;}
+.user-header{position: relative;background: linear-gradient(180deg, #87e0ff 10%, rgba(207, 238, 248, 0.35) 69.55%, rgba(245, 245, 245, 0) 100%);overflow: hidden;}
+.user-header .header-bg{
+	position: absolute;
+	left: -304rpx;
+	top: -278rpx;
+	width: 1266rpx;
+	height: 608rpx;
+	opacity: 0.4;
+	mix-blend-mode: multiply;
+	pointer-events: none;
+}
 .user-header .header-bg image{width: 100%;}
+
 .user-detail-body{margin: 20rpx;display: flex;align-items: center;position: relative;z-index: 9999;}
 .user-detail-body .avatar image{width: 100rpx;height: 100rpx;border-radius: 100%;}
 .user-detail-body .detail-info{margin-left: 20rpx;}
@@ -108,11 +163,36 @@ page{background-color: #f8f8f8;}
 
 .user-body{margin: 20rpx;}
 .user-body .user-total{display: flex;align-items: flex-start;justify-content: space-between;width: 100%;flex-direction: row;}
-.user-body .user-total .total-item{min-width: 0%;display: flex;flex-direction: column;align-items: center;justify-content: center;}
+.user-body .user-total .total-item{min-width: 0%;display: flex;flex-direction: column;align-items: center;justify-content: center;flex: 1;}
 .user-body .user-total .total-item .num{color: #212226;font-size: 36rpx;font-weight: 800;line-height: 1.1;text-align: center;}
 .user-body .user-total .total-item .name{color: rgba(21, 21, 21, 0.45);font-size: 22rpx;line-height: 1.2;text-align: center;margin-top: 10rpx;}
 
 .user-body .user-level{background: linear-gradient(0deg, #f0fbff 0%, #b0e9ff 100%);padding: 2rpx;box-sizing: border-box;border-radius: 24rpx;margin: 20rpx 0;}
 .user-body .user-level-body{padding: 28rpx 28rpx 32rpx;border-radius: 22rpx;background: linear-gradient(180deg, #def6ff 0%, #eefaff 52%, #ffffff 100%);box-sizing: border-box;}
-
+
+.user-body .user-menu-normal{background-color: #fff;border-radius: 20rpx;padding: 28rpx;margin-bottom: 20rpx;}
+.user-body .user-menu-normal .title{font-size: 32rpx;color: #000;font-weight: 800;line-height: 2;}
+.user-body .normal-body{}
+.user-body .normal-body .normal-item{display: flex;align-items: center;gap: 20rpx;height: 80rpx;line-height: 80rpx;}
+.user-body .normal-body .normal-item:last-child{border-bottom: 0;}
+.user-body .normal-body .normal-item .name{font-size: 28rpx;color: #000;}
+.user-body .normal-body .normal-item .icon {display: flex;align-items: center;justify-content: center;}
+.user-body .normal-body .normal-item .icon image{width: 48rpx;height: 48rpx;}
+.user-body .normal-body .normal-item .more{margin-left: auto;margin-right: 0;color: rgba(0, 0,0 ,.2);}
+
+.user-body .user-menu-service{background-color: #fff;border-radius: 20rpx;padding: 28rpx;margin-bottom: 20rpx;}
+.user-body .user-menu-service .title{font-size: 32rpx;color: #000;font-weight: 800;line-height: 2;}
+.user-body .user-menu-service .service-body{display: flex;align-items: flex-start;justify-content: space-between;margin-top: 20rpx;}
+.user-body .user-menu-service .service-body .icon image{width: 72rpx;height: 72rpx;}
+.user-body .user-menu-service .service-body .name{color: #212226;font-size: 28rpx;margin-top: 10rpx;}
+.user-body .user-menu-service .service-body .service-item{display: flex;align-items: center;flex-direction: column;}
+.user-body .user-level-body .level-foot{display: flex;align-items: center;justify-content: space-between;gap: 20rpx;}
+.user-body .user-level-body .level-foot .level-step{background-color: #E4E4E4;height: 10rpx;flex: 1;border-radius: 10rpx;}
+.user-body .user-level-body .level-foot .level-step .success{background-color: #87E0FF;height: 10rpx;border-radius: 10rpx;}
+.user-body .user-level-body .level-foot .level-num{color: #999;font-size: 22rpx;}
+.user-body .user-level-body .level-foot .level-num text{color: #666;}
+.user-body .user-level-body .level-mid{margin: 10rpx 0;font-size: 22rpx;color: #8C8C8C;}
+.user-body .user-level-body .level-top{display: flex;align-items: center;justify-content: space-between;}
+.user-body .user-level-body .level-top .level-name{color: #000;font-weight: 800;font-family: "bluevBold";font-size: 30rpx;}
+.user-body .user-level-body .level-top .level-more{color: #666;font-size: 22rpx;}
 </style>

BIN
static/mine/favorite.png


BIN
static/mine/history.png


BIN
static/mine/service.png


BIN
static/mine/setting.png


BIN
static/mine/signed-icon.png


+ 104 - 0
uni_modules/uni-popup/changelog.md

@@ -0,0 +1,104 @@
+## 1.9.12(2026-03-26)
+- 修复 uni-app x 下类型错误导致的编译问题
+## 1.9.11(2025-08-20)
+- 修复 uni-popup-dialog组件设置 borderRadius 不生效的 Bug
+## 1.9.10(2025-07-18)
+- 修复 nvue 下弹窗样式错乱的问题 ,更新依赖 uni-transition 组件
+- 更新 示例取消 borderRadius 属性 ,如需内容圆角,用户应该直接在内容插槽中实现
+## 1.9.9(2025-06-11)
+- 修复 uni-popup-dialog 中 setVal 方法报错的问题
+- 修复 uni-popup-dialog 数据双向绑定问题。
+## 1.9.8(2025-04-16)
+- 修复 更新组件示例 ,解决更新数据或保存项目导致弹窗消失的问题
+## 1.9.7(2025-04-14)
+- 修复 uni-popup-dialog 弹出框在vue3中双向绑定问题
+## 1.9.6(2025-01-08)
+- 修复 示例中过期图片地址
+## 1.9.5(2024-10-15)
+- 修复 微信小程序中的getSystemInfo警告
+## 1.9.2(2024-09-21)
+- 修复 uni-popup在android上的重复点击弹出位置不正确的bug
+## 1.9.1(2024-04-02)
+- 修复 uni-popup-dialog vue3下使用value无法进行绑定的bug(双向绑定兼容旧写法)
+## 1.9.0(2024-03-28)
+- 修复 uni-popup-dialog 双向绑定时初始化逻辑修正
+## 1.8.9(2024-03-20)
+- 修复 uni-popup-dialog 数据输入时修正为双向绑定
+## 1.8.8(2024-02-20)
+- 修复 uni-popup 在微信小程序下出现文字向上闪动的bug
+## 1.8.7(2024-02-02)
+- 新增 uni-popup-dialog 新增属性focus:input模式下,是否自动自动聚焦
+## 1.8.6(2024-01-30)
+- 新增 uni-popup-dialog 新增属性maxLength:限制输入框字数
+## 1.8.5(2024-01-26)
+- 新增 uni-popup-dialog 新增属性showClose:控制关闭按钮的显示
+## 1.8.4(2023-11-15)
+- 新增 uni-popup 支持uni-app-x 注意暂时仅支持 `maskClick` `@open` `@close`
+## 1.8.3(2023-04-17)
+- 修复 uni-popup 重复打开时的 bug
+## 1.8.2(2023-02-02)
+- uni-popup-dialog 组件新增 inputType 属性
+## 1.8.1(2022-12-01)
+- 修复 nvue 下 v-show 报错
+## 1.8.0(2022-11-29)
+- 优化 主题样式
+## 1.7.9(2022-04-02)
+- 修复 弹出层内部无法滚动的bug
+## 1.7.8(2022-03-28)
+- 修复 小程序中高度错误的bug
+## 1.7.7(2022-03-17)
+- 修复 快速调用open出现问题的Bug
+## 1.7.6(2022-02-14)
+- 修复 safeArea 属性不能设置为false的bug
+## 1.7.5(2022-01-19)
+- 修复 isMaskClick 失效的bug
+## 1.7.4(2022-01-19)
+- 新增 cancelText \ confirmText 属性 ,可自定义文本
+- 新增 maskBackgroundColor 属性 ,可以修改蒙版颜色
+- 优化 maskClick属性 更新为 isMaskClick ,解决微信小程序警告的问题
+## 1.7.3(2022-01-13)
+- 修复 设置 safeArea 属性不生效的bug
+## 1.7.2(2021-11-26)
+- 优化 组件示例
+## 1.7.1(2021-11-26)
+- 修复 vuedoc 文字错误
+## 1.7.0(2021-11-19)
+- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
+- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-popup](https://uniapp.dcloud.io/component/uniui/uni-popup)
+## 1.6.2(2021-08-24)
+- 新增 支持国际化
+## 1.6.1(2021-07-30)
+- 优化 vue3下事件警告的问题
+## 1.6.0(2021-07-13)
+- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
+## 1.5.0(2021-06-23)
+- 新增 mask-click 遮罩层点击事件
+## 1.4.5(2021-06-22)
+- 修复 nvue 平台中间弹出后,点击内容,再点击遮罩无法关闭的Bug
+## 1.4.4(2021-06-18)
+- 修复 H5平台中间弹出后,点击内容,再点击遮罩无法关闭的Bug
+## 1.4.3(2021-06-08)
+- 修复 错误的 watch 字段
+- 修复 safeArea 属性不生效的问题
+- 修复 点击内容,再点击遮罩无法关闭的Bug
+## 1.4.2(2021-05-12)
+- 新增 组件示例地址
+## 1.4.1(2021-04-29)
+- 修复 组件内放置 input 、textarea 组件,无法聚焦的问题
+## 1.4.0 (2021-04-29)
+- 新增 type 属性的 left\right 值,支持左右弹出
+- 新增 open(String:type) 方法参数 ,可以省略 type 属性 ,直接传入类型打开指定弹窗
+- 新增 backgroundColor 属性,可定义主窗口背景色,默认不显示背景色
+- 新增 safeArea 属性,是否适配底部安全区
+- 修复 App\h5\微信小程序底部安全区占位不对的Bug
+- 修复 App 端弹出等待的Bug
+- 优化 提升低配设备性能,优化动画卡顿问题
+- 优化 更简单的组件自定义方式
+## 1.2.9(2021-02-05)
+- 优化 组件引用关系,通过uni_modules引用组件
+## 1.2.8(2021-02-05)
+- 调整为uni_modules目录规范
+## 1.2.7(2021-02-05)
+- 调整为uni_modules目录规范
+- 新增 支持 PC 端
+- 新增 uni-popup-message 、uni-popup-dialog扩展组件支持 PC 端

+ 45 - 0
uni_modules/uni-popup/components/uni-popup-dialog/keypress.js

@@ -0,0 +1,45 @@
+// #ifdef H5
+export default {
+  name: 'Keypress',
+  props: {
+    disable: {
+      type: Boolean,
+      default: false
+    }
+  },
+  mounted () {
+    const keyNames = {
+      esc: ['Esc', 'Escape'],
+      tab: 'Tab',
+      enter: 'Enter',
+      space: [' ', 'Spacebar'],
+      up: ['Up', 'ArrowUp'],
+      left: ['Left', 'ArrowLeft'],
+      right: ['Right', 'ArrowRight'],
+      down: ['Down', 'ArrowDown'],
+      delete: ['Backspace', 'Delete', 'Del']
+    }
+    const listener = ($event) => {
+      if (this.disable) {
+        return
+      }
+      const keyName = Object.keys(keyNames).find(key => {
+        const keyName = $event.key
+        const value = keyNames[key]
+        return value === keyName || (Array.isArray(value) && value.includes(keyName))
+      })
+      if (keyName) {
+        // 避免和其他按键事件冲突
+        setTimeout(() => {
+          this.$emit(keyName, {})
+        }, 0)
+      }
+    }
+    document.addEventListener('keyup', listener)
+    this.$once('hook:beforeDestroy', () => {
+      document.removeEventListener('keyup', listener)
+    })
+  },
+	render: () => {}
+}
+// #endif

+ 330 - 0
uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue

@@ -0,0 +1,330 @@
+<template>
+	<view class="uni-popup-dialog" :style="{ borderRadius }">
+		<view class="uni-dialog-title">
+			<text class="uni-dialog-title-text" :class="['uni-popup__'+dialogType]">{{titleText}}</text>
+		</view>
+		<view v-if="mode === 'base'" class="uni-dialog-content">
+			<slot>
+				<text class="uni-dialog-content-text">{{content}}</text>
+			</slot>
+		</view>
+		<view v-else class="uni-dialog-content">
+			<slot>
+				<input class="uni-dialog-input" :maxlength="maxlength" v-model="val" :type="inputType"
+					:placeholder="placeholderText" :focus="focus">
+			</slot>
+		</view>
+		<view class="uni-dialog-button-group">
+			<view class="uni-dialog-button" v-if="showClose" @click="closeDialog">
+				<text class="uni-dialog-button-text">{{closeText}}</text>
+			</view>
+			<view class="uni-dialog-button" :class="showClose?'uni-border-left':''" @click="onOk">
+				<text class="uni-dialog-button-text uni-button-color">{{okText}}</text>
+			</view>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	import popup from '../uni-popup/popup.js'
+	import {
+		initVueI18n
+	} from '@dcloudio/uni-i18n'
+	import messages from '../uni-popup/i18n/index.js'
+	const {
+		t
+	} = initVueI18n(messages)
+	/**
+	 * PopUp 弹出层-对话框样式
+	 * @description 弹出层-对话框样式
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} value input 模式下的默认值
+	 * @property {String} placeholder input 模式下输入提示
+	 * @property {Boolean} focus input模式下是否自动聚焦,默认为true
+	 * @property {String} type = [success|warning|info|error] 主题样式
+	 *  @value success 成功
+	 * 	@value warning 提示
+	 * 	@value info 消息
+	 * 	@value error 错误
+	 * @property {String} mode = [base|input] 模式、
+	 * 	@value base 基础对话框
+	 * 	@value input 可输入对话框
+	 * @showClose {Boolean} 是否显示关闭按钮
+	 * @property {String} content 对话框内容
+	 * @property {Boolean} beforeClose 是否拦截取消事件
+	 * @property {Number} maxlength 输入
+	 * @event {Function} confirm 点击确认按钮触发
+	 * @event {Function} close 点击取消按钮触发
+	 */
+
+	export default {
+		name: "uniPopupDialog",
+		mixins: [popup],
+		emits: ['confirm', 'close', 'update:modelValue', 'input'],
+		props: {
+			inputType: {
+				type: String,
+				default: 'text'
+			},
+			showClose: {
+				type: Boolean,
+				default: true
+			},
+			// #ifdef VUE2
+			value: {
+				type: [String, Number],
+				default: ''
+			},
+			// #endif
+			// #ifdef VUE3
+			modelValue: {
+				type: [Number, String],
+				default: ''
+			},
+			// #endif
+
+
+			placeholder: {
+				type: [String, Number],
+				default: ''
+			},
+			type: {
+				type: String,
+				default: 'error'
+			},
+			mode: {
+				type: String,
+				default: 'base'
+			},
+			title: {
+				type: String,
+				default: ''
+			},
+			content: {
+				type: String,
+				default: ''
+			},
+			beforeClose: {
+				type: Boolean,
+				default: false
+			},
+			cancelText: {
+				type: String,
+				default: ''
+			},
+			confirmText: {
+				type: String,
+				default: ''
+			},
+			maxlength: {
+				type: Number,
+				default: -1,
+			},
+			focus: {
+				type: Boolean,
+				default: true,
+			},
+		    borderRadius: {
+				type: String,
+				default: '11px',
+			}
+		},
+		data() {
+			return {
+				dialogType: 'error',
+				val: ""
+			}
+		},
+		computed: {
+			okText() {
+				return this.confirmText || t("uni-popup.ok")
+			},
+			closeText() {
+				return this.cancelText || t("uni-popup.cancel")
+			},
+			placeholderText() {
+				return this.placeholder || t("uni-popup.placeholder")
+			},
+			titleText() {
+				return this.title || t("uni-popup.title")
+			}
+		},
+		watch: {
+			type(val) {
+				this.dialogType = val
+			},
+			mode(val) {
+				if (val === 'input') {
+					this.dialogType = 'info'
+				}
+			},
+			value(val) {
+				this.setVal(val)
+			},
+			// #ifdef VUE3
+			modelValue(val) {
+				this.setVal(val)
+			},
+			// #endif
+			val(val) {
+				// #ifdef VUE2
+				// TODO 兼容 vue2
+				this.$emit('input', val);
+				// #endif
+				// #ifdef VUE3
+				// TODO 兼容 vue3
+				this.$emit('update:modelValue', val);
+				// #endif
+			}
+		},
+		created() {
+			// 对话框遮罩不可点击
+			this.popup.disableMask()
+			// this.popup.closeMask()
+			if (this.mode === 'input') {
+				this.dialogType = 'info'
+				this.val = this.value;
+				// #ifdef VUE3
+				this.val = this.modelValue;
+				// #endif
+			} else {
+				this.dialogType = this.type
+			}
+		},
+		methods: {
+			/**
+			 * 给val属性赋值
+			 */
+			setVal(val) {
+				if (this.maxlength != -1 && this.mode === 'input') {
+					this.val = val.slice(0, this.maxlength);
+				} else {
+					this.val = val
+				}
+			},
+			/**
+			 * 点击确认按钮
+			 */
+			onOk() {
+				if (this.mode === 'input') {
+					this.$emit('confirm', this.val)
+				} else {
+					this.$emit('confirm')
+				}
+				if (this.beforeClose) return
+				this.popup.close()
+			},
+			/**
+			 * 点击取消按钮
+			 */
+			closeDialog() {
+				this.$emit('close')
+				if (this.beforeClose) return
+				this.popup.close()
+			},
+			close() {
+				this.popup.close()
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.uni-popup-dialog {
+		width: 300px;
+		background-color: #fff;
+	}
+
+	.uni-dialog-title {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		justify-content: center;
+		padding-top: 25px;
+	}
+
+	.uni-dialog-title-text {
+		font-size: 16px;
+		font-weight: 500;
+	}
+
+	.uni-dialog-content {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		padding: 20px;
+	}
+
+	.uni-dialog-content-text {
+		font-size: 14px;
+		color: #6C6C6C;
+	}
+
+	.uni-dialog-button-group {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		border-top-color: #f5f5f5;
+		border-top-style: solid;
+		border-top-width: 1px;
+	}
+
+	.uni-dialog-button {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 45px;
+	}
+
+	.uni-border-left {
+		border-left-color: #f0f0f0;
+		border-left-style: solid;
+		border-left-width: 1px;
+	}
+
+	.uni-dialog-button-text {
+		font-size: 16px;
+		color: #333;
+	}
+
+	.uni-button-color {
+		color: #007aff;
+	}
+
+	.uni-dialog-input {
+		flex: 1;
+		font-size: 14px;
+		border: 1px #eee solid;
+		height: 40px;
+		padding: 0 10px;
+		border-radius: 5px;
+		color: #555;
+	}
+
+	.uni-popup__success {
+		color: #4cd964;
+	}
+
+	.uni-popup__warn {
+		color: #f0ad4e;
+	}
+
+	.uni-popup__error {
+		color: #dd524d;
+	}
+
+	.uni-popup__info {
+		color: #909399;
+	}
+</style>

+ 143 - 0
uni_modules/uni-popup/components/uni-popup-message/uni-popup-message.vue

@@ -0,0 +1,143 @@
+<template>
+	<view class="uni-popup-message">
+		<view class="uni-popup-message__box fixforpc-width" :class="'uni-popup__'+type">
+			<slot>
+				<text class="uni-popup-message-text" :class="'uni-popup__'+type+'-text'">{{message}}</text>
+			</slot>
+		</view>
+	</view>
+</template>
+
+<script>
+	import popup from '../uni-popup/popup.js'
+	/**
+	 * PopUp 弹出层-消息提示
+	 * @description 弹出层-消息提示
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [success|warning|info|error] 主题样式
+	 *  @value success 成功
+	 * 	@value warning 提示
+	 * 	@value info 消息
+	 * 	@value error 错误
+	 * @property {String} message 消息提示文字
+	 * @property {String} duration 显示时间,设置为 0 则不会自动关闭
+	 */
+
+	export default {
+		name: 'uniPopupMessage',
+		mixins:[popup],
+		props: {
+			/**
+			 * 主题 success/warning/info/error	  默认 success
+			 */
+			type: {
+				type: String,
+				default: 'success'
+			},
+			/**
+			 * 消息文字
+			 */
+			message: {
+				type: String,
+				default: ''
+			},
+			/**
+			 * 显示时间,设置为 0 则不会自动关闭
+			 */
+			duration: {
+				type: Number,
+				default: 3000
+			},
+			maskShow:{
+				type:Boolean,
+				default:false
+			}
+		},
+		data() {
+			return {}
+		},
+		created() {
+			this.popup.maskShow = this.maskShow
+			this.popup.messageChild = this
+		},
+		methods: {
+			timerClose(){
+				if(this.duration === 0) return
+				clearTimeout(this.timer) 
+				this.timer = setTimeout(()=>{
+					this.popup.close()
+				},this.duration)
+			}
+		}
+	}
+</script>
+<style lang="scss" >
+	.uni-popup-message {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		justify-content: center;
+	}
+
+	.uni-popup-message__box {
+		background-color: #e1f3d8;
+		padding: 10px 15px;
+		border-color: #eee;
+		border-style: solid;
+		border-width: 1px;
+		flex: 1;
+	}
+
+	@media screen and (min-width: 500px) {
+		.fixforpc-width {
+			margin-top: 20px;
+			border-radius: 4px;
+			flex: none;
+			min-width: 380px;
+			/* #ifndef APP-NVUE */
+			max-width: 50%;
+			/* #endif */
+			/* #ifdef APP-NVUE */
+			max-width: 500px;
+			/* #endif */
+		}
+	}
+
+	.uni-popup-message-text {
+		font-size: 14px;
+		padding: 0;
+	}
+
+	.uni-popup__success {
+		background-color: #e1f3d8;
+	}
+
+	.uni-popup__success-text {
+		color: #67C23A;
+	}
+
+	.uni-popup__warn {
+		background-color: #faecd8;
+	}
+
+	.uni-popup__warn-text {
+		color: #E6A23C;
+	}
+
+	.uni-popup__error {
+		background-color: #fde2e2;
+	}
+
+	.uni-popup__error-text {
+		color: #F56C6C;
+	}
+
+	.uni-popup__info {
+		background-color: #F2F6FC;
+	}
+
+	.uni-popup__info-text {
+		color: #909399;
+	}
+</style>

+ 188 - 0
uni_modules/uni-popup/components/uni-popup-share/uni-popup-share.vue

@@ -0,0 +1,188 @@
+<template>
+	<view class="uni-popup-share">
+		<view class="uni-share-title"><text class="uni-share-title-text">{{shareTitleText}}</text></view>
+		<view class="uni-share-content">
+			<view class="uni-share-content-box">
+				<view class="uni-share-content-item" v-for="(item,index) in bottomData" :key="index" @click.stop="select(item,index)">
+					<image class="uni-share-image" :src="item.icon" mode="aspectFill"></image>
+					<text class="uni-share-text">{{item.text}}</text>
+				</view>
+
+			</view>
+		</view>
+		<view class="uni-share-button-box">
+			<button class="uni-share-button" @click="close">{{cancelText}}</button>
+		</view>
+	</view>
+</template>
+
+<script>
+	import popup from '../uni-popup/popup.js'
+	import {
+	initVueI18n
+	} from '@dcloudio/uni-i18n'
+	import messages from '../uni-popup/i18n/index.js'
+	const {	t	} = initVueI18n(messages)
+	export default {
+		name: 'UniPopupShare',
+		mixins:[popup],
+		emits:['select'],
+		props: {
+			title: {
+				type: String,
+				default: ''
+			},
+			beforeClose: {
+				type: Boolean,
+				default: false
+			}
+		},
+		data() {
+			return {
+				// TODO 替换为自己的图标
+				bottomData: [{
+						text: '微信',
+						icon: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
+						name: 'wx'
+					},
+					{
+						text: '支付宝',
+						icon: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
+						name: 'ali'
+					},
+					{
+						text: 'QQ',
+						icon: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
+						name: 'qq'
+					},
+					{
+						text: '新浪',
+						icon: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png',
+						name: 'sina'
+					},
+					// {
+					// 	text: '百度',
+					// 	icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/1ec6e920-50bf-11eb-8a36-ebb87efcf8c0.png',
+					// 	name: 'copy'
+					// },
+					// {
+					// 	text: '其他',
+					// 	icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/2e0fdfe0-50bf-11eb-b997-9918a5dda011.png',
+					// 	name: 'more'
+					// }
+				]
+			}
+		},
+		created() {},
+		computed: {
+			cancelText() {
+				return t("uni-popup.cancel")
+			},
+		shareTitleText() {
+				return this.title || t("uni-popup.shareTitle")
+			}
+		},
+		methods: {
+			/**
+			 * 选择内容
+			 */
+			select(item, index) {
+				this.$emit('select', {
+					item,
+					index
+				})
+				this.close()
+
+			},
+			/**
+			 * 关闭窗口
+			 */
+			close() {
+				if(this.beforeClose) return
+				this.popup.close()
+			}
+		}
+	}
+</script>
+<style lang="scss" >
+	.uni-popup-share {
+		background-color: #fff;
+		border-top-left-radius: 11px;
+		border-top-right-radius: 11px;
+	}
+	.uni-share-title {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		align-items: center;
+		justify-content: center;
+		height: 40px;
+	}
+	.uni-share-title-text {
+		font-size: 14px;
+		color: #666;
+	}
+	.uni-share-content {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		justify-content: center;
+		padding-top: 10px;
+	}
+
+	.uni-share-content-box {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		flex-wrap: wrap;
+		width: 360px;
+	}
+
+	.uni-share-content-item {
+		width: 90px;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+		justify-content: center;
+		padding: 10px 0;
+		align-items: center;
+	}
+
+	.uni-share-content-item:active {
+		background-color: #f5f5f5;
+	}
+
+	.uni-share-image {
+		width: 30px;
+		height: 30px;
+	}
+
+	.uni-share-text {
+		margin-top: 10px;
+		font-size: 14px;
+		color: #3B4144;
+	}
+
+	.uni-share-button-box {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		padding: 10px 15px;
+	}
+
+	.uni-share-button {
+		flex: 1;
+		border-radius: 50px;
+		color: #666;
+		font-size: 16px;
+	}
+
+	.uni-share-button::after {
+		border-radius: 50px;
+	}
+</style>

+ 7 - 0
uni_modules/uni-popup/components/uni-popup/i18n/en.json

@@ -0,0 +1,7 @@
+{
+	"uni-popup.cancel": "cancel",
+	"uni-popup.ok": "ok",
+	"uni-popup.placeholder": "pleace enter",
+	"uni-popup.title": "Hint",
+	"uni-popup.shareTitle": "Share to"
+}

+ 8 - 0
uni_modules/uni-popup/components/uni-popup/i18n/index.js

@@ -0,0 +1,8 @@
+import en from './en.json'
+import zhHans from './zh-Hans.json'
+import zhHant from './zh-Hant.json'
+export default {
+	en,
+	'zh-Hans': zhHans,
+	'zh-Hant': zhHant
+}

+ 7 - 0
uni_modules/uni-popup/components/uni-popup/i18n/zh-Hans.json

@@ -0,0 +1,7 @@
+{
+	"uni-popup.cancel": "取消",
+	"uni-popup.ok": "确定",
+	"uni-popup.placeholder": "请输入",
+		"uni-popup.title": "提示",
+		"uni-popup.shareTitle": "分享到"
+}

+ 7 - 0
uni_modules/uni-popup/components/uni-popup/i18n/zh-Hant.json

@@ -0,0 +1,7 @@
+{
+	"uni-popup.cancel": "取消",
+	"uni-popup.ok": "確定",
+	"uni-popup.placeholder": "請輸入",
+	"uni-popup.title": "提示",
+	"uni-popup.shareTitle": "分享到"
+}

+ 45 - 0
uni_modules/uni-popup/components/uni-popup/keypress.js

@@ -0,0 +1,45 @@
+// #ifdef H5
+export default {
+  name: 'Keypress',
+  props: {
+    disable: {
+      type: Boolean,
+      default: false
+    }
+  },
+  mounted () {
+    const keyNames = {
+      esc: ['Esc', 'Escape'],
+      tab: 'Tab',
+      enter: 'Enter',
+      space: [' ', 'Spacebar'],
+      up: ['Up', 'ArrowUp'],
+      left: ['Left', 'ArrowLeft'],
+      right: ['Right', 'ArrowRight'],
+      down: ['Down', 'ArrowDown'],
+      delete: ['Backspace', 'Delete', 'Del']
+    }
+    const listener = ($event) => {
+      if (this.disable) {
+        return
+      }
+      const keyName = Object.keys(keyNames).find(key => {
+        const keyName = $event.key
+        const value = keyNames[key]
+        return value === keyName || (Array.isArray(value) && value.includes(keyName))
+      })
+      if (keyName) {
+        // 避免和其他按键事件冲突
+        setTimeout(() => {
+          this.$emit(keyName, {})
+        }, 0)
+      }
+    }
+    document.addEventListener('keyup', listener)
+    // this.$once('hook:beforeDestroy', () => {
+    //   document.removeEventListener('keyup', listener)
+    // })
+  },
+	render: () => {}
+}
+// #endif

+ 26 - 0
uni_modules/uni-popup/components/uni-popup/popup.js

@@ -0,0 +1,26 @@
+
+export default {
+	data() {
+		return {
+			
+		}
+	},
+	created(){
+		this.popup = this.getParent()
+	},
+	methods:{
+		/**
+		 * 获取父元素实例
+		 */
+		getParent(name = 'uniPopup') {
+			let parent = this.$parent;
+			let parentName = parent.$options.name;
+			while (parentName !== name) {
+				parent = parent.$parent;
+				if (!parent) return false
+				parentName = parent.$options.name;
+			}
+			return parent;
+		},
+	}
+}

+ 90 - 0
uni_modules/uni-popup/components/uni-popup/uni-popup.uvue

@@ -0,0 +1,90 @@
+<template>
+  <view class="popup-root" v-if="isOpen" v-show="isShow" @click="clickMask">
+    <view @click.stop>
+      <slot></slot>
+    </view>
+  </view>
+</template>
+
+<script>
+  type CloseCallBack = ()=> void;
+  let closeCallBack:CloseCallBack = () :void => {};
+  export default {
+    emits:["close","clickMask"],
+    data() {
+      return {
+        isShow:false,
+        isOpen:false
+      }
+    },
+    props: {
+      maskClick: {
+        type: Boolean,
+        default: true
+      },
+    },
+    watch: {
+      // 设置show = true 时,如果没有 open 需要设置为 open
+      isShow:{
+        handler(isShow: boolean) {
+          // console.log("isShow",isShow)
+          if(isShow && this.isOpen == false){
+            this.isOpen = true
+          }
+        },
+        immediate:true
+      },
+      // 设置isOpen = true 时,如果没有 isShow 需要设置为 isShow
+      isOpen:{
+        handler(isOpen: boolean) {
+          // console.log("isOpen",isOpen)
+          if(isOpen && this.isShow == false){
+            this.isShow = true
+          }
+        },
+        immediate:true
+      }
+    },
+    methods:{
+      open(){
+        // ...funs : CloseCallBack[]
+        // if(funs.length > 0){
+        //   closeCallBack = funs[0]
+        // }
+        this.isOpen = true;
+      },
+      clickMask(){
+        if(this.maskClick == true){
+          this.$emit('clickMask')
+          this.close()
+        }
+      },
+      close(): void{
+        this.isOpen = false;
+        this.$emit('close')
+        closeCallBack()
+      },
+      hiden(){
+        this.isShow = false
+      },
+      show(){
+        this.isShow = true
+      }
+    }
+  }
+</script>
+
+<style>
+.popup-root {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 750rpx;
+  height: 100%;
+  flex: 1;
+  background-color: rgba(0, 0, 0, 0.3);
+  justify-content: center;
+  align-items: center;
+  z-index: 99;
+}
+</style>

+ 518 - 0
uni_modules/uni-popup/components/uni-popup/uni-popup.vue

@@ -0,0 +1,518 @@
+<template>
+	<view v-if="showPopup" class="uni-popup" :class="[popupstyle, isDesktop ? 'fixforpc-z-index' : '']">
+		<view @touchstart="touchstart">
+			<uni-transition key="1" v-if="maskShow" name="mask" mode-class="fade" :styles="maskClass"
+				:duration="duration" :show="showTrans" @click="onTap" />
+			<uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration"
+				:show="showTrans" @click="onTap">
+				<view class="uni-popup__wrapper" :style="getStyles" :class="[popupstyle]" @click="clear">
+					<slot />
+				</view>
+			</uni-transition>
+		</view>
+		<!-- #ifdef H5 -->
+		<keypress v-if="maskShow" @esc="onTap" />
+		<!-- #endif -->
+	</view>
+</template>
+
+<script>
+	// #ifdef H5
+	import keypress from './keypress.js'
+	// #endif
+
+	/**
+	 * PopUp 弹出层
+	 * @description 弹出层组件,为了解决遮罩弹层的问题
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [top|center|bottom|left|right|message|dialog|share] 弹出方式
+	 * 	@value top 顶部弹出
+	 * 	@value center 中间弹出
+	 * 	@value bottom 底部弹出
+	 * 	@value left		左侧弹出
+	 * 	@value right  右侧弹出
+	 * 	@value message 消息提示
+	 * 	@value dialog 对话框
+	 * 	@value share 底部分享示例
+	 * @property {Boolean} animation = [true|false] 是否开启动画
+	 * @property {Boolean} maskClick = [true|false] 蒙版点击是否关闭弹窗(废弃)
+	 * @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗
+	 * @property {String}  backgroundColor 主窗口背景色
+	 * @property {String}  maskBackgroundColor 蒙版颜色
+	 * @property {String}  borderRadius 设置圆角(左上、右上、右下和左下) 示例:"10px 10px 10px 10px"
+	 * @property {Boolean} safeArea		   是否适配底部安全区
+	 * @event {Function} change 打开关闭弹窗触发,e={show: false}
+	 * @event {Function} maskClick 点击遮罩触发
+	 */
+
+	export default {
+		name: 'uniPopup',
+		components: {
+			// #ifdef H5
+			keypress
+			// #endif
+		},
+		emits: ['change', 'maskClick'],
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型,可选值,top: 顶部弹出层;bottom:底部弹出层;center:全屏弹出层
+			// message: 消息提示 ; dialog : 对话框
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// maskClick
+			isMaskClick: {
+				type: Boolean,
+				default: null
+			},
+			// TODO 2 个版本后废弃属性 ,使用 isMaskClick
+			maskClick: {
+				type: Boolean,
+				default: null
+			},
+			backgroundColor: {
+				type: String,
+				default: 'none'
+			},
+			safeArea: {
+				type: Boolean,
+				default: true
+			},
+			maskBackgroundColor: {
+				type: String,
+				default: 'rgba(0, 0, 0, 0.4)'
+			},
+			borderRadius:{
+				type: String,
+			}
+		},
+
+		watch: {
+			/**
+			 * 监听type类型
+			 */
+			type: {
+				handler: function(type) {
+					if (!this.config[type]) return
+					this[this.config[type]](true)
+				},
+				immediate: true
+			},
+			isDesktop: {
+				handler: function(newVal) {
+					if (!this.config[newVal]) return
+					this[this.config[this.type]](true)
+				},
+				immediate: true
+			},
+			/**
+			 * 监听遮罩是否可点击
+			 * @param {Object} val
+			 */
+			maskClick: {
+				handler: function(val) {
+					this.mkclick = val
+				},
+				immediate: true
+			},
+			isMaskClick: {
+				handler: function(val) {
+					this.mkclick = val
+				},
+				immediate: true
+			},
+			// H5 下禁止底部滚动
+			showPopup(show) {
+				// #ifdef H5
+				// fix by mehaotian 处理 h5 滚动穿透的问题
+				document.getElementsByTagName('body')[0].style.overflow = show ? 'hidden' : 'visible'
+				// #endif
+			}
+		},
+		data() {
+			return {
+				duration: 300,
+				ani: [],
+				showPopup: false,
+				showTrans: false,
+				popupWidth: 0,
+				popupHeight: 0,
+				config: {
+					top: 'top',
+					bottom: 'bottom',
+					center: 'center',
+					left: 'left',
+					right: 'right',
+					message: 'top',
+					dialog: 'center',
+					share: 'bottom'
+				},
+				maskClass: {
+					position: 'fixed',
+					bottom: 0,
+					top: 0,
+					left: 0,
+					right: 0,
+					backgroundColor: 'rgba(0, 0, 0, 0.4)'
+				},
+				transClass: {
+					backgroundColor: 'transparent',
+					borderRadius: this.borderRadius || "0",
+					position: 'fixed',
+					left: 0,
+					right: 0
+				},
+				maskShow: true,
+				mkclick: true,
+				popupstyle: 'top'
+			}
+		},
+		computed: {
+			getStyles() {
+				let res = { backgroundColor: this.bg };
+				if (this.borderRadius || "0") {
+					res = Object.assign(res, { borderRadius: this.borderRadius })
+				}
+				return res;
+			},
+			isDesktop() {
+				return this.popupWidth >= 500 && this.popupHeight >= 500
+			},
+			bg() {
+				if (this.backgroundColor === '' || this.backgroundColor === 'none') {
+					return 'transparent'
+				}
+				return this.backgroundColor
+			}
+		},
+		mounted() {
+			const fixSize = () => {
+				// #ifdef MP-WEIXIN
+				const {
+					windowWidth,
+					windowHeight,
+					windowTop,
+					safeArea,
+					screenHeight,
+					safeAreaInsets
+				} = uni.getWindowInfo()
+				// #endif
+				// #ifndef MP-WEIXIN
+				const {
+					windowWidth,
+					windowHeight,
+					windowTop,
+					safeArea,
+					screenHeight,
+					safeAreaInsets
+				} = uni.getSystemInfoSync()
+				// #endif
+				this.popupWidth = windowWidth
+				this.popupHeight = windowHeight + (windowTop || 0)
+				// TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异,需要框架修复
+				if (safeArea && this.safeArea) {
+					// #ifdef MP-WEIXIN
+					this.safeAreaInsets = screenHeight - safeArea.bottom
+					// #endif
+					// #ifndef MP-WEIXIN
+					this.safeAreaInsets = safeAreaInsets.bottom
+					// #endif
+				} else {
+					this.safeAreaInsets = 0
+				}
+			}
+			fixSize()
+			// #ifdef H5
+			// window.addEventListener('resize', fixSize)
+			// this.$once('hook:beforeDestroy', () => {
+			// 	window.removeEventListener('resize', fixSize)
+			// })
+			// #endif
+		},
+		// #ifndef VUE3
+		// TODO vue2
+		destroyed() {
+			this.setH5Visible()
+		},
+		// #endif
+		// #ifdef VUE3
+		// TODO vue3
+		unmounted() {
+			this.setH5Visible()
+		},
+		// #endif
+		activated() {
+   	  this.setH5Visible(!this.showPopup);
+    },
+    deactivated() {
+      this.setH5Visible(true);
+    },
+		created() {
+			// this.mkclick =  this.isMaskClick || this.maskClick
+			if (this.isMaskClick === null && this.maskClick === null) {
+				this.mkclick = true
+			} else {
+				this.mkclick = this.isMaskClick !== null ? this.isMaskClick : this.maskClick
+			}
+			if (this.animation) {
+				this.duration = 300
+			} else {
+				this.duration = 0
+			}
+			// TODO 处理 message 组件生命周期异常的问题
+			this.messageChild = null
+			// TODO 解决头条冒泡的问题
+			this.clearPropagation = false
+			this.maskClass.backgroundColor = this.maskBackgroundColor
+		},
+		methods: {
+			setH5Visible(visible = true) {
+				// #ifdef H5
+				// fix by mehaotian 处理 h5 滚动穿透的问题
+				document.getElementsByTagName('body')[0].style.overflow =  visible ? "visible" : "hidden";
+				// #endif
+			},
+			/**
+			 * 公用方法,不显示遮罩层
+			 */
+			closeMask() {
+				this.maskShow = false
+			},
+			/**
+			 * 公用方法,遮罩层禁止点击
+			 */
+			disableMask() {
+				this.mkclick = false
+			},
+			// TODO nvue 取消冒泡
+			clear(e) {
+				// #ifndef APP-NVUE
+				e.stopPropagation()
+				// #endif
+				this.clearPropagation = true
+			},
+
+			open(direction) {
+				// fix by mehaotian 处理快速打开关闭的情况
+				if (this.showPopup) {
+					return
+				}
+				let innerType = ['top', 'center', 'bottom', 'left', 'right', 'message', 'dialog', 'share']
+				if (!(direction && innerType.indexOf(direction) !== -1)) {
+					direction = this.type
+				}
+				if (!this.config[direction]) {
+					console.error('缺少类型:', direction)
+					return
+				}
+				this[this.config[direction]]()
+				this.$emit('change', {
+					show: true,
+					type: direction
+				})
+			},
+			close(type) {
+				this.showTrans = false
+				this.$emit('change', {
+					show: false,
+					type: this.type
+				})
+				clearTimeout(this.timer)
+				// // 自定义关闭事件
+				// this.customOpen && this.customClose()
+				this.timer = setTimeout(() => {
+					this.showPopup = false
+				}, 300)
+			},
+			// TODO 处理冒泡事件,头条的冒泡事件有问题 ,先这样兼容
+			touchstart() {
+				this.clearPropagation = false
+			},
+
+			onTap() {
+				if (this.clearPropagation) {
+					// fix by mehaotian 兼容 nvue
+					this.clearPropagation = false
+					return
+				}
+				this.$emit('maskClick')
+				if (!this.mkclick) return
+				this.close()
+			},
+			/**
+			 * 顶部弹出样式处理
+			 */
+			top(type) {
+				this.popupstyle = this.isDesktop ? 'fixforpc-top' : 'top'
+				this.ani = ['slide-top']
+				this.transClass = {
+					position: 'fixed',
+					left: 0,
+					right: 0,
+					backgroundColor: this.bg,
+					borderRadius:this.borderRadius || "0"
+				}
+				// TODO 兼容 type 属性 ,后续会废弃
+				if (type) return
+				this.showPopup = true
+				this.showTrans = true
+				this.$nextTick(() => {
+					this.showPoptrans()
+					if (this.messageChild && this.type === 'message') {
+						this.messageChild.timerClose()
+					}
+				})
+			},
+			/**
+			 * 底部弹出样式处理
+			 */
+			bottom(type) {
+				this.popupstyle = 'bottom'
+				this.ani = ['slide-bottom']
+				this.transClass = {
+					position: 'fixed',
+					left: 0,
+					right: 0,
+					bottom: 0,
+					paddingBottom: this.safeAreaInsets + 'px',
+					backgroundColor: this.bg,
+					borderRadius:this.borderRadius || "0",
+				}
+				// TODO 兼容 type 属性 ,后续会废弃
+				if (type) return
+				this.showPoptrans()
+			},
+			/**
+			 * 中间弹出样式处理
+			 */
+			center(type) {
+				this.popupstyle = 'center'
+				//微信小程序下,组合动画会出现文字向上闪动问题,再此做特殊处理
+				// #ifdef MP-WEIXIN
+					this.ani = ['fade']
+				// #endif
+				// #ifndef MP-WEIXIN
+					this.ani = ['zoom-out', 'fade']
+				// #endif
+				this.transClass = {
+					position: 'fixed',
+					/* #ifndef APP-NVUE */
+					display: 'flex',
+					flexDirection: 'column',
+					/* #endif */
+					bottom: 0,
+					left: 0,
+					right: 0,
+					top: 0,
+					justifyContent: 'center',
+					alignItems: 'center',
+					borderRadius:this.borderRadius || "0"
+				}
+				// TODO 兼容 type 属性 ,后续会废弃
+				if (type) return
+				this.showPoptrans()
+			},
+			left(type) {
+				this.popupstyle = 'left'
+				this.ani = ['slide-left']
+				this.transClass = {
+					position: 'fixed',
+					left: 0,
+					bottom: 0,
+					top: 0,
+					backgroundColor: this.bg,
+					borderRadius:this.borderRadius || "0",
+					/* #ifndef APP-NVUE */
+					display: 'flex',
+					flexDirection: 'column'
+					/* #endif */
+				}
+				// TODO 兼容 type 属性 ,后续会废弃
+				if (type) return
+				this.showPoptrans()
+			},
+			right(type) {
+				this.popupstyle = 'right'
+				this.ani = ['slide-right']
+				this.transClass = {
+					position: 'fixed',
+					bottom: 0,
+					right: 0,
+					top: 0,
+					backgroundColor: this.bg,
+					borderRadius:this.borderRadius || "0",
+					/* #ifndef APP-NVUE */
+					display: 'flex',
+					flexDirection: 'column'
+					/* #endif */
+				}
+				// TODO 兼容 type 属性 ,后续会废弃
+				if (type) return
+				this.showPoptrans()
+			},
+			showPoptrans(){
+				this.$nextTick(()=>{
+					this.showPopup = true
+					this.showTrans = true
+				})
+			}
+		}
+	}
+</script>
+<style lang="scss">
+	.uni-popup {
+		position: fixed;
+		/* #ifndef APP-NVUE */
+		z-index: 99;
+
+		/* #endif */
+		&.top,
+		&.left,
+		&.right {
+			/* #ifdef H5 */
+			top: var(--window-top);
+			/* #endif */
+			/* #ifndef H5 */
+			top: 0;
+			/* #endif */
+		}
+
+		.uni-popup__wrapper {
+			/* #ifndef APP-NVUE */
+			display: block;
+			/* #endif */
+			position: relative;
+
+			/* iphonex 等安全区设置,底部安全区适配 */
+			/* #ifndef APP-NVUE */
+			// padding-bottom: constant(safe-area-inset-bottom);
+			// padding-bottom: env(safe-area-inset-bottom);
+			/* #endif */
+			&.left,
+			&.right {
+				/* #ifdef H5 */
+				padding-top: var(--window-top);
+				/* #endif */
+				/* #ifndef H5 */
+				padding-top: 0;
+				/* #endif */
+				flex: 1;
+			}
+		}
+	}
+
+	.fixforpc-z-index {
+		/* #ifndef APP-NVUE */
+		z-index: 999;
+		/* #endif */
+	}
+
+	.fixforpc-top {
+		top: 0;
+	}
+</style>

+ 108 - 0
uni_modules/uni-popup/package.json

@@ -0,0 +1,108 @@
+{
+  "id": "uni-popup",
+  "displayName": "uni-popup 弹出层",
+  "version": "1.9.12",
+  "description": " Popup 组件,提供常用的弹层",
+  "keywords": [
+    "uni-ui",
+    "弹出层",
+    "弹窗",
+    "popup",
+    "弹框"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": "",
+    "uni-app": "^4.07",
+    "uni-app-x": "^5.0"
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
+    "type": "component-vue",
+    "darkmode": "x",
+    "i18n": "x",
+    "widescreen": "x"
+  },
+  "uni_modules": {
+    "dependencies": [
+      "uni-scss",
+      "uni-transition"
+    ],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "x",
+        "aliyun": "x",
+        "alipay": "x"
+      },
+      "client": {
+        "uni-app": {
+          "vue": {
+            "vue2": "√",
+            "vue3": "√"
+          },
+          "web": {
+            "safari": "√",
+            "chrome": "√"
+          },
+          "app": {
+            "vue": "√",
+            "nvue": "√",
+            "android": "√",
+            "ios": "√",
+            "harmony": "√"
+          },
+          "mp": {
+            "weixin": "√",
+            "alipay": "√",
+            "toutiao": "√",
+            "baidu": "√",
+            "kuaishou": "-",
+            "jd": "-",
+            "harmony": "-",
+            "qq": "√",
+            "lark": "-",
+            "xhs": "-"
+          },
+          "quickapp": {
+            "huawei": "-",
+            "union": "-"
+          }
+        },
+        "uni-app-x": {
+          "web": {
+            "safari": "√",
+            "chrome": "√"
+          },
+          "app": {
+            "android": "√",
+            "ios": "√",
+            "harmony": "√"
+          },
+          "mp": {
+            "weixin": "√"
+          }
+        }
+      }
+    }
+  }
+}

+ 15 - 0
uni_modules/uni-popup/readme.md

@@ -0,0 +1,15 @@
+
+
+## Popup 弹出层
+> **组件名:uni-popup**
+> 代码块: `uPopup`
+> 关联组件:`uni-transition`
+
+
+弹出层组件,在应用中弹出一个消息提示窗口、提示框等
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-popup)
+
+
+
+

+ 8 - 0
uni_modules/uni-scss/changelog.md

@@ -0,0 +1,8 @@
+## 1.0.3(2022-01-21)
+- 优化 组件示例
+## 1.0.2(2021-11-22)
+- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题
+## 1.0.1(2021-11-22)
+- 修复 vue3中scss语法兼容问题
+## 1.0.0(2021-11-18)
+- init

+ 1 - 0
uni_modules/uni-scss/index.scss

@@ -0,0 +1 @@
+@import './styles/index.scss';

+ 82 - 0
uni_modules/uni-scss/package.json

@@ -0,0 +1,82 @@
+{
+  "id": "uni-scss",
+  "displayName": "uni-scss 辅助样式",
+  "version": "1.0.3",
+  "description": "uni-sass是uni-ui提供的一套全局样式 ,通过一些简单的类名和sass变量,实现简单的页面布局操作,比如颜色、边距、圆角等。",
+  "keywords": [
+    "uni-scss",
+    "uni-ui",
+    "辅助样式"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": "^3.1.0"
+  },
+  "dcloudext": {
+    "category": [
+        "JS SDK",
+        "通用 SDK"
+    ],
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
+  },
+  "uni_modules": {
+    "dependencies": [],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "u"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y"
+        },
+        "快应用": {
+          "华为": "n",
+          "联盟": "n"
+        },
+        "Vue": {
+            "vue2": "y",
+            "vue3": "y"
+        }
+      }
+    }
+  }
+}

+ 4 - 0
uni_modules/uni-scss/readme.md

@@ -0,0 +1,4 @@
+`uni-sass` 是 `uni-ui`提供的一套全局样式 ,通过一些简单的类名和`sass`变量,实现简单的页面布局操作,比如颜色、边距、圆角等。
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass)
+#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839 

+ 7 - 0
uni_modules/uni-scss/styles/index.scss

@@ -0,0 +1,7 @@
+@import './setting/_variables.scss';
+@import './setting/_border.scss';
+@import './setting/_color.scss';
+@import './setting/_space.scss';
+@import './setting/_radius.scss';
+@import './setting/_text.scss';
+@import './setting/_styles.scss';

+ 3 - 0
uni_modules/uni-scss/styles/setting/_border.scss

@@ -0,0 +1,3 @@
+.uni-border {
+	border: 1px $uni-border-1 solid;
+}

+ 66 - 0
uni_modules/uni-scss/styles/setting/_color.scss

@@ -0,0 +1,66 @@
+
+// TODO 暂时不需要 class ,需要用户使用变量实现 ,如果使用类名其实并不推荐
+// @mixin get-styles($k,$c) {
+// 	@if $k == size or $k == weight{
+// 		font-#{$k}:#{$c}
+// 	}@else{
+// 		#{$k}:#{$c}
+// 	}
+// }
+$uni-ui-color:(
+	// 主色
+	primary: $uni-primary,
+	primary-disable: $uni-primary-disable,
+	primary-light: $uni-primary-light,
+	// 辅助色
+	success: $uni-success,
+	success-disable: $uni-success-disable,
+	success-light: $uni-success-light,
+	warning: $uni-warning,
+	warning-disable: $uni-warning-disable,
+	warning-light: $uni-warning-light,
+	error: $uni-error,
+	error-disable: $uni-error-disable,
+	error-light: $uni-error-light,
+	info: $uni-info,
+	info-disable: $uni-info-disable,
+	info-light: $uni-info-light,
+	// 中性色
+	main-color: $uni-main-color,
+	base-color: $uni-base-color,
+	secondary-color: $uni-secondary-color,
+	extra-color: $uni-extra-color,
+	// 背景色
+	bg-color: $uni-bg-color,
+	// 边框颜色
+	border-1: $uni-border-1,
+	border-2: $uni-border-2,
+	border-3: $uni-border-3,
+	border-4: $uni-border-4,
+	// 黑色
+	black:$uni-black,
+	// 白色
+	white:$uni-white,
+	// 透明
+	transparent:$uni-transparent
+) !default;
+@each $key, $child in $uni-ui-color {
+	.uni-#{"" + $key} {
+		color: $child;
+	}
+	.uni-#{"" + $key}-bg {
+		background-color: $child;
+	}
+}
+.uni-shadow-sm {
+	box-shadow: $uni-shadow-sm;
+}
+.uni-shadow-base {
+	box-shadow: $uni-shadow-base;
+}
+.uni-shadow-lg {
+	box-shadow: $uni-shadow-lg;
+}
+.uni-mask {
+	background-color:$uni-mask;
+}

+ 55 - 0
uni_modules/uni-scss/styles/setting/_radius.scss

@@ -0,0 +1,55 @@
+@mixin radius($r,$d:null ,$important: false){
+  $radius-value:map-get($uni-radius, $r) if($important, !important, null);
+  // Key exists within the $uni-radius variable
+  @if (map-has-key($uni-radius, $r) and  $d){
+		@if $d == t {
+				border-top-left-radius:$radius-value;
+				border-top-right-radius:$radius-value;
+		}@else if $d == r {
+				border-top-right-radius:$radius-value;
+				border-bottom-right-radius:$radius-value;
+		}@else if $d == b {
+				border-bottom-left-radius:$radius-value;
+				border-bottom-right-radius:$radius-value;
+		}@else if $d == l {
+				border-top-left-radius:$radius-value;
+				border-bottom-left-radius:$radius-value;
+		}@else if $d == tl {
+				border-top-left-radius:$radius-value;
+		}@else if $d == tr {
+				border-top-right-radius:$radius-value;
+		}@else if $d == br {
+				border-bottom-right-radius:$radius-value;
+		}@else if $d == bl {
+				border-bottom-left-radius:$radius-value;
+		}
+  }@else{
+		border-radius:$radius-value;
+  }
+}
+
+@each $key, $child in $uni-radius {
+	@if($key){
+		.uni-radius-#{"" + $key} {
+				@include radius($key)
+		}
+	}@else{
+		.uni-radius {
+				@include radius($key)
+		}
+	}
+}
+
+@each $direction in t, r, b, l,tl, tr, br, bl {
+	@each $key, $child in $uni-radius {
+		@if($key){
+			.uni-radius-#{"" + $direction}-#{"" + $key} {
+				@include radius($key,$direction,false)
+			}
+		}@else{
+			.uni-radius-#{$direction} {
+				@include radius($key,$direction,false)
+			}
+		}
+	}
+}

+ 56 - 0
uni_modules/uni-scss/styles/setting/_space.scss

@@ -0,0 +1,56 @@
+
+@mixin fn($space,$direction,$size,$n) {
+	@if $n {
+		#{$space}-#{$direction}: #{$size*$uni-space-root}px
+	} @else {
+		 #{$space}-#{$direction}: #{-$size*$uni-space-root}px
+	}
+}
+@mixin get-styles($direction,$i,$space,$n){
+	@if $direction == t {
+		@include fn($space, top,$i,$n);
+	} 
+	@if $direction == r {
+		@include fn($space, right,$i,$n);
+	} 
+	@if $direction == b {
+		@include fn($space, bottom,$i,$n);
+	} 
+	@if $direction == l {
+	 @include fn($space, left,$i,$n);
+	} 
+	@if $direction == x {
+		@include fn($space, left,$i,$n);
+		@include fn($space, right,$i,$n);
+	} 
+	@if $direction == y {
+		@include fn($space, top,$i,$n);
+		@include fn($space, bottom,$i,$n);
+	} 
+	@if $direction == a {
+		@if $n {
+			#{$space}:#{$i*$uni-space-root}px;
+		} @else {
+			#{$space}:#{-$i*$uni-space-root}px;
+		}
+	} 
+}
+
+@each $orientation in m,p {
+	$space: margin;
+	@if $orientation == m {
+		$space: margin;
+	} @else {
+		$space: padding;
+	}
+	@for $i from 0 through 16 {
+		@each $direction in t, r, b, l, x, y, a {
+			.uni-#{$orientation}#{$direction}-#{$i} { 
+				@include  get-styles($direction,$i,$space,true);
+			} 
+			.uni-#{$orientation}#{$direction}-n#{$i} { 
+				@include  get-styles($direction,$i,$space,false);
+			}
+		}
+	}
+}

+ 167 - 0
uni_modules/uni-scss/styles/setting/_styles.scss

@@ -0,0 +1,167 @@
+/* #ifndef APP-NVUE */
+
+$-color-white:#fff;
+$-color-black:#000;
+@mixin base-style($color) {
+	color: #fff;
+	background-color: $color;
+	border-color: mix($-color-black, $color, 8%);
+	&:not([hover-class]):active {
+		background: mix($-color-black, $color, 10%);
+		border-color: mix($-color-black, $color, 20%);
+		color: $-color-white;
+		outline: none;
+	}
+}
+@mixin is-color($color) {
+	@include base-style($color);
+	&[loading] {
+		@include base-style($color);
+		&::before {
+			margin-right:5px;
+		}
+	}
+	&[disabled] {
+	  &,
+		&[loading],
+	  &:not([hover-class]):active {
+	    color: $-color-white;
+			border-color: mix(darken($color,10%), $-color-white);
+	    background-color: mix($color, $-color-white);
+	  }
+	}
+
+}
+@mixin base-plain-style($color) {
+	color:$color;
+	background-color: mix($-color-white, $color, 90%);
+	border-color: mix($-color-white, $color, 70%);
+	&:not([hover-class]):active {
+	  background: mix($-color-white, $color, 80%);
+	  color: $color;
+	  outline: none;
+		border-color: mix($-color-white, $color, 50%);
+	}
+}
+@mixin is-plain($color){
+	&[plain] {
+		@include base-plain-style($color);
+		&[loading] {
+			@include base-plain-style($color);
+			&::before {
+				margin-right:5px;
+			}
+		}
+		&[disabled] {
+		  &,
+		  &:active {
+		    color: mix($-color-white, $color, 40%);
+		    background-color: mix($-color-white, $color, 90%);
+				border-color: mix($-color-white, $color, 80%);
+		  }
+		}
+	}
+}
+
+
+.uni-btn {
+	margin: 5px;
+	color: #393939;
+	border:1px solid #ccc;
+	font-size: 16px;
+	font-weight: 200;
+	background-color: #F9F9F9;
+	// TODO 暂时处理边框隐藏一边的问题
+	overflow: visible;
+	&::after{
+		border: none;
+	}
+
+	&:not([type]),&[type=default] {
+		color: #999;
+		&[loading] {
+			background: none;
+			&::before {
+				margin-right:5px;
+			}
+		}
+
+
+
+		&[disabled]{
+			color: mix($-color-white, #999, 60%);
+		  &,
+			&[loading],
+		  &:active {
+				color: mix($-color-white, #999, 60%);
+		    background-color: mix($-color-white,$-color-black , 98%);
+				border-color: mix($-color-white,  #999, 85%);
+		  }
+		}
+
+		&[plain] {
+			color: #999;
+			background: none;
+			border-color: $uni-border-1;
+			&:not([hover-class]):active {
+				background: none;
+			  color: mix($-color-white, $-color-black, 80%);
+				border-color: mix($-color-white, $-color-black, 90%);
+			  outline: none;
+			}
+			&[disabled]{
+			  &,
+				&[loading],
+			  &:active {
+			    background: none;
+					color: mix($-color-white, #999, 60%);
+					border-color: mix($-color-white,  #999, 85%);
+			  }
+			}
+		}
+	}
+
+	&:not([hover-class]):active {
+	  color: mix($-color-white, $-color-black, 50%);
+	}
+
+	&[size=mini] {
+		font-size: 16px;
+		font-weight: 200;
+		border-radius: 8px;
+	}
+
+
+
+	&.uni-btn-small {
+		font-size: 14px;
+	}
+	&.uni-btn-mini {
+		font-size: 12px;
+	}
+
+	&.uni-btn-radius {
+		border-radius: 999px;
+	}
+	&[type=primary] {
+		@include is-color($uni-primary);
+		@include is-plain($uni-primary)
+	}
+	&[type=success] {
+		@include is-color($uni-success);
+		@include is-plain($uni-success)
+	}
+	&[type=error] {
+		@include is-color($uni-error);
+		@include is-plain($uni-error)
+	}
+	&[type=warning] {
+		@include is-color($uni-warning);
+		@include is-plain($uni-warning)
+	}
+	&[type=info] {
+		@include is-color($uni-info);
+		@include is-plain($uni-info)
+	}
+}
+/* #endif */

+ 24 - 0
uni_modules/uni-scss/styles/setting/_text.scss

@@ -0,0 +1,24 @@
+@mixin get-styles($k,$c) {
+	@if $k == size or $k == weight{
+		font-#{$k}:#{$c}
+	}@else{
+		#{$k}:#{$c}
+	}
+}
+
+@each $key, $child in $uni-headings {
+	/* #ifndef APP-NVUE */
+	.uni-#{$key} {
+		@each $k, $c in $child {
+			@include get-styles($k,$c)
+		}
+	}
+	/* #endif */
+	/* #ifdef APP-NVUE */
+	.container .uni-#{$key} {
+		@each $k, $c in $child {
+			@include get-styles($k,$c)
+		}
+	}
+	/* #endif */
+}

+ 146 - 0
uni_modules/uni-scss/styles/setting/_variables.scss

@@ -0,0 +1,146 @@
+// @use "sass:math";
+@import  '../tools/functions.scss';
+// 间距基础倍数
+$uni-space-root: 2 !default;
+// 边框半径默认值
+$uni-radius-root:5px !default;
+$uni-radius: () !default;
+// 边框半径断点
+$uni-radius: map-deep-merge(
+  (
+    0: 0,
+		// TODO 当前版本暂时不支持 sm 属性
+    // 'sm': math.div($uni-radius-root, 2),
+    null: $uni-radius-root,
+    'lg': $uni-radius-root * 2,
+    'xl': $uni-radius-root * 6,
+    'pill': 9999px,
+    'circle': 50%
+  ),
+  $uni-radius
+);
+// 字体家族
+$body-font-family: 'Roboto', sans-serif !default;
+// 文本
+$heading-font-family: $body-font-family !default;
+$uni-headings: () !default;
+$letterSpacing: -0.01562em;
+$uni-headings: map-deep-merge(
+  (
+    'h1': (
+      size: 32px,
+			weight: 300,
+			line-height: 50px,
+			// letter-spacing:-0.01562em
+    ),
+    'h2': (
+      size: 28px,
+      weight: 300,
+      line-height: 40px,
+      // letter-spacing: -0.00833em
+    ),
+    'h3': (
+      size: 24px,
+      weight: 400,
+      line-height: 32px,
+      // letter-spacing: normal
+    ),
+    'h4': (
+      size: 20px,
+      weight: 400,
+      line-height: 30px,
+      // letter-spacing: 0.00735em
+    ),
+    'h5': (
+      size: 16px,
+      weight: 400,
+      line-height: 24px,
+      // letter-spacing: normal
+    ),
+    'h6': (
+      size: 14px,
+      weight: 500,
+      line-height: 18px,
+      // letter-spacing: 0.0125em
+    ),
+    'subtitle': (
+      size: 12px,
+      weight: 400,
+      line-height: 20px,
+      // letter-spacing: 0.00937em
+    ),
+    'body': (
+      font-size: 14px,
+			font-weight: 400,
+			line-height: 22px,
+			// letter-spacing: 0.03125em
+    ),
+    'caption': (
+      'size': 12px,
+      'weight': 400,
+      'line-height': 20px,
+      // 'letter-spacing': 0.03333em,
+      // 'text-transform': false
+    )
+  ),
+  $uni-headings
+);
+
+
+
+// 主色
+$uni-primary: #2979ff !default;
+$uni-primary-disable:lighten($uni-primary,20%) !default;
+$uni-primary-light: lighten($uni-primary,25%) !default;
+
+// 辅助色
+// 除了主色外的场景色,需要在不同的场景中使用(例如危险色表示危险的操作)。
+$uni-success: #18bc37 !default;
+$uni-success-disable:lighten($uni-success,20%) !default;
+$uni-success-light: lighten($uni-success,25%) !default;
+
+$uni-warning: #f3a73f !default;
+$uni-warning-disable:lighten($uni-warning,20%) !default;
+$uni-warning-light: lighten($uni-warning,25%) !default;
+
+$uni-error: #e43d33 !default;
+$uni-error-disable:lighten($uni-error,20%) !default;
+$uni-error-light: lighten($uni-error,25%) !default;
+
+$uni-info: #8f939c !default;
+$uni-info-disable:lighten($uni-info,20%) !default;
+$uni-info-light: lighten($uni-info,25%) !default;
+
+// 中性色
+// 中性色用于文本、背景和边框颜色。通过运用不同的中性色,来表现层次结构。
+$uni-main-color: #3a3a3a !default; 			// 主要文字
+$uni-base-color: #6a6a6a !default;			// 常规文字
+$uni-secondary-color: #909399 !default;	// 次要文字
+$uni-extra-color: #c7c7c7 !default;			// 辅助说明
+
+// 边框颜色
+$uni-border-1: #F0F0F0 !default;
+$uni-border-2: #EDEDED !default;
+$uni-border-3: #DCDCDC !default;
+$uni-border-4: #B9B9B9 !default;
+
+// 常规色
+$uni-black: #000000 !default;
+$uni-white: #ffffff !default;
+$uni-transparent: rgba($color: #000000, $alpha: 0) !default;
+
+// 背景色
+$uni-bg-color: #f7f7f7 !default;
+
+/* 水平间距 */
+$uni-spacing-sm: 8px !default;
+$uni-spacing-base: 15px !default;
+$uni-spacing-lg: 30px !default;
+
+// 阴影
+$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5) !default;
+$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default;
+$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5) !default;
+
+// 蒙版
+$uni-mask: rgba($color: #000000, $alpha: 0.4) !default;

+ 19 - 0
uni_modules/uni-scss/styles/tools/functions.scss

@@ -0,0 +1,19 @@
+// 合并 map
+@function map-deep-merge($parent-map, $child-map){
+	$result: $parent-map;
+	@each $key, $child in $child-map {
+		$parent-has-key: map-has-key($result, $key);
+		$parent-value: map-get($result, $key);
+		$parent-type: type-of($parent-value);
+		$child-type: type-of($child);
+		$parent-is-map: $parent-type == map;
+		$child-is-map: $child-type == map;
+			
+		@if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){
+			$result: map-merge($result, ( $key: $child ));
+		}@else {
+			$result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) ));
+		}
+	}
+	@return $result;
+};

+ 31 - 0
uni_modules/uni-scss/theme.scss

@@ -0,0 +1,31 @@
+// 间距基础倍数
+$uni-space-root: 2;
+// 边框半径默认值
+$uni-radius-root:5px;
+// 主色
+$uni-primary: #2979ff;
+// 辅助色
+$uni-success: #4cd964;
+// 警告色
+$uni-warning: #f0ad4e;
+// 错误色
+$uni-error: #dd524d;
+// 描述色
+$uni-info: #909399;
+// 中性色
+$uni-main-color: #303133;
+$uni-base-color: #606266;
+$uni-secondary-color: #909399;
+$uni-extra-color: #C0C4CC;
+// 背景色
+$uni-bg-color: #f5f5f5;
+// 边框颜色
+$uni-border-1: #DCDFE6;
+$uni-border-2: #E4E7ED;
+$uni-border-3: #EBEEF5;
+$uni-border-4: #F2F6FC;
+
+// 常规色
+$uni-black: #000000;
+$uni-white: #ffffff;
+$uni-transparent: rgba($color: #000000, $alpha: 0);

+ 62 - 0
uni_modules/uni-scss/variables.scss

@@ -0,0 +1,62 @@
+@import './styles/setting/_variables.scss';
+// 间距基础倍数
+$uni-space-root: 2;
+// 边框半径默认值
+$uni-radius-root:5px;
+
+// 主色
+$uni-primary: #2979ff;
+$uni-primary-disable:mix(#fff,$uni-primary,50%);
+$uni-primary-light: mix(#fff,$uni-primary,80%);
+
+// 辅助色
+// 除了主色外的场景色,需要在不同的场景中使用(例如危险色表示危险的操作)。
+$uni-success: #18bc37;
+$uni-success-disable:mix(#fff,$uni-success,50%);
+$uni-success-light: mix(#fff,$uni-success,80%);
+
+$uni-warning: #f3a73f;
+$uni-warning-disable:mix(#fff,$uni-warning,50%);
+$uni-warning-light: mix(#fff,$uni-warning,80%);
+
+$uni-error: #e43d33;
+$uni-error-disable:mix(#fff,$uni-error,50%);
+$uni-error-light: mix(#fff,$uni-error,80%);
+
+$uni-info: #8f939c;
+$uni-info-disable:mix(#fff,$uni-info,50%);
+$uni-info-light: mix(#fff,$uni-info,80%);
+
+// 中性色
+// 中性色用于文本、背景和边框颜色。通过运用不同的中性色,来表现层次结构。
+$uni-main-color: #3a3a3a; 			// 主要文字
+$uni-base-color: #6a6a6a;			// 常规文字
+$uni-secondary-color: #909399;	// 次要文字
+$uni-extra-color: #c7c7c7;			// 辅助说明
+
+// 边框颜色
+$uni-border-1: #F0F0F0;
+$uni-border-2: #EDEDED;
+$uni-border-3: #DCDCDC;
+$uni-border-4: #B9B9B9;
+
+// 常规色
+$uni-black: #000000;
+$uni-white: #ffffff;
+$uni-transparent: rgba($color: #000000, $alpha: 0);
+
+// 背景色
+$uni-bg-color: #f7f7f7;
+
+/* 水平间距 */
+$uni-spacing-sm: 8px;
+$uni-spacing-base: 15px;
+$uni-spacing-lg: 30px;
+
+// 阴影
+$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5);
+$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2);
+$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5);
+
+// 蒙版
+$uni-mask: rgba($color: #000000, $alpha: 0.4);

+ 31 - 0
uni_modules/uni-transition/changelog.md

@@ -0,0 +1,31 @@
+## 1.3.6(2025-07-18)
+- 修复 nvue 页面,样式错误问题
+## 1.3.5(2025-06-11)
+- 修复 第一次执行不显示动画的问题
+## 1.3.4(2025-04-16)
+- 修复 页面数据更新到底动画复原的问题
+- 修复 示例页面打开报错的问题
+## 1.3.3(2024-04-23)
+- 修复 当元素会受变量影响自动隐藏的bug
+## 1.3.2(2023-05-04)
+- 修复 NVUE 平台报错的问题
+## 1.3.1(2021-11-23)
+- 修复 init 方法初始化问题
+## 1.3.0(2021-11-19)
+- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
+- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-transition](https://uniapp.dcloud.io/component/uniui/uni-transition)
+## 1.2.1(2021-09-27)
+- 修复 init 方法不生效的 Bug
+## 1.2.0(2021-07-30)
+- 组件兼容 vue3,如何创建 vue3 项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
+## 1.1.1(2021-05-12)
+- 新增 示例地址
+- 修复 示例项目缺少组件的 Bug
+## 1.1.0(2021-04-22)
+- 新增 通过方法自定义动画
+- 新增 custom-class 非 NVUE 平台支持自定义 class 定制样式
+- 优化 动画触发逻辑,使动画更流畅
+- 优化 支持单独的动画类型
+- 优化 文档示例
+## 1.0.2(2021-02-05)
+- 调整为 uni_modules 目录规范

+ 131 - 0
uni_modules/uni-transition/components/uni-transition/createAnimation.js

@@ -0,0 +1,131 @@
+// const defaultOption = {
+// 	duration: 300,
+// 	timingFunction: 'linear',
+// 	delay: 0,
+// 	transformOrigin: '50% 50% 0'
+// }
+// #ifdef APP-NVUE
+const nvueAnimation = uni.requireNativePlugin('animation')
+// #endif
+class MPAnimation {
+	constructor(options, _this) {
+		this.options = options
+		// 在iOS10+QQ小程序平台下,传给原生的对象一定是个普通对象而不是Proxy对象,否则会报parameter should be Object instead of ProxyObject的错误
+		this.animation = uni.createAnimation({
+			...options
+		})
+		this.currentStepAnimates = {}
+		this.next = 0
+		this.$ = _this
+
+	}
+
+	_nvuePushAnimates(type, args) {
+		let aniObj = this.currentStepAnimates[this.next]
+		let styles = {}
+		if (!aniObj) {
+			styles = {
+				styles: {},
+				config: {}
+			}
+		} else {
+			styles = aniObj
+		}
+		if (animateTypes1.includes(type)) {
+			if (!styles.styles.transform) {
+				styles.styles.transform = ''
+			}
+			let unit = ''
+			if(type === 'rotate'){
+				unit = 'deg'
+			}
+			styles.styles.transform += `${type}(${args+unit}) `
+		} else {
+			styles.styles[type] = `${args}`
+		}
+		this.currentStepAnimates[this.next] = styles
+	}
+	_animateRun(styles = {}, config = {}) {
+		let ref = this.$.$refs['ani'].ref
+		if (!ref) return
+		return new Promise((resolve, reject) => {
+			nvueAnimation.transition(ref, {
+				styles,
+				...config
+			}, res => {
+				resolve()
+			})
+		})
+	}
+
+	_nvueNextAnimate(animates, step = 0, fn) {
+		let obj = animates[step]
+		if (obj) {
+			let {
+				styles,
+				config
+			} = obj
+			this._animateRun(styles, config).then(() => {
+				step += 1
+				this._nvueNextAnimate(animates, step, fn)
+			})
+		} else {
+			this.currentStepAnimates = {}
+			typeof fn === 'function' && fn()
+			this.isEnd = true
+		}
+	}
+
+	step(config = {}) {
+		// #ifndef APP-NVUE
+		this.animation.step(config)
+		// #endif
+		// #ifdef APP-NVUE
+		this.currentStepAnimates[this.next].config = Object.assign({}, this.options, config)
+		this.currentStepAnimates[this.next].styles.transformOrigin = this.currentStepAnimates[this.next].config.transformOrigin
+		this.next++
+		// #endif
+		return this
+	}
+
+	run(fn) {
+		// #ifndef APP-NVUE
+		this.$.animationData = this.animation.export()
+		this.$.timer = setTimeout(() => {
+			typeof fn === 'function' && fn()
+		}, this.$.durationTime)
+		// #endif
+		// #ifdef APP-NVUE
+		this.isEnd = false
+		let ref = this.$.$refs['ani'] && this.$.$refs['ani'].ref
+		if(!ref) return
+		this._nvueNextAnimate(this.currentStepAnimates, 0, fn)
+		this.next = 0
+		// #endif
+	}
+}
+
+
+const animateTypes1 = ['matrix', 'matrix3d', 'rotate', 'rotate3d', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scale3d',
+	'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'translate', 'translate3d', 'translateX', 'translateY',
+	'translateZ'
+]
+const animateTypes2 = ['opacity', 'backgroundColor']
+const animateTypes3 = ['width', 'height', 'left', 'right', 'top', 'bottom']
+animateTypes1.concat(animateTypes2, animateTypes3).forEach(type => {
+	MPAnimation.prototype[type] = function(...args) {
+		// #ifndef APP-NVUE
+		this.animation[type](...args)
+		// #endif
+		// #ifdef APP-NVUE
+		this._nvuePushAnimates(type, args)
+		// #endif
+		return this
+	}
+})
+
+export function createAnimation(option, _this) {
+	if(!_this) return
+	clearTimeout(_this.timer)
+	return new MPAnimation(option, _this)
+}

+ 292 - 0
uni_modules/uni-transition/components/uni-transition/uni-transition.vue

@@ -0,0 +1,292 @@
+<template>
+	<!-- #ifndef APP-NVUE -->
+	<view v-show="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick">
+		<slot></slot>
+	</view>
+	<!-- #endif -->
+	<!-- #ifdef APP-NVUE -->
+	<view v-if="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick">
+		<slot></slot>
+	</view>
+	<!-- #endif -->
+</template>
+
+<script>
+	import { createAnimation } from './createAnimation'
+
+	/**
+	 * Transition 过渡动画
+	 * @description 简单过渡动画组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=985
+	 * @property {Boolean} show = [false|true] 控制组件显示或隐藏
+	 * @property {Array|String} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
+	 *  @value fade 渐隐渐出过渡
+	 *  @value slide-top 由上至下过渡
+	 *  @value slide-right 由右至左过渡
+	 *  @value slide-bottom 由下至上过渡
+	 *  @value slide-left 由左至右过渡
+	 *  @value zoom-in 由小到大过渡
+	 *  @value zoom-out 由大到小过渡
+	 * @property {Number} duration 过渡动画持续时间
+	 * @property {Object} styles 组件样式,同 css 样式,注意带’-‘连接符的属性需要使用小驼峰写法如:`backgroundColor:red`
+	 */
+	export default {
+		name: 'uniTransition',
+		emits: ['click', 'change'],
+		props: {
+			show: {
+				type: Boolean,
+				default: false
+			},
+			modeClass: {
+				type: [Array, String],
+				default () {
+					return 'fade'
+				}
+			},
+			duration: {
+				type: Number,
+				default: 300
+			},
+			styles: {
+				type: Object,
+				default () {
+					return {}
+				}
+			},
+			customClass: {
+				type: String,
+				default: ''
+			},
+			onceRender: {
+				type: Boolean,
+				default: false
+			},
+		},
+		data() {
+			return {
+				isShow: false,
+				transform: '',
+				opacity: 0,
+				animationData: {},
+				durationTime: 300,
+				config: {}
+			}
+		},
+		watch: {
+			show: {
+				handler(newVal) {
+					if (newVal) {
+						this.open()
+					} else {
+						// 避免上来就执行 close,导致动画错乱
+						if (this.isShow) {
+							this.close()
+						}
+					}
+				},
+				immediate: true
+			}
+		},
+		computed: {
+			// 生成样式数据
+			stylesObject() {
+				let styles = {
+					...this.styles,
+					'transition-duration': this.duration / 1000 + 's'
+				}
+				let transform = ''
+				for (let i in styles) {
+					let line = this.toLine(i)
+					transform += line + ':' + styles[i] + ';'
+				}
+				return transform
+			},
+			// 初始化动画条件
+			transformStyles() {
+				return 'transform:' + this.transform + ';' + 'opacity:' + this.opacity + ';' + this.stylesObject
+			}
+		},
+		created() {
+			// 动画默认配置
+			this.config = {
+				duration: this.duration,
+				timingFunction: 'ease',
+				transformOrigin: '50% 50%',
+				delay: 0
+			}
+			this.durationTime = this.duration
+		},
+		methods: {
+			/**
+			 *  ref 触发 初始化动画
+			 */
+			init(obj = {}) {
+				if (obj.duration) {
+					this.durationTime = obj.duration
+				}
+				this.animation = createAnimation(Object.assign(this.config, obj), this)
+			},
+			/**
+			 * 点击组件触发回调
+			 */
+			onClick() {
+				this.$emit('click', {
+					detail: this.isShow
+				})
+			},
+			/**
+			 * ref 触发 动画分组
+			 * @param {Object} obj
+			 */
+			step(obj, config = {}) {
+				if (!this.animation) return this
+				Object.keys(obj).forEach(key => {
+					const value = obj[key]
+					if (typeof this.animation[key] === 'function') {
+						Array.isArray(value) ?
+							this.animation[key](...value) :
+							this.animation[key](value)
+					}
+				})
+				this.animation.step(config)
+				return this
+			},
+			/**
+			 *  ref 触发 执行动画
+			 */
+			run(fn) {
+				if (!this.animation) return
+				this.animation.run(fn)
+			},
+			// 开始过度动画
+			open() {
+				clearTimeout(this.timer)
+				this.isShow = true
+				// 新增初始状态重置逻辑(关键)
+				this.transform = this.styleInit(false).transform || ''
+				this.opacity = this.styleInit(false).opacity || 0
+
+				// 确保动态样式已经生效后,执行动画,如果不加 nextTick ,会导致 wx 动画执行异常
+				this.$nextTick(() => {
+					// TODO 定时器保证动画完全执行,目前有些问题,后面会取消定时器
+					this.timer = setTimeout(() => {
+						this.animation = createAnimation(this.config, this)
+						this.tranfromInit(false).step()
+						this.animation.run(() => {
+							// #ifdef APP-NVUE
+							this.transform = this.styleInit(false).transform || ''
+							this.opacity = this.styleInit(false).opacity || 1
+							// #endif
+							// #ifndef APP-NVUE
+							this.transform = ''
+							this.opacity = this.styleInit(false).opacity || 1
+							// #endif
+							this.$emit('change', {
+								detail: this.isShow
+							})
+						})
+					}, 80)
+				})
+			},
+			// 关闭过度动画
+			close(type) {
+				if (!this.animation) return
+				this.tranfromInit(true)
+					.step()
+					.run(() => {
+						this.isShow = false
+						this.animationData = null
+						this.animation = null
+						let { opacity, transform } = this.styleInit(false)
+						this.opacity = opacity || 1
+						this.transform = transform
+						this.$emit('change', {
+							detail: this.isShow
+						})
+					})
+			},
+			// 处理动画开始前的默认样式
+			styleInit(type) {
+				let styles = { transform: '', opacity: 1 }
+				const buildStyle = (type, mode) => {
+					const value = this.animationType(type)[mode] // 直接使用 type 控制状态
+					if (mode.startsWith('fade')) {
+						styles.opacity = value
+					} else {
+						styles.transform += value + ' '
+					}
+				}
+
+				if (typeof this.modeClass === 'string') {
+					buildStyle(type, this.modeClass)
+				} else {
+					this.modeClass.forEach(mode => buildStyle(type, mode))
+				}
+				return styles
+			},
+			// 处理内置组合动画
+			tranfromInit(type) {
+				let buildTranfrom = (type, mode) => {
+					let aniNum = null
+					if (mode === 'fade') {
+						aniNum = type ? 0 : 1
+					} else {
+						aniNum = type ? '-100%' : '0'
+						if (mode === 'zoom-in') {
+							aniNum = type ? 0.8 : 1
+						}
+						if (mode === 'zoom-out') {
+							aniNum = type ? 1.2 : 1
+						}
+						if (mode === 'slide-right') {
+							aniNum = type ? '100%' : '0'
+						}
+						if (mode === 'slide-bottom') {
+							aniNum = type ? '100%' : '0'
+						}
+					}
+					this.animation[this.animationMode()[mode]](aniNum)
+				}
+				if (typeof this.modeClass === 'string') {
+					buildTranfrom(type, this.modeClass)
+				} else {
+					this.modeClass.forEach(mode => {
+						buildTranfrom(type, mode)
+					})
+				}
+
+				return this.animation
+			},
+			animationType(type) {
+				return {
+					fade: type ? 1 : 0,
+					'slide-top': `translateY(${type ? '0' : '-100%'})`,
+					'slide-right': `translateX(${type ? '0' : '100%'})`,
+					'slide-bottom': `translateY(${type ? '0' : '100%'})`,
+					'slide-left': `translateX(${type ? '0' : '-100%'})`,
+					'zoom-in': `scaleX(${type ? 1 : 0.8}) scaleY(${type ? 1 : 0.8})`,
+					'zoom-out': `scaleX(${type ? 1 : 1.2}) scaleY(${type ? 1 : 1.2})`
+				}
+			},
+			// 内置动画类型与实际动画对应字典
+			animationMode() {
+				return {
+					fade: 'opacity',
+					'slide-top': 'translateY',
+					'slide-right': 'translateX',
+					'slide-bottom': 'translateY',
+					'slide-left': 'translateX',
+					'zoom-in': 'scale',
+					'zoom-out': 'scale'
+				}
+			},
+			// 驼峰转中横线
+			toLine(name) {
+				return name.replace(/([A-Z])/g, '-$1').toLowerCase()
+			}
+		}
+	}
+</script>
+
+<style></style>

+ 112 - 0
uni_modules/uni-transition/package.json

@@ -0,0 +1,112 @@
+{
+  "id": "uni-transition",
+  "displayName": "uni-transition 过渡动画",
+  "version": "1.3.6",
+  "description": "元素的简单过渡动画",
+  "keywords": [
+    "uni-ui",
+    "uniui",
+    "动画",
+    "过渡",
+    "过渡动画"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": "",
+    "uni-app": "^4.12",
+    "uni-app-x": ""
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
+    "type": "component-vue",
+    "darkmode": "x",
+    "i18n": "x",
+    "widescreen": "x"
+  },
+  "uni_modules": {
+    "dependencies": [
+      "uni-scss"
+    ],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "x",
+        "aliyun": "x",
+        "alipay": "x"
+      },
+      "client": {
+        "uni-app": {
+          "vue": {
+            "vue2": "√",
+            "vue3": "√"
+          },
+          "web": {
+            "safari": "√",
+            "chrome": "√"
+          },
+          "app": {
+            "vue": "√",
+            "nvue": "√",
+            "android": "√",
+            "ios": "√",
+            "harmony": "√"
+          },
+          "mp": {
+            "weixin": {
+            },
+            "alipay": {
+            },
+            "toutiao": {
+            },
+            "baidu": {
+            },
+            "kuaishou": {
+            },
+            "jd": {
+            },
+            "harmony": "-",
+            "qq": "√",
+            "lark": "-"
+          },
+          "quickapp": {
+            "huawei": "√",
+            "union": "√"
+          }
+        },
+        "uni-app-x": {
+          "web": {
+            "safari": "-",
+            "chrome": "-"
+          },
+          "app": {
+            "android": "-",
+            "ios": "-",
+            "harmony": "-"
+          },
+          "mp": {
+            "weixin": "-"
+          }
+        }
+      }
+    }
+  }
+}

+ 11 - 0
uni_modules/uni-transition/readme.md

@@ -0,0 +1,11 @@
+
+
+## Transition 过渡动画
+> **组件名:uni-transition**
+> 代码块: `uTransition`
+
+
+元素过渡动画
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-transition)
+#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839 

+ 6 - 1
utils/css/main.css

@@ -3948,7 +3948,7 @@ scroll-view.cu-steps .cu-item {
 .star-task-list .task-item .item-body{
 	display: flex;
 	align-items: center;
-	gap: 30rpx;
+	gap: 20rpx;
 }
 .star-task-list .task-item .item-img {
 	width: 210rpx;
@@ -4061,4 +4061,9 @@ scroll-view.cu-steps .cu-item {
 .star-task-more{
 	margin: 20rpx 0;
 	min-height: 40rpx;
+}
+
+.scroll-content{
+	width: 100%;
+	height: 100vh;
 }