caoliancun
/
LSM_OIL_SITE
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

油站二维码

Browse Source
lixuan
xk_guohonglei 5 years ago
parent b68df95618
commit 95d1376376
7 changed files with 240 additions and 50 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      api/cloud-site.js
  2. 111
      components/OrderOil.vue
  3. 17
      components/order-item.vue
  4. 6
      pages.json
  5. 54
      pages/orderList/orderList.vue
  6. 87
      pages/qrcode/QrCode_xy.vue
  7. 9
      utils/request.js

4
api/cloud-site.js
Unescape View File

@ -53,8 +53,8 @@ export default {
// 获取带参数的油站二维码 // 获取带参数的油站二维码
getDesignatedSiteQrCode(data) { getDesignatedSiteQrCode(data) {
return request({ return request({
url: `/${service_name}/${group_name}/getSiteQrCode`, url: `/${service_name}/${group_name}/updateSiteQrCode`,
method: 'get', method: 'post',
data: data data: data
}) })
}, },

111
components/OrderOil.vue
Unescape View File

@ -2,10 +2,10 @@
<view> <view>
<view class="content text-left padding"> <view class="content text-left padding">
<view class="strong padding-bottom-xs color-333 "> <view class="strong padding-bottom-xs color-333 ">
{{'oilSiteName'}} {{oilSite.oilSiteName}}
</view> </view>
<view class="font-12 color-999"> <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> </view>
<view class="padding-left padding-right"> <view class="padding-left padding-right">
@ -13,8 +13,8 @@
油号选择： 油号选择：
</view> </view>
<view class="grid col-5 justify-start"> <view class="grid col-5 justify-start">
<view class="padding-xs" v-for="(item,index) in ColorList" :key="index"> <view class="padding-xs" v-for="(item,index) in oilList" :key="index">
<button class="cu-btn" :class="[active===index?'bg-main-oil':'line-gray']">92#</button> <button class="cu-btn" @tap="oilNameSel(item)" :class="[selected.oilName===item.oilName?'bg-main-oil':'line-gray']">{{item.oilName}}</button>
</view> </view>
</view> </view>
</view> </view>
@ -22,8 +22,8 @@
<text class="strong padding-right font-16"> <text class="strong padding-right font-16">
0#柴油 0#柴油
</text> </text>
<text class="padding-right">星油价格:<text class="oil-main-color text-bold">￥6.41/L</text></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">市场价:￥6.5/L</text> <text class="s-rich">市场价:￥{{selected.standardPrice|numberFilter}}/L</text>
</view> </view>
<view class="padding-left padding-right"> <view class="padding-left padding-right">
<view class="padding-bottom-sm"> <view class="padding-bottom-sm">
@ -32,7 +32,7 @@
<view class="grid col-5 justify-start"> <view class="grid col-5 justify-start">
<view class="padding-xs" v-for="(item,index) in ColorList" :key="index"> <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> </view>
</view> </view>
@ -40,27 +40,112 @@
<view class="solid-top margin-top-sm shadow-warp"> <view class="solid-top margin-top-sm shadow-warp">
<view class="cu-form-group"> <view class="cu-form-group">
<view class="title">加油升数</view> <view class="title">加油升数</view>
<input type="number" placeholder="请输入加油升数" name="input"></input> <input type="number" v-model="vol" @input="calcMoney" placeholder="请输入加油升数" name="input"></input>
<text>约￥0.00</text> <text>约￥{{money.total}}</text>
</view> </view>
<view class="my-cell"> <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>
<view class="my-cell"> <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>
</view> </view>
<button class="margin round bg-main-oil">确定</button> <button class="margin round bg-main-oil" @tap="onConfirm">确定</button>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
props: {
oilList: {
type: Array,
default () {}
}
},
data() { data() {
return { return {
active: 0, 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)
}
} }
} }
} }

17
components/order-item.vue
Unescape View File

@ -1,11 +1,11 @@
// 可供选择的订单 // 可供选择的订单
// 开票列表 // 开票列表
<template> <template>
<view class="cu-item radius shadow"> <view class="cu-item radius shadow margin-bottom">
<image class="pay-status" :src="baseURL+'static/img/oil-unfinished.png'" alt /> <!-- <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="cu-avatar text-sl" :style="'background-image:url('+baseURL+'static/img/order-wjy.png)'"></view>
<view class="content"> <view class="content">
<view class=" solid-bottom padding-bottom"> <view class=" solid-bottom padding-bottom-sm">
<view class="flex-treble"> <view class="flex-treble">
{{item.orderID}} {{item.orderID}}
</view> </view>
@ -20,9 +20,9 @@
<view class="details"> <view class="details">
<view class="top1 text-left"> <view class="top1 text-left">
<image class="icon icon-desc " :src="baseURL+'static/img/oil-lf.png'" alt /> <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 class="padding-left-xs" v-if="item.vol"> {{item.vol|numberFilter}}升</text>
<text > <text>
{{item.oilName}} （{{item.oilCode}}） {{item.oilName}}
</text> </text>
</view> </view>
@ -30,7 +30,7 @@
<image class="icon icon-desc " :src="baseURL+'static/img/oil-time.png'" alt /> <image class="icon icon-desc " :src="baseURL+'static/img/oil-time.png'" alt />
<text class="padding-left-xs"> <text class="padding-left-xs">
{{item.credateDatetime}} {{item.createDatetime.substring(0,19)}}
</text> </text>
</view> </view>
<view class="bottom text-left"> <view class="bottom text-left">
@ -44,7 +44,7 @@
</view> </view>
</view> </view>
<view class="margin-top-sm flex justify-between"> <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> <view>
<text class="color-000 total-money">￥{{item.realamount|numberFilter}}</text> <text class="color-000 total-money">￥{{item.realamount|numberFilter}}</text>
</view> </view>
@ -99,6 +99,7 @@
} }
}, },
numberFilter(value) { numberFilter(value) {
value = value -1+1
return value.toFixed(2) return value.toFixed(2)
} }
} }

