xiaozy #2
@@ -17,3 +17,4 @@ VUE_APP_ENV = 'development'
|
||||
|
||||
|
||||
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||
# http://192.168.1.86:9528/h5/#/home?token=0fbdf930-21b8-47f6-be6e-fc9c65045424
|
||||
46
package-lock.json
generated
46
package-lock.json
generated
@@ -23,6 +23,7 @@
|
||||
"px2rem-loader": "^0.1.9",
|
||||
"qs": "^6.11.1",
|
||||
"vant": "^2.12.48",
|
||||
"vconsole": "^3.15.0",
|
||||
"vue": "^2.6.14",
|
||||
"vue-qr": "^4.0.9",
|
||||
"vue-router": "^3.5.1",
|
||||
@@ -4236,6 +4237,14 @@
|
||||
"integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/copy-text-to-clipboard": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/copy-text-to-clipboard/-/copy-text-to-clipboard-3.1.0.tgz",
|
||||
"integrity": "sha512-PFM6BnjLnOON/lB3ta/Jg7Ywsv+l9kQGD4TWDCSlRBGmqnnTM5MrDkhAFgw+8HZt0wW6Q2BBE4cmy9sq+s9Qng==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/copy-webpack-plugin": {
|
||||
"version": "9.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/copy-webpack-plugin/-/copy-webpack-plugin-9.1.0.tgz",
|
||||
@@ -7595,6 +7604,11 @@
|
||||
"multicast-dns": "cli.js"
|
||||
}
|
||||
},
|
||||
"node_modules/mutation-observer": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmmirror.com/mutation-observer/-/mutation-observer-1.0.3.tgz",
|
||||
"integrity": "sha512-M/O/4rF2h776hV7qGMZUH3utZLO/jK7p8rnNgGkjKUw8zCGjRQPxB8z6+5l8+VjRUQ3dNYu4vjqXYLr+U8ZVNA=="
|
||||
},
|
||||
"node_modules/mz": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmmirror.com/mz/-/mz-2.7.0.tgz",
|
||||
@@ -10654,6 +10668,17 @@
|
||||
"node": ">= 0.8"
|
||||
}
|
||||
},
|
||||
"node_modules/vconsole": {
|
||||
"version": "3.15.0",
|
||||
"resolved": "https://registry.npmmirror.com/vconsole/-/vconsole-3.15.0.tgz",
|
||||
"integrity": "sha512-8hq7wabPcRucSWQyN7/1tthMawP9JPvM95zgtMHpPknMMMCKj+abpoK7P7oKK4B0qw58C24Mdvo9+raUdpHyVQ==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.17.2",
|
||||
"copy-text-to-clipboard": "^3.0.1",
|
||||
"core-js": "^3.11.0",
|
||||
"mutation-observer": "^1.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/vue": {
|
||||
"version": "2.7.5",
|
||||
"resolved": "https://registry.npmmirror.com/vue/-/vue-2.7.5.tgz",
|
||||
@@ -14913,6 +14938,11 @@
|
||||
"integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==",
|
||||
"dev": true
|
||||
},
|
||||
"copy-text-to-clipboard": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/copy-text-to-clipboard/-/copy-text-to-clipboard-3.1.0.tgz",
|
||||
"integrity": "sha512-PFM6BnjLnOON/lB3ta/Jg7Ywsv+l9kQGD4TWDCSlRBGmqnnTM5MrDkhAFgw+8HZt0wW6Q2BBE4cmy9sq+s9Qng=="
|
||||
},
|
||||
"copy-webpack-plugin": {
|
||||
"version": "9.1.0",
|
||||
"resolved": "https://registry.npmmirror.com/copy-webpack-plugin/-/copy-webpack-plugin-9.1.0.tgz",
|
||||
@@ -17571,6 +17601,11 @@
|
||||
"thunky": "^1.0.2"
|
||||
}
|
||||
},
|
||||
"mutation-observer": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmmirror.com/mutation-observer/-/mutation-observer-1.0.3.tgz",
|
||||
"integrity": "sha512-M/O/4rF2h776hV7qGMZUH3utZLO/jK7p8rnNgGkjKUw8zCGjRQPxB8z6+5l8+VjRUQ3dNYu4vjqXYLr+U8ZVNA=="
|
||||
},
|
||||
"mz": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmmirror.com/mz/-/mz-2.7.0.tgz",
|
||||
@@ -19925,6 +19960,17 @@
|
||||
"integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
|
||||
"dev": true
|
||||
},
|
||||
"vconsole": {
|
||||
"version": "3.15.0",
|
||||
"resolved": "https://registry.npmmirror.com/vconsole/-/vconsole-3.15.0.tgz",
|
||||
"integrity": "sha512-8hq7wabPcRucSWQyN7/1tthMawP9JPvM95zgtMHpPknMMMCKj+abpoK7P7oKK4B0qw58C24Mdvo9+raUdpHyVQ==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.17.2",
|
||||
"copy-text-to-clipboard": "^3.0.1",
|
||||
"core-js": "^3.11.0",
|
||||
"mutation-observer": "^1.0.3"
|
||||
}
|
||||
},
|
||||
"vue": {
|
||||
"version": "2.7.5",
|
||||
"resolved": "https://registry.npmmirror.com/vue/-/vue-2.7.5.tgz",
|
||||
|
||||
@@ -34,6 +34,7 @@
|
||||
"px2rem-loader": "^0.1.9",
|
||||
"qs": "^6.11.1",
|
||||
"vant": "^2.12.48",
|
||||
"vconsole": "^3.15.0",
|
||||
"vue": "^2.6.14",
|
||||
"vue-qr": "^4.0.9",
|
||||
"vue-router": "^3.5.1",
|
||||
|
||||
@@ -30,9 +30,3 @@
|
||||
event.preventDefault()
|
||||
})
|
||||
</script>
|
||||
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.9.0/vconsole.min.js"></script>
|
||||
<script>
|
||||
var vConsole = new VConsole()
|
||||
console.log('Hello world')
|
||||
</script>
|
||||
|
||||
51
src/App.vue
51
src/App.vue
@@ -1,20 +1,26 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<van-nav-bar v-if="!$route.meta?.closeNavBar"
|
||||
style="background-color: #ff6700 !important;color: #ffffff !important;" :title="navData.meta.title"
|
||||
:border="false" :left-arrow="navData.path == '/' ? false : true" @click-left="onClickLeft"
|
||||
@click-right="onClickRight" />
|
||||
<van-nav-bar
|
||||
v-if="!$route.meta?.closeNavBar"
|
||||
style="background-color: #ff6700 !important; color: #ffffff !important"
|
||||
:title="navData.meta.title"
|
||||
:border="false"
|
||||
:left-arrow="navData.path == '/' ? false : true"
|
||||
@click-left="onClickLeft"
|
||||
@click-right="onClickRight"
|
||||
/>
|
||||
<transition :name="silderName">
|
||||
<keep-alive :include="['HomeView']" >
|
||||
<router-view :style="{ height: navData.path == '/' ? '' : 'calc(100vh - 46px)' }" class="routerView" ></router-view>
|
||||
<keep-alive :include="['HomeView']">
|
||||
<router-view :style="{ height: navData.path == '/' ? '' : 'calc(100vh - 46px)' }" class="routerView"></router-view>
|
||||
</keep-alive>
|
||||
</transition>
|
||||
<!-- <transition :name="silderName">
|
||||
<!-- <transition :name="silderName">
|
||||
<router-view :style="{ height: navData.path == '/' ? '' : 'calc(100vh - 46px)' }" class="routerView"></router-view>
|
||||
</transition> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import encode from 'utils/encode.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@@ -28,37 +34,42 @@ export default {
|
||||
msg: process.env.VUE_APP_ENV
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
// created() {
|
||||
// console.log(
|
||||
// encode.encrypt(
|
||||
// JSON.stringify({
|
||||
// phone: '15098877777',
|
||||
// companyId: '1644149961976160256'
|
||||
// })
|
||||
// )
|
||||
// )
|
||||
// console.log(encode.decrypt('PS3WM/yuXTO39U3trxsIv3MR6bQet5PgwiSo/BpGoEC7oQ4a8dtxItMPtba5ho/O5xU3x2NsNr4H6OkELDRKFxDn9OsDQq7CsMXiu/MUMKw='))
|
||||
// },
|
||||
mounted() {},
|
||||
watch: {
|
||||
$route: function (t, f) {
|
||||
this.navData = t
|
||||
if (t.meta.index > f.meta.index) {
|
||||
this.silderName = 'slide-right';
|
||||
|
||||
this.silderName = 'slide-right'
|
||||
} else {
|
||||
this.silderName = 'slide-left';
|
||||
this.silderName = 'slide-left'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
routerBar(){
|
||||
|
||||
},
|
||||
routerBar() {},
|
||||
onClickLeft() {
|
||||
this.$router.back()
|
||||
// this.$notify('点击返回');
|
||||
},
|
||||
onClickRight() {
|
||||
console.log('点击按钮')
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.sa{
|
||||
.sa {
|
||||
justify-content: space-around;
|
||||
}
|
||||
.bw {
|
||||
|
||||
@@ -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'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@@ -9,6 +9,11 @@ import * as utils from 'utils/index.js'
|
||||
import 'vant/lib/index.css'
|
||||
import '@/assets/iconfont/iconfont.css'
|
||||
import { createPinia, PiniaVuePlugin } from 'pinia'
|
||||
import vConsole from 'vconsole'
|
||||
|
||||
if (process.env.VUE_APP_ENV !== 'production') {
|
||||
new vConsole()
|
||||
}
|
||||
|
||||
Vue.use(PiniaVuePlugin)
|
||||
const pinia = createPinia()
|
||||
|
||||
@@ -3,24 +3,39 @@ 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']
|
||||
|
||||
router.beforeEach(async (to, from, next) => {
|
||||
//pinia挂载顺序问题异步处理路由拦截
|
||||
setTimeout(() => {
|
||||
let store = useStore() //获取状态
|
||||
let token = getToken() //获取cookie
|
||||
// removeToken()
|
||||
// store.getPosition()
|
||||
!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)
|
||||
console.log('paramsTarget', paramsTarget)
|
||||
sessionStorage.setItem('paramsTarget', JSON.stringify(paramsTarget))
|
||||
store.login(paramsTarget).then(() => {
|
||||
if (paramsTarget.token) {
|
||||
// sessionStorage.setItem('h5Token',)
|
||||
setToken(paramsTarget.token)
|
||||
store.getUser()
|
||||
next()
|
||||
})
|
||||
} else Notify('登陆失败，请退出重试')
|
||||
return
|
||||
}
|
||||
|
||||
@@ -34,12 +49,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)
|
||||
})
|
||||
|
||||
|
||||
@@ -47,7 +47,7 @@ const routes = [
|
||||
]
|
||||
|
||||
const router = new VueRouter({
|
||||
mode: 'history',
|
||||
// mode: 'history',
|
||||
base: process.env.BASE_URL,
|
||||
routes
|
||||
})
|
||||
|
||||
@@ -6,8 +6,6 @@ import serve from 'api/login.js'
|
||||
|
||||
import { Notify } from 'vant'
|
||||
|
||||
import encode from '@/utils/encode'
|
||||
|
||||
import initAMap from '@/utils/amap.js'
|
||||
import Vue from 'vue'
|
||||
|
||||
@@ -27,23 +25,21 @@ const instance = defineStore('user', {
|
||||
|
||||
actions: {
|
||||
getPosition() {
|
||||
if (this.position.latitude && this.position.longitude) return
|
||||
initAMap().then(() => {
|
||||
// console.log(3)
|
||||
let AMap = Vue.prototype.$AMap
|
||||
let geolocation = new AMap.Geolocation({
|
||||
// enableHighAccuracy: true // 是否使用高精度定位，默认：true
|
||||
})
|
||||
geolocation.getCurrentPosition(function (status, result) {
|
||||
console.log(2)
|
||||
if (status === 'complete') {
|
||||
let { lat: latitude, lng: longitude } = result.position
|
||||
this.position = { latitude, longitude }
|
||||
console.log('this.position', this.position)
|
||||
} else {
|
||||
}
|
||||
})
|
||||
})
|
||||
return
|
||||
|
||||
if (navigator?.geolocation?.getCurrentPosition) {
|
||||
navigator.geolocation.getCurrentPosition(
|
||||
position => {
|
||||
@@ -51,14 +47,6 @@ const instance = defineStore('user', {
|
||||
let { latitude, longitude } = position.coords
|
||||
this.position = { latitude, longitude }
|
||||
},
|
||||
// function (position) {
|
||||
// console.log('position', position)
|
||||
// // that.$patch(state => {
|
||||
// // ;({ latitude: state.position.latitude, longitude: state.position.longitude } = position.coords)
|
||||
// // localStorage.setItem('position', JSON.stringify(state.position))
|
||||
// // console.log(state.position, position.coords, '检测到地理位置授权')
|
||||
// // })
|
||||
// },
|
||||
error => {
|
||||
console.log('error', error)
|
||||
switch (error.code) {
|
||||
@@ -117,13 +105,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()
|
||||
}
|
||||
|
||||
@@ -1,21 +1,22 @@
|
||||
import Cookies from 'js-cookie'
|
||||
|
||||
const TokenKey = 'Authorization'
|
||||
let tokenKey = 'h5Token'
|
||||
// const TokenKey = 'Authorization'
|
||||
// const NetWorkId = 'networkId'
|
||||
// const UserName = 'username'
|
||||
// const PassWord = 'password'
|
||||
// const Checked = 'checked'
|
||||
|
||||
export function getToken() {
|
||||
return Cookies.get(TokenKey)
|
||||
return sessionStorage.getItem(tokenKey)
|
||||
}
|
||||
|
||||
export function setToken(token) {
|
||||
return Cookies.set(TokenKey, token, { expires: 1 })
|
||||
sessionStorage.setItem(tokenKey, token)
|
||||
}
|
||||
|
||||
export function removeToken() {
|
||||
return Cookies.remove(TokenKey)
|
||||
sessionStorage.removeItem(tokenKey)
|
||||
}
|
||||
|
||||
// export function setNet(networkId) {
|
||||
|
||||
@@ -54,7 +54,7 @@ service.interceptors.response.use(
|
||||
// if (!contentType.includes('application/json')) return res
|
||||
|
||||
if (env === 'production') {
|
||||
res.data = JSON.parse(encode.decrypt(res.data))
|
||||
res.data = res.data ? JSON.parse(encode.decrypt(res.data)) : {}
|
||||
}
|
||||
|
||||
if (res && res.code) {
|
||||
@@ -63,11 +63,17 @@ 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)) {
|
||||
if (![20000, 40000].includes(res.code)) {
|
||||
console.log('code码:' + res.code)
|
||||
Notify({
|
||||
message: res.msg || '操作失败',
|
||||
|
||||
@@ -22,6 +22,8 @@ import oilSiteApi from '@/api/oil-site.js'
|
||||
|
||||
import initAMap from '@/utils/amap.js'
|
||||
|
||||
import { Notify } from 'vant'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
homeNavBar,
|
||||
@@ -125,6 +127,10 @@ export default {
|
||||
return !position?.latitude && !position?.longitude ? true : false
|
||||
},
|
||||
getlist() {
|
||||
if (this.position) {
|
||||
this.obtainData()
|
||||
return
|
||||
}
|
||||
initAMap().then(() => {
|
||||
let AMap = this.$AMap
|
||||
let geolocation = new AMap.Geolocation({
|
||||
@@ -133,36 +139,35 @@ export default {
|
||||
geolocation.getCurrentPosition((status, result) => {
|
||||
if (status === 'complete') {
|
||||
let { lat: latitude, lng: longitude } = result.position
|
||||
|
||||
// this.position = { latitude, longitude }
|
||||
// console.log('this.position', this.position)
|
||||
|
||||
let position = { latitude, longitude }
|
||||
|
||||
this.page.params = Object.assign(this.page.params, position)
|
||||
this.loading = true
|
||||
oilSiteApi
|
||||
.getSiteList(this.page)
|
||||
.then(res => {
|
||||
if (res.code == 20000) {
|
||||
if (res.data.list.length < 10) {
|
||||
this.finished = true
|
||||
}
|
||||
if (this.page.currentPage == 1) {
|
||||
this.list = res.data.list
|
||||
} else {
|
||||
this.list = this.list.concat(res.data.list)
|
||||
}
|
||||
this.loading = false
|
||||
this.refreshing = false
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
this.finished = true
|
||||
})
|
||||
this.position = { latitude, longitude }
|
||||
this.obtainData()
|
||||
} else {
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
obtainData() {
|
||||
this.page.params = Object.assign(this.page.params, this.position)
|
||||
this.loading = true
|
||||
oilSiteApi
|
||||
.getSiteList(this.page)
|
||||
.then(res => {
|
||||
if (res.code == 20000) {
|
||||
if (res.data.list.length < 10) {
|
||||
this.finished = true
|
||||
}
|
||||
if (this.page.currentPage == 1) {
|
||||
this.list = res.data.list
|
||||
} else {
|
||||
this.list = this.list.concat(res.data.list)
|
||||
}
|
||||
this.loading = false
|
||||
this.refreshing = false
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
this.finished = true
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,297 +1,315 @@
|
||||
<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
|
||||
},
|
||||
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);
|
||||
this.time = this.getCountDownTime(this.orderData.createTime);
|
||||
this.updateDetails();
|
||||
this.cardListFn();
|
||||
components: {
|
||||
detailsCard
|
||||
},
|
||||
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)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
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)
|
||||
this.time = this.getCountDownTime(this.orderData.createTime)
|
||||
this.updateDetails()
|
||||
|
||||
this.cardListFn()
|
||||
},
|
||||
methods: {
|
||||
cardListFn() {
|
||||
let networkId = this.$pinia.state.value.user.user?.networkId
|
||||
let company = this.orderData.companyAccounts
|
||||
? this.orderData.companyAccounts
|
||||
.filter(item => {
|
||||
return item.companyId == networkId
|
||||
})
|
||||
.map(item => {
|
||||
item['cardType'] = 0
|
||||
return item
|
||||
})
|
||||
: []
|
||||
let other = this.orderData.otherAccounts
|
||||
? this.orderData.otherAccounts
|
||||
.filter(item => {
|
||||
return item.companyId == networkId
|
||||
})
|
||||
.map(item => {
|
||||
item['cardType'] = 1
|
||||
return item
|
||||
})
|
||||
: []
|
||||
this.cardList = [...company, ...other]
|
||||
},
|
||||
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)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</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>
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
<template>
|
||||
<div class="paymentl">
|
||||
<detailsCardHeader :countTimer='countTimer' :codeTpe="codeTpe" ></detailsCardHeader>
|
||||
<detailsCard :detailsList="detailsList"></detailsCard>
|
||||
<detailsCardHeader :countTimer="countTimer" :codeTpe="codeTpe"></detailsCardHeader>
|
||||
<detailsCard :detailsList="detailsList"></detailsCard>
|
||||
<div @click="goHome" class="paymentl-footer flex ac jc">返回首页</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vueQr from 'vue-qr'
|
||||
import detailsCard from "./components/detailsCard.vue";
|
||||
import detailsCardHeader from "./components/detailsCardHeader.vue";
|
||||
import oilSiteApi from '@/api/oil-site.js';
|
||||
import useStore from '@/store/piniaIndex';
|
||||
let store = useStore();
|
||||
import detailsCard from './components/detailsCard.vue'
|
||||
import detailsCardHeader from './components/detailsCardHeader.vue'
|
||||
import oilSiteApi from '@/api/oil-site.js'
|
||||
import useStore from '@/store/piniaIndex'
|
||||
let store = useStore()
|
||||
export default {
|
||||
components: {
|
||||
detailsCard,
|
||||
@@ -21,13 +21,13 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
user:store.user,
|
||||
countTimer:180,
|
||||
timer:null,
|
||||
codeTpe:{
|
||||
switch:false,
|
||||
codeValue:'',
|
||||
imgType:true
|
||||
user: store.user,
|
||||
countTimer: 180,
|
||||
timer: null,
|
||||
codeTpe: {
|
||||
switch: false,
|
||||
codeValue: '',
|
||||
imgType: true
|
||||
},
|
||||
detailsCardTitle: {},
|
||||
detailsList: [
|
||||
@@ -38,7 +38,7 @@ export default {
|
||||
valueStyle: {
|
||||
color: ''
|
||||
}
|
||||
},
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
@@ -56,7 +56,7 @@ export default {
|
||||
{
|
||||
lable: '加油员：',
|
||||
value: '李某'
|
||||
},
|
||||
}
|
||||
// {
|
||||
// lable: '加油渠道：',
|
||||
// value: '星油 查看三方支付凭证'
|
||||
@@ -81,7 +81,7 @@ export default {
|
||||
valueStyle: {
|
||||
color: '#FF0000'
|
||||
}
|
||||
},
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
@@ -90,73 +90,71 @@ export default {
|
||||
},
|
||||
{
|
||||
lable: '加油司机：',
|
||||
value: (store.user&&store.user.name)||'---',
|
||||
value: (store.user && store.user.name) || '---'
|
||||
},
|
||||
{
|
||||
lable: '油卡性质：',
|
||||
value: '企业油卡',
|
||||
},
|
||||
],
|
||||
|
||||
value: '企业油卡'
|
||||
}
|
||||
]
|
||||
]
|
||||
};
|
||||
},
|
||||
created(){
|
||||
console.log(this.user,'user')
|
||||
this.init()
|
||||
},
|
||||
watch:{
|
||||
countTimer:function(n){
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
init(){
|
||||
created() {
|
||||
// console.log(this.user,'user')
|
||||
this.init()
|
||||
},
|
||||
watch: {
|
||||
countTimer: function (n) {}
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.orderData = JSON.parse(this.$route.query.orderData)
|
||||
this.codeTpe.imgType = JSON.parse(this.$route.query.type)
|
||||
console.log(this.codeTpe.imgType)
|
||||
this.getCode();
|
||||
this.updateDetails();
|
||||
console.log(this.codeTpe)
|
||||
this.getCode()
|
||||
this.updateDetails()
|
||||
},
|
||||
Timekeeping(){
|
||||
Timekeeping() {
|
||||
this.countTimer = 180000
|
||||
this.timer = setInterval(()=>{
|
||||
if(this.countTimer==0){
|
||||
clearInterval(this.timer);
|
||||
this.timer = setInterval(() => {
|
||||
if (this.countTimer == 0) {
|
||||
clearInterval(this.timer)
|
||||
this.getCode()
|
||||
return
|
||||
}
|
||||
this.countTimer-=10;
|
||||
},10)
|
||||
this.countTimer -= 10
|
||||
}, 10)
|
||||
},
|
||||
goHome(){
|
||||
goHome() {
|
||||
this.$router.push('/')
|
||||
},
|
||||
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[1][3].value = this.orderData.siteUserName ;
|
||||
this.detailsList[2][0].value = '￥'+this.orderData.realAmount ;
|
||||
this.detailsList[2][1].value = '￥'+ Number(this.orderData.oilDiscountAmount).toFixed(2) ;
|
||||
this.detailsList[3][0].value = this.orderData.plateNumber ;
|
||||
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[1][3].value = this.orderData.siteUserName
|
||||
this.detailsList[2][0].value = '￥' + this.orderData.realAmount
|
||||
this.detailsList[2][1].value = '￥' + Number(this.orderData.oilDiscountAmount).toFixed(2)
|
||||
this.detailsList[3][0].value = this.orderData.plateNumber
|
||||
// this.detailsList[3][2].value = '￥'+this.orderData.plateNumber ;
|
||||
},
|
||||
getCode(){
|
||||
console.log( this.orderData)
|
||||
oilSiteApi.getOrderQrCode(this.orderData.orderSerialNumber).then(res=>{
|
||||
if(res.code==20000){
|
||||
getCode() {
|
||||
// console.log(this.orderData)
|
||||
oilSiteApi.getOrderQrCode(this.orderData.orderSerialNumber).then(res => {
|
||||
if (res.code == 20000) {
|
||||
this.codeTpe.codeValue = ''
|
||||
this.$nextTick(function(){
|
||||
this.codeTpe.switch = true;
|
||||
this.codeTpe.codeValue = res.data.codeStr;
|
||||
this.Timekeeping()
|
||||
})
|
||||
this.$nextTick(function () {
|
||||
this.codeTpe.switch = true
|
||||
this.codeTpe.codeValue = res.data.codeStr
|
||||
this.Timekeeping()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@@ -188,4 +186,4 @@ export default {
|
||||
color: #333333;
|
||||
margin: 50px auto;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,22 +1,22 @@
|
||||
const { defineConfig } = require('@vue/cli-service')
|
||||
const path = require('path')
|
||||
const port = 9528
|
||||
|
||||
function resolve(dir) {
|
||||
return path.join(__dirname, dir)
|
||||
}
|
||||
module.exports = defineConfig({
|
||||
publicPath: '/h5/',
|
||||
publicPath: '/h5',
|
||||
outputDir: 'dist',
|
||||
assetsDir: './static',
|
||||
transpileDependencies: true,
|
||||
lintOnSave: false,
|
||||
|
||||
devServer: {
|
||||
port: port,
|
||||
port: 9528,
|
||||
// https: true,
|
||||
proxy: {
|
||||
[process.env.VUE_APP_BASE_API]: {
|
||||
// target: `http://192.168.110.230:38080`,
|
||||
// target: `http://192.168.1.83:38080`,
|
||||
// target: `https://www.xingoil.com/adminapi`,
|
||||
target: `http://uat.xingoil.com/adminapi`,
|
||||
changeOrigin: true,
|
||||
|
||||
Reference in New Issue
Block a user