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

更新

Browse Source
pull/2/head
xiaozhiyong 2 years ago
parent ee6ebb71f1
commit 68152e6b42
5 changed files with 349 additions and 324 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 152
      src/api/oil-order.js
  2. 41
      src/permission.js
  3. 5
      src/store/piniaIndex.js
  4. 10
      src/utils/request.js
  5. 465
      src/views/cashier/cashierIndex.vue

152
src/api/oil-order.js
Unescape View File

@ -1,80 +1,80 @@
import request from '@/utils/request'
const service_name = "oil-site"
const group_name = "oilSiteOrderInfo"
const service_name = 'oil-site'
const group_name = 'oilSiteOrderInfo'
const Img_name = 'oil-interfaces'
export default {
// 下单
createOrder(data) {
return request({
url: `/oil-site/oilSiteOrderInfo/createH5Order`,
method: 'post',
data: data
})
},
// 主动支付
payOrder(data) {
return request({
url: `/${service_name}/${group_name}/payOrder`,
method: 'post',
data: data
})
},
aggregatePay(data) {
return request({
url: `/${service_name}/${group_name}/aggregatePay`,
method: 'post',
data: data
})
},
getOrderInfoByPage(data) {
return request({
url: `/${service_name}/${group_name}/getOrderInfoByPage`,
method: 'post',
data: data
})
},
getOrderPayInfo(id) {
return request({
url: `/${service_name}/${group_name}/getOrderPayInfoH5/${id}`,
method: 'get'
})
},
cancelOrder(id) {
return request({
url: `/${service_name}/${group_name}/cancelOrder/${id}`,
method: 'get'
})
},
delOrder(id) {
return request({
url: `/${service_name}/${group_name}/delOrder/${id}`,
method: 'get'
})
},
selOrder(id) {
return request({
url: `/${service_name}/${group_name}/selOrder/${id}`,
method: 'get'
})
},
//尿素站订单接口
findXoiUreaPage(data) {
return request({
url: `/oil-finance/xoilUreaOrder/findXoiUreaPage`,
method: 'post',
data: data
})
},
findOneByOrderId(id) {
return request({
url: `/oil-finance/xoilUreaOrder/findOneByOrderId?orderId=${id}`,
method: 'get'
})
},
queryBarrelOrderDetails(id) {
return request({
url: `/oil-finance/xoilUreaOrderRelation/queryBarrelOrderDetails?orderId=${id}`,
method: 'get'
})
},
// 下单
createOrder(data) {
return request({
url: `/oil-site/oilSiteOrderInfo/createOrder`,
method: 'post',
data: data
})
},
// 主动支付
payOrder(data) {
return request({
url: `/${service_name}/${group_name}/payOrder`,
method: 'post',
data: data
})
},
aggregatePay(data) {
return request({
url: `/${service_name}/${group_name}/aggregatePay`,
method: 'post',
data: data
})
},
getOrderInfoByPage(data) {
return request({
url: `/${service_name}/${group_name}/getOrderInfoByPage`,
method: 'post',
data: data
})
},
getOrderPayInfo(id) {
return request({
url: `/${service_name}/${group_name}/getOrderPayInfo/${id}`,
method: 'get'
})
},
cancelOrder(id) {
return request({
url: `/${service_name}/${group_name}/cancelOrder/${id}`,
method: 'get'
})
},
delOrder(id) {
return request({
url: `/${service_name}/${group_name}/delOrder/${id}`,
method: 'get'
})
},
selOrder(id) {
return request({
url: `/${service_name}/${group_name}/selOrder/${id}`,
method: 'get'
})
},
//尿素站订单接口
findXoiUreaPage(data) {
return request({
url: `/oil-finance/xoilUreaOrder/findXoiUreaPage`,
method: 'post',
data: data
})
},
findOneByOrderId(id) {
return request({
url: `/oil-finance/xoilUreaOrder/findOneByOrderId?orderId=${id}`,
method: 'get'
})
},
queryBarrelOrderDetails(id) {
return request({
url: `/oil-finance/xoilUreaOrderRelation/queryBarrelOrderDetails?orderId=${id}`,
method: 'get'
})
}
}

41
src/permission.js
Unescape View File

