kubbo/dvcp_v2_wxcp_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

我的订单

Browse Source
This commit is contained in:
shijingjing
2022-11-24 09:41:26 +08:00
parent 788de30fd2
commit 0fcb1fdf74
1 changed files with 47 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
src/project/pidu/AppPointsChange/myOrder.vue
View File

@@ -4,36 +4,44 @@
<div class="tab-select"> <div class="tab-select">
<div class="item" :class="tabIndex == index? 'active': ''" v-for="(item,index) in tabList" :key="index" @click="toCheck(index)">{{ item }}<span></span></div> <div class="item" :class="tabIndex == index? 'active': ''" v-for="(item,index) in tabList" :key="index" @click="toCheck(index)">{{ item }}<span></span></div>
</div> </div>
<!-- v-if="orderList.length" -->
<div class="card-List" v-if="orderList.length"> <div class="card-List">
<div class="item" v-for="(item,index) in orderList" :key="index"> <!-- v-for="(item,index) in orderList" :key="index" -->
<div @click="$linkTo(`./detail?id=${item.id}`)"> <div class="item" >
<!-- @click="$linkTo(`./detail?id=${item.id}`)" -->
<div>
<div class="title"> <div class="title">
<div>{{ item.createTime }}</div> <div>2020-12-11 10:10</div>
<div :style="{color: item.orderStatus==0? '#FF883C':item.orderStatus==1? '#42D784': '#999999'}">{{ item.orderStatus | format }}</div> <!-- :style="{color: item.orderStatus==0? '#FF883C':item.orderStatus==1? '#42D784': '#999999'}" -->
<div>待收货</div>
</div> </div>
<div class="list" v-for="(e,indexs) in item.merchandiseList" :key="indexs"> <!-- v-for="(e,indexs) in item.merchandiseList" :key="indexs" -->
<div class="list">
<div class="list-item"> <div class="list-item">
<div class="picture"> <div class="picture">
<img :src="JSON.parse(e.merchandisePhoto)[0].url" alt=""> <img src="./components/imgs/check-icon.png" alt="">
</div> </div>
<div class="info"> <div class="info">
<div class="name">{{ e.merchandiseName }}</div> <div class="name">天薇抽纸天然无香纸巾天薇抽纸天然无香纸巾天薇抽纸可湿水面巾…</div>
<div class="info-num"> <div class="info-num">
<div class="num">x<span>{{ e.merchandiseNumber }}</span></div> <div class="num">数量：2<span></span></div>
<div class="integral"><span>{{ e.merchandiseNumber * e.costIntegral }}</span>积分</div> <div class="integral">共<span>10</span>积分</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="remark">
备注：明天自己上门取货
</div> </div>
<div class="btn" v-if="item.orderStatus == 0"> <!-- v-if="item.orderStatus == 0" -->
<div class="btn">
<div class="cancel" @click="cancelBtn(item.id)">取消订单</div> <div class="cancel" @click="cancelBtn(item.id)">取消订单</div>
<div class="confirm" @click="confirmBtn(item.id)">核销码：</div> <div class="confirm">核销码：<span>293049</span></div>
</div> </div>
</div> </div>
</div> </div>
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty> </div>
<!-- <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty> -->
</div> </div>
</template> </template>
@@ -144,6 +152,7 @@ export default {
font-size: 28px; font-size: 28px;
box-sizing: border-box; box-sizing: border-box;
padding: 128px 32px 32px 32px; padding: 128px 32px 32px 32px;
box-sizing: border-box;
.item { .item {
width: 100%; width: 100%;
background: #FFFFFF; background: #FFFFFF;
@@ -156,14 +165,18 @@ export default {
height: 104px; height: 104px;
line-height: 104px; line-height: 104px;
padding: 0 32px; padding: 0 32px;
box-sizing: border-box;
border-bottom: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE;
} }
.list { .list {
padding: 0 32px; padding: 0 32px;
box-sizing: border-box;
height: 100%;
.list-item { .list-item {
display: flex; display: flex;
padding: 32px 0; padding: 32px 0;
border-bottom: 1px solid #EEEEEE; box-sizing: border-box;
.picture { .picture {
width: 176px; width: 176px;
height: 176px; height: 176px;
@@ -175,7 +188,6 @@ export default {
} }
.info { .info {
width: calc(100% - 192px); width: calc(100% - 192px);
.name {}
.info-num { .info-num {
margin-top: 24px; margin-top: 24px;
display: flex; display: flex;
@@ -194,26 +206,36 @@ export default {
} }
} }
} }
.remark {
padding: 16px 32px;
box-sizing: border-box;
border-top: 1px solid #EEEEEE;
}
.btn { .btn {
height: 128px; height: 100px;
display: flex; display: flex;
justify-content: flex-end; justify-content: space-between;
padding: 0 20px; padding: 0 20px;
box-sizing: border-box;
border-top: 1px solid #EEEEEE;
div { div {
margin-top: 32px; margin-top: 14px;
width: 176px; width: 176px;
height: 64px; height: 64px;
line-height: 64px; line-height: 64px;
border: 1px solid #DDDDDD;
border-radius: 52px;
text-align: center; text-align: center;
} }
div:first-child { div:first-child {
margin-right: 32px; margin-right: 32px;
border: 1px solid #DDDDDD;
border-radius: 52px;
} }
div:last-child { div:last-child {
color: #FFFFFF; color: #999999;
background: linear-gradient(90deg, #FFA044 0%, #FF8436 100%); width: calc(100% - 200px);
text-align: right;
} }
} }
} }