6
pages.json
Unescape View File

@ -5,6 +5,9 @@
"style": { "style": {
} }
}, {
"path": "pages/orderList/orderList",
"style": {}
}, },
{ {
"path": "pages/index/index", "path": "pages/index/index",
@ -30,9 +33,6 @@
"style": {} "style": {}
}, },
{ {
"path": "pages/orderList/orderList",
"style": {}
}, {
"path": "pages/Auth/Auth", "path": "pages/Auth/Auth",
"style": {} "style": {}
} }

54
pages/orderList/orderList.vue
Unescape View File

@ -10,9 +10,22 @@
@tap="tabSelect" :data-id="index">{{item}}</view> @tap="tabSelect" :data-id="index">{{item}}</view>
</view> </view>
</scroll-view> </scroll-view>
<view class="margin"> <view class="padding　 padding-bottom-0">
<OrderItem class="cu-list menu-avatar comment" v-for="(item,index) in tabList" :key="index" v-show="index==TabCur" <view v-show="TabCur==0" class="order-list">
:item="order" /> <view 　v-for="item in allOrder" :key="item.orderID">
<OrderItem class="cu-list order-item menu-avatar comment" :item="item" />
</view>
</view>　
<view v-show="TabCur==1" class="order-list">
<view v-for="item in payingOrder" :key="item.orderID">
<OrderItem class="cu-list order-item menu-avatar comment" :item="item" />
</view>
</view>
<view v-show="TabCur==2" class="order-list">
<view 　 v-for="item in finishedOrder" :key="item.orderID">
<OrderItem class="cu-list order-item menu-avatar comment" :item="item" />
</view>
</view>
</view> </view>
</view> </view>
</template> </template>
@ -27,11 +40,11 @@
data() { data() {
return { return {
tabList: [ tabList: [
'全部', '待支付', '已支付', '退款' '全部', '待支付', '已支付'
], ],
TabCur: 0, TabCur: 0,
pageNumber: 1, pageNumber: 1,
istate: 3, istate: -3,
scrollLeft: 0, scrollLeft: 0,
order: { order: {
istate: 0, istate: 0,
@ -44,7 +57,10 @@
sourceType: 3, sourceType: 3,
realamount: 4.66, realamount: 4.66,
credateDatetime: '2020-10-12 12:30:10' credateDatetime: '2020-10-12 12:30:10'
} },
allOrder: [],
finishedOrder: [],
payingOrder: [],
} }
}, },
created() { created() {
@ -56,11 +72,12 @@
this.calcIstate(this.TabCur) this.calcIstate(this.TabCur)
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60 this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
}, },
calcIstate(id) { calcIstate(id) {
switch (id) { switch (id) {
case 0: case 0:
this.istate = 3 this.istate = -3
this.loadList() this.loadList()
break break
case 1: case 1:
@ -71,11 +88,6 @@
this.istate = 1 this.istate = 1
this.loadList() this.loadList()
break break
case 3:
this.istate = 2
this.loadList()
break
} }
}, },
loadList() { loadList() {
@ -84,7 +96,19 @@
pageIndex: this.pageNumber //类型：Number 必有字段 备注：查询第几页,默认一页10条 pageIndex: this.pageNumber //类型：Number 必有字段 备注：查询第几页,默认一页10条
} }
cloudSiteApi.getSiteOrder(data2).then(res => { cloudSiteApi.getSiteOrder(data2).then(res => {
if (res.code === 20000) {
switch (this.istate) {
case 0:
this.payingOrder = res.data
break
case 1:
this.finishedOrder = res.data
break
case -3:
this.allOrder = res.data
break
}
}
}) })
} }
} }
@ -95,4 +119,8 @@
.content { .content {
min-height: 100%; min-height: 100%;
} }
.order-list .order-item:last-of-type {
margin-bottom: 0;
}
</style> </style>

87
pages/qrcode/QrCode_xy.vue
Unescape View File

