320 lines
8.7 KiB
Vue
320 lines
8.7 KiB
Vue
<template>
|
||
<view class="orderGoods borRadius14">
|
||
<view class="flex-between-center">
|
||
<view>
|
||
<navigator v-if="orderInfo.merName" :url="`/pages/merchant/home/index?merId=`+ orderInfo.merId"
|
||
hover-class="none">
|
||
<view class='total flex-y-center'>
|
||
<text class="mr10 iconfont icon-ic_mall"></text>
|
||
<text class="mr-2">{{orderInfo.merName || ''}}</text>
|
||
<text v-if="orderInfo.orderInfoList && orderInfo.orderInfoList[0].productType != ProductTypeEnum.PunchCard"
|
||
class="iconfont icon-ic_rightarrow"></text>
|
||
</view>
|
||
</navigator>
|
||
</view>
|
||
<!-- 次卡商品核销记录 -->
|
||
<view
|
||
v-if="isShowRecord && orderInfo.orderInfoList && orderInfo.orderInfoList[0].productType == ProductTypeEnum.PunchCard">
|
||
<navigator hover-class='none'
|
||
:url="'/pages/goods/punch_card_record_list/index?type=users&orderNo='+orderData.orderNo">
|
||
<view class="color-666">
|
||
<text>核销记录</text>
|
||
<text class="iconfont icon-ic_rightarrow ver-right-icon"></text>
|
||
</view>
|
||
</navigator>
|
||
</view>
|
||
</view>
|
||
<view v-if="orderInfo.workOrderNo" class='flex-between-center pt-32'>
|
||
<text class="f-s-28">工单号</text>
|
||
<view class="flex-y-center">
|
||
<text class="f-s-28">{{orderInfo.workOrderNo || ''}}</text>
|
||
<view class="copy-btn-box" @click="handleSetClipboard(orderInfo.workOrderNo)">
|
||
<text>复制</text>
|
||
</view>
|
||
<!-- <button class="copy-btn ml-16 f-s-28" @click="handleSetClipboard(orderInfo.workOrderNo)">复制</button> -->
|
||
</view>
|
||
</view>
|
||
<view v-show="orderData.secondType ===1" class='total'>
|
||
<text class="mr10 iconfont icon-zhuanti"></text>
|
||
<text class="mr10">积分商品兑换</text>
|
||
</view>
|
||
<view class='goodWrapper' :class="{'pad24': orderInfo.merName}">
|
||
<view class="item" v-for="(item,index) in cartInfo" :key="index">
|
||
<view class='acea-row row-between-wrapper' @click="jumpCon(item)">
|
||
<view class='pictrue'>
|
||
<image :src='item.image'></image>
|
||
</view>
|
||
<view class='text'>
|
||
<view class='acea-row row-between-wrapper'>
|
||
<view class='name' :class="item.price|| item.productPrice ? 'line1': 'line2'">{{item.productName || ''}}
|
||
</view>
|
||
<view class='num line-heightOne' v-if="item.payNum">x {{item.payNum}}</view>
|
||
</view>
|
||
|
||
<view class='attr' v-if="item.sku">{{item.sku}}</view>
|
||
<!-- 积分价格 -->
|
||
<PointsPrice v-if="secondType === ProductTypeEnum.Integral" :pointsPrice="item"
|
||
:pointsGoodsStyle="hotPointsStyle" class="mt-20"></PointsPrice>
|
||
<!-- 其他价格 -->
|
||
<view v-else class='acea-row justify-between' style="align-items: baseline;">
|
||
<view v-show="item.price || item.productPrice" class="acea-row">
|
||
<view class='money line-heightOne regular fw-500'>￥{{item.price || item.productPrice}}</view>
|
||
</view>
|
||
<view
|
||
v-if="(item.deliveryMethod == 1 || !orderInfo.takeTheirSwitch) && !jump && Number(item.productType)==0"
|
||
class="font-color">不支持到店自提</view>
|
||
<view v-if="item.deliveryMethod == 2 && !jump && Number(item.productType)==0" class="font-color">不支持商家配送
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 订单状态（0：待支付，1：待发货,2：部分发货， 3：待使用，4：待收货,5：已收货,6：已完成，9：已取消） -->
|
||
<view v-if="isShowBtn" class="acea-row evaluateBox">
|
||
<view v-show="getApplyRefundNum(item)>0" class="text">申请售后（
|
||
数量：{{(getApplyRefundNum(item))}} ）</view>
|
||
<view class='evaluate text-666 fs-22' v-if="isRefund(item) && getApplyRefundNum(item)< item.payNum"
|
||
@click.stop="goRefund(item)"><text class="line-heightOne">申请退款</text>
|
||
</view>
|
||
<!-- 虚拟商品退款需要判断是否开启退款按钮 -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
// +----------------------------------------------------------------------
|
||
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||
// +----------------------------------------------------------------------
|
||
// | Copyright (c) 2016~2026 https://www.crmeb.com All rights reserved.
|
||
// +----------------------------------------------------------------------
|
||
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||
// +----------------------------------------------------------------------
|
||
// | Author: CRMEB Team <admin@crmeb.com>
|
||
// +----------------------------------------------------------------------
|
||
import {
|
||
goProductDetail
|
||
} from "@/libs/order";
|
||
import {
|
||
ProductTypeEnum,
|
||
ProductMarketingTypeEnum
|
||
} from "@/enums/productEnums";
|
||
import PointsPrice from '@/components/PointsPrice.vue';
|
||
import {
|
||
handleSetClipboard
|
||
} from "../../libs/order";
|
||
/**
|
||
* 积分商品推荐样式
|
||
*/
|
||
const hotPointsStyle = {
|
||
iconStyle: {
|
||
width: '28rpx',
|
||
height: '28rpx'
|
||
},
|
||
priceStyle: {
|
||
fontSize: '26rpx',
|
||
},
|
||
unitStyle: {
|
||
fontSize: '24rpx',
|
||
},
|
||
}
|
||
export default {
|
||
props: {
|
||
//订单详情
|
||
orderData: {
|
||
type: Object,
|
||
default: function() {
|
||
return {};
|
||
}
|
||
},
|
||
//商品信息
|
||
cartInfo: {
|
||
type: Array,
|
||
default: function() {
|
||
return [];
|
||
}
|
||
},
|
||
orderNo: {
|
||
type: String,
|
||
default: '',
|
||
},
|
||
jump: {
|
||
type: Boolean,
|
||
default: false,
|
||
},
|
||
orderProNum: {
|
||
type: Number,
|
||
default: function() {
|
||
return 0;
|
||
}
|
||
},
|
||
//商户整条对象信息
|
||
orderInfo: {
|
||
type: Object,
|
||
default: function() {
|
||
return {};
|
||
}
|
||
},
|
||
//是否显示操作按钮
|
||
isShowBtn: {
|
||
type: Boolean,
|
||
default: true,
|
||
},
|
||
//订单二级类型:0-普通订单，1-积分订单，2-虚拟订单，4-视频号订单，5-云盘订单，6-卡密订单
|
||
secondType: {
|
||
type: Number,
|
||
default: function() {
|
||
return 0;
|
||
}
|
||
},
|
||
// 是否展示核销记录，预下单不展示
|
||
isShowRecord: {
|
||
type: Boolean,
|
||
default: true
|
||
}
|
||
},
|
||
components: {
|
||
PointsPrice
|
||
},
|
||
data() {
|
||
return {
|
||
hotPointsStyle: hotPointsStyle,
|
||
totalNmu: '',
|
||
ProductMarketingTypeEnum: ProductMarketingTypeEnum,
|
||
ProductTypeEnum: ProductTypeEnum,
|
||
};
|
||
},
|
||
watch: {
|
||
cartInfo: function(nVal, oVal) {
|
||
let num = 0
|
||
nVal.forEach((item, index) => {
|
||
num += item.cartNum
|
||
})
|
||
this.totalNmu = num
|
||
}
|
||
},
|
||
methods: {
|
||
handleSetClipboard,
|
||
// 普通商品、虚拟（开启可申请退款开关）、视频号可申请退款
|
||
isRefund(item) {
|
||
return (this.secondType === this.ProductTypeEnum.Normal || this.secondType === this.ProductTypeEnum
|
||
.Reservation ||
|
||
this.secondType === this.ProductTypeEnum.Video ||
|
||
(this.secondType === this.ProductTypeEnum.Fictitious && item.proRefundSwitch) ||
|
||
this.secondType === this.ProductTypeEnum.PunchCard && this.orderData.cardIfRefund) &&
|
||
this.orderData.status > 0 && this.orderData.status < 6;
|
||
},
|
||
// 退款数量
|
||
getApplyRefundNum(item) {
|
||
return Number(item.applyRefundNum) + Number(item.refundNum)
|
||
|
||
},
|
||
/**
|
||
* 退款申请
|
||
*/
|
||
goRefund(item) {
|
||
item.groupBuyActivityId = this.orderData.groupBuyActivityId
|
||
this.$Cache.set('productInfo', item)
|
||
if (this.secondType === this.ProductTypeEnum.Reservation || this.secondType === this.ProductTypeEnum.PunchCard) {
|
||
uni.navigateTo({
|
||
url: `/pages/goods/goods_return/index?orderNo=${this.orderNo}&orderId=${item.id}&afterSalesType=1`
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: `/pages/goods/after_sales_type/index?orderNo=${this.orderNo}&orderId=${item.id}`
|
||
})
|
||
}
|
||
|
||
},
|
||
jumpCon: function(item) {
|
||
let type = item.hasOwnProperty('productMarketingType') ? item.productMarketingType : item.hasOwnProperty(
|
||
'productType') ? item.productType : item.type;
|
||
if (this.jump) {
|
||
goProductDetail(item.productId, type, '')
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.copy-btn {
|
||
color: #2291F8FF;
|
||
}
|
||
|
||
.evaluateBox {
|
||
position: relative;
|
||
margin-top: 10rpx;
|
||
|
||
.text {
|
||
font-size: 20rpx;
|
||
color: #868686;
|
||
}
|
||
}
|
||
|
||
.evaluate {
|
||
// width: auto !important;
|
||
width: 136rpx !important;
|
||
height: 52rpx !important;
|
||
border-radius: 40rpx !important;
|
||
}
|
||
|
||
.pad24 {
|
||
padding: 32rpx 0 0;
|
||
}
|
||
|
||
.orderGoods {
|
||
background-color: #fff;
|
||
padding: 24rpx 0;
|
||
}
|
||
|
||
.money {
|
||
@include price_color(theme);
|
||
}
|
||
|
||
.orderGoods .total {
|
||
width: 100%;
|
||
font-size: 30rpx;
|
||
color: #282828;
|
||
box-sizing: border-box;
|
||
.icon-ic_rightarrow {
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
|
||
.pictrue image {
|
||
background: #f4f4f4;
|
||
}
|
||
|
||
.goodWrapper {
|
||
.item {
|
||
margin-bottom: 30rpx;
|
||
}
|
||
|
||
.item:nth-last-child(1) {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.name {
|
||
width: 87%;
|
||
}
|
||
}
|
||
|
||
.copy-btn-box {
|
||
background: #F5F5F5;
|
||
border-radius: 200rpx 200rpx 200rpx 200rpx;
|
||
padding: 0 12rpx;
|
||
margin-left: 8rpx;
|
||
font-size: 22rpx;
|
||
}
|
||
|
||
.ver-right-icon {
|
||
font-size: 24rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
|
||
.color-666 {
|
||
color: #666;
|
||
}
|
||
</style> |