cxw-010203

app.json

@@ -52,7 +52,7 @@
       {
         "pagePath": "pages/brandCrisis/index",
         "iconPath": "/custom-tab-bar/icons/appSearch.png",
-        "selectedIconPath": "/custom-tab-bar/icons/appSearchActive.png",
+        "selectedIconPath": "",
         "text": "品牌搜索"
       },
       {

custom-tab-bar/index.js

@@ -19,7 +19,7 @@ Component({
             {
                 "pagePath": "pages/brandCrisis/index",
                 "iconPath": "icons/appSearch.png",
-                "selectedIconPath": "icons/appSearchActive.png",
+                "selectedIconPath": "",
                 "text": "",
                 diyClass: 'diy'
             },

custom-tab-bar/index.wxml

@@ -1,5 +1,6 @@
 <view class="tab-bar">
     <view wx:for="{{list}}" wx:key="index" class="tab-bar-item {{item.diyClass}}" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">
+      <view wx:if="{{item.diyClass}}" class="tab-middle"></view>
       <image src="{{selected === index ? item.selectedIconPath : item.iconPath}}" class="{{item.diyClass}}"  mode="aspectFit"/>
       <view style="color: {{selected === index ? selectedColor : color}}" class="{{item.diyClass}} {{item.diyClass ? 'activeBg' : ''}}">{{item.text}}</view>
     </view>

custom-tab-bar/index.wxss

@@ -52,12 +52,13 @@
   
   .tab-bar-item image.diy {
     position: absolute;
-    width: 134rpx;
+    width: 140rpx;
     height: 140rpx;
     bottom: 25.6%;
     z-index: 100;
-    border-radius: 140rpx;
+    border-radius: 200rpx;
     background: #fff;
+    box-shadow: 0px -2px 10px 0px rgba(0,0,0,0.15);
   }
   
   .tab-bar-item view.diy {
@@ -71,4 +72,10 @@
   .activeBg {
     background: #0579FF; 
   }
+  .tab-middle {
+    position: absolute;
+    width: 140rpx;
+    height: 100%;
+    background: #fff;
+  }
   

pages/brandCrisis/index.js

@@ -110,7 +110,7 @@ Page({
             let intermediateCrisis = Math.round((new Decimal(res.crisis[1].value).div(new Decimal(negativeNum))).toFixed(2) * 100);
             let seniorCrisis = Math.round((new Decimal(res.crisis[2].value).div(new Decimal(negativeNum))).toFixed(2) * 100);
             this.setData({
-                healthIndex: healthIndex,
+                healthIndex: 100,
                 topBg: topBg,
                 healthIndexMsg: healthIndexMsg,
                 negativeNum: negativeNum,

pages/brandCrisis/index.wxml

@@ -1,31 +1,31 @@
 <view class="bc-container">
     <view class="bc-top" style="background-color: {{topBg}};">
         <view class="bc-top-inner" style="{{healthCrisis}}" wx:if="{{healthIndex < 60}}">
-            <view class="bc-c-j" style="margin-top: 100rpx;">健康指数</view>
+            <view class="bc-c-j" style="margin-top: 30rpx;">健康指数</view>
             <view class="bc-top-fen" style="color: #FF3A30">{{healthIndex}}</view>
             <view class="bc-top-btn1">{{healthIndexMsg}}</view>
             <view class="bc-brand">{{headlBrand}}</view>
         </view>
         <view class="bc-top-inner" style="{{healthGood}}" wx:if="{{healthIndex >= 90}}">
-            <view class="bc-c-j" style="margin-top: -60rpx;">健康指数</view>
+            <view class="bc-c-j" style="margin-top: -100rpx;">健康指数</view>
             <view class="bc-top-fen" style="color: #0284FF">{{healthIndex}}</view>
             <view class="bc-top-btn1" style="color: #0084FF">{{healthIndexMsg}}</view>
             <view class="bc-brand">{{headlBrand}}</view>
         </view>
         <view class="bc-top-inner" style="{{healthGenerally}}" wx:if="{{80 <= healthIndex && healthIndex < 90}}">
-            <view class="bc-c-j" style="margin-top: -40rpx;">健康指数</view>
+            <view class="bc-c-j" style="margin-top: -100rpx;">健康指数</view>
             <view class="bc-top-fen" style="color: #00CA2F">{{healthIndex}}</view>
             <view class="bc-top-btn1" style="color: #00CA2F">{{healthIndexMsg}}</view>
             <view class="bc-brand">{{headlBrand}}</view>
         </view>
         <view class="bc-top-inner" style="{{healthMedium}}" wx:if="{{70 <= healthIndex && healthIndex < 80}}">
-            <view class="bc-c-j" style="margin-top: 0rpx;">健康指数</view>
+            <view class="bc-c-j" style="margin-top: -60rpx;">健康指数</view>
             <view class="bc-top-fen" style="color: #FFCC01">{{healthIndex}}</view>
             <view class="bc-top-btn1" style="color: #FFCC01">{{healthIndexMsg}}</view>
             <view class="bc-brand">{{headlBrand}}</view>
         </view>
         <view class="bc-top-inner" style="{{healthWarning}}" wx:if="{{60 <= healthIndex && healthIndex < 70}}">
-            <view class="bc-c-j" style="margin-top: 90rpx;">健康指数</view>
+            <view class="bc-c-j" style="margin-top: 16rpx;">健康指数</view>
             <view class="bc-top-fen" style="color: #FF9500">{{healthIndex}}</view>
             <view class="bc-top-btn1" style="color: #FF9500 ">{{healthIndexMsg}}</view>
             <view class="bc-brand">{{headlBrand}}</view>

pages/brandCrisis/index.wxss

@@ -4,17 +4,18 @@
 .bc-top {
     position: relative;
     width: 100%;
-    height: 900rpx;
+    height: 840rpx;
     border-top: 1px solid transparent;
 }
 .bc-top-inner {
-    width: 100%;
+    width: 90%;
     background-repeat: no-repeat;
     background-size: cover;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
+    margin: 0 auto;
     margin-top: 100rpx;
     height: 660rpx;
 }