@ -15,16 +15,17 @@
@result="qrR" /> @result="qrR" />
</view> </view>
</view> </view>
<view class="text-center padding-bottom-xs padding-bottom-xs"> <view @tap="refreashQr" class="text-center padding-bottom-xs padding-bottom-xs">
<text class="color-999 font-12"> <text class="color-999 font-12">
<text class="cuIcon-refresh padding-right-xs"></text> <text class="cuIcon-refresh padding-right-xs"></text>
付款码自动 （25s） <!-- 付款码自动 （25s） -->
付款码
<text class="oil-main-color"> <text class="oil-main-color">
刷新 刷新
</text> </text>
</text> </text>
</view> </view>
<view class="text-center color-000 font-10 margin-bottom-sm"> <view class="text-center color-000 font-10 margin-bottom-sm" @tap="refreashQr">
提示：司机扫描二维码支付油费 提示：司机扫描二维码支付油费
</view> </view>
<view class="padding font-12 solid-top"> <view class="padding font-12 solid-top">
@ -39,7 +40,10 @@
</view> </view>
<view class="text-right flex-sub oil-main-color"> <view class="text-right flex-sub oil-main-color">
￥1.20 <text v-if="!showData.realPay">
未指定
</text>
<text v-else>￥{{showData.realPay}}</text>
</view> </view>
</view> </view>
<view class="flex padding-left padding-right"> <view class="flex padding-left padding-right">
@ -54,7 +58,10 @@
<text class="text-right flex-sub"> <text class="text-right flex-sub">
约56.00L <text v-if="!showData.vol">
未指定
</text>
<text v-else>{{showData.vol}}L</text>
</text> </text>
</view> </view>
</view> </view>
@ -74,7 +81,7 @@
</view> </view>
</view> </view>
<view class="text-left padding-bottom padding-top-0 bg-white"> <view class="text-left padding-bottom padding-top-0 bg-white">
<OrderOilForm /> <OrderOilForm @confirmVol="getDesignatedQr" :oilList="oilList" />
</view> </view>
</view> </view>
</view> </view>
@ -85,7 +92,7 @@
import OrderOilForm from '@/components/OrderOil.vue' import OrderOilForm from '@/components/OrderOil.vue'
// 引入二维码库 // 引入二维码库
import QR from "@/utils/wxqrcode.js" // 二维码生成器 import QR from "@/utils/wxqrcode.js" // 二维码生成器
import cloudSiteApi from '@/api/cloud-site.js'
import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue" import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue"
export default { export default {
@ -95,19 +102,81 @@
}, },
data() { data() {
return { return {
oilList: [],
modalName: 'mod', modalName: 'mod',
oilSiteName: '', oilSiteName: '',
qrImg: "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1102530589,2787379918&fm=11&gp=0.jpg", qrImg: "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1102530589,2787379918&fm=11&gp=0.jpg",
val: '羊的屎是猪', val: '',
iconUrl: '../../static/img/qr-icon.png' iconUrl: '../../static/img/qr-icon.png',
oilDate: {
oilSiteCode: uni.getStorageSync('oilSite').oilSiteCode,
oilSiteName: uni.getStorageSync('oilSite').oilSiteName,
oilCode: '',
oilName: '',
gunId: '',
standardPrice: '',
oilPrice: '',
vol: ''
},
showData: {
vol: '',
realPay: ''
}
} }
}, },
onLoad() { onLoad() {
this.oilSiteName = uni.getStorageSync('oilSiteName') this.oilSiteName = uni.getStorageSync('oilSiteName')
this.getDefaultQr()
this.getSiteInfo()
// this.getDesignatedQr/()
console.log('oilDate', this.oilDate)
}, },
methods: { methods: {
// 刷新
refreashQr() {
console.log('刷新函数')
if (this.showData.vol) {
this.getDesignatedQr()
} else {
this.getDefaultQr()
}
},
getSiteInfo() {
cloudSiteApi.getSiteDetail().then(res => {
console.log('...', res)
if (res.code === 20000) {
this.site = res.data.site
this.oilList = res.data.oil
uni.setStorage({
key: 'oilSite',
data: res.data.site
})
}
})
},
getDefaultQr() {
cloudSiteApi.getSiteQrCode().then(res => {
if (res.code === 20000) {
this.val = res.data
}
})
},
getDesignatedQr(data) {
const data6 = {
...this.oilDate,
...data
}
this.showData = data
cloudSiteApi.getDesignatedSiteQrCode(data6).then(res => {
if (res.code === 20000) {
this.val = res.data
this.hideModal()
}
})
},
hideModal() { hideModal() {
console.log('关闭呀')
this.modalName = '' this.modalName = ''
}, },
qrR() { qrR() {

9
utils/request.js
Unescape View File

@ -73,8 +73,15 @@ service.interceptors.response.use(
icon: "none" icon: "none"
}) })
if(res.code===42011){ if(res.code===42011){
console.log(res.code)
uni.navigateTo({ uni.navigateTo({
url:'/pages/login/login.vue' url:'/pages/login/login',
success: () => {
console.log('跳转成功')
},
fail: (err) => {
console.log(err)
}
}) })
} }
} }

Write Preview
Loading…
Cancel
Save