<template>
  <section class="yesterday-prize-wrap">
    <normal-header
      :title="title"
      :rightText="rightText"
      :barHeight="barHeight"
      :barColor="barColor"
      :backType="1">
    </normal-header>
    <div class="prize-list" :style="{ marginTop: `${44+barHeight}Px`}">
      <div class="item" v-for="(item, index) in rewardsList">
        <img v-if="index<=2" :src="dealRankIcon(index)" alt="" class="ranking-icon">
        <p v-else class="icon-num" >{{index+1}}</p>
        <div class="item-right">
          <img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="" class="doctor-photo">
          <div class="doctor-info">
            <p class="name">{{item.name}}</p>
            <p class="grade">昨日勤奋分:<span>{{item.score}}</span></p>
          </div>
          <p class="awards">{{index==0?'小米电视机1台':'温度计'}}</p>
        </div>
      </div>
    </div>
    <div class="footer-btn">
      <div class="btn">今日我要拿奖</div>
    </div>
  </section>
</template>

<script>
  import NormalHeader from '@/components/normal-header'
  export default {
    name: "index",
    components: {
      NormalHeader
    },
    data() {
      return {
        showPop: false,
        title: '昨日获奖名单',
        barHeight: 0,
        barColor: '#fff',
        rightText: '如何领奖',
        rewardsList: []
      };
    },
    mounted() {
      this.getRewardList();
    },
    methods: {
      dealRankIcon(index) {
        if(index == 0) {
          return require('../../assets/img/icon-gold.png')
        } else if(index == 1) {
          return require('../../assets/img/icon-silver.png')
        } else if(index == 2) {
          return require('../../assets/img/icon-copper.png')
        }
      },
      getRewardList() {
        this.rewardsList = [
          {
            name: '张医生',
            avatarImageUrl: 'https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg',
            rank: 0,
            score: 10000
          },
          {
            name: '李医生',
            avatarImageUrl: 'https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg',
            rank: 1,
            score: 9343
          },
          {
            name: '王医生',
            avatarImageUrl: 'https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg',
            rank: 2,
            score: 8888
          },
          {
            name: '刘医生',
            avatarImageUrl: 'https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg',
            rank: 3,
            score: 8200
          }
        ]
      }
    },
  }
</script>

<style scoped lang="less">
  @import 'index.less';
</style>