|
|
@ -17,7 +17,10 @@ |
|
|
|
<view class="st-tip">{{curTypeInfo.rule_text || '-'}}</view> |
|
|
|
</view> |
|
|
|
<picker mode="date" @change="timeSlotChange"> |
|
|
|
<view class="sh-time" v-if="dateList.length>1">{{dateList[0].ZhDateStr || '-'}}—{{dateList[dateList.length-1].ZhDateStr || '-'}}</view> |
|
|
|
<view class="sh-time" v-if="dateList.length>1"> |
|
|
|
<text>{{dateList[0].ZhDateStr || '-'}} — {{dateList[dateList.length-1].ZhDateStr || '-'}}</text> |
|
|
|
<image mode="aspectFit" src="/static/images/icon/arrow_b2.png"></image> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
</view> |
|
|
|
<scroll-view class="sm-times" scroll-x> |
|
|
@ -38,7 +41,7 @@ |
|
|
|
<view class="sti-item"></view> |
|
|
|
<view class="sti-item" v-for="(e,i) in venueList[0].items" :key="i">{{e.duration || '-'}}</view> |
|
|
|
</view> |
|
|
|
<scroll-view class="sti-venue-list" enable-flex scroll-x> |
|
|
|
<scroll-view class="sti-venue-list" enable-flex scroll-x :style="venueAreaSize"> |
|
|
|
<view class="svl-list" v-for="(e, i) in venueList" :key="i"> |
|
|
|
<view class="sl-item">{{e.name || '-'}}</view> |
|
|
|
<view class="sl-item" v-for="(k,j) in e.items" :key="j" @click="venueSelect(i,j)"> |
|
|
@ -87,6 +90,9 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="sm-fixed-tip" v-if="occupyTip!==''"> |
|
|
|
<text>{{occupyTip || '-'}}</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
@ -94,6 +100,7 @@ |
|
|
|
import { API } from '../../../js/api'; |
|
|
|
import { servers } from '../../../js/server'; |
|
|
|
import util from '../../../utils/util' |
|
|
|
let tipTimer = null; |
|
|
|
export default { |
|
|
|
data(){ |
|
|
|
return { |
|
|
@ -106,11 +113,18 @@ export default { |
|
|
|
curDateInfo: {}, // 当前日期 |
|
|
|
selectedVenueList: [], // 所选场地列表 |
|
|
|
totalPrice: 0, |
|
|
|
occupyTip: '', // 占用提示 |
|
|
|
venueAreaSize: '', // 场地滚动区域大小 |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
|
|
|
|
}, |
|
|
|
onUnload(){ |
|
|
|
this.occupyTip = ''; |
|
|
|
clearTimeout(tipTimer); |
|
|
|
tipTimer = null; |
|
|
|
}, |
|
|
|
async onLoad(){ |
|
|
|
try { |
|
|
|
util.showLoad(); |
|
|
@ -129,14 +143,16 @@ export default { |
|
|
|
let _dateArr = this.getDateList({}) || []; |
|
|
|
this.dateList = _dateArr; |
|
|
|
this.curDateInfo = _dateArr[0] || {}; |
|
|
|
let _venueList = await this.getVenueList({ |
|
|
|
type_key: _curType.key, |
|
|
|
stadium_id: _curStore.id, |
|
|
|
date: _dateArr[0].dateStr, |
|
|
|
}) |
|
|
|
if(!_venueList.length)return util.showNone('没有场地信息!') |
|
|
|
this.venueList = _venueList || []; |
|
|
|
return util.hideLoad(); |
|
|
|
util.hideLoad(); |
|
|
|
return this.$nextTick(_=>this.refreshVenues()); |
|
|
|
// let _venueList = await this.getVenueList({ |
|
|
|
// type_key: _curType.key, |
|
|
|
// stadium_id: _curStore.id, |
|
|
|
// date: _dateArr[0].dateStr, |
|
|
|
// }) |
|
|
|
// if(!_venueList.length)return util.showNone('没有场地信息!') |
|
|
|
// this.venueList = _venueList || []; |
|
|
|
|
|
|
|
}catch(err){ |
|
|
|
util.hideLoad(); |
|
|
|
console.warn('加载失败----->', err) |
|
|
@ -168,7 +184,11 @@ export default { |
|
|
|
}) |
|
|
|
if(!_venueList.length)return util.showNone('没有场地信息!'); |
|
|
|
this.venueList = _venueList || []; |
|
|
|
this.$nextTick(_=>this.getSelectedVenues()); |
|
|
|
this.$nextTick(_=>{ |
|
|
|
this.getSelectedVenues(); |
|
|
|
this.setVenueAreaSize(); |
|
|
|
}); |
|
|
|
|
|
|
|
util.hideLoad(); |
|
|
|
}catch(err){ |
|
|
|
util.hideLoad(); |
|
|
@ -180,14 +200,21 @@ export default { |
|
|
|
this.refreshVenues(); |
|
|
|
// this.$nextTick(_=>this.getSelectedVenues()); |
|
|
|
}, |
|
|
|
// 占用提示 |
|
|
|
showOccupyTip(str, duration = 1200){ |
|
|
|
this.occupyTip = str; |
|
|
|
clearTimeout(tipTimer); |
|
|
|
tipTimer = null; |
|
|
|
tipTimer = setTimeout(_=>this.occupyTip = '', duration); |
|
|
|
}, |
|
|
|
// 场地选择 |
|
|
|
venueSelect(i,j){ |
|
|
|
let { venueList } = this; |
|
|
|
let _venueList = venueList.slice(); |
|
|
|
let _curTarget = { ..._venueList[i].items[j] }; |
|
|
|
if(_curTarget.is_take_up){ |
|
|
|
let _str = `操作人:${_curTarget.operator || '-'},收取金额: ${_curTarget.price || 0}\n原因: ${_curTarget.take_up_reason || '-'}`; |
|
|
|
util.showNone(_str) |
|
|
|
let _str = `操作人:${_curTarget.operator || '-'}\n收取金额: ${_curTarget.price || 0}\n原因: ${_curTarget.take_up_reason || '-'}`; |
|
|
|
this.showOccupyTip(_str) |
|
|
|
return |
|
|
|
} |
|
|
|
if(!_curTarget.is_valid)return; |
|
|
@ -277,7 +304,7 @@ export default { |
|
|
|
venueList: selectedVenueList, |
|
|
|
}) |
|
|
|
|
|
|
|
util.routeTo(`/pages/site/confirm/confirm`, 'nT'); |
|
|
|
util.routeTo(`/pages/site/confirm/confirm`, 'rT'); |
|
|
|
}, |
|
|
|
// 场馆列表 |
|
|
|
getVenueList({type_key,stadium_id,date}){ |
|
|
@ -302,7 +329,15 @@ export default { |
|
|
|
data: {}, |
|
|
|
failMsg: '加载店铺失败!' |
|
|
|
}) |
|
|
|
} |
|
|
|
}, |
|
|
|
// 设置滚动区域大小 |
|
|
|
setVenueAreaSize(){ |
|
|
|
const sysInfo = uni.getSystemInfoSync(); |
|
|
|
util.getNodeMes('.sv-time-interval') |
|
|
|
.then(res=>{ |
|
|
|
this.venueAreaSize = `width:${sysInfo.screenWidth - res.width}px;height:${res.height}px;` |
|
|
|
}) |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
@ -369,6 +404,13 @@ export default { |
|
|
|
color: #9A9A9D; |
|
|
|
border-top: 2upx solid #D8D8D8; |
|
|
|
border-bottom: 2upx solid #D8D8D8; |
|
|
|
>image{ |
|
|
|
margin-left: 20upx; |
|
|
|
width: 24upx; |
|
|
|
height: 24upx; |
|
|
|
vertical-align: middle; |
|
|
|
transform: rotateZ(90deg); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.sm-times{ |
|
|
@ -418,10 +460,9 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
.sm-venue{ |
|
|
|
display: flex; |
|
|
|
.sv-time-interval{ |
|
|
|
flex-shrink: 0; |
|
|
|
flex-grow: 0; |
|
|
|
vertical-align: top; |
|
|
|
display: inline-block; |
|
|
|
.sti-item{ |
|
|
|
position: relative; |
|
|
|
width: 112upx; |
|
|
@ -454,8 +495,8 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
.sti-venue-list{ |
|
|
|
width: 630upx; |
|
|
|
flex-grow: 1; |
|
|
|
vertical-align: top; |
|
|
|
display: inline-block; |
|
|
|
background-color: #f2f2f7; |
|
|
|
text-align: left; |
|
|
|
white-space: nowrap; |
|
|
@ -647,5 +688,19 @@ export default { |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
.sm-fixed-tip{ |
|
|
|
position: fixed; |
|
|
|
left: 50%; |
|
|
|
top: 50%; |
|
|
|
transform: translate(-50%, -50%); |
|
|
|
max-width: 600upx; |
|
|
|
padding: 20upx 30upx; |
|
|
|
border-radius: 10upx; |
|
|
|
background-color: rgba($color: #000000, $alpha: .5); |
|
|
|
word-break: break-all; |
|
|
|
font-size: 28upx; |
|
|
|
line-height: 44upx; |
|
|
|
color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |