调整跳转方式

This commit is contained in:
aixianling
2023-07-07 10:46:37 +08:00
parent e380e5f1e2
commit ff16a8053f

View File

@@ -1,35 +1,38 @@
<template> <template>
<div class="myOrderList"> <div class="myOrderList">
<div class="fixed-top"> <div class="fixed-top">
<u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="90" font-size="28" bg-color="#fff" inactive-color="#8891A1" <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="90" font-size="28" bg-color="#fff"
active-color="#1D2229 " :bar-style="barStyle" @change="changeTab" ></u-tabs> inactive-color="#8891A1"
active-color="#1D2229 " :bar-style="barStyle" @change="changeTab"></u-tabs>
</div> </div>
<div class="list-content" v-if="list.length"> <div class="list-content" v-if="list.length">
<div class="item" v-for="(item, index) in list" :key="index"> <div class="item" v-for="(item, index) in list" :key="index">
<div class="time-flex"> <div class="time-flex">
<p>{{item.createTime.substring(0, 16)}}</p> <p>{{ item.createTime.substring(0, 16) }}</p>
<div :class="`status`+item.status">{{ $dict.getLabel('integralSGOStatus', item.status) }}</div> <div :class="`status`+item.status">{{ $dict.getLabel('integralSGOStatus', item.status) }}</div>
</div> </div>
<div class="flex"> <div class="flex">
<img :src="item.goodsPicUrl" alt=""> <img :src="item.goodsPicUrl" alt="">
<div class="type" :class="`type`+item.goodsTypeText">{{ $dict.getLabel('integralSGTypeText', item.goodsTypeText) }}</div> <div class="type" :class="`type`+item.goodsTypeText">
{{ $dict.getLabel('integralSGTypeText', item.goodsTypeText) }}
</div>
<div class="flex-right"> <div class="flex-right">
<p>{{item.goodsTitle}}</p> <p>{{ item.goodsTitle }}</p>
<div class="num-flex"> <div class="num-flex">
<h3>{{item.usedIntegral}}积分<span v-if="item.goodsType == 1">+{{item.payMoney}}</span></h3> <h3>{{ item.usedIntegral }}积分<span v-if="item.goodsType == 1">+{{ item.payMoney }}</span></h3>
<div>x {{item.quantity}}</div> <div>x {{ item.quantity }}</div>
</div> </div>
</div> </div>
</div> </div>
<p class="tips" v-if="item.goodsType == 1"><span>兑换成功后点击去购买前往京东低价购买</span></p> <p class="tips" v-if="item.goodsType == 1"><span>兑换成功后点击去购买前往京东低价购买</span></p>
<p class="tips" v-else>免费兑换商品可到固定的兑换点进行核销兑换</p> <p class="tips" v-else>免费兑换商品可到固定的兑换点进行核销兑换</p>
<p class="remark" v-if="item.remarks">备注{{item.remarks}}</p> <p class="remark" v-if="item.remarks">备注{{ item.remarks }}</p>
<div class="flex-btn" v-if="item.goodsType == 1 && item.status != 2"> <div class="flex-btn" v-if="item.goodsType == 1 && item.status != 2">
<p></p> <p></p>
<div class="btn confirm" @click="openJd(item)">去购买</div> <div class="btn confirm" @click="openJd(item)">去购买</div>
</div> </div>
<div class="flex-btn" v-else> <div class="flex-btn" v-else>
<p>核销码:<span>{{item.verificationCode}}</span></p> <p>核销码:<span>{{ item.verificationCode }}</span></p>
<div class="btn" v-if="item.status == 0" @click="cancel(item)">取消订单</div> <div class="btn" v-if="item.status == 0" @click="cancel(item)">取消订单</div>
</div> </div>
</div> </div>
@@ -93,7 +96,7 @@ export default {
}) })
}, },
openJd(item) { openJd(item) {
uni.navigateTo({url: `./jdH5?goodsJdUrl=${item.goodsJdUrl}`}) location.href = item.goodsJdUrl
}, },
cancel(item) { cancel(item) {
uni.showModal({ uni.showModal({
@@ -129,6 +132,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.myOrderList { .myOrderList {
min-height: 100%; min-height: 100%;
.fixed-top { .fixed-top {
background-color: #fff; background-color: #fff;
position: fixed; position: fixed;
@@ -136,14 +140,17 @@ export default {
left: 0; left: 0;
z-index: 2; z-index: 2;
} }
.list-content { .list-content {
padding: 112px 24px 24px; padding: 112px 24px 24px;
background-color: #F3F6F9; background-color: #F3F6F9;
.item { .item {
width: 100%; width: 100%;
background: #FFF; background: #FFF;
border-radius: 16px; border-radius: 16px;
margin-bottom: 32px; margin-bottom: 32px;
.time-flex { .time-flex {
padding: 0 32px; padding: 0 32px;
line-height: 64px; line-height: 64px;
@@ -153,24 +160,29 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
div { div {
color: #2D7DFF; color: #2D7DFF;
} }
.status2 { .status2 {
color: #999; color: #999;
} }
} }
.flex { .flex {
padding: 32px 32px 0; padding: 32px 32px 0;
display: flex; display: flex;
position: relative; position: relative;
margin-bottom: 20px; margin-bottom: 20px;
img { img {
width: 166px; width: 166px;
height: 166px; height: 166px;
border-radius: 16px; border-radius: 16px;
margin-right: 20px; margin-right: 20px;
} }
.type { .type {
position: absolute; position: absolute;
left: 32px; left: 32px;
@@ -183,18 +195,23 @@ export default {
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
font-size: 18px; font-size: 18px;
color: #FFF; color: #FFF;
p { p {
scale: 0.9; scale: 0.9;
} }
} }
.type1 { .type1 {
background-color: #E64E39; background-color: #E64E39;
} }
.type0 { .type0 {
background-color: #FF6900; background-color: #FF6900;
} }
.flex-right { .flex-right {
width: calc(100% - 186px); width: calc(100% - 186px);
p { p {
word-break: break-all; word-break: break-all;
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
@@ -210,8 +227,10 @@ export default {
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
margin-bottom: 50px; margin-bottom: 50px;
} }
.num-flex { .num-flex {
display: flex; display: flex;
h3 { h3 {
width: calc(100% - 100px); width: calc(100% - 100px);
font-family: PingFangSC-SNaNpxibold; font-family: PingFangSC-SNaNpxibold;
@@ -219,6 +238,7 @@ export default {
font-size: 34px; font-size: 34px;
color: #FF6900; color: #FF6900;
line-height: 48px; line-height: 48px;
span { span {
display: inline-block; display: inline-block;
font-size: 34px; font-size: 34px;
@@ -226,6 +246,7 @@ export default {
margin-left: 8px; margin-left: 8px;
} }
} }
div { div {
width: 100px; width: 100px;
text-align: right; text-align: right;
@@ -239,6 +260,7 @@ export default {
} }
} }
.tips { .tips {
display: inline-block; display: inline-block;
padding: 12px; padding: 12px;
@@ -249,11 +271,13 @@ export default {
font-size: 24px; font-size: 24px;
color: #3BBC37; color: #3BBC37;
margin: 0 32px 16px 32px; margin: 0 32px 16px 32px;
span { span {
display: inline-block; display: inline-block;
scale: 0.9; scale: 0.9;
} }
} }
.remark { .remark {
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
font-size: 24px; font-size: 24px;
@@ -262,16 +286,19 @@ export default {
word-break: break-all; word-break: break-all;
margin: 0 32px 24px 32px; margin: 0 32px 24px 32px;
} }
.flex-btn { .flex-btn {
padding: 0 32px 32px; padding: 0 32px 32px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
p { p {
height: 56px; height: 56px;
line-height: 56px; line-height: 56px;
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
font-size: 24px; font-size: 24px;
color: #666; color: #666;
span { span {
display: inline-block; display: inline-block;
font-family: PingFangSC-SNaNpxibold; font-family: PingFangSC-SNaNpxibold;
@@ -281,6 +308,7 @@ export default {
margin-left: 8px; margin-left: 8px;
} }
} }
.btn { .btn {
width: 136px; width: 136px;
text-align: center; text-align: center;
@@ -291,6 +319,7 @@ export default {
font-size: 22px; font-size: 22px;
color: #666; color: #666;
} }
.confirm { .confirm {
border: 1px solid #2D7DFF; border: 1px solid #2D7DFF;
background-color: #2D7DFF; background-color: #2D7DFF;
@@ -299,6 +328,7 @@ export default {
} }
} }
} }
.pad-t112 { .pad-t112 {
padding-top: 112px; padding-top: 112px;
} }