|
|
@ -4,13 +4,42 @@ |
|
|
|
|
|
|
|
|
<view class="container"> |
|
|
<view class="container"> |
|
|
|
|
|
|
|
|
|
|
|
{{ scene }} |
|
|
|
|
|
|
|
|
|
|
|
<uni-section title="当前加油站" |
|
|
|
|
|
type="line" |
|
|
|
|
|
titleFontSize="34rpx"></uni-section> |
|
|
|
|
|
<view class="select-oil" |
|
|
|
|
|
style="justify-content: flex-start;"> |
|
|
|
|
|
<view class="oil-item" v-if="gasStation.name"> |
|
|
|
|
|
<view class="oil active-oil"> |
|
|
|
|
|
{{ gasStation.name }} |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="oil-item" |
|
|
|
|
|
style="margin-left: 20rpx;"> |
|
|
|
|
|
<view class="oil" |
|
|
|
|
|
style="display: flex; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
height: 100%;" |
|
|
|
|
|
@click="$refs.popup.open()"> |
|
|
|
|
|
选择站点 |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!-- <view class="tip"> |
|
|
|
|
|
{{ gasStation.name }} |
|
|
|
|
|
</view> --> |
|
|
|
|
|
|
|
|
<uni-section title="油号" type="line" titleFontSize="34rpx"></uni-section> |
|
|
<uni-section title="油号" type="line" titleFontSize="34rpx"></uni-section> |
|
|
<view class="select-oil"> |
|
|
<view class="select-oil"> |
|
|
<view class="oil-item"> |
|
|
<view class="oil-item"> |
|
|
<view class="oil active-oil" |
|
|
<view class="oil active-oil" |
|
|
style="flex-direction: column;"> |
|
|
style="flex-direction: column;"> |
|
|
<view class="number">{{ configList.title.keyCentent }}</view> |
|
|
|
|
|
<view class="unit">{{ configList.price.keyCentent }}</view> |
|
|
|
|
|
|
|
|
<view class="number">{{ configList.title }}</view> |
|
|
|
|
|
<view class="unit">{{ configList.price }}</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
@ -25,7 +54,7 @@ |
|
|
折后共计{{ |
|
|
折后共计{{ |
|
|
(form.money * |
|
|
(form.money * |
|
|
(configList.preferential ? |
|
|
(configList.preferential ? |
|
|
configList.preferential.keyCentent |
|
|
|
|
|
|
|
|
configList.preferential |
|
|
: 1)).toFixed(2) |
|
|
: 1)).toFixed(2) |
|
|
}}元 |
|
|
}}元 |
|
|
</view> |
|
|
</view> |
|
|
@ -53,12 +82,35 @@ |
|
|
@trigger="clickMenu" /> --> |
|
|
@trigger="clickMenu" /> --> |
|
|
|
|
|
|
|
|
<view class="phone" |
|
|
<view class="phone" |
|
|
@click="clickService(configList.phone.keyCentent)"> |
|
|
|
|
|
|
|
|
@click="clickService(configList.phone)"> |
|
|
<uv-icon |
|
|
<uv-icon |
|
|
size="45rpx" |
|
|
size="45rpx" |
|
|
color="#fff" |
|
|
color="#fff" |
|
|
name="phone"></uv-icon> |
|
|
name="phone"></uv-icon> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<uv-popup ref="popup" |
|
|
|
|
|
:round="30" |
|
|
|
|
|
:closeOnClickOverlay="false" |
|
|
|
|
|
:customStyle="{'max-height': '80vh'}"> |
|
|
|
|
|
|
|
|
|
|
|
<view class="GasStationList"> |
|
|
|
|
|
<view class="title"> |
|
|
|
|
|
请选择加油站 |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<view class="select-oilx"> |
|
|
|
|
|
<view class="oil-itemx" |
|
|
|
|
|
@click="setGasStation(item)" |
|
|
|
|
|
:key="index" |
|
|
|
|
|
v-for="(item, index) in gasStationList"> |
|
|
|
|
|
<view class="oilx"> |
|
|
|
|
|
{{ item.name }} |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</uv-popup> |
|
|
|
|
|
|
|
|
</view> |
|
|
</view> |
|
|
</template> |
|
|
</template> |
|
|
@ -72,7 +124,7 @@ |
|
|
PrivacyAgreementPoup |
|
|
PrivacyAgreementPoup |
|
|
}, |
|
|
}, |
|
|
computed : { |
|
|
computed : { |
|
|
...mapState(['configList']), |
|
|
|
|
|
|
|
|
...mapState(['configList', 'gasStationList', 'gasStation']), |
|
|
}, |
|
|
}, |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
@ -90,32 +142,40 @@ |
|
|
horizontal: 'right', |
|
|
horizontal: 'right', |
|
|
vertical: 'bottom', |
|
|
vertical: 'bottom', |
|
|
direction: 'vertical', |
|
|
direction: 'vertical', |
|
|
rechargeList : [] |
|
|
|
|
|
|
|
|
rechargeList : [], |
|
|
|
|
|
scene : '', |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
onShow() { |
|
|
onShow() { |
|
|
// if (wx.onNeedPrivacyAuthorization) { |
|
|
|
|
|
// console.log('onNeedPrivacyAuthorization'); |
|
|
|
|
|
// wx.onNeedPrivacyAuthorization(resolve => { |
|
|
|
|
|
// console.log('onNeedPrivacyAuthorization'); |
|
|
|
|
|
// this.resolvePrivacyAuthorization = resolve |
|
|
|
|
|
// this.$refs.showPrivacy.init(resolve) |
|
|
|
|
|
// }) |
|
|
|
|
|
// } |
|
|
|
|
|
// wx.getPrivacySetting({ |
|
|
|
|
|
// success: res => { |
|
|
|
|
|
// console.log(res) |
|
|
|
|
|
// if (res.needAuthorization) { |
|
|
|
|
|
// // 需要弹出隐私协议 |
|
|
|
|
|
// this.$refs.showPrivacy.init() |
|
|
|
|
|
// } |
|
|
|
|
|
// }, |
|
|
|
|
|
// fail: () => {} |
|
|
|
|
|
// }) |
|
|
|
|
|
this.getRechargePage() |
|
|
|
|
|
|
|
|
if(!this.scene && !this.gasStation.id){ |
|
|
|
|
|
this.$refs.popup.open() |
|
|
|
|
|
}else{ |
|
|
|
|
|
this.gasStationList.forEach(n => { |
|
|
|
|
|
if(n.id == this.scene){ |
|
|
|
|
|
this.$store.commit('setGasStation', n) |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
this.$nextTick(n => { |
|
|
|
|
|
this.getRechargePage() |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
onLoad (query) { |
|
|
|
|
|
// scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene |
|
|
|
|
|
const scene = decodeURIComponent(query.scene || '') |
|
|
|
|
|
this.scene = scene |
|
|
}, |
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
|
|
|
|
|
|
setGasStation(data){ |
|
|
|
|
|
this.$store.commit('setGasStation', data) |
|
|
|
|
|
this.$refs.popup.close() |
|
|
|
|
|
|
|
|
|
|
|
this.$nextTick(n => { |
|
|
|
|
|
this.getRechargePage() |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
// 用户选择加油金额 |
|
|
// 用户选择加油金额 |
|
|
selectMoney(money, item) { |
|
|
selectMoney(money, item) { |
|
|
this.form.money = money |
|
|
this.form.money = money |
|
|
@ -137,6 +197,9 @@ |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
submit() { |
|
|
submit() { |
|
|
|
|
|
if (!this.gasStation.id) { |
|
|
|
|
|
return this.$refs.popup.open() |
|
|
|
|
|
} |
|
|
if (!uni.getStorageSync('token')) { |
|
|
if (!uni.getStorageSync('token')) { |
|
|
return uni.navigateTo({ |
|
|
return uni.navigateTo({ |
|
|
url: '/pages/login/login' |
|
|
url: '/pages/login/login' |
|
|
@ -144,7 +207,7 @@ |
|
|
} |
|
|
} |
|
|
let money = (this.form.money * |
|
|
let money = (this.form.money * |
|
|
(this.configList.preferential ? |
|
|
(this.configList.preferential ? |
|
|
this.configList.preferential.keyCentent |
|
|
|
|
|
|
|
|
this.configList.preferential |
|
|
: 1)).toFixed(2) |
|
|
: 1)).toFixed(2) |
|
|
|
|
|
|
|
|
// if(!money){ |
|
|
// if(!money){ |
|
|
@ -154,8 +217,9 @@ |
|
|
// }) |
|
|
// }) |
|
|
// } |
|
|
// } |
|
|
|
|
|
|
|
|
this.$api('createOrderPay', { |
|
|
|
|
|
money |
|
|
|
|
|
|
|
|
this.$api('twocreateOrderPay', { |
|
|
|
|
|
money, |
|
|
|
|
|
shopId : this.gasStation.id, |
|
|
}, res => { |
|
|
}, res => { |
|
|
this.form.money = '' |
|
|
this.form.money = '' |
|
|
if(res.code == 200){ |
|
|
if(res.code == 200){ |
|
|
@ -191,7 +255,9 @@ |
|
|
|
|
|
|
|
|
//获取充值套餐 |
|
|
//获取充值套餐 |
|
|
getRechargePage(){ |
|
|
getRechargePage(){ |
|
|
this.$api('getRechargePage', res => { |
|
|
|
|
|
|
|
|
this.$api('twogetRechargeList', { |
|
|
|
|
|
id : this.gasStation.id |
|
|
|
|
|
}, res => { |
|
|
this.rechargeList = res.result.records |
|
|
this.rechargeList = res.result.records |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
@ -210,10 +276,43 @@ |
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
<style scoped lang="scss"> |
|
|
.payment { |
|
|
.payment { |
|
|
|
|
|
/deep/ .uv-popup{ |
|
|
|
|
|
z-index: 99999999 !important; |
|
|
|
|
|
} |
|
|
height: 100vh; |
|
|
height: 100vh; |
|
|
background: #F1F5F8; |
|
|
background: #F1F5F8; |
|
|
width: 750rpx; |
|
|
width: 750rpx; |
|
|
margin: 0 auto; |
|
|
margin: 0 auto; |
|
|
|
|
|
.GasStationList{ |
|
|
|
|
|
width: 650rpx; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
max-height: calc(80vh - 20rpx); |
|
|
|
|
|
overflow: auto; |
|
|
|
|
|
.title{ |
|
|
|
|
|
padding: 20rpx; |
|
|
|
|
|
font-size: 35rpx; |
|
|
|
|
|
margin-top: 10rpx; |
|
|
|
|
|
font-weight: 900; |
|
|
|
|
|
position: sticky; |
|
|
|
|
|
top: 0; |
|
|
|
|
|
background-color: #fff; |
|
|
|
|
|
} |
|
|
|
|
|
.oil-itemx{ |
|
|
|
|
|
width: auto; |
|
|
|
|
|
box-sizing: border-box; |
|
|
|
|
|
border-radius: 20rpx; |
|
|
|
|
|
margin: 20rpx; |
|
|
|
|
|
padding: 30rpx 20rpx; |
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
background-color: #00aaff; |
|
|
|
|
|
.oilx{ |
|
|
|
|
|
align-items: flex-start; |
|
|
|
|
|
padding: 20rpx; |
|
|
|
|
|
font-size: 30rpx; |
|
|
|
|
|
color: #fff; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
.container{ |
|
|
.container{ |
|
|
.oil-item{ |
|
|
.oil-item{ |
|
|
.active-oil{ |
|
|
.active-oil{ |
|
|
|
