完善添加银行卡功能

2025-12-27 17:52:08 +08:00
parent 20455490f8
commit 3b9b142c21
44 changed files with 3434 additions and 28 deletions
--- a/api/index.js
+++ b/api/index.js
@@ -78,3 +78,12 @@ export const getRegion = data => {
    data
  })
 }
+
+/** 用户积分排行榜 */
+export const getUserIntegralRank = data => {
+  return http({
+    url: '/api/system/userPoints/list',
+    method: 'get',
+    data
+  })
+}
--- a/components/nav-bar/nav-bar.vue
+++ b/components/nav-bar/nav-bar.vue
@@ -1,23 +1,90 @@
 <script setup>
  import { navigateBack } from '@/utils/router'
-  import { useSlots } from 'vue'
+  import { useSlots, computed, ref, onMounted } from 'vue'

  const slots = useSlots()

  const props = defineProps({
-    title: { type: String, default: '' },
+    title: {
+      type: String,
+      default: ''
+    },
+    /** 导航栏颜色 */
+    targetColor: {
+      type: String,
+      default: '#ffffff'
+    },
+    /** 滚动多少 rpx 后完全变为目标色 */
+    maxScroll: {
+      type: Number,
+      default: 0
+    },
    /** 是否带背景 */
-    isTopBg: { type: Boolean, default: false },
+    isTopBg: {
+      type: Boolean,
+      default: false
+    },
    /** 是否有占位符 */
-    isPlaceholder: { type: Boolean, default: false },
+    isPlaceholder: {
+      type: Boolean,
+      default: false
+    },
    /** 是否自定义返回事件 */
-    isCustomBack: { type: Boolean, default: false }
+    isCustomBack: {
+      type: Boolean,
+      default: false
+    }
  })

  const emits = defineEmits(['onBack'])

  // 判断是否传入了名为 "back" 的插槽
  const hasBackSlot = !!slots.back
+  /** 全局存储当前滚动位置（供 computed 使用） */
+  const currentScrollTop = ref(0)
+  /** 缓存 rpx 转 px 的比例 */
+  const rpxToPxRatio = ref(1)
+
+  /** 将 props.maxScroll (rpx) 转为 px */
+  const maxScrollPx = computed(() => {
+    return props.maxScroll * rpxToPxRatio.value
+  })
+
+  /** 当前背景色（RGBA 动态计算） */
+  const bgColor = computed(() => {
+    const scroll = getCurrentScroll()
+    const maxPx = maxScrollPx.value
+    const startFadeAt = maxPx / 3 // 1/3 处开始渐变
+
+    let alpha = 0
+    if (scroll >= maxPx) {
+      alpha = 1
+    } else if (scroll > startFadeAt) {
+      // 在 [startFadeAt, maxPx] 区间内线性插值
+      alpha = (scroll - startFadeAt) / (maxPx - startFadeAt)
+      alpha = Math.min(Math.max(alpha, 0), 1) // 安全 clamp
+    } else {
+      alpha = 0
+    }
+    // 解析颜色
+    const hex = props.targetColor.replace('#', '')
+    if (hex.length !== 6) {
+      return `rgba(0, 122, 255, ${alpha})`
+    }
+    const r = parseInt(hex.substring(0, 2), 16)
+    const g = parseInt(hex.substring(2, 4), 16)
+    const b = parseInt(hex.substring(4, 6), 16)
+    return `rgba(${r}, ${g}, ${b}, ${alpha})`
+  })
+
+  const getCurrentScroll = () => {
+    return currentScrollTop.value
+  }
+
+  /** 暴露方法：供父页面 onPageScroll 调用 */
+  const updateScroll = scrollTop => {
+    currentScrollTop.value = scrollTop
+  }

  const onBack = () => {
    if (props.isCustomBack) {
@@ -26,11 +93,26 @@
      navigateBack()
    }
  }
+
+  onMounted(() => {
+    const sysInfo = uni.getSystemInfoSync()
+    rpxToPxRatio.value = sysInfo.windowWidth / 750
+  })
+
+  // 向外暴露方法
+  defineExpose({
+    updateScroll
+  })
 </script>

 <template>
  <view>
-    <view :class="{ 'nav-bar_bg': props.isTopBg }" class="nav-bar">
+    <view
+      :style="{
+        backgroundColor: props.isTopBg ? bgColor : 'transparent'
+      }"
+      class="nav-bar"
+    >
      <view class="status_bar">
        <!-- 这里是状态栏 -->
      </view>
@@ -58,6 +140,7 @@
      </view>
    </view>

+    <!-- 占位符 -->
    <view v-if="props.isPlaceholder" class="nav-bar-placeholder"></view>
  </view>
 </template>
@@ -70,10 +153,6 @@
    z-index: 99;
  }

-  .nav-bar_bg {
-    background: #ffffff;
-  }
-
  .top_left-icon {
    height: 36rpx;
  }
--- a/pages.json
+++ b/pages.json
@@ -59,6 +59,41 @@
 				"backgroundColor": "#f7f7f7"
 			}
 		},