@ -3,7 +3,7 @@ import useStore from './store/piniaIndex'
import { obtainUrlPathParameterTarget } from '@/utils/index.js'
import { getToken, removeToken } from '@/utils/auth'
import { setToken, getToken, removeToken } from '@/utils/auth'
import { Notify } from 'vant'
let whiteList = ['/home']
@ -16,17 +16,25 @@ router.beforeEach(async (to, from, next) => {
// removeToken()
!whiteList.includes(to.path) && store.getPosition()
// store.login({ username: '15098826302', networkId: '1522478429548756992' })
if (!token) {
// let paramsTarget = obtainUrlPathParameterTarget(location.href)
// sessionStorage.setItem('paramsTarget', JSON.stringify(paramsTarget))
// store.login(paramsTarget).then(
// () => {
// next()
// },
// () => {
// Notify('登陆失败，请退出重试')
// }
// )
let paramsTarget = obtainUrlPathParameterTarget(location.href)
sessionStorage.setItem('paramsTarget', JSON.stringify(paramsTarget))
store.login(paramsTarget).then(
() => {
next()
},
() => {
Notify('登陆失败，请退出重试')
}
)
if (paramsTarget.token) {
setToken(paramsTarget.token)
store.getUser()
next()
} else Notify('登陆失败，请退出重试')
return
}
@ -40,12 +48,13 @@ router.beforeEach(async (to, from, next) => {
// }
// }
//拦截 如果不是去首页 还没有token直接去首页
if (to.path !== '/' && !token) {
Notify('请检查登陆状态')
next({ path: '/' })
} else {
next()
}
// if (to.path !== '/home' && !token) {
// Notify('请检查登陆状态')
// next({ path: '/' })
// } else {
// }
next()
}, 0)
})

5
src/store/piniaIndex.js
Unescape View File

@ -119,13 +119,14 @@ const instance = defineStore('user', {
})
.then(res => {
if (res.code === 20000) {
setToken(res.data.accessToken)
this.getUser()
// setToken(res.data.accessToken)
// this.getUser()
}
})
}
return Promise.reject()
},
clearToken() {
removeToken()
}

10
src/utils/request.js
Unescape View File

