diff --git a/main.js b/main.js
index 5a7210f..9dfdf5e 100644
--- a/main.js
+++ b/main.js
@@ -6,7 +6,7 @@ import common from './utils/common.js'
 // const baseURL = 'http://localhost:7010'
 //const baseURL = 'http://81.69.47.31:7010'
 // const baseURL = 'http://bnyer.vaiwan.com'
-const baseURL = 'http://aipdbt.natappfree.cc'
+const baseURL = 'http://fu7avs.natappfree.cc'
 
 
 Vue.prototype.$baseURL = baseURL;
diff --git a/pages.json b/pages.json
index 6f42857..99e9545 100644
--- a/pages.json
+++ b/pages.json
@@ -3,9 +3,10 @@
 		{
 			"path": "pages/index/index",
 			"style": {
-				"navigationBarTitleText": "首页",
-				"enablePullDownRefresh": false,
-				"navigationBarBackgroundColor": "#FFC542"
+				"navigationBarTitleText": "次元Hub",
+				"enablePullDownRefresh": true,
+				"navigationBarBackgroundColor": "#141b29",
+				"navigationStyle": "custom"
 			}
 		},
 		{
@@ -41,7 +42,7 @@
 			"style": {
 				"navigationBarTitleText": " ",
 				"enablePullDownRefresh": false,
-				"navigationBarBackgroundColor": "#22343C"
+				"navigationBarBackgroundColor": "#141b29"
 			}
 
 		}, {
@@ -96,8 +97,9 @@
 		{
 			"path": "pages/userInfo/userInfo",
 			"style": {
-				"navigationBarTitleText": "我的",
-				"enablePullDownRefresh": false
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": true,
+				"navigationStyle": "custom"
 			}
 		}
 	],
@@ -208,22 +210,24 @@
 					}
 		]
 	}],
-
 	"globalStyle": {
-		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "bnyer",
-		"navigationBarBackgroundColor": "#F8F8F8",
-		"backgroundColor": "#F8F8F8",
+		"navigationBarTextStyle": "white",
+		"navigationBarTitleText": "次元Hub",
+		"navigationBarBackgroundColor": "#141b29",
+		"backgroundColor": "#141b29",
 		"rpxCalcMaxDeviceWidth": 750, // rpx 计算所支持的最大设备宽度，单位 px，默认值为 960
 		"rpxCalcBaseDeviceWidth": 375, // rpx 计算使用的基准设备宽度，设备实际宽度超出 rpx 计算所支持的最大设备宽度时将按基准宽度计算，单位 px，默认值为 375
 		"rpxCalcIncludeWidth": 750 // rpx 计算特殊处理的值，始终按实际的设备宽度计算，单位 rpx，默认值为 750
 	},
 	//底部跳转tab
 	"tabBar": {
-		"color": "#899A96",
-		"selectedColor": "#1A1A1A",
+		"color": "#FFFFFF",
+		"selectedColor": "#30a9c0",
 		"borderStyle": "black",
-		"backgroundColor": "#30444E",
+		"backgroundColor": "#141b29",
+		"fontSize": "12px",
+		"spacing": "5px",
+		"height": "100px",
 		"list": [{
 			"pagePath": "pages/index/index",
 			"iconPath": "static/index-default.png",
diff --git a/pages/index/index.vue b/pages/index/index.vue
index cb319a2..947ce6b 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,8 +1,7 @@
 <template>
 	<view class="container">
 		<view class="top">
-			<uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="banner" :current="current" :mode="mode"
-				field="bannerName">
+			<uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="banner" :current="current" :mode="mode" :dots-styles="dotsStyles" >
 				<swiper class="swiper-box" @change="changeSwiper" :current="swiperDotIndex" :autoplay="autoplay"
 					:interval="interval" :duration="duration" circular>
 					<swiper-item v-for="(item, index) in banner" :key="index">
@@ -16,30 +15,28 @@
 		</view>
 		
 		<view class="middle">
-			<uni-row class="middle-uni-row" gutter="40">
-				<uni-col :span="12" class="middle-uni-col" v-for="(val, i) in funcList" :index="i" :key="i">
-					<view class="grid-item-box">
-						<!-- <uni-icons type="image" :size="30" color="#777" /> -->	
-						<text class="text uni-white">{{ val.title }}</text>
-						<image :src="val.icon" class="iconImage" mode="aspectFill" />
-					</view>
-				</uni-col>
-			</uni-row>
+      <view class="middle-div">
+        <view class="middle-btn-item" v-for="(val, i) in funcList" :index="i" :key="i">
+          <view class="grid-item-box" @click="change(val.url)">
+            <!-- <uni-icons type="image" :size="30" color="#777" /> -->
+            <text class="text uni-white">{{ val.title }}</text>
+            <image :src="val.icon" class="iconImage" mode="aspectFill" />
+          </view>
+        </view>
+      </view>
 		</view>
 		
 		<view class="foot">
-			<uni-row class="foot-uni-row" gutter="88">
-				<uni-col :span="8" class="foot-uni-col" v-for="(params, v) in list" :index="v" :key="v">
-					<view class="grid-item-box uni-white">
-						<!-- <uni-icons type="image" :size="30" color="#777" /> -->
-						<view class="icom-div">
-							<image :src="params.icon" class="listIconImage" mode="aspectFill" />
-						</view>
-						<text class="text">{{ params.text }}</text>
-						<text class="text">{{ params.num }}</text>
-					</view>
-				</uni-col>
-			</uni-row>
+      <view class="foot-div">
+        <view class="grid-item-box uni-white" v-for="(params, v) in list" :index="v" :key="v">
+          <!-- <uni-icons type="image" :size="30" color="#777" /> -->
+          <view class="icom-div">
+            <image :src="params.icon" class="listIconImage" mode="aspectFill" />
+          </view>
+          <text class="text">{{ params.text }}</text>
+          <text class="text">{{ params.num }}</text>
+        </view>
+      </view>
 		</view>
 		
 	</view>
@@ -60,7 +57,15 @@
 					}
 				],
 				current: 0,
-				mode: 'nav',
+				mode: 'default',
+        dotsStyles: {
+          backgroundColor: 'rgba(255, 255, 255, .5)',
+          border: '1px rgba(0, 0, 0, .3) solid',
+          color: '#fff',
+          selectedBackgroundColor: 'rgba(255, 255, 255, .9)',
+          selectedBorder: '1px rgba(0, 0, 0, .9) solid',
+          bottom: 50
+        },
 				swiperDotIndex: 0,
 				autoplay: true,
 				interval: 5000,
@@ -95,7 +100,7 @@
 					},
 					{
 						typeId: 4,
-						text: '朋友圈',
+						text: '背景图',
 						num: '10',
 						icon: '/static/friendBack.png'
 					},
