charles/frontend-app
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

feat：优化售后

Browse Source
This commit is contained in:
charles
2026-07-23 16:52:28 +08:00
parent bf7970dae4
commit df7cdce7cb
2 changed files with 58 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/mine_package/mine_order/after-sales/refund-popu.vue
+54 -56
View File
@@ -1,10 +1,10 @@
<template>
<!-- 退货退款模块 -->
<view>
<view v-if="status > 0">
<view class="refund_box">
<view v-if="status > 0" class="refund_header">
<salesStatus :topLabel="topLabel" :topTitle="topTitle" :status="status"></salesStatus>
</view>
<view class="refund_content">
<scroll-view scroll-y class="refund_content">
<view class="content_card">
<image :src="product.items[0].mainGraph" class="card_img"></image>
<view class="card_info">
@@ -60,17 +60,18 @@
v-model="product.expressNo" />
</view>
</view>
<view v-if="buttonLabel" :class="[
'bottom_box',
{
bottom_box_disabled:
status == 2 && (!product.expressNo || !product.expressName),
},
{ bottom_box_quash: status == 1 || status == 3 },
]">
<view class="button operate_but_2" @click="submit">
{{ buttonLabel }}</view>
</view>
</scroll-view>
<view v-if="buttonLabel" :class="[
'bottom_box',
{
bottom_box_disabled:
status == 2 && (!product.expressNo || !product.expressName),
},
{ bottom_box_quash: status == 1 || status == 3 },
]">
<view class="button operate_but_2" @click="submit">
{{ buttonLabel }}</view>
</view>
<up-toast ref="uToastRef"></up-toast>
@@ -321,15 +322,22 @@ export default {
};
</script>
<style lang="scss" scoped>
.refund_box {
display: flex;
flex-direction: column;
box-sizing: border-box;
}
.refund_header {
flex-shrink: 0;
}
.refund_content {
width: 100%;
padding: 0 32rpx;
height: 52vh;
padding: 0 32rpx 30rpx;
box-sizing: border-box;
overflow-y: scroll;
// .card_list_box {
// padding-bottom: 88rpx;
// }
.content_card {
display: flex;
margin-bottom: 48rpx;
@@ -410,49 +418,39 @@ export default {
font-size: 28rpx;
}
}
}
.bottom_box {
position: fixed;
bottom: 0;
left: 0;
/* 补充 left:0，确保容器从左侧开始 */
right: 0;
/* 补充 right:0，让容器宽度自适应屏幕/弹窗 */
.bottom_box {
flex-shrink: 0;
text-align: center;
background: #ffffff;
padding: 16rpx 32rpx calc(28rpx + env(safe-area-inset-bottom));
box-sizing: border-box;
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
.button {
width: 100%;
height: 88rpx;
background: linear-gradient(270deg, #b164fb 0%, #7934f6 100%);
color: #ffffff;
line-height: 88rpx;
text-align: center;
background: #ffffff;
padding: 0 48rpx 28rpx;
/* 增加内边距，避免按钮贴边 */
z-index: 10;
border-radius: 8rpx;
}
/* 确保整个底部区域在内容上方 */
&.bottom_box_quash {
.button {
width: 100%;
/* 直接用 100%，利用父容器的 padding 控制边距 */
height: 88rpx;
background: linear-gradient(270deg, #b164fb 0%, #7934f6 100%);
color: #ffffff;
line-height: 88rpx;
text-align: center;
border-radius: 8rpx;
margin-top: 28rpx;
/* 只保留顶部 margin，底部由父容器 padding 控制 */
/* 移除 margin 左右值，改用父容器 padding 控制边距 */
background: #ffffff;
color: #b164fb;
border: 1rpx solid #b164fb;
}
}
&.bottom_box_quash {
.button {
background: #ffffff;
color: #b164fb;
border: 1rpx solid #b164fb;
}
}
&.bottom_box_disabled {
.button {
background: #e8ebf6;
color: #cbced9;
border: 1rpx solid #e7ebf6;
}
&.bottom_box_disabled {
.button {
background: #e8ebf6;
color: #cbced9;
border: 1rpx solid #e7ebf6;
}
}
}
pages/mine_package/mine_order/mine_order.vue
+4 -5
View File
@@ -95,7 +95,7 @@
<view>共{{ item.buyNum }}件,合计￥{{ item.sumAmount }}</view>
</view> -->
<view class="collect_msg" v-if="item.buyDeductionValue">共{{ item.buyNum }}件,合计数字积分{{ item.buyDeductionValue
}}
}}
+￥{{ item.sumAmount }}</view>
<view class="collect_msg" v-if="!item.buyDeductionValue">运费:￥{{ item.postage }},商品总价:￥{{ item.sumAmount }}
</view>
@@ -134,7 +134,8 @@
form.type === MINE_ORDER_TYPE.UNPAID
? 'operate_but_3'
: 'operate_but_1',
]" v-if="!item.isAfter && form.type !== MINE_ORDER_TYPE.AFTER_SALE" @click="onSaleAfter(item)">
]" v-if="!item.isAfter && form.type !== MINE_ORDER_TYPE.AFTER_SALE && item.status !== 5"
@click="onSaleAfter(item)">
{{
form.type === MINE_ORDER_TYPE.UNPAID ? "取消支付" : "去售后"
}}
@@ -185,10 +186,8 @@
<!-- 申请售后 -->
<up-popup v-model:show="afterShow" class="after-sales-popup" :customStyle="{
// maxHeight: '80%',
overflow: 'scroll',
overflow: 'hidden',
position: 'relative',
paddingBottom: '80rpx',
}" :round="10" :closeOnClickOverlay="false" :closeable="true" :safeAreaInsetBottom="false"
@close="afterShow = false">
<view class="after-sales-title">