上头条，排名区分内外勤，branchType 0: 外勤1: 内勤

src/views/ebiz/congratulation/CongratulationTop.vue

@@ -45,17 +45,55 @@
         <span>数据截止时间:{{ deadline }}</span>
         <span>单位:万元</span>
       </div>
-      <van-row>
+      <van-row class="pb60 pt15" v-if="branchType == '0'">
-        <van-col span="24" class="detail score">您的业绩</van-col>
+        <!-- <van-col span="24" class="detail score">您的业绩</van-col> -->
-        <van-col span="20" offset="2" style="border-bottom: 1px solid #ff4040;"></van-col>
+        <!-- <van-col span="20" offset="2" style="border-bottom: 1px solid #ff4040;"></van-col> -->
-        <van-col span="24" class="detail">您本月预收规保{{ showData.achievement.selfAdvanceStand }}万元</van-col>
+        <van-col span="12" class="detail" style="border-right: 1px solid #ff4040;">
-        <van-col span="24" class="detail">您本月承保标保{{ showData.achievement.selfAcceptStand }}万元</van-col>
+          <div class="m-title mt15">本月预收规保</div>
-        <van-col span="24" class="detail">预收规保全系统排名第{{ showData.achievement.ranking }}名</van-col>
+          <div class="m-number mt15">
-        <van-col span="24" class="detail">距上一名差距{{ showData.achievement.previousGap }}元</van-col>
+            <span class="c-gray-darker fs26 fw500"> {{ showData.achievement.selfAdvanceStand }}</span>
-        <van-col span="24" class="detail">承保标保排名第{{ showData.achievement.rankingBb }}名</van-col>
+            <span class="m-gray fs12 c-gray-dark ml20">万元</span>
-        <van-col span="24" class="detail">距上一名承保标保差距{{ showData.achievement.previousCbbbGap }}元</van-col>
+          </div>
+        </van-col>
+        <van-col span="12" class="detail">
+          <div class="m-title mt15">本月承保标保</div>
+          <div class="m-number mt15">
+            <span class="c-gray-darker fs26 fw500"> {{ showData.achievement.selfAcceptStand }}</span>
+            <span class="m-gray fs12 c-gray-dark ml20">万元</span>
+          </div>
+        </van-col>
+        <van-col span="12" class="detail" style="border-right: 1px solid #ff4040;">
+          <div class="m-title mt15">预收规保全系统排名</div>
+          <div class="m-number mt15">
+            <span class="m-gray fs12 c-gray-dark mr20">第</span>
+            <span class="c-gray-darker fs26 fw500">{{ showData.achievement.ranking }}</span>
+            <span class="m-gray fs12 c-gray-dark ml20">名</span>
+          </div>
+        </van-col>
+        <van-col span="12" class="detail">
+          <div class="m-title mt15"> 距上一名差距</div>
+          <div class="m-number mt15">
+            <span class="c-gray-darker fs26 fw500">{{ showData.achievement.previousGap }}</span>
+            <span class="m-gray fs12 c-gray-dark ml20">元</span>
+          </div>
+        </van-col>
+        <van-col span="12" class="detail" style="border-right: 1px solid #ff4040;">
+          <div class="m-title mt15">承保标保排名</div>
+          <div class="m-number mt15">
+            <span class="m-gray fs12 c-gray-dark mr20">第</span>
+            <span class="c-gray-darker fs26 fw500">{{ showData.achievement.rankingBb }}</span>
+            <span class="m-gray fs12 c-gray-dark ml20">名</span>
+          </div>
+        </van-col>
+        <van-col span="12" class="detail">
+          <div class="m-title mt15">距上一名承保标保差距</div>
+          <div class="m-number mt15">
+            <span class="c-gray-darker fs26 fw500">{{ showData.achievement.previousCbbbGap }}</span>
+            <span class="m-gray fs12 c-gray-dark ml20">元</span>
+          </div>
+        </van-col>
       </van-row>
-      <van-button color="#ff4d4d" class="bottom-btn" @click="nextStep" v-no-more-click="1000">大单榜</van-button>
+      <van-button type="danger" class="bottom-btn" @click="nextStep" v-no-more-click="1000">大单榜</van-button>
     </div>
     <div v-if="showData.topList.length === 0" class="text-center">
       <img class="mt40 w250" src="@/assets/images/pic_page-non.png" />
@@ -69,6 +107,7 @@ import { Col, Row, Loading } from 'vant'
 import { getCongratulationList } from '@/api/ebiz/congratulation/congratulation.js'
 import dateUtil from '@/assets/js/utils/date-utils.js'
 import { orgShortNames } from '@/assets/js/utils/orgShortName'
+import { getAgentInfo } from '@/api/ebiz/my/my.js'
 
 export default {
   name: 'congratulationTop',
@@ -85,7 +124,8 @@ export default {
           previousCbbbGap: ''
         },
         topList: []
-      }
+      },
+      branchType:'' //0: 外勤1: 内勤
     }
   },
   computed: {
@@ -102,9 +142,19 @@ export default {
       forbidClick: true,
       loadingType: 'spinner'
     })
+    this.getAgentInfoFunc()
     this.init()
   },
   methods: {
+    async getAgentInfoFunc(){
+      const res = await getAgentInfo({})
+      if (res.result == 0) {
+        // res.branchType 以N打头的是内勤 其他是外勤,branchType 0: 外勤1: 内勤
+        this.branchType = /^N{1}/.test(res.branchType) ? '1' : '0'
+      } else {
+        return this.$toast(res.resultMessage)
+      }
+    },
     async init() {
       let currMonth = dateUtil.formatDate(new Date(), 'yyyy-MM-dd')
       let data = await getCongratulationList({ date: currMonth, queryType: 'm' })
@@ -179,6 +229,22 @@ $border: 1px solid #ff4040;
   .detail {
     color: #ff4040;
     line-height: 2em;
+    .m-title{
+      font-size: 14px;
+      background-color: #eb674e;
+      width: 150px;
+      height: 25px;
+      border-radius: 12px;
+      color: #fff;
+      line-height: 25px;
+      margin: 0 auto;
+    }
+    .m-number{
+      margin: 0 auto;
+      .m-gray{
+
+      }
+    }
   }
 
   .score {
@@ -188,11 +254,11 @@ $border: 1px solid #ff4040;
 
 .congratulationTitle {
   height: 60px;
-  font-size: 30px;
+  font-size: 20px;
-  text-shadow: 1px 1px 5px #333;
+  // text-shadow: 1px 1px 5px #333;
-  background-color: #ff4040;
+  background-color: #DD3C1E;
   color: #ffffff;
-  line-height: 2em;
+  line-height:60px;
 }
 
 .rankWrapper {
@@ -218,10 +284,12 @@ $border: 1px solid #ff4040;
     }
     th {
       font-size: 14px;
-      background-color: #ff4040;
+      background-color: #eb674e;
+      font-weight: 500;
       color: #ffffff;
       line-height: 30px;
       height: 30px;
+      // opacity: 0.6;
     }
     td {
       padding: 5px;
@@ -229,7 +297,12 @@ $border: 1px solid #ff4040;
     }
   }
   .top3 {
-    color: #ff9900;
+    color: #EE3A3A;
   }
 }
+/deep/ .van-button--danger {
+    background: linear-gradient(to right, #f26e43, #ac0209) !important; /*设置按钮为渐变颜色*/
+    border: none !important;
+    color: #FFCB6B;
+  }
 </style>