Initial commit: 积分兑换电商平台多商户版 MER-2.2
Made-with: Cursor
This commit is contained in:
320
mer_uniapp/components/orderGoods/index.vue
Normal file
320
mer_uniapp/components/orderGoods/index.vue
Normal file
@@ -0,0 +1,320 @@
|
||||
<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>
|
||||
Reference in New Issue
Block a user