nsgk_mobile/src/views/project/projectDetail.vue

<template>
  <div class="app-container">
    <navBar title="项目详情" background="0" positionType="relative"></navBar>
    <van-tabs scrollspy sticky >
      <van-tab title="竞拍信息" title-style="font-size:12px;">
        <van-swipe class="my-swipe" height="235" indicator-color="white" @change="onChange">
          <template v-if="detail.fileUrlList !== undefined &&detail.fileUrlList.length>0">
            <van-swipe-item v-for="(item,index) in detail.fileUrlList" :key="index"><van-image :src="item.fileUrl?'/api'+item.fileUrl:'../../static/images/zwtp.jpg'" height="235" /></van-swipe-item>
          </template>
          <template v-else>
            <van-swipe-item><van-image src="../../static/images/zwtp.jpg" height="235" /></van-swipe-item>
          </template>
          <template #indicator>
            <div class="custom-indicator">{{ current + 1 }}/{{ detail.fileUrlList !== undefined &&detail.fileUrlList.length>0 ? detail.fileUrlList.length:1 }}</div>
          </template>
        </van-swipe>

        <van-notice-bar color="#fff" background="#21B6AB" left-icon="clock-o">
          {{ process }}&nbsp&nbsp&nbsp&nbsp<span id="timeData"></span>
