diff --git a/package-lock.json b/package-lock.json
index df664b6..b4fdc0b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,167 +1,6 @@
 {
-  "name": "bnyer-cloud-hub",
-  "lockfileVersion": 2,
   "requires": true,
-  "packages": {
-    "": {
-      "dependencies": {
-        "axios": "^0.26.1",
-        "js-md5": "^0.7.3",
-        "qs": "^6.10.3",
-        "vue-router": "^4.0.14",
-        "vuex": "^4.0.2"
-      }
-    },
-    "node_modules/@vue/devtools-api": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.2.0.tgz",
-      "integrity": "sha512-pF1G4wky+hkifDiZSWn8xfuLOJI1ZXtuambpBEYaf7Xaf6zC/pM29rvAGpd3qaGXnr4BAXU1Pxz/VfvBGwexGA=="
-    },
-    "node_modules/axios": {
-      "version": "0.26.1",
-      "resolved": "https://registry.npmmirror.com/axios/-/axios-0.26.1.tgz",
-      "integrity": "sha512-fPwcX4EvnSHuInCMItEhAGnaSEXRBjtzh9fOtsE6E1G6p7vl7edEeZe11QHf18+6+9gR5PbKV/sGKNaD8YaMeA==",
-      "dependencies": {
-        "follow-redirects": "^1.14.8"
-      }
-    },
-    "node_modules/call-bind": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmmirror.com/call-bind/-/call-bind-1.0.2.tgz",
-      "integrity": "sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==",
-      "dependencies": {
-        "function-bind": "^1.1.1",
-        "get-intrinsic": "^1.0.2"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/follow-redirects": {
-      "version": "1.15.1",
-      "resolved": "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.1.tgz",
-      "integrity": "sha512-yLAMQs+k0b2m7cVxpS1VKJVvoz7SS9Td1zss3XRwXj+ZDH00RJgnuLx7E44wx02kQLrdM3aOOy+FpzS7+8OizA==",
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://github.com/sponsors/RubenVerborgh"
-        }
-      ],
-      "engines": {
-        "node": ">=4.0"
-      },
-      "peerDependenciesMeta": {
-        "debug": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/function-bind": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmmirror.com/function-bind/-/function-bind-1.1.1.tgz",
-      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
-    },
-    "node_modules/get-intrinsic": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmmirror.com/get-intrinsic/-/get-intrinsic-1.1.2.tgz",
-      "integrity": "sha512-Jfm3OyCxHh9DJyc28qGk+JmfkpO41A4XkneDSujN9MDXrm4oDKdHvndhZ2dN94+ERNfkYJWDclW6k2L/ZGHjXA==",
-      "dependencies": {
-        "function-bind": "^1.1.1",
-        "has": "^1.0.3",
-        "has-symbols": "^1.0.3"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/has": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmmirror.com/has/-/has-1.0.3.tgz",
-      "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
-      "dependencies": {
-        "function-bind": "^1.1.1"
-      },
-      "engines": {
-        "node": ">= 0.4.0"
-      }
-    },
-    "node_modules/has-symbols": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmmirror.com/has-symbols/-/has-symbols-1.0.3.tgz",
-      "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/js-md5": {
-      "version": "0.7.3",
-      "resolved": "https://registry.npmjs.org/js-md5/-/js-md5-0.7.3.tgz",
-      "integrity": "sha512-ZC41vPSTLKGwIRjqDh8DfXoCrdQIyBgspJVPXHBGu4nZlAEvG3nf+jO9avM9RmLiGakg7vz974ms99nEV0tmTQ=="
-    },
-    "node_modules/object-inspect": {
-      "version": "1.12.2",
-      "resolved": "https://registry.npmmirror.com/object-inspect/-/object-inspect-1.12.2.tgz",
-      "integrity": "sha512-z+cPxW0QGUp0mcqcsgQyLVRDoXFQbXOwBaqyF7VIgI4TWNQsDHrBpUQslRmIfAoYWdYzs6UlKJtB2XJpTaNSpQ==",
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/qs": {
-      "version": "6.11.0",
-      "resolved": "https://registry.npmmirror.com/qs/-/qs-6.11.0.tgz",
-      "integrity": "sha512-MvjoMCJwEarSbUYk5O+nmoSzSutSsTwF85zcHPQ9OrlFoZOYIjaqBAJIqIXjptyD5vThxGq52Xu/MaJzRkIk4Q==",
-      "dependencies": {
-        "side-channel": "^1.0.4"
-      },
-      "engines": {
-        "node": ">=0.6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/side-channel": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmmirror.com/side-channel/-/side-channel-1.0.4.tgz",
-      "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==",
-      "dependencies": {
-        "call-bind": "^1.0.0",
-        "get-intrinsic": "^1.0.2",
-        "object-inspect": "^1.9.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/vue-router": {
-      "version": "4.0.16",
-      "resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.0.16.tgz",
-      "integrity": "sha512-JcO7cb8QJLBWE+DfxGUL3xUDOae/8nhM1KVdnudadTAORbuxIC/xAydC5Zr/VLHUDQi1ppuTF5/rjBGzgzrJNA==",
-      "dependencies": {
-        "@vue/devtools-api": "^6.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/posva"
-      },
-      "peerDependencies": {
-        "vue": "^3.2.0"
-      }
-    },
-    "node_modules/vuex": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmmirror.com/vuex/-/vuex-4.0.2.tgz",
-      "integrity": "sha512-M6r8uxELjZIK8kTKDGgZTYX/ahzblnzC4isU1tpmEuOIIKmV+TRdc+H4s8ds2NuZ7wpUTdGRzJRtoj+lI+pc0Q==",
-      "dependencies": {
-        "@vue/devtools-api": "^6.0.0-beta.11"
-      },
-      "peerDependencies": {
-        "vue": "^3.0.2"
-      }
-    }
-  },
+  "lockfileVersion": 1,
   "dependencies": {
     "@vue/devtools-api": {
       "version": "6.2.0",
diff --git a/pages/profit/profit.vue b/pages/profit/profit.vue
index 9ba1cae..dbf622a 100644
--- a/pages/profit/profit.vue
+++ b/pages/profit/profit.vue
@@ -1,272 +1,682 @@
 <template>
-	<view class="container">
-		<view class="top">
-			<uni-notice-bar show-get-more show-icon more-text="查看更多" :text="noticeList[0].content" @getmore="getMore" />
-			<uni-section title="昨日收益" type="line">
-				<uni-group mode="card">
-					<view>广告收益:{{profitInfo.yesterdayAdProfit}}</view>
-					<view>邀请收益:{{profitInfo.yesterdayInviteProfit}}</view>
-					<view>总收益:{{profitInfo.totalProfit}}</view>
-					<view>上月收益:{{profitInfo.lastMonthProfit}}</view>
-					<view>当月收益:{{profitInfo.thisMonthProfit}}</view>
-				</uni-group>
-			</uni-section>
-		</view>
-		<view class="middle">
-			<uni-section title="收益明细" type="line">
-				<uni-group mode="card">
-					<uni-segmented-control :current="current" :values="items" :style-type="styleType"
-						:active-color="activeColor" @clickItem="onClickItem" />
-					<view class="content">
-						<view v-if="current === 0">
-							<uni-collapse>
-								<uni-collapse-item title="广告" :show-animation="true">
-									<view class="content"
-										v-for="(item,index) in downloadAndInviteCountInfo.creatorProfitDownloadCount"
-										:key="index">
-										<text class="text" @click="linkTo(0,0)">日期:{{item.createTime}}---</text>
-										<text class="text">次数:{{item.downloadNum}}</text>
-									</view>
-								</uni-collapse-item>
-								<uni-collapse-item title="邀请" :show-animation="true">
-									<view class="content"
-										v-for="(item,index) in downloadAndInviteCountInfo.creatorProfitInviteCount"
-										:key="index">
-										<text class="text" @click="linkTo(1,0)">日期:{{item.createTime}}---</text>
-										<text class="text">次数:{{item.inviteDownloadNum}}</text>
-									</view>
-								</uni-collapse-item>
-							</uni-collapse>
-						</view>
-						<view v-if="current === 1">
-							<uni-collapse>
-								<uni-collapse-item title="广告" :show-animation="true">
-									<view class="content">
-										<text class="text" @click="linkTo(0,1)">额度:{{inProfitInfo.profit}}</text>
-									</view>
-								</uni-collapse-item>
-								<uni-collapse-item title="邀请" :show-animation="true">
-									<view class="content">
-										<text class="text" @click="linkTo(1,1)">额度:{{inProfitInfo.inviteProfit}}</text>
-									</view>
-								</uni-collapse-item>
-							</uni-collapse>
-						</view>
-						<view v-if="current === 2">
-							<uni-collapse>
-								<uni-collapse-item title="广告" :show-animation="true">
-									<view class="content">
-										<text class="text" @click="linkTo(0,2)">额度:{{endProfitInfo.profit}}</text>
-									</view>
-								</uni-collapse-item>
-								<uni-collapse-item title="邀请" :show-animation="true">
-									<view class="content">
-										<text class="text" @click="linkTo(1,2)">额度:{{endProfitInfo.inviteProfit}}</text>
-									</view>
-								</uni-collapse-item>
-							</uni-collapse>
-						</view>
-					</view>
+  <view class="container">
+    <view class="top">
+      <uni-notice-bar
+        show-get-more
+        show-icon
+        more-text="查看更多"
+        :text="noticeList[0].content"
+        @getmore="getMore"
+      />
+      <view class="back">
+        <view class="back-top"></view>
+        <view class="uni-radius back-con uni-shadow-sm">
+          <view class="">
+            <view class="back-con-top"> 昨日收益 </view>
+            <view class="back-con-mid">
+              <view class="back-con-mid-left">
+                广告收益
+                <view class="top-text">
+                  ¥ {{ profitInfo.yesterdayAdProfit }}
+                </view>
+              </view>
+              <view class="border"></view>
+              <view class="back-con-mid-right">
+                邀请收益
+                <view class="top-text">
+                  ¥ {{ profitInfo.yesterdayInviteProfit }}
+                </view>
+              </view>
+            </view>
+          </view>
+          <view class="back-con-bot uni-radius uni-shadow-sm">
+            <view class="back-con-bot-left">
+              累计
+              <view class="top-text size14">
+                ¥ {{ profitInfo.totalProfit }}
+              </view>
+            </view>
+            <view class="border"></view>
+            <view class="back-con-bot-mid">
+              上月
+              <view class="top-text size14">
+                ¥ {{ profitInfo.lastMonthProfit }}
+              </view>
+            </view>
+            <view class="border"></view>
+            <view class="back-con-bot-right">
+              当月
+              <view class="top-text size14">
+                ¥ {{ profitInfo.thisMonthProfit }}
+              </view>
+            </view>
+          </view>
+        </view>
+        <!-- 				<uni-section class="back-bot" title="昨日收益" type="line">
+					<uni-group mode="card">
+						<view>广告收益:{{profitInfo.yesterdayAdProfit}}</view>
+						<view>邀请收益:{{profitInfo.yesterdayInviteProfit}}</view>
+						<view>总收益:{{profitInfo.totalProfit}}</view>
+						<view>上月收益:{{profitInfo.lastMonthProfit}}</view>
+						<view>当月收益:{{profitInfo.thisMonthProfit}}</view>
+					</uni-group>
+				</uni-section> -->
+      </view>
+      <view class="back2">
+        <view class="uni-radius back-con2 uni-shadow-sm">
+          <view class="" style="width: 100%">
+            <view class="back-con-top"> 收益明细 </view>
+            <view class="segmented">
+              <view v-for="(item, index) in items" :key="index">
+                <view
+                  @click="segActive(index)"
+                  v-if="item != ''"
+                  :class="[
+                    'segmented-con',
+                    index == active ? 'activecolor' : '',
+                  ]"
+                >
+                  {{ item }}
+                  <image
+                    :class="['img1', index == active ? 'show' : '']"
+                    src="/static/active.png"
+                  ></image>
+                </view>
+                <image v-else class="img" src="/static/right.png"></image>
+              </view>
+            </view>
+            <!-- 即将入账 -->
+            <view v-show="active == 0">
+              <view class="adver">
+                <view class="adver-top">
+                  <view class="circular"></view>
+                  <view class="adver-top-text"> 广告: </view>
+                </view>
+                <view class="adver-mid">
+                  抖音/快手均为次日结算前日ECPM价格
+                </view>
+              </view>
+              <uni-list>
+                <uni-list-item title="曝光" link>
+                  <template v-slot:footer>
+                    <view class="blue"> 0次 </view>
+                  </template>
+                </uni-list-item>
+                <uni-list-item title="邀请" link>
+                  <template v-slot:footer>
+                    <view class="blue"> [07月08日] 0次 </view>
+                  </template>
+                </uni-list-item>
+              </uni-list>
+            </view>
+            <!-- 已入账 -->
+            <view v-show="active == 2">
+              <view class="adver">
+                <view class="adver-top">
+                  <view class="circular"></view>
+                  <view class="adver-top-text"> 广告: </view>
+                </view>
+                <view class="adver-mid"> 2022.06.05 至 2022.07.20 </view>
+              </view>
+              <uni-list>
+                <uni-list-item title="曝光" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 2.376 </view>
+                  </template>
+                </uni-list-item>
+                <uni-list-item title="邀请" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 0.23 </view>
+                  </template>
+                </uni-list-item>
+              </uni-list>
+              <view class="adver">
+                <view class="adver-top">
+                  <view class="circular"></view>
+                  <view class="adver-top-text"> 订单: </view>
+                </view>
+                <view class="adver-mid"> 会员订单及时入账，T+7即可提现 </view>
+              </view>
+              <uni-list>
+                <uni-list-item title="会员" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 0</view>
+                  </template>
+                </uni-list-item>
+                <uni-list-item title="邀请" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 0 </view>
+                  </template>
+                </uni-list-item>
+              </uni-list>
+            </view>
+            <!-- 已转入钱包 -->
+            <view v-show="active == 4">
+              <view class="adver">
+                <view class="adver-top">
+                  <view class="circular"></view>
+                  <view class="adver-top-text"> 广告: </view>
+                </view>
+              </view>
+              <uni-list>
+                <uni-list-item title="曝光" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 0 </view>
+                  </template>
+                </uni-list-item>
+                <uni-list-item title="邀请" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 0 </view>
+                  </template>
+                </uni-list-item>
+              </uni-list>
+              <view class="adver">
+                <view class="adver-top">
+                  <view class="circular"></view>
+                  <view class="adver-top-text"> 订单: </view>
+                </view>
+              </view>
+              <uni-list>
+                <uni-list-item title="会员" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 0 </view>
+                  </template>
+                </uni-list-item>
+                <uni-list-item title="邀请" link>
+                  <template v-slot:footer>
+                    <view class="blue"> ¥ 0 </view>
+                  </template>
+                </uni-list-item>
+              </uni-list>
+            </view>
+            <!-- <view class="back-con-mid">
+            <view class="back-con-mid-left">
+              广告收益
+              <view class="top-text">
+                ¥ {{ profitInfo.yesterdayAdProfit }}
+              </view>
+            </view>
+            <view class="border"></view>
+            <view class="back-con-mid-right">
+              邀请收益
+              <view class="top-text">
+                ¥ {{ profitInfo.yesterdayInviteProfit }}
+              </view>
+            </view>
+          </view> -->
+          </view>
+        </view>
+        <!-- 				<uni-section class="back-bot" title="昨日收益" type="line">
+					<uni-group mode="card">
+						<view>广告收益:{{profitInfo.yesterdayAdProfit}}</view>
+						<view>邀请收益:{{profitInfo.yesterdayInviteProfit}}</view>
+						<view>总收益:{{profitInfo.totalProfit}}</view>
+						<view>上月收益:{{profitInfo.lastMonthProfit}}</view>
+						<view>当月收益:{{profitInfo.thisMonthProfit}}</view>
+					</uni-group>
+				</uni-section> -->
+      </view>
+    </view>
 
-				</uni-group>
-			</uni-section>
-		</view>
-	</view>
+    <!-- <view class="middle">
+      <uni-section title="收益明细" type="line">
+        <uni-group mode="card">
+          <uni-segmented-control
+            :current="current"
+            :values="items"
+            :style-type="styleType"
+            :active-color="activeColor"
+            @clickItem="onClickItem"
+          />
+          <view class="content">
+            <view v-if="current === 0">
+              <uni-collapse>
+                <uni-collapse-item title="广告" :show-animation="true">
+                  <view
+                    class="content"
+                    v-for="(
+                      item, index
+                    ) in downloadAndInviteCountInfo.creatorProfitDownloadCount"
+                    :key="index"
+                  >
+                    <text class="text" @click="linkTo(0, 0)"
+                      >日期:{{ item.createTime }}---</text
+                    >
+                    <text class="text">次数:{{ item.downloadNum }}</text>
+                  </view>
+                </uni-collapse-item>
+                <uni-collapse-item title="邀请" :show-animation="true">
+                  <view
+                    class="content"
+                    v-for="(
+                      item, index
+                    ) in downloadAndInviteCountInfo.creatorProfitInviteCount"
+                    :key="index"
+                  >
+                    <text class="text" @click="linkTo(1, 0)"
+                      >日期:{{ item.createTime }}---</text
+                    >
+                    <text class="text">次数:{{ item.inviteDownloadNum }}</text>
+                  </view>
+                </uni-collapse-item>
+              </uni-collapse>
+            </view>
+            <view v-if="current === 1">
+              <uni-collapse>
+                <uni-collapse-item title="广告" :show-animation="true">
+                  <view class="content">
+                    <text class="text" @click="linkTo(0, 1)"
+                      >额度:{{ inProfitInfo.profit }}</text
+                    >
+                  </view>
+                </uni-collapse-item>
+                <uni-collapse-item title="邀请" :show-animation="true">
+                  <view class="content">
+                    <text class="text" @click="linkTo(1, 1)"
+                      >额度:{{ inProfitInfo.inviteProfit }}</text
+                    >
+                  </view>
+                </uni-collapse-item>
+              </uni-collapse>
+            </view>
+            <view v-if="current === 2">
+              <uni-collapse>
+                <uni-collapse-item title="广告" :show-animation="true">
+                  <view class="content">
+                    <text class="text" @click="linkTo(0, 2)"
+                      >额度:{{ endProfitInfo.profit }}</text
+                    >
+                  </view>
+                </uni-collapse-item>
+                <uni-collapse-item title="邀请" :show-animation="true">
+                  <view class="content">
+                    <text class="text" @click="linkTo(1, 2)"
+                      >额度:{{ endProfitInfo.inviteProfit }}</text
+                    >
+                  </view>
+                </uni-collapse-item>
+              </uni-collapse>
+            </view>
+          </view>
+        </uni-group>
+      </uni-section>
+    </view> -->
+  </view>
 </template>
 
 <script>
