|
|
@@ -10,18 +10,19 @@
|
|
|
|
|
|
|
|
|
<view class="top-fixed">
|
|
|
- <!-- tab切换 -->
|
|
|
<view class="pub-tab-box">
|
|
|
- <view class="tab-inner">
|
|
|
- <view v-for="(item,index) in tabList" :key="index"
|
|
|
- :class="status == item.status?'item active':'item'" @click="tabsClick(item)">
|
|
|
- <view class="text">
|
|
|
- {{ item.name }}
|
|
|
- <image v-show="status == item.status" class="tab-bg" src="/static/images/tab_bg.png"
|
|
|
- mode=""></image>
|
|
|
+ <scroll-view class="scroll-tabs" scroll-x="true" show-scrollbar="false">
|
|
|
+ <view class="tab-inner">
|
|
|
+ <view v-for="(item,index) in tabList" :key="index"
|
|
|
+ :class="status == item.status?'item active':'item'" @click="tabsClick(item)">
|
|
|
+ <view class="text">
|
|
|
+ {{ item.name }}
|
|
|
+ <image v-show="status == item.status" class="tab-bg"
|
|
|
+ src="/static/images/tab_bg.png" mode=""></image>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </scroll-view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
@@ -42,8 +43,7 @@
|
|
|
<text v-else-if="item.status==4">已完成</text>
|
|
|
<text v-else-if="item.status==-3">已取消</text>
|
|
|
</view>
|
|
|
- <view class="order-main" v-for="(itm,idx) in item.orderItemList" :key="idx"
|
|
|
- >
|
|
|
+ <view class="order-main" v-for="(itm,idx) in item.orderItemList" :key="idx">
|
|
|
<view class="img-box">
|
|
|
<image :src="itm.imgUrl"></image>
|
|
|
</view>
|
|
|
@@ -62,14 +62,14 @@
|
|
|
<text class="num">¥<text class="bold">{{item.totalPrice}}</text></text>
|
|
|
</view>
|
|
|
<view class="button-group">
|
|
|
- <view v-if="item.status == 1" @click="cancel(item)" class="button cancel ">取消订单</view>
|
|
|
- <view v-if="item.isAfterSales==1" @click="refund(item)" class="button cancel">申请售后
|
|
|
+ <view v-if="item.status == 1" @click.stop="cancel(item)" class="button cancel ">取消订单
|
|
|
+ </view>
|
|
|
+ <view v-if="item.isAfterSales==1" @click.stop="refund(item)" class="button cancel">申请售后
|
|
|
</view>
|
|
|
- <view
|
|
|
- v-if="item.status ==3 ||item.status ==4 ||item.deliverySn"
|
|
|
- class="button cancel" @click.stop="showDelivery(item)">查看物流</view>
|
|
|
- <view v-if="item.status == 1" @click="pay(item)" class="button pay">去支付</view>
|
|
|
- <view v-if="item.status == 3" @click="confirmReceipt(item)" class="button pay">确认收货
|
|
|
+ <view v-if="item.status ==3 ||item.status ==4 ||item.deliverySn" class="button cancel"
|
|
|
+ @click.stop="showDelivery(item)">查看物流</view>
|
|
|
+ <view v-if="item.status == 1" @click.stop="pay(item)" class="button pay">去支付</view>
|
|
|
+ <view v-if="item.status == 3" @click.stop="confirmReceipt(item)" class="button pay">确认收货
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -84,8 +84,8 @@
|
|
|
import {
|
|
|
cancelOrder, //取消订单
|
|
|
liveOrderList, // 订单列表
|
|
|
- finishOrder ,//确认收货
|
|
|
- getStoreAfterSalesList//获取售后列表
|
|
|
+ finishOrder, //确认收货
|
|
|
+ getStoreAfterSalesList //获取售后列表
|
|
|
} from '@/api/order.js'
|
|
|
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
|
|
|
|
|
|
@@ -148,22 +148,22 @@
|
|
|
methods: {
|
|
|
goDetail(item) {
|
|
|
console.log("跳转", item)
|
|
|
- // uni.navigateTo({
|
|
|
- // url: './storeOrderDetail?orderId=' + item.orderId
|
|
|
- // })
|
|
|
-
|
|
|
-
|
|
|
- if(item.status==-1){
|
|
|
+ // uni.navigateTo({
|
|
|
+ // url: './storeOrderDetail?orderId=' + item.orderId
|
|
|
+ // })
|
|
|
+
|
|
|
+
|
|
|
+ if (item.status == -1) {
|
|
|
uni.navigateTo({
|
|
|
url: './refundOrderDetail?id=' + item.afterSaleId
|
|
|
})
|
|
|
-
|
|
|
- }else{
|
|
|
+
|
|
|
+ } else {
|
|
|
uni.navigateTo({
|
|
|
url: './storeOrderDetail?orderId=' + item.orderId
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
// mescroll初始化
|
|
|
mescrollInit(mescroll) {
|
|
|
@@ -332,58 +332,90 @@
|
|
|
}
|
|
|
|
|
|
.pub-tab-box {
|
|
|
- box-sizing: border-box;
|
|
|
width: 100%;
|
|
|
- padding: 0 60upx;
|
|
|
background-color: #FFFFFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ .scroll-tabs {
|
|
|
+ width: 100%;
|
|
|
+ white-space: nowrap;
|
|
|
|
|
|
- .tab-inner {
|
|
|
- height: 88upx;
|
|
|
- line-height: 88upx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- overflow-x: auto;
|
|
|
+ /* 隐藏滚动条 */
|
|
|
+ ::-webkit-scrollbar {
|
|
|
+ display: none;
|
|
|
}
|
|
|
|
|
|
- .item {
|
|
|
- font-size: 28upx;
|
|
|
- white-space: nowrap;
|
|
|
- line-height: 1;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 500;
|
|
|
- color: #666666;
|
|
|
- margin-right: 60upx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
+ /* 添加鼠标滚轮支持 */
|
|
|
+ overflow-x: auto;
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+ }
|
|
|
|
|
|
- &.active {
|
|
|
- font-weight: bold;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
+ /* 针对电脑环境添加特殊样式 */
|
|
|
+ @media (min-width: 768px) {
|
|
|
+ .scroll-tabs {
|
|
|
|
|
|
- .text {
|
|
|
- position: relative;
|
|
|
- z-index: 1;
|
|
|
+ /* 在电脑上显示滚动条 */
|
|
|
+ ::-webkit-scrollbar {
|
|
|
+ display: block;
|
|
|
+ height: 4px;
|
|
|
}
|
|
|
|
|
|
- .tab-bg {
|
|
|
- width: 72upx;
|
|
|
- height: 28upx;
|
|
|
- position: absolute;
|
|
|
- top: 17upx;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-36upx);
|
|
|
- z-index: -1;
|
|
|
+ ::-webkit-scrollbar-thumb {
|
|
|
+ background: #ddd;
|
|
|
+ border-radius: 2px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ .tab-inner {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ height: 88upx;
|
|
|
+ padding: 0 30upx;
|
|
|
+ /* 给左右留一些空间 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
+ font-size: 28upx;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 1;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #666666;
|
|
|
+ margin-right: 60upx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ flex-shrink: 0;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-right: 30upx;
|
|
|
+ /* 最后一个也保持间距 */
|
|
|
+ }
|
|
|
+
|
|
|
+ &.active {
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text {
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab-bg {
|
|
|
+ width: 72upx;
|
|
|
+ height: 28upx;
|
|
|
+ position: absolute;
|
|
|
+ top: 17upx;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-36upx);
|
|
|
+ z-index: -1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
.content {
|
|
|
.order-list {
|
|
|
margin-top: 80rpx;
|