个人勤奋榜单接口联调

assets/style/pica-call-app.less

+.call-app-container .down-btn,.call-app-container .open-btn {
+  font-size: 14px;
+}
+.padBott60 {
+  padding-bottom: 60px;
+}
\ No newline at end of file

pages/awards-list/hospital-grades.vue

 <template>
   <section class="hospital-grade-wrap rank-wrap">
-    <div class="rank-list">
+    <h5header
+      v-if="!isWeb"
+      :title="title"
+      :isOpacity="false"
+      :shareObj="shareObj"/>
+    <div class="rank-list" :class="{'padBott60': isWeb}" :style="{ marginTop: isWeb?0:`${44+statusBarHeight}Px`}">
       <div class="rank-item" v-for="(item, index) in rankList" :key="index">
         <img v-if="index<=2" src="~/assets/img/stage3/rank-icon1.png" alt="" class="rank-icon">
         <p v-else class="rank-num">{{index+1}}</p>
@@ -22,23 +27,33 @@
           <p class="score">我的机构勤奋分<span>{{personalData.hospitalDiligence}}</span></p>
           <p class="rank">恭喜您的机构上榜排名<span>{{personalData.hospitalRank}}</span></p>
         </div>
-        <div class="right">分享排名</div>
+        <div class="right" @click="share">分享排名</div>
       </div>
     </div>
+    <no-ssr v-if="isWeb">
+      <pica-call-app
+        :text="'高效学习 轻松行医'"
+        path="https://test1-m-ws.yunqueyi.com/search"
+      />
+    </no-ssr>
   </section>
 </template>
 
 <script>
-  import { getHospitalRank, getPersonScore } from '@/service/stage3Api'
+  import { getHospitalRank, getPersonScore, } from '@/service/stage3Api';
+  import { wxShare } from '@/configs/wxShare';
+  import h5header from '@/components/h5header';
   export default {
     name: "hospital-grades",
     components: {
-
+      h5header
     },
     data() {
       return {
         isWeb: false,
-        personalData: {}
+        personalData: {},
+        shareObj: wxShare,
+        title: '星火榜榜单'
       }
     },
     async asyncData( { query } ) {
@@ -62,10 +77,16 @@
         getPersonScore().then(res => {
           this.personalData = res.data
         })
+      },
+      share() {
+        this.$rocNative.shareWechat(this.shareObj);
       }
     }
   }
 </script>
+<style>
+  @import '../../assets/style/pica-call-app.less';
+</style>
 <style scoped lang="less">
   @import "../../assets/style/awards-list/rank.less";
 

pages/awards-list/index.vue

@@ -104,10 +104,10 @@
         </div>
       </div>
     </div>
-    <div class="pica-icon">
+    <div class="pica-icon" :class="{'padBott60': isWeb}">
       <img src="~/assets/img/stage3/pica-icon.png" alt="">
     </div>
-    <no-ssr>
+    <no-ssr v-if="isWeb">
       <pica-call-app
         :text="'高效学习 轻松行医'"
         path="https://test1-m-ws.yunqueyi.com/search"
@@ -237,9 +237,7 @@
   }
 </script>
 <style>
-  .call-app-container .down-btn,.call-app-container .open-btn {
-    font-size: 14px;
-  }
+  @import '../../assets/style/pica-call-app.less';
 </style>
 <style scoped lang="less">
   @import '../../assets/style/awards-list/index.less';

pages/awards-list/personal-grade.vue

@@ -52,7 +52,7 @@
           <p>{{rightText2}}</p>
         </div>
       </div>
-      <div class="task-details">
+      <div class="task-details" :class="{'padBott60': isWeb}">
         <div class="task-item">
           <img src="~/assets/img/stage3/task-icon1.png" alt="">
           <p class="num">{{myGrades.clockCount}}次</p>
@@ -71,6 +71,12 @@
       </div>
       <div class="share-btn" @click="share" v-if="!isWeb">分享我的成绩</div>
       <p class="footer-text" v-if="!isWeb">共同推进医防融合 齐心聚力机构发展</p>
+      <no-ssr v-if="isWeb">
+        <pica-call-app
+          :text="'高效学习 轻松行医'"
+          path="https://test1-m-ws.yunqueyi.com/search"
+        />
+      </no-ssr>
     </div>
   </section>
 </template>
@@ -134,7 +140,9 @@
     }
   }
 </script>
-
+<style>
+  @import '../../assets/style/pica-call-app.less';
+</style>
 <style scoped lang="less">
   @import '../../assets/style/awards-list/personal-grade.less';
 </style>
\ No newline at end of file

pages/awards-list/personal-rank.vue

 <template>
   <section class="personal-rank-wrap rank-wrap">
-    <div class="rank-list">
-      <div class="rank-item">
-        <img src="~/assets/img/stage3/rank-icon1.png" alt="" class="rank-icon">
+    <h5header
+      v-if="!isWeb"
+      title="个人勤奋榜单"
+      :isOpacity="false"
+      :shareObj="shareObj"/>
+    <div class="rank-list" :class="{'padBott60': isWeb}" :style="{ marginTop: isWeb?0:`${44+statusBarHeight}Px`}">
+      <div class="rank-item" v-for="(item, index) in personList" :key="index">
+        <img v-if="index<=2" src="~/assets/img/stage3/rank-icon1.png" alt="" class="rank-icon">
+        <p v-else class="rank-num">{{index+1}}</p>
         <div class="info">