+		{
+			"path": "pages/my-index/personal-center/index",
+			"style": {
+				"navigationBarTitleText": "个人中心",
+				"navigationBarBackgroundColor": "#ffffff"
+			}
+		},
+		{
+			"path": "pages/my-index/wallet/index",
+			"style": {
+				"navigationBarTitleText": "钱包",
+				"navigationBarBackgroundColor": "#ffffff"
+			}
+		},
+		{
+			"path": "pages/my-index/wallet/edit-password",
+			"style": {
+				"navigationBarTitleText": "修改钱包密码",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/my-index/wallet/bank-card/index",
+			"style": {
+				"navigationBarTitleText": "提现卡",
+				"navigationBarBackgroundColor": "#ffffff"
+			}
+		},
+		{
+			"path": "pages/my-index/wallet/bank-card/card-details",
+			"style": {
+				"navigationBarTitleText": "卡信息增删改查",
+				"navigationStyle": "custom"
+			}
+		},
 		{
 			"path": "pages/mall/list",
 			"style": {
@@ -128,6 +163,19 @@
 				"navigationBarTitleText": "签到",
 				"navigationStyle": "custom"
 			}
+		},
+		{
+			"path": "pages/discover/dynamic/dynamic",
+			"style": {
+				"navigationBarTitleText": "朋友圈",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/discover/company",
+			"style": {
+				"navigationBarTitleText": "公司介绍"
+			}
 		}
 	],
 	"globalStyle": {
--- a/pages/discover/company.vue
+++ b/pages/discover/company.vue
@@ -0,0 +1,55 @@
+<script setup></script>
+
+<template>
+  <view class="company">
+    <view class="top-log">
+      <image
+        src="https://qcloud.dpfile.com/pc/TrdZpLN1zkXDV4oN2FH98LdVnvHj694NKQu0_KA3ul4eYxZWRPQ7CJuw-PqyZBS4.jpg"
+        mode="aspectFill"
+        class="img"
+      ></image>
+      <text>名字</text>
+    </view>
+
+    <view class="consten">
+      <view class="item">富文本</view>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  page {
+    background: #f9f9f9;
+  }
+
+  .top-log {
+    margin: 114rpx 0 96rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    .img {
+      width: 192rpx;
+      height: 192rpx;
+    }
+    text {
+      margin-top: 32rpx;
+      font-family: PingFang SC, PingFang SC;
+      font-weight: bold;
+      font-size: 32rpx;
+      color: #333333;
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+    }
+  }
+
+  .consten {
+    padding: 0 24rpx;
+    .item {
+      background: #ffffff;
+      padding: 48rpx 32rpx;
+      border-radius: 16rpx;
+    }
+  }
+</style>
--- a/pages/discover/discover.vue
+++ b/pages/discover/discover.vue
@@ -20,6 +20,14 @@
      navigateTo('/pages/discover/punch')
      return
    }
+    if (item === 'company') {
+      navigateTo('/pages/discover/company')
+      return
+    }
+    if (item === 'circle') {
+      navigateTo('/pages/discover/dynamic/dynamic')
+      return
+    }
    if (item === 'mall') {
      navigateTo('/pages/mall/list')
      return
--- a/pages/discover/dynamic/dynamic.vue
+++ b/pages/discover/dynamic/dynamic.vue
@@ -0,0 +1,115 @@
+<script setup>
+  import { reactive, ref } from 'vue'
+  import { onPageScroll } from '@dcloudio/uni-app'
+
+  const MAX_SCROLL = 446
+
+  const cbNavBar = ref({})
+  const topIcon = reactive({
+    leftColor: '#ffffff',
+    rightColor: '#ffffff'
+  })
+
+  onPageScroll(e => {
+    cbNavBar.value?.updateScroll(e.scrollTop)
+    if (e.scrollTop > MAX_SCROLL - 220) {
+      topIcon.leftColor = '#000'
+      topIcon.rightColor = '#000'
+    } else {
+      topIcon.leftColor = '#ffffff'
+      topIcon.rightColor = '#ffffff'
+    }
+  })
+</script>
+
+<template>
+  <view class="dynamic">
+    <nav-bar
+      ref="cbNavBar"
+      isTopBg
+      target-color="#f9f9f9"
+      :max-scroll="MAX_SCROLL"
+    >
+      <template #back>
+        <uni-icons
+          :color="topIcon.leftColor"
+          type="left"
+          size="24"
+        ></uni-icons>
+      </template>
+      <template #right>
+        <uni-icons
+          :color="topIcon.rightColor"
+          type="camera"
+          size="24"
+        ></uni-icons>
+      </template>
+    </nav-bar>
+    <view class="top-bg-img">
+      <image
+        src="https://wx4.sinaimg.cn/mw690/006i0nC8ly1hqugav3k6yj31o01o0aod.jpg"
+        mode="aspectFill"
+        class="img"
+      ></image>
+      <!-- 用户信息 -->
+      <view class="user-info">
+        <text>名字</text>
+        <image
+          src="https://img2.baidu.com/it/u=3408192385,656358498&fm=253&app=138&f=JPEG?w=760&h=760"
+          mode="aspectFill"
+          class="avatar"
+        ></image>
+      </view>
+    </view>
+
+    <!-- 动态列表 -->
+    <view class="dynamic-list">
+      <view v-for="item in 4" class="list">
+        <image
+          src="https://img1.baidu.com/it/u=2645961124,1296922095&fm=253&app=138&f=JPEG?w=800&h=1530"
+          mode="aspectFill"
+          class="avatar"
+        ></image>
+        <view class="content">
+          <text class="name">名字</text>
+          <text class="text">这是一条朋友圈的标题</text>
+          <view class="img-list">
+            <image
+              src="https://p4.itc.cn/images01/20220619/46660ed163164c14be90e605a73ee5e8.jpeg"
+              mode="aspectFill"
+              class="item-img"
+            ></image>
+          </view>
+          <!-- 地址 -->
+          <view class="address">
+            <text>19分钟前</text>
+            <text>重庆市渝北xxx寄街道</text>
+          </view>
+          <!-- 点赞评论 -->
+          <view class="like-box">
+            <view class="like">
+              <uni-icons
+                type="hand-up"
+                size="20"
+                color="#747474"
+              ></uni-icons>
+              <text>22</text>
+            </view>
+            <uni-icons type="chat" size="20" color="#747474"></uni-icons>
+          </view>
+          <!-- 评论内容 -->
+          <view class="comment">
+            <view v-for="item in 3" :key="item" class="comment-item">
+              <text>Admin:</text>
+              <text>确实的很好，值得推荐的很好</text>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  @import '../styles/dynamic.scss';
+</style>
--- a/pages/discover/punch.vue
+++ b/pages/discover/punch.vue
@@ -1,4 +1,15 @@
-<script setup></script>
+<script setup>
+  import { ref } from 'vue'
+
+  const indexData = ref([1, 2, 3, 4])
+
+  const onItem = item => {
+    if (indexData.value.includes(item)) {
+      return
+    }
+    indexData.value.push(item)
+  }
+</script>

 <template>
  <view class="punch">
@@ -12,20 +23,130 @@
      </template>
    </nav-bar>
    <view class="public-header—box">
-      <!-- <image
-        src="/static/images/ranking-list/title-icon.png"
-        mode="aspectFit"
-        class="left-icon"
-      ></image>
+      <view class="integral-box">
+        <text>我的积分</text>
+        <text>410</text>
+      </view>
      <image
-        src="/static/images/ranking-list/hat.png"
+        src="/static/images/discover/calendar.png"
        mode="aspectFit"
        class="right-icon"
-      ></image> -->
+      ></image>
+    </view>
+
+    <view class="punch-box">
+      <view class="top-title">
+        <text class="title">每日签到领积分</text>
+        <view class="right-box">
+          <text>已连续签到</text>
+          <text>05</text>
+          <text>天</text>
+        </view>
+      </view>
+      <!-- 签到列表 -->
+      <view class="list-box">
+        <view
+          v-for="item in 30"
+          :key="item"
+          :class="{ active: indexData.includes(item) }"
+          class="item"
+          @click="onItem(item)"
+        >
+          <view class="bg-box">
+            <image
+              src="/static/images/discover/bean.png"
+              mode="heightFix"
+              class="icon"
+            ></image>
+            <text>+10</text>
+          </view>
+          <text class="bottom-name">今天</text>
+        </view>
+      </view>
    </view>
  </view>
 </template>

 <style lang="scss" scoped>
  @import './styles/index.scss';
+  .punch-box {
+    padding: 0 24rpx;
+    .top-title {
+      font-family: PingFang SC, PingFang SC;
+
+      font-style: normal;
+      text-transform: none;
+      display: flex;
+      align-items: center;
+      .title {
+        font-weight: bold;
+        font-size: 32rpx;
+        color: #333333;
+      }
+      .right-box {
+        margin-left: 32rpx;
+        display: flex;
+        align-items: center;
+        text {
+          font-weight: 500;
+          font-size: 28rpx;
+          color: #666666;
+          &:nth-child(2) {
+            margin: 0 4rpx;
+            color: #00d993;
+          }
+        }
+      }
+    }
+
+    .list-box {
+      margin-top: 38rpx;
+      font-family: PingFang SC, PingFang SC;
+      font-style: normal;
+      text-transform: none;
+      display: grid;
+      grid-template-columns: repeat(7, 1fr);
+      grid-gap: 22rpx;
+      .item {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        .bg-box {
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+          width: 80rpx;
+          height: 100rpx;
+          background: #f4f4f4;
+          border-radius: 8rpx;
+          .icon {
+            height: 48rpx;
+          }
+          text {
+            font-weight: bold;
+            font-size: 24rpx;
+            color: #999999;
+          }
+        }
+        .bottom-name {
+          margin-top: 8rpx;
+          font-size: 24rpx;
+          color: #999999;
+        }
+      }
+      .active {
+        .bg-box {
+          background: linear-gradient(0deg, #00d993 0%, #00d9c5 100%);
+          text {
+            color: #ffffff;
+          }
+        }
+        .bottom-name {
+          color: #00d993;
+        }
+      }
+    }
+  }
 </style>
--- a/pages/discover/ranking-list.vue
+++ b/pages/discover/ranking-list.vue
@@ -1,8 +1,36 @@
-<script setup></script>
+<script setup>
+  import { ref } from 'vue'
+  import { onLoad, onPageScroll } from '@dcloudio/uni-app'
+  import { getUserIntegralRank } from '@/api'
+
+  const cbNavBar = ref({})
+  const listData = ref([])
+
+  const getData = async () => {
+    const res = await getUserIntegralRank({
+      pageNum: 1,
+      pageSize: 100
+    })
+    listData.value = res.rows
+  }
+
+  onPageScroll(e => {
+    cbNavBar.value?.updateScroll(e.scrollTop)
+  })
+
+  onLoad(() => {
+    getData()
+  })
+</script>

 <template>
  <view class="ranking-list">
-    <nav-bar>
+    <nav-bar
+      ref="cbNavBar"
+      isTopBg
+      target-color="#f9f9f9"
+      :max-scroll="446"
+    >
      <template #back>
        <image
          src="/static/images/public/return-icon.png"
@@ -46,8 +74,8 @@
      </uni-row>
      <!-- 列表内容 -->
      <uni-row
-        v-for="(item, index) in 19"
-        :key="index"
+        v-for="(item, index) in listData"
+        :key="item.id"
        class="table-content"
      >
        <uni-col :span="6">
@@ -69,14 +97,14 @@
              class="left-icon"
            ></image>
            <view class="name">
-              <text>张三</text>
+              <text>名字</text>
              <text>158****98874</text>
            </view>
          </view>
        </uni-col>
        <uni-col :span="6">
          <view class="table-right">
-            <text class="item-text">100</text>
+            <text class="item-text">{{ item.totalPoints }}</text>
          </view>
        </uni-col>
      </uni-row>
--- a/pages/discover/styles/dynamic.scss
+++ b/pages/discover/styles/dynamic.scss
@@ -0,0 +1,126 @@
+.top-bg-img {
+  width: 100%;
+  height: 544rpx;
+  position: relative;
+  .img {
+    width: 100%;
+    height: 100%;
+  }
+  .user-info {
+    position: absolute;
+    right: 24rpx;
+    bottom: -60rpx;
+    display: flex;
+    align-items: flex-start;
+    text {
+      margin-top: 30rpx;
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 600;
+      font-size: 32rpx;
+      color: #ffffff;
+      font-style: normal;
+      text-transform: none;
+    }
+    .avatar {
+      width: 160rpx;
+      height: 160rpx;
+      border-radius: 16rpx;
+      margin-left: 30rpx;
+    }
+  }
+}
+
+.dynamic-list {
+  padding: 86rpx 26rpx 0 26rpx;
+  .list + .list {
+    margin-top: 32rpx;
+  }
+  .list {
+    display: flex;
+    .avatar {
+      width: 96rpx;
+      height: 96rpx;
+      border-radius: 96rpx;
+      flex-shrink: 0;
+      margin-right: 32rpx;
+    }
+    .content {
+      width: 100%;
+      font-family: PingFang SC, PingFang SC;
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+      display: flex;
+      flex-direction: column;
+      .name {
+        font-weight: bold;
+        font-size: 32rpx;
+        color: #333333;
+      }
+      .text {
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #333333;
+        margin: 16rpx 0;
+      }
+      .img-list {
+        .item-img {
+          width: 410rpx;
+          height: 250rpx;
+          border-radius: 8rpx;
+        }
+      }
+      .address {
+        display: flex;
+        align-items: center;
+        margin: 16rpx 0 14rpx;
+        text {
+          font-weight: 500;
+          font-size: 24rpx;
+          color: #999999;
+          margin-right: 16rpx;
+          &:last-child {
+            font-size: 24rpx;
+            color: #0c587e;
+          }
+        }
+      }
+      .like-box {
+        display: flex;
+        align-items: center;
+        .like {
+          display: flex;
+          align-items: center;
+          margin-right: 86rpx;
+          text {
+            font-weight: 400;
+            font-size: 22rpx;
+            color: #747474;
+          }
+        }
+      }
+      .comment {
+        margin-top: 16rpx;
+        padding: 16rpx 18rpx;
+        background: #f9f9f9;
+        border-radius: 8rpx;
+        .comment-item + .comment-item {
+          margin-top: 16rpx;
+        }
+        .comment-item {
+          text {
+            font-weight: 400;
+            font-size: 28rpx;
+            color: #333333;
+            margin-right: 8rpx;
+            &:last-child {
+              font-weight: 500;
+              font-size: 28rpx;
+              color: #999999;
+            }
+          }
+        }
+      }
+    }
+  }
+}
--- a/pages/discover/styles/index.scss
+++ b/pages/discover/styles/index.scss
@@ -13,6 +13,27 @@
    background: #ffffff;
    border-radius: 32rpx 32rpx 0rpx 0rpx;
  }
+  .integral-box {
+    width: 354rpx;
+    height: 166rpx;
+    position: absolute;
+    bottom: 82rpx;
+    left: 48rpx;
+    font-family: PingFang SC, PingFang SC;
+    color: #ffffff;
+    font-weight: bold;
+    font-style: normal;
+    text-transform: none;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    text {
+      font-size: 32rpx;
+      &:last-child {
+        font-size: 100rpx;
+      }
+    }
+  }
  .left-icon {
    width: 354rpx;
    height: 166rpx;
--- a/pages/my-index/components/card-input.vue
+++ b/pages/my-index/components/card-input.vue
@@ -0,0 +1,72 @@
+<script setup>
+  const name = defineModel({
+    type: String,
+    default: ''
+  })
+
+  const props = defineProps({
+    /**
+     * 输入框状态类型
+     * text: 文本
+     * password: 密码
+     * number: 数字
+     * tel: 手机号
+     * email: 邮箱
+     */
+    type: {
+      type: String,
+      default: 'text'
+    },
+    title: {
+      type: String,
+      default: '标题'
+    },
+    placeholder: {
+      type: String,
+      default: '请输入'
+    }
+  })
+
+  const placeholderStyle = `font-family: PingFang SC, PingFang SC; font-weight: 500; color: #D9D9D9; font-size: 28rpx; font-style: normal; text-transform: none;`
+</script>
+
+<template>
+  <view class="card-input">
+    <text class="title">{{ props.title }}</text>
+    <input
+      v-model="name"
+      :type="props.type"
+      :placeholder-style="placeholderStyle"
+      :placeholder="props.placeholder"
+    />
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  .card-input + .card-input {
+    margin-top: 16rpx;
+  }
+  .card-input {
+    background: #ffffff;
+    border-radius: 16rpx;
+    padding: 20rpx 32rpx;
+    display: flex;
+    justify-content: space-between;
+    .title {
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 500;
+      font-size: 28rpx;
+      color: #333333;
+      text-align: left;
+      font-style: normal;
+      text-transform: none;
+    }
+    input {
+      width: 340rpx;
+      text-align: right;
+      font-weight: 500;
+      font-size: 28rpx;
+      color: #333333;
+    }
+  }
+</style>
--- a/pages/my-index/my-index.vue
+++ b/pages/my-index/my-index.vue
@@ -1,8 +1,14 @@
 <script setup>
  import { useAuthUser } from '@/composables/useAuthUser'
+  import { onLoad } from '@dcloudio/uni-app'
+  import { navigateTo } from '@/utils/router'

  const bottomList = [
-    { name: '我的钱包', icon: 'wallet' },
+    {
+      name: '我的钱包',
+      icon: 'wallet',
+      url: '/pages/my-index/wallet/index'
+    },
    { name: '我的团队', icon: 'team' },
    { name: '会议记录', icon: 'meeting' },
    { name: '我的朋友圈', icon: 'circle' },
@@ -11,11 +17,19 @@
    { name: '系统设置', icon: 'system' }
  ]
  const { userInfo } = useAuthUser()
+
+  onLoad(() => {
+    // 获取用户信息
+    console.log(userInfo.value, '===获取用户信息')
+  })
 </script>

 <template>
  <view class="my-index">
-    <view class="top-info">
+    <view
+      class="top-info"
+      @click="navigateTo('/pages/my-index/personal-center/index')"
+    >
      <view class="left-box">
        <image
          src="https://wx1.sinaimg.cn/mw690/92eeb099gy1i29hl0ne80j21jk2bcash.jpg"
@@ -38,7 +52,7 @@
      <view class="top-box">
        <view class="left-name">
          <text>账户积分</text>
-          <text>2933</text>
+          <text>{{ userInfo?.totalPoints }}</text>
        </view>
        <view class="right-btn">
          <button>充值</button>
@@ -50,6 +64,7 @@
        v-for="(item, index) in bottomList"
        :key="index"
        class="item-box"
+        @click="item.url && navigateTo(item.url)"
      >
        <view class="item-name">
          <image
@@ -82,7 +97,6 @@
    .top-info {
      padding: 32rpx 46rpx;
      background: #ffffff;
-      height: 192rpx;
      border-radius: 16rpx;
      display: flex;
      justify-content: space-between;
--- a/pages/my-index/personal-center/index.vue
+++ b/pages/my-index/personal-center/index.vue
@@ -0,0 +1,58 @@
+<script setup>
+  import { useAuthUser } from '@/composables/useAuthUser'
+
+  const itemList = [
+    { title: '我的二维码', key: '1', value: '' },
+    { title: 'ID', key: '2', value: 'userId' },
+    { title: '昵称', key: '3', value: 'userName' },
+    { title: '性别', key: '4', value: '' },
+    { title: '手机号码', key: '5', value: 'mobile' },
+    { title: '个性签名', key: '6', value: '' }
+  ]
+
+  const { userInfo } = useAuthUser()
+</script>
+
+<template>
+  <view class="personal-center">
+    <view class="public-card">
+      <view class="left-img">
+        <image
+          src="https://p4.itc.cn/images01/20220619/46660ed163164c14be90e605a73ee5e8.jpeg"
+          mode="aspectFill"
+          class="avatar"
+        ></image>
+      </view>
+      <view class="right-box">
+        <text class="value">换头像</text>
+        <uni-icons type="right" size="16" color="#999999"></uni-icons>
+      </view>
+    </view>
+
+    <view
+      v-for="(item, index) in itemList"
+      :key="index"
+      class="public-card"
+    >
+      <view class="left-box">
+        <text>{{ item.title }}</text>
+        <text v-if="item.key === '6'" class="text">
+          这个人很懒，什么也没有
+        </text>
+      </view>
+      <view class="right-box">
+        <text v-if="!['1', '6'].includes(item.key)" class="value">
+          {{ item.value ? userInfo[item.value] : '' }}
+        </text>
+        <uni-icons type="right" size="16" color="#999999"></uni-icons>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  @import '../styles/index.scss';
+  .personal-center {
+    padding: 32rpx 24rpx;
+  }
+</style>
--- a/pages/my-index/styles/index.scss
+++ b/pages/my-index/styles/index.scss
@@ -0,0 +1,70 @@
+page {
+  background: #f9f9f9;
+}
+
+.public-card + .public-card {
+  margin-top: 16rpx;
+}
+
+.public-card {
+  background: #ffffff;
+  border-radius: 16rpx;
+  padding: 20rpx 32rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-family: PingFang SC, PingFang SC;
+  font-style: normal;
+  text-transform: none;
+
+  .left-box,
+  .left-img,
+  .right-box {
+    display: flex;
+    align-items: center;
+  }
+  .left-img {
+    .avatar {
+      width: 96rpx;
+      height: 96rpx;
+      border-radius: 96rpx;
+      margin-right: 16rpx;
+    }
+    .card {
+      width: 48rpx;
+      height: 48rpx;
+      margin-right: 16rpx;
+    }
+    text {
+      font-weight: 500;
+      font-size: 28rpx;
+      color: #333333;
+    }
+  }
+
+  .left-box {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    width: 70%;
+    text {
+      font-weight: 600;
+      font-size: 28rpx;
+      color: #333333;
+    }
+    .text {
+      margin-top: 8rpx;
+      font-size: 24rpx;
+      color: #999999;
+    }
+  }
+  .right-box {
+    align-items: flex-end;
+    .value {
+      font-weight: 600;
+      font-size: 28rpx;
+      color: #999999;
+      margin-right: 6rpx;
+    }
+  }
+}
--- a/pages/my-index/wallet/bank-card/card-details.vue
+++ b/pages/my-index/wallet/bank-card/card-details.vue
@@ -0,0 +1,63 @@
+<script setup>
+  import { onLoad } from '@dcloudio/uni-app'
+  import { reactive } from 'vue'
+  import CardInput from '../../components/card-input.vue'
+
+  const stateData = reactive({
+    title: '',
+    state: '0'
+  })
+
+  const formData = reactive({
+    // 银行卡名称
+    name: '',
+    // 开户行名称
+    khName: '',
+    // 银行卡号
+    cardNum: '',
+    // 微信/支付宝号
+    codeName: '',
+    // 图片链接
+    img: ''
+  })
+  onLoad(e => {
+    const titltData = {
+      0: '添加银行卡',
+      101: '添加支付宝账户',
+      102: '添加微信账户'
+    }[e.key]
+    stateData.title = titltData
+    stateData.state = e.key
+  })
+</script>
+
+<template>
+  <view>
+    <nav-bar isTopBg isPlaceholder :title="stateData.title"></nav-bar>
+
+    <view
+      v-if="!['101', '102'].includes(stateData.state)"
+      class="card-details"
+    >
+      <CardInput v-model="formData.name" title="银行名称"></CardInput>
+      <CardInput v-model="formData.khName" title="开户行"></CardInput>
+      <CardInput v-model="formData.cardNum" title="银行卡号"></CardInput>
+    </view>
+
+    <view v-else class="card-details">
+      <CardInput
+        v-model="formData.codeName"
+        :title="`${
+          stateData.state === '101' ? '支付宝账号' : '微信账号'
+        }`"
+      ></CardInput>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  @import '../../styles/index.scss';
+  .card-details {
+    padding: 32rpx 24rpx;
+  }
+</style>
--- a/pages/my-index/wallet/bank-card/index.vue
+++ b/pages/my-index/wallet/bank-card/index.vue
@@ -0,0 +1,56 @@
+<script setup>
+  import { ref } from 'vue'
+  import { navigateTo } from '@/utils/router'
+
+  const itemList = ref([
+    {
+      title: '支付宝',
+      key: '101',
+      icon: '/static/images/my-index/zfb.png'
+    },
+    { title: '微信', key: '102', icon: '/static/images/my-index/wx.png' }
+  ])
+
+  const onAddCard = key => {
+    navigateTo('/pages/my-index/wallet/bank-card/card-details', { key })
+  }
+</script>
+
+<template>
+  <view class="bank-card">
+    <view
+      v-for="(item, index) in itemList"
+      :key="index"
+      class="public-card"
+      @click="onAddCard(item.key)"
+    >
+      <view class="left-img">
+        <image
+          :src="
+            item.icon
+              ? item.icon
+              : 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2024%2F1227%2F842e0e65j00sp543n001fd000i700iim.jpg&thumbnail=660x2147483647&quality=80&type=jpg'
+          "
+          mode="aspectFill"
+          class="card"
+        ></image>
+        <text>{{ item.title }}</text>
+      </view>
+      <view class="right-box">
+        <uni-icons type="right" size="16" color="#999999"></uni-icons>
+      </view>
+    </view>
+
+    <!-- 底部按钮 -->
+    <bottom-view>
+      <cb-button @click="onAddCard('0')">+添加银行卡</cb-button>
+    </bottom-view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  @import '../../styles/index.scss';
+  .bank-card {
+    padding: 38rpx 24rpx;
+  }
+</style>
--- a/pages/my-index/wallet/edit-password.vue
+++ b/pages/my-index/wallet/edit-password.vue
@@ -0,0 +1,101 @@
+<script setup>
+  import { reactive } from 'vue'
+  import CardInput from '../components/card-input.vue'
+  import { useUI } from '@/utils/use-ui'
+  import { validateTransactionPassword } from '@/utils/validate'
+
+  const { showToast } = useUI()
+
+  const formData = reactive({
+    // 旧密码
+    password: '',
+    // 新密码
+    newPassword: '',
+    // 确认密码
+    confirmPassword: ''
+  })
+  const onEdit = () => {
+    const passwordValue = validateTransactionPassword(
+      formData.password,
+      '旧密码'
+    )
+    if (!passwordValue.valid) {
+      showToast(passwordValue.message)
+      return
+    }
+
+    const newPasswordValue = validateTransactionPassword(
+      formData.newPassword,
+      '新的交易密码'
+    )
+    if (!newPasswordValue.valid) {
+      showToast(newPasswordValue.message)
+      return
+    }
+
+    const confirmPasswordValue = validateTransactionPassword(
+      formData.confirmPassword,
+      '确认交易密码'
+    )
+    if (!confirmPasswordValue.valid) {
+      showToast(confirmPasswordValue.message)
+      return
+    }
+
+    if (formData.newPassword !== formData.confirmPassword) {
+      showToast('两次密码不一致')
+      return
+    }
+
+    console.log('修改密码：', formData)
+  }
+</script>
+
+<template>
+  <view class="edit-password">
+    <nav-bar isTopBg isPlaceholder title="交易密码">
+      <template #right>
+        <text class="top-right-name" @click="onEdit">确认</text>
+      </template>
+    </nav-bar>
+
+    <view class="input-box">
+      <CardInput
+        v-model="formData.password"
+        title="旧密码"
+        type="password"
+      ></CardInput>
+      <CardInput
+        v-model="formData.newPassword"
+        title="设置新的交易密码"
+        type="password"
+      ></CardInput>
+      <CardInput
+        v-model="formData.confirmPassword"
+        title="重复新的交易密码"
+        type="password"
+      ></CardInput>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  @import '../styles/index.scss';
+
+  .top-right-name {
+    font-family: PingFang SC, PingFang SC;
+    font-weight: 500;
+    font-size: 28rpx;
+    color: #ffffff;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+    background: #00d993;
+    padding: 6rpx 20rpx;
+    border-radius: 8rpx;
+  }
+
+  .input-box {
+    padding: 32rpx 24rpx;
+  }
+</style>
--- a/pages/my-index/wallet/index.vue
+++ b/pages/my-index/wallet/index.vue
@@ -0,0 +1,125 @@
+<script setup>
+  import { navigateTo } from '@/utils/router'
+
+  const itemList = [
+    {
+      title: '提现卡',
+      key: '1',
+      url: '/pages/my-index/wallet/bank-card/index'
+    },
+    { title: '交易记录', key: '2', url: '' },
+    {
+      title: '修改支付密码',
+      key: '3',
+      url: '/pages/my-index/wallet/edit-password'
+    },
+    { title: '实名认证', key: '4', url: '' }
+  ]
+</script>
+
+<template>
+  <view class="wallet">
+    <!-- 顶部样式 -->
+    <view class="top-card">
+      <view class="left-box">
+        <text>我的资产</text>
+        <text>2222</text>
+      </view>
+      <view class="right-box">
+        <button>充值</button>
+        <button>提现</button>
+      </view>
+    </view>
+
+    <view
+      v-for="(item, index) in itemList"
+      :key="index"
+      class="public-card"
+      @click="item.url && navigateTo(item.url)"
+    >
+      <view class="left-box">
+        <text>{{ item.title }}</text>
+      </view>
+      <view class="right-box">
+        <uni-icons type="right" size="16" color="#999999"></uni-icons>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  @import '../styles/index.scss';
+  .wallet {
+    padding: 32rpx 24rpx;
+  }
+
+  .top-card {
+    padding: 36rpx;
+    margin-bottom: 48rpx;
+    background: #ff4c54;
+    border-radius: 32rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    position: relative;
+    font-family: PingFang SC, PingFang SC;
+    font-style: normal;
+    text-transform: none;
+    &::after {
+      width: 100%;
+      height: 100%;
+      right: 54rpx;
+      content: '';
+      position: absolute;
+      background: url('/static/images/my-index/wallet-bg.png');
+      background-size: 30%;
+      background-position: center;
+      background-repeat: no-repeat;
+      z-index: 1;
+      pointer-events: none;
+    }
+    .left-box {
+      display: flex;
+      flex-direction: column;
+      text {
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #ffffff;
+        margin-bottom: 8rpx;
+        &:last-child {
+          font-weight: bold;
+          font-size: 64rpx;
+          text-align: left;
+        }
+      }
+    }
+    .right-box {
+      display: flex;
+      align-items: center;
+      button {
+        width: 128rpx;
+        height: 64rpx;
+        line-height: 64rpx;
+        border-radius: 100rpx 100rpx 100rpx 100rpx;
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #ffffff;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        background: transparent;
+        border: 2rpx solid #ffffff;
+        &::after {
+          border: none;
+        }
+        &:last-child {
+          margin-left: 16rpx;
+          background: #ffffff;
+          color: #eb1c26;
+          border: none;
+        }
+      }
+    }
+  }
+</style>
--- a/static/images/discover/bean.png
+++ b/static/images/discover/bean.png
--- a/static/images/discover/calendar.png
+++ b/static/images/discover/calendar.png
--- a/static/images/my-index/wallet-bg.png
+++ b/static/images/my-index/wallet-bg.png
--- a/static/images/my-index/wx.png
+++ b/static/images/my-index/wx.png
--- a/static/images/my-index/zfb.png
+++ b/static/images/my-index/zfb.png
--- a/uni_modules/uni-popup/changelog.md
+++ b/uni_modules/uni-popup/changelog.md
@@ -0,0 +1,102 @@
+## 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 端
--- a/uni_modules/uni-popup/components/uni-popup-dialog/keypress.js
+++ b/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
--- a/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue
+++ b/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>
--- a/uni_modules/uni-popup/components/uni-popup-message/uni-popup-message.vue
+++ b/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>
--- a/uni_modules/uni-popup/components/uni-popup-share/uni-popup-share.vue
+++ b/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>
--- a/uni_modules/uni-popup/components/uni-popup/i18n/en.json
+++ b/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"
+}
--- a/uni_modules/uni-popup/components/uni-popup/i18n/index.js
+++ b/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
+}
--- a/uni_modules/uni-popup/components/uni-popup/i18n/zh-Hans.json
+++ b/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": "分享到"
+}
--- a/uni_modules/uni-popup/components/uni-popup/i18n/zh-Hant.json
+++ b/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": "分享到"
+}
--- a/uni_modules/uni-popup/components/uni-popup/keypress.js
+++ b/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
--- a/uni_modules/uni-popup/components/uni-popup/popup.js
+++ b/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;
+		},
+	}
+}
--- a/uni_modules/uni-popup/components/uni-popup/uni-popup.uvue
+++ b/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) {
+          // console.log("isShow",isShow)
+          if(isShow && this.isOpen == false){
+            this.isOpen = true
+          }
+        },
+        immediate:true
+      },
+      // 设置isOpen = true 时，如果没有 isShow 需要设置为 isShow
+      isOpen:{
+        handler(isOpen) {
+          // 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>
--- a/uni_modules/uni-popup/components/uni-popup/uni-popup.vue
+++ b/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>
--- a/uni_modules/uni-popup/package.json
+++ b/uni_modules/uni-popup/package.json
@@ -0,0 +1,107 @@
+{
+  "id": "uni-popup",
+  "displayName": "uni-popup 弹出层",
+  "version": "1.9.11",
+  "description": " Popup 组件，提供常用的弹层",
+  "keywords": [
+    "uni-ui",
+    "弹出层",
+    "弹窗",
+    "popup",
+    "弹框"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": "",
+    "uni-app": "^4.07",
+    "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",
+      "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": "-"
+          },
+          "quickapp": {
+            "huawei": "-",
+            "union": "-"
+          }
+        },
+        "uni-app-x": {
+          "web": {
+            "safari": "√",
+            "chrome": "√"
+          },
+          "app": {
+            "android": "√",
+            "ios": "√",
+            "harmony": "√"
+          },
+          "mp": {
+            "weixin": "√"
+          }
+        }
+      }
+    }
+  }
+}
--- a/uni_modules/uni-popup/readme.md
+++ b/uni_modules/uni-popup/readme.md
@@ -0,0 +1,17 @@
+
+
+## Popup 弹出层
+> **组件名：uni-popup**
+> 代码块： `uPopup`
+> 关联组件：`uni-transition`
+
+
+弹出层组件，在应用中弹出一个消息提示窗口、提示框等
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-popup)
+#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839 
+
+
+
+
+
--- a/uni_modules/uni-transition/changelog.md
+++ b/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 目录规范
--- a/uni_modules/uni-transition/components/uni-transition/createAnimation.js
+++ b/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)
+}
--- a/uni_modules/uni-transition/components/uni-transition/uni-transition.vue
+++ b/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>
--- a/uni_modules/uni-transition/package.json
+++ b/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": "-"
+          }
+        }
+      }
+    }
+  }
+}
--- a/uni_modules/uni-transition/readme.md
+++ b/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 
--- a/utils/validate.js
+++ b/utils/validate.js
@@ -12,6 +12,9 @@ const ID_CARD_REGEX = /(^\d{15}$)|(^\d{18}$)|(^\d{17}[\dXx]$)/
 /** 密码强度（至少8位，包含数字和字母） */
 const PASSWORD_REGEX = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d@$!%*#?&]{8,}$/

+/** 交易密码（6–20 位，必须包含数字 + 字母（大小写均可）） */
+const TRANSACTION_PASSWORD_REGEX = /^(?=.*\d)(?=.*[a-zA-Z]).{6,20}$/
+
 /**
 * 校验手机号
 * @param {string} phone - 待校验的手机号
@@ -82,3 +85,20 @@ export const validateIdCard = idCard => {
  }
  return { valid: true, message: '' }
 }
+
+/**
+ * 校验交易密码
+ * @param {string} password - 待校验的密码
+ * @returns {{ valid: boolean, message: string }}
+ */
+
+export const validateTransactionPassword = (password, name = '密码') => {
+  if (!password) return { valid: false, message: `${name}不能为空` }
+  if (password.length < 6) {
+    return { valid: false, message: `${name}长度不能少于6位` }
+  }
+  if (!TRANSACTION_PASSWORD_REGEX.test(password)) {
+    return { valid: false, message: `${name}需包含字母和数字` }
+  }
+  return { valid: true, message: '' }
+}