diff --git a/.gitignore b/.gitignore
index c13f13b..23abc22 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,7 @@
 
+unpackage
+dist
+node_modules
 node_modules/**/* 
  unpackage/ 
  unpackage/**/* 
diff --git a/.hbuilderx/launch.json b/.hbuilderx/launch.json
new file mode 100644
index 0000000..582561b
--- /dev/null
+++ b/.hbuilderx/launch.json
@@ -0,0 +1,16 @@
+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"app-plus" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}
diff --git a/App.vue b/App.vue
index 6d5f849..2e1968a 100644
--- a/App.vue
+++ b/App.vue
@@ -24,8 +24,8 @@ export default {
 /deep/body {
 	// max-width: 828rpx; //最大宽度自己可以调整
 	// margin: auto !important;
-	background: url(./static/public/BG.png) no-repeat fixed;
-	background-size: cover;
+
+	background-color: #15141F;
 	height: auto;
 	margin: 0;
 }
diff --git a/components/KeyValueRow/KeyValueRow.vue b/components/KeyValueRow/KeyValueRow.vue
new file mode 100644
index 0000000..592e824
--- /dev/null
+++ b/components/KeyValueRow/KeyValueRow.vue
@@ -0,0 +1,92 @@
+<template>
+    <view class="KeyValueRow">
+        <u--text class="keyName" :text="keyName" :mode="mode" :lines="lines" :color='leftColor' :size="size">
+        </u--text>
+        <u--text class="value" :text="value" :mode="mode" :lines="lines" :color='rightColor' :size="size">
+        </u--text>
+    </view>
+</template>
+
+<script>
+export default {
+    name: 'KeyValueRow',
+    props: {
+        keyName: {
+            type: String | Number,
+            default() {
+                return ''
+            }
+        },
+        value: {
+            type: String | Number,
+            default() {
+                return ''
+            }
+        },
+        leftColor: {
+            type: String | Number,
+            default() {
+                return '#A1A0A8'
+            }
+        },
+        rightColor: {
+            type: String | Number,
+            default() {
+                return '#fff'
+            }
+        },
+        size: {
+            type: String | Number,
+            default() {
+                return '28rpx'
+            }
+        },
+
+        /**
+         * date 日期格式化 , name姓名脱敏 张*三, price 显示金额 
+         */
+        mode: {
+            type: String,
+            default() {
+                return ''
+            }
+        },
+        /**
+         * 超出隐藏
+         */
+        lines: {
+            type: String | Number,
+            default() {
+                return '1'
+            }
+        },
+    },
+    data() {
+        return {
+        }
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.KeyValueRow {
+    box-sizing: border-box;
+    margin-bottom: 10rpx;
+    position: relative;
+
+    .keyName {
+        height: 100%;
+        width: auto;
+        display: inline-block;
+    }
+
+    .value {
+        position: absolute;
+        right: 0;
+        height: 100%;
+        width: auto;
+        display: inline-block;
+        text-align: right;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/components/cardHeader/cardHeader.vue b/components/cardHeader/cardHeader.vue
new file mode 100644
index 0000000..0be8e76
--- /dev/null
+++ b/components/cardHeader/cardHeader.vue
@@ -0,0 +1,111 @@
+<template>
+    <view class="cardHeader">
+        <view class="icon">
+            <u-icon :name="iconName" size="40rpx" width="40rpx"></u-icon>
+        </view>
+        <view class="title">{{ title }}</view>
+        <view class="button" :style="{
+            textAlign: hasBtn ? 'center' : 'right',
+            backgroundColor: hasBtn ? btnColor : '#211F32',
+            paddingRight: hasBtn ? 0 : '12rpx',
+            color: fontColor,
+        }">{{ rightName }}</view>
+    </view>
+</template>
+
+<script>
+export default {
+    name: 'cardHeader',
+    props: {
+        iconName: {
+            type: String,
+            default() {
+                return '@/static/maskets/bye.png'
+            }
+        },
+        title: {
+            type: String | Number,
+            default() {
+                return ''
+            }
+        },
+        rightName: {
+            type: String | Number,
+            default() {
+                return ''
+            }
+        },
+        fontColor: {
+            type: String | Boolean,
+            default() {
+                return '#15141F'
+            }
+        },
+        hasBtn: {
+            type: Boolean,
+            default() {
+                return false
+            }
+        },
+        btnColor: {
+            type: String | Number,
+            default() {
+                return '#211F32'
+            }
+        },
+    },
+    data() {
+        return {
+            leftColor: '#A1A0A8',
+            rightColor: '#fff',
+        }
+    }
+
+}
+</script>
+
+<style lang="scss" scoped>
+.cardHeader {
+    overflow: hidden;
+    position: relative;
+    box-sizing: border-box;
+    height: 104rpx;
+    border-bottom: 2rpx solid #323045;
+    padding: 20rpx;
+
+    .icon {
+        vertical-align: top;
+        overflow: hidden;
+        display: inline-block;
+        box-sizing: border-box;
+        width: 64rpx;
+        height: 64rpx;
+        background: #323045;
+        border-radius: 20rpx;
+        padding: 12rpx;
+    }
+
+    .title {
+        display: inline-block;
+        width: 180rpx;
+        height: 100%;
+        line-height: 64rpx;
+        font-size: 28rpx;
+        margin-left: 16rpx;
+    }
+
+    .button {
+        position: absolute;
+        right: 20rpx;
+        display: inline-block;
+        width: 202rpx;
+        height: 64rpx;
+        border-radius: 16rpx;
+        line-height: 64rpx;
+        background-color: $mainColor;
+        font-size: 28rpx;
+        text-align: center;
+        color: #15141F;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/components/navigation/navigation.vue b/components/navigation/navigation.vue
index 959cc17..21c790b 100644
--- a/components/navigation/navigation.vue
+++ b/components/navigation/navigation.vue
@@ -1,5 +1,5 @@
 <template>
-	<view class="nav-head">
+	<view class="nav-head" :class="{'tp':bgTransparent}">
 		<image src="../../static/public/back.png" mode="aspectFit" class="back" @tap="back()" v-if="showBack"></image>
 		<slot name="left"></slot>
 		<slot></slot>
@@ -13,12 +13,18 @@ const COMPONENT_NAME = 'navigation'
 export default {
 	name: COMPONENT_NAME,
 	props: {
-		showBack: {
+		showBack: { // 是否显示返回按钮
 			type: Boolean,
 			default() {
 				return true
 			}
 		},
+		bgTransparent: { // 背景是否透明
+			type: Boolean,
+			default() {
+				return false
+			}
+		},
 		bgnum: {
 			type: Boolean,
 			default() {
@@ -62,7 +68,7 @@ export default {
 
 .nav-head {
 	overflow: hidden;
-	position: relative;
+	position: fixed;
 	top: 0rpx;
 	height: 112rpx;
 	// background-color: #fafafa;
@@ -72,14 +78,19 @@ export default {
 	font-size: 36rpx;
 	color: #fff;
 	// padding: 40rpx 16rpx;
-	margin-top: 88rpx;
+	padding-top: 88rpx;
 	display: flex;
 	justify-content: center;
 	align-items: center;
 	width: 100%;
+	background-color: #15141F;
 	z-index: 8;
 	border-bottom: 4rpx solid #323045;
 
+	&.tp {
+		background-color: transparent;
+		border: none;
+	}
 }
 
 .back {
@@ -87,7 +98,5 @@ export default {
 	height: 80rpx;
 	position: absolute;
 	left: 36rpx;
-	top: 50%;
-	transform: translateY(-50%);
 }
 </style>
diff --git a/components/tabBar/tabBar.vue b/components/tabBar/tabBar.vue
index 8375a02..80b139a 100644
--- a/components/tabBar/tabBar.vue
+++ b/components/tabBar/tabBar.vue
@@ -15,7 +15,7 @@
 			<view class="tabbar_item" @click="goToPage(2)">
 				<view class="uni-tabbar_bd">
 					<view class="uni-tabbar_icon">
-						<image :src="`/static/tabBar/${selectActive == 1 ? 'ic_charity_pr' : 'ic_charity_de'}.png`"
+						<image :src="`/static/tabBar/${selectActive == 2 ? 'ic_chart_pr' : 'ic_chart_de'}.png`"
 							mode="aspectFit" class="img1"></image>
 					</view>
 					<view class="uni-tabbar_label" :class="['text', selectActive == 2 ? 'active' : '']">
@@ -26,7 +26,7 @@
 			<view class="tabbar_item" @click="goToPage(3)">
 				<view class="uni-tabbar_bd">
 					<view class="uni-tabbar_icon">
-						<image :src="`/static/tabBar/${selectActive == 1 ? 'ic_chart_pr' : 'ic_chart_de'}.png`"
+						<image :src="`/static/tabBar/${selectActive == 3 ? 'ic_charity_pr' : 'ic_charity_de'}.png`"
 							mode="aspectFit" class="img1"></image>
 					</view>
 					<view class="uni-tabbar_label" :class="['text', selectActive == 3 ? 'active' : '']">
@@ -37,7 +37,7 @@
 			<view class="tabbar_item" @click="goToPage(4)">
 				<view class="uni-tabbar_bd">
 					<view class="uni-tabbar_icon">
-						<image :src="`/static/tabBar/${selectActive == 1 ? 'ic_home_pr' : 'ic_home_de'}.png`"
+						<image :src="`/static/tabBar/${selectActive == 4 ? 'ic_subscription_pr' : 'ic_subscription_de'}.png`"
 							mode="aspectFit" class="img1"></image>
 					</view>
 					<view class="uni-tabbar_label" :class="['text', selectActive == 4 ? 'active' : '']">
@@ -48,7 +48,7 @@
 			<view class="tabbar_item" @click="goToPage(5)">
 				<view class="uni-tabbar_bd">
 					<view class="uni-tabbar_icon">
-						<image :src="`/static/tabBar/${selectActive == 1 ? 'ic_me_pr' : 'ic_me_de'}.png`"
+						<image :src="`/static/tabBar/${selectActive == 5 ? 'ic_me_pr' : 'ic_me_de'}.png`"
 							mode="aspectFit" class="img1"></image>
 					</view>
 					<view class="uni-tabbar_label" :class="['text', selectActive == 5 ? 'active' : '']">
@@ -111,7 +111,7 @@ export default {
 					break;
 			}
 			uni.reLaunch({
-				url: '/pages/menu/profile/index'
+				url,
 			})
 
 		}
@@ -163,6 +163,10 @@ export default {
 	cursor: pointer;
 }
 
+.index-header {
+	z-index: 8;
+}
+
 
 .con {
 	width: 100%;
@@ -173,7 +177,7 @@ export default {
 	left: 0;
 	padding-top: 22rpx;
 	display: flex;
-	z-index: 998;
+	z-index: 8;
 	box-sizing: border-box;
 
 	&::after {
diff --git a/package-lock.json b/package-lock.json
index 7c02663..9533a0e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -78,6 +78,15 @@
       "resolved": "https://registry.npmmirror.com/delayed-stream/-/delayed-stream-1.0.0.tgz",
       "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ=="
     },
+    "echarts": {
+      "version": "5.3.3",
+      "resolved": "https://registry.npmmirror.com/echarts/-/echarts-5.3.3.tgz",
+      "integrity": "sha512-BRw2serInRwO5SIwRviZ6Xgm5Lb7irgz+sLiFMmy/HOaf4SQ+7oYqxKzRHAKp4xHQ05AuHw1xvoQWJjDQq/FGw==",
+      "requires": {
+        "tslib": "2.3.0",
+        "zrender": "5.3.2"
+      }
+    },
     "follow-redirects": {
       "version": "1.15.1",
       "resolved": "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.1.tgz",
@@ -116,6 +125,11 @@
       "resolved": "https://registry.npmmirror.com/source-map/-/source-map-0.6.1.tgz",
       "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
     },
+    "tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
+    },
     "uview-ui": {
       "version": "2.0.33",
       "resolved": "https://registry.npmmirror.com/uview-ui/-/uview-ui-2.0.33.tgz",
@@ -131,6 +145,14 @@
         "@intlify/vue-devtools": "9.2.2",
         "@vue/devtools-api": "^6.2.1"
       }
+    },
+    "zrender": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmmirror.com/zrender/-/zrender-5.3.2.tgz",
+      "integrity": "sha512-8IiYdfwHj2rx0UeIGZGGU4WEVSDEdeVCaIg/fomejg1Xu6OifAL1GVzIPHg2D+MyUkbNgPWji90t0a8IDk+39w==",
+      "requires": {
+        "tslib": "2.3.0"
+      }
     }
   }
 }
diff --git a/package.json b/package.json
index a8c8d62..f062dfe 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
   "license": "ISC",
   "dependencies": {
     "axios": "^0.27.2",
+    "echarts": "^5.3.3",
     "js-md5": "^0.7.3",
     "uview-ui": "^2.0.33",
     "vue-i18n": "^9.2.2"
diff --git a/pages.json b/pages.json
index 34075ab..1a30061 100644
--- a/pages.json
+++ b/pages.json
@@ -9,9 +9,7 @@
 				"navigationStyle": "custom"
 			}
 		},
-
-
-		
+		// 登陆部分
 		{
 			"path": "pages/login/index",
 			"style": {
@@ -31,11 +29,57 @@
 				"navigationStyle": "custom"
 			}
 		},
+
+		// 首页部分
 		{
 			"path": "pages/index/index",
 			"style": {
 				"navigationStyle": "custom"
 			}
+		},
+
+		// markets
+		{
+			"path": "pages/markets/index",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
+
+		// charity 
+		{
+			"path": "pages/charity/index",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/charity/details",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
+
+		//subscription
+		{
+			"path": "pages/subscription/index",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/subscription/details",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
+
+		// me
+		{
+			"path": "pages/me/index",
+			"style": {
+				"navigationStyle": "custom"
+			}
 		}
 
 	],
diff --git a/pages/charity/details.vue b/pages/charity/details.vue
new file mode 100644
index 0000000..04587e5
--- /dev/null
+++ b/pages/charity/details.vue
@@ -0,0 +1,419 @@
+<template>
+    <view class="main">
+        <!-- nav -->
+        <navigation :bgTransparent=true>{{ i18n.CharityDetails }}</navigation>
+        <view class="body">
+            <view class="titleBody">
+                <!-- 海报 -->
+                <u--image class="img" :showLoading="true" src="../../static/charity/Rectangle 2.png" width="750rpx"
+                    height="762rpx"></u--image>
+                <!-- 文章标题 -->
+                <view class="title">New Balance Raff Simons Bright </view>
+            </view>
+
+            <view class="contentBody">
+                <view class="about">{{ i18n.About }}</view>
+                <!-- 文字内容 -->
+                <view class="content">Minimum deposit amount: 10 USDT. Deposit less than the minimum amount will not be
+                    posted
+                    and cannot be returned
+                    This address is your latest deposit address. When the system receives deposit, it will be
+                    automatically
+                    credited to the account。The transfer needs to be confirmed by the entire blockchain network. When it
+                    reaches 10 network confirmations, your USDT will be automatically deposit into the account。
+                    Minimum deposit amount: 10 USDT. Deposit less than the minimum amount will not be posted and cannot
+                    be
+                    returned
+                    This address is your latest deposit address. When the system receives deposit, it will be
+                    automatically
+                    credited to the account。The transfer needs to be confirmed by the entire blockchain network. When it
+                    reaches 10 network confirmations, your USDT will be automatically deposit into the account。Minimum
+                    deposit amount: 10 USDT. Deposit less than the minimum amount will not be posted and cannot be
+                    returned
+                    This address is your latest deposit address. When the </view>
+                <!-- 捐赠详情 -->
+                <view class="Participants">
+                    <view class="title">{{ i18n.Participants }}</view>
+                    <!-- 进度条 -->
+                    <u-line-progress class="progressbar" :showText="false" :percentage="50" activeColor="#00E8A2"
+                        height="32rpx">
+                    </u-line-progress>
+                    <!-- 百分比 -->
+                    <view class="progress">50%</view>
+                    <!-- 捐赠用户头像 -->
+                    <view class="userIconList">
+                        <u--image v-for="(item, index) in 10" :key="index" class="userIcon" :showLoading="true"
+                            src="../../static/charity/Ellipse 502.png" width="64rpx" height="64rpx"></u--image>
+                    </view>
+
+                </view>
+                <!-- 按钮 -->
+                <u-button class="button" color="#00E8A2" throttleTime="500" @click="DonatePopupShow = true">{{
+                        i18n.DonateNow
+                }}
+                </u-button>
+
+                <!-- DonateNow按钮通知弹出层 -->
+                <u-popup class="DonatePopup" :show="DonatePopupShow" round="40rpx" mode="bottom"
+                    @close="DonatePopupShow = false" @open="DonatePopupShow = true" bgColor="#211F32">
+                    <view class="content">
+                        <view class="close" @click="DonatePopupShow = false"></view>
+                        <u--form class="form" :model="coinInfo" :rules="rules" ref="form1" errorType="toast">
+                            <!-- coin选择框 -->
+                            <u-form-item class="input-item" prop="verificationCode" ref="item1">
+                                <u-input class="input" v-model="coinInfo.verificationCode" color="#fff" fontSize="32rpx"
+                                    border="none" :placeholder="i18n.PleaseChooseCoin">
+                                </u-input>
+                                <view class="selectCoinBtn" @click="USDTPopupShow = true">USDT
+                                </view>
+                            </u-form-item>
+                            <view class="Available">{{ i18n.AvailableBlance }}:0USDT</view>
+                            <!-- 数量 -->
+                            <u-form-item class="input-item" prop="number" ref="item1">
+                                <u-input class="input" v-model="coinInfo.number" color="#fff" fontSize="32rpx"
+                                    border="none" :placeholder="i18n.Quantity">
+                                </u-input>
+                            </u-form-item>
+                            <!-- 密码 -->
+                            <u-form-item class="input-item" prop="password" ref="item1">
+                                <u-input class="input" v-model="coinInfo.password" color="#fff" fontSize="32rpx"
+                                    border="none" :placeholder="i18n.WithdrawalPassword">
+                                </u-input>
+                            </u-form-item>
+
+                        </u--form>
+                        <u-button class="button" color="#00E8A2" throttleTime="500" :disabled="DonatePopupDisabled"
+                            @click="DonatePopupShow = false">{{ i18n.DonateNow }}
+                        </u-button>
+                    </view>
+                </u-popup>
+
+                <!-- USDT按钮通知弹出层 -->
+
+                <u-popup class="USDTPopup" :show="USDTPopupShow" round="40rpx" mode="bottom"
+                    @close="USDTPopupShow = false" @open="USDTPopupShow = true" bgColor="#211F32">
+                    <view class="content">
+                        <view class="close" @click="USDTPopupShow = false"></view>
+                        <scroll-view scroll-y="true" style="height: 580rpx;" scroll-with-animation="true"
+                            @touchmove.stop>
+                            <radio-group class="radioGroup" @change="radioChange" v-model="radioValue">
+                                <label class="checkBox" v-for="(item, index) in 40" :key="index">
+                                    <view class="icon">
+                                        <u-icon name="../../static/maskets/bye.png" size="52rpx" width="52rpx"></u-icon>
+                                    </view>
+                                    <view class="iconName">
+                                        <view class="top">USDT</view>
+                                        <view class="bottom">BTC</view>
+                                    </view>
+
+                                    <radio color="#00E8A2" shape="square"></radio>
+                                </label>
+
+                            </radio-group>
+                        </scroll-view>
+
+                        <u-button class="button" color="#00E8A2" throttleTime="500" @click="USDTPopupShow = false">OK
+                        </u-button>
+                    </view>
+                </u-popup>
+
+
+            </view>
+
+        </view>
+
+
+    </view>
+</template>
+
+<script>
+import UButton from '../../uview-ui/components/u-button/u-button'
+export default {
+    name: "charityDetails",
+    data() {
+        return {
+            DonatePopupShow: false,
+            USDTPopupShow: false,
+            DonatePopupDisabled: true,
+            coinInfo: {},
+            rules: {},
+            radioValue: '',
+        };
+    },
+    computed: {
+        i18n() {
+            return this.$t("charity");
+        },
+    },
+    onLoad() {
+        // console.log(this.$t('login.emailInputMessage'));
+    },
+    onShow() { },
+    methods: {
+        radioChange(e) {
+            // console.log(e);
+        }
+    },
+    components: { UButton }
+}
+</script>
+
+<style lang="scss" scoped>
+.main {
+
+    .body {
+        overflow: hidden;
+
+        .titleBody {
+            position: relative;
+            height: 762rpx;
+
+            .title {
+                position: absolute;
+                bottom: 48rpx;
+                font-size: 40rpx;
+                font-weight: 800;
+                z-index: 20;
+                margin: 0 48rpx;
+            }
+        }
+
+        .contentBody {
+            padding: 0 48rpx;
+
+            .about {
+                margin: 32rpx 0;
+                font-size: 32rpx;
+                color: #A2A0A8;
+            }
+
+            .content {
+                font-size: 24rpx;
+                color: #A1A0A8;
+                margin-bottom: 48rpx;
+            }
+
+            .Participants {
+                background: #211F32;
+                border-radius: 32rpx;
+                padding: 32rpx;
+
+                .title {
+                    font-size: 28rpx;
+                    height: 40rpx;
+                    line-height: 40rpx;
+                    margin-bottom: 20rpx;
+                    color: #A1A0A8;
+                }
+
+                // .progressBody{
+                .progressbar {
+                    vertical-align: top;
+                    display: inline-block;
+                    width: 426rpx;
+                    margin: 8rpx 0;
+                }
+
+                .progress {
+                    margin-left: 20rpx;
+                    display: inline-block;
+                    width: 144rpx;
+                    height: 48rpx;
+                    line-height: 48rpx;
+                    font-size: 32rpx;
+                }
+
+
+                .userIconList {
+                    height: 104rpx;
+
+                    .userIcon {
+                        overflow: hidden;
+                        border-radius: 64rpx;
+                        display: inline-block;
+                        margin-left: -20rpx;
+                        margin-top: 34rpx;
+
+                        &:first-child {
+                            margin-left: 0;
+                        }
+
+                    }
+                }
+
+
+            }
+
+            .button {
+                margin-top: 64rpx;
+                margin-bottom: 120rpx;
+                height: 112rpx;
+                line-height: 112rpx;
+                border-radius: 32rpx;
+                font-size: 32rpx;
+                color: #15141F !important;
+            }
+
+            .DonatePopup {
+                .content {
+                    height: 844rpx;
+
+                    /deep/.u-button--disabled {
+                        background-color: #A1A0A8 !important;
+                        border-color: #A1A0A8 !important;
+                    }
+
+                    .close {
+                        margin: 48rpx 346rpx;
+                        width: 58rpx;
+                        height: 20rpx;
+                        background-image: url(../../static/charity/Turn.png);
+                        background-repeat: no-repeat;
+                        background-size: 58rpx 20rpx;
+                    }
+
+                    .form {
+                        font-size: 32rpx;
+                        margin: 0 32rpx;
+
+                        .Available {
+                            height: 44rpx;
+                            margin: 32rpx 0;
+                            font-size: 28rpx;
+                        }
+
+                        .input-item {
+                            overflow: hidden;
+                            height: 124rpx;
+                            line-height: 124rpx;
+                            background: #323045;
+                            margin-bottom: 48rpx;
+                            border-radius: 32rpx;
+                            padding: 0 40rpx;
+
+                            /deep/.u-form-item__body {
+                                padding: 0;
+                            }
+
+                            .input {
+                                height: 124rpx;
+                            }
+
+                            .selectCoinBtn {
+                                position: relative;
+                                width: 150rpx;
+                                height: 54rpx;
+                                right: 0rpx;
+                                line-height: 56rpx;
+                                font-size: 36rpx;
+                                padding: 0;
+                                color: #fff;
+
+                                &::after {
+                                    display: block;
+                                    position: absolute;
+                                    content: '';
+                                    background-image: url(../../static/charity/ic_ma_arrow_down.png);
+                                    background-repeat: no-repeat;
+                                    background-size: 32rpx;
+                                    width: 32rpx;
+                                    height: 32rpx;
+                                    top: 12rpx;
+                                    right: 10rpx;
+                                }
+                            }
+                        }
+                    }
+
+                    .button {
+                        width: 654rpx;
+                        margin: 0 48rpx;
+                    }
+
+                }
+
+            }
+
+            .USDTPopup {
+                .content {
+                    height: 844rpx;
+
+                    .close {
+                        margin: 48rpx 346rpx;
+                        width: 58rpx;
+                        height: 20rpx;
+                        background-image: url(../../static/charity/Turn.png);
+                        background-repeat: no-repeat;
+                        background-size: 58rpx 20rpx;
+                    }
+
+                    .radioGroup {
+                        height: 580rpx;
+
+                        .checkBox {
+                            height: 84rpx;
+                            width: 670rpx;
+                            display: flex;
+                            align-items: center;
+                            margin: 0 40rpx 32rpx;
+
+                            .icon {
+                                width: 84rpx;
+                                height: 84rpx;
+                                border-radius: 20rpx;
+                                overflow: hidden;
+                                display: inline-block;
+                                box-sizing: border-box;
+                                background: #323045;
+                                padding: 16rpx;
+                                margin-right: 20rpx;
+                            }
+
+                            .iconName {
+                                width: 520rpx;
+
+                                .top {
+                                    font-size: 32rpx;
+                                    color: #fff;
+                                }
+
+
+                                .bottom {
+                                    font-size: 24rpx;
+                                    color: #A1A0A8;
+                                }
+
+
+                            }
+
+                            /deep/.uni-radio-input {
+                                width: 48rpx;
+                                height: 48rpx;
+                                border-radius: 16rpx;
+                                background: #323045;
+                            }
+
+                            /deep/.uni-radio-input-checked::before {
+                                font-size: 36rpx;
+                            }
+                        }
+
+                    }
+
+                    .button {
+                        width: 654rpx;
+                        margin: 40rpx 48rpx;
+                    }
+
+                }
+
+            }
+        }
+
+
+
+
+    }
+
+}
+</style>
diff --git a/pages/charity/index.vue b/pages/charity/index.vue
new file mode 100644
index 0000000..0d8da85
--- /dev/null
+++ b/pages/charity/index.vue
@@ -0,0 +1,118 @@
+<template>
+    <view class="main">
+        <!-- 列表 -->
+        <view class="charityList">
+            <view class="item" v-for="(item, index) in 10" :key="index" @click="goto(index)">
+                <u--image class="img" :showLoading="true" src="../../static/charity/Rectangle 2.png" width="318rpx"
+                    height="230rpx"></u--image>
+                <view class="title">New Balance Raff Simons Bright Bright </view>
+                <view class="target">Target: $1309348</view>
+                <u-line-progress class="progressbar" :showText="(index * 10) > 18" :percentage="index * 10"
+                    activeColor="#00E8A2" height="22rpx">
+                </u-line-progress>
+            </view>
+        </view>
+        <!-- tabBar -->
+        <tab-bar :selectActive="3"></tab-bar>
+    </view>
+</template>
+
+<script>
+export default {
+    name: 'charity',
+    data() {
+        return {
+
+        }
+    },
+    onLoad() {
+
+    },
+    onShow() {
+
+    },
+    onHide() {
+    },
+    computed: {
+        i18n() {
+            return this.$t('markets')
+        }
+    },
+    methods: {
+        goto(index) {
+            uni.navigateTo({
+                url: `/pages/charity/details?id=${index}`
+            });
+        }
+    }
+}
+
+</script>
+
+<style lang="scss" scoped>
+.main {
+    padding-bottom: 198rpx; // 避免底部TabBar盖住内容
+
+    .charityList {
+        // width: 318rpx;
+        margin: 120rpx 38rpx 0 40rpx;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        flex-wrap: wrap;
+
+        .item {
+            position: relative;
+            width: 318rpx;
+            height: 430rpx;
+            box-sizing: border-box;
+            background-color: #323045;
+            border-radius: 20rpx;
+            margin-bottom: 32rpx;
+
+            /deep/.img {
+                overflow: hidden;
+                border-radius: 20rpx;
+            }
+
+            .title {
+                height: 72rpx;
+                line-height: 35rpx;
+                font-size: 32rpx;
+                margin: 24rpx 20rpx 12rpx;
+                // 超出字符省略成...
+                overflow: hidden;
+                text-overflow: ellipsis;
+                display: -webkit-box; //兼容
+                word-wrap: break-word;
+                white-space: normal !important;
+                -webkit-line-clamp: 2; //显示行数
+                -webkit-box-orient: vertical;
+            }
+
+            .target {
+                height: 40rpx;
+                line-height: 40rpx;
+                color: $mainColor;
+                font-size: 26rpx;
+                margin-left: 20rpx;
+            }
+
+            .progressbar {
+                margin: 12rpx 20rpx 0;
+
+                /deep/.u-line-progress__text {
+                    color: #000;
+                    font-size: 16rpx;
+                    transform: scale(0.66) // 字体超过12px以下的需要缩放 8/12 =0.666
+                }
+            }
+
+        }
+    }
+
+
+
+
+}
+</style>
diff --git a/pages/index/index.vue b/pages/index/index.vue
index d57965a..378ee42 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,53 +1,76 @@
 <template>
 	<view class="main">
+		<!-- nav -->
 		<view class="nav-head">
 			<view class="title">{{ i18n.HOME }}</view>
 			<u-button class="button" color="#323045">{{ i18n.customerService }}</u-button>
 		</view>
-
+		<!-- 轮播图 -->
 		<u-swiper class="swiper" :list="swiperList" previousMargin="48rpx" nextMargin="80rpx" circular :autoplay="true"
 			radius="32rpx" bgColor="rgba(0,0,0,0)" height="360rpx"></u-swiper>
-		<view class="message">
+		<!-- 消息 -->
+		<view class="message" @click="popupShow = true">
 			<u-icon class="icon" name="../../static/home/ic_proclamation.png" size="60rpx" width="60rpx"></u-icon>
 			<view class="text">{{ i18n.homeMessage }}</view>
 		</view>
+		<!-- 三个按钮 -->
 		<view class="btnDiv">
 			<view class="item">
 				<u--image class="img" :showLoading="true" src="../../static/home/img_recharge.png" width="144rpx"
-					height="144rpx" @click="click"></u--image>
+					height="144rpx"></u--image>
 				<view class="text">{{ i18n.Recharge }}</view>
 			</view>
 			<view class="item">
 				<u--image class="img" :showLoading="true" src="../../static/home/img_Mine.png" width="144rpx"
-					height="144rpx" @click="click"></u--image>
+					height="144rpx"></u--image>
 				<view class="text">{{ i18n.Mine }}</view>
 			</view>
 			<view class="item">
 				<u--image class="img" :showLoading="true" src="../../static/home/img_Subcription.png" width="144rpx"
-					height="144rpx" @click="click"></u--image>
+					height="144rpx"></u--image>
 				<view class="text">{{ i18n.Subcription }}</view>
 			</view>
 		</view>
+		<!-- 步数 -->
 		<view class="steps">
 			<view class="content">
 				<view class="title">{{ i18n.TodaySteps }}</view>
+				<canvas id="chart" ref="chart" style="width: 280rpx;height:280rpx; font-size: 40rpx;"></canvas>
 				<u-button class="button" color="#00E8A2">{{ i18n.ReceiveEarnings }}</u-button>
 			</view>
 		</view>
-		<view v-for="(item, index) in videoList" :key="index">
+		<!-- 播放器 -->
+		<view class="videoList" v-for="(item, index) in videoList" :key="index">
 			<video class="video" :id="`video-${index}`" :enable-progress-gesture="false" :src="item.url"
-				:poster="item.poster" :title="item.title" controls @play="stopOtherVideoPlay" :key="index" ></video>
+				:poster="item.poster" :title="item.title" controls @play="stopOtherVideoPlay" :key="index"></video>
 		</view>
+		<!-- 通知弹出层 -->
+		<u-popup class="popup" :show="popupShow" round="32rpx" mode="center" @close="popupShow = false"
+			@open="popupShow = true" bgColor="#211F32" :customStyle="{
+				margin: 'auto 102rpx auto 118rpx',
+			}">
+			<view class="content">
+				<scroll-view scroll-y="true" style="height: 288rpx;" scroll-with-animation="true" @touchmove.stop>
+					{{ i18n.homeMessage }}
+				</scroll-view>
+				<u-button class="button" color="#00E8A2" @click="popupShow = false">OK</u-button>
+			</view>
+		</u-popup>
+		<!-- tabBar -->
 		<tab-bar :selectActive="1"></tab-bar>
 	</view>
 </template>
 
 <script>
+// 引入echarts
+import * as echarts from 'echarts';
+
 let videoPlayerObj = {};
 export default {
 	name: 'home',
 	data() {
 		return {
+			popupShow: false,
 			swiperList: [
 				'https://cdn.uviewui.com/uview/swiper/swiper1.png',
 				'https://cdn.uviewui.com/uview/swiper/swiper2.png',
@@ -75,10 +98,15 @@ export default {
 					poster: 'https://cdn.uviewui.com/uview/swiper/swiper1.png'
 				},
 			],
+			option: null,
+			stepsNum: 5000, // 当前步数
+			stepTarget: 10000,// 目标步数
+			myChart: null,
 		}
 	},
 	onLoad() {
 
+
 	},
 	onShow() {
 		// 生成播放器队列对象
@@ -86,6 +114,11 @@ export default {
 			const VideoPlayer = uni.createVideoContext(`video-${index}`, this)
 			videoPlayerObj[`video-${index}`] = VideoPlayer
 		});
+
+		this.$nextTick(() => {
+			this.initChart()
+		})
+
 	},
 	onHide() {
 		this.stopAllVideoPlay()
@@ -118,26 +151,106 @@ export default {
 				videoPlayerObj[item].pause()
 			});
 		},
+
+		initChart() {
+			// let myChart = echarts.init(this.$refs.chart);
+			// console.log(document);
+			// console.log(this.$refs.chart);
+			this.myChart = echarts.init(document.getElementById('chart'));
+			// this.myChart = echarts.init(this.$refs.chart);
+
+			this.option = {
+				title: {
+					text: this.stepsNum,
+					// 副标题
+					subtext: "",
+					// 主副标题间距
+					itemGap: 0,
+					left: 'center',
+					top: 'center',
+					// 主标题样式
+					textStyle: {
+						fontSize: '20',
+						color: '#fff'
+					},
+				},
+				series: [{
+					name: '环形饼图',
+					type: 'pie',
+					radius: ['48%', '70%'],
+					avoidLabelOverlap: false,
+					label: {
+						show: false,
+						position: 'center'
+					},
+					itemStyle: {
+						// 设置扇形的阴影
+						shadowBlur: 30,
+						shadowColor: '#15141F',
+						shadowOffsetX: 'center',
+						shadowOffsetY: 'center'
+
+					},
+					data: [{
+						value: +this.stepsNum / this.stepTarget
+						,
+						name: '步数',
+						itemStyle: {
+							color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+								offset: .2,
+								color: '#47BDFF'
+							}, {
+								offset: .5,
+								color: '#34AEFF'
+							}, {
+								offset: 1,
+								color: '#0589FF'
+							}
+							]),
+							borderRadius: 800,
+
+
+						}
+					},
+					{
+						value: (this.stepTarget - this.stepsNum) / this.stepTarget,
+						name: '剩余步数',
+						itemStyle: {
+							color: '#15141F',
+
+						}
+					}
+					]
+				}]
+			}
+
+			this.myChart.setOption(this.option, true);
+
+			window.addEventListener('resize', () => {
+				this.myChart.resize();
+			});
+		}
 	}
 }
+
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .main {
+	padding-bottom: 198rpx; // 避免底部TabBar盖住内容
+
 	.nav-head {
 		overflow: hidden;
-		position: relative;
+		position: fixed;
 		top: 0rpx;
 		height: 112rpx;
-		// text-align: center;
-		font-weight: 700;
 		font-size: 36rpx;
 		color: #fff;
-		margin-top: 88rpx;
+		padding-top: 88rpx;
 		display: flex;
-		// justify-content: space-between;
 		align-items: center;
 		width: 100%;
+		background-color: #15141F;
 		z-index: 8;
 		border-bottom: 4rpx solid #323045;
 
@@ -158,33 +271,37 @@ export default {
 	}
 
 	.swiper {
-		margin-top: 32rpx;
+		margin-top: 236rpx;
 	}
 
 	.message {
+		position: relative;
 		margin: 24rpx 24rpx 32rpx;
 		height: 96rpx;
 		background: #211F32;
 		border-radius: 16rpx;
 
 		.icon {
-			display: inline-block;
-			vertical-align: top;
-			margin: 18rpx 20rpx;
+			position: absolute;
+			top: 18rpx;
+			left: 20rpx;
 		}
 
 		.text {
-			display: inline-block;
-			margin-top: 18rpx;
+			position: absolute;
+			top: 18rpx;
+			left: 92rpx;
 			height: 68rpx;
+			line-height: 32rpx;
 			width: 574rpx;
 			font-size: 24rpx;
+			// 超出字符省略成...
 			overflow: hidden;
 			text-overflow: ellipsis;
 			word-wrap: break-word;
+			display: -webkit-box; //兼容
 			white-space: normal !important;
-			//显示4行
-			-webkit-line-clamp: 2;
+			-webkit-line-clamp: 2; //显示行数
 			-webkit-box-orient: vertical;
 		}
 	}
@@ -217,7 +334,7 @@ export default {
 			margin-left: 246rpx;
 			height: 100%;
 			display: flex;
-			justify-content: space-around;
+			justify-content: space-evenly;
 			align-items: center;
 
 			flex-direction: column;
@@ -228,6 +345,11 @@ export default {
 				line-height: 64rpx;
 			}
 
+			.chart {
+				width: 180rpx;
+				height: 180rpx;
+			}
+
 			.button {
 				width: 386rpx;
 				height: 60rpx;
@@ -241,11 +363,50 @@ export default {
 		}
 	}
 
-	.video {
-		margin: 32rpx 32rpx 0;
-		width: 686rpx;
-		height: 360rpx;
-		border-radius: 32rpx;
+	.videoList {
+		z-index: 1;
+
+		.video {
+			margin: 32rpx 32rpx 0;
+			width: 686rpx;
+			height: 360rpx;
+			border-radius: 32rpx;
+		}
+	}
+
+
+	.popup {
+
+		.content {
+			padding: 60rpx 48rpx;
+
+			&::before {
+				display: block;
+				position: absolute;
+				content: '';
+				background-image: url(../../static/home/img_Speaker.png);
+				background-repeat: no-repeat;
+				background-size: contain;
+				width: 112rpx;
+				height: 112rpx;
+				top: -32rpx;
+				left: -16rpx;
+			}
+
+			.button {
+				width: 386rpx;
+				height: 60rpx;
+				line-height: 60rpx;
+				border-radius: 40rpx;
+				font-size: 24rpx;
+				color: #15141F !important;
+				padding: 0;
+				margin: 20rpx auto 0;
+			}
+		}
+
+
+
 	}
 
 }
diff --git a/pages/login/forget.vue b/pages/login/forget.vue
index caddd38..b815136 100644
--- a/pages/login/forget.vue
+++ b/pages/login/forget.vue
@@ -97,10 +97,11 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .main {
 
     .body {
+        margin-top: 204rpx;
         padding: 0 64rpx;
         overflow: hidden;
 
diff --git a/pages/login/index.vue b/pages/login/index.vue
index 61ae08f..d40a7a0 100644
--- a/pages/login/index.vue
+++ b/pages/login/index.vue
@@ -22,7 +22,9 @@
         </u--form>
         <navigator class="forget" url="./forget">{{ i18n.forgotText }}</navigator>
         <u-button class="button" color="#00E8A2">{{ i18n.Login }}</u-button>
-        <view class="signUp">{{ i18n.notAccountText }}<navigator class="navigator" url="./register">{{ i18n.SignUp }}</navigator></view>
+        <view class="signUp">{{ i18n.notAccountText }}<navigator class="navigator" url="./register">{{ i18n.SignUp }}
+            </navigator>
+        </view>
 
     </view>
 </template>
@@ -68,7 +70,13 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
+page {
+    height: 100%;
+    background: url(../../static/public/BG.png) no-repeat fixed;
+    background-size: cover;
+}
+
 .main {
     padding: 0 64rpx;
     overflow: hidden;
@@ -128,7 +136,7 @@ export default {
         line-height: 112rpx;
         border-radius: 32rpx;
         font-size: 32rpx;
-        color:#15141F !important;
+        color: #15141F !important;
     }
 
     .signUp {
diff --git a/pages/login/register.vue b/pages/login/register.vue
index e799d71..b04e64f 100644
--- a/pages/login/register.vue
+++ b/pages/login/register.vue
@@ -1,5 +1,5 @@
 <template>
-    <view class="main">
+    <view class="main" >
         <navigation>{{ i18n.SignUp }}</navigation>
         <view class="body">
             <view class="welcomeText">{{ i18n.registerWelcomeText }}</view>
@@ -127,10 +127,11 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .main {
 
     .body {
+        margin-top: 204rpx;
         padding: 0 64rpx;
         overflow: hidden;
 
diff --git a/pages/markets/index.vue b/pages/markets/index.vue
new file mode 100644
index 0000000..3afca49
--- /dev/null
+++ b/pages/markets/index.vue
@@ -0,0 +1,161 @@
+<template>
+    <view class="main">
+        <!-- nav -->
+        <view class="nav-head">
+            <view class="left">{{ i18n.TrandingPair }}</view>
+            <view class="middle">{{ i18n.LatestPrice }}</view>
+            <view class="right">{{ i18n.RiseAndfall }}</view>
+        </view>
+        <!-- 列表 -->
+        <view class="coinList">
+            <view class="coin" v-for="(item, index) in 20" :key="index">
+                <view class="icon">
+                    <u-icon name="../../static/maskets/bye.png" size="40rpx" width="40rpx"></u-icon>
+                </view>
+                <view class="name">BTC/USDT</view>
+                <view class="price">{{ 5145 * index * index * index }}</view>
+                <view class="priceChange" :class="{ 'down': index % 2 === 0 }">500.30%</view>
+            </view>
+        </view>
+        <!-- tabBar -->
+        <tab-bar :selectActive="2"></tab-bar>
+    </view>
+</template>
+
+<script>
+export default {
+    name: 'markets',
+    data() {
+        return {
+
+        }
+    },
+    onLoad() {
+
+    },
+    onShow() {
+
+    },
+    onHide() {
+    },
+    computed: {
+        i18n() {
+            return this.$t('markets')
+        }
+    },
+    methods: {
+
+    }
+}
+
+</script>
+
+<style lang="scss" scoped>
+.main {
+    padding-bottom: 198rpx; // 避免底部TabBar盖住内容
+
+    .nav-head {
+        overflow: hidden;
+        position: fixed;
+        top: 0rpx;
+        height: 112rpx;
+        font-size: 24rpx;
+        color: #fff;
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+        width: 750rpx;
+        z-index: 8;
+        background-color: #15141F;
+        border-bottom: 4rpx solid #323045;
+        padding-top: 88rpx;
+
+    }
+
+    .coinList {
+        margin: 212rpx 32rpx 0;
+        overflow: hidden;
+
+        .coin {
+            overflow: hidden;
+            position: relative;
+            height: 64rpx;
+            padding: 12rpx 0;
+
+
+            .icon {
+                vertical-align: top;
+                overflow: hidden;
+                display: inline-block;
+                box-sizing: border-box;
+                width: 64rpx;
+                height: 64rpx;
+                background: #211F32;
+                border-radius: 20rpx;
+                padding: 12rpx;
+            }
+
+            .name {
+                display: inline-block;
+                width: 180rpx;
+                height: 100%;
+                line-height: 64rpx;
+                font-size: 28rpx;
+                margin-left: 16rpx;
+            }
+
+            .price {
+                display: inline-block;
+                width: 180rpx;
+                height: 100%;
+                line-height: 64rpx;
+                font-size: 28rpx;
+                color: #A1A0A8;
+                text-align: center;
+            }
+
+            .priceChange {
+                position: absolute;
+                right: 0;
+                display: inline-block;
+                width: 164rpx;
+                height: 64rpx;
+                border-radius: 20rpx;
+                line-height: 64rpx;
+                background-color: $mainColor;
+                font-size: 24rpx;
+                text-align: right;
+                padding-right: 16rpx;
+                box-sizing: border-box;
+
+
+                &::before {
+                    display: block;
+                    position: absolute;
+                    content: '';
+                    background-image: url(../../static/maskets/ic_arrow_up.png);
+                    background-repeat: no-repeat;
+                    background-size: contain;
+                    width: 28rpx;
+                    height: 28rpx;
+                    top: 18rpx;
+                    left: 16rpx;
+                }
+
+
+                &.down {
+                    background-color: $assistRed;
+
+                    &::before {
+                        background-image: url(../../static/maskets/ic_arrow_down.png);
+                    }
+                }
+            }
+        }
+    }
+
+
+
+
+}
+</style>
diff --git a/pages/me/index.vue b/pages/me/index.vue
new file mode 100644
index 0000000..f9ae1fb
--- /dev/null
+++ b/pages/me/index.vue
@@ -0,0 +1,160 @@
+<template>
+    <view class="main">
+        <view class="contentBody">
+            <view class="userInfo">
+                <u-image class="headImg" src="../../static/me/Ellipse 85.png" width="160rpx" height="160rpx"
+                    radius="160rpx"></u-image>
+                <view class="idAndAccount">
+                    <view class="id">ID:984934</view>
+                    <view class="account">{{i18n.account}}:348798457498579</view>
+                </view>
+            </view>
+            <!-- 三个按钮 -->
+            <view class="btnDiv">
+                <view class="item">
+                    <u--image class="img" :showLoading="true" src="../../static/home/img_recharge.png" width="144rpx"
+                        height="144rpx"></u--image>
+                    <view class="text">{{ i18n.Recharge }}</view>
+                </view>
+                <view class="item">
+                    <u--image class="img" :showLoading="true" src="../../static/home/img_Mine.png" width="144rpx"
+                        height="144rpx"></u--image>
+                    <view class="text">{{ i18n.Withdrawal }}</view>
+                </view>
+                <view class="item">
+                    <u--image class="img" :showLoading="true" src="../../static/home/img_Subcription.png" width="144rpx"
+                        height="144rpx"></u--image>
+                    <view class="text">{{ i18n.Subcription }}</view>
+                </view>
+            </view>
+        </view>
+
+
+        <!-- tabBar -->
+        <tab-bar :selectActive="5"></tab-bar>
+    </view>
+</template>
+
+<script>
+export default {
+    name: 'me',
+    data() {
+        return {
+
+        }
+    },
+    onLoad() {
+
+    },
+    onShow() {
+
+    },
+    onHide() {
+    },
+    computed: {
+        i18n() {
+            return this.$t('me')
+        }
+    },
+    methods: {
+        gotoDetails(index) {
+            if (this.pageState !== 'product') return
+            uni.navigateTo({
+                url: `/pages/subscription/details?id=${index}`
+            });
+        }
+    }
+}
+
+</script>
+
+<style lang="scss" scoped>
+.main {
+    padding-top: 88rpx;
+    padding-bottom: 198rpx; // 避免底部TabBar盖住内容
+
+    .contentBody {
+
+        box-sizing: border-box;
+        width: 100%;
+        background: #211F32;
+        border-radius: 64rpx 64rpx 0 0;
+        padding: 44rpx 48rpx;
+        overflow: hidden;
+
+
+        .userInfo {
+            height: 168rpx;
+            display: flex;
+            flex-wrap: wrap;
+
+            .headImg {
+                height: 160rpx;
+                width: 160rpx;
+                border-radius: 160rpx;
+                border: 4rpx solid #F6A609;
+            }
+
+            .idAndAccount {
+                margin-left: 40rpx;
+
+                .id {
+                    height: 56rpx;
+                    width: 378rpx;
+                    font-weight: 600;
+                    font-size: 40rpx;
+                    margin: 16rpx 0;
+                }
+
+                .account {
+                    position: relative;
+                    height: 56rpx;
+                    line-height: 56rpx;
+                    width: 378rpx;
+                    background: rgba(255, 188, 31, 0.1);
+                    border-radius: 16rpx;
+                    font-size: 24rpx;
+                    color: #FFBC1F;
+                    text-align: center;
+                    padding-left: 20rpx;
+
+                    &::before {
+                        display: block;
+                        position: absolute;
+                        content: '';
+                        background-image: url(../../static/me/ranking.png);
+                        background-repeat: no-repeat;
+                        background-size: 32rpx;
+                        width: 32rpx;
+                        height: 32rpx;
+                        top: 12rpx;
+                        left: 20rpx;
+                    }
+                }
+            }
+
+
+        }
+
+        .btnDiv {
+            margin: 32rpx 48rpx;
+
+            .item {
+                display: inline-block;
+                width: 218rpx;
+                text-align: center;
+
+                .img {
+                    margin: 0 36rpx 16rpx;
+                }
+            }
+        }
+
+    }
+
+
+
+
+
+}
+</style>
diff --git a/pages/subscription/details.vue b/pages/subscription/details.vue
new file mode 100644
index 0000000..508503a
--- /dev/null
+++ b/pages/subscription/details.vue
@@ -0,0 +1,258 @@
+<template>
+    <view class="main">
+        <!-- nav -->
+        <navigation>{{ i18n.Subscription }}</navigation>
+        <view class="body">
+            <!-- 倒计时 -->
+            <view class="countDown">
+                <view class="item">
+                    <view class="title">{{ i18n.Days }}</view>
+                    <view class="value">20</view>
+                </view>
+                <view class="item">
+                    <view class="title">{{ i18n.Hours }}</view>
+                    <view class="value">8</view>
+                </view>
+                <view class="item">
+                    <view class="title">{{ i18n.Minutes }}</view>
+                    <view class="value">47</view>
+                </view>
+                <view class="item">
+                    <view class="title">{{ i18n.Seconds }}</view>
+                    <view class="value">9</view>
+                </view>
+            </view>
+
+            <!-- input -->
+            <view class="input-item">
+                <u-input class="input" v-model="SubscribeCount" color="#A1A0A8" fontSize="32rpx" border="none"
+                    :placeholder="i18n.PleaseChooseCoin">
+                </u-input>
+                <view class="selectCoin" @click="USDTPopupShow = true">USDT
+                </view>
+            </view>
+            <!-- total -->
+            <Key-value-row :keyName="i18n.Total" :value="'≈ 993.64069952 ACTA'" :size="'24rpx'" :leftColor="'#A1A0A8'"
+                :rightColor="'#A1A0A8'"></Key-value-row>
+
+            <!-- 按钮 -->
+            <u-button class="button" color="#00E8A2" throttleTime="500">{{
+                    i18n.SubscribeNow
+            }}
+            </u-button>
+
+            <!-- ProjectDetails -->
+            <view class="contentTitle">
+                <view class="ProjectDetails">{{ i18n.ProjectDetails }}</view>
+                <view class="videoBtn">{{ i18n.Video }}</view>
+                <view class="whiteBook">{{ i18n.WhiteBook }}</view>
+            </view>
+
+            <!-- 文字内容 -->
+            <view class="content">Access to COVID-19 Tools Accelerator (ACTA) is a fully decentralized financial (DeFi)
+                ecosystem with blockchain as the underlying architecture, 100% decentralized exchange, 100% free
+                trading, 100% customized trading model, 100% cross-chain support. We have pre-customized two trading
+                models, ACTA/BTC and ACTA/USDT. ACTA/BTC is the mainstream currency with stable appreciation space;
+                ACTA/USDT is a stable settlement virtual currency which can be 1:1 freely convertible with US dollars.
+                ACTA is the leader of the global digital encryption currency decentralized market.
+
+                Full name of the token: Access to COVID-19 Tools Accelerator
+
+                ACTA total circulation: 1,200,000,000.00
+
+                ICO Price: 0.02 USDT
+
+                ICO Time: From December 12,2021 to March 12, 2022</view>
+
+        </view>
+    </view>
+</template>
+
+<script>
+import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue';
+import UButton from '../../uview-ui/components/u-button/u-button'
+export default {
+    name: "subscriptionDetails",
+    data() {
+        return {
+            SubscribeCount: 0,
+            DonatePopupShow: false,
+            USDTPopupShow: false,
+            DonatePopupDisabled: true,
+            coinInfo: {},
+            rules: {},
+            radioValue: '',
+        };
+    },
+    computed: {
+        i18n() {
+            return this.$t("subscription");
+        },
+    },
+    onLoad() {
+        // console.log(this.$t('login.emailInputMessage'));
+    },
+    onShow() { },
+    methods: {
+        radioChange(e) {
+            // console.log(e);
+        }
+    },
+    components: { UButton, KeyValueRow }
+}
+</script>
+
+<style lang="scss" scoped>
+.main {
+
+    .body {
+        overflow: hidden;
+        margin-top: 200rpx;
+        padding: 0 48rpx;
+
+        .countDown {
+            margin-top: 60rpx;
+            height: 248rpx;
+            background-image: url(../../static/subscription/RoundedRectangle.png);
+            background-repeat: no-repeat;
+            background-size: 654rpx 248rpx;
+            color: #15141F;
+            padding: 36rpx 28rpx;
+            display: flex;
+            align-items: center;
+            justify-content: space-around;
+            box-sizing: border-box;
+
+            .item {
+                width: 140rpx;
+                height: 174rpx;
+                font-weight: bold;
+
+
+                .title {
+                    font-size: 32rpx;
+                    text-align: center;
+                }
+
+                .value {
+                    margin-top: 10rpx;
+                    font-size: 96rpx;
+                    text-align: center;
+                }
+            }
+
+        }
+
+        .input-item {
+            position: relative;
+            overflow: hidden;
+            height: 124rpx;
+            line-height: 124rpx;
+            background: #323045;
+            margin: 32rpx 0;
+            border-radius: 32rpx;
+            padding: 0 40rpx;
+
+            /deep/.u-form-item__body {
+                padding: 0;
+            }
+
+            .input {
+                width: 80%;
+                height: 124rpx;
+            }
+
+            .selectCoin {
+                position: absolute;
+                width: 150rpx;
+                height: 54rpx;
+                top: 36rpx;
+                right: 0rpx;
+                line-height: 56rpx;
+                font-size: 36rpx;
+                padding: 0;
+                color: #fff;
+            }
+        }
+
+        .button {
+            margin-top: 38rpx;
+            margin-bottom: 48rpx;
+            height: 112rpx;
+            line-height: 112rpx;
+            border-radius: 32rpx;
+            font-size: 32rpx;
+            color: #15141F !important;
+            font-weight: bold;
+        }
+
+        .contentTitle {
+            position: relative;
+            margin-bottom: 32rpx;
+
+            .ProjectDetails {
+                font-size: 32rpx;
+                color: #fff;
+            }
+
+            .videoBtn {
+                position: absolute;
+                top: 0;
+                right: 184rpx;
+                width: 134rpx;
+                height: 48rpx;
+                line-height: 48rpx;
+                background: #F2FE8D;
+                border-radius: 8rpx;
+                text-align: right;
+                color: #15141F;
+                font-size: 24rpx;
+                font-weight: bold;
+                box-sizing: border-box;
+                padding: 0 16rpx;
+
+                &::before {
+                    display: block;
+                    position: absolute;
+                    content: '';
+                    background-image: url(../../static/subscription/ic_play.png);
+                    background-repeat: no-repeat;
+                    background-size: 32rpx;
+                    width: 32rpx;
+                    height: 32rpx;
+                    top: 8rpx;
+                    left: 10rpx;
+                }
+            }
+
+            .whiteBook {
+                position: absolute;
+                top: 0;
+                right: 0rpx;
+                width: 164rpx;
+                height: 48rpx;
+                line-height: 48rpx;
+                background: #F2FE8D;
+                border-radius: 8rpx;
+                text-align: center;
+                color: #15141F;
+                font-size: 24rpx;
+                font-weight: bold;
+                box-sizing: border-box;
+            }
+        }
+
+
+        .content {
+            font-size: 24rpx;
+            color: #A1A0A8;
+            margin-bottom: 48rpx;
+        }
+
+
+
+
+    }
+
+}
+</style>
diff --git a/pages/subscription/index.vue b/pages/subscription/index.vue
new file mode 100644
index 0000000..0bc8f2c
--- /dev/null
+++ b/pages/subscription/index.vue
@@ -0,0 +1,164 @@
+<template>
+    <view class="main">
+        <!-- nav -->
+        <view class="nav-head">
+            <view class="navItem" @click="pageState = 'product'" :class="{ select: pageState === 'product' }">
+                {{ i18n.Product }}
+            </view>
+            <view class="navItem" @click="pageState = 'pending'" :class="{ select: pageState === 'pending' }">
+                {{ i18n.Pending }}
+            </view>
+            <view class="navItem" @click="pageState = 'complete'" :class="{ select: pageState === 'complete' }">
+                {{ i18n.Complete }}
+            </view>
+        </view>
+        <!-- Product 产品列表 -->
+        <view class="cardList">
+            <view class="card" v-for="(item, index) in 10" :key="index" @click="gotoDetails(index)">
+                <!-- 卡片条件渲染 -->
+                <!-- product -->
+                <card-header v-if="pageState === 'product'" :iconName="'../../static/maskets/bye.png'"
+                    :title="'BTC(Bitcoin)'" :rightName="i18n.Subscribe" :hasBtn="true" :btnColor="'#00E8A2'">
+                </card-header>
+                <view class="dataBody" v-if="pageState === 'product'">
+                    <Key-value-row :keyName="i18n.STLTotalCirculation" :value="'23989'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.PrivateSalePrice" :value="'284145.61'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.ICOTime" :value="'2022/08/06-2022/08/31'"></Key-value-row>
+                </view>
+
+
+                <!-- pending -->
+                <card-header v-if="pageState === 'pending'" :iconName="'../../static/maskets/bye.png'"
+                    :title="'973430980989323445'" :rightName="'Pending'" fontColor="#00E8A2">
+                </card-header>
+                <view class="dataBody" v-if="pageState === 'pending'">
+                    <Key-value-row :keyName="i18n.Price" :value="'284145.61'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.Quantity" :value="'1000'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.USDT" :value="'3166.61'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.Time" :value="'2022/08/06 14:51'"></Key-value-row>
+                </view>
+
+
+                <!-- complete -->
+                <card-header v-if="pageState === 'complete'" :iconName="'../../static/maskets/bye.png'"
+                    :title="'973430980989323445'" :rightName="'complete'" fontColor="#00E8A2">
+                </card-header>
+                <view class="dataBody" v-if="pageState === 'complete'">
+                    <Key-value-row :keyName="i18n.Price" :value="'284145.61'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.Quantity" :value="'1000'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.ConfirmAmount" :value="'999'" :leftColor="'#F2FE8D'"
+                        :rightColor="'#F2FE8D'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.USDT" :value="'3166.61'"></Key-value-row>
+                    <Key-value-row :keyName="i18n.CheckTheNumberoOfUSDT" :value="'2000'" :leftColor="'#F2FE8D'"
+                        :rightColor="'#F2FE8D'">
+                    </Key-value-row>
+                    <Key-value-row :keyName="i18n.Time" :value="'2022/08/06 14:51'"></Key-value-row>
+
+                </view>
+
+            </view>
+        </view>
+
+
+
+        <!-- tabBar -->
+        <tab-bar :selectActive="4"></tab-bar>
+    </view>
+</template>
+
+<script>
+import CardHeader from '../../components/cardHeader/cardHeader.vue';
+import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue';
+export default {
+    components: { KeyValueRow, CardHeader },
+    name: 'subscription',
+    data() {
+        return {
+            pageState: 'product', // 当前页签状态
+        }
+    },
+    onLoad() {
+
+    },
+    onShow() {
+
+    },
+    onHide() {
+    },
+    computed: {
+        i18n() {
+            return this.$t('subscription')
+        }
+    },
+    methods: {
+        gotoDetails(index) {
+            if (this.pageState !== 'product') return
+            uni.navigateTo({
+                url: `/pages/subscription/details?id=${index}`
+            });
+        }
+    }
+}
+
+</script>
+
+<style lang="scss" scoped>
+.main {
+    padding-bottom: 198rpx; // 避免底部TabBar盖住内容
+
+    .nav-head {
+        overflow: hidden;
+        position: fixed;
+        top: 0rpx;
+        height: 80rpx;
+        font-size: 24rpx;
+        color: #fff;
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+        z-index: 8;
+        background-color: #15141F;
+        padding: 94rpx 48rpx 0;
+
+
+        .navItem {
+            width: 218rpx;
+            height: 80rpx;
+            line-height: 80rpx;
+            text-align: center;
+            color: #0b7e60;
+            font-size: 28rpx;
+            border-bottom: 10rpx solid #0b7e60;
+        }
+
+        .select {
+            color: #00E8A2;
+            border-bottom: 10rpx solid #00E8A2;
+        }
+
+    }
+
+
+    .cardList {
+        margin-top: 212rpx;
+
+        .card {
+            background: #211F32;
+            border-radius: 32rpx;
+            margin: 32rpx;
+
+
+
+            .dataBody {
+                box-sizing: border-box;
+                padding: 32rpx;
+            }
+        }
+    }
+
+
+
+
+
+}
+</style>
diff --git a/readme.md b/readme.md
index cf8fc25..158e157 100644
--- a/readme.md
+++ b/readme.md
@@ -10,4 +10,10 @@ if (uni.$u.test.array(errors)) {
 }
 this.errorType === 'toast' ?uni.$u.toast(errors[0].message):
 child.message =
-	childErrors[0]?.message ?? null;
\ No newline at end of file
+	childErrors[0]?.message ?? null;
+
+
+u-transition中的view容器要增加@touchmove.prevent 避免弹窗组件的穿透性问题
+		@touchmove.prevent
+		
+
diff --git a/static/charity/Ellipse 502.png b/static/charity/Ellipse 502.png
new file mode 100644
index 0000000..2392f13
Binary files /dev/null and b/static/charity/Ellipse 502.png differ
diff --git a/static/charity/Rectangle 2.png b/static/charity/Rectangle 2.png
new file mode 100644
index 0000000..1f0c80e
Binary files /dev/null and b/static/charity/Rectangle 2.png differ
diff --git a/static/charity/Turn.png b/static/charity/Turn.png
new file mode 100644
index 0000000..14294ab
Binary files /dev/null and b/static/charity/Turn.png differ
diff --git a/static/home/ic_ma_arrow_down.png b/static/charity/ic_ma_arrow_down.png
similarity index 100%
rename from static/home/ic_ma_arrow_down.png
rename to static/charity/ic_ma_arrow_down.png
diff --git a/static/tongyonh/Frame3299.png b/static/maskets/Frame3299.png
similarity index 100%
rename from static/tongyonh/Frame3299.png
rename to static/maskets/Frame3299.png
diff --git a/static/tongyonh/bye.png b/static/maskets/bye.png
similarity index 100%
rename from static/tongyonh/bye.png
rename to static/maskets/bye.png
diff --git a/static/home/ic_arrow_down.png b/static/maskets/ic_arrow_down.png
similarity index 100%
rename from static/home/ic_arrow_down.png
rename to static/maskets/ic_arrow_down.png
diff --git a/static/home/ic_arrow_up.png b/static/maskets/ic_arrow_up.png
similarity index 100%
rename from static/home/ic_arrow_up.png
rename to static/maskets/ic_arrow_up.png
diff --git a/static/me/Ellipse 85.png b/static/me/Ellipse 85.png
new file mode 100644
index 0000000..d8641f7
Binary files /dev/null and b/static/me/Ellipse 85.png differ
diff --git a/static/me/bg_QR_code.png b/static/me/bg_QR_code.png
new file mode 100644
index 0000000..0dc0fc0
Binary files /dev/null and b/static/me/bg_QR_code.png differ
diff --git a/static/me/ic_arrow_g.png b/static/me/ic_arrow_g.png
new file mode 100644
index 0000000..55d8fb3
Binary files /dev/null and b/static/me/ic_arrow_g.png differ
diff --git a/static/me/ic_logout.png b/static/me/ic_logout.png
new file mode 100644
index 0000000..5ab8221
Binary files /dev/null and b/static/me/ic_logout.png differ
diff --git a/static/me/ic_u_recharge.png b/static/me/ic_u_recharge.png
new file mode 100644
index 0000000..a0e0ff6
Binary files /dev/null and b/static/me/ic_u_recharge.png differ
diff --git a/static/me/ic_u_transfer.png b/static/me/ic_u_transfer.png
new file mode 100644
index 0000000..58fe36a
Binary files /dev/null and b/static/me/ic_u_transfer.png differ
diff --git a/static/me/ic_u_withdrawal.png b/static/me/ic_u_withdrawal.png
new file mode 100644
index 0000000..7f1c701
Binary files /dev/null and b/static/me/ic_u_withdrawal.png differ
diff --git a/static/me/ic_wallet_add.png b/static/me/ic_wallet_add.png
new file mode 100644
index 0000000..51a4c83
Binary files /dev/null and b/static/me/ic_wallet_add.png differ
diff --git a/static/me/ic_wallet_minus.png b/static/me/ic_wallet_minus.png
new file mode 100644
index 0000000..341fe0a
Binary files /dev/null and b/static/me/ic_wallet_minus.png differ
diff --git a/static/me/img_accountinfo01.png b/static/me/img_accountinfo01.png
new file mode 100644
index 0000000..a28707e
Binary files /dev/null and b/static/me/img_accountinfo01.png differ
diff --git a/static/me/img_accountinfo02.png b/static/me/img_accountinfo02.png
new file mode 100644
index 0000000..317d062
Binary files /dev/null and b/static/me/img_accountinfo02.png differ
diff --git a/static/me/img_accountinfo03.png b/static/me/img_accountinfo03.png
new file mode 100644
index 0000000..2ca113b
Binary files /dev/null and b/static/me/img_accountinfo03.png differ
diff --git a/static/me/img_accountinfo04.png b/static/me/img_accountinfo04.png
new file mode 100644
index 0000000..0d13774
Binary files /dev/null and b/static/me/img_accountinfo04.png differ
diff --git a/static/me/img_accountinfo05.png b/static/me/img_accountinfo05.png
new file mode 100644
index 0000000..17c7e54
Binary files /dev/null and b/static/me/img_accountinfo05.png differ
diff --git a/static/me/img_donate.png b/static/me/img_donate.png
new file mode 100644
index 0000000..34c8feb
Binary files /dev/null and b/static/me/img_donate.png differ
diff --git a/static/me/ranking.png b/static/me/ranking.png
new file mode 100644
index 0000000..4e8fd17
Binary files /dev/null and b/static/me/ranking.png differ
diff --git a/static/subscription/RoundedRectangle.png b/static/subscription/RoundedRectangle.png
new file mode 100644
index 0000000..98c50ce
Binary files /dev/null and b/static/subscription/RoundedRectangle.png differ
diff --git a/static/subscription/ic_play.png b/static/subscription/ic_play.png
new file mode 100644
index 0000000..fd3f2a7
Binary files /dev/null and b/static/subscription/ic_play.png differ
diff --git a/static/tabBar/ic_subcription_de.png b/static/tabBar/ic_subscription_de.png
similarity index 100%
rename from static/tabBar/ic_subcription_de.png
rename to static/tabBar/ic_subscription_de.png
diff --git a/static/tabBar/ic_subcription_pr.png b/static/tabBar/ic_subscription_pr.png
similarity index 100%
rename from static/tabBar/ic_subcription_pr.png
rename to static/tabBar/ic_subscription_pr.png
diff --git a/utils/language/en.js b/utils/language/en.js
index 3a22a2e..8f43ac4 100644
--- a/utils/language/en.js
+++ b/utils/language/en.js
@@ -1,12 +1,12 @@
 // en.js
 export default {
 	// tab bar 相关
-	tabBar:{
-		Home:'Home',
-		Markets:'Markets',
-		Charity:'Charity',
-		Subscription:'Subscription',
-		Me:'Me',
+	tabBar: {
+		Home: 'Home',
+		Markets: 'Markets',
+		Charity: 'Charity',
+		Subscription: 'Subscription',
+		Me: 'Me',
 	},
 	// 登陆相关页面
 	login: {
@@ -53,14 +53,82 @@ export default {
 	home: {
 		// 公共字段
 		HOME: 'HOME',
-		// 首页
+		// home首页
 		customerService: 'Customer Service',
-		homeMessage: `Please contact customer service on the top-left corner for identity verification on your first...
-		Please contact customer service on the top-left corner for identity verification on your first...Please contact customer service on the top-left corner for identity verification on your first...`,
+		homeMessage: `Please contact customer service on the top-left corner for identity verification on your first Please contact customer service on the top-left corner for identity verification on your first...Please contact customer service on the top-left corner for identity verification on your first... `,
 		Recharge: 'Recharge',
 		Mine: 'Mine',
 		Subcription: 'Subcription',
-		TodaySteps:"Today's steps",
-		ReceiveEarnings:"Receive yesterday's earnings",
+		TodaySteps: "Today's steps",
+		ReceiveEarnings: "Receive yesterday's earnings",
+
+
+	},
+
+	// 合约页面相关
+	markets: {
+		// markets
+		TrandingPair: 'Tranding Pair',
+		LatestPrice: 'Latest Price',
+		RiseAndfall: '24H Rise and fall',
+	},
+
+	// 捐赠页面相关
+	charity: {
+		CharityDetails: 'Charity Details',
+		About: 'About',
+		Participants: 'Participants',
+		DonateNow: 'Donate Now',
+		PleaseChooseCoin: 'Please choose coin',
+		AvailableBlance: 'Available blance',
+		Quantity: 'Quantity',
+		WithdrawalPassword: 'Withdrawal Password',
+	},
+
+	// 申购页面相关 subscription
+
+	subscription: {
+		// 公共
+		Product: 'Product',
+		Pending: 'Pending',
+		Complete: 'Complete',
+		// Product
+		Subscribe: 'Subscribe',
+		Ended: 'Ended',
+		ComingSoon: 'Coming soon',
+		STLTotalCirculation: 'STL total circulation',
+		PrivateSalePrice: 'Private sale price',
+		ICOTime: 'ICO Time',
+		// Pending //Complete
+		HeaderPending: 'Pending',
+		HeaderComplete: 'Complete',
+		Price: 'Price',
+		Quantity: 'Quantity',
+		ConfirmAmount: 'Confirm amount',
+		USDT: 'USDT',
+		Time: 'Time',
+		CheckTheNumberoOfUSDT: 'Check the number of USDT',
+		// Subscription
+		Subscription: 'Subscription',
+		Days: 'Days',
+		Hours: 'Hours',
+		Minutes: 'Minutes',
+		Seconds: 'Seconds',
+		Total: 'Total',
+		SubscribeNow: 'Subscribe Now',
+		ProjectDetails: 'Project Details',
+		Video: 'Video',
+		WhiteBook: 'White Book',
+	},
+
+	//me
+	me: {
+		account: 'account',
+		Recharge: 'Recharge',
+		Withdrawal: 'Withdrawal',
+		Transfer: 'Transfer',
+		Balance: 'Balance(U)',
+		Pledge: 'Pledge(U)',
+		Contarct: 'Contarct(U)',
 	}
 }
diff --git a/uview-ui/components/u-transition/u-transition.vue b/uview-ui/components/u-transition/u-transition.vue
index 22831dc..5aab389 100644
--- a/uview-ui/components/u-transition/u-transition.vue
+++ b/uview-ui/components/u-transition/u-transition.vue
@@ -7,6 +7,7 @@
 		:class="classes"
 		:style="[mergeStyle]"
 		@touchmove="noop"
+		@touchmove.prevent
 	>
 		<slot />
 	</view>