@@ -117,42 +122,54 @@
 		created(){
 			const userInfo = uni.getStorageSync('userInfo')
 			if (!userInfo) {
-				console.log('havent userInfo')
 				uni.showModal({
 					content: '艺术家账户过期,请重新登录！',
 					showCancel: false,
 					success() {
 						//没有缓存则跳转登录页面
-						// uni.reLaunch({
-						// 	url: '/pages/login/login'
-						// });
+						uni.reLaunch({
+							url: '/pages/login/login'
+						});
 					}
 				});
 			} else {
 				this.userInfo = userInfo;
-				console.log('have userInfo')
+        this.queryCreatorTypeImgNum();
+        this.getBanner();
 			}
 			
 		},
 		onLoad(){
-			this.queryCreatorTypeImgNum();
-			this.getBanner();
+
 		},
+    onShow(){
+      const userInfo = uni.getStorageSync('userInfo')
+      if (userInfo) {
+        this.queryCreatorTypeImgNum();
+        this.getBanner();
+      }
+    },
+    onPullDownRefresh() {
+      const userInfo = uni.getStorageSync('userInfo')
+      if (userInfo) {
+        this.queryCreatorTypeImgNum();
+        this.getBanner();
+      }
+    },
 		methods: {
 			changeSwiper(e){
 				this.current = e.detail.current;
 			},
 			change(e) {
-				this.pageUrl = this.funcList[e.detail.index].url
-				console.log('this.pageUrl',this.pageUrl)
+				// this.pageUrl = this.funcList[e.detail.index].url
 				/** 跳转指定页面*/
 				 uni.navigateTo({
-				 	url: this.pageUrl
+					url: e
+				 	// url: this.pageUrl
 				 });
 			},
 			clickItem(e) {
 				this.swiperDotIndex = e
-				console.log('this.swiperDotIndex', this.swiperDotIndex) 
 			},
 			// 跳转banner详情页
 			linkTo(item) {
@@ -182,7 +199,7 @@
 			async queryCreatorTypeImgNum() {
 				let that = this;
 				const res = await queryCreatorTypeImgNum(that.userInfo.id)
-				console.log('res',res)
+				// console.log('res',res)
 				if (res.data.code === 200) {
 					that.list[0].num = res.data.data.headNum
 					that.list[1].num = res.data.data.gifNum
@@ -202,7 +219,7 @@
 	}
 </script>
 
-<style lang="scss">
+<style scoped lang="scss">
 	.container{
 		font-family:‘Franklin Gothic Medium’, ‘Arial Narrow’, Arial, sans-serif;
 	}
@@ -211,60 +228,22 @@
 		width: 100%;
 		height: 100%;
 	}
-	.grid-item-box {
-		flex: 1;
-		// position: relative;
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		padding: 10rpx 0;
-	}
 
-	.grid-item-box-row {
-		flex: 1;
-		// position: relative;
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		flex-direction: row;
-		align-items: center;
-		justify-content: center;
-		padding: 10rpx 0;
+	.grid-item-box {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
 	}
 
-	.swiper-box {
-		height: 260rpx;
-	}
+  .swiper-box {
+    height: 50vh;
+  }
 
 	.swiper-item {
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		flex-direction: column;
-		justify-content: center;
-		align-items: center;
-		height: 290rpx;
-		color: #fff;
+    background-color: rgba(255, 255, 255, .3);
 	}
 
-	.swiper-item0 {
-		background-color: #cee1fd;
-	}
-
-	.swiper-item1 {
-		background-color: #b2cef7;
-	}
-
-	.swiper-item2 {
-		background-color: #cee1fd;
-	}
-
-	.image {
-		width: 750rpx;
-	}
 
 	/* #ifndef APP-NVUE */
 	::v-deep .image img {
@@ -272,12 +251,12 @@
 		-khtml-user-drag: none;
 		-moz-user-drag: none;
 		-o-user-drag: none;
-		user-drag: none;
+		// user-drag: none;
 	}
 
 	/* #endif */
 
-	@media screen and (min-width: 500rpx) {
+	@media screen and (min-width: 375rpx) {
 		.uni-swiper-dot-box {
 			width: 100%;
 			height: 100%;
@@ -289,82 +268,88 @@
 			width: 100%;
 		}
 	}
-
-	.uni-bg-blue {
-		background-color: #007aff;
-	}
-	
-	.iconImage{
-		width:90rpx;
-		height:90rpx;
-	}
 	
-	.listIconImage{
-		width:60rpx;
-		height:60rpx;
-	}
-
-</style>
-<style scoped lang="scss">
 	.container {
 		min-height: 100vh;
-		background: #FFC542;
-		border-top: 2rpx solid #FFC542;
+		background: #141b29;
+		border-top: 2rpx solid #141b29;
+    position: relative;
 		
 		.top {
-			width: 638rpx;
-			// height: 272rpx;
-			margin: 40rpx auto;
-			border-radius: 50rpx;
-			overflow: hidden;
+			width: 100%;
+      height: 50vh;
 		}
 		
 		.middle {
-			width: 638rpx;
-			margin: 0 auto;
-			
+      position: absolute;
+      top: calc(50vh - 60rpx);
+      left: 0;
+      right: 0;
+
+      .middle-div {
+        width: 670rpx;
+        height: calc(20vh - 30rpx);
+        margin: 0 auto;
+        background: #1d2734;
+        border-radius: 40rpx;
+
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+
+        .middle-btn-item {
+          width: 50%;
+        }
+
+      }
+
 			.grid-item-box {
-				height: 360rpx;
-				background: rgb(62, 213, 152);
-				border-radius: 25px;
-				position: relative;
+				height: 100%;
 				
 				.text {
-					font-size: 48rpx;
-					position: absolute;
-					top: 84rpx;
-					left: auto;
-					right: auto;
+					font-size: 36rpx;
+          margin-bottom: 20rpx;
 				}
 				
 				.iconImage {
-					position: absolute;
-					bottom: 0;
-					left: auto;
-					right: auto;
-					width: 158rpx;
-					height: 186rpx;
+					width: 100rpx;
+					height: 100rpx;
 				}
 				
 			}
 		}
 		
 		.foot {
-			margin-top: 40rpx;
-			padding: 56rpx;
-			background: #2A3C44;
-			border-radius: 80rpx 0px 0px 0px;
-			
+      position: absolute;
+      top: calc(70vh - 40rpx);
+      left: 0;
+      right: 0;
+      height: calc(30vh - 30rpx);
+
+      .foot-div {
+        width: 670rpx;
+        height: 100%;
+        margin: 0 auto;
+        background: #1d2734;
+        border-radius: 40rpx;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+
+      }
+
 			.grid-item-box {
-				margin-bottom: 14rpx;
+        width: 170rpx;
+        height: 50%;
+        //padding: 40rpx;
 				
 				.icom-div {
-					background: #30444E;
+					//background: #0a6375;
 					border-radius: 24rpx;
 					
 					.listIconImage {
-						height: 130rpx;
-						width: 130rpx;
+						height: 80rpx;
+						width: 80rpx;
 						
 					}
 					
@@ -373,11 +358,11 @@
 				.text {
 					text-align: center;
 					font-size: 24rpx;
-					line-height: 30rpx;
+					line-height: 24rpx;
 					margin-top: 10rpx;
 				}
 				
 			}
 		}
 	}
-</style>
\ No newline at end of file
+</style>
diff --git a/pages/index/upload/upload.vue b/pages/index/upload/upload.vue
index c5745a5..1652963 100644
--- a/pages/index/upload/upload.vue
+++ b/pages/index/upload/upload.vue
@@ -215,10 +215,10 @@
 						for (var i = 0; i < tempFilePaths.length; i++) {
 							//const tempFile = e.tempFiles[i];
 							  uni.uploadFile({
-								url: 'http://48uu7a.natappfree.cc/file/upload',
+								url: 'http://pc2zer.natappfree.cc/file/upload',
 								name: 'file',
-								//url: 'http://localhost:7010/file/uploadBatch',
-								//name: 'files',
+								// url: 'http://pc2zer.natappfree.cc/file/uploadBatch',
+								// name: 'files',
 								header:{
 									"Content-Type": "multipart/form-data"
 								},
diff --git a/pages/login/login.vue b/pages/login/login.vue
index 1a80806..0aaa823 100644
--- a/pages/login/login.vue
+++ b/pages/login/login.vue
@@ -1,7 +1,7 @@
 <template>
 	<view class="login-body uni-bg-color">
 		<div class="auto-center">
-			<div class="logo-div"></div>
+			<div class="logo-div">^_^</div>
 			<div class="welcome-text">
 				<p class="welcome-title uni-white">进入次元Hub</p>
 				<p class="welcome-subtitle uni-secondary-color">开启你的创作之旅~</p>
@@ -10,7 +10,7 @@
 				<uni-forms-item required name="phone">
 					<template #label>
 						<div class="form-label l-username">
-							<uni-icons type="contact" size="18" color="#FFC542"></uni-icons>
+							<uni-icons type="contact" size="18" color="#FFFFFF"></uni-icons>
 						</div>
 					</template>
 					<uni-easyinput 
@@ -24,13 +24,13 @@
 				<uni-forms-item required name="password">
 					<template #label>
 						<div class="form-label l-password">
-							<uni-icons type="locked-filled" size="18" color="#FF575F"></uni-icons>
+							<uni-icons type="locked-filled" size="18" color="#FFFFFF"></uni-icons>
 						</div>
 					</template>
 					<uni-easyinput type="password" v-model="formData.password" placeholder="请输入密码" :inputBorder="false" />
 				</uni-forms-item>
 			</uni-forms>
-			<button class="login-btn" type="primary" @click="$noMultipleClicks(login,formData)">登录<uni-icons type="arrow-right" size="20" color="#fff"></uni-icons></button>
+			<button class="login-btn" type="primary" @click="$noMultipleClicks(login,formData)">登录</button>
 			<div class="foget-password uni-secondary-color">
 				<span >忘记密码？</span>
 			</div>
@@ -170,22 +170,24 @@
 <style scoped lang="scss">
 .login-body {
 	min-height: 100vh;
-	background-color: #22343C;
+	background-color: #141b29;
 
 	.auto-center {
 		width: 622rpx;
 		margin: 0 auto;
-		border-top: 1rpx solid #22343C;
-		border-bottom: 1rpx solid #22343C;
+		border-top: 1rpx solid #141b29;
+		border-bottom: 1rpx solid #141b29;
 	}
 
 	.logo-div {
 		width: 86rpx;
 		height: 86rpx;
-		background: linear-gradient(180.00deg, rgba(63.59,223.05,158.63,1) 0%,rgba(62,213,152,1) 100%);
-		box-shadow: 0 4rpx 8rpx rgba(15, 218, 137, 0.3);
+		background: linear-gradient(180.00deg, #30a9c0 0%, #30a9c0 100%);
 		border-radius: 24rpx;
 		margin-top: 154rpx;
+    text-align: center;
+    line-height: 86rpx;
+    font-weight: 600;
 	}
 	.welcome-text {
 		margin-top: 72rpx;
@@ -206,29 +208,28 @@
 		.form-label {
 			width: 76rpx;
 			height: 96rpx;
-			border-radius: 24rpx;
+			border-radius: 24rpx 0 0 24rpx;
 			line-height: 96rpx;
 			text-align: center;
-			margin-right: 24rpx;
-			margin-bottom: 4rpx;
-			margin-top: 4rpx;
 		}
 		
 		.l-username {
-			background: rgb(98, 91, 57);
+			background: #1d2734;
 		}
 		
 		.l-password {
-			background: rgb(98, 58, 66);
+			background: #1d2734;
 		}
 		
 	}
 	
 	.login-btn {
-		background: linear-gradient(180.00deg, rgba(63.59,223.05,158.63,1) 0%,rgba(62,213,152,1) 100%);
-		box-shadow: 0 4rpx 8rpx rgba(15, 218, 137, 0.3);
+    height: 100rpx;
+    line-height: 100rpx;
+		background: linear-gradient(180.00deg, rgba(255, 255, 255, 1) 0%,rgba(255, 255, 255, 1) 100%);
 		border-radius: 24rpx;
 		margin-top: 52rpx;
+    color: #494951;
 	}
 	.foget-password {
 		text-align: right;
@@ -239,22 +240,23 @@
 }
 .login-body {
 	::v-deep .uni-forms-item {
-		margin-bottom: 0 !important; 
+
 	}
 }
 .login-body {
 	::v-deep input {
-		height: 100rpx;
-		border-bottom: 4rpx solid rgba(0, 0, 0, 0.05);
-		background: none !important;
+    height: 96rpx;
+		background: #1d2734 !important;
 		font-size: 36rpx;
 		color: rgb(150, 167, 175);
+    border-radius: 0 24rpx 24rpx 0;
 	}
 }
 
 .login-body {
 	::v-deep .uni-easyinput__content {
-		background: none !important;
+    background: #1d2734 !important;
+    border-radius: 0 24rpx 24rpx 0;
 	}
 }
 </style>
diff --git a/pages/profit/profit.vue b/pages/profit/profit.vue
index 73295db..1ac6e06 100644
--- a/pages/profit/profit.vue
+++ b/pages/profit/profit.vue
@@ -191,7 +191,6 @@ export default {
   created() {
     const userInfo = uni.getStorageSync('userInfo')
     if (!userInfo) {
-    	console.log('havent userInfo')
     	uni.showModal({
     		content: '艺术家账户过期,请重新登录！',
     		showCancel: false,
@@ -204,7 +203,6 @@ export default {
     	});
     } else {
     	this.userInfo = userInfo;
-    	console.log('have userInfo')
     }
     this.queryFrontProfitInfo();
     this.queryFrontPreDownloadAndInviteCount();
@@ -353,7 +351,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .container {
   font-family: ‘Franklin Gothic Medium’, ‘Arial Narrow’, Arial, sans-serif;
 }
diff --git a/pages/userInfo/userInfo.vue b/pages/userInfo/userInfo.vue
index e43fc9f..6ea0f0c 100644
--- a/pages/userInfo/userInfo.vue
+++ b/pages/userInfo/userInfo.vue
@@ -1,38 +1,45 @@
 <template>
 	<view class="container">
 		<view class="top">
-		</view>
-		<view class="my-message">
-			<view class="left">
-				<image :src="userInfo.img" mode=""></image>
-			</view>
-			<view class="right">
-				{{userInfo.name}}
-			</view>
+      <view class="background-image-dim">
+        <image :src="userInfo.img" style="width: 100%; height: 100%;" :model="'center'"></image>
+      </view>
+      <view class="dim-div"></view>
+      <view class="my-message">
+        <view class="left">
+          <image :src="userInfo.img" :model="'center'"></image>
+        </view>
+        <view class="right">
+          <view class="user-info-div">
+            <view class="username uni-white">
+              {{userInfo.name}}
+            </view>
+            <view class="user-info uni-secondary-color">
+              <view class="nums-item">粉丝 <span class="num-span uni-white">{{creatorFansLikeInfo.fansNum}}</span> </view>
+              <view class="nums-item">点赞 <span class="num-span uni-white">{{creatorFansLikeInfo.likeNum}}</span> </view>
+              <view class="nums-item">收藏 <span class="num-span uni-white">{{creatorFansLikeInfo.collectNum}}</span> </view>
+            </view>
+          </view>
+        </view>
+      </view>
 		</view>
 		<view class="middle">
-			<uni-section title="我的数据" type="line" padding>
-				<uni-group mode="card">
-					<view>粉丝数 {{creatorFansLikeInfo.fansNum}} </view>
-					<view>点赞数 {{creatorFansLikeInfo.likeNum}}</view>
-					<view>收藏数 {{creatorFansLikeInfo.collectNum}} </view>
-				</uni-group>
-			</uni-section>
+      <view class="middle-item-box" v-for="(item, index) in middleList" :index="index" :key="index" :class="item.class">
+        <view class="middle-btn-item" @click="change(item)" >
+          <div class="text uni-white">{{item.title}}</div>
+          <image :src="item.img" class="listIconImage" :mode="'aspectFill'" />
+        </view>
+      </view>
 		</view>
 		<view class="foot">
-			<uni-section title="更多服务" type="line">
-				<uni-group mode="card">
-					<uni-grid :column="3" @change="change" :showBorder="false" :square="true">
-						<uni-grid-item v-for="(item, index) in list" :index="index" :key="index">
-							<view class="grid-item-box" style="background-color: #fff;">
-								<!-- <uni-icons type="image" :size="30" color="#777" /> -->
-								<image :src="item.img" class="listIconImage" mode="aspectFill" />
-								<text class="text">{{item.title}}</text>
-							</view>
-						</uni-grid-item>
-					</uni-grid>
-				</uni-group>
-			</uni-section>
+      <view class="foot-item-box" v-for="(item, index) in list" :index="index" :key="index" >
+        <view class="list-click-item" @click="change(item)">
+          <!-- <uni-icons type="image" :size="30" color="#777" /> -->
+          <image :src="item.img" class="listIconImage" :mode="'aspectFill'" />
+          <div class="text uni-white">{{item.title}}</div>
+          <uni-icons type="right" size="12" color="#ffffff" />
+        </view>
+      </view>
 		</view>
 	</view>
 </template>
@@ -44,6 +51,19 @@
 	export default {
 		data() {
 			return {
+			  middleList: [
+          {
+            url: '/pages-userInfo/extends/extends',
+            title: '邀请他人',
+            img: '/static/iconInvite.png',
+            class: 'meddle-invite'
+          }, {
+            url: '/pages-userInfo/withdraw/withdrawIndex',
+            title: '提现记录',
+            img: '/static/iconWithdraw.png',
+            class: 'meddle-withdraw'
+          }
+        ],
 				list: [{
 					url: '/pages-userInfo/about/about',
 					title: '常见问题',
@@ -53,24 +73,19 @@
 					title: '联系我们',
 					img: '/static/iconContactUs.png'
 				}, {
-					url: '/pages-userInfo/extends/extends',
-					title: '邀请他人',
-					img: '/static/iconInvite.png'
-				},  {
 					url: '/pages-userInfo/notice/notice',
 					title: '通知公告',
 					img: '/static/iconNotice.png'
-				}, {
-					url: '/pages-userInfo/withdraw/withdrawIndex',
-					title: '提现记录',
-					img: '/static/iconWithdraw.png'
 				},{
 					url: '/pages-userInfo/setting/setting',
 					title: '系统设置',
 					img: '/static/iconInviteLog.png'
 				}],
 				pageUrl: '',
-				userInfo: {},
+				userInfo: {
+			    name: "Adming",
+          img: "/static/material.png"
+        },
 				creatorFansLikeInfo: {
 					fansNum: 0,
 					likeNum: 0,
@@ -81,7 +96,6 @@
 		created() {
 			const userInfo = uni.getStorageSync('userInfo')
 			if (!userInfo) {
-				console.log('havent userInfo')
 				uni.showModal({
 					content: '艺术家账户过期,请重新登录！',
 					showCancel: false,
@@ -94,21 +108,22 @@
 				});
 			} else {
 				this.userInfo = userInfo;
-				console.log('have userInfo')
 			}
 			//获取粉丝李欢收藏数量
 			this.getCreatorInfoFansLike();
 		},
+    onPullDownRefresh() {
+      this.getCreatorInfoFansLike();
+    },
 		methods: {
 			change(e) {
-				let {
-					index
-				} = e.detail
-				this.pageUrl = this.list[index].url
-				console.log('this.pageUrl', this.pageUrl)
+				// let {
+				// 	index
+				// } = e.detail
+				// this.pageUrl = this.list[index].url
 				/** 跳转指定页面*/
 				uni.navigateTo({
-					url: this.pageUrl
+					url: e.url
 				});
 			},
 			
@@ -117,10 +132,8 @@
 			async getCreatorInfoFansLike() {
 				let that = this;
 				const res = await getCreatorInfoFansLike(that.userInfo.id)
-				console.log('res', res)
 				if (res.data.code === 200) {
 					that.creatorFansLikeInfo = res.data.data
-					console.log('creatorFansLikeInfo', that.creatorFansLikeInfo)
 				} else {
 					uni.showModal({
 						content: '获取粉丝喜欢收藏数量数据加载失败！',
@@ -132,21 +145,63 @@
 	}
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 	.container {
 		font-family: ‘Franklin Gothic Medium’, ‘Arial Narrow’, Arial, sans-serif;
+    min-height: 100vh;
+    background: #141b29;
+
 	}
 
+  .top {
+    width: 100vw;
+    height: 25vh;
+    position: relative;
+
+    .background-image-dim {
+      width: 100%;
+      height: 100%;
+
+      image {
+        width: 100%;
+        height: 100%;
+      }
+
+    }
+
+    .dim-div {
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      top: 0;
+      left: 0;
+      /* 主要内容 */
+      background: rgba(29, 39, 52, .6);
+      /* 模糊大小就是靠的blur这个函数中的数值大小 */
+      backdrop-filter: blur(25rpx);
+    }
+
+    .my-message {
+      width: calc(100% - 80rpx);
+      height: calc(100% - 80rpx);
+      position: absolute;
+      top: 0;
+      left: 0;
+
+    }
+
+  }
+
 	.my-message {
 		display: flex;
 		justify-content: flex-start;
-		align-items: center;
-		padding: 20rpx;
+		align-items: flex-end;
+		padding: 40rpx;
 
 		.left {
-			width: 100rpx;
-			height: 100rpx;
-			margin-right: 20rpx;
+			width: 150rpx;
+			height: 150rpx;
+			margin-right: 40rpx;
 
 			>image {
 				width: 100%;
@@ -157,109 +212,126 @@
 
 		.right {
 			font-size: 12px;
+      height: 150rpx;
+      display: flex;
+      align-items: center;
+
+      .user-info-div {
+
+        .username {
+          font-size: 32rpx;
+          line-height: 48rpx;
+          font-weight: 600;
+        }
+
+        .user-info {
+          display: flex;
+          justify-content: flex-start;
+
+          .nums-item {
+            margin-right: 20rpx;
+
+            .num-span {
+              margin-left: 10rpx;
+            }
+
+          }
+
+
+        }
+
+      }
+
 		}
 	}
 
+  .middle {
+    width: 670rpx;
+    margin: 40rpx auto;
+    display: flex;
+    justify-content: space-between;
 
-	// .container {
-	// 	.top {
-	// 		width: 100vw;
-
-	// 		image {
-	// 			width: 100vw;
-	// 			height: 400rpx;
-	// 		}
-
-	// 		.uni-searchbar {
-	// 			border: 1px solid #11A8FD;
-	// 			margin: 0 40rpx;
-	// 			border-radius: 16rpx;
-	// 			padding: 0;
-
-	// 			.uni-searchbar__box {
-	// 				padding: 0;
-	// 				border-radius: 16rpx !important;
-	// 			}
-	// 		}
-
-	// 		>text {
-	// 			font-weight: bold;
-	// 			font-size: 14px;
-	// 			display: block;
-	// 			text-align: center;
-	// 			padding-top: 40rpx;
-	// 			padding-bottom: 20rpx;
-	// 		}
-
-	// 		.user-list {
-	// 			display: flex;
-	// 			justify-content: flex-start;
-	// 			align-items: center;
-	// 			overflow-x: auto;
-
-	// 			.user-list-box {
-	// 				width: 140rpx;
-	// 				padding: 20rpx;
-	// 				text-align: center;
-
-	// 				image {
-	// 					width: 100rpx;
-	// 					height: 100rpx;
-	// 					border-radius: 100rpx;
-	// 				}
-
-	// 				text {
-	// 					font-size: 24rpx;
-	// 					color: #1E1E1E;
-	// 					text-align: center;
-	// 				}
-	// 			}
-	// 		}
-	// 	}
-
-	// 	.middle {
-	// 		text-align: center;
-	// 		height: calc(100vh - 248rpx);
-	// 		padding-top: 40rpx;
-
-	// 		text {
-	// 			font-weight: bold;
-	// 			font-size: 14px;
-	// 			display: block;
-	// 		}
-
-	// 		image {
-	// 			width: 40rpx;
-	// 			height: 40rpx;
-	// 		}
-	// 	}
-	// }
-	.grid-item-box {
-		flex: 1;
-		// position: relative;
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		padding: 15px 0;
-	}
+    //.meddle-invite {
+    //  background-image: linear-gradient(45deg, #243949 0%, #30a9c0 100%);
+    //}
+    //
+    //.meddle-withdraw {
+    //  background-image: linear-gradient(45deg, #243949 0%, #2580B3 100%);
+    //}
+
+    .middle-item-box {
+      width: 315rpx;
+      height: 150rpx;
+      //background: #1d2734;
+      border-radius: 20rpx;
+      overflow: hidden;
+      backdrop-filter: blur(25rpx);
+      background-image: linear-gradient(45deg, #243949 0%, #30a9c0 100%);
+
+
+      .middle-btn-item {
+        height: 100%;
+        width: 100%;
+        position: relative;
+
+        .listIconImage{
+          width: 140rpx;
+          height: 140rpx;
+          position: absolute;
+          bottom: -20rpx;
+          left: -20rpx;
+        }
+
+        .text {
+          text-align: right;
+          font-size: 32rpx;
+          line-height: 40rpx;
+          width: 500rpx;
+          position: absolute;
+          top: 30rpx;
+          right: 30rpx;
+        }
+
+      }
+
+    }
+
+  }
+
+  .foot {
+    width: 670rpx;
+    margin: 0 auto;
+
+    .foot-item-box {
+      width: calc(100% - 40rpx);
+      background: #1d2734;
+      border-radius: 20rpx;
+      padding: 20rpx;
+      margin-bottom: 20rpx;
+
+      .list-click-item {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 60rpx;
+
+        .listIconImage{
+          width: 40rpx;
+          height: 40rpx;
+        }
+
+        .text {
+          font-size: 24rpx;
+          line-height: 40rpx;
+          width: 500rpx;
+        }
+
+
+
+      }
+
+    }
+
+  }
 
-	.grid-item-box-row {
-		flex: 1;
-		// position: relative;
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		flex-direction: row;
-		align-items: center;
-		justify-content: center;
-		padding: 15px 0;
-	}
-	
-	.listIconImage{
-		width:2rem;
-		height:2rem;
-	}
 </style>
diff --git a/static/emoBack.png b/static/emoBack.png
index 63ce6cb..330f6f2 100644
Binary files a/static/emoBack.png and b/static/emoBack.png differ
diff --git a/static/friendBack.png b/static/friendBack.png
index 6b0acba..c421c27 100644
Binary files a/static/friendBack.png and b/static/friendBack.png differ
diff --git a/static/gifBack.png b/static/gifBack.png
index 0628a7b..5bf8678 100644
Binary files a/static/gifBack.png and b/static/gifBack.png differ
diff --git a/static/headBack.png b/static/headBack.png
index 05c398d..6ad2db3 100644
Binary files a/static/headBack.png and b/static/headBack.png differ
diff --git a/static/iconAbout.png b/static/iconAbout.png
index deacafc..3df24cf 100644
Binary files a/static/iconAbout.png and b/static/iconAbout.png differ
diff --git a/static/iconContactUs.png b/static/iconContactUs.png
index 582e24e..ba13d0e 100644
Binary files a/static/iconContactUs.png and b/static/iconContactUs.png differ
diff --git a/static/iconInvite.png b/static/iconInvite.png
index a5079fe..1bd2991 100644
Binary files a/static/iconInvite.png and b/static/iconInvite.png differ
diff --git a/static/iconInviteLog.png b/static/iconInviteLog.png
index ad9d643..31b2869 100644
Binary files a/static/iconInviteLog.png and b/static/iconInviteLog.png differ
diff --git a/static/iconNotice.png b/static/iconNotice.png
index b4bf4fd..34b883d 100644
Binary files a/static/iconNotice.png and b/static/iconNotice.png differ
diff --git a/static/iconWithdraw.png b/static/iconWithdraw.png
index 782a823..c3d69de 100644
Binary files a/static/iconWithdraw.png and b/static/iconWithdraw.png differ
diff --git a/static/index-default.png b/static/index-default.png
index b57450a..574b284 100644
Binary files a/static/index-default.png and b/static/index-default.png differ
diff --git a/static/index-select.png b/static/index-select.png
index 1a7f689..0dcef62 100644
Binary files a/static/index-select.png and b/static/index-select.png differ
diff --git a/static/iwatchBack.png b/static/iwatchBack.png
index 3fa53f2..766ce7b 100644
Binary files a/static/iwatchBack.png and b/static/iwatchBack.png differ
diff --git a/static/material.png b/static/material.png
index 6b31c22..f00a4ba 100644
Binary files a/static/material.png and b/static/material.png differ
diff --git a/static/mine-default.png b/static/mine-default.png
index b908584..ddb7327 100644
Binary files a/static/mine-default.png and b/static/mine-default.png differ
diff --git a/static/mine-select.png b/static/mine-select.png
index 2a9d810..c05c7d7 100644
Binary files a/static/mine-select.png and b/static/mine-select.png differ
diff --git a/static/phoneBack.png b/static/phoneBack.png
index 02fc775..fd6bf64 100644
Binary files a/static/phoneBack.png and b/static/phoneBack.png differ
diff --git a/static/theme-default.png b/static/theme-default.png
index 14a009e..612d104 100644
Binary files a/static/theme-default.png and b/static/theme-default.png differ
diff --git a/static/theme-select.png b/static/theme-select.png
index 032a098..036a135 100644
Binary files a/static/theme-select.png and b/static/theme-select.png differ
diff --git a/static/upload.png b/static/upload.png
index 74d384d..7bc791c 100644
Binary files a/static/upload.png and b/static/upload.png differ