-	import {
-		queryFrontProfitInfo, //查询指定艺术家收益统计
-		queryFrontPreDownloadAndInviteCount, //查询指定艺术家即将入账广告及邀请次数列表
-		queryFrontPreProfit, //查询指定艺术家即将入账收益列表
-		queryFrontInOrOutAmt, //查询指定艺术家已入账/转入钱包累计收益
-	} from '@/api/profit.js'
-	import {
-		getNoticeList
-	} from '@/api/userInfo.js'
-	export default {
-		data() {
-			return {
-				nvueWidth: 730,
-				profitInfo: {
-					yesterdayAdProfit: 0,
-					yesterdayInviteProfit: 0,
-					totalProfit: 0,
-					lastMonthProfit: 0,
-					thisMonthProfit: 0
-				},
-				downloadAndInviteCountInfo: {},
-				profitList: [],
-				items: ['即将入账', '已入账', '已转入钱包'],
-				current: 0,
-				activeColor: '#007aff',
-				styleType: 'text',
-				inProfitInfo: {},
-				endProfitInfo: {},
-				userInfo: {},
-				noticeList: [],
-				pageSize: 10,
-				pageNum: 1
-			}
-		},
-		// 下拉刷新
-		onPullDownRefresh() {
-			uni.stopPullDownRefresh()
-		},
-		created() {
-			const userInfoSync = uni.getStorageSync('userInfo')
-			this.userInfo = userInfoSync
-			this.queryFrontProfitInfo();
-			this.queryFrontPreDownloadAndInviteCount()
-			this.queryFrontInAmt()
-			this.queryFrontEndAmt()
-			this.getNoticeList()
-		},
-		methods: {
+import {
+  queryFrontProfitInfo, //查询指定艺术家收益统计
+  queryFrontPreDownloadAndInviteCount, //查询指定艺术家即将入账广告及邀请次数列表
+  queryFrontPreProfit, //查询指定艺术家即将入账收益列表
+  queryFrontInOrOutAmt, //查询指定艺术家已入账/转入钱包累计收益
+} from "@/api/profit.js";
+import { getNoticeList } from "@/api/userInfo.js";
+export default {
+  data() {
+    return {
+      nvueWidth: 730,
+      profitInfo: {
+        yesterdayAdProfit: 0,
+        yesterdayInviteProfit: 0,
+        totalProfit: 0,
+        lastMonthProfit: 0,
+        thisMonthProfit: 0,
+      },
+      downloadAndInviteCountInfo: {},
+      profitList: [],
+      items: ["即将入账", "", "已入账", "", "已转入钱包"],
+      current: 0,
+      activeColor: "#007aff",
+      styleType: "text",
+      inProfitInfo: {},
+      endProfitInfo: {},
+      userInfo: {},
+      noticeList: [],
+      pageSize: 10,
+      pageNum: 1,
+      active: 0,
+    };
+  },
+  // 下拉刷新
+  onPullDownRefresh() {
+    uni.stopPullDownRefresh();
+  },
+  created() {
+    const userInfoSync = uni.getStorageSync("userInfo");
+    this.userInfo = userInfoSync;
+    this.queryFrontProfitInfo();
+    this.queryFrontPreDownloadAndInviteCount();
+    this.queryFrontInAmt();
+    this.queryFrontEndAmt();
+    this.getNoticeList();
+  },
+  methods: {
+    // 获取艺术家收益统计
+    async queryFrontProfitInfo() {
+      const res = await queryFrontProfitInfo(this.userInfo.id);
+      //console.log('res', res)
+      if (res.data.code === 200) {
+        this.profitInfo = res.data.data;
+        //console.log('profitInfo', this.profitInfo)
+      } else {
+        uni.showModal({
+          content: "收益统计加载失败！",
+          showCancel: false,
+        });
+      }
+    },
 
-			// 获取艺术家收益统计
-			async queryFrontProfitInfo() {
-				const res = await queryFrontProfitInfo(this.userInfo.id)
-				//console.log('res', res)
-				if (res.data.code === 200) {
-					this.profitInfo = res.data.data
-					//console.log('profitInfo', this.profitInfo)
-				} else {
-					uni.showModal({
-						content: '收益统计加载失败！',
-						showCancel: false
-					});
-				}
-			},
+    // 查询指定艺术家即将入账广告及邀请次数列表
+    async queryFrontPreDownloadAndInviteCount() {
+      const res = await queryFrontPreDownloadAndInviteCount(this.userInfo.id);
+      //console.log('res', res)
+      if (res.data.code === 200) {
+        this.downloadAndInviteCountInfo = res.data.data;
+        //console.log('downloadAndInviteCountInfo', this.downloadAndInviteCountInfo)
+      } else {
+        uni.showModal({
+          content: "收益统计次数加载失败！",
+          showCancel: false,
+        });
+      }
+    },
 
-			// 查询指定艺术家即将入账广告及邀请次数列表
-			async queryFrontPreDownloadAndInviteCount() {
-				const res = await queryFrontPreDownloadAndInviteCount(this.userInfo.id)
-				//console.log('res', res)
-				if (res.data.code === 200) {
-					this.downloadAndInviteCountInfo = res.data.data
-					//console.log('downloadAndInviteCountInfo', this.downloadAndInviteCountInfo)
-				} else {
-					uni.showModal({
-						content: '收益统计次数加载失败！',
-						showCancel: false
-					});
-				}
-			},
+    // 查询指定艺术家已入账累计收益
+    async queryFrontInAmt() {
+      const res = await queryFrontInOrOutAmt({
+        creatorId: this.userInfo.id,
+        status: "1",
+      });
+      //console.log('InAmt', res)
+      if (res.data.code === 200) {
+        this.inProfitInfo = res.data.data;
+      } else {
+        uni.showModal({
+          content: "已入账收益加载失败！",
+          showCancel: false,
+        });
+      }
+    },
 
-			// 查询指定艺术家已入账累计收益
-			async queryFrontInAmt() {
-				const res = await queryFrontInOrOutAmt({
-					creatorId: this.userInfo.id,
-					status: '1'
-				})
-				//console.log('InAmt', res)
-				if (res.data.code === 200) {
-					this.inProfitInfo = res.data.data
-				} else {
-					uni.showModal({
-						content: '已入账收益加载失败！',
-						showCancel: false
-					});
-				}
-			},
+    // 查询指定艺术家转入钱包累计收益
+    async queryFrontEndAmt() {
+      const res = await queryFrontInOrOutAmt({
+        creatorId: this.userInfo.id,
+        status: "2",
+      });
+      //console.log('endAmt', res)
+      if (res.data.code === 200) {
+        this.endProfitInfo = res.data.data;
+      } else {
+        uni.showModal({
+          content: "转入钱包收益加载失败！",
+          showCancel: false,
+        });
+      }
+    },
 
-			// 查询指定艺术家转入钱包累计收益
-			async queryFrontEndAmt() {
-				const res = await queryFrontInOrOutAmt({
-					creatorId: this.userInfo.id,
-					status: '2'
-				})
-				//console.log('endAmt', res)
-				if (res.data.code === 200) {
-					this.endProfitInfo = res.data.data
-				} else {
-					uni.showModal({
-						content: '转入钱包收益加载失败！',
-						showCancel: false
-					});
-				}
-			},
+    // 获取公告分页
+    async getNoticeList() {
+      const res = await getNoticeList({
+        pageSize: this.pageSize,
+        pageNum: this.pageNum,
+      });
+      //console.log('res', res)
+      if (res.data.code === 200) {
+        this.noticeList = res.data.rows;
+        //console.log('noticeList', this.noticeList)
+      } else {
+        uni.showModal({
+          content: "公告列表加载失败！",
+          showCancel: false,
+        });
+      }
+    },
 
-			// 获取公告分页
-			async getNoticeList() {
-				const res = await getNoticeList({
-					pageSize: this.pageSize,
-					pageNum: this.pageNum,
-				})
-				//console.log('res', res)
-				if (res.data.code === 200) {
-					this.noticeList = res.data.rows
-					//console.log('noticeList', this.noticeList)
-				} else {
-					uni.showModal({
-						content: '公告列表加载失败！',
-						showCancel: false
-					});
-				}
-			},
+    // 跳转即将到账收益详情页(status:0->即将入账;1->已入账;2->转入钱包)
+    linkTo(typeId, status) {
+      if (status === 0) {
+        uni.setStorage({
+          key: "typeId",
+          data: typeId,
+          success() {
+            uni.navigateTo({
+              url: "../profit/profitPreDetails",
+            });
+          },
+        });
+      } else if (status === 1) {
+        uni.setStorage({
+          key: "typeId",
+          data: typeId,
+          success() {
+            uni.navigateTo({
+              url: "../profit/profitInDetails",
+            });
+          },
+        });
+      } else {
+        uni.setStorage({
+          key: "typeId",
+          data: typeId,
+          success() {
+            uni.navigateTo({
+              url: "../profit/profitEndDetails",
+            });
+          },
+        });
+      }
+    },
+    onClickItem(e) {
+      if (this.current !== e.currentIndex) {
+        this.current = e.currentIndex;
+      }
+    },
 
-			// 跳转即将到账收益详情页(status:0->即将入账;1->已入账;2->转入钱包)
-			linkTo(typeId, status) {
-				if (status === 0) {
-					uni.setStorage({
-						key: 'typeId',
-						data: typeId,
-						success() {
-							uni.navigateTo({
-								url: '../profit/profitPreDetails'
-							})
-						}
-					})
-				} else if (status === 1) {
-					uni.setStorage({
-						key: 'typeId',
-						data: typeId,
-						success() {
-							uni.navigateTo({
-								url: '../profit/profitInDetails'
-							})
-						}
-					})
-				} else {
-					uni.setStorage({
-						key: 'typeId',
-						data: typeId,
-						success() {
-							uni.navigateTo({
-								url: '../profit/profitEndDetails'
-							})
-						}
-					})
-				}
-			},
-			onClickItem(e) {
-				if (this.current !== e.currentIndex) {
-					this.current = e.currentIndex
-				}
-			},
-
-			//查看更多公告
-			getMore() {
-				uni.navigateTo({
-					url: '../../pages-userInfo/notice/notice',
-				})
-			}
-		},
-	}
+    //查看更多公告
+    getMore() {
+      uni.navigateTo({
+        url: "../../pages-userInfo/notice/notice",
+      });
+    },
+    segActive(index) {
+      this.active = index;
+    },
+  },
+};
 </script>
 
 <style lang="scss">
