|
|
@ -1,81 +1,100 @@ |
|
|
|
<template> |
|
|
|
<view class="site-manage"> |
|
|
|
<view class="sm-header"> |
|
|
|
<picker mode="selector" :range="storeList" range-key="name" @change="storePickerChange"> |
|
|
|
<view class="sh-address"> |
|
|
|
<text>{{curStoreInfo.name || '-'}}</text> |
|
|
|
<image mode="aspectFit" src="/static/images/icon/arrow_c33.png"></image> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
<view class="sh-type"> |
|
|
|
<picker mode="selector" :range="typeList" range-key="name" @change="typePckerChange"> |
|
|
|
<view class="st-type"> |
|
|
|
<text>{{curTypeInfo.name || '-'}}</text> |
|
|
|
<view class="sm-sticky-box"> |
|
|
|
<view class="sm-header"> |
|
|
|
<picker mode="selector" :range="storeList" range-key="name" @change="storePickerChange"> |
|
|
|
<view class="sh-address"> |
|
|
|
<text>{{curStoreInfo.name || '-'}}</text> |
|
|
|
<image mode="aspectFit" src="/static/images/icon/arrow_c33.png"></image> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
<view class="st-tip">{{curTypeInfo.rule_text || '-'}}</view> |
|
|
|
</view> |
|
|
|
<view class="sh-date" v-if="dateList.length"> |
|
|
|
<picker |
|
|
|
mode="date" |
|
|
|
:value="dateList[0].dateStr" |
|
|
|
data-type='start' |
|
|
|
@change="datePickerChange"> |
|
|
|
<view class="sd-box"> |
|
|
|
<text>{{ dateList[0].ZhDateStr || '-' }}</text> |
|
|
|
<view></view> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
<text>至</text> |
|
|
|
<picker |
|
|
|
mode="date" |
|
|
|
:value="dateList[dateList.length - 1].dateStr" |
|
|
|
data-type="end" |
|
|
|
@change="datePickerChange"> |
|
|
|
<view class="sd-box"> |
|
|
|
<text>{{ dateList[dateList.length - 1].ZhDateStr || '-' }}</text> |
|
|
|
<view></view> |
|
|
|
<view class="sh-type"> |
|
|
|
<picker mode="selector" :range="typeList" range-key="name" @change="typePckerChange"> |
|
|
|
<view class="st-type"> |
|
|
|
<text>{{curTypeInfo.name || '-'}}</text> |
|
|
|
<image mode="aspectFit" src="/static/images/icon/arrow_c33.png"></image> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
<view class="st-tip">{{curTypeInfo.rule_text || '-'}}</view> |
|
|
|
</view> |
|
|
|
<view class="sh-date" v-if="dateList.length"> |
|
|
|
<picker |
|
|
|
mode="date" |
|
|
|
:value="dateList[0].dateStr" |
|
|
|
data-type='start' |
|
|
|
@change="datePickerChange"> |
|
|
|
<view class="sd-box"> |
|
|
|
<text>{{ dateList[0].ZhDateStr || '-' }}</text> |
|
|
|
<view></view> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
<text>至</text> |
|
|
|
<picker |
|
|
|
mode="date" |
|
|
|
:value="dateList[dateList.length - 1].dateStr" |
|
|
|
data-type="end" |
|
|
|
@change="datePickerChange"> |
|
|
|
<view class="sd-box"> |
|
|
|
<text>{{ dateList[dateList.length - 1].ZhDateStr || '-' }}</text> |
|
|
|
<view></view> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
</view> |
|
|
|
<picker mode="date" @change="timeSlotChange" v-if="false"> |
|
|
|
<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> |
|
|
|
<picker mode="date" @change="timeSlotChange" v-if="false"> |
|
|
|
<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> |
|
|
|
<scroll-view class="sm-times" scroll-x> |
|
|
|
<view |
|
|
|
v-for="(e,i) in dateList" |
|
|
|
:key="i" |
|
|
|
:class="['st-item', curDateInfo.dateStr===e.dateStr?'active':'']" |
|
|
|
@click="dateChange(e)" |
|
|
|
> |
|
|
|
<view class="si-txt"> |
|
|
|
<view>{{e.dayStr || '-'}}</view> |
|
|
|
<view>{{e.showDateStr || '-'}}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
</scroll-view> |
|
|
|
</view> |
|
|
|
<scroll-view class="sm-times" scroll-x> |
|
|
|
<view |
|
|
|
v-for="(e,i) in dateList" |
|
|
|
:key="i" |
|
|
|
:class="['st-item', curDateInfo.dateStr===e.dateStr?'active':'']" |
|
|
|
@click="dateChange(e)" |
|
|
|
> |
|
|
|
<view class="si-txt"> |
|
|
|
<view>{{e.dayStr || '-'}}</view> |
|
|
|
<view>{{e.showDateStr || '-'}}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
|
|
|
|
<view class="sm-venue"> |
|
|
|
<view class="sv-time-interval"> |
|
|
|
<!-- <view class="sv-time-interval"> |
|
|
|
<view class="sti-item" v-for="(e,i) in venueTimeList" :key="i"> |
|
|
|
<view>{{ e || '-' }}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<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.venue_name || '-'}}</view> |
|
|
|
<view class="sl-item" v-for="(k,j) in e.items" :key="j" @click="venueSelect(i,j)"> |
|
|
|
<view |
|
|
|
:class="[ k._isSelect? 'cyan' : '', getVenueStatusnInfo(k).className ]" |
|
|
|
> |
|
|
|
{{ getVenueStatusnInfo(k).zh_text || '-' }} |
|
|
|
</view> --> |
|
|
|
<scroll-view class="sti-venue-list" enable-flex scroll-x scroll-y enhanced :bounces="false" :style="venueAreaSize"> |
|
|
|
<view class="svl-box"> |
|
|
|
<view class="sticky-cover"></view> |
|
|
|
<view class="sl-time-ls"> |
|
|
|
<view class="sti-item" v-for="(e,i) in venueTimeList" :key="i"> |
|
|
|
<view>{{ e || '-' }}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="sl-name-ls"> |
|
|
|
<view class="snl-item" v-for="(e, i) in venueList" :key="i">{{e.venue_name || '-'}}</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="sl-vanue-ls"> |
|
|
|
<view class="svl-list" v-for="(e, i) in venueList" :key="i"> |
|
|
|
<!-- <view class="sl-item">{{e.venue_name || '-'}}</view> --> |
|
|
|
<view class="sl-item" v-for="(k,j) in e.items" :key="j" @click="venueSelect(i,j)"> |
|
|
|
<view |
|
|
|
:class="[ k._isSelect? 'cyan' : '', getVenueStatusnInfo(k).className ]" |
|
|
|
> |
|
|
|
{{ getVenueStatusnInfo(k).zh_text || '-' }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
</scroll-view> |
|
|
|
</view> |
|
|
|
<view class="sm-fixd-bot"> |
|
|
@ -209,6 +228,8 @@ export default { |
|
|
|
getVenueStatusnInfo(info){ |
|
|
|
// 超时未订 |
|
|
|
if(info.overdue&&info.type == 'empty_venue')return { zh_text: info.message || info.price, type: 'overdue', className: 'gray', } |
|
|
|
// isLinkage |
|
|
|
if(info.isLinkage&&info.isLinkage == true)return { zh_text: info.message || info.price || 0, type: 'linkage', className: 'gray', } |
|
|
|
switch(info.type){ |
|
|
|
case 'no_price_venue': |
|
|
|
return { zh_text: info.message || '无法订场', type: info.type, className: 'grey', } |
|
|
@ -273,12 +294,13 @@ export default { |
|
|
|
this.venueList = []; |
|
|
|
this.boardInfo = null; |
|
|
|
this.selectedVenueList = []; |
|
|
|
this.$nextTick(_ => this.setVenueAreaSize()); |
|
|
|
let _res = await this.getVenueList({ |
|
|
|
type_key: curTypeInfo.key || '', |
|
|
|
stadium_id: curStoreInfo.id || '', |
|
|
|
date: curDateInfo.dateStr || '', |
|
|
|
}) |
|
|
|
let _list = _res.dashboard || []; |
|
|
|
let _list = _res || []; |
|
|
|
if(!_list.length)return util.showNone('没有场地信息!'); |
|
|
|
|
|
|
|
this.venueList = _list || []; |
|
|
@ -296,6 +318,7 @@ export default { |
|
|
|
// 清空已选 |
|
|
|
clearSelectedList(){ |
|
|
|
this.refreshVenues(); |
|
|
|
|
|
|
|
// this.$nextTick(_=>this.getSelectedVenues()); |
|
|
|
}, |
|
|
|
// 占用提示 |
|
|
@ -329,7 +352,9 @@ export default { |
|
|
|
venueInfo: {...this.getVenueStatusnInfo(_curTarget)}, |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
if(_curTarget.type !== 'empty_venue')return; |
|
|
|
if(_curTarget.isLinkage == true)return; |
|
|
|
|
|
|
|
_venueList[i].items[j]._isSelect = !_curTarget._isSelect; |
|
|
|
|
|
|
@ -352,7 +377,15 @@ export default { |
|
|
|
// }) || []; |
|
|
|
|
|
|
|
// -----> |
|
|
|
|
|
|
|
// 联动赋值禁选 |
|
|
|
_venueList = this.checkLinkageVenue({ |
|
|
|
group: i, |
|
|
|
venueList: _venueList, |
|
|
|
selectedKey: '_isSelect', |
|
|
|
linkageKey: 'isLinkage', |
|
|
|
linkageIDArrKey: 'link_venue_ids', |
|
|
|
linkageIDKey: 'venue_id', |
|
|
|
}) |
|
|
|
this.venueList = _venueList; |
|
|
|
this.$nextTick(_=>{ |
|
|
|
// if(_ctnList.length>1){ |
|
|
@ -363,6 +396,40 @@ export default { |
|
|
|
this.getSelectedVenues(); |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 检查&设置联动禁选场地 |
|
|
|
checkLinkageVenue({ |
|
|
|
group = 0, // 所点击场地列表 |
|
|
|
venueList = [], // 所有场地 |
|
|
|
selectedKey = 'selectedKey', // 选中key |
|
|
|
linkageKey = 'linkageKey', // 联动禁用key |
|
|
|
linkageIDArrKey = 'link_venue_ids', |
|
|
|
linkageIDKey = 'venue_id', |
|
|
|
curTag |
|
|
|
}){ |
|
|
|
let _curGroupInfo = {...venueList[group]}; |
|
|
|
for(let i=0; i<venueList.length; i++){ |
|
|
|
let _link_venue_ids = _curGroupInfo[linkageIDArrKey] || []; |
|
|
|
|
|
|
|
if(_link_venue_ids.includes(venueList[i][linkageIDKey])){ |
|
|
|
_curGroupInfo.items.forEach(ele=>{ |
|
|
|
// 单列联动 |
|
|
|
if(venueList[i].link_venue_ids && venueList[i].link_venue_ids.length == 1){ |
|
|
|
venueList[i].items[ele._defineIndex][linkageKey] = !!_curGroupInfo.items[ele._defineIndex][selectedKey]; |
|
|
|
} |
|
|
|
// 多列联动 |
|
|
|
if(venueList[i].link_venue_ids && venueList[i].link_venue_ids.length > 1){ |
|
|
|
let _link_venueLs = venueList.filter(item=> venueList[i].link_venue_ids.includes(item[linkageIDKey])); |
|
|
|
// 已联动列表选中情况 ex: [ true, false ]; |
|
|
|
let _link_venueLs_selectedLs = _link_venueLs.map(el=> el['items'][ele._defineIndex] && el['items'][ele._defineIndex][selectedKey]); |
|
|
|
venueList[i].items[ele._defineIndex][linkageKey] = _link_venueLs_selectedLs.includes(true); // 多场联动,只要有一个被选中就禁止 |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
return venueList || []; |
|
|
|
}, |
|
|
|
|
|
|
|
// 获取已选列表 |
|
|
|
getSelectedVenues(){ |
|
|
|
let { venueList } = this; |
|
|
@ -379,6 +446,7 @@ export default { |
|
|
|
}) |
|
|
|
this.totalPrice = _totalPrice.toFixed(2); |
|
|
|
this.selectedVenueList = _arr || []; |
|
|
|
this.$nextTick(_ => this.setVenueAreaSize()); |
|
|
|
return _arr; |
|
|
|
}, |
|
|
|
// 日期tab 切换 |
|
|
@ -449,7 +517,15 @@ export default { |
|
|
|
return servers.get({ |
|
|
|
url: API.venue.venueList, |
|
|
|
data: { stadium_id, type_key, date }, |
|
|
|
failMsg: '加载分类失败!' |
|
|
|
failMsg: '加载场地列表失败!' |
|
|
|
}) |
|
|
|
.then(res=>{ |
|
|
|
let _ls = res.dashboard || []; |
|
|
|
_ls.map(ele => ele.items.map((item, index) =>{ |
|
|
|
item._defineIndex = index; |
|
|
|
return item; |
|
|
|
})) |
|
|
|
return _ls; |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 球类列表 |
|
|
@ -469,12 +545,21 @@ export default { |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 设置滚动区域大小 |
|
|
|
setVenueAreaSize(){ |
|
|
|
const sysInfo = uni.getSystemInfoSync(); |
|
|
|
util.getNodeMes('.sv-time-interval') |
|
|
|
.then(res=>{ |
|
|
|
this.venueAreaSize = `width:${sysInfo.screenWidth - res.width}px;height:${res.height}px;` |
|
|
|
}) |
|
|
|
async setVenueAreaSize(){ |
|
|
|
let _fixedBotInfo = {}, _fixedTopInfo = {}; |
|
|
|
const _sysInfo = uni.getSystemInfoSync() || {}; |
|
|
|
try{ |
|
|
|
_fixedTopInfo = await util.getNodeMes('.sm-sticky-box'); |
|
|
|
_fixedBotInfo = await util.getNodeMes('.sm-fixd-bot'); |
|
|
|
}catch(err){ |
|
|
|
console.warn('get fixed nodes info err', err); |
|
|
|
} |
|
|
|
let _totalHeight = ( _fixedBotInfo.height || 0 ) + ( _fixedTopInfo.height || 0 ); |
|
|
|
this.venueAreaSize = `width:${ _sysInfo.screenWidth || 0 }px;height:${ ( _sysInfo.windowHeight || 0 ) - _totalHeight }px;` |
|
|
|
// util.getNodeMes('.sv-time-interval') |
|
|
|
// .then(res=>{ |
|
|
|
// this.venueAreaSize = `width:${sysInfo.screenWidth - (res.width || 0)}px;height:${res.height || 0}px;` |
|
|
|
// }) |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
@ -486,10 +571,10 @@ export default { |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
.site-manage{ |
|
|
|
/* 动态设置页面高度出现页面跳点,直接设置底部最大高度 ,按钮价格 + 已选滚动区域 + 连场提示*/ |
|
|
|
padding-bottom: calc( 108upx + 370upx + 60upx); |
|
|
|
padding-bottom: calc( 108upx + 370upx + 60upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|
|
|
padding-bottom: calc( 108upx + 370upx + 60upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|
|
|
|
|
|
|
.sm-sticky-box{ |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
.sm-header{ |
|
|
|
padding: 0 24upx; |
|
|
|
.sh-address{ |
|
|
@ -680,77 +765,170 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
.sti-venue-list{ |
|
|
|
vertical-align: top; |
|
|
|
display: inline-block; |
|
|
|
// vertical-align: top; |
|
|
|
// display: inline-block; |
|
|
|
background-color: #f2f2f7; |
|
|
|
text-align: left; |
|
|
|
white-space: nowrap; |
|
|
|
.svl-list{ |
|
|
|
display: inline-block; |
|
|
|
width: 196upx; |
|
|
|
.sl-item{ |
|
|
|
height: 90upx; |
|
|
|
&:not(:first-child){ |
|
|
|
@include centerFlex(center); |
|
|
|
>view{ |
|
|
|
padding: 0 10upx; |
|
|
|
width: 176upx; |
|
|
|
height: 72upx; |
|
|
|
line-height: 68upx; |
|
|
|
text-align: center; |
|
|
|
border: 2upx solid $themeColor; |
|
|
|
border-radius: 10upx; |
|
|
|
font-size: 28upx; |
|
|
|
color: $themeColor; |
|
|
|
background-color: #fff; |
|
|
|
@include textHide(1); |
|
|
|
&.grey{ |
|
|
|
color: #9A9A9D; |
|
|
|
border-color: #D7D7DD; |
|
|
|
background-color: #D7D7DD; |
|
|
|
} |
|
|
|
&.green{ |
|
|
|
color: #FFF; |
|
|
|
border-color: $themeColor; |
|
|
|
background-color: $themeColor; |
|
|
|
} |
|
|
|
&.cyan{ |
|
|
|
background-color: rgba($color: #33CCA9, $alpha: .18); |
|
|
|
} |
|
|
|
&.black{ |
|
|
|
color: #FFF; |
|
|
|
border-color: #333333; |
|
|
|
background-color: #333333; |
|
|
|
} |
|
|
|
&.blue{ |
|
|
|
color: #fff; |
|
|
|
border-color: #4F7CC7; |
|
|
|
background-color: #4F7CC7; |
|
|
|
} |
|
|
|
&.pistac{ |
|
|
|
color: #fff; |
|
|
|
background-color: #68C43B; |
|
|
|
border-color: #68C43B; |
|
|
|
} |
|
|
|
&.gray{ |
|
|
|
border-color: #9A9A9D; |
|
|
|
color: #9A9A9D; |
|
|
|
} |
|
|
|
} |
|
|
|
// text-align: left; |
|
|
|
// white-space: nowrap; |
|
|
|
.svl-box{ |
|
|
|
width: fit-content; |
|
|
|
height: fit-content; |
|
|
|
.sticky-cover{ |
|
|
|
position: sticky; |
|
|
|
left: 0; |
|
|
|
top: 0; |
|
|
|
width: 0upx; |
|
|
|
height: 0upx; |
|
|
|
z-index: 5; |
|
|
|
&::after{ |
|
|
|
content: ''; |
|
|
|
position: absolute; |
|
|
|
left: 0; |
|
|
|
top: 0; |
|
|
|
width: 110upx; |
|
|
|
height: 60upx; |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
&:first-child{ |
|
|
|
} |
|
|
|
.sl-name-ls{ |
|
|
|
position: sticky; |
|
|
|
padding-left: 112upx; |
|
|
|
top: 0; |
|
|
|
width: fit-content; |
|
|
|
white-space: nowrap; |
|
|
|
font-size: 0; |
|
|
|
.snl-item{ |
|
|
|
vertical-align: top; |
|
|
|
display: inline-block; |
|
|
|
width: 196upx; |
|
|
|
height: 72upx; |
|
|
|
line-height: 70upx; |
|
|
|
text-align: center; |
|
|
|
font-size: 24upx; |
|
|
|
font-weight: 500; |
|
|
|
border-bottom: 2upx solid #D8D8D8; |
|
|
|
white-space: nowrap; |
|
|
|
text-overflow: ellipsis; |
|
|
|
overflow: hidden; |
|
|
|
background-color: #fff; |
|
|
|
color: #333; |
|
|
|
@include textHide(1); |
|
|
|
} |
|
|
|
} |
|
|
|
.sl-time-ls{ |
|
|
|
position: sticky; |
|
|
|
left: 0; |
|
|
|
top: 0; |
|
|
|
z-index: 2; |
|
|
|
float: left; |
|
|
|
display: inline-block; |
|
|
|
vertical-align: top; |
|
|
|
background-color: #fff; |
|
|
|
.sti-item{ |
|
|
|
position: relative; |
|
|
|
width: 112upx; |
|
|
|
height: 90upx; |
|
|
|
border-right: 2upx solid #d8d8d8; |
|
|
|
>view{ |
|
|
|
position: absolute; |
|
|
|
left: 0; |
|
|
|
top: 50%; |
|
|
|
padding: 0 10upx; |
|
|
|
height: 100%; |
|
|
|
width: 100%; |
|
|
|
text-align: center; |
|
|
|
line-height: 84upx; |
|
|
|
font-size: 24upx; |
|
|
|
color: #333; |
|
|
|
@include textHide(1); |
|
|
|
} |
|
|
|
&::after{ |
|
|
|
content: ''; |
|
|
|
position: absolute; |
|
|
|
bottom: 0; |
|
|
|
right: 0; |
|
|
|
width: 14upx; |
|
|
|
height: 2upx; |
|
|
|
background-color: #d8d8d8; |
|
|
|
} |
|
|
|
&:first-child,&:last-child{ |
|
|
|
&::after{ |
|
|
|
display: none; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
&:first-child{ |
|
|
|
height: 72upx; |
|
|
|
>view{ |
|
|
|
line-height: 72upx; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
&:last-child>view{ |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.sl-vanue-ls{ |
|
|
|
font-size: 0; |
|
|
|
text-align: left; |
|
|
|
white-space: nowrap; |
|
|
|
.svl-list{ |
|
|
|
vertical-align: top; |
|
|
|
display: inline-block; |
|
|
|
width: 196upx; |
|
|
|
.sl-item{ |
|
|
|
height: 90upx; |
|
|
|
@include centerFlex(center); |
|
|
|
>view{ |
|
|
|
padding: 0 10upx; |
|
|
|
width: 176upx; |
|
|
|
height: 72upx; |
|
|
|
line-height: 68upx; |
|
|
|
text-align: center; |
|
|
|
border: 2upx solid $themeColor; |
|
|
|
border-radius: 10upx; |
|
|
|
font-size: 28upx; |
|
|
|
color: $themeColor; |
|
|
|
background-color: #fff; |
|
|
|
@include textHide(1); |
|
|
|
&.grey{ |
|
|
|
color: #9A9A9D; |
|
|
|
border-color: #D7D7DD; |
|
|
|
background-color: #D7D7DD; |
|
|
|
} |
|
|
|
&.green{ |
|
|
|
color: #FFF; |
|
|
|
border-color: $themeColor; |
|
|
|
background-color: $themeColor; |
|
|
|
} |
|
|
|
&.cyan{ |
|
|
|
background-color: rgba($color: #33CCA9, $alpha: .18); |
|
|
|
} |
|
|
|
&.black{ |
|
|
|
color: #FFF; |
|
|
|
border-color: #333333; |
|
|
|
background-color: #333333; |
|
|
|
} |
|
|
|
&.blue{ |
|
|
|
color: #fff; |
|
|
|
border-color: #4F7CC7; |
|
|
|
background-color: #4F7CC7; |
|
|
|
} |
|
|
|
&.pistac{ |
|
|
|
color: #fff; |
|
|
|
background-color: #68C43B; |
|
|
|
border-color: #68C43B; |
|
|
|
} |
|
|
|
&.gray{ |
|
|
|
border-color: #9A9A9D; |
|
|
|
color: #9A9A9D; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
.sm-fixd-bot{ |
|
|
@ -761,6 +939,7 @@ export default { |
|
|
|
padding-bottom: calc( 0upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|
|
|
padding-bottom: calc( 0upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|
|
|
width: 100%; |
|
|
|
z-index: 5; |
|
|
|
background-color: #fff; |
|
|
|
.sfb-selected-section{ |
|
|
|
.sss-bar{ |
|
|
@ -900,6 +1079,7 @@ export default { |
|
|
|
position: fixed; |
|
|
|
left: 50%; |
|
|
|
top: 50%; |
|
|
|
z-index: 10; |
|
|
|
transform: translate(-50%, -50%); |
|
|
|
max-width: 600upx; |
|
|
|
padding: 20upx 30upx; |
|
|
|