@ -63,8 +63,14 @@ service.interceptors.response.use(
// let paramsTargetJson = sessionStorage.getItem('paramsTarget')
// let paramsTarget = JSON.parse(paramsTargetJson)
// instance.login(paramsTarget).then(location.reload())
removeToken()
location.reload()
// removeToken()
// location.reload()
Notify({
message: '登陆失败，请退出重试',
onClose: () => {
removeToken()
}
})
return
}
if (![20000].includes(res.code)) {

465
src/views/cashier/cashierIndex.vue
Unescape View File

@ -1,297 +1,306 @@
<template>
<div class="cashier">
<div class="payment-time">
<div class="payment-number">￥{{Number(orderData.realAmount).toFixed(2)}}</div>
<div v-if="time!==0" class="time flex jc ac">
支付时间剩余：
<van-count-down style="color:#999999" format="mm:ss" :time="time" />
</div>
<div style="color:#fe0505" class="time" v-else>
支付已过期
</div>
</div>
<div class="payment-method">
<div @click="cardIndex = index" v-for="(item, index) in cardList" :key="index" class="payment-method-item flex bw ac">
<span>企业{{item.cardType?'外请':'自营'}}油卡支付（余额：{{item.balance?item.balance:0}}）</span>
<van-icon :color="cardIndex==index? '#ff6700' : '#C9C7C7' " name="success" />
</div>
</div>
<detailsCard :title="'请提醒加油员使用 <span>“星油云站”</span> 进行订单核实'" :detailsList='detailsList'>
</detailsCard>
<div @click="goplay" :class="time==0?'debgcolor': '' " class="payment-footer flex ac jc">立即支付</div>
<div class="cashier">
<div class="payment-time">
<div class="payment-number">￥{{ Number(orderData.realAmount).toFixed(2) }}</div>
<div v-if="time !== 0" class="time flex jc ac">
支付时间剩余：
<van-count-down style="color: #999999" format="mm:ss" :time="time" />
</div>
<div style="color: #fe0505" class="time" v-else>支付已过期</div>
</div>
<div class="payment-method">
<div @click="cardIndex = index" v-for="(item, index) in cardList" :key="index" class="payment-method-item flex bw ac">
<span>企业{{ item.cardType ? '外请' : '自营' }}油卡支付（余额：{{ item.balance ? item.balance : 0 }}）</span>
<van-icon :color="cardIndex == index ? '#ff6700' : '#C9C7C7'" name="success" />
</div>
</div>
<detailsCard :title="'请提醒加油员使用 <span>“星油云站”</span> 进行订单核实'" :detailsList="detailsList"> </detailsCard>
<div @click="goplay" :class="time == 0 ? 'debgcolor' : ''" class="payment-footer flex ac jc">立即支付</div>
</div>
</template>
<script>
import detailsCard from './components/detailsCard.vue'
import oilOrderApi from '@/api/oil-order.js'
export default {
components: {
detailsCard
components: {
detailsCard
},
data() {
return {
cardIndex: 0,
cardList: [],
time: 600000,
orderData: null,
detailsCardTitle: {},
detailsList: [
[
{
lable: '订单编号：',
value: '0101001001',
valueStyle: {
color: ''
}
}
],
[
{
lable: '油站：',
value: '壳牌加油站'
},
{
lable: '油品油枪：',
value: '0# 1号枪'
},
{
lable: '加油升数：',
value: '100L'
}
],
[
{
lable: '加油金额：',
value: '￥581.00'
},
{
lable: '星油优惠：',
value: '-￥0.00',
valueStyle: {
color: '#FF0000'
}
},
{
lable: '优惠券：',
value: '-￥1.00',
valueStyle: {
color: '#FF0000'
}
}
],
[
{
lable: '合计：',
value: '-￥1.00',
valueStyle: {
color: '#FF0000'
}
}
]
]
}
},
created() {
this.orderData = JSON.parse(this.$route.query.order)
console.log('this.orderData', this.orderData)
this.time = this.getCountDownTime(this.orderData.createTime)
this.updateDetails()
this.cardListFn()
},
methods: {
cardListFn() {
let a = this.orderData.companyAccounts
? this.orderData.companyAccounts.map(item => {
item['cardType'] = 0
return item
})
: []
let b = this.orderData.otherAccounts
? this.orderData.otherAccounts.map(item => {
item['cardType'] = 1
return item
})
: []
this.cardList = [...a, ...b]
},
data() {
return {
cardIndex:0,
cardList:[],
time: 600000,
orderData:null,
detailsCardTitle: {},
detailsList: [
[
{
lable: '订单编号：',
value: '0101001001',
valueStyle: {
color: ''
}
},
],
[
{
lable: '油站：',
value: '壳牌加油站'
},
{
lable: '油品油枪：',
value: '0# 1号枪'
},
{
lable: '加油升数：',
value: '100L'
},
],
[
{
lable: '加油金额：',
value: '￥581.00'
},
{
lable: '星油优惠：',
value: '-￥0.00',
valueStyle: {
color: '#FF0000'
}
},
{
lable: '优惠券：',
value: '-￥1.00',
valueStyle: {
color: '#FF0000'
}
},
],
[
{
lable: '合计：',
value: '-￥1.00',
valueStyle: {
color: '#FF0000'
}
},
]
]
}
updateDetails() {
this.detailsList[0][0].value = this.orderData.orderSerialNumber || '暂无数据'
this.detailsList[1][0].value = this.orderData.siteName || '暂无数据'
this.detailsList[1][1].value = this.orderData.oilsCode + ' ' + this.orderData.oilsBar + '号枪' || '暂无数据'
this.detailsList[1][2].value = Number(this.orderData.volume).toFixed(2) + 'L' || '暂无数据'
this.detailsList[2][0].value =
'￥' + Number(this.orderData.xoilAmountGun).toFixed(2) || '￥' + Number(this.orderData.baseRealPriceAmount).toFixed(2) || '暂无数据'
this.detailsList[2][1].value =
'-￥' + Number(this.orderData.oilDiscountAmount).toFixed(2) || '-￥' + Number(this.orderData.discountAmount).toFixed(2) || '暂无数据'
this.detailsList[2][2].value = '-￥' + Number(this.orderData.couponDiscountAmount).toFixed(2) || '暂无数据'
this.detailsList[3][0].value = '￥' + Number(this.orderData.realAmount).toFixed(2) || '暂无数据'
},
created(){
this.orderData = JSON.parse(this.$route.query.order);
this.time = this.getCountDownTime(this.orderData.createTime);
this.updateDetails();
this.cardListFn();
},
methods:{
cardListFn(){
let a = this.orderData.companyAccounts?this.orderData.companyAccounts.map(item=>{item['cardType'] = 0;return item}):[];
let b = this.orderData.otherAccounts?this.orderData.otherAccounts.map(item=>{item['cardType'] = 1;return item}):[];
this.cardList = [...a,...b];
},
updateDetails(){
this.detailsList[0][0].value = this.orderData.orderSerialNumber||'暂无数据';
this.detailsList[1][0].value = this.orderData.siteName||'暂无数据';
this.detailsList[1][1].value = this.orderData.oilsCode + ' '+ this.orderData.oilsBar+'号枪' ||'暂无数据';
this.detailsList[1][2].value = Number(this.orderData.volume).toFixed(2) + 'L'||'暂无数据';
this.detailsList[2][0].value = '￥'+Number(this.orderData.xoilAmountGun).toFixed(2)|| '￥'+Number(this.orderData.baseRealPriceAmount).toFixed(2)||'暂无数据';
this.detailsList[2][1].value = '-￥'+Number(this.orderData.oilDiscountAmount).toFixed(2)||'-￥'+ Number(this.orderData.discountAmount).toFixed(2)||'暂无数据';
this.detailsList[2][2].value = '-￥'+Number(this.orderData.couponDiscountAmount).toFixed(2)||'暂无数据';
this.detailsList[3][0].value = '￥'+Number(this.orderData.realAmount).toFixed(2)||'暂无数据';
},
getCountDownTime(e){
let createTime = new Date(e);
let nowTime = new Date();
let difference = Date.parse(nowTime)- Date.parse(createTime);
let a = 600000;
return difference>a?0:a-difference
},
async goplay(){
if(!this.time) {
this.$notify('支付已过期')
return
}
let payData = {
...this.cardList[this.cardIndex],
"orderSerialNumber": this.orderData.orderSerialNumber, //类型：String 必有字段 备注：订单编号
"payChannel": "BALANCE_PAYMENT", //类型：String 必有字段 备注：支付渠道（BALANCE_PAYMENT：余额支付）
"orderMethod": "CUSTOMER_ACTIVE", //类型：String 必有字段 备注：订单产生方式（CUSTOMER_ACTIVE：客户扫码支付：客户扫描油站二维码完成支付）
"createSource": "XOIL_DRIVER_COMPANY_WECHAT_APPLET",
oilCardType:-1
}
let orderType = false
oilOrderApi.payOrder(payData).then(res=>{
if(res.code==20000){
orderType = true
}
}).finally((e)=>{
this.$router.push({
name:'paymentl',
query:{
orderData:JSON.stringify(this.orderData),
type:JSON.stringify(orderType)
}
})
})
}
getCountDownTime(e) {
let createTime = new Date(e)
let nowTime = new Date()
let difference = Date.parse(nowTime) - Date.parse(createTime)
let a = 600000
return difference > a ? 0 : a - difference
},
async goplay() {
if (!this.time) {
this.$notify('支付已过期')
return
}
let payData = {
...this.cardList[this.cardIndex],
orderSerialNumber: this.orderData.orderSerialNumber, //类型：String 必有字段 备注：订单编号
payChannel: 'BALANCE_PAYMENT', //类型：String 必有字段 备注：支付渠道（BALANCE_PAYMENT：余额支付）
orderMethod: 'CUSTOMER_ACTIVE', //类型：String 必有字段 备注：订单产生方式（CUSTOMER_ACTIVE：客户扫码支付：客户扫描油站二维码完成支付）
createSource: 'XOIL_DRIVER_COMPANY_WECHAT_APPLET',
oilCardType: -1
}
let orderType = false
oilOrderApi
.payOrder(payData)
.then(res => {
if (res.code == 20000) {
orderType = true
}
})
.finally(e => {
this.$router.push({
name: 'paymentl',
query: {
orderData: JSON.stringify(this.orderData),
type: JSON.stringify(orderType)
}
})
})
}
};
}
}
</script>
<style scoped>
.debgcolor{
background-color: #999999 !important;
.debgcolor {
background-color: #999999 !important;
}
.payment-time {
margin-top: 50px;
margin-top: 50px;
}
.payment-details-item-row-lable {
color: #999999;
color: #999999;
}
.payment-details-item-row {
margin-top: 10px;
margin-top: 10px;
}
.payment-details-item:first-child {
margin-top: 0q;
margin-top: 0Q;
}
.payment-details-item:last-child {
border-bottom: dashed 0px #B9B9B9;
border-bottom: dashed 0px #b9b9b9;
}
.payment-details-item {
box-sizing: border-box;
border-bottom: dashed 1px #B9B9B9;
padding-bottom: 20px;
margin-top: 20px;
box-sizing: border-box;
border-bottom: dashed 1px #b9b9b9;
padding-bottom: 20px;
margin-top: 20px;
}
.payment-details-container {
width: 100%;
margin-top: 30px;
padding: 0 20px;
box-sizing: border-box;
width: 100%;
margin-top: 30px;
padding: 0 20px;
box-sizing: border-box;
}
.payment-details-title span {
color: #FF6700;
color: #ff6700;
}
.payment-details-title {
width: 690px;
height: 82px;
background: #F6F6F6;
box-shadow: 5px 5px 0px 1px rgba(0, 0, 0, 0.0118);
border-radius: 10px 10px 0px 0px;
opacity: 1;
font-size: 28px;
font-family: PingFang SC-中等, PingFang SC;
font-weight: normal;
color: #333333;
width: 690px;
height: 82px;
background: #f6f6f6;
box-shadow: 5px 5px 0px 1px rgba(0, 0, 0, 0.0118);
border-radius: 10px 10px 0px 0px;
opacity: 1;
font-size: 28px;
font-family: PingFang SC-中等, PingFang SC;
font-weight: normal;
color: #333333;
}
.payment-method-item:last-child {
border-bottom: 0px #f1f2f7;
padding-bottom: 0px;
border-bottom: 0px #f1f2f7;
padding-bottom: 0px;
}
.payment-method-item:first-child {
margin-top: 0px;
margin-top: 0px;
}
.payment-method-item {
text-align: left;
border-bottom: solid 2px #f1f2f7;
padding-bottom: 20px;
margin-top: 30px;
text-align: left;
border-bottom: solid 2px #f1f2f7;
padding-bottom: 20px;
margin-top: 30px;
color: #333333;
font-size: 28px;
color: #333333;
font-size: 28px;
}
.time {
font-size: 24px;
font-family: PingFang SC-中等, PingFang SC;
font-weight: normal;
color: #999999;
font-size: 24px;
font-family: PingFang SC-中等, PingFang SC;
font-weight: normal;
color: #999999;
}
.payment-number {
font-size: 48px;
font-family: PingFang SC-粗体, PingFang SC;
font-weight: normal;
color: #fe0505;
font-size: 48px;
font-family: PingFang SC-粗体, PingFang SC;
font-weight: normal;
color: #fe0505;
}
.payment-footer {
width: 690px;
height: 100px;
background: #ff6700;
border-radius: 5px 5px 5px 5px;
opacity: 1;
position: fixed;
bottom: 20px;
left: 0;
right: 0;
margin: 0 auto;
color: #ffffff;
font-size: 38px;
box-sizing: border-box;
width: 690px;
height: 100px;
background: #ff6700;
border-radius: 5px 5px 5px 5px;
opacity: 1;
position: fixed;
bottom: 20px;
left: 0;
right: 0;
margin: 0 auto;
color: #ffffff;
font-size: 38px;
box-sizing: border-box;
}
.payment-method {
width: 690px;
/* min-height: 346px; */
background: #ffffff;
box-shadow: 0px 3px 10px 1px rgba(221, 221, 221, 0.502);
border-radius: 10px 10px 10px 10px;
opacity: 1;
margin: 0 auto;
margin-top: 45px;
padding: 45px;
box-sizing: border-box;
width: 690px;
/* min-height: 346px; */
background: #ffffff;
box-shadow: 0px 3px 10px 1px rgba(221, 221, 221, 0.502);
border-radius: 10px 10px 10px 10px;
opacity: 1;
margin: 0 auto;
margin-top: 45px;
padding: 45px;
box-sizing: border-box;
}
.payment-details {
width: 690px;
background: #ffffff;
box-shadow: 0px 3px 10px 1px rgba(221, 221, 221, 0.502);
border-radius: 10px 10px 10px 10px;
opacity: 1;
margin: 0 auto;
margin-top: 39px;
margin-bottom: 150px;
width: 690px;
background: #ffffff;
box-shadow: 0px 3px 10px 1px rgba(221, 221, 221, 0.502);
border-radius: 10px 10px 10px 10px;
opacity: 1;
margin: 0 auto;
margin-top: 39px;
margin-bottom: 150px;
}
.cashier {
position: relative;
/* padding-bottom: 80px; */
font-size: 28px;
height: 100%;
overflow: auto;
position: relative;
/* padding-bottom: 80px; */
font-size: 28px;
height: 100%;
overflow: auto;
}
</style>
</style>

Write Preview
Loading…
Cancel
Save