weipengfei
/
purchase-let
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

退款完善

This commit is contained in:
1154079537 2024-06-08 16:11:45 +08:00
parent 02b558210a
commit 6422b072fc
4 changed files with 436 additions and 267 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

354
components/shopListPopup.vue
View File

@ -1,208 +1,212 @@
<template> <template>
<up-popup :show="show" closeable round="10" @close="close"> <up-popup :show="show" closeable round="10" @close="close">
<view class="address-popup"> <view class="address-popup">
<view class="head-title">提货点</view> <view class="head-title">提货点</view>
<view class="list-admin"> <view class="list-admin">
<up-search placeholder="请输入提货点名称" @search="searchKeyword" v-model="keyword" @custom="searchKeyword"></up-search> <up-search placeholder="请输入提货点名称" @search="searchKeyword" v-model="keyword"
</view> @custom="searchKeyword"></up-search>
<scroll-view style="height: 600rpx;padding-bottom: 20rpx;" scroll-y> </view>
<view class="list-li border" v-for="(item,index) in list" :key="index" @click="addressType=item.mer_id"> <scroll-view style="height: 600rpx;padding-bottom: 20rpx;" scroll-y>
<view class="list-li-top"> <view class="list-li border" v-for="(item,index) in list" :key="index" @click="addressType=item.mer_id">
<view class=""> <view class="list-li-top">
<text>{{item.mer_name}}</text> <view class="">
<text v-if="index==0&&item.distance" <text>{{item.mer_name}}</text>
style="background-color: #38BE41;color: white;font-size: 18rpx;margin-left: 24rpx;padding: 0 5rpx;">距离最近</text> <text v-if="index==0&&item.distance"
<text v-if="item.distance" class="distance">步行{{item.distance}}</text> style="background-color: #38BE41;color: white;font-size: 18rpx;margin-left: 24rpx;padding: 0 5rpx;">距离最近</text>
</view> <text v-if="item.distance" class="distance">步行{{item.distance}}</text>
</view> </view>
<view class=""> </view>
{{item.mer_address||''}} <view class="">
</view> {{item.mer_address||''}}
<view style="color: #999;"> </view>
<text v-if="item.service_phone" @click.stop="onCall(item.service_phone)">{{item.mer_real_name||''}} <view style="color: #999;">
{{ item.service_phone||'' }}</text> <text v-if="item.service_phone"
</view> @click.stop="onCall(item.service_phone)">{{item.mer_real_name||''}}
<view class="check"> {{ item.service_phone||'' }}</text>
<image style="width: 36rpx;height: 36rpx" v-if="addressType==item.mer_id" src="@/static/icon/check.png"> </view>
</image> <view class="check">
<image style="width: 36rpx;height: 36rpx" v-else src="@/static/icon/n-check.png"></image> <image style="width: 36rpx;height: 36rpx" v-if="addressType==item.mer_id"
</view> src="@/static/icon/check.png">
</view> </image>
</scroll-view> <image style="width: 36rpx;height: 36rpx" v-else src="@/static/icon/n-check.png"></image>
<up-button color="#20B128" shape="circle" @click="submitAddress">确认提货点 </up-button> </view>
</view> </view>
<!-- <modal title="是否要拨打电话" :content="`即将拨打电话${phone}`" cancleText="取消" confirmText="拨打" :show="callShow" @close="callShow = false" </scroll-view>
<up-button color="#20B128" shape="circle" @click="submitAddress">确认提货点 </up-button>
</view>
<!-- <modal title="是否要拨打电话" :content="`即将拨打电话${phone}`" cancleText="取消" confirmText="拨打" :show="callShow" @close="callShow = false"
@change="onCall" /> --> @change="onCall" /> -->
</up-popup> </up-popup>
</template> </template>
<script setup> <script setup>
import { import {
ref ref
} from "vue"; } from "vue";
import modal from "@/components/modal.vue"; import modal from "@/components/modal.vue";
const addressType = ref(-1) const addressType = ref(-1)
// const callShow = ref(false) // const callShow = ref(false)
// const phone = ref(''); // const phone = ref('');
// const mer_real_name = (e) => { // const mer_real_name = (e) => {
// callShow.value = true; // callShow.value = true;
// phone.value = e; // phone.value = e;
// } // }
const onCall = (e) => { const onCall = (e) => {
uni.makePhoneCall({ uni.makePhoneCall({
phoneNumber: e, phoneNumber: e,
success() { success() {
callShow.value = false callShow.value = false
} }
}) })
} }
const props = defineProps({ const props = defineProps({
show: { show: {
type: Boolean, type: Boolean,
default: false default: false
}, },
list: { list: {
type: Array, type: Array,
default: () => [] default: () => []
}, },
}) })
const emit = defineEmits(['close', 'change', 'search']); const emit = defineEmits(['close', 'change', 'search']);
const close = () => { const close = () => {
emit('close'); emit('close');
} }
const submitAddress = () => { const submitAddress = () => {
let e = props.list.find(item => item.mer_id == addressType.value); let e = props.list.find(item => item.mer_id == addressType.value);
if (addressType.value <= 0 || !e) return uni.$u.toast('请选择提货点'); if (addressType.value <= 0 || !e) return uni.$u.toast('请选择提货点');
emit('change', e); emit('change', e);
} }
const keyword = ref('') const keyword = ref('')
const searchKeyword = () => { const searchKeyword = () => {
emit('search', keyword.value); emit('search', keyword.value);
} }
const navTo = (url) => { const navTo = (url) => {
uni.navigateTo({ uni.navigateTo({
url: url url: url
}) })
} }
const setCheck = (e) => { const setCheck = (e) => {
addressType.value = e; addressType.value = e;
} }
defineExpose({ defineExpose({
setCheck setCheck
}) })
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.address-popup { .address-popup {
padding: 30rpx; padding: 30rpx;
.head-title { .head-title {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} padding: 20rpx;
}
.list-admin { .list-admin {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 20rpx; margin-bottom: 20rpx;
.admin-btn { .admin-btn {
display: flex; display: flex;
color: #20B128; color: #20B128;
.btn { .btn {
margin-left: 20rpx; margin-left: 20rpx;
display: flex; display: flex;
align-items: center; align-items: center;
&:active { &:active {
color: rgba(#20B128, 0.8); color: rgba(#20B128, 0.8);
transition: background-color 0.5s; transition: background-color 0.5s;
animation: disappear 0.5s 0.5s forwards; animation: disappear 0.5s 0.5s forwards;
} }
} }
} }
} }
.row { .row {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding-bottom: 20rpx; padding-bottom: 20rpx;
border-bottom: 1rpx solid #f6f6f6; border-bottom: 1rpx solid #f6f6f6;
margin-bottom: 20rpx; margin-bottom: 20rpx;
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
margin-bottom: 0; margin-bottom: 0;
} }
.content { .content {
.top { .top {
display: flex; display: flex;
view { view {
margin-right: 20rpx; margin-right: 20rpx;
} }
} }
.bottom {} .bottom {}
} }
image { image {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
flex-shrink: 0; flex-shrink: 0;
} }
} }
} }
.border { .border {
border-bottom: 1px solid #F3F3F3; border-bottom: 1px solid #F3F3F3;
} }
.list-li { .list-li {
padding: 30rpx 0; padding: 30rpx 0;
font-size: 24rpx; font-size: 24rpx;
position: relative; position: relative;
.list-li-top { .list-li-top {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 10rpx; margin-bottom: 10rpx;
font-size: 30rpx; font-size: 30rpx;
} }
.distance { .distance {
border: 1px solid #40AE36; border: 1px solid #40AE36;
font-size: 18rpx; font-size: 18rpx;
color: #40AE36; color: #40AE36;
margin-left: 20rpx; margin-left: 20rpx;
padding: 0 5rpx; padding: 0 5rpx;
} }
.check { .check {
position: absolute; position: absolute;
right: 20rpx; right: 20rpx;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
} }
} }
@keyframes disappear { @keyframes disappear {
to { to {
opacity: 0; opacity: 0;
/* 渐隐 */ /* 渐隐 */
transform: scale(0); transform: scale(0);
/* 缩小 */ /* 缩小 */
} }
} }
</style> </style>

