<template>
  <div class="app-container" >
    <van-nav-bar
      title="我的竞价"
      left-arrow
      fixed
      placeholder
      @click-left="onClickLeft"
    />
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="getList"
      class="biddingList"
    >
      <van-cell v-for="(item , index) in biddinglist" :key="index" :to="{name:'projectDetail', query: {id:item.id}}">
        <van-row>
          <van-col span="24" style="font-size: 0.4rem;margin-bottom: 0.1rem;">{{item.projectName}}</van-col>
        </van-row>
        <van-row>
          <van-col span="24">
            <van-row class="row">
              <van-col span="4" style="font-size: 0.2rem;">当前价格</van-col>
              <van-col span="8" class="col"><span>{{item.money}}</span>{{item.unit}}</van-col>
              <van-col span="4" style="font-size: 0.2rem;">我的出价</van-col>
              <van-col span="8" class="col"><span>{{item.memberMoney}}</span>{{item.unit}}</van-col>
            </van-row>
            <van-row class="row">
              <van-col span="5" style="font-size: 0.2rem;">距竞价结束</van-col>
              <van-col span="19" class="col">
                <van-count-down :time="item.biddingStopTime" format="DD天HH时mm分ss秒" style="font-size: 0.2rem;color: #C21F3A;margin-top: 3px;" />
              </van-col>
            </van-row>
          </van-col>
        </van-row>
      </van-cell>
    </van-list>
  </div>
</template>

<script>
import { getMember , biddinglist } from "@/api/user/index";
import { getInfo } from "@/api/login/index";
export default {
  name: "userBidding",
  data() {
    return {
      loading: false,
      finished: false,
      biddinglist:[],
      queryParams:{
        memberId:'',
        pageNum:1,
        pageSize:10
      }
    };
  },
  created() {
    this.getInfo();
  },
  methods: {
    getInfo(){
      getInfo().then(response => {
        getMember(response.user.userId).then(response => {
          this.queryParams.memberId = response.data.id;
          this.getList();
        });
      });
    },
    getList(){
      this.loading = true;
      biddinglist(this.queryParams).then(response => {
        console.log(response)
        for (var i = 0; i < response.rows.length; i++) {
          var nowTime = Date.parse(new Date());
          var timeTest = response.rows[i].biddingStopTime;
          var endTimes=timeTest.substring(0,10).split('-');
          timeTest = endTimes[1]+'/'+endTimes[2]+'/'+endTimes[0]+' '+timeTest.substring(10,19);
          var leftTime = Date.parse(timeTest)-nowTime;
          response.rows[i].biddingStopTime = leftTime ;
          this.biddinglist.push(response.rows[i]);
        }
        if(this.biddinglist.length >= response.total){
          this.finished = true;
          this.loading = false;
          return;
        }
        this.finished = true;
        this.loading = false;
      });
    },
  },
};
</script>

<style scoped lang="scss">
.app-container {
  background-color: #FFF;
}
.biddingList{
  padding: 0 2%;
}
.row{
  color: #666666;
  margin-bottom: 5px;
}
.col{
  color: #C21F3A;
  span{
    font-weight: bold;
  }
}
</style>
