移动端
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

projectDetail.vue 37 KiB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099
  1. <template>
  2. <div class="app-container">
  3. <van-nav-bar
  4. title="项目详情"
  5. left-arrow
  6. fixed
  7. placeholder
  8. @click-left="$router.back(-1)"
  9. />
  10. <van-tabs scrollspy sticky color="#007b76" >
  11. <van-tab title="竞拍信息" title-style="font-size:12px;">
  12. <!-- <van-swipe class="my-swipe" height="235" indicator-color="white" @change="onChange">-->
  13. <!-- <template v-if="detail.fileUrlList !== undefined &&detail.fileUrlList.length>0">-->
  14. <!-- <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>-->
  15. <!-- </template>-->
  16. <!-- <template v-else>-->
  17. <!-- <van-swipe-item><van-image src="../../static/images/zwtp.jpg" height="235" /></van-swipe-item>-->
  18. <!-- </template>-->
  19. <!-- <template #indicator>-->
  20. <!-- <div class="custom-indicator">{{ current + 1 }}/{{ detail.fileUrlList !== undefined &&detail.fileUrlList.length>0 ? detail.fileUrlList.length:1 }}</div>-->
  21. <!-- </template>-->
  22. <!-- </van-swipe>-->
  23. <van-notice-bar color="#fff" background="#007E72" left-icon="clock-o">
  24. {{ process }}&nbsp&nbsp&nbsp&nbsp<van-count-down ref="countDown" :time="time" format="DD 天 HH 时 mm 分 ss 秒" @change="timerChange" />
  25. </van-notice-bar>
  26. <div class="information">
  27. <van-row>
  28. <van-col span="24" class="title">【{{ detail.rollout }}】{{ detail.projectName }}</van-col>
  29. </van-row>
  30. <van-row>
  31. <van-col span="5">挂牌价</van-col>
  32. <van-col span="19" class="price"><span>{{detail.price}}</span> {{detail.unit}}</van-col>
  33. </van-row>
  34. <van-row>
  35. <van-col span="5">保证金</van-col>
  36. <van-col span="19" class="money"><span>{{ detail.deposit }}</span> 元</van-col>
  37. </van-row>
  38. </div>
  39. <div class="lead" v-if="detail.biddingType != '自由竞价' || biddingTimeType == 2">
  40. <van-row >
  41. <van-col span="2"><van-image src="../../static/images/icon/phone.png" style="vertical-align: text-top;" /></van-col>
  42. <template v-if="biddinglistInformation!=undefined&&biddinglistInformation.length>0">
  43. <van-col span="3">{{biddinglistInformation[0].memberId}}</van-col>
  44. <van-col span="6">{{biddinglistInformation[0].money}}元</van-col>
  45. <van-col span="4">领先</van-col>
  46. <van-col span="9">{{biddinglistInformation[0].createTime}}</van-col>
  47. </template>
  48. </van-row>
  49. </div>
  50. <div class="detail">
  51. <van-row>
  52. <van-col span="24"><span>报名开始时间:</span>{{ detail.signupStartTime }}</van-col>
  53. </van-row>
  54. <van-row>
  55. <van-col span="24"><span>报名截止时间:</span>{{ detail.signupStopTime }}</van-col>
  56. </van-row>
  57. <van-row>
  58. <van-col span="24"><span>竞价开始时间:</span>{{ detail.biddingStartTime }}</van-col>
  59. </van-row>
  60. <van-row>
  61. <van-col span="24"><span>竞价截止时间 <span v-if="detail.delayPeriod!=0">(含延期)</span>:</span>{{ detail.biddingStopTime }}</van-col>
  62. </van-row>
  63. <van-row>
  64. <van-col span="24"><span>竞价方式:</span>{{ detail.biddingType }}</van-col>
  65. </van-row>
  66. <van-row>
  67. <van-col span="24"><span>竞价方向:</span>{{ detail.biddingDirect }}</van-col>
  68. </van-row>
  69. <van-row v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'">
  70. <van-col span="24"><span>阶梯价(增减幅度):</span>¥{{ detail.ladderPrice }}</van-col>
  71. </van-row>
  72. <van-row v-if="detail.delayPeriod!=0">
  73. <van-col span="24"><span>延时周期:</span>{{detail.delayPeriod}}秒</van-col>
  74. </van-row>
  75. <van-row v-if="detail.delayPeriod!=0">
  76. <van-col span="24"><span>延时周期说明:</span>竞价的最后{{detail.delayPeriod}}秒内,任意方出价,距结束时间将延长{{detail.delayPeriod}}秒,直至无人出价为止</van-col>
  77. </van-row>
  78. </div>
  79. </van-tab>
  80. <van-tab title="标的物介绍" title-style="font-size:12px;">
  81. <p class="delTitle">标的物介绍</p>
  82. <div class="introduce">
  83. <van-row>
  84. <van-col span="24" style="color:#333333;font-size: 0.4rem;text-align: center;font-weight: bold;">项目挂牌转出方简况及公告内容</van-col>
  85. </van-row>
  86. <van-row>
  87. <van-col span="24"><span>转出方名称</span>{{ detail.outName }}</van-col>
  88. </van-row>
  89. <van-row>
  90. <van-col span="24"><span>住址</span>{{ detail.address }}</van-col>
  91. </van-row>
  92. <van-row>
  93. <van-col span="12"><span>经济类型</span>{{ detail.economicType }}</van-col>
  94. <van-col span="12"><span>统一社会信用代码</span>{{ detail.areaNum }}</van-col>
  95. </van-row>
  96. <van-row>
  97. <van-col span="12"><span>法人/负责人</span>{{ detail.legalPerson }}</van-col>
  98. <van-col span="12"><span>联系电话</span>{{ detail.phone }}</van-col>
  99. </van-row>
  100. <van-row>
  101. <van-col span="12"><span>项目类型</span>{{ detail.projectNumber }}</van-col>
  102. <van-col span="12"><span>农地性质</span>{{ detail.projectType }}</van-col>
  103. </van-row>
  104. <van-row>
  105. <van-col span="24"><span>转出项目名称</span>{{ detail.projectName }}</van-col>
  106. </van-row>
  107. <van-row>
  108. <van-col span="24"><span>坐落</span>{{ detail.locationName }}</van-col>
  109. </van-row>
  110. <!-- <van-row>-->
  111. <!-- <van-col span="14"><span>是否属再次转出</span>{{ detail.twoout == 'N'?"否":"是"}}</van-col>-->
  112. <!-- <van-col span="10"><span>前次转出方式</span>{{ detail.oneout}}</van-col>-->
  113. <!-- </van-row>-->
  114. <van-row>
  115. <van-col span="12"><span>拟转出方式</span>{{ detail.rollout }}</van-col>
  116. <van-col span="12"><span>拟转出面积/数量</span> {{detail.allCount}}{{detail.allCountUnit}} </van-col>
  117. </van-row>
  118. <van-row>
  119. <van-col span="24"><span>拟转出期限</span>{{detail.outStartTime}} 至 {{detail.outStopTime}}&nbsp&nbsp&nbsp&nbsp&nbsp共{{detail.outYearNum}}年</van-col>
  120. </van-row>
  121. <van-row>
  122. <van-col span="24"><span>涉及农户数</span>{{ detail.peasantNum }}</van-col>
  123. </van-row>
  124. <van-row>
  125. <van-col span="24"><span>支付方式</span>{{ detail.paymentType }}</van-col>
  126. </van-row>
  127. <van-row>
  128. <van-col span="24"><span>授权情况</span>{{ detail.authorization }}</van-col>
  129. </van-row>
  130. <van-row>
  131. <van-col span="24"><span>{{detail.projectNumber == '小微工程' ? '工程内容':'拟流转土地用途'}}</span>{{ detail.contractPurpose }}</van-col>
  132. </van-row>
  133. <van-row>
  134. <van-col span="24"><span>{{detail.projectNumber == '小微工程' ? '承包范围':'其它需要披露的事项'}}</span>{{ detail.cracksEvents }}</van-col>
  135. </van-row>
  136. <van-row>
  137. <van-col span="24"><span>受让方条件</span>{{ detail.condition }}</van-col>
  138. </van-row>
  139. <van-row>
  140. <van-col span="24" style="color:#007E72;">标的物信息</van-col>
  141. </van-row>
  142. <div class="project_info" v-for="(item,index) in detail.subjectList" :key="index">
  143. <van-row>
  144. <van-col span="8">{{ item.landName }}</van-col>
  145. <van-col span="8">{{ item.area }}{{item.areaUnit}}</van-col>
  146. <van-col span="8">{{ item.condition}}</van-col>
  147. </van-row>
  148. </div>
  149. </div>
  150. </van-tab>
  151. <van-tab title="标的物图片" title-style="font-size:12px;">
  152. <p class="delTitle">标的物图片</p>
  153. <template v-if="detail.fileUrlList !== undefined &&detail.fileUrlList.length>0">
  154. <van-image 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;" />
  155. </template>
  156. <template v-else>
  157. <van-image src="../../static/images/index/detailImg.png" style="vertical-align: text-top;" />
  158. </template>
  159. </van-tab>
  160. <van-tab title="竞买须知" title-style="font-size:12px;">
  161. <p class="delTitle">竞买须知</p>
  162. <div class="notice" v-html="webConfig">
  163. </div>
  164. </van-tab>
  165. <van-tab title="竞价记录" title-style="font-size:12px;">
  166. <p class="delTitle">竞价记录</p>
  167. <div class="biddingList">
  168. <p v-if="detail.biddingType == '自由竞价' && biddingTimeType != 2">友情提示:自由竞价方式下,竞价过程中不显示竞价记录!</p>
  169. <table v-else width="100%" cellspacing="0">
  170. <tr>
  171. <td>出价人</td>
  172. <td>出价</td>
  173. <td>状态</td>
  174. <td>时间</td>
  175. </tr>
  176. <tr v-for="(item,index) in biddinglistInformation" :key="index">
  177. <td>{{ item.memberId }}</td>
  178. <td>{{ item.money}}</td>
  179. <template v-if="index==0">
  180. <td style="color:#C21F3A">领先</td>
  181. </template>
  182. <template v-else>
  183. <td></td>
  184. </template>
  185. <td>{{ item.loginTime }}</td>
  186. </tr>
  187. </table>
  188. </div>
  189. </van-tab>
  190. </van-tabs>
  191. <div style="height: 3rem;"></div>
  192. <div class="bottomBtn" v-if="bottomBtn">
  193. <van-row v-if="!showBtn">
  194. <!-- <van-col span="8" style="margin-top: 4px;" @click="showPopup">-->
  195. <!-- <van-image src="../../static/images/icon/clock.png" style="vertical-align: text-bottom;" />-->
  196. <!-- <p style="line-height: 0.2rem;color: #999999">提醒</p>-->
  197. <!-- </van-col>-->
  198. <van-col span="24">
  199. <van-button round color="#C21F3A" block :disabled="isSignup" @click="goSignUp">
  200. {{ btnMsg }}<br/>
  201. <span style="font-size: 10px">保证金¥{{detail.deposit}}</span>
  202. </van-button>
  203. </van-col>
  204. </van-row>
  205. <van-field v-if="showBtn&&detail.biddingType!='阶梯竞价'" v-model="price" type="number" input-align="center" placeholder="请输入出价金额" />
  206. <van-row v-if="showBtn" type="flex" justify="space-around">
  207. <van-col span="4" v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'" style="text-align: center;line-height: 1rem">
  208. <van-button color="#e2e2e2" icon="minus" size="small" @click="sub"></van-button>
  209. </van-col>
  210. <van-col span="16">
  211. <div style="display: flex;">
  212. <van-button round color="#C21F3A" block @click="offer">
  213. <p>出价</p>
  214. <p v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'">{{price}}元</p>
  215. </van-button>
  216. <van-button v-if="isFirst == 'Y'" round color="#C21F3A" block @click="offerFirst" style="margin-left: 10px;">
  217. <p>优先跟价</p>
  218. </van-button>
  219. </div>
  220. </van-col>
  221. <van-col span="4" v-if="detail.ladderPrice&&detail.biddingType=='阶梯竞价'" style="text-align: center;line-height: 1rem">
  222. <van-button color="#e2e2e2" icon="plus" size="small" @click="add"></van-button>
  223. </van-col>
  224. </van-row>
  225. </div>
  226. <van-popup v-model="show" class="popup" closeable>
  227. <van-image src="../../static/images/icon/success.png"/>
  228. <p class="popupTit">提醒设置成功</p>
  229. <p class="popupContent">系统将按要求提醒您竞拍</p>
  230. <van-button round color="#C21F3A" block class="iKnow">
  231. 我知道了
  232. </van-button>
  233. <p class="updatePopup">修改提醒方式</p>
  234. </van-popup>
  235. </div>
  236. </template>
  237. <script>
  238. import {
  239. biddingSubmit,
  240. getBiddingList, getBiddingStopTime,
  241. getMember,
  242. getOutProjectDetail,
  243. getSignup,
  244. getWebConfig,
  245. projectNewBidMoney
  246. } from "../../api/project";
  247. import {getInfo} from "../../api/login";
  248. import $ from "jquery";
  249. export default {
  250. name: "projectDetail",
  251. provide(){
  252. return{
  253. reload:this.reload
  254. }
  255. },
  256. data() {
  257. return {
  258. current: 0,
  259. show: false,
  260. id:this.$route.query.id,
  261. detail: {},
  262. webConfig:"",
  263. biddinglistInformation:[],
  264. rollout_type:[],
  265. process:"",
  266. tip:"",
  267. btnMsg:"",
  268. time:null,
  269. timeMsg:"",
  270. isSignup:false,
  271. showBtn:false,
  272. price:null,
  273. userAccount:"",
  274. userName:"",
  275. userId:"",
  276. timeConfig:'',
  277. biddinglistInformationLength:0,
  278. biddingTimeType:2,
  279. isFirst:'',
  280. timer:null,
  281. getSignupData:'',
  282. bottomBtn:false,
  283. delayPeriodNow:false,
  284. nowDate:0,
  285. biddingquery:{
  286. projectId:this.$route.query.id,
  287. pageSize:10,
  288. pageNum:1
  289. }
  290. };
  291. },
  292. computed: {
  293. getNowFormatDate:function(){
  294. let date = new Date();
  295. let seperator1 = "-";
  296. let seperator2 = ":";
  297. let month = date.getMonth() + 1;
  298. let day = date.getDate();
  299. let hours = date.getHours();
  300. let minutes = date.getMinutes();
  301. let seconds = date.getSeconds();
  302. if (month >= 1 && month <= 9) {
  303. month = "0" + month;
  304. }
  305. if (day >= 0 && day <= 9) {
  306. day = "0" + day;
  307. }
  308. if (hours >= 0 && hours <= 9) {
  309. hours = "0" + hours;
  310. }
  311. if (minutes >= 0 && minutes <= 9) {
  312. minutes = "0" + minutes;
  313. }
  314. if (seconds >= 0 && seconds <= 9) {
  315. seconds = "0" + seconds;
  316. }
  317. let currentdate = date.getFullYear() + seperator1 + month + seperator1 + day + " " + hours + seperator2 + minutes + seperator2 + seconds;
  318. console.log(currentdate)
  319. return currentdate;
  320. }
  321. },
  322. created() {
  323. clearInterval(this.timer);
  324. this.reload();
  325. },
  326. methods: {
  327. goSignUp(){
  328. getInfo().then(response => {
  329. getMember(response.user.userId).then(resresponse => {
  330. let data= {
  331. projectId:this.id,
  332. memberId:resresponse.data.id,
  333. };
  334. var isSign;
  335. getSignup(data).then(r =>{
  336. if(r.data=="1"){
  337. isSign=true
  338. }
  339. })
  340. if (resresponse.data.auditStatus == 'Y'){
  341. if (isSign){
  342. this.$toast({
  343. icon: 'error', // 找到自己需要的图标
  344. message: '已报名,请耐心等待审核结果!',
  345. duration:"2000",
  346. onClose:function(){
  347. }
  348. })
  349. return;
  350. }
  351. this.$router.push(
  352. {
  353. path: 'signUp',
  354. query: {
  355. projectId: this.detail.id,
  356. deposit: this.detail.deposit,
  357. projectName: this.detail.projectName
  358. }
  359. }
  360. );
  361. }else{
  362. this.$toast({
  363. icon: 'error', // 找到自己需要的图标
  364. message: '交易中心审核注册信息后方可进行报名!',
  365. duration:"2000",
  366. onClose:function(){
  367. }
  368. })
  369. }
  370. })
  371. })
  372. },
  373. onChange(index) {
  374. this.current = index;
  375. },
  376. showPopup() {
  377. this.show = true;
  378. },
  379. reload(){
  380. console.log("结束进入")
  381. getOutProjectDetail(this.id).then(response =>{
  382. this.detail=response.data
  383. this.getDicts("rollout_type").then(res =>{
  384. this.detail.rollout = this.selectDictLabel(res.data,response.data.rollout);
  385. if(this.detail.oneout==0){
  386. this.detail.oneout = "无"
  387. }else{
  388. this.detail.oneout = this.selectDictLabel(res.data,response.data.oneout);
  389. }
  390. })
  391. this.getDicts("project_type").then(res => {
  392. this.detail.projectNumber = this.selectDictLabel(res.data,response.data.projectNumber);
  393. });
  394. this.getDicts("sub_object_type").then(res => {
  395. // this.detail.projectType = this.selectDictLabel(res.data,response.data.projectType);
  396. });
  397. this.getDicts("economic_type").then(res => {
  398. this.detail.economicType = this.selectDictLabel(res.data,response.data.economicType);
  399. });
  400. this.getDicts("area_unit").then(res => {
  401. this.detail.allCountUnit = this.selectDictLabel(res.data,response.data.allCountUnit);
  402. });
  403. this.getDicts("bidding_type").then(res => {
  404. // debugger;
  405. this.detail.biddingType = this.selectDictLabel(res.data,response.data.biddingType);
  406. });
  407. this.getDicts("bidding_direct").then(res => {
  408. this.detail.biddingDirect = this.selectDictLabel(res.data,response.data.biddingDirect);
  409. });
  410. this.getDicts("price_unit").then(res => {
  411. this.detail.unit = this.selectDictLabel(res.data,response.data.unit);
  412. });
  413. this.getDicts("payment_type").then(res => {
  414. this.detail.paymentType = this.selectDictLabel(res.data,response.data.paymentType);
  415. });
  416. for(let i of this.detail.subjectList){
  417. this.getDicts("area_unit").then(res => {
  418. i.areaUnit = this.selectDictLabel(res.data,i.areaUnit);
  419. });
  420. }
  421. var that = this;
  422. this.timer = setInterval(function () {
  423. if(that.process == "竞价中"){
  424. getBiddingList(that.biddingquery).then(response =>{
  425. that.biddinglistInformation = response.rows
  426. if((response.rows.length != that.biddinglistInformationLength) && that.detail.ladderPrice){
  427. if (that.detail.biddingDirect == 2 ||that.detail.biddingDirect == '反向竞价') {
  428. that.price = parseInt(response.rows[0].money) - parseInt(that.detail.ladderPrice)
  429. }else{
  430. that.price = parseInt(response.rows[0].money) + parseInt(that.detail.ladderPrice)
  431. }
  432. }
  433. that.biddinglistInformationLength = response.total
  434. });
  435. }
  436. },3000)
  437. getInfo().then(response => {
  438. this.userId=response.user.userId
  439. getMember(response.user.userId).then(res => {
  440. this.userAccount=res.data.phone
  441. this.userName=res.data.realname
  442. this.memberId=res.data.id
  443. let data= {
  444. projectId:this.id,
  445. memberId:res.data.id,
  446. depositStatus:'1'
  447. };
  448. getSignup(data).then(r =>{
  449. this.getSignupData = r.data;
  450. this.isFirst = r.signup.isFirst;
  451. this.getBidding();
  452. this.getTime();
  453. this.bottomBtn = true;
  454. })
  455. })
  456. })
  457. });
  458. getWebConfig().then(response =>{
  459. this.timeConfig = response.data[8].configValue;
  460. response.data.map(item =>{
  461. if(item.configKey=="cqjy.website.bidInfo"){
  462. this.webConfig = item.configValue
  463. }
  464. })
  465. });
  466. },
  467. getTime(){
  468. this.bottomBtn = true;
  469. let biddingStartTime = Date.parse(this.detail.biddingStartTime)+0
  470. let biddingStopTime = Date.parse(this.detail.biddingStopTime)+0
  471. let signupStartTime = Date.parse(this.detail.signupStartTime)+0
  472. let signupStopTime = Date.parse(this.detail.signupStopTime)+0
  473. let nowDate = Date.parse(this.format($.ajax({async:false}).getResponseHeader("Date"), "yyyy-MM-dd HH:mm:ss"));
  474. if(signupStartTime>nowDate){
  475. console.log('未开始')
  476. this.process= "报名未开始"
  477. this.tip=this.detail.signupStartTime+"开始报名"
  478. this.btnMsg="立即报名"
  479. this.timeMsg="距报名开始"
  480. this.time = signupStartTime-nowDate
  481. this.isSignup=true
  482. }
  483. if(signupStopTime>nowDate&&signupStopTime>signupStartTime){
  484. console.log('报名中')
  485. this.process= "报名中"
  486. this.tip=this.detail.signupStopTime+"报名截止"
  487. this.btnMsg="立即报名"
  488. this.timeMsg="距报名截止"
  489. this.time = signupStopTime-nowDate
  490. if(this.getSignupData=="1"){
  491. this.isSignup=true
  492. this.btnMsg="已报名"
  493. }
  494. }
  495. if(biddingStartTime>nowDate&&nowDate>signupStopTime){
  496. console.log('竞价未开始')
  497. this.biddingTimeType = 3;
  498. this.process= "竞价未开始"
  499. this.tip=this.detail.biddingStartTime+"开始竞价"
  500. this.timeMsg="距竞价开始"
  501. this.time = biddingStartTime-nowDate
  502. if(this.getSignupData=="1"){
  503. this.isSignup=true;
  504. this.btnMsg="立即竞价"
  505. // this.price=this.detail.ladderPrice?this.biddinglistInformation[0].money+this.detail.ladderPrice:this.biddinglistInformation[0].money+1
  506. }else{
  507. this.btnMsg="未报名"
  508. }
  509. }
  510. if(biddingStopTime>nowDate&&nowDate>biddingStartTime){
  511. console.log('竞价中')
  512. // console.log(biddingStopTime)
  513. // console.log(nowDate)
  514. // console.log(biddingStartTime)
  515. this.biddingTimeType = 1;
  516. this.process= "竞价中"
  517. this.tip=this.detail.biddingStopTime+"结束竞价"
  518. this.timeMsg="距竞价结束"
  519. this.time = biddingStopTime-nowDate
  520. if(this.getSignupData=="1"){
  521. this.isSignup=true
  522. this.btnMsg="立即竞价"
  523. this.showBtn=true
  524. // this.price=this.detail.ladderPrice?this.biddinglistInformation[0].money+this.detail.ladderPrice:this.biddinglistInformation[0].money+1
  525. }else{
  526. this.btnMsg="未报名"
  527. this.isSignup=true
  528. }
  529. }
  530. if(nowDate>biddingStopTime){
  531. console.log('竞价结束')
  532. this.process= "竞价结束"
  533. this.tip=this.detail.biddingStopTime+"结束竞价"
  534. this.btnMsg="竞价结束"
  535. this.timeMsg="竞价结束"
  536. this.time = 0
  537. this.isSignup = true
  538. this.showBtn=false
  539. this.biddingTimeType = 2;
  540. }
  541. },
  542. getBidding(){
  543. var that = this;
  544. getBiddingList(that.biddingquery).then(response =>{
  545. that.biddinglistInformation = response.rows
  546. that.biddinglistInformationLength = response.total
  547. if (that.detail.biddingType == '阶梯竞价'){
  548. if (response.rows.length>0&&that.detail.ladderPrice){
  549. if (that.price == 0){return;}
  550. if (that.detail.biddingDirect == 2 ||that.detail.biddingDirect == '反向竞价') {
  551. that.price = parseFloat(response.rows[0].money - that.detail.ladderPrice).toFixed(2)
  552. }else{
  553. that.price = parseFloat(response.rows[0].money + that.detail.ladderPrice).toFixed(2)
  554. }
  555. }else if (response.rows.length>0&&!that.detail.ladderPrice){
  556. if (that.price == 0){return;}
  557. that.price = response.rows[0].money
  558. }
  559. else{
  560. if (that.detail.biddingDirect == 2 ||that.detail.biddingDirect == '反向竞价') {
  561. that.price = parseFloat(that.detail.price).toFixed(2)
  562. }else{
  563. that.price = parseFloat(that.detail.price).toFixed(2)
  564. }
  565. }
  566. }
  567. });
  568. },
  569. offerFirst(){
  570. let newMoney;
  571. projectNewBidMoney(this.id).then(response =>{
  572. if (response.data&&response.code==200){
  573. newMoney = response.data;
  574. }else{
  575. newMoney = this.detail.price;
  576. }
  577. let data= {
  578. projectId:this.id,
  579. memberId:this.memberId,
  580. userId:this.userId,
  581. userAccount:this.userAccount,
  582. userName:this.userName,
  583. money:parseFloat(newMoney),
  584. };
  585. biddingSubmit(data).then(response =>{
  586. let _this = this
  587. if(response){
  588. this.$toast({
  589. icon: 'success', // 找到自己需要的图标
  590. message: '出价成功',
  591. duration:"1000",
  592. onClose:function(){
  593. clearInterval(this.timer);
  594. // _this.reload()
  595. _this.getBidding();
  596. if (_this.detail.delayPeriod != 0 && _this.delayPeriodNow){
  597. _this.time = null;
  598. }
  599. if (_this.detail.biddingType=='自由竞价'||_this.detail.biddingType=='公开竞价'){
  600. _this.price = null;
  601. }else{
  602. _this.price = _this.price-_this.detail.ladderPrice;
  603. }
  604. }
  605. })
  606. }
  607. })
  608. });
  609. },
  610. offer(){
  611. let newMoney;
  612. projectNewBidMoney(this.id).then(response =>{
  613. if (response.data&&response.code==200){
  614. newMoney = response.data;
  615. }else{
  616. newMoney = this.detail.price;
  617. }
  618. if (this.price==''||this.price==0||this.price<0||this.price == null){
  619. this.$toast({
  620. icon: 'fail', // 找到自己需要的图标
  621. message: '请输入出价金额',
  622. duration:"1000",
  623. onClose:function(){
  624. }
  625. })
  626. return;
  627. }
  628. if (this.detail.biddingDirect == '反向竞价'){
  629. // if (this.biddinglistInformation.length<1){
  630. if(this.detail.price<this.price){
  631. this.$toast({
  632. icon: 'fail', // 找到自己需要的图标
  633. message: '出价不能高于挂牌价格',
  634. duration:"1000",
  635. onClose:function(){
  636. }
  637. })
  638. return;
  639. }else{
  640. if (this.detail.biddingType=='阶梯竞价'||this.detail.biddingType=='公开竞价'){
  641. if (this.biddinglistInformation.length>1){
  642. //判断用户出价不能高于当前出价最低价格
  643. if(newMoney <= this.price){
  644. this.$toast({
  645. icon: 'fail', // 找到自己需要的图标
  646. message: '出价不能高于当前出价最低价格',
  647. duration:"1000",
  648. onClose:function(){
  649. }
  650. })
  651. return;
  652. }
  653. }
  654. }
  655. }
  656. }else{
  657. if(this.detail.price>this.price){
  658. this.$toast({
  659. icon: 'fail', // 找到自己需要的图标
  660. message: '出价不能低于挂牌价格',
  661. duration:"1000",
  662. onClose:function(){
  663. }
  664. })
  665. return;
  666. }else{
  667. if (this.detail.biddingType=='阶梯竞价'||this.detail.biddingType=='公开竞价'){
  668. if (this.biddinglistInformation.length>1){
  669. //判断用户出价不能高于当前出价最低价格
  670. console.log(newMoney)
  671. console.log(this.price)
  672. if(newMoney >= this.price){
  673. this.$toast({
  674. icon: 'fail', // 找到自己需要的图标
  675. message: '出价不能低于当前出价最高价格',
  676. duration:"1000",
  677. onClose:function(){
  678. }
  679. })
  680. return;
  681. }
  682. }
  683. }
  684. }
  685. }
  686. let data= {
  687. projectId:this.id,
  688. memberId:this.memberId,
  689. userId:this.userId,
  690. userAccount:this.userAccount,
  691. userName:this.userName,
  692. money:parseFloat(this.price),
  693. };
  694. console.log(data)
  695. biddingSubmit(data).then(response =>{
  696. let _this = this
  697. if(response){
  698. // clearInterval(this.timer);
  699. this.$toast({
  700. icon: 'success', // 找到自己需要的图标
  701. message: '出价成功',
  702. duration:"1000",
  703. onClose:function(){
  704. clearInterval(this.timer);
  705. // _this.reload()
  706. _this.getBidding();
  707. if (_this.detail.delayPeriod != 0 && _this.delayPeriodNow){
  708. _this.time = null;
  709. }
  710. if (_this.detail.biddingType=='自由竞价'||_this.detail.biddingType=='公开竞价'){
  711. _this.price = null;
  712. }else{
  713. _this.price = _this.price-_this.detail.ladderPrice;
  714. }
  715. }
  716. })
  717. }
  718. })
  719. });
  720. },
  721. add(){
  722. if (this.detail.biddingDirect == '反向竞价'){
  723. if (this.biddinglistInformation.length<1){
  724. if(this.detail.price <= this.price){
  725. this.$toast({
  726. icon: 'fail', // 找到自己需要的图标
  727. message: '出价不能高于挂牌价格',
  728. duration:"1000",
  729. onClose:function(){
  730. }
  731. })
  732. return;
  733. }
  734. }else{
  735. if(this.biddinglistInformation[0].money <= (parseFloat(this.price)+parseFloat(this.detail.ladderPrice)).toFixed(2)){
  736. this.$toast({
  737. icon: 'fail', // 找到自己需要的图标
  738. message: '出价不能高于当前出价最低价格',
  739. duration:"1000",
  740. onClose:function(){
  741. }
  742. })
  743. return;
  744. }
  745. }
  746. }else{
  747. if (this.biddinglistInformation.length<1){
  748. if(this.detail.price>this.price){
  749. this.$toast({
  750. icon: 'fail', // 找到自己需要的图标
  751. message: '出价不能低于挂牌价格',
  752. duration:"1000",
  753. onClose:function(){
  754. }
  755. })
  756. return;
  757. }
  758. }else{
  759. if(this.biddinglistInformation[0].money>this.price){
  760. this.$toast({
  761. icon: 'fail', // 找到自己需要的图标
  762. message: '出价不能低于当前出价最高价格',
  763. duration:"1000",
  764. onClose:function(){
  765. }
  766. })
  767. return;
  768. }
  769. }
  770. }
  771. console.log(this.price == null)
  772. this.price == null?this.price = 0:this.price = this.price;
  773. this.detail.ladderPrice?this.price=(parseFloat(this.price)+parseFloat(this.detail.ladderPrice)).toFixed(2):this.price += 1
  774. },
  775. sub(){
  776. if (this.detail.biddingDirect == '反向竞价'){
  777. if (this.biddinglistInformation.length<1){
  778. if(this.detail.price<this.price){
  779. this.$toast({
  780. icon: 'fail', // 找到自己需要的图标
  781. message: '出价不能高于挂牌价格',
  782. duration:"1000",
  783. onClose:function(){
  784. }
  785. })
  786. return;
  787. }
  788. }else{
  789. if(this.biddinglistInformation[0].money<this.price){
  790. this.$toast({
  791. icon: 'fail', // 找到自己需要的图标
  792. message: '出价不能高于当前出价最低价格',
  793. duration:"1000",
  794. onClose:function(){
  795. }
  796. })
  797. return;
  798. }
  799. }
  800. }else{
  801. if (this.biddinglistInformation.length<1){
  802. if(this.detail.price>=this.price){
  803. this.$toast({
  804. icon: 'fail', // 找到自己需要的图标
  805. message: '出价不能低于挂牌价格',
  806. duration:"1000",
  807. onClose:function(){
  808. }
  809. })
  810. return;
  811. }
  812. }else{
  813. if(this.biddinglistInformation[0].money >= (parseFloat(this.price)-parseFloat(this.detail.ladderPrice)).toFixed(2)){
  814. this.$toast({
  815. icon: 'fail', // 找到自己需要的图标
  816. message: '出价不能低于当前出价最高价格',
  817. duration:"1000",
  818. onClose:function(){
  819. }
  820. })
  821. return;
  822. }
  823. }
  824. }
  825. this.price == null?this.price = 0:this.price = this.price;
  826. if (this.price == 0)return;
  827. this.detail.ladderPrice?this.price=(parseFloat(this.price)-parseFloat(this.detail.ladderPrice)).toFixed(2):this.price -= 1
  828. // if(this.detail.ladderPrice){
  829. // if((this.price-this.detail.ladderPrice)>this.biddinglistInformation[0].money){
  830. // this.price-=this.detail.ladderPrice
  831. // }else{
  832. // this.$toast({
  833. // icon: 'error', // 找到自己需要的图标
  834. // message: '出价不能低于当前最高价',
  835. // duration:"1000",
  836. // })
  837. // }
  838. // }else{
  839. // if((this.price-1)>this.biddinglistInformation[0].money){
  840. // this.price-=1
  841. // }else{
  842. // this.$toast({
  843. // icon: 'error', // 找到自己需要的图标
  844. // message: '出价不能低于当前最高价',
  845. // duration:"1000",
  846. // })
  847. // }
  848. // }
  849. },
  850. timerChange(value){
  851. let d = value.days;
  852. let h = value.hours;
  853. let m = value.minutes;
  854. let s = value.seconds;
  855. let biddingStopTime = Date.parse(this.detail.biddingStopTime)+0
  856. let nowDate = Date.parse(this.format($.ajax({async:false}).getResponseHeader("Date"), "yyyy-MM-dd HH:mm:ss"));
  857. let time = this.detail.delayPeriod * 1000;
  858. if (s < 1 && m < 1){
  859. console.log("竞价结束22222222222")
  860. getBiddingStopTime(this.id).then(response => {
  861. this.$set(this.detail,'biddingStopTime',response.data)
  862. let timeNew = Date.parse(response.data) + 0 - nowDate;
  863. if (timeNew > 0) {
  864. this.$set(this.detail,'biddingStopTime',response.data)
  865. this.getTime();
  866. } else {
  867. this.process = "竞价结束"
  868. this.tip = this.detail.biddingStopTime + "结束竞价"
  869. this.btnMsg = "竞价结束"
  870. this.timeMsg = "竞价结束"
  871. this.time = 0
  872. this.isSignup = true
  873. this.showBtn = false
  874. this.biddingTimeType = 2;
  875. return;
  876. }
  877. });
  878. }else if (s%2 == 0&&time!=0){
  879. console.log('aaa')
  880. // console.log((biddingStopTime-nowDate))
  881. // console.log(time)
  882. // this.getTime();
  883. if ((biddingStopTime-nowDate)<=time){
  884. // console.log("竞价剩余两分钟"+"m:"+m+"s:"+s)
  885. getBiddingStopTime(this.id).then(response =>{
  886. if(this.detail.biddingStopTime!=response.data){
  887. console.log('有人出价')
  888. this.time = null;
  889. }
  890. this.detail.biddingStopTime = response.data
  891. this.$set(this.detail,'biddingStopTime',response.data);
  892. this.delayPeriodNow = true;
  893. // this.time = Date.parse(response.data)+0-nowDate;
  894. });
  895. }
  896. }
  897. },
  898. finishTimer(){
  899. console.log('结束进入11111111111')
  900. getBiddingStopTime(this.id).then(response =>{
  901. this.$set(this.detail,'biddingStopTime',response.data)
  902. // this.time = Date.parse(response.data)+0-nowDate;
  903. console.log(this.time)
  904. if (this.time <= 1000){
  905. console.log("竞价结束22222222222")
  906. this.bottomBtn= false
  907. this.reload();
  908. return;
  909. }
  910. });
  911. }
  912. },
  913. destroyed () {
  914. console.log('bbbbbbbbbb')
  915. clearInterval(this.timer);
  916. },
  917. beforeDestory() {
  918. clearInterval(this.timer)
  919. },
  920. //离开页面清除定时器失效问题
  921. beforeRouteLeave(to, from, next) {
  922. console.log("我离开了")
  923. clearInterval(this.timer)
  924. this.time = null;
  925. next()
  926. }
  927. };
  928. </script>
  929. <style scoped lang="scss">
  930. .app-container {
  931. }
  932. .van-count-down{
  933. display: inline-block;
  934. color: #fff;
  935. }
  936. .custom-indicator {
  937. position: absolute;
  938. right: 20px;
  939. bottom: 20px;
  940. padding: 0px 20px;
  941. font-size: 12px;
  942. /*rgba(0, 0, 0, 0.1)*/
  943. background: rgba(0, 0, 0, 0.2);
  944. color: #FFF;
  945. border-radius: 20px;
  946. line-height: 0.5rem;
  947. }
  948. .title{
  949. font-size: 0.45rem;
  950. margin-bottom: 10PX;
  951. }
  952. .my-swipe{
  953. width: 100%;
  954. }
  955. .my-swipe .van-swipe-item .van-image{
  956. width: 100%;
  957. }
  958. .information{
  959. background-color: #FFF;
  960. margin-top: 0.3rem;
  961. padding: 0.4rem 0.5rem;
  962. }
  963. .van-row{
  964. line-height: 0.7rem;
  965. }
  966. .price{
  967. color: #C21F3A;
  968. }
  969. .price span{
  970. font-size: 0.5rem;
  971. font-weight: bold;
  972. }
  973. .money{
  974. color: #C21F3A;
  975. }
  976. .money span{
  977. font-size: 0.5rem;
  978. font-weight: bold;
  979. }
  980. .van-count-down{
  981. line-height: 0.7rem;
  982. }
  983. .lead{
  984. background-color: #FFF;
  985. margin-top: 0.3rem;
  986. padding: 0.1rem 0.5rem;
  987. color: #C21F3A;
  988. }
  989. .detail{
  990. background-color: #FFF;
  991. margin-top: 0.3rem;
  992. padding: 0.2rem 0.5rem;
  993. }
  994. .detail span{
  995. color: #8A8A8A;
  996. }
  997. .delTitle{
  998. font-size: 0.4rem;
  999. color: #007E72;
  1000. padding: 0.2rem 0.5rem;
  1001. }
  1002. .introduce{
  1003. padding: 0.2rem 0.5rem 0.5rem;
  1004. background-color: #FFF;
  1005. }
  1006. .introduce span{
  1007. color: #8A8A8A;
  1008. margin-right: 20px;
  1009. }
  1010. .project_info{
  1011. border: 1px solid #DCDCDC;
  1012. padding: 0px 20px;
  1013. margin-top: 10px;
  1014. border-radius: 10px;
  1015. }
  1016. .notice{
  1017. padding: 0.5rem;
  1018. background-color: #FFF;
  1019. }
  1020. .notice p{
  1021. line-height: 0.7rem;
  1022. }
  1023. .biddingList{
  1024. padding: 0.5rem;
  1025. background-color: #FFF;
  1026. margin-bottom: 0.4rem;
  1027. }
  1028. .biddingList table{
  1029. text-align: center;
  1030. }
  1031. .biddingList table td{
  1032. text-align: center;
  1033. padding: 10px 0px;
  1034. }
  1035. .biddingList table tr:first-child td{
  1036. background-color: #007E72;
  1037. color: #FFF;
  1038. }
  1039. .bottomBtn{
  1040. padding: 0.2rem 0.5rem;
  1041. background-color: #FFF;
  1042. position: fixed;
  1043. bottom: 0;
  1044. width: 100%;
  1045. }
  1046. .popup{
  1047. text-align: center;
  1048. padding: 0.5rem;
  1049. border-radius: 20px;
  1050. width: 70%;
  1051. padding-top: 1.5rem;
  1052. }
  1053. .popupTit{
  1054. color: #007E72;
  1055. font-size: 0.4rem;
  1056. line-height: 0.9rem;
  1057. }
  1058. .popupContent{
  1059. color: #666666;
  1060. }
  1061. .iKnow{
  1062. margin-top: 1rem;
  1063. }
  1064. .updatePopup{
  1065. color: #007E72;
  1066. margin-top: 0.5rem;
  1067. }
  1068. </style>