<!--          <van-count-down ref="countDown" :time="time" format="DD 天 HH 时 mm 分 ss 秒" @change="timerChange" />-->
        </van-notice-bar>
        <div class="information">
          <van-row>
            <van-col span="24" class="title">【{{ detail.rollout }}】{{ detail.projectName }}</van-col>
          </van-row>
          <van-row>
            <van-col span="5">挂牌价</van-col>
            <van-col span="19" class="price"><span>{{detail.price}}</span> {{detail.unit}}</van-col>
          </van-row>
          <van-row v-if="detail.priceMax">
            <van-col span="5">最高限价</van-col>
            <van-col span="19" class="money"><span>{{ detail.priceMax }}</span> 元</van-col>
          </van-row>
          <van-row>
            <van-col span="5">保证金</van-col>
            <van-col span="19" class="money"><span>{{ detail.deposit }}</span> 元</van-col>
          </van-row>
        </div>

        <div class="lead" v-if="((detail.biddingType=='自由竞价' || detail.biddingType=='1')&&detail.projectShowStatus!='正在竞价'&&detail.projectShowStatus!='等待竞价') || (detail.biddingType!='自由竞价' && detail.biddingType!='1')">
          <img src="../../../static/images/transaction_new/project/project_icon_01.png" style="display: block;" />
          <template v-if="biddinglistInformation!=undefined&&biddinglistInformation.length>0">
            <p>{{biddinglistInformation[0].memberId}}</p>
            <p>{{biddinglistInformation[0].money}}{{detail.unit}}</p>
            <p>领先</p>
          </template>
          <p v-else style="margin: 0 auto;">暂无出价</p>
        </div>
        <div class="detail">
          <van-row>
            <van-col span="24"><span>报名开始时间：</span>{{ detail.signupStartTime }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>报名截止时间：</span>{{ detail.signupStopTime }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>竞价开始时间：</span>{{ detail.biddingStartTime }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>竞价结束时间：</span>{{ detail.biddingStopSetime }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>竞价方式：</span>{{ detail.biddingType }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>竞价方向：</span>{{ detail.biddingDirect }}</van-col>
          </van-row>
          <van-row v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'">
            <van-col span="24"><span>阶梯价(增减幅度)：</span>￥{{ detail.ladderPrice }}</van-col>
          </van-row>
          <van-row v-if="detail.delayPeriod!=0">
            <van-col span="24"><span>延时周期：</span>{{detail.delayPeriod}}秒</van-col>
          </van-row>
          <van-row v-if="detail.delayPeriod!=0">
            <van-col span="24"><span>延时说明：</span>自由竞价期结束后，进入{{detail.delayPeriod}}秒延时竞价期；延时竞价期内但凡有出价，则继续延时竞价，直至无人出价！</van-col>
          </van-row>
          <van-row v-if="detail.changeImg.length > 0">
            <van-col span="24"><span>变更说明：</span></van-col>
          </van-row>
          <van-row v-if="detail.changeImg.length > 0">
            <van-col span="24">
              <img v-for="(item,index) in detail.changeImg" @click="previewImage(index,detail.changeImg)" :key="index" :src="'/api' + item" style="width: 100%;" />
            </van-col>
          </van-row>
        </div>
      </van-tab>
      <van-tab title="标的物介绍" title-style="font-size:12px;">
        <div class="introduce gnbg">
          <p class="delTitle"><i></i>标的物介绍</p>
          <van-row>
            <van-col span="24" style="color:#333333;font-size: 0.4rem;text-align: center;font-weight: bold;">项目挂牌转出方简况及公告内容</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>{{detail.projectNumber == '集体资产采购类' ? '建设方':'转出方'}}名称</span>{{ detail.outName }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>住址</span>{{ detail.address }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>转出方类型</span>{{ detail.economicType }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>统一社会信用代码</span>{{ detail.areaNum }}</van-col>
          </van-row>
          <van-row>
            <van-col span="12"><span>项目联系人</span>{{ detail.linkPerson }}</van-col>
            <van-col span="12"><span>联系电话</span>{{ detail.linkPhone }}</van-col>
          </van-row>
          <van-row>
            <van-col span="12"><span>项目类型</span>{{ detail.projectNumber }}</van-col>
            <van-col span="12"><span>标的类别</span>{{ detail.projectType }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>转出项目名称</span>{{ detail.projectName }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>坐落</span>{{ detail.locationName }}</van-col>
          </van-row>
<!--          <van-row>-->
<!--            <van-col span="14"><span>是否属再次转出</span>{{ detail.twoout == 'N'?"否":"是"}}</van-col>-->
<!--            <van-col span="10"><span>前次转出方式</span>{{ detail.oneout}}</van-col>-->
<!--          </van-row>-->





          <van-row v-if="detail.projectNumber != '集体资产采购类'">
            <van-col span="12"><span>拟转出方式</span>{{ detail.rollout }}</van-col>
            <van-col span="12"><span>拟转出面积/数量</span> {{detail.allCount}}{{detail.allCountUnit}} </van-col>
          </van-row>
          <template v-if="detail.projectNumber != '集体资产采购类'">
            <template v-if="detail.projectNumber == '集体经营性资产' && detail.projectType == '房屋建筑' && detail.rollout == '转让'">

            </template>
            <van-row v-else>
              <van-col span="24"><span>拟转出期限</span>{{detail.outStartTime}} 至 {{detail.outStopTime}}&nbsp&nbsp&nbsp&nbsp&nbsp共{{detail.outYearNum}}{{detail.outYearUnit}}</van-col>
            </van-row>
          </template>




          <van-row v-if="detail.projectNumber != '集体资产采购类'">
            <van-col span="24"><span>涉及农户数</span>{{ detail.peasantNum }}</van-col>
          </van-row>


          <van-row>
            <van-col span="24"><span>支付方式</span>{{ detail.paymentType }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>支付说明</span></van-col>
          </van-row>
          <van-row>
            <van-col span="24">
              <template v-if="detail.paymentTypeOriginal=='1'">
                <span v-if="detail.projectNumberOriginal!=='8'">本合同签订之日起</span>
                <span v-if="detail.projectNumberOriginal=='8'">项目完成后</span>
                <span>{{detail.paymentComment}}日内，</span>
                <span v-if="detail.projectNumberOriginal!=='8'">乙方一次性将租赁费支付给甲方。</span>
                <span v-if="detail.projectNumberOriginal=='8'">甲方一次性将工程款支付给乙方。</span>
              </template>
              <template v-if="detail.paymentTypeOriginal!='1'">
                {{detail.paymentCondition}}
              </template>
            </van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>授权情况</span>{{ detail.authorization }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>{{detail.projectNumber == '集体资产采购类' ? '工程内容':'拟流转用途'}}</span>{{ detail.contractPurpose }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>{{detail.projectNumber == '集体资产采购类' ? '承包范围':'其它需要披露的事项'}}</span>{{ detail.cracksEvents }}</van-col>
          </van-row>
          <van-row>
            <van-col span="24"><span>受让方条件</span>{{ detail.condition }}</van-col>
          </van-row>


          <van-row v-if="detail.projectNumber != '集体资产采购类'">
            <van-col span="24" style="color:#0DBCAA;">标的物信息</van-col>
          </van-row>
          <div v-if="detail.projectNumber != '集体资产采购类'" class="project_info" v-for="(item,index) in detail.subjectList" :key="index">
            <van-row>
              <van-col span="8">{{ item.landName }}</van-col>
              <van-col span="8">{{ item.area }}{{item.areaUnit}}</van-col>
              <van-col span="8">{{ item.condition}}</van-col>
            </van-row>
          </div>
        </div>
      </van-tab>
      <van-tab title="标的物图片" title-style="font-size:12px;">
        <div class="introduce gnbg">
          <p class="delTitle"><i></i>标的物图片</p>
          <template v-if="detail.fileUrlList !== undefined &&detail.fileUrlList.length>0">
            <img v-for="(item,index) in detail.fileUrlList" :key="index" :src="item.fileUrl?'/api'+item.fileUrl:'../../../static/images/index/detailImg.png'" style="vertical-align: text-top;width: 100%;" />
          </template>
          <template v-else>
            <img src="../../../static/images/index/detailImg.png" style="vertical-align: text-top;width: 100%;" />
          </template>
        </div>
      </van-tab>
      <van-tab title="竞买须知" title-style="font-size:12px;">
        <div class="notice gnbg">
          <p class="delTitle"><i></i>竞买须知</p>
          <div v-html="webConfig"></div>
        </div>
      </van-tab>
      <van-tab title="竞价记录" title-style="font-size:12px;">
        <div class="biddingList gnbg">
          <p class="delTitle"><i></i>竞价记录</p>
          <p v-if="detail.biddingType == '自由竞价' && (detail.projectShowStatus == '正在竞价'||detail.projectShowStatus == '等待竞价')">友情提示：自由竞价方式下，项目结束前不显示竞价记录！</p>
          <table v-else width="100%" cellspacing="0">
            <tr>
              <td>出价人</td>
              <td>出价</td>
              <td>状态</td>
              <td>时间</td>
            </tr>
            <tr v-for="(item,index) in biddinglistInformation" :key="index">
              <td>{{ item.memberId }}</td>
              <td>{{ item.money}}</td>
              <template v-if="index==0">
                <td style="color:#FF2D2D">领先</td>
              </template>
              <template v-else>
                <td></td>
              </template>
              <td>{{ item.loginTime }}</td>
            </tr>
          </table>
        </div>
      </van-tab>
    </van-tabs>
    <div style="height: 3rem;"></div>
    <div class="bottomBtn" v-if="bottomBtn">
      <van-row v-if="!showBtn">
<!--        <van-col span="8" style="margin-top: 4px;" @click="showPopup">-->
<!--          <van-image src="../../static/images/icon/clock.png" style="vertical-align: text-bottom;" />-->
<!--          <p style="line-height: 0.2rem;color: #999999">提醒</p>-->
<!--        </van-col>-->
        <van-col span="24">
          <van-button round color="linear-gradient(to right,#FD683F,#FF2D2D)" block :disabled="isSignup" @click="goSignUp">
            {{ btnMsg }}<br/>
            <span style="font-size: 10px">保证金￥{{detail.deposit}}</span>
          </van-button>
        </van-col>
      </van-row>
      <div v-if="showBtn&&detail.biddingType!='阶梯竞价'" style="display: flex;align-items: center;width: 70%;margin: 0 auto;">
        <van-field v-model="price" type="number" input-align="center" placeholder="请输入出价金额" />
        <p style="flex-shrink: 0;">{{detail.unit}}</p>
      </div>
      <van-row v-if="showBtn" type="flex" justify="space-around">
        <van-col span="3" v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'" style="text-align: center;line-height: 1rem">
          <van-button color="#e2e2e2" icon="minus" size="small" @click="sub"></van-button>
        </van-col>
        <van-col span="18">

          <div style="display: flex;">
            <van-button round color="linear-gradient(to right,#FD683F,#FF2D2D)" block @click="offer">
              <p>出价</p>
              <p v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'">{{price}}{{detail.unit}}</p>
            </van-button>

<!--            <van-button v-if="isFirst == 'Y'" round color="#FF2D2D" block @click="offerFirst" style="margin-left: 10px;width: 30%;">-->
<!--              <p>优先跟价</p>-->
<!--            </van-button>-->
          </div>
        </van-col>
        <van-col span="3" v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'" style="text-align: center;line-height: 1rem">
          <van-button color="#e2e2e2" icon="plus" size="small" @click="add"></van-button>
        </van-col>
      </van-row>
    </div>
    <van-popup v-model="show" class="popup" closeable>
      <van-image src="../../static/images/icon/success.png"/>
      <p class="popupTit">提醒设置成功</p>
      <p class="popupContent">系统将按要求提醒您竞拍</p>
      <van-button round color="#FF2D2D" block class="iKnow">
        我知道了
      </van-button>
      <p class="updatePopup">修改提醒方式</p>
    </van-popup>
  </div>
</template>

<script>
import {
  biddingSubmit,
  getBiddingList, getBiddingStopTime,
  getMember,
  getOutProjectDetail,
  getSignup,
  getWebConfig,
  projectNewBidMoney
} from "../../api/project";
import {getInfo} from "../../api/login";
import $ from "jquery";
import navBar from "@/components/common/nav_bar.vue";
import {ImagePreview} from "vant";

export default {
  name: "projectDetail",
  components: { navBar },
  provide(){
    return{
      reload:this.reload
    }
  },
  data() {
    return {
      current: 0,
      show: false,
      id:this.$route.query.id,
      detail: {
        biddingType:'自由竞价'
      },
      webConfig:"",
      biddinglistInformation:[],
      rollout_type:[],
      process:"",
      tip:"",
      btnMsg:"",
      time:null,
      timeMsg:"",
      isSignup:true,
      showBtn:false,
      price:null,
      userAccount:"",
      userName:"",
      userId:"",
      timeConfig:'',
      biddinglistInformationLength:0,
      biddingTimeType:1,
      isFirst:'',
      timer:null,
      getSignupData:'',
      bottomBtn:false,
      delayPeriodNow:false,
      nowDate:0,
      biddingquery:{
        projectId:this.$route.query.id,
        pageSize:10,
        pageNum:1
      },
      timeData:'',
      timeCount:null
    };
  },
  computed: {
    getNowFormatDate:function(){
      let date = new Date();
      let seperator1 = "-";
      let seperator2 = ":";
      let month = date.getMonth() + 1;
      let day = date.getDate();
      let hours = date.getHours();
      let minutes = date.getMinutes();
      let seconds = date.getSeconds();
      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      if (day >= 0 && day <= 9) {
        day = "0" + day;
      }
      if (hours >= 0 && hours <= 9) {
        hours = "0" + hours;
      }
      if (minutes >= 0 && minutes <= 9) {
        minutes = "0" + minutes;
      }
      if (seconds >= 0 && seconds <= 9) {
        seconds = "0" + seconds;
      }
      let currentdate = date.getFullYear() + seperator1 + month + seperator1 + day + " " + hours + seperator2 + minutes + seperator2 + seconds;
      //console.log(currentdate)
      return currentdate;
    }
  },
  created() {
    clearInterval(this.timer);
    this.reload();
  },
  methods: {
    previewImage(index, imgList) {
      ImagePreview({
        startPosition: index,
        images: imgList.map(element => '/api' + element),
      });
    },
    goSignUp(){
      getInfo().then(response => {
        getMember(response.user.userId).then(resresponse => {
          let data= {
            projectId:this.id,
            memberId:resresponse.data.id,
          };
          var isSign;
          getSignup(data).then(r =>{
            if(r.data=="1"){
              isSign=true
            }
          })
          if (resresponse.data.activitiStatus == '3'){
            if (isSign){
              this.$toast({
                icon: 'error', // 找到自己需要的图标
                message: '已报名，请耐心等待审核结果！',
                duration:"2000",
                onClose:function(){
                }
              })
              return;
            }
            this.$router.push(
              {
                path: 'signUp',
                query: {
                  projectId: this.detail.id,
                  deposit: this.detail.deposit,
                  projectName: this.detail.projectName
                }
              }
            );
          }else{
            this.$toast({
              icon: 'error', // 找到自己需要的图标
              message: '交易中心审核注册信息后方可进行报名！',
              duration:"2000",
              onClose:function(){
              }
            })
          }
        })
      })
    },
    onChange(index) {
      this.current = index;
    },
    showPopup() {
      this.show = true;
    },
    reload(){
      //console.log("结束进入")
      getOutProjectDetail(this.id).then(response =>{

        this.detail = response.data;

        this.getDicts("rollout_type").then(res =>{
          this.detail.rollout = this.selectDictLabel(res.data,response.data.rollout);
          if(this.detail.oneout==0){
            this.detail.oneout = "无"
          }else{
            this.detail.oneout = this.selectDictLabel(res.data,response.data.oneout);
          }
        })
        this.getDicts("project_type").then(res => {
          this.detail.projectNumberOriginal = response.data.projectNumber;
          this.detail.projectNumber = this.selectDictLabel(res.data,response.data.projectNumber);
        });
        // this.getDicts("sub_object_type").then(res => {
        //   // this.detail.projectType = this.selectDictLabel(res.data,response.data.projectType);
        // });
        this.getDicts("economic_type").then(res => {
          this.detail.economicType = this.selectDictLabel(res.data,response.data.economicType);
        });
        this.getDicts("area_unit").then(res => {
          this.detail.allCountUnit = this.selectDictLabel(res.data,response.data.allCountUnit);
        });
        this.getDicts("bidding_type").then(res => {
          // debugger;
          this.detail.biddingType = this.selectDictLabel(res.data,response.data.biddingType);
        });
        this.getDicts("bidding_direct").then(res => {
          this.detail.biddingDirect = this.selectDictLabel(res.data,response.data.biddingDirect);
        });
        this.getDicts("price_unit").then(res => {
          this.detail.unit = this.selectDictLabel(res.data,response.data.unit);
        });
        this.getDicts("payment_type").then(res => {
          this.detail.paymentTypeOriginal = response.data.paymentType;
          this.detail.paymentType = this.selectDictLabel(res.data,response.data.paymentType);
        });
        for(let i of this.detail.subjectList){
          this.getDicts("area_unit").then(res => {
            i.areaUnit = this.selectDictLabel(res.data,i.areaUnit);
          });
        }

        var that = this;
        this.timer = setInterval(function () {
          if(that.process == "竞价中"){
            getBiddingList(that.biddingquery).then(response =>{
              that.biddinglistInformation = response.rows
              if((response.rows.length != that.biddinglistInformationLength) && that.detail.ladderPrice){

                if (that.detail.biddingDirect == 2 ||that.detail.biddingDirect == '反向竞价') {
                  if(response.rows[0].money<=that.price) {
                    that.price = parseInt(response.rows[0].money) - parseInt(that.detail.ladderPrice)
                  }
                }else{
                  if(response.rows[0].money>=that.price) {
                    that.price = parseInt(response.rows[0].money) + parseInt(that.detail.ladderPrice)
                  }
                }
              }
              that.biddinglistInformationLength = response.total
            });
          }
        },3000)

        getInfo().then(response => {
          this.userId = response.user.userId;
          getMember(response.user.userId).then(res => {
            this.userAccount=res.data.phone
            this.userName=res.data.realname
            this.memberId=res.data.id
            let data= {
              projectId:this.id,
              memberId:res.data.id,
              depositStatus:'1'
            };
            getSignup(data).then(r =>{
              this.getSignupData = r.data;
              this.isFirst = r.signup.isFirst;

              this.getBidding();
              this.timeCount = setInterval(()=>{
                this.getTime()
              },1000)
              this.bottomBtn = true;
            })
          })
        })
      });
      getWebConfig().then(response =>{
        this.timeConfig = response.data[8].configValue;
        response.data.map(item =>{
          if(item.configKey=="cqjy.website.bidInfo"){
            this.webConfig =  item.configValue
          }
        })
      });
    },
    getTime(){
      this.bottomBtn = true;
      // let biddingStartTime =  Date.parse(this.detail.biddingStartTime)+0
      // let biddingStopTime =  Date.parse(this.detail.biddingStopTime)+0
      // let biddingStopSetime =  Date.parse(this.detail.biddingStopSetime)+0
      // let signupStartTime =  Date.parse(this.detail.signupStartTime)+0
      // let signupStopTime =  Date.parse(this.detail.signupStopTime)+0
      let biddingStartTime =  new Date(this.detail.biddingStartTime.replace(/-/g,'/')).getTime();
      let biddingStopTime =  new Date(this.detail.biddingStopTime.replace(/-/g,'/')).getTime();
      let biddingStopSetime =  new Date(this.detail.biddingStopSetime.replace(/-/g,'/')).getTime();
      let signupStartTime =  new Date(this.detail.signupStartTime.replace(/-/g,'/')).getTime();
      let signupStopTime =  new Date(this.detail.signupStopTime.replace(/-/g,'/')).getTime();
      // console.log(this.detail.biddingStartTime.replace(/-/g,'/'));
      // console.log(this.detail.biddingStopTime.replace(/-/g,'/'));
      // console.log(this.detail.biddingStopSetime.replace(/-/g,'/'));
      // console.log(this.detail.signupStartTime.replace(/-/g,'/'));
      // console.log(this.detail.signupStopTime.replace(/-/g,'/'));
      // alert(this.detail.biddingStartTime.replace(/-/g,'/')+' & '+biddingStartTime);
      // alert(this.detail.biddingStopTime.replace(/-/g,'/')+' & '+biddingStopTime);
      // alert(this.detail.biddingStopSetime.replace(/-/g,'/')+' & '+biddingStopSetime);
      // alert(this.detail.signupStartTime.replace(/-/g,'/')+' & '+signupStartTime);
      // alert(this.detail.signupStopTime.replace(/-/g,'/')+' & '+signupStopTime);
      // console.log('1111111111111111111111111')
      // console.log(biddingStartTime);
      // console.log(biddingStopTime);
      // console.log(biddingStopSetime);
      // console.log(signupStartTime);
      // console.log(signupStopTime);
      // console.log('-------------------------')
      // let nowDate = Date.parse(this.format($.ajax({async:false,data:{·i: Date.parse(new Date())}}).getResponseHeader("Date"), "yyyy-MM-dd HH:mm:ss"));
      // console.log($.ajax({async:false,data:{i: new Date().getTime()}}))
      let nowDate = new Date($.ajax({async:false,data:{i: new Date().getTime()}}).getResponseHeader("Date")).getTime();
      let time = this.detail.delayPeriod * 1000;
      var difference = biddingStopTime-nowDate;//延时后时间差
      var differenceSetime = biddingStopSetime-nowDate;//延时后时间差

      let m = Math.floor(difference/1000/60%60);
      let s = Math.floor(difference/1000%60);

      if (s%2 == 0&&time!=0){
        getBiddingStopTime(this.id).then(response =>{
          this.$set(this.detail,'biddingStopTime',response.data);
        });
      }

      if (differenceSetime <= 0 && difference >= 0 && difference <=time){
        console.log("竞价剩余两分钟"+"m:"+m+"s:"+s)
        this.biddingTimeType = 1;
        this.process= "竞价中"
        this.detail.projectShowStatus = '正在竞价';
        this.tip=this.detail.biddingStopTime+"结束竞价"
        this.timeMsg="距竞价结束"
        if(this.getSignupData=="1"){
          this.isSignup=true
          this.btnMsg="立即竞价"
          if(this.detail.biddingType!='线下竞价'){
            this.showBtn=true
          }else{
            this.btnMsg="立即竞价(暂不支持线上出价)"
          }
          // this.price=this.detail.ladderPrice?this.biddinglistInformation[0].money+this.detail.ladderPrice:this.biddinglistInformation[0].money+1
        }else{
          this.btnMsg="未报名"
          this.isSignup=true
        }
        $('#timeData').html(this.TimeInterval(biddingStopTime-nowDate));

        if (s < 1 && m < 1){
          console.log("竞价结束22222222222")
          getBiddingStopTime(this.id).then(response => {
            this.$set(this.detail,'biddingStopTime',response.data)
            let timeNew = Date.parse(response.data) + 0 - nowDate;
            if (timeNew > 0) {
              this.$set(this.detail,'biddingStopTime',response.data)
              this.getTime();
            } else {
              // clearInterval(this.timeCount);
              this.process = "竞价结束"
              this.tip = this.detail.biddingStopTime + "结束竞价"
              this.btnMsg = "竞价结束"
              this.timeMsg = "竞价结束"
              this.time = 0
              this.isSignup = true
              this.showBtn = false
              this.biddingTimeType = 2;
              this.detail.projectShowStatus = '竞价结束'
              $('#timeData').html('');
              return;
            }
          });
        }else if (s%2 == 0&&time!=0){
            getBiddingStopTime(this.id).then(response =>{
              this.$set(this.detail,'biddingStopTime',response.data);
            });
        }
      }else{
        this.dataCompare(signupStartTime,signupStopTime,biddingStartTime,biddingStopSetime)
      }
    },
    dataCompare(signupStartTime,signupStopTime,biddingStartTime,biddingStopTime){
      // alert(new Date($.ajax({async:false,data:{i: Date.parse(new Date())}}).getResponseHeader("Date")).getTime());
      // let nowDate = Date.parse(
      //   this.format(
      //     $.ajax({
      //       async:false,
      //       data:{i: Date.parse(new Date())}
      //     }).getResponseHeader("Date"), "yyyy-MM-dd HH:mm:ss")
      // );
      let nowDate = new Date($.ajax({async:false,data:{i: new Date().getTime()}}).getResponseHeader("Date")).getTime();
      if(signupStartTime>nowDate){
        //console.log('未开始')
        this.process= "报名未开始"
        this.tip=this.detail.signupStartTime+"开始报名"
        this.btnMsg="报名未开始"
        this.timeMsg="距报名开始"
        $('#timeData').html(this.TimeInterval(signupStartTime-nowDate))
        // this.timeData = ;
        this.isSignup=true
      }
      if(signupStopTime>nowDate&&signupStopTime>signupStartTime){
        //console.log('报名中')
        this.process= "报名中"
        this.isSignup=false
        this.tip=this.detail.signupStopTime+"报名截止"
        this.btnMsg="立即报名"
        this.timeMsg="距报名截止"
        // this.time = signupStopTime-nowDate
        $('#timeData').html(this.TimeInterval(signupStopTime-nowDate));
        // this.timeData = this.TimeInterval(signupStopTime-nowDate);
        if(this.getSignupData=="1"){
          this.isSignup=true
          this.btnMsg="已报名"
        }
      }
      if(biddingStartTime>nowDate&&nowDate>signupStopTime){
        //console.log('竞价未开始')
        this.biddingTimeType = 3;
        this.process= "竞价未开始"
        this.tip=this.detail.biddingStartTime+"开始竞价"
        this.timeMsg="距竞价开始"
        // this.time = biddingStartTime-nowDate
        $('#timeData').html(this.TimeInterval(biddingStartTime-nowDate));

        // this.timeData = this.TimeInterval(biddingStartTime-nowDate);
        this.isSignup=true;
        if(this.getSignupData=="1"){
          this.btnMsg="已报名"
          // this.price=this.detail.ladderPrice?this.biddinglistInformation[0].money+this.detail.ladderPrice:this.biddinglistInformation[0].money+1
        }else{
          this.btnMsg="未报名"
        }
      }
      if(biddingStopTime>nowDate&&nowDate>biddingStartTime){
        //console.log('竞价中')
        this.biddingTimeType = 1;
        this.process= "竞价中"
        this.tip=this.detail.biddingStopTime+"结束竞价"
        this.timeMsg="距竞价结束"
        // this.time = biddingStopTime-nowDate
        $('#timeData').html(this.TimeInterval(biddingStopTime-nowDate));
        // this.timeData = this.TimeInterval(biddingStopTime-nowDate);
        //console.log(this.timeData)
        if(this.getSignupData=="1"){
          this.isSignup=true
          this.btnMsg="立即竞价"
          if(this.detail.biddingType!='线下竞价'){
            this.showBtn=true
          }else{
            this.btnMsg="立即竞价(暂不支持线上出价)"
          }
          // this.price=this.detail.ladderPrice?this.biddinglistInformation[0].money+this.detail.ladderPrice:this.biddinglistInformation[0].money+1
        }else{
          this.btnMsg="未报名"
          this.isSignup=true
        }
      }
      if(nowDate>biddingStopTime){
        //console.log('竞价结束')
        // clearInterval(this.timeCount);
        this.process= "竞价结束"
        this.tip=this.detail.biddingStopTime+"结束竞价"
        this.detail.projectShowStatus = '竞价结束'
        this.btnMsg="竞价结束"
        this.timeMsg="竞价结束"
        this.time = 0
        this.isSignup = true
        this.showBtn=false
        this.biddingTimeType = 2;
        $('#timeData').html('');
        // this.timeData = ''
      }
    },

  getBidding(){
    var that = this;
    getBiddingList(that.biddingquery).then(response =>{
      that.biddinglistInformation = response.rows
      that.biddinglistInformationLength = response.total
      if (that.detail.biddingType == '阶梯竞价'){
        if (response.rows.length>0&&that.detail.ladderPrice){
          if (that.price == 0){return;}
          if (that.detail.biddingDirect == 2 ||that.detail.biddingDirect == '反向竞价') {
            let money = that.price?that.price:response.rows[0].money
            if(response.rows[0].money<=money){
              that.price = parseFloat(response.rows[0].money - that.detail.ladderPrice).toFixed(2)
            }
          }else{
            console.log(response.rows[0].money>=that.price)
            let money = that.price?that.price:response.rows[0].money
            if(response.rows[0].money>=money){
              that.price = parseFloat(response.rows[0].money + that.detail.ladderPrice).toFixed(2)
            }
          }
        }else if (response.rows.length>0&&!that.detail.ladderPrice){
          if (that.price == 0){return;}
          that.price = response.rows[0].money
        }else{
          if (that.detail.biddingDirect == 2 ||that.detail.biddingDirect == '反向竞价') {
            that.price = parseFloat(that.detail.price).toFixed(2)
          }else{
            that.price = parseFloat(that.detail.price).toFixed(2)
          }
        }
      }


    });
  },

    offerFirst(){
      let newMoney;
      projectNewBidMoney(this.id).then(response =>{
        if (response.data&&response.code==200){
          newMoney = response.data;
        }else{
          newMoney = this.detail.price;
        }

        let data= {
          projectId:this.id,
          memberId:this.memberId,
          userId:this.userId,
          userAccount:this.userAccount,
          userName:this.userName,
          money:parseFloat(newMoney),
          loginTime:Date.now($.ajax({async:false,data:{i: Date.parse(new Date())}}).getResponseHeader("Date"))
        };
        biddingSubmit(data).then(response =>{
          let _this = this
          if(response){
            this.$toast({
              icon: 'success', // 找到自己需要的图标
              message: '出价成功',
              duration:"1000",
              onClose:function(){
                clearInterval(this.timer);
                // _this.reload()
                _this.getBidding();
                if (_this.detail.delayPeriod != 0 && _this.delayPeriodNow){
                  _this.time = null;
                }
                if (_this.detail.biddingType=='自由竞价'||_this.detail.biddingType=='公开竞价'){
                  _this.price = null;
                }
              }
            })

          }
        })

      });
    },

    offer(){
      let newMoney;
      projectNewBidMoney(this.id).then(response =>{
        if (response.data&&response.code==200){
          newMoney = response.data;
        }else{
          newMoney = this.detail.price;
        }

        if (this.price==''||this.price==0||this.price<0||this.price == null){
          this.$toast({
            icon: 'fail', // 找到自己需要的图标
            message: '请输入出价金额',
            duration:"1000",
            onClose:function(){
            }
          })
          return;
        }
        if (this.detail.biddingDirect == '反向竞价'){
          // if (this.biddinglistInformation.length<1){
            if(this.detail.price<this.price){
              this.$toast({
                icon: 'fail', // 找到自己需要的图标
                message: '出价不能高于挂牌价格',
                duration:"1000",
                onClose:function(){
                }
              })
              return;
            }else{
              if (this.detail.biddingType=='阶梯竞价'||this.detail.biddingType=='公开竞价'){
                if (this.biddinglistInformation.length>1){
                  //判断用户出价不能高于当前出价最低价格
                  if(newMoney <= this.price){
                    this.$toast({
                      icon: 'fail', // 找到自己需要的图标
                      message: '出价不能高于当前出价最低价格',
                      duration:"1000",
                      onClose:function(){
                      }
                    })
                    return;
                  }
                }
              }
            }

        }else{
          if(this.detail.price>this.price){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能低于挂牌价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }else{
            if (this.detail.biddingType=='阶梯竞价'||this.detail.biddingType=='公开竞价'){
              if (this.biddinglistInformation.length>1){
                //判断用户出价不能高于当前出价最低价格
                //console.log(newMoney)
                //console.log(this.price)
                if(newMoney >= this.price){
                  this.$toast({
                    icon: 'fail', // 找到自己需要的图标
                    message: '出价不能低于当前出价最高价格',
                    duration:"1000",
                    onClose:function(){
                    }
                  })
                  return;
                }
              }
            }
          }
        }
        let data= {
          projectId:this.id,
          memberId:this.memberId,
          userId:this.userId,
          userAccount:this.userAccount,
          userName:this.userName,
          money:parseFloat(this.price),
          loginTime:Date.now($.ajax({async:false,data:{i: Date.parse(new Date())}}).getResponseHeader("Date"))
        };
        // console.log(Date.now($.ajax({async:false}).getResponseHeader("Date")))
        biddingSubmit(data).then(response =>{
          let _this = this
          if(response){
            // clearInterval(this.timer);
            this.$toast({
              icon: 'success', // 找到自己需要的图标
              message: '出价成功',
              duration:"1000",
              onClose:function(){
                clearInterval(this.timer);
                // _this.reload()
                _this.getBidding();
                if (_this.detail.delayPeriod != 0 && _this.delayPeriodNow){
                  _this.time = null;
                }
                if (_this.detail.biddingType=='自由竞价'||_this.detail.biddingType=='公开竞价'){
                  _this.price = null;
                }else{
                  _this.price = _this.price-_this.detail.ladderPrice;
                }
              }
            })
          }
        })
      });
    },
    add(){
      if (this.detail.biddingDirect == '反向竞价'){
        if (this.biddinglistInformation.length<1){
          if(this.detail.price <= this.price){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能高于挂牌价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }else{

          if(this.biddinglistInformation[0].money <= (parseFloat(this.price)+parseFloat(this.detail.ladderPrice)).toFixed(2)){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能高于当前出价最低价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }
      }else{
        if (this.biddinglistInformation.length<1){
          if(this.detail.price>this.price){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能低于挂牌价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }else{
          if(this.biddinglistInformation[0].money>this.price){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能低于当前出价最高价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }
      }
      //console.log(this.price == null)
      this.price == null?this.price = 0:this.price = this.price;
      this.detail.ladderPrice?this.price=(parseFloat(this.price)+parseFloat(this.detail.ladderPrice)).toFixed(2):this.price += 1
    },
    sub(){
      if (this.detail.biddingDirect == '反向竞价'){
        if (this.biddinglistInformation.length<1){
          if(this.detail.price<this.price){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能高于挂牌价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }else{
          if(this.biddinglistInformation[0].money<this.price){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能高于当前出价最低价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }
      }else{
        if (this.biddinglistInformation.length<1){
          if(this.detail.price>=this.price){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能低于挂牌价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }else{
          if(this.biddinglistInformation[0].money >= (parseFloat(this.price)-parseFloat(this.detail.ladderPrice)).toFixed(2)){
            this.$toast({
              icon: 'fail', // 找到自己需要的图标
              message: '出价不能低于当前出价最高价格',
              duration:"1000",
              onClose:function(){
              }
            })
            return;
          }
        }
      }

      this.price == null?this.price = 0:this.price = this.price;
      if (this.price == 0)return;
      this.detail.ladderPrice?this.price=(parseFloat(this.price)-parseFloat(this.detail.ladderPrice)).toFixed(2):this.price -= 1
      // if(this.detail.ladderPrice){
      //   if((this.price-this.detail.ladderPrice)>this.biddinglistInformation[0].money){
      //     this.price-=this.detail.ladderPrice
      //   }else{
      //     this.$toast({
      //       icon: 'error', // 找到自己需要的图标
      //       message: '出价不能低于当前最高价',
      //       duration:"1000",
      //     })
      //   }
      // }else{
      //   if((this.price-1)>this.biddinglistInformation[0].money){
      //     this.price-=1
      //   }else{
      //     this.$toast({
      //       icon: 'error', // 找到自己需要的图标
      //       message: '出价不能低于当前最高价',
      //       duration:"1000",
      //     })
      //   }
      // }
    },
    timerChange(value){
      let d = value.days;
      let h = value.hours;
      let m = value.minutes;
      let s = value.seconds;
      let biddingStopTime =  Date.parse(this.detail.biddingStopTime)+0
      let nowDate = Date.parse(this.format($.ajax({async:false,data:{i: Date.parse(new Date())}}).getResponseHeader("Date"), "yyyy-MM-dd HH:mm:ss"));
      let time = this.detail.delayPeriod * 1000;

      if (s < 1 && m < 1){
        console.log("竞价结束22222222222")
        getBiddingStopTime(this.id).then(response => {
          this.$set(this.detail,'biddingStopTime',response.data)
          let timeNew = Date.parse(response.data) + 0 - nowDate;
          if (timeNew > 0) {
            this.$set(this.detail,'biddingStopTime',response.data)
            this.getTime();
          } else {
            this.process = "竞价结束"
            this.tip = this.detail.biddingStopTime + "结束竞价"
            this.btnMsg = "竞价结束"
            this.timeMsg = "竞价结束"
            this.time = 0
            this.isSignup = true
            this.showBtn = false
            this.biddingTimeType = 2;
            return;
          }
        });
      }else if (s%2 == 0&&time!=0){

        //console.log('aaa')
        // console.log((biddingStopTime-nowDate))
        // console.log(time)
        // this.getTime();
        if ((biddingStopTime-nowDate)<=time){
          // console.log("竞价剩余两分钟"+"m:"+m+"s:"+s)
          getBiddingStopTime(this.id).then(response =>{
            if(this.detail.biddingStopTime!=response.data){
              console.log('有人出价')
              this.time = null;
            }
            this.detail.biddingStopTime = response.data
            this.$set(this.detail,'biddingStopTime',response.data);
            this.delayPeriodNow = true;
            // this.time = Date.parse(response.data)+0-nowDate;
          });
        }
      }

    },
    TimeInterval(timestamp) {
      //时间戳转化为天时分秒
      // 总秒数
      var second = Math.floor(timestamp/ 1000);
      // 天数
      var day = Math.floor(second / 3600 / 24);
      // 小时
      var hr = Math.floor(second / 3600 % 24);
      // 分钟
      var min = Math.floor(second / 60 % 60);
      // 秒
      var sec = Math.floor(second % 60);

      return (day?day + "天":'0天') + (hr?hr+ "时":'0时') + ( min?min + "分":'0分') + sec + "秒";

    },
  },
  destroyed () {
    console.log('bbbbbbbbbb')
    clearInterval(this.timer);
    clearInterval(this.timeCount);
  },
  beforeDestory() {
    clearInterval(this.timer)
    clearInterval(this.timeCount);
  },
  //离开页面清除定时器失效问题
  beforeRouteLeave(to, from, next) {
    console.log("我离开了")
    clearInterval(this.timer)
    clearInterval(this.timeCount);
    this.time = null;
    next()
  }
};
</script>

<style scoped lang="scss">
.app-container {
  background: #F4F8FB;
  height: 100vh;
  overflow-y: scroll;
}
/deep/ .van-tabs__content{
  background: transparent;
  /*border-radius: 20PX;*/
}
/deep/ .van-tabs__nav{
  /*background: transparent;*/
  padding-bottom: 0;
}
/deep/ .van-tab--active{
  background: #fff;
}
/deep/ .van-tab::after{
  display: none;
}
/deep/ .van-tabs__wrap{
  overflow: initial;
}
/deep/ .van-tabs__line{
  /*background: linear-gradient(to right, #5166f5, #97eedc);*/
  background: url("../../../static/images/transaction_new/tab_border.png") no-repeat center;
  height: 0.35rem;
  bottom: 0;
}
/deep/ .van-tab:nth-child(1)::before{
  content: "";
  position: absolute;
  left: auto;
  top: 0;
  right: -19%;
  bottom: 0;
  background: url("../../../static/images/yinnong/login_tab_icon.png") no-repeat center;
  background-size: 100% 100%;
  width: 20%;
}
/deep/ .van-tab:nth-child(2)::before{
  content: "";
  position: absolute;
  left: -19%;
  top: 0;
  right: auto;
  bottom: 0;
  /*background: url("../../../static/images/yinnong/login_tab_icon_right.png") no-repeat center;*/
  /*background-size: 100% 100%;*/
  width: 20%;
}
.van-count-down{
  display: inline-block;
  color: #fff;
}
.custom-indicator {
  position: absolute;
  right: 20px;
  bottom: 20px;
  padding: 0px 20px;
  font-size: 12px;
  /*rgba(0, 0, 0, 0.1)*/
  background: rgba(0, 0, 0, 0.2);
  color: #FFF;
  border-radius: 20px;
  line-height: 0.5rem;
}
.title{
  font-size: 0.45rem;
  margin-bottom: 10PX;
}
.my-swipe{
  width: 100%;
}
.my-swipe .van-swipe-item .van-image{
  width: 100%;
}
.information{
  background-color: #FFF;
  padding: 0.4rem 0.5rem;
  width: 94%;
  margin: 0.3rem auto 0;
  border-radius: 10PX;
}
.van-row{
  line-height: 0.7rem;
}
.price{
  color: #FF2D2D;
}
.price span{
  font-size: 0.5rem;
  font-weight: bold;
}
.money{
  color: #FF2D2D;
}
.money span{
  font-size: 0.5rem;
  font-weight: bold;
}
.van-count-down{
  line-height: 0.7rem;
}
.lead{
  background: #FFF url("../../../static/images/transaction_new/project/project_icon_02.png") no-repeat center;
  background-size: 100% 100%;
  padding: 0.2rem 0.5rem;
  color: #FF2D2D;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 94%;
  margin: 0.3rem auto 0;
  border-radius: 10PX;
}
.detail{
  background-color: #FFF;
  padding: 0.2rem 0.5rem;
  width: 94%;
  margin: 0.3rem auto 0;
  border-radius: 10PX;
}
.detail span{
  color: #8A8A8A;
}
.delTitle{
  font-size: 16PX;
  color: #333333;
  padding: 0.2rem 0;
  display: flex;
  align-items: center;
  line-height: 1;
  i{
    background: #0CBEA6;
    width: 4PX;
    height: 14PX;
    border-radius: 100PX;
    margin-right: 5PX;
  }
}
.gnbg{
  background: #ffffff linear-gradient(rgba(13,188,170,.28),#ffffff) no-repeat;
  background-size: 100% 50Px;
}
.introduce{
  padding: 0.2rem 0.5rem 0.5rem;
  background-color: #FFF;
  width: 94%;
  margin: 0.3rem auto 0;
  border-radius: 10PX;
}
.introduce span{
  color: #8A8A8A;
  margin-right: 20px;
}
.project_info{
  border: 1px solid #DCDCDC;
  padding: 0px 20px;
  margin-top: 10px;
  border-radius: 10px;
}
.notice{
  padding: 0.2rem 0.5rem 0.5rem;
  background-color: #FFF;
  width: 94%;
  margin: 0.3rem auto 0;
  border-radius: 10PX;
}
.notice div p{
  line-height: 0.7rem;
}
.biddingList{
  padding: 0.2rem 0.5rem 0.5rem;
  background-color: #FFF;
  width: 94%;
  margin: 0.3rem auto 0.4rem;
  border-radius: 10PX;
}
.biddingList table{
  text-align: center;
}
.biddingList table td{
  text-align: center;
  padding: 10px 0px;
}
.biddingList table tr:first-child td{
  background-color: #0DBCAA;
  color: #FFF;
}
.bottomBtn{
  padding: 0.2rem 0.2rem;
  background-color: #FFF;
  position: fixed;
  bottom: 0;
  width: 100%;
}
  .popup{
    text-align: center;
    padding: 0.5rem;
    border-radius: 20px;
    width: 70%;
    padding-top: 1.5rem;
  }
  .popupTit{
    color: #0DBCAA;
    font-size: 0.4rem;
    line-height: 0.9rem;
  }
  .popupContent{
    color: #666666;
  }
  .iKnow{
    margin-top: 1rem;
  }
  .updatePopup{
    color: #0DBCAA;
    margin-top: 0.5rem;
  }
</style>