头像调整

pages/welfareMall/personal/personal.wxml

@@ -1,12 +1,13 @@
 <!--pages/welfareMall/personal/personal.wxml-->
 <page-wrap id="Page" class="{{grayTheme?'page':''}}">
-  <custom-page head-bg-color="#fff2f3">
+  <custom-page head-bg-color="#FFE7E8">
     <view slot="body" class="personal flex-column">
       <!-- 首部个人信息 -->
       <view class="head flex-column">
         <view class="head-personal flex-row">
           <image wx:if="{{!isLogin}}" class="head-personal-logo" src="/images/welfareMall/head-portrait.png" />
           <!-- 获取用户头像 -->
+          <view class="hat" wx:if="{{isLogin}}"></view>
           <open-data wx:if="{{isLogin}}" class="head-personal-logo" type="userAvatarUrl"></open-data>
           <view class="head-personal-nl flex-column" wx:if="{{isLogin}}">
             <!-- 获取用户微信昵称 -->
@@ -25,7 +26,8 @@
           </view>
         </view>
       </view>
-      <!-- 中部详细信息 -->
+      <!-- 员工通道 -->
+      <view class="broadcast"></view>
       <!-- 内容 -->
       <view class="content flex-column">
         <!-- 导航栏遍历 -->

pages/welfareMall/personal/personal.wxss

@@ -1,4 +1,12 @@
 /* pages/welfareMall/personal/personal.wxss */
+page{
+  background: #F9F9F9;
+  display:flex;
+  flex-flow: column nowrap;
+  justify-content: left;
+  align-items: center;
+  box-sizing: border-box;
+}
 .personal{
   width: 750rpx;
   height: auto;
@@ -23,9 +31,9 @@
 
 .head{
   width: 750rpx;
-  height: 586rpx;
-  background: #FFF2F3;
-  border-radius: 0rpx 0rpx 40rpx 40rpx;
+  height: 352rpx;
+  background: #FFE7E8;
+  box-shadow: 0px -4px 9px 1px rgba(148, 56, 48, 0.18);
   justify-content: space-between;
 }
 
@@ -36,11 +44,25 @@
   margin-left: 35rpx;
   margin-top: 70rpx;
 }
+
+.hat{
+  width: 120rpx;
+  height: 120rpx;
+  background-image: url(https://dy.shpr.top/welfareGo/hat.png);
+  background-size: 100% 100%;
+  position: relative;
+  z-index: 20;
+  margin-bottom: 120rpx;
+  margin-left: -20rpx;
+}
+
 .head-personal-logo{
   width: 136rpx;
   height: 136rpx;
   border-radius: 50%;
   overflow :  hidden ;
+  position: absolute;
+  z-index: 3;
 }
 
 .personal-isLogin {
@@ -55,7 +77,7 @@
 }
 
 .head-personal-nl{
-  margin-left: 33rpx;
+  margin-left: 86rpx;
   align-items: flex-start;
 }
 
@@ -73,19 +95,18 @@
 }
 
 .head-card{
-  width: 666rpx;
-  height: 286rpx;
-  background-image: url(https://dy.shpr.top/welfareGo/card.png);
-  background-size: 100% 100%;
-  margin-bottom: 51rpx;
+  width: 676rpx;
+  height: 112rpx;
+  background: #E14B3F;
+  border-radius: 20rpx 20rpx 0 0;
   justify-content: space-between;
 }
 
 .head-card-coupon{
   font-size: 30rpx;
   font-weight: bold;
-  color: #FFFFFF;
-  margin-left: 58rpx;
+  color: #F6C6A3;
+  margin-left: 60rpx;
 }
 
 .head-card-nt{
@@ -93,18 +114,18 @@
 }
 
 .head-card-num{
-  font-size: 120rpx;
+  font-size: 72rpx;
   font-weight: bold;
-  color: #FFFFFF;
+  color: #F6C6A3;
 }
 
 .head-card-text{
   width: 40rpx;
   height: 40rpx;
   font-size: 30rpx;
-  font-weight: 300;
-  color: #FFFFFF;
-  margin-top:  70rpx;
+  font-weight: bold;
+  color: #F6C6A3;
+  margin-top: 32rpx;
 }
 
 .content{
@@ -139,8 +160,8 @@
 .wx-isLogin-card{
   position: absolute;
   z-index: 2;
-  width: 666rpx !important;
-  height: 286rpx !important;
+  width: 676rpx !important;
+  height: 112rpx !important;
   padding: 0 !important;
   padding-left: 0 !important;
   margin-left: 0rpx !important;
@@ -184,6 +205,15 @@
   color: #303030;
   background-color: transparent;
   border-style: none;
+  margin-left: 186rpx !important;
+}
+
+.broadcast{
+  width: 678rpx;
+  height: 130rpx;
+  background-image: url(https://dy.shpr.top/welfareGo/broadcast.png);
+  background-size: 100% 100%;
+  margin-top: 50rpx;
 }
 
 .page{