84
pages/afterSales/afterSales.vue
View File

@ -5,30 +5,30 @@
<up-cell-group :border="false" class="cellGroup"> <up-cell-group :border="false" class="cellGroup">
<up-cell title="退款原因" :value="refundForm.refund_message?refundForm.refund_message:'请选择'" <up-cell title="退款原因" :value="refundForm.refund_message?refundForm.refund_message:'请选择'"
titleStyle="color:#444;font-size:30rpx;" isLink :required="true" @click="show = true"></up-cell> titleStyle="color:#444;font-size:30rpx;" isLink :required="true" @click="show = true"></up-cell>
<up-cell title="退款件数" :border="false"> <!-- <up-cell title="退款件数" :border="false">
<template #value> <template #value>
<up-number-box v-model="refundForm.refund_num"></up-number-box> <up-number-box v-model="refundForm.refund_num"></up-number-box>
</template> </template>
</up-cell> </up-cell> -->
</up-cell-group> </up-cell-group>
</view> </view>
<!-- 商品信息 --> <!-- 商品信息 -->
<view class="afterSales-goods"> <view class="afterSales-goods">
<view class="afterSales-goods-wrap"> <view class="afterSales-goods-wrap" v-for="(item,indx) in goodsList" :key="indx">
<view class="afterSales-goods-left"> <view class="afterSales-goods-left">
<up-image width="140rpx" height="140rpx" border="8rpx"></up-image> <up-image width="140rpx" height="140rpx" radius="8rpx" :src="item.image" />
</view> </view>
<view class="afterSales-goods-right"> <view class="afterSales-goods-right">
<view class="afterSales-goods-right-title"> <view class="afterSales-goods-right-title">
<text class="goods_name">黄牛牛腩</text> <text class="goods_name">{{item.store_name}}</text>
<text class="goods_price"> <text class="goods_price">
<text style='font-size: 24rpx;'>￥</text> <text style='font-size: 24rpx;'>￥</text>
<text style="font-size: 32rpx;">10</text> <text style="font-size: 32rpx;">{{item.price}}</text>
</text> </text>
</view> </view>
<view class="afterSales-goods-right-info"> <view class="afterSales-goods-right-info">
<text class="goods_desc">牛腩块</text> <text class="goods_desc">{{item.unit}}</text>
<text class="goods_num">x5</text> <text class="goods_num">x5</text>
</view> </view>
</view> </view>
@ -53,11 +53,11 @@
<view class="afterSales-remark"> <view class="afterSales-remark">
<view class="afterSales-remark-title"> <view class="afterSales-remark-title">
<view class="afterSales-remark-title-txt">备注说明</view> <view class="afterSales-remark-title-txt">备注说明</view>
<view class="afterSales-remark-title-count">0/200</view> <view class="afterSales-remark-title-count"></view>
</view> </view>
<view class="afterSales-remark-textarea"> <view class="afterSales-remark-textarea">
<up-textarea :count="true"></up-textarea> <up-textarea :count="true" v-model="refundForm.mark"></up-textarea>
</view> </view>
<view class="afterSales-remark-title"> <view class="afterSales-remark-title">
@ -71,7 +71,7 @@
</view> </view>
<!-- btn --> <!-- btn -->
<view class="afterSales-btn"> <view class="afterSales-btn" @click="onSubmitApply">
<view class="afterSales-btn-wrap"> <view class="afterSales-btn-wrap">
<text>提交申请</text> <text>提交申请</text>
</view> </view>
@ -107,7 +107,8 @@
} from "vue"; } from "vue";
import { import {
orderListApi, orderListApi,
refundReasonListApi refundReasonListApi,
applyRefundApi
} from "@/api/order.js"; } from "@/api/order.js";
import { import {
config config
@ -128,10 +129,26 @@
refund_message: '', //退款原因 refund_message: '', //退款原因
refund_num: '', //退款数量 refund_num: '', //退款数量
id: '', //订单id id: '', //订单id
old_cart_id: '', //购物车id old_cart_id: [], //购物车id
refund_type: '', //0 仅退款 1 退款退货 2换货 refund_type: '', //0 仅退款 1 退款退货 2换货
refund_reason_wap_img: '',
mark: ''
});
const goodsList = ref([]);
onLoad(() => {
getRefundReasonData();
// 上一个页面传递的售后参数
const eventChannel = instance.getOpenerEventChannel();
eventChannel.on('orderDetail', function(data) {
console.log(data);
refundForm.id = data.id;
refundForm.old_cart_id = data.old_cart_id;
refundForm.refund_type = data.refund_type;
goodsList.value = data.goodsList;
})
}); });
const shopInfo = ref(null);
// 图片上传 // 图片上传
const fileList1 = ref([]); const fileList1 = ref([]);
@ -175,6 +192,9 @@
}, },
success: (res) => { success: (res) => {
setTimeout(() => { setTimeout(() => {
if (typeof res.data == 'string') {
res.data = JSON.parse(res.data)
}
resolve(res.data.data); resolve(res.data.data);
}, 1000); }, 1000);
}, },
@ -182,23 +202,37 @@
}); });
}; };
onLoad(() => { // 退款原因
getRefundReasonData();
const eventChannel = instance.getOpenerEventChannel();
eventChannel.on('orderDetail', function(data) {
shopInfo.value = data;
refundForm.value.id = shopInfo.value.order_id;
refundForm.value.old_cart_id = shopInfo.value.cart_id;
})
});
// 提交退款原因
const onSubmitReason = () => { const onSubmitReason = () => {
show.value = false; show.value = false;
refundForm.refund_message = refundType.value; refundForm.refund_message = refundType.value;
} }
// 申请提交
const onSubmitApply = () => {
if (!refundForm.refund_message) return uni.$u.toast('请选择退款原因');
let urls = [];
//图片 refund_reason_wap_img
if (fileList1.value.length > 0) {
fileList1.value.map(i => {
console.log(i.url.uri);
urls.push(i.url.uri);
});
refundForm.refund_reason_wap_img = urls.join(',');
}
applyRefundApi(refundForm).then(res => {
if (res.code == 1) {
uni.$u.toast(res.msg);
uni.$u.sleep(1500).then(res => {
uni.navigateBack();
})
} else {
uni.$u.toast(res.msg);
}
})
}
// 取消原因列表 // 取消原因列表
const refundReasonList = ref([]); const refundReasonList = ref([]);
const getRefundReasonData = () => { const getRefundReasonData = () => {

3
pages/index/index.vue
View File

@ -415,7 +415,8 @@
//统计商品的访问记录 //统计商品的访问记录
productLogApi({ productLogApi({
product_id: item.product_id, product_id: item.product_id,
cate_id: item.cate_id cate_id: item.cate_id,
store_id: uni.getStorageSync('STORE_INFO').id || ''
}); });
}; };