-	.container {
-		font-family: ‘Franklin Gothic Medium’, ‘Arial Narrow’, Arial, sans-serif;
-	}
+.container {
+  font-family: ‘Franklin Gothic Medium’, ‘Arial Narrow’, Arial, sans-serif;
+}
+.back {
+  width: 100%;
+  height: 320px;
+  position: relative;
+}
+.back2 {
+  width: 100%;
+  // height: 320px;
+  // position: relative;
+  // top: -60px;
+}
+.back-top {
+  width: 100%;
+  position: absolute;
+  height: 120px;
+  background: #416bdc;
+}
+.back-con {
+  width: 95%;
+  left: 50%;
+  top: 42%;
+  transform: translate(-50%, -50%);
+  background-color: white;
+  position: absolute;
+  height: 220px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+}
+.back-con2 {
+  width: 95%;
+  padding: 0 16px;
+  box-sizing: border-box;
+  left: 50%;
+  top: 515px;
+  transform: translate(-50%, -50%);
+  background-color: white;
+  position: absolute;
+  height: 415px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 20px;
+}
+.back-bot {
+  width: 100%;
+  position: absolute;
+  top: 80px;
+}
+.back-con-top {
+  font-size: 20px;
+  font-weight: 600;
+  margin: 20px 0 15px 0;
+  display: flex;
+  justify-content: center;
+}
+.back-con-mid {
+  display: flex;
+  align-items: center;
+}
+.border {
+  width: 1px;
+  height: 30px;
+  background-color: rgb(165, 165, 165);
+}
+.back-con-mid-left {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: rgb(165, 165, 165);
+  padding-right: 40px;
+  // border-right: 1px solid #ccc;
+}
+.back-con-mid-right {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: rgb(165, 165, 165);
+  padding-left: 40px;
+}
+
+.back-con-bot {
+  width: 100%;
+  height: 80px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
 
-	.uni-padding-wrap {
-		// width: 750rpx;
-		padding: 0px 30px;
-	}
+.back-con-bot-left {
+  width: 33.33%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #a5a5a5;
+}
+.back-con-bot-mid {
+  width: 33.33%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #a5a5a5;
+}
+.back-con-bot-right {
+  width: 33.33%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #a5a5a5;
+}
+.uni-padding-wrap {
+  // width: 750rpx;
+  padding: 0px 30px;
+}
 
-	.uni-common-mt {
-		margin-top: 30px;
-	}
+.uni-common-mt {
+  margin-top: 30px;
+}
+.segmented {
+  display: flex;
+  justify-content: center;
+  // align-items: center;
+}
+.segmented-con {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: #a5a5a5;
+}
+.img1 {
+  width: 15px;
+  height: 10px;
+  margin-top: 7px;
+  visibility: hidden;
+}
+.img {
+  width: 18px;
+  height: 15px;
+  margin: 0 20px;
+}
+.top-text {
+  font-size: 20px;
+  margin-top: 12px;
+  color: red;
+}
+.size14 {
+  font-size: 16px;
+}
+.show {
+  visibility: visible;
+}
+.activecolor {
+  color: #4d6cff;
+}
+.circular {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background-color: #4d6cff;
+  margin-right: 10px;
+}
+.adver {
+  margin-top: 6px;
+  margin-bottom: 10px;
+}
+.adver-top {
+  display: flex;
+  align-items: center;
+  margin-top: 12px;
+}
+.adver-top-text {
+  font-size: 18px;
+  font-weight: bold;
+}
+.adver-mid {
+  font-size: 12px;
+  color: #ccc;
+  // margin-top: ;
+  margin-bottom: 8px;
+}
+.blue {
+  color: #4d6cff;
+}
 </style>
diff --git a/static/active.png b/static/active.png
new file mode 100644
index 0000000..575fd1e
Binary files /dev/null and b/static/active.png differ
diff --git a/static/img/start.gif b/static/img/start.gif
index aa95825..1ddc0dd 100644
Binary files a/static/img/start.gif and b/static/img/start.gif differ
diff --git a/static/right.png b/static/right.png
new file mode 100644
index 0000000..93c7dc1
Binary files /dev/null and b/static/right.png differ