|
@@ -7,25 +7,16 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="content">
|
|
|
- <div class="title">我的卡片 ({{ cardList.length }})</div>
|
|
|
+ <div class="title">我的卡片 ({{ cardList.length }})</div>
|
|
|
+ <div class="title"></div>
|
|
|
<div
|
|
|
v-for="item in cardList"
|
|
|
:key="item.id"
|
|
|
- :class="[
|
|
|
- item.cardOilsType == 1
|
|
|
- ? 'gasoline'
|
|
|
- : item.cardOilsType == 2
|
|
|
- ? 'diesel'
|
|
|
- : '',
|
|
|
- ]"
|
|
|
+ :class="[cardOilsTypeClass[item.cardOilsType]]"
|
|
|
>
|
|
|
<div class="title">
|
|
|
{{
|
|
|
- item.cardOilsType == 1
|
|
|
- ? "汽油卡"
|
|
|
- : item.cardOilsType == 2
|
|
|
- ? "柴油卡"
|
|
|
- : ""
|
|
|
+ cardOilsTypeText[item.cardOilsType]
|
|
|
}}
|
|
|
</div>
|
|
|
<div class="text">
|
|
@@ -36,17 +27,14 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
+
|
|
|
<van-popup v-model="mask" closeable position="bottom" class="mask" round>
|
|
|
<div class="charge">
|
|
|
<div class="title">充值</div>
|
|
|
<div class="tip">会员日充值更优惠,详情请咨询站长</div>
|
|
|
<div class="amount">
|
|
|
<span>{{
|
|
|
- chargeItem.cardOilsType == 1
|
|
|
- ? "汽油充值"
|
|
|
- : chargeItem.cardOilsType == 2
|
|
|
- ? "柴油充值"
|
|
|
- : ""
|
|
|
+ cardOilsTypeText[chargeItem.cardOilsType]
|
|
|
}}</span>
|
|
|
<input
|
|
|
placeholder="输入充值金额"
|
|
@@ -112,6 +100,8 @@ export default {
|
|
|
payLoading: false,
|
|
|
show: false,
|
|
|
discountList: [],
|
|
|
+ cardOilsTypeClass:[,"gasoline", "diesel", 'notoil', 'lng', 'cng'],
|
|
|
+ cardOilsTypeText:[,'汽油卡','柴油卡','非油品卡','LNG卡','CNG卡']
|
|
|
};
|
|
|
},
|
|
|
components: {
|
|
@@ -129,12 +119,12 @@ export default {
|
|
|
this.init();
|
|
|
},
|
|
|
methods: {
|
|
|
- onInput(value) {
|
|
|
- Toast(value);
|
|
|
- },
|
|
|
- onDelete() {
|
|
|
- Toast("删除");
|
|
|
- },
|
|
|
+ // onInput(value) {
|
|
|
+ // Toast(value);
|
|
|
+ // },
|
|
|
+ // onDelete() {
|
|
|
+ // Toast("删除");
|
|
|
+ // },
|
|
|
...mapActions({
|
|
|
getSdkConfig: "authen/getSdkConfig",
|
|
|
}),
|
|
@@ -178,8 +168,10 @@ export default {
|
|
|
.then((res) => {
|
|
|
if (res.retCode === 0) {
|
|
|
this.cardList = res.data;
|
|
|
+ console.log(this.cardList)
|
|
|
}
|
|
|
});
|
|
|
+ // this.cardList = [{"id":105,"unionId":"o65PX6a8gYoXrRtsay4nid7vaN-k","customerNo":"11622424586654","customerName":"Joe","amt":55455.83,"cardOilsType":"1","stationId":1,"createTime":"Jun 3, 2021 10:29:58 AM","recentlyTime":"Jun 2, 2021 5:22:26 PM"},{"id":106,"unionId":"o65PX6a8gYoXrRtsay4nid7vaN-k","customerNo":"11619582798963","customerName":"Joe","amt":10005.06,"cardOilsType":"2","stationId":1,"createTime":"Jun 3, 2021 10:29:58 AM","recentlyTime":"Jun 2, 2021 5:22:39 PM"},{"id":115,"unionId":"o65PX6a8gYoXrRtsay4nid7vaN-k","customerNo":"11622424586607","customerName":"Joe","amt":55555,"cardOilsType":"3","stationId":1,"createTime":"Jun 3, 2021 10:29:58 AM"},{"id":116,"unionId":"o65PX6a8gYoXrRtsay4nid7vaN-k","customerNo":"11622424586654","customerName":"Joe","amt":55555,"cardOilsType":"4","stationId":1,"createTime":"Jun 3, 2021 10:29:58 AM"},{"id":119,"unionId":"o65PX6a8gYoXrRtsay4nid7vaN-k","customerNo":"11622538683941","customerName":"Joe","amt":0,"cardOilsType":"5","stationId":1,"createTime":"Jun 3, 2021 10:29:58 AM"}]
|
|
|
// 这一块纯为了后端方便而已,获取station的信息
|
|
|
this.$axios
|
|
|
.$get("/getStationInfo", {
|
|
@@ -194,33 +186,22 @@ export default {
|
|
|
async pay() {
|
|
|
try {
|
|
|
this.payLoading = true;
|
|
|
- const orderData = await this.$axios.$post("/rechargeBalance", {
|
|
|
+ const orderData = await this.$axios.$post("http://mp.huijy.net/test/rechargeBalance", {
|
|
|
amt: this.chargeAmount,
|
|
|
stationId: this.stationId,
|
|
|
customerName: this.userInfo.nickname,
|
|
|
cardOilsType: this.chargeItem.cardOilsType,
|
|
|
- payType: "1",
|
|
|
unionId: this.unionId,
|
|
|
- stationName: this.stationInfo.stationName,
|
|
|
});
|
|
|
if (orderData.retCode !== 0) {
|
|
|
throw new Error("生成订单失败");
|
|
|
}
|
|
|
const orderNum = orderData.data;
|
|
|
- const subject =
|
|
|
- this.stationInfo.stationName +
|
|
|
- "_" +
|
|
|
- (this.chargeItem.cardOilsType == 1
|
|
|
- ? "汽油电子卡充值"
|
|
|
- : this.chargeItem.cardOilsType == 2
|
|
|
- ? "柴油电子卡充值"
|
|
|
- : "");
|
|
|
- const payInfoData = await this.$axios.$post("/rechargeBalanceSXFPay", {
|
|
|
+ const payInfoData = await this.$axios.$post("http://mp.huijy.net/test/rechargeBalanceSXFPay", {
|
|
|
amt: this.chargeAmount,
|
|
|
openId: this.openId,
|
|
|
stationId: this.stationId,
|
|
|
userType: "1",
|
|
|
- subject,
|
|
|
orderNo: orderNum,
|
|
|
});
|
|
|
if (payInfoData.retCode !== 0) {
|
|
@@ -253,7 +234,6 @@ export default {
|
|
|
signType, // 签名方式,默认为'SHA1',使用新版支付需传入'MD5'
|
|
|
paySign, // 支付签名
|
|
|
success: function (res) {
|
|
|
- // that.$router.push("/personal/charge");
|
|
|
that.payLoading = false;
|
|
|
alert("支付完成");
|
|
|
},
|
|
@@ -332,8 +312,7 @@ export default {
|
|
|
background-color: #ffffff;
|
|
|
border-radius: 0.3rem 0.3rem 0 0;
|
|
|
padding: 0.3rem;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
+ overflow: scroll;
|
|
|
}
|
|
|
.charge-index .content > div:not(.title) {
|
|
|
width: 6.9rem;
|
|
@@ -354,6 +333,18 @@ export default {
|
|
|
background: url("~static/personal/bj4@2x.png") no-repeat 0px 0px;
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
+.charge-index .content .notoil {
|
|
|
+ background: url("~static/personal/bj5.2x.png") no-repeat 0px 0px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+}
|
|
|
+.charge-index .content .lng {
|
|
|
+ background: url("~static/personal/bj6.2x.png") no-repeat 0px 0px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+}
|
|
|
+.charge-index .content .cng {
|
|
|
+ background: url("~static/personal/bj7.2x.png") no-repeat 0px 0px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+}
|
|
|
.charge-index .content div .title {
|
|
|
height: 0.45rem;
|
|
|
font-size: 0.32rem;
|
|
@@ -365,27 +356,29 @@ export default {
|
|
|
top: 0.27rem;
|
|
|
left: 1.67rem;
|
|
|
}
|
|
|
-.charge-index .content .gasoline .text {
|
|
|
+.charge-index .content div .text{
|
|
|
height: 0.45rem;
|
|
|
font-size: 0.32rem;
|
|
|
- font-family: PingFangSC-Medium, PingFang SC;
|
|
|
font-weight: 500;
|
|
|
- color: #3db58f;
|
|
|
line-height: 0.45rem;
|
|
|
position: absolute;
|
|
|
top: 0.9rem;
|
|
|
left: 1.67rem;
|
|
|
}
|
|
|
+.charge-index .content .gasoline .text {
|
|
|
+ color: #3db58f;
|
|
|
+}
|
|
|
.charge-index .content .diesel .text {
|
|
|
- height: 0.45rem;
|
|
|
- font-size: 0.32rem;
|
|
|
- font-family: PingFangSC-Medium, PingFang SC;
|
|
|
- font-weight: 500;
|
|
|
color: #ea8c7d;
|
|
|
- line-height: 0.45rem;
|
|
|
- position: absolute;
|
|
|
- top: 0.9rem;
|
|
|
- left: 1.67rem;
|
|
|
+}
|
|
|
+.charge-index .content .notoil .text {
|
|
|
+ color: #898d92;
|
|
|
+}
|
|
|
+.charge-index .content .lng .text {
|
|
|
+ color: #dab899;
|
|
|
+}
|
|
|
+.charge-index .content .cng .text {
|
|
|
+ color: #6977b1;
|
|
|
}
|
|
|
|
|
|
.charge-index .content div .text span {
|
|
@@ -407,10 +400,18 @@ export default {
|
|
|
.charge-index .content .gasoline button {
|
|
|
color: #24ac81;
|
|
|
}
|
|
|
-
|
|
|
.charge-index .content .diesel button {
|
|
|
color: #e87d6d;
|
|
|
}
|
|
|
+.charge-index .content .notoil button {
|
|
|
+ color: #6d7278;
|
|
|
+}
|
|
|
+.charge-index .content .lng button {
|
|
|
+ color: #d2a781;
|
|
|
+}
|
|
|
+.charge-index .content .cng button {
|
|
|
+ color: #45579e;
|
|
|
+}
|
|
|
|
|
|
.charge-index .mask .charge {
|
|
|
height: 7.5rem;
|