2 değiştirilmiş dosya ile 220 ekleme ve 87 silme
Görünümü Böl
Diff Seçenekleri
+ 220
- 87
src/views/biddingHall/index.vue
Dosyayı Görüntüle
| @@ -30,84 +30,74 @@ | |||
| <van-dropdown-item v-model="value3" :options="option3" @change="tabChange"/> | |||
| </van-dropdown-menu> | |||
| </van-row> | |||
| <van-row type="flex" justify="center" class="biddingProcessTitle"> | |||
| <van-col span="24">竞价流程</van-col> | |||
| </van-row> | |||
| <van-row type="flex" justify="space-around" class="biddingProcessContent"> | |||
| <van-col span="1"> | |||
| </van-col> | |||
| <van-col span="3"> | |||
| <p class="biddingProcessTitle"> | |||
| <img src="../../../static/images/title_icon.png" alt=""> | |||
| 竞价流程 | |||
| </p> | |||
| <div class="biddingProcessContent"> | |||
| <div class="content_li"> | |||
| <div class="biddingProcess"> | |||
| <van-image | |||
| class="biddingProcess_img" | |||
| :src="iconList.bjd" | |||
| /> | |||
| <i></i> | |||
| <div></div> | |||
| </div> | |||
| <p class="biddingProcess_text">第一步</p> | |||
| <p class="biddingProcess_text">查看项目</p> | |||
| </van-col> | |||
| <van-col span="3"> | |||
| </div> | |||
| <div class="content_li"> | |||
| <div class="biddingProcess"> | |||
| <van-image | |||
| class="biddingProcess_img" | |||
| :src="iconList.bzj" | |||
| /> | |||
| <div></div> | |||
| <i></i> | |||
| <div></div> | |||
| </div> | |||
| <p class="biddingProcess_text">第二步</p> | |||
| <p class="biddingProcess_text">注册报名</p> | |||
| </van-col> | |||
| <van-col span="3"> | |||
| </div> | |||
| <div class="content_li"> | |||
| <div class="biddingProcess"> | |||
| <van-image | |||
| class="biddingProcess_img" | |||
| :src="iconList.cj" | |||
| /> | |||
| <div></div> | |||
| <i></i> | |||
| <div></div> | |||
| </div> | |||
| <p class="biddingProcess_text">第三步</p> | |||
| <p class="biddingProcess_text">交保证金</p> | |||
| </van-col> | |||
| <van-col span="3"> | |||
| </div> | |||
| <div class="content_li"> | |||
| <div class="biddingProcess"> | |||
| <van-image | |||
| class="biddingProcess_img" | |||
| :src="iconList.jcxx" | |||
| /> | |||
| <div></div> | |||
| <i></i> | |||
| <div></div> | |||
| </div> | |||
| <p class="biddingProcess_text">第四步</p> | |||
| <p class="biddingProcess_text">资质审核</p> | |||
| </van-col> | |||
| <van-col span="3"> | |||
| </div> | |||
| <div class="content_li"> | |||
| <div class="biddingProcess"> | |||
| <van-image | |||
| class="biddingProcess_img" | |||
| :src="iconList.k" | |||
| /> | |||
| <div></div> | |||
| <i></i> | |||
| <div></div> | |||
| </div> | |||
| <p class="biddingProcess_text">第五步</p> | |||
| <p class="biddingProcess_text">参与竞价</p> | |||
| </van-col> | |||
| <van-col span="3"> | |||
| </div> | |||
| <div class="content_li"> | |||
| <div class="biddingProcess"> | |||
| <van-image | |||
| class="biddingProcess_img" | |||
| :src="iconList.xmjflc" | |||
| /> | |||
| <div></div> | |||
| <i></i> | |||
| <div></div> | |||
| </div> | |||
| <p class="biddingProcess_text">第六步</p> | |||
| <p class="biddingProcess_text">成交确认</p> | |||
| </van-col> | |||
| <van-col span="3"> | |||
| <div class="biddingProcess"> | |||
| <van-image | |||
| class="biddingProcess_img" | |||
| :src="iconList.zj" | |||
| /> | |||
| </div> | |||
| <div class="content_li"> | |||
| <div class="biddingProcess" style="justify-content: left;"> | |||
| <div></div> | |||
| <i></i> | |||
| </div> | |||
| <p class="biddingProcess_text">第七步</p> | |||
| <p class="biddingProcess_text">结算交割</p> | |||
| </van-col> | |||
| <van-col span="1"></van-col> | |||
| </van-row> | |||
| </div> | |||
| </div> | |||
| <!-- <van-pull-refresh v-model="refreshing" @refresh="onRefresh">--> | |||
| <van-list | |||
| v-model="loading" | |||
| @@ -115,29 +105,78 @@ | |||
| finished-text="没有更多了" | |||
| @load="getList" | |||
| > | |||
| <van-row v-for="(item,index) in infoList" :key="index" :title="item" @click="goDetail(item.id)"> | |||
| <van-col span="13" class="biddingProcessListLeftCol"> | |||
| <span >{{item.content}}</span> | |||
| </van-col> | |||
| <van-col span="11" class="biddingProcessListRightCol"> | |||
| <van-count-down :time="item.deadline"> | |||
| <template #default="timeData"> | |||
| <span style="color: #666666">距竞价结束</span><span>{{timeData.days}}天{{timeData.hours}}时{{timeData.minutes}}分{{timeData.seconds}}秒</span> | |||
| </template> | |||
| </van-count-down> | |||
| <van-row> | |||
| <span style="color: #666666">当前价 </span> | |||
| <span style="font-size: 14px" v-if="item.biddingType=='自由竞价'&&item.deadline>0"> | |||
| * | |||
| </span> | |||
| <span style="font-size: 14px" v-else> | |||
| {{item.money}} | |||
| </span> | |||
| <span v-if="item.money">{{item.priceUnit}}</span> | |||
| <span v-else>暂无出价</span> | |||
| </van-row> | |||
| </van-col> | |||
| </van-row> | |||
| <div class="list_li" v-for="(item,index) in infoList" :key="index" @click="goDetail(item.id)"> | |||
| <div class="list_li_tt"> | |||
| <p>{{item.content}}</p> | |||
| <p :style="{ | |||
| color: { | |||
| '未开始': '#007E72', | |||
| '已结束': '#c4c4c4', | |||
| '进行中': '#c21F3a', | |||
| }[item.timeType]}">{{item.timeType}}</p> | |||
| </div> | |||
| <div class="list_li_time"> | |||
| <van-count-down :time="item.deadline"> | |||
| <template #default="timeData"> | |||
| <span style="color: #c4c4c4">距竞价结束</span> | |||
| <span :style="{ | |||
| color: { | |||
| '未开始': '#007E72', | |||
| '已结束': '#c4c4c4', | |||
| '进行中': '#c21F3a', | |||
| }[item.timeType]}">{{timeData.days}}天{{timeData.hours}}时{{timeData.minutes}}分{{timeData.seconds}}秒</span> | |||
| </template> | |||
| </van-count-down> | |||
| <p> | |||
| <span style="color: #c4c4c4">当前价 </span> | |||
| <span :style="{'font-size':'14px', | |||
| color: { | |||
| '未开始': '#007E72', | |||
| '已结束': '#c4c4c4', | |||
| '进行中': '#c21F3a', | |||
| }[item.timeType]}" v-if="item.biddingType=='自由竞价'&&item.deadline>0"> | |||
| * | |||
| </span> | |||
| <span :style="{'font-size':'14px', | |||
| color: { | |||
| '未开始': '#007E72', | |||
| '已结束': '#c4c4c4', | |||
| '进行中': '#c21F3a', | |||
| }[item.timeType]}" v-else> | |||
| {{item.money}} | |||
| </span> | |||
| <span v-if="item.money" :style="{ | |||
| color: { | |||
| '未开始': '#007E72', | |||
| '已结束': '#c4c4c4', | |||
| '进行中': '#c21F3a', | |||
| }[item.timeType]}">{{item.priceUnit}}</span> | |||
| <span v-else :style="{ | |||
| color: { | |||
| '未开始': '#007E72', | |||
| '已结束': '#c4c4c4', | |||
| '进行中': '#c21F3a', | |||
| }[item.timeType]}">暂无出价</span> | |||
| </p> | |||
| </div> | |||
| </div> | |||
| <!-- <van-row v-for="(item,index) in infoList" :key="index" :title="item" @click="goDetail(item.id)">--> | |||
| <!-- <van-col span="13" class="biddingProcessListLeftCol">--> | |||
| <!-- <span >{{item.content}}</span>--> | |||
| <!-- </van-col>--> | |||
| <!-- <van-col span="11" class="biddingProcessListRightCol">--> | |||
| <!-- <van-count-down :time="item.deadline">--> | |||
| <!-- <template #default="timeData">--> | |||
| <!-- <span style="color: #666666">距竞价结束</span><span>{{timeData.days}}天{{timeData.hours}}时{{timeData.minutes}}分{{timeData.seconds}}秒</span>--> | |||
| <!-- </template>--> | |||
| <!-- </van-count-down>--> | |||
| <!-- <van-row>--> | |||
| <!-- </van-row>--> | |||
| <!-- </van-col>--> | |||
| <!-- </van-row>--> | |||
| </van-list> | |||
| <!-- </van-pull-refresh>--> | |||
| </div> | |||
| @@ -224,6 +263,32 @@ export default { | |||
| this.queryParams.projectShowStatus = this.value3; | |||
| getBiddingList(this.queryParams).then(response =>{ | |||
| response.rows.map(item => { | |||
| if(item.biddingStopTime != null || item.biddingStartTime != null){ | |||
| var endTimes=item.biddingStopTime.substring(0,10).split('-'); | |||
| var biddingStopTime=endTimes[1]+'/'+endTimes[2]+'/'+endTimes[0]+' '+item.biddingStopTime.substring(10,19); | |||
| var startTimes=item.biddingStartTime.substring(0,10).split('-'); | |||
| var biddingStartTime=startTimes[1]+'/'+startTimes[2]+'/'+startTimes[0]+' '+item.biddingStartTime.substring(10,19); | |||
| var nowTime = Date.parse(new Date()); | |||
| var leftTime = Date.parse(biddingStopTime)-nowTime; | |||
| var rightTime = Date.parse(biddingStartTime)-nowTime; | |||
| console.log(biddingStopTime) | |||
| console.log(leftTime) | |||
| if(leftTime>0){ | |||
| console.log('进行中') | |||
| item.timeType = '进行中' | |||
| } | |||
| if(leftTime<0){ | |||
| console.log('已结束') | |||
| item.timeType = '已结束' | |||
| } | |||
| if(rightTime>0){ | |||
| console.log('未开始') | |||
| item.timeType = '未开始' | |||
| } | |||
| } | |||
| if (item.biddingStopTime!=""){ | |||
| let time = 0 | |||
| let endDate = Date.parse(item.biddingStopTime); | |||
| @@ -232,9 +297,9 @@ export default { | |||
| time = endDate-nowDate>0?endDate-nowDate:0 | |||
| } | |||
| console.log(time) | |||
| this.infoList.push({content:item.projectName,deadline:time,currentPrice:item.price,priceUnit:item.unit,id:item.id,money:item.money}) | |||
| this.infoList.push({content:item.projectName,deadline:time,currentPrice:item.price,priceUnit:item.unit,id:item.id,money:item.money,timeType:item.timeType}) | |||
| }else{ | |||
| this.infoList.push({content:item.projectName,deadline:0,currentPrice:item.price,priceUnit:item.unit,id:item.id,money:item.money}) | |||
| this.infoList.push({content:item.projectName,deadline:0,currentPrice:item.price,priceUnit:item.unit,id:item.id,money:item.money,timeType:item.timeType}) | |||
| } | |||
| }) | |||
| if(this.infoList.length >= response.total){ | |||
| @@ -301,7 +366,47 @@ export default { | |||
| } | |||
| </script> | |||
| <style scoped> | |||
| <style scoped lang="scss"> | |||
| .list_li{ | |||
| width: 94%; | |||
| background: #ffffff; | |||
| border-radius: 8PX; | |||
| margin: 15PX auto 0; | |||
| padding: 3vw 5%; | |||
| .list_li_tt{ | |||
| display: flex; | |||
| justify-content: space-between; | |||
| padding-bottom: 10PX; | |||
| border-bottom: 1PX solid rgb(239,239,239); | |||
| align-items: center; | |||
| p{ | |||
| line-height: 1; | |||
| &:nth-child(1){ | |||
| color: #333333; | |||
| font-weight: bold; | |||
| font-size: 16PX; | |||
| display: -webkit-box; | |||
| -webkit-box-orient: vertical; | |||
| -webkit-line-clamp: 1; | |||
| word-break: break-all; | |||
| overflow: hidden; | |||
| } | |||
| &:nth-child(2){ | |||
| flex-shrink: 0; | |||
| } | |||
| } | |||
| } | |||
| .list_li_time{ | |||
| display: flex; | |||
| align-items: center; | |||
| justify-content: space-between; | |||
| margin-top: 10PX; | |||
| } | |||
| } | |||
| .van-search__content{ | |||
| border:1px solid #007E72; | |||
| } | |||
| @@ -309,9 +414,21 @@ export default { | |||
| /* font-size: 14PX;*/ | |||
| /*}*/ | |||
| .biddingProcess { | |||
| width:5vw; | |||
| height:5vw; | |||
| margin: 0 auto; | |||
| display: flex; | |||
| align-items: center; | |||
| justify-content: right; | |||
| div{ | |||
| width: calc(50% - 4PX); | |||
| border-top: 1PX solid rgb(196,196,196); | |||
| } | |||
| i{ | |||
| width: 8PX; | |||
| height: 8PX; | |||
| display: block; | |||
| background: rgb(196,196,196); | |||
| border-radius: 50%; | |||
| } | |||
| } | |||
| .biddingProcess_img{ | |||
| width:100%; | |||
| @@ -323,14 +440,30 @@ export default { | |||
| text-align: center; | |||
| line-height: 0.8rem; | |||
| font-size: 14PX; | |||
| display: flex; | |||
| align-items: center; | |||
| justify-content: center; | |||
| padding: 5PX 0; | |||
| img{ | |||
| margin-right: 5PX; | |||
| width: 18PX; | |||
| } | |||
| } | |||
| .biddingProcess_text{ | |||
| /*font-size: 1vh;*/ | |||
| margin-top: 10PX; | |||
| color: rgb(196,196,196); | |||
| } | |||
| .biddingProcessContent{ | |||
| padding:0.4rem 0; | |||
| background-color: #efefef; | |||
| background-color: #ffffff; | |||
| text-align: center; | |||
| display: flex; | |||
| align-items: flex-start; | |||
| justify-content: center; | |||
| .content_li{ | |||
| width: 15%; | |||
| } | |||
| } | |||
| .biddingProcessListLeftCol{ | |||
| padding:10px 0.25rem 10px 0.3rem; | |||
BIN
static/images/title_icon.png
Dosyayı Görüntüle
| Önce | Sonra |
|---|---|
|
|
| Genişlik: 16 | Yükseklik: 16 | Boyut: 403 B |