-          <img src="https://test-file.yunqueyi.com/png/2019/9/19/1568874397547_45fff40f.png" alt="" class="photo">
+          <img :src="item.avatarImageUrl" alt="" class="photo">
           <div class="details">
-            <p class="name">张医生</p>
+            <p class="name">{{item.name}}</p>
             <p class="awards">奖励: iPhone11、500云鹊豆</p>
           </div>
         </div>
         <div class="score">
-          <p class="num">9872</p>
-          <p class="name">勤奋分</p>
-        </div>
-      </div>
-      <div class="rank-item">
-        <img src="~/assets/img/stage3/rank-icon2.png" alt="" class="rank-icon">
-        <div class="info">
-          <img src="https://test-file.yunqueyi.com/png/2019/9/19/1568874397547_45fff40f.png" alt="" class="photo">
-          <div class="details">
-            <p class="name">张医生</p>
-            <p class="awards">奖励: iPhone11、500云鹊豆</p>
-          </div>
-        </div>
-        <div class="score">
-          <p class="num">9872</p>
-          <p class="name">勤奋分</p>
-        </div>
-      </div>
-      <div class="rank-item">
-        <img src="~/assets/img/stage3/rank-icon3.png" alt="" class="rank-icon">
-        <div class="info">
-          <img src="https://test-file.yunqueyi.com/png/2019/9/19/1568874397547_45fff40f.png" alt="" class="photo">
-          <div class="details">
-            <p class="name">张医生</p>
-            <p class="awards">奖励: iPhone11、500云鹊豆</p>
-          </div>
-        </div>
-        <div class="score">
-          <p class="num">9872</p>
-          <p class="name">勤奋分</p>
-        </div>
-      </div>
-      <div class="rank-item">
-        <div class="rank-num">4</div>
-        <div class="info">
-          <img src="https://test-file.yunqueyi.com/png/2019/9/19/1568874397547_45fff40f.png" alt="" class="photo">
-          <div class="details">
-            <p class="name">张医生</p>
-            <p class="awards">奖励: iPhone11、500云鹊豆</p>
-          </div>
-        </div>
-        <div class="score">
-          <p class="num">9872</p>
+          <p class="num">{{item.diligence}}</p>
           <p class="name">勤奋分</p>
         </div>
       </div>
@@ -63,24 +27,70 @@
         <span class="line"></span>
       </div>
     </div>
-    <div class="footer">
+    <div class="footer" v-if="!isWeb">
       <div class="content">
         <div class="left">
-          <p class="score">我的勤奋分<span>2000</span></p>
-          <p class="rank">恭喜您上榜排名<span>第5</span></p>
+          <p class="score">我的勤奋分<span>{{personalData.diligence}}</span></p>
+          <p class="rank">恭喜您上榜排名<span>第{{personalData.personRank}}</span></p>
         </div>
-        <div class="right">分享排名</div>
+        <div class="right" @click="share">分享排名</div>
       </div>
     </div>
+    <no-ssr v-if="isWeb">
+      <pica-call-app
+        :text="'高效学习 轻松行医'"
+        path="https://test1-m-ws.yunqueyi.com/search"
+      />
+    </no-ssr>
   </section>
 </template>
 
 <script>
+  import { getPersonScore,getPersonList } from '@/service/stage3Api';
+  import { wxShare } from '@/configs/wxShare';
+  import h5header from '@/components/h5header';
   export default {
-    name: "personal-rank"
+    name: "personal-rank",
+    components: {
+      h5header
+    },
+    data() {
+      return {
+        personalData: {},
+        isWeb: false,
+        shareObj: wxShare,
+      }
+    },
+    async asyncData( {query} ) {
+      const { data } = await getPersonList();
+      return {
+        personList: data
+      }
+    },
+    created() {
+    },
+    mounted() {
+      this.$rocNative.appInit();
+      this.isWeb = this.$rocNative.isWeb;
+      if(!this.isWeb) {
+        this.getPersonScore();
+      };
+    },
+    methods: {
+      getPersonScore() {
+        getPersonScore().then(res => {
+          this.personalData = res.data
+        })
+      },
+      share() {
+        this.$rocNative.shareWechat(this.shareObj);
+      }
+    }
   }
 </script>
-
+<style>
+  @import '../../assets/style/pica-call-app.less';
+</style>
 <style scoped lang="less">
   @import "../../assets/style/awards-list/rank.less";
 </style>
\ No newline at end of file

service/stage3Api.js

@@ -38,3 +38,10 @@ export const getPersonScore = (params) => {
     params: params
   })
 }
+/*个人榜单列表*/
+export const getPersonList = () => {
+  return request({
+    url: '/campaign/third/share/person/rank',
+    withCredentials: true
+  })
+}
\ No newline at end of file