油站二维码
This commit is contained in:
xk_guohonglei
@@ -2,10 +2,10 @@
|
||||
<view>
|
||||
<view class="content text-left padding">
|
||||
<view class="strong padding-bottom-xs color-333 ">
|
||||
{{'oilSiteName'}}
|
||||
{{oilSite.oilSiteName}}
|
||||
</view>
|
||||
<view class="font-12 color-999">
|
||||
<text class="padding-right">1.32km</text> | <text class="padding-left text-cut">紫云路与金寨南路交口向西200...</text>
|
||||
<text class=" text-cut">{{oilSite.address}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="padding-left padding-right">
|
||||
@@ -13,8 +13,8 @@
|
||||
油号选择：
|
||||
</view>
|
||||
<view class="grid col-5 justify-start">
|
||||
<view class="padding-xs" v-for="(item,index) in ColorList" :key="index">
|
||||
<button class="cu-btn" :class="[active===index?'bg-main-oil':'line-gray']">92#</button>
|
||||
<view class="padding-xs" v-for="(item,index) in oilList" :key="index">
|
||||
<button class="cu-btn" @tap="oilNameSel(item)" :class="[selected.oilName===item.oilName?'bg-main-oil':'line-gray']">{{item.oilName}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -22,8 +22,8 @@
|
||||
<text class="strong padding-right font-16">
|
||||
0#柴油
|
||||
</text>
|
||||
<text class="padding-right">星油价格:<text class="oil-main-color text-bold">￥6.41/L</text></text>
|
||||
<text class="s-rich">市场价:￥6.5/L</text>
|
||||
<text class="padding-right">星油价格:<text class="oil-main-color text-bold">￥{{selected.xkPrice?selected.xkPrice:selected.lvPrice|numberFilter}}/L</text></text>
|
||||
<text class="s-rich">市场价:￥{{selected.standardPrice|numberFilter}}/L</text>
|
||||
</view>
|
||||
<view class="padding-left padding-right">
|
||||
<view class="padding-bottom-sm">
|
||||
@@ -32,7 +32,7 @@
|
||||
<view class="grid col-5 justify-start">
|
||||
|
||||
<view class="padding-xs" v-for="(item,index) in ColorList" :key="index">
|
||||
<button class="cu-btn" :class="[active===index?'bg-main-oil':'line-gray']">{{index}}</button>
|
||||
<button @tap="gunIdSel(index)" class="cu-btn" :class="[gunId===index?'bg-main-oil':'line-gray']">{{index+1}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -40,27 +40,112 @@
|
||||
<view class="solid-top margin-top-sm shadow-warp">
|
||||
<view class="cu-form-group">
|
||||
<view class="title">加油升数</view>
|
||||
<input type="number" placeholder="请输入加油升数" name="input"></input>
|
||||
<text>约￥0.00</text>
|
||||
<input type="number" v-model="vol" @input="calcMoney" placeholder="请输入加油升数" name="input"></input>
|
||||
<text>约￥{{money.total}}</text>
|
||||
</view>
|
||||
<view class="my-cell">
|
||||
<text class="font-12">星卡优惠金额</text><text class="fr">-￥0.00</text>
|
||||
<text class="font-12">星卡优惠金额</text><text class="fr">-￥{{money.discount}}</text>
|
||||
</view>
|
||||
<view class="my-cell">
|
||||
<text class="font-12">实际支付金额</text><text class="oil-main-color fr">￥0.00</text>
|
||||
<text class="font-12">实际支付金额</text><text class="oil-main-color fr">￥{{money.realPay}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<button class="margin round bg-main-oil">确定</button>
|
||||
<button class="margin round bg-main-oil" @tap="onConfirm">确定</button>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
oilList: {
|
||||
type: Array,
|
||||
default () {}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
active: 0,
|
||||
ColorList: [1, 2, 9, 10]
|
||||
vol: '',
|
||||
oliNameList: [1, 2, 9, 10],
|
||||
ColorList: [1, 2, 9, 10],
|
||||
gunId: 0,
|
||||
oilSite: uni.getStorageSync('oilSite'),
|
||||
selected: {
|
||||
xkPrice: '',
|
||||
standardPrice: ''
|
||||
},
|
||||
money: {
|
||||
total: 0,
|
||||
discount: 0,
|
||||
realPay: 0
|
||||
},
|
||||
price: 1
|
||||
}
|
||||
},
|
||||
created() {
|
||||
console.log(this.oilList)
|
||||
this.initForm()
|
||||
},
|
||||
watch: {
|
||||
oilList: {
|
||||
handler(newVal, oldVal) {
|
||||
console.log('深度监听', newVal, oldVal)
|
||||
this.oilList = newVal
|
||||
this.initForm()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
selected: {
|
||||
handler(newVal, oldVal) {
|
||||
console.log('深度监听2323', newVal, oldVal)
|
||||
this.selected = newVal
|
||||
if (newVal) {
|
||||
this.calcMoney()
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
gunIdSel(index) {
|
||||
this.gunId = index
|
||||
},
|
||||
oilNameSel(item) {
|
||||
this.selected = item
|
||||
|
||||
},
|
||||
initForm() {
|
||||
if (this.oilList) {
|
||||
this.selected = this.oilList[0]
|
||||
}
|
||||
},
|
||||
onConfirm() {
|
||||
const data5 = {
|
||||
...this.selected,
|
||||
vol: this.vol,
|
||||
oilPrice: this.selected.xkPrice ? this.selected.xkPrice : this.selected.lvPrice,
|
||||
gunId: this.gunId + 1,
|
||||
realPay:this.money.realPay
|
||||
|
||||
}
|
||||
console.log('被选中的', data5)
|
||||
this.$emit('confirmVol', data5)
|
||||
},
|
||||
calcMoney() {
|
||||
this.price = this.selected.xkPrice ? this.selected.xkPrice : this.selected.lvPrice
|
||||
this.money.total = this.vol * this.selected.standardPrice
|
||||
this.money.discount = this.money.total - this.vol * (this.selected.standardPrice - this.price)
|
||||
this.money.realPay = (this.money.total - this.money.discount).toFixed(2)
|
||||
console.log('总金额','折扣','实际支付')
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
numberFilter(value) {
|
||||
value = value - 1 + 1
|
||||
if (value) {
|
||||
return value.toFixed(2)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
// 可供选择的订单
|
||||
// 开票列表
|
||||
<template>
|
||||
<view class="cu-item radius shadow">
|
||||
<image class="pay-status" :src="baseURL+'static/img/oil-unfinished.png'" alt />
|
||||
<view class="cu-item radius shadow margin-bottom">
|
||||
<!-- <image class="pay-status" :src="baseURL+'static/img/oil-unfinished.png'" alt /> -->
|
||||
<view class="cu-avatar text-sl" :style="'background-image:url('+baseURL+'static/img/order-wjy.png)'"></view>
|
||||
<view class="content">
|
||||
<view class=" solid-bottom padding-bottom">
|
||||
<view class=" solid-bottom padding-bottom-sm">
|
||||
<view class="flex-treble">
|
||||
{{item.orderID}}
|
||||
</view>
|
||||
@@ -20,9 +20,9 @@
|
||||
<view class="details">
|
||||
<view class="top1 text-left">
|
||||
<image class="icon icon-desc " :src="baseURL+'static/img/oil-lf.png'" alt />
|
||||
<text class="padding-left-xs" v-if="item.vol"> {{item.vol}}升</text>
|
||||
<text >
|
||||
{{item.oilName}} （{{item.oilCode}}）
|
||||
<text class="padding-left-xs" v-if="item.vol"> {{item.vol|numberFilter}}升</text>
|
||||
<text>
|
||||
{{item.oilName}}
|
||||
</text>
|
||||
|
||||
</view>
|
||||
@@ -30,7 +30,7 @@
|
||||
<image class="icon icon-desc " :src="baseURL+'static/img/oil-time.png'" alt />
|
||||
|
||||
<text class="padding-left-xs">
|
||||
{{item.credateDatetime}}
|
||||
{{item.createDatetime.substring(0,19)}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="bottom text-left">
|
||||
@@ -44,7 +44,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="margin-top-sm flex justify-between">
|
||||
<view class="text-gray text-df">2018年12月4日</view>
|
||||
<view class="text-gray text-df">{{item.createDatetime.substring(0, 10)}}</view>
|
||||
<view>
|
||||
<text class="color-000 total-money">￥{{item.realamount|numberFilter}}</text>
|
||||
</view>
|
||||
@@ -99,6 +99,7 @@
|
||||
}
|
||||
},
|
||||
numberFilter(value) {
|
||||
value = value -1+1
|
||||
return value.toFixed(2)
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user