|
@@ -1,21 +1,310 @@ |
|
|
<template> |
|
|
<template> |
|
|
<biddingHallApply></biddingHallApply> |
|
|
|
|
|
|
|
|
<div> |
|
|
|
|
|
<van-search |
|
|
|
|
|
v-model="value" |
|
|
|
|
|
shape="round" |
|
|
|
|
|
background="#fff" |
|
|
|
|
|
placeholder="请输入搜索关键词" |
|
|
|
|
|
@search="onSearch" |
|
|
|
|
|
/> |
|
|
|
|
|
<van-row> |
|
|
|
|
|
<van-dropdown-menu> |
|
|
|
|
|
<van-dropdown-item v-model="value1" :options="projectTypeOption" @change="getList"/> |
|
|
|
|
|
<van-dropdown-item :value="value2" :title="value2"> |
|
|
|
|
|
<van-tree-select |
|
|
|
|
|
:active-id.sync="activeId" |
|
|
|
|
|
:items="deptListOption" |
|
|
|
|
|
:main-active-index.sync="activeIndex" |
|
|
|
|
|
:max="1" |
|
|
|
|
|
@click-item="clickItem" |
|
|
|
|
|
@click-nav="clickNav" |
|
|
|
|
|
/> |
|
|
|
|
|
</van-dropdown-item> |
|
|
|
|
|
<van-dropdown-item v-model="value3" :options="option3" @change="getList"/> |
|
|
|
|
|
</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"> |
|
|
|
|
|
<div class="biddingProcess"> |
|
|
|
|
|
<van-image |
|
|
|
|
|
class="biddingProcess_img" |
|
|
|
|
|
:src="iconList.bjd" |
|
|
|
|
|
/> |
|
|
|
|
|
</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.bzj" |
|
|
|
|
|
/> |
|
|
|
|
|
</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.cj" |
|
|
|
|
|
/> |
|
|
|
|
|
</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.jcxx" |
|
|
|
|
|
/> |
|
|
|
|
|
</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.k" |
|
|
|
|
|
/> |
|
|
|
|
|
</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.xmjflc" |
|
|
|
|
|
/> |
|
|
|
|
|
</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> |
|
|
|
|
|
<p class="biddingProcess_text">第七步</p> |
|
|
|
|
|
<p class="biddingProcess_text">结算交割</p> |
|
|
|
|
|
</van-col> |
|
|
|
|
|
<van-col span="1"></van-col> |
|
|
|
|
|
</van-row> |
|
|
|
|
|
<van-pull-refresh v-model="refreshing" @refresh="onRefresh"> |
|
|
|
|
|
<van-list |
|
|
|
|
|
v-model="loading" |
|
|
|
|
|
:finished="finished" |
|
|
|
|
|
finished-text="没有更多了" |
|
|
|
|
|
@load="onL" |
|
|
|
|
|
> |
|
|
|
|
|
<van-row v-for="(item,index) in infoList" :key="index" :title="item"> |
|
|
|
|
|
<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">{{item.currentPrice}}</span> <span>{{item.priceUnit}}</span></van-row> |
|
|
|
|
|
</van-col> |
|
|
|
|
|
</van-row> |
|
|
|
|
|
</van-list> |
|
|
|
|
|
</van-pull-refresh> |
|
|
|
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
|
import biddingHallApply from "../../components/biddingHall/biddingHallApply"; |
|
|
|
|
|
export default { |
|
|
|
|
|
name: "biddingHall", |
|
|
|
|
|
components:{biddingHallApply}, |
|
|
|
|
|
data() { |
|
|
|
|
|
return { |
|
|
|
|
|
input: '' |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
import {getBiddingList, getDeptList} from "../../api/biddingHall"; |
|
|
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
|
name: "biddingHallApply", |
|
|
|
|
|
data() { |
|
|
|
|
|
return { |
|
|
|
|
|
//标的物类型 |
|
|
|
|
|
projectTypeOption:[{text:'标的物类型',value:''}], |
|
|
|
|
|
input: '', |
|
|
|
|
|
iconList: { |
|
|
|
|
|
bjd: "../../static/images/11.png", |
|
|
|
|
|
bzj:"../../static/images/22.png", |
|
|
|
|
|
cj:"../../static/images/33.png", |
|
|
|
|
|
jcxx:"../../static/images/44.png", |
|
|
|
|
|
k:"../../static/images/55.png", |
|
|
|
|
|
xmjflc:"../../static/images/66.png", |
|
|
|
|
|
zj:"../../static/images/77.png", |
|
|
|
|
|
}, |
|
|
|
|
|
iconWidthHeight:"0.4rem", |
|
|
|
|
|
infoList:[], |
|
|
|
|
|
value1: '', |
|
|
|
|
|
value2: '标的物位置', |
|
|
|
|
|
activeId: 1, |
|
|
|
|
|
activeIndex: 0, |
|
|
|
|
|
value3: '', |
|
|
|
|
|
value:"", |
|
|
|
|
|
info:[], |
|
|
|
|
|
//标的物所在地 |
|
|
|
|
|
deptListOption: [ |
|
|
|
|
|
], |
|
|
|
|
|
option3: [ |
|
|
|
|
|
{ text: '竞价状态', value: '' }, |
|
|
|
|
|
{ text: '全部', value: '全部' }, |
|
|
|
|
|
{ text: '竞价中', value: '竞价中' }, |
|
|
|
|
|
{ text: '竞价结束', value: '竞价结束' }, |
|
|
|
|
|
], |
|
|
|
|
|
loading: false, |
|
|
|
|
|
finished: false, |
|
|
|
|
|
refreshing: false, |
|
|
} |
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
created(){ |
|
|
|
|
|
this.getDicts("project_type").then(response => { |
|
|
|
|
|
response.data.map(item => { |
|
|
|
|
|
this.projectTypeOption.push({ value:item.dictCode, text: item.dictLabel}); |
|
|
|
|
|
}); |
|
|
|
|
|
}); |
|
|
|
|
|
getDeptList().then(response => { |
|
|
|
|
|
response.data.map(item => { |
|
|
|
|
|
getDeptList(item.deptId).then(res => { |
|
|
|
|
|
let list = [] |
|
|
|
|
|
res.data.map(i =>{ |
|
|
|
|
|
list.push({text:i.deptName,children:[],id:i.deptId}) |
|
|
|
|
|
}) |
|
|
|
|
|
if(list.length==0){ |
|
|
|
|
|
list.push({text:item.deptName,id:item.deptId}) |
|
|
|
|
|
}else{ |
|
|
|
|
|
this.deptListOption.push({ text: item.deptName,children: list}); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
|
}); |
|
|
|
|
|
}); |
|
|
|
|
|
}, |
|
|
|
|
|
methods:{ |
|
|
|
|
|
getList(){ |
|
|
|
|
|
let queryDatas = { |
|
|
|
|
|
deptId: this.value1, |
|
|
|
|
|
projectNumber:this.activeId, |
|
|
|
|
|
projectShowStatus:this.value3 |
|
|
|
|
|
} |
|
|
|
|
|
getBiddingList(queryDatas).then(response =>{ |
|
|
|
|
|
this.infoList = response.rows.map(item => { |
|
|
|
|
|
if (item.biddingStopTime!=""){ |
|
|
|
|
|
let time = 0 |
|
|
|
|
|
let endDate = Date.parse(item.biddingStopTime); |
|
|
|
|
|
let nowDate = Date.parse(new Date()); |
|
|
|
|
|
if(endDate>nowDate){ |
|
|
|
|
|
time = endDate-nowDate>0?endDate-nowDate:0 |
|
|
|
|
|
} |
|
|
|
|
|
return{content:item.projectName,deadline:time,currentPrice:item.price,priceUnit:item.unit} |
|
|
|
|
|
}else { |
|
|
|
|
|
return{content:item.projectName,deadline:0,currentPrice:item.price,priceUnit:item.unit} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
}) |
|
|
|
|
|
}); |
|
|
|
|
|
}, |
|
|
|
|
|
clickNav(index){ |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
clickItem(data){ |
|
|
|
|
|
if(data.text==this.value2){ |
|
|
|
|
|
this.activeId=1 |
|
|
|
|
|
this.value2='标的物位置' |
|
|
|
|
|
}else{ |
|
|
|
|
|
this.value2=data.text |
|
|
|
|
|
} |
|
|
|
|
|
this.getList() |
|
|
|
|
|
}, |
|
|
|
|
|
onSearch(val) { |
|
|
|
|
|
this.loading = true; |
|
|
|
|
|
if(this.infoList.length>0){ |
|
|
|
|
|
let newList = [] |
|
|
|
|
|
for(let j = 0 ;j<this.infoList.length;j++){ |
|
|
|
|
|
if(this.infoList[j].content.indexOf(val)>-1){ |
|
|
|
|
|
newList.push(this.infoList[j]); |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
this.infoList = newList |
|
|
|
|
|
} |
|
|
|
|
|
if(val==""){ |
|
|
|
|
|
this.getList() |
|
|
|
|
|
} |
|
|
|
|
|
this.loading = false; |
|
|
|
|
|
}, |
|
|
|
|
|
onL() { |
|
|
|
|
|
this.refreshing = true; |
|
|
|
|
|
this.loading = false; |
|
|
|
|
|
this.getList() |
|
|
|
|
|
this.refreshing = false; |
|
|
|
|
|
}, |
|
|
|
|
|
onRefresh() { |
|
|
|
|
|
// 清空列表数据 |
|
|
|
|
|
this.finished = false; |
|
|
|
|
|
// 重新加载数据 |
|
|
|
|
|
// 将 loading 设置为 true,表示处于加载状态 |
|
|
|
|
|
this.loading = true; |
|
|
|
|
|
this.onL(); |
|
|
|
|
|
}, |
|
|
|
|
|
}, |
|
|
|
|
|
} |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style scoped> |
|
|
<style scoped> |
|
|
|
|
|
.van-search__content{ |
|
|
|
|
|
border:1px solid #007E72; |
|
|
|
|
|
} |
|
|
|
|
|
>>> .van-dropdown-menu__title{ |
|
|
|
|
|
font-size: 0.2rem; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcess { |
|
|
|
|
|
width:0.55rem; |
|
|
|
|
|
height:0.55rem; |
|
|
|
|
|
margin: 0 auto; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcess_img{ |
|
|
|
|
|
width:100%; |
|
|
|
|
|
height:100%; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcessTitle{ |
|
|
|
|
|
background-color:#007E72; |
|
|
|
|
|
color:#fff; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
line-height: 0.8rem; |
|
|
|
|
|
font-size: 14px; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcess_text{ |
|
|
|
|
|
font-size: 0.2rem; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcessContent{ |
|
|
|
|
|
padding:0.4rem 0; |
|
|
|
|
|
background-color: #efefef; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcessListLeftCol{ |
|
|
|
|
|
padding:10px 0.25rem 10px 0.3rem; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcessListLeftCol span{ |
|
|
|
|
|
font-size: 0.38rem; |
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcessListRightCol |
|
|
|
|
|
{ |
|
|
|
|
|
padding:10px 0.3rem 10px 0.25rem; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
.biddingProcessListRightCol span{ |
|
|
|
|
|
color: #c21F3a; |
|
|
|
|
|
font-size: 10px; |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |