|
@@ -1,5 +1,5 @@
|
|
|
<template>
|
|
|
- <div class="outer">
|
|
|
+ <div class="charge-amount">
|
|
|
<div class="container">
|
|
|
<div class="overview">
|
|
|
<div class="title">会员余额(¥)</div>
|
|
@@ -29,7 +29,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="content">
|
|
|
- <div v-if="showList.length === 0" class="no-img">
|
|
|
+ <div v-if="showList.length=== 0" class="no-img">
|
|
|
<div></div>
|
|
|
<span>无记录</span>
|
|
|
</div>
|
|
@@ -73,6 +73,7 @@
|
|
|
<script>
|
|
|
import ProductList from "../../components/ProductList";
|
|
|
import moment from "moment";
|
|
|
+import { mapGetters } from "vuex";
|
|
|
|
|
|
export default {
|
|
|
head() {
|
|
@@ -90,6 +91,9 @@ export default {
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
|
+ ...mapGetters({
|
|
|
+ userInfo: "authen/userInfo",
|
|
|
+ }),
|
|
|
chargeList() {
|
|
|
return this.allList.filter((ele) => {
|
|
|
return ele.usageType === "+";
|
|
@@ -109,9 +113,9 @@ export default {
|
|
|
components: {
|
|
|
ProductList,
|
|
|
},
|
|
|
- beforeCreate() {},
|
|
|
created() {
|
|
|
this.init();
|
|
|
+ console.log("user.info",this.userInfo)
|
|
|
},
|
|
|
methods: {
|
|
|
async init() {
|
|
@@ -135,8 +139,8 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
- console.log(this.gasolineAmount, this.dieselAmount);
|
|
|
- });
|
|
|
+ }).catch((e)=>{
|
|
|
+ })
|
|
|
|
|
|
// 获取订单
|
|
|
try {
|
|
@@ -151,7 +155,7 @@ export default {
|
|
|
throw new Error(amountData.message);
|
|
|
}
|
|
|
this.allList = amountData.data.map((ele) => {
|
|
|
- ele.createTime = moment(ele.createTime, "MMM DD, YYYY HH:mm:ss A")
|
|
|
+ ele.createTime = moment.parseZone(ele.createTime, "MMM DD, YYYY HH:mm:ss A")
|
|
|
.utc()
|
|
|
.format("YYYY/MM/DD HH:mm:ss");
|
|
|
return ele;
|
|
@@ -171,23 +175,23 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style>
|
|
|
-.outer {
|
|
|
+.charge-amount {
|
|
|
width: 100%;
|
|
|
height: 16.24rem;
|
|
|
background: #ffffff;
|
|
|
}
|
|
|
-.outer .container {
|
|
|
+.charge-amount .container {
|
|
|
width: 6.9rem;
|
|
|
margin: 0 auto;
|
|
|
}
|
|
|
-.outer .container .overview {
|
|
|
+.charge-amount .container .overview {
|
|
|
width: 6.9rem;
|
|
|
height: 2.8rem;
|
|
|
background: url("../../static/point/4_b01_bj@2x.png") no-repeat;
|
|
|
background-size: 100% 100%;
|
|
|
position: relative;
|
|
|
}
|
|
|
-.outer .container .overview .title {
|
|
|
+.charge-amount .container .overview .title {
|
|
|
height: 0.4rem;
|
|
|
font-size: 0.28rem;
|
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
@@ -198,7 +202,7 @@ export default {
|
|
|
left: 0.6rem;
|
|
|
top: 0.3rem;
|
|
|
}
|
|
|
-.outer .container .overview .gasoline {
|
|
|
+.charge-amount .container .overview .gasoline {
|
|
|
height: 0.6rem;
|
|
|
font-size: 0.28rem;
|
|
|
font-family: PingFangSC-Semibold, PingFang SC;
|
|
@@ -210,14 +214,14 @@ export default {
|
|
|
left: 0.6rem;
|
|
|
}
|
|
|
|
|
|
-.outer .container .overview .gasoline span {
|
|
|
+.charge-amount .container .overview .gasoline span {
|
|
|
height: 0.6rem;
|
|
|
font-size: 0.4rem;
|
|
|
font-weight: 600;
|
|
|
line-height: 0.6rem;
|
|
|
}
|
|
|
|
|
|
-.outer .container .overview .diesel {
|
|
|
+.charge-amount .container .overview .diesel {
|
|
|
height: 0.6rem;
|
|
|
font-size: 0.28rem;
|
|
|
font-family: PingFangSC-Semibold, PingFang SC;
|
|
@@ -228,14 +232,14 @@ export default {
|
|
|
top: 1.75rem;
|
|
|
left: 0.6rem;
|
|
|
}
|
|
|
-.outer .container .overview .diesel span {
|
|
|
+.charge-amount .container .overview .diesel span {
|
|
|
height: 0.6rem;
|
|
|
font-size: 0.4rem;
|
|
|
font-weight: 600;
|
|
|
line-height: 0.6rem;
|
|
|
}
|
|
|
|
|
|
-.outer .container .overview .pay {
|
|
|
+.charge-amount .container .overview .pay {
|
|
|
width: 1.56rem;
|
|
|
height: 0.6rem;
|
|
|
border-radius: 0.39rem;
|
|
@@ -247,7 +251,7 @@ export default {
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
-.outer .container .overview .pay .icon {
|
|
|
+.charge-amount .container .overview .pay .icon {
|
|
|
width: 0.3rem;
|
|
|
height: 0.3rem;
|
|
|
background: #ffffff;
|
|
@@ -256,9 +260,8 @@ export default {
|
|
|
background-size: cover;
|
|
|
}
|
|
|
|
|
|
-.outer .container .overview .pay .text {
|
|
|
+.charge-amount .container .overview .pay .text {
|
|
|
display: inline-block;
|
|
|
- width: 0.56rem;
|
|
|
height: 0.6rem;
|
|
|
font-size: 0.28rem;
|
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
@@ -268,7 +271,7 @@ export default {
|
|
|
margin-left: 0.2rem;
|
|
|
}
|
|
|
|
|
|
-.outer .container .detail {
|
|
|
+.charge-amount .container .detail {
|
|
|
width: 100%;
|
|
|
height: 1.17rem;
|
|
|
display: flex;
|
|
@@ -276,7 +279,7 @@ export default {
|
|
|
border-bottom: 0.01rem solid #e0e0e0;
|
|
|
}
|
|
|
|
|
|
-.outer .container .detail .title {
|
|
|
+.charge-amount .container .detail .title {
|
|
|
width: 1.28rem;
|
|
|
height: 1.17rem;
|
|
|
font-size: 0.32rem;
|
|
@@ -285,7 +288,7 @@ export default {
|
|
|
color: #000000;
|
|
|
line-height: 1.17rem;
|
|
|
}
|
|
|
-.outer .container .detail .part {
|
|
|
+.charge-amount .container .detail .part {
|
|
|
display: flex;
|
|
|
width: 3.2rem;
|
|
|
height: 1.13rem;
|
|
@@ -293,7 +296,7 @@ export default {
|
|
|
align-items: center;
|
|
|
}
|
|
|
|
|
|
-.outer .container .detail .part div {
|
|
|
+.charge-amount .container .detail .part div {
|
|
|
width: 0.64rem;
|
|
|
height: 1.13rem;
|
|
|
font-size: 0.32rem;
|
|
@@ -302,7 +305,7 @@ export default {
|
|
|
color: #aaaaaa;
|
|
|
line-height: 1.13rem;
|
|
|
}
|
|
|
-.outer .container .detail .part .active {
|
|
|
+.charge-amount .container .detail .part .active {
|
|
|
width: 0.64rem;
|
|
|
height: 1.13rem;
|
|
|
font-size: 0.32rem;
|
|
@@ -311,25 +314,25 @@ export default {
|
|
|
color: #111111;
|
|
|
border-bottom: 0.06rem solid #db9d28;
|
|
|
}
|
|
|
-.outer .container .content {
|
|
|
+.charge-amount .container .content {
|
|
|
width: 100%;
|
|
|
}
|
|
|
-.outer .container .content .no-img {
|
|
|
+.charge-amount .container .content .no-img {
|
|
|
width: 100%;
|
|
|
height: 60vh;
|
|
|
- position: relative;
|
|
|
+ position: relative;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
}
|
|
|
-.outer .container .content .no-img div {
|
|
|
+.charge-amount .container .content .no-img div {
|
|
|
width: 2.29rem;
|
|
|
height: 1.87rem;
|
|
|
background: url("../../static/common/wu@2x.png") no-repeat 0 0;
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
-.outer .container .content .no-img span {
|
|
|
+.charge-amount .container .content .no-img span {
|
|
|
width: 2.29rem;
|
|
|
height: 0.4rem;
|
|
|
font-size: 0.28rem;
|
|
@@ -339,7 +342,7 @@ export default {
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
-.outer .container .content .ele {
|
|
|
+.charge-amount .container .content .ele {
|
|
|
height: 2.7rem;
|
|
|
border-bottom: 0.01rem solid #e0e0e0;
|
|
|
padding: 0.3rem 0;
|
|
@@ -347,7 +350,7 @@ export default {
|
|
|
flex-direction: column;
|
|
|
justify-content: space-around;
|
|
|
}
|
|
|
-.outer .container .content .ele .title {
|
|
|
+.charge-amount .container .content .ele .title {
|
|
|
width: 100%;
|
|
|
height: 0.45rem;
|
|
|
font-size: 0.32rem;
|
|
@@ -358,21 +361,21 @@ export default {
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
|
|
|
-.outer .container .content .ele .title .text {
|
|
|
+.charge-amount .container .content .ele .title .text {
|
|
|
display: inline-block;
|
|
|
height: 0.45rem;
|
|
|
font-weight: 500;
|
|
|
color: #111111;
|
|
|
}
|
|
|
|
|
|
-.outer .container .content .ele .title .amount {
|
|
|
+.charge-amount .container .content .ele .title .amount {
|
|
|
display: inline-block;
|
|
|
height: 0.45rem;
|
|
|
font-weight: 500;
|
|
|
color: #db9d28;
|
|
|
}
|
|
|
|
|
|
-.outer .container .content .ele .item {
|
|
|
+.charge-amount .container .content .ele .item {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
@@ -385,7 +388,7 @@ export default {
|
|
|
line-height: 0.4rem;
|
|
|
}
|
|
|
|
|
|
-.outer .container .content .ele .item .text {
|
|
|
+.charge-amount .container .content .ele .item .text {
|
|
|
display: inline-block;
|
|
|
height: 0.4rem;
|
|
|
font-size: 0.28rem;
|
|
@@ -395,7 +398,7 @@ export default {
|
|
|
line-height: 0.4rem;
|
|
|
}
|
|
|
|
|
|
-.outer .container .content .ele .item .amount {
|
|
|
+.charge-amount .container .content .ele .item .amount {
|
|
|
display: inline-block;
|
|
|
height: 0.4rem;
|
|
|
font-size: 0.28rem;
|