<template>
  <div class="record record--sign">
    <x-header></x-header>
    <div class="sign-status" v-if="is_sign">
      <img src="../assets/signed.png" alt="已签到">
    </div>
    <transition-group tag="div"
                      name="fade-list"
                      class="record-list"
                      v-if="total">
      <div class="record-item" v-if="signToday.reward" key="today_sign">
        <p>签到得币：<span class="red">+{{signToday.reward}}</span></p>
        <p>{{signToday.sign_time}}</p>
      </div>
      <div class="record-item"
           v-for="(v, i) in signRecord"
           :key="'sign' + i">
        <p>签到得币：<span class="red">+{{v.reward}}</span></p>
        <p>{{v.sign_time}}</p>
      </div>
    </transition-group>
    <div class="record-none"
         v-if="!signRecord.length && !signToday.reward">
      暂无签到记录
    </div>
    <x-page v-else
            @change="getSignList"
            :current="current"
            :total="total">
    </x-page>
  </div>
</template>

<script>
import { RecordSign } from "./namespace";
import { getSignRecord } from "../api";
export default {
  name: RecordSign.name,
  data() {
    return {
      is_sign: false,
      signRecord: [],
      signToday: [],
      total: 0,
      current: 1
    };
  },
  created() {
    this.getSignList();
  },
  methods: {
    getSignList(page) {
      getSignRecord(page).then(r => {
        this.is_sign = r.sign_status;
        this.signRecord = r.sign_result.list;
        this.signToday = r.sign_today;
        this.current = r.sign_result.meta.current_page;
        this.total = r.sign_result.meta.last_page;
        scrollTo(0, 0);
      });
    }
  }
};
</script>

