邓平艺 4 years ago
parent
commit
48e89c15a5
  1. 171
      pages/order/apply-details.vue
  2. 198
      pages/order/apply-refund.vue

171
pages/order/apply-details.vue

@ -1,101 +1,103 @@
<template> <template>
<view> <view>
<!-- 商品信息 -->
<view class="bg-white">
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true">
<view class="flex justify-between align-start" style="padding: 32rpx 32rpx 30rpx 32rpx;">
<image :src="orderDetails.order.goods.cover" mode="aspectFill" style="width: 240rpx; height: 240rpx;border-radius: 10rpx;"></image>
<view class="flex-sub padding-left-sm">
<view class="bref-box text-black1 lf-font-32 lf-font-bold" style="height: 88rpx;line-height: 44rpx;" v-if="orderDetails.order.goods.name">
{{orderDetails.order.goods.name}}
</view>
<text class="block text-gray lf-font-28" style="margin-top: 20rpx;line-height: 40rpx;">数量 <text class="margin-left margin-right-xs text-gray">x</text>{{orderDetails.order.number}}</text>
<block v-if="isRight(orderDetails)">
<!-- 商品信息 -->
<view class="bg-white">
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true">
<view class="flex justify-between" style="margin-top: 28rpx;">
<view class="text-red text-price lf-font-42 lf-font-bold" style="margin-top: 16rpx;">
{{orderDetails.order.selling_price}}
<view class="flex justify-between align-start" style="padding: 32rpx 32rpx 30rpx 32rpx;">
<image :src="orderDetails.order.goods.cover" mode="aspectFill" style="width: 240rpx; height: 240rpx;border-radius: 10rpx;"></image>
<view class="flex-sub padding-left-sm">
<view class="bref-box text-black1 lf-font-32 lf-font-bold" style="height: 88rpx;line-height: 44rpx;" v-if="orderDetails.order.goods.name">
{{orderDetails.order.goods.name}}
</view> </view>
<view>
<button class="cu-btn line-gray bg-white border round margin-left-sm lf-font-28">等待审核</button>
<text class="block text-gray lf-font-28" style="margin-top: 20rpx;line-height: 40rpx;">数量 <text class="margin-left margin-right-xs text-gray">x</text>{{orderDetails.order.number}}</text>
<view class="flex justify-between" style="margin-top: 28rpx;">
<view class="text-red text-price lf-font-42 lf-font-bold" style="margin-top: 16rpx;">
{{orderDetails.order.selling_price}}
</view>
<view>
<button class="cu-btn line-gray bg-white border round margin-left-sm lf-font-28">等待审核</button>
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
</skeleton>
</view>
<self-line/>
<skeleton :loading="skeletonLoading" :row="3" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单金额</text>
<view class="text-price lf-font-32 text-black">
{{orderDetails.order.amount}}
</skeleton>
</view>
<self-line/>
<skeleton :loading="skeletonLoading" :row="3" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单金额</text>
<view class="text-price lf-font-32 text-black">
{{orderDetails.order.amount}}
</view>
</view> </view>
</view>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费率</text>
<view>
<text class="lf-font-32 text-black">{{orderDetails.refund_rate}}%</text>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费率</text>
<view>
<text class="lf-font-32 text-black">{{orderDetails.refund_rate}}%</text>
</view>
</view> </view>
</view>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费金额</text>
<view class="text-price lf-font-32 text-black">
{{orderDetails.refund_rate_amount}}
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费金额</text>
<view class="text-price lf-font-32 text-black">
{{orderDetails.refund_rate_amount}}
</view>
</view> </view>
</view> </view>
</view>
</skeleton>
<!-- 表单 -->
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">可退金额</text>
<view class="text-price lf-font-32 text-black">
{{orderDetails.refund_amount}}
</skeleton>
<!-- 表单 -->
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">可退金额</text>
<view class="text-price lf-font-32 text-black">
{{orderDetails.refund_amount}}
</view>
</view> </view>
</view>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单编号</text>
<view>
<text class="lf-font-32 text-black">{{orderDetails.order_sn}}</text>
<!-- <text class="text-orange lf-font-28" @tap="copy(orderDetails.order_sn)">复制</text> -->
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单编号</text>
<view>
<text class="lf-font-32 text-black">{{orderDetails.order_sn}}</text>
<!-- <text class="text-orange lf-font-28" @tap="copy(orderDetails.order_sn)">复制</text> -->
</view>
</view> </view>
</view>
<view class="padding-lr bg-white" style="padding-top: 30rpx;">
<view class="cu-self menu">
<view class="text-gray lf-font-28">
由于产品的特殊性在申请的过程中供应商会向您收取部分费用如有疑问可参与产品的<text @tap="$routerGo('/pages/agreement/agreement?id='+checkAreaId)" class="text-orange">{{checkArea}}</text>或咨询客服
<view class="padding-lr bg-white" style="padding-top: 30rpx;">
<view class="cu-self menu">
<view class="text-gray lf-font-28">
由于产品的特殊性在申请的过程中供应商会向您收取部分费用如有疑问可参与产品的<text @tap="$routerGo('/pages/agreement/agreement?id='+checkAreaId)" class="text-orange">{{checkArea}}</text>或咨询客服
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
</skeleton>
</skeleton>
<skeleton :loading="skeletonLoading" :row="6" :showAvatar="false" :showTitle="true">
<view class="bg-white" style="padding: 40rpx 32rpx 20rpx 32rpx;">
<view class="cu-self menu">
<view class="lf-font-32 text-black1">退款说明</view>
</view>
<view class="cu-self menu" style="margin-top: 20rpx;padding-bottom: 20rpx;border-bottom: 1px solid #F5F5F5;" v-if="images.length == 0">
<view class="text-gray lf-font-32">{{orderDetails.comment}}</view>
</view>
<view class="cu-self menu" style="margin-top: 20rpx;" v-else>
<view class="text-gray lf-font-32">{{orderDetails.comment}}</view>
<skeleton :loading="skeletonLoading" :row="6" :showAvatar="false" :showTitle="true">
<view class="bg-white" style="padding: 40rpx 32rpx 20rpx 32rpx;">
<view class="cu-self menu">
<view class="lf-font-32 text-black1">退款说明</view>
</view>
<view class="cu-self menu" style="margin-top: 20rpx;padding-bottom: 20rpx;border-bottom: 1px solid #F5F5F5;" v-if="images.length == 0">
<view class="text-gray lf-font-32">{{orderDetails.comment}}</view>
</view>
<view class="cu-self menu" style="margin-top: 20rpx;" v-else>
<view class="text-gray lf-font-32">{{orderDetails.comment}}</view>
</view>
</view> </view>
</view>
<view class="cu-form-group solid-bottom" style="padding-bottom: 20rpx;" v-if="images.length != 0">
<view class="grid col-4 grid-square flex-sub">
<view style="width: 212rpx;height: 212rpx;border-radius: 10rpx;" class="bg-img" v-for="(item,index) of images" :key="index">
<image :src="item.path" @tap="showImg(item.path)" style="width: 216rpx;height: 216rpx;" mode="aspectFill"></image>
<view class="cu-form-group solid-bottom" style="padding-bottom: 20rpx;" v-if="images.length != 0">
<view class="grid col-4 grid-square flex-sub">
<view style="width: 212rpx;height: 212rpx;border-radius: 10rpx;" class="bg-img" v-for="(item,index) of images" :key="index">
<image :src="item.path" @tap="showImg(item.path)" style="width: 216rpx;height: 216rpx;" mode="aspectFill"></image>
</view>
</view> </view>
</view> </view>
</view>
<view style="height: 82rpx;"></view>
</skeleton>
<view style="height: 82rpx;"></view>
</skeleton>
</block>
</view> </view>
</template> </template>
@ -114,11 +116,16 @@
orderDetails: {}, orderDetails: {},
checkArea: '', checkArea: '',
checkAreaId: 1, checkAreaId: 1,
images: []
images: [],
ifChoose: true
} }
}, },
computed: { computed: {
isRight(){
return function(val){
return this.$shared.isRight(val);
}
}
}, },
onLoad(e) { onLoad(e) {
this.order_id = e.order_id this.order_id = e.order_id
@ -143,9 +150,11 @@
}, },
// //
showImg(image) { showImg(image) {
uni.previewImage({
urls: [image],
});
this.$u.throttle(() => {
uni.previewImage({
urls: [image]
})
}, 200);
}, },
// //
copy(text) { copy(text) {

198
pages/order/apply-refund.vue

@ -1,125 +1,127 @@
<template> <template>
<view> <view>
<!-- 商品信息 -->
<view class="bg-white">
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true">
<block v-if="isRight(applyDetails)">
<!-- 商品信息 -->
<view class="bg-white">
<skeleton :loading="skeletonLoading" :row="2" :showAvatar="false" :showTitle="true">
<view class="flex justify-between align-start" style="padding: 32rpx 32rpx 30rpx 32rpx;">
<image :src="applyDetails.order.goods.cover" mode="aspectFill" style="width: 240rpx; height: 240rpx;border-radius: 10rpx;"></image>
<view class="flex-sub padding-left-sm">
<view class="bref-box text-black1 lf-font-32 lf-font-bold" style="height: 88rpx;line-height: 44rpx;" v-if="applyDetails.order.goods.name">
{{applyDetails.order.goods.name}}
</view>
<text class="block text-gray lf-font-28" style="margin-top: 20rpx;line-height: 40rpx;">数量 <text class="margin-left margin-right-xs text-gray">x</text>{{applyDetails.order.number}}</text>
<view class="flex justify-between align-start" style="padding: 32rpx 32rpx 30rpx 32rpx;">
<image :src="applyDetails.order.goods.cover" mode="aspectFill" style="width: 240rpx; height: 240rpx;border-radius: 10rpx;"></image>
<view class="flex-sub padding-left-sm">
<view class="bref-box text-black1 lf-font-32 lf-font-bold" style="height: 88rpx;line-height: 44rpx;" v-if="applyDetails.order.goods.name">
{{applyDetails.order.goods.name}}
</view>
<text class="block text-gray lf-font-28" style="margin-top: 20rpx;line-height: 40rpx;">数量 <text class="margin-left margin-right-xs text-gray">x</text>{{applyDetails.order.number}}</text>
<view class="flex justify-between" style="margin-top: 44rpx;">
<view class="text-red text-price lf-font-42 lf-font-bold">
{{applyDetails.order.selling_price}}
<view class="flex justify-between" style="margin-top: 44rpx;">
<view class="text-red text-price lf-font-42 lf-font-bold">
{{applyDetails.order.selling_price}}
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
</skeleton>
</view>
</skeleton>
</view>
<self-line/>
<skeleton :loading="skeletonLoading" :row="3" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单金额</text>
<view class="text-price lf-font-32 text-black">
{{applyDetails.order.amount}}
<self-line/>
<skeleton :loading="skeletonLoading" :row="3" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单金额</text>
<view class="text-price lf-font-32 text-black">
{{applyDetails.order.amount}}
</view>
</view> </view>
</view>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费率</text>
<view>
<text class="lf-font-32 text-black">{{applyDetails.order.refund_rate}}%</text>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费率</text>
<view>
<text class="lf-font-32 text-black">{{applyDetails.order.refund_rate}}%</text>
</view>
</view> </view>
</view>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费金额</text>
<view class="text-price lf-font-32 text-black">
{{applyDetails.order.refund_rate_amount}}
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">扣费金额</text>
<view class="text-price lf-font-32 text-black">
{{applyDetails.order.refund_rate_amount}}
</view>
</view> </view>
</view> </view>
</view>
</skeleton>
</skeleton>
<self-line/>
<!-- 表单 -->
<skeleton :loading="skeletonLoading" :row="3" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">可退金额</text>
<view class="text-price lf-font-32 text-black">
{{applyDetails.order.refund_amount}}
<self-line/>
<!-- 表单 -->
<skeleton :loading="skeletonLoading" :row="3" :showAvatar="false" :showTitle="true">
<view class="bg-white">
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">可退金额</text>
<view class="text-price lf-font-32 text-black">
{{applyDetails.order.refund_amount}}
</view>
</view> </view>
</view>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单编号</text>
<view>
<text class="margin-right lf-font-32 text-black">{{applyDetails.order.order_sn}}</text>
<text class="text-orange lf-font-32" @tap="copy(applyDetails.order.order_sn)">复制</text>
<view class="cu-bar padding-lr solid-bottom flex justify-between align-center text-center">
<text class="text-gray lf-font-32">订单编号</text>
<view>
<text class="margin-right lf-font-32 text-black">{{applyDetails.order.order_sn}}</text>
<text class="text-orange lf-font-32" @tap="copy(applyDetails.order.order_sn)">复制</text>
</view>
</view> </view>
</view>
<view class="padding-top padding-lr bg-white">
<view class="cu-self menu">
<view class="text-gray lf-font-28">
由于产品的特殊性在申请的过程中供应商会向您收取部分费用如有疑问可参与产品的<text class="text-orange" @tap="$routerGo('/pages/agreement/agreement?id='+applyDetails.agreement.article_id)">{{applyDetails.agreement.title}}</text>或咨询客服
<view class="padding-top padding-lr bg-white">
<view class="cu-self menu">
<view class="text-gray lf-font-28">
由于产品的特殊性在申请的过程中供应商会向您收取部分费用如有疑问可参与产品的<text class="text-orange" @tap="$routerGo('/pages/agreement/agreement?id='+applyDetails.agreement.article_id)">{{applyDetails.agreement.title}}</text>或咨询客服
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
</skeleton>
<skeleton :loading="skeletonLoading" :row="6" :showAvatar="false" :showTitle="true">
<view class="bg-white" style="padding: 40rpx 32rpx 30rpx 32rpx;">
<view class="cu-self menu">
<view class="lf-font-32 text-black1">退款说明</view>
</view>
<view class="cu-self menu" style="margin-top: 30rpx;">
<textarea type="text" v-model="applyInfo" class="text-left lf-font-32 area-self" placeholder="请输入反馈信息" />
</view>
</view>
<!-- <view class="padding bg-white">
<view class="cu-self menu">
<view class="lf-font-32 text-gray">请上传退款凭证</view>
</view>
</view> -->
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub">
<view style="width: 212rpx;height: 212rpx;border-radius: 10rpx;" class="bg-img" v-for="(item,index) in img_list" :key="index" @tap="showImg(item)" :data-url="img_list[index]">
<image :src="img_list[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg(index)" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</skeleton>
<skeleton :loading="skeletonLoading" :row="6" :showAvatar="false" :showTitle="true">
<view class="bg-white" style="padding: 40rpx 32rpx 30rpx 32rpx;">
<view class="cu-self menu">
<view class="lf-font-32 text-black1">退款说明</view>
</view> </view>
<view style="width: 212rpx;height: 212rpx;border-radius: 10rpx;" class="solids" @tap="ChooseImage" v-if="img_list.length<3">
<text class='cuIcon-cameraadd'></text>
<view class="cu-self menu" style="margin-top: 30rpx;">
<textarea type="text" v-model="applyInfo" class="text-left lf-font-32 area-self" placeholder="请输入反馈信息" />
</view> </view>
</view> </view>
<!-- <view class="grid col-4 grid-square flex-sub">
<view class="solids" @tap="ChooseImage" v-if="hostImg == ''"><text class="cuIcon-cameraadd"></text></view>
<view class="bg-img" v-else>
<image :src="hostImg" @tap="showImg" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg"><text class="cuIcon-close"></text></view>
<!-- <view class="padding bg-white">
<view class="cu-self menu">
<view class="lf-font-32 text-gray">请上传退款凭证</view>
</view> </view>
</view> --> </view> -->
</view>
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub">
<view style="width: 212rpx;height: 212rpx;border-radius: 10rpx;" class="bg-img" v-for="(item,index) in img_list" :key="index" @tap="showImg(item)" :data-url="img_list[index]">
<image :src="img_list[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg(index)" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</view>
<view style="width: 212rpx;height: 212rpx;border-radius: 10rpx;" class="solids" @tap="ChooseImage" v-if="img_list.length<3">
<text class='cuIcon-cameraadd'></text>
</view>
</view>
<!-- <view class="grid col-4 grid-square flex-sub">
<view class="solids" @tap="ChooseImage" v-if="hostImg == ''"><text class="cuIcon-cameraadd"></text></view>
<view class="padding-lr-lg" style="margin-top: 80rpx;">
<button class="cu-btn block bg-orange lg round" @tap="subimitApply()">
<text class="cuIcon-loading2 cuIconfont-spin margin-right-xs text-white" v-if="loading"></text>
<text class="text-df text-white">确认申请</text>
</button>
</view>
<view class="bg-img" v-else>
<image :src="hostImg" @tap="showImg" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg"><text class="cuIcon-close"></text></view>
</view>
</view> -->
</view>
<view style="height: 100rpx;">
<view class="padding-lr-lg" style="margin-top: 80rpx;">
<button class="cu-btn block bg-orange lg round" @tap="subimitApply()">
<text class="cuIcon-loading2 cuIconfont-spin margin-right-xs text-white" v-if="loading"></text>
<text class="text-df text-white">确认申请</text>
</button>
</view>
</view>
</skeleton>
<view style="height: 100rpx;">
</view>
</skeleton>
</block>
</view> </view>
</template> </template>
@ -142,7 +144,11 @@
} }
}, },
computed: { computed: {
isRight(){
return function(val){
return this.$shared.isRight(val);
}
}
}, },
onLoad(e) { onLoad(e) {
this.order_id = e.order_id this.order_id = e.order_id

Loading…
Cancel
Save