262
pagesOrder/order/order.vue
View File

@ -53,29 +53,51 @@
<view class="afterSales-type"> <view class="afterSales-type">
<view class="afterSales-type-title">售后类型</view> <view class="afterSales-type-title">售后类型</view>
<view class="afterSales-type-con"> <view class="afterSales-type-con">
<view class="afterSales-type-item">仅退款</view> <view class="afterSales-type-item" :class="{'fuck-active':afterSalesType===0}"
<view class="afterSales-type-item">退款退货</view> @click="afterSalesType=0">仅退款</view>
<view class="afterSales-type-item">换货</view> <view class="afterSales-type-item" :class="{'fuck-active':afterSalesType==1}"
@click="afterSalesType=1">退款退货</view>
<view class="afterSales-type-item" :class="{'fuck-active':afterSalesType==2}"
@click="afterSalesType=2">换货</view>
</view> </view>
<view class="afterSales-type-tip" v-if="afterSalesType===0">当前售后类型仅支持未备货商品</view>
<view class="afterSales-type-tip" v-if="afterSalesType==1">当前售后类型仅支持非生鲜类商品</view>
<view class="afterSales-type-tip" v-if="afterSalesType==2">当前售后类型仅支持选择单个商品</view>
</view> </view>
<view class="scroll-wrap">
<scroll-view style="max-height: 50vh;padding-bottom: 20rpx;" scroll-y> <scroll-view style="max-height: 50vh;padding-bottom: 20rpx;" scroll-y>
<block v-for="(item,index) in goodsList" :key="index">
<view class="goods">
<view class="goods-item">
<block v-for="(item,index) in refundReasonList" :key="index"> <view class="goods-item-left">
<view class="row" @click="refundType = item.value"> <view class="goods-item-left-img">
<view class="content"> <up-image width="164rpx" height="164rpx" :src="item.image" radius="8rpx" />
<view class="top"></view> </view>
<view class="bottom u-line-2">{{item.value}}</view> <view class="goods-item-left-info">
<view class="goods_name">{{item.store_name}}</view>
<view class="goods_detail">
<view class="goods-detail_num">数量{{item.cart_num}}</view>
<view class="goods_detail_price">
<text class="symbol">￥</text>
<text class="numbers">{{item.price}}</text>
</view>
</view>
</view>
</view>
<view class="goods-item-right" @click="onChooseGoods(item)">
<image v-if="item.isSelected" src="@/static/icon/check.png"></image>
<image v-else src="@/static/icon/n-check.png"></image>
</view>
</view>
</view> </view>
<image v-if="refundType==item.value" src="@/static/icon/check.png"></image> </block>
<image v-else src="@/static/icon/n-check.png"></image> </scroll-view>
</view> </view>
</block> <view style="height: 120rpx;display: flex;justify-content: center;padding: 0 30rpx;align-items: center;"
</scroll-view> @click="onPageToAfterSales">
<up-button color="#20B128" shape="circle" @click="onSubmitReason">提交</up-button> <up-button color="#20B128" shape="circle" @click="onSubmitReason">提交</up-button>
</view>
</view> </view>
</up-popup> </up-popup>
</template> </template>
@ -188,18 +210,58 @@
}) })
} }
const refundShow = ref(true); // 申请售后<!--sb项目-->
const refundShow = ref(false);
const goodsList = ref([]); // 申请售后商品
const afterSalesType = ref(''); //申请售后类型 0 1 2
const orderId = ref('');
// 申请售后 // 申请售后
const applyAfterSales = (item) => { const applyAfterSales = (item) => {
refundShow.value = true;
goodsList.value = item.goods_list;
orderId.value = item.order_id;
}
// 跳转到申请售后
const onPageToAfterSales = () => {
if (afterSalesType.value === '') return uni.$u.toast('请选择售后类型');
if (!goodsList.value || goodsList.value.length == 0) return uni.$u.toast('暂无可申请售后的商品');
let goods = goodsList.value.find(i => i.isSelected);
if (goods == undefined) return uni.$u.toast('请选择需要申请售后的商品');
let ids = [];
let goodsListSel = [];
goodsList.value.map(i => {
if (i.isSelected) {
ids.push(i.old_cart_id);
goodsListSel.push(i);
}
});
uni.navigateTo({ uni.navigateTo({
url: "/pages/afterSales/afterSales", url: "/pages/afterSales/afterSales",
success(res) { success(res) {
res.eventChannel.emit('orderDetail', item) refundShow.value = false; // close modal
res.eventChannel.emit('orderDetail', {
id: orderId.value, //订单id
old_cart_id: ids,
refund_type: afterSalesType.value,
goodsList: goodsListSel
})
} }
}) })
} }
// 选择物品
const onChooseGoods = (item) => {
if (item.hasOwnProperty('isSelected')) {
item.isSelected = !item.isSelected;
} else {
item.isSelected = true;
}
}
const rePay = (e) => { const rePay = (e) => {
rePaymentApi({ rePaymentApi({
order_id: e.id, order_id: e.id,
@ -369,68 +431,136 @@
} }
.address-popup { .address-popup {
padding: 30rpx; // padding: 30rpx;
background-color: #F6F6F6;
.head-title { .head-title {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
margin-bottom: 20rpx; margin-bottom: 20rpx;
padding: 20rpx;
} }
.list-admin { .afterSales-type {
display: flex; margin: 0 20rpx 20rpx;
justify-content: space-between; background: #FFFFFF;
margin-bottom: 20rpx; border-radius: 16rpx;
padding: 20rpx;
box-sizing: border-box;
.admin-btn { .afterSales-type-title {
font-size: 32rpx;
color: #444444;
margin-bottom: 28rpx;
}
.afterSales-type-con {
display: flex; display: flex;
color: #20B128; align-items: center;
margin-bottom: 20rpx;
.btn { .afterSales-type-item {
margin-left: 20rpx; width: 200rpx;
height: 70rpx;
line-height: 70rpx;
border-radius: 12rpx;
color: #777777;
border: 2rpx solid #D3D3D3;
font-size: 28rpx;
text-align: center;
&:not(:nth-last-child(1)) {
margin-right: 24rpx;
}
}
.fuck-active {
color: #FC452F;
border: 2rpx solid #FC452F;
font-weight: 600;
}
}
.afterSales-type-tip {
font-size: 20rpx;
color: #FC452F;
}
}
.scroll-wrap {
margin: 0 20rpx;
background: #FFFFFF;
border-radius: 16rpx;
padding: 20rpx 20rpx 1rpx;
box-sizing: border-box;
.goods {
.goods-item {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between;
margin-bottom: 30rpx;
&:active { .goods-item-left {
color: rgba(#20B128, 0.8); display: flex;
transition: background-color 0.5s; align-items: center;
animation: disappear 0.5s 0.5s forwards;
.goods-item-left-img {
margin-right: 20rpx;
}
.goods-item-left-info {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 164rpx;
.goods_name {
font-size: 28rpx;
color: #060606;
max-width: 400rpx;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.goods_detail {
display: flex;
align-items: center;
.goods-detail_num {
margin-right: 30rpx;
font-size: 28rpx;
color: #333333;
}
.goods_detail_price {
display: flex;
.symbol {
align-self: flex-end;
font-size: 22rpx;
color: #333333;
}
.numbers {
font-size: 32rpx;
color: #333333;
}
}
}
}
}
.goods-item-right {
image {
width: 48rpx;
height: 48rpx;
}
} }
} }
} }
} }
.row {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 20rpx;
border-bottom: 1rpx solid #f6f6f6;
margin-bottom: 20rpx;
&:last-child {
border-bottom: none;
margin-bottom: 0;
}
.content {
.top {
display: flex;
view {
margin-right: 20rpx;
}
}
.bottom {}
}
image {
width: 40rpx;
height: 40rpx;
flex-shrink: 0;
}
}
} }
@keyframes disappear { @keyframes disappear {