Loki
/
fish-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

售后申请部分改动

master
2021 4 years ago
parent
02534e936a
commit
66d9ba83d5
6 changed files with 545 additions and 143 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 64
      api/aftersales.js
  2. 277
      pages/order/GoodsReturn/index.vue
  3. 15
      pages/order/OrderDetails/index.vue
  4. 89
      pages/order/ReturnList/index.vue
  5. 73
      pages/order/ReturnList/listItem.vue
  6. 2
      utils/request.js

64
api/aftersales.js
Unescape View File

@ -0,0 +1,64 @@
import request from '@/utils/request'
// 提交售后
/**
*
订单号 orderCode;
服务类型 0仅退款1退货退款 serviceType;
申请原因 reasonForApplication;
申请说明 applicationInstructions;
申请说明图片 applicationDescriptionPicture;
商品数据 productParamList;
*/
export function submitAfterSealsOrder(data) {
return request.post(`/applyForAfterSales`, data, {
login: true
});
}
// 售后订单列表
export function getAfterSealsList (params) {
return request.get('/storeAfterSales/list', params, {
login: true,
});
}
// 售后详情
export function getAfterSalesDeatail(key) {
return request.get(`/applyForAfterSales/${key}`);
}
// 查询订单
export function getAfterSealsDetail (key, id) {
return request.get(`/api/store/detail/${key}/${id}`)
}
// 搜索
export function searchAfterSealsDetail (key) {
return request.get(`/api/store/detail/${key}`)
}
// 撤销售后订单
export function rebackAfterSeals (key, id) {
return request.get(`/api/revoke/revoke/${key}/${id}`)
}
// 获取物流信息
export function getExpressData () {
return request.get('/api/yxExpress')
}
// 添加快递单号
export function addExpressData (params) {
return request.post('/api/addLogisticsInformation', params, {
login: true
})
}
// 删除售后订单
export function deleteAfterSeals (params) {
return request.delete('/api/deleteAfterSalesOrder', params, {
login: true
})
}

277
pages/order/GoodsReturn/index.vue
Unescape View File

@ -1,9 +1,10 @@
<!-- 售后提交 -->
<template> <template>
<view class="apply-return"> <view class="apply-return">
<!-- 售后提交 --> <!-- 申请售后 -->
<view class="container" v-if="selected"> <view class="container" v-if="selected">
<view class="goodsStyle acea-row row-between" <view class="goodsStyle acea-row row-between"
v-for="cart in orderInfo.cartInfo" v-for="cart in selectProduct"
:key="cart.id" :key="cart.id"
> >
<view class="pictrue"> <view class="pictrue">
@ -24,13 +25,13 @@
</view> </view>
</view> </view>
<view class="list"> <view class="list">
<view class="item acea-row row-between-wrapper"> <view v-if="serviceType === 1" class="item acea-row row-between-wrapper">
<view>退货件数</view> <view>退货件数</view>
<view class="num">{{ orderInfo.totalNum }}</view> <view class="num">{{ totalNum || 0 }}</view>
</view> </view>
<view class="item acea-row row-between-wrapper"> <view class="item acea-row row-between-wrapper">
<view>退款金额</view> <view>退款金额</view>
<view class="num">￥{{ orderInfo.payPrice }}</view> <view class="num">￥{{ totalMoney || 0 }}</view>
</view> </view>
<picker :value="reason" :range="reasonList" @change="changeReason"> <picker :value="reason" :range="reasonList" @change="changeReason">
<view class="item acea-row row-between-wrapper"> <view class="item acea-row row-between-wrapper">
@ -41,52 +42,97 @@
</picker> </picker>
<view class="item textarea acea-row row-between"> <view class="item textarea acea-row row-between">
<view>备注说明</view> <view>备注说明</view>
<textarea placeholder="填写备注信息，100字以内" class="num" v-model="refund_reason_wap_explain"></textarea> <textarea class="num"
placeholder="填写备注信息，100字以内"
v-model="refund_reason_wap_explain"
></textarea>
</view> </view>
</view> </view>
<view class="returnBnt bg-color-red" @click="submit">申请退款</view> <view v-if="serviceType === 0" class="returnBnt bg-color-red" @click="submit">申请退款</view>
<view v-if="serviceType === 1" class="returnBnt bg-color-red" @click="submit">申请退货</view>
</view> </view>
<!-- 选择商品 --> <!-- 选择商品 -->
<view class="selectProduct"> <view class="selectProduct" v-else>
<view class="goodsStyle acea-row row-between" <view class="selectContainer"
v-for="cart in orderInfo.cartInfo" v-for="(cart, index) in selectProduct"
:key="cart.id" :key="cart.id"
> >
<view class="checkbox-wrapper">
<checkbox-group @change="switchSelect(index)">
<label class="well-check">
<checkbox color="#eb3729" value :checked="cart.checked"></checkbox>
</label>
</checkbox-group>
</view>
<view class="pictrue"> <view class="pictrue">
<image :src="cart.productInfo.image" class="image" /> <image :src="cart.productInfo.image" class="image" />
</view> </view>
<view class="text acea-row row-between"> <view class="content">
<view class="name line2">{{ cart.productInfo.storeName }}</view> <view class="title">{{ cart.productInfo.storeName || '' }}</view>
<view class="skus">
<view class="sku">
{{ cart.productInfo.attrInfo.sku || '' }}
</view>
<view class="num">x{{ cart.cartNum || 0 }}</view>
</view>
<view class="money"> <view class="money">
<view> ￥<view>
￥{{ {{
cart.productInfo.attrInfo cart.productInfo.attrInfo
? cart.productInfo.attrInfo.price ? cart.productInfo.attrInfo.price
: cart.productInfo.price : cart.productInfo.price
}} }}
</view> </view>
<view class="num">x{{ cart.cartNum }}</view>
</view> </view>
</view> </view>
</view> </view>
<view class="choose">
<view class="checkTotal">
<checkbox-group @change="allChecked">
<label class="well-check">
<checkbox
color="#eb3729"
value="allSelect"
:checked="isAllSelect"
></checkbox>
<text class="checkAll">全选 ({{ cartCount || 0 }})</text>
</label>
</checkbox-group>
<view class="total">
<view class="proTotal">
{{ orderInfo.totalNum || 0 }}件商品
</view>
<view class="moneyTotal">
合计 ￥ {{ orderInfo.totalPrice || 0 }}
</view>
</view>
</view>
<view class="typeBtn">
<view class="button def" @click="chooseType(0)">仅退款</view>
<view class="button redBtn" @click="chooseType(1)">退货退款</view>
</view>
</view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import { import {
orderDetail, orderDetail,
getRefundReason, getRefundReason,
postOrderRefund postOrderRefund
} from "@/api/order"; } from "@/api/order";
import { import {
submitAfterSealsOrder
} from '@/api/aftersales.js';
import {
trim trim
} from "@/utils"; } from "@/utils";
import { import {
VUE_APP_API_URL VUE_APP_API_URL
} from "@/config"; } from "@/config";
export default { export default {
name: "goodsReturn", name: "goodsReturn",
components: { components: {
// VueCoreImageUpload // VueCoreImageUpload
@ -98,13 +144,19 @@
Authorization: "Bearer " + this.$store.state.token Authorization: "Bearer " + this.$store.state.token
}, },
id: 0, id: 0,
selected: true, selected: false,
orderInfo: {}, orderInfo: {},
rebackList: [], rebackList: [],
reasonList: [], reasonList: [],
reason: "", reason: "",
refund_reason_wap_explain: "", refund_reason_wap_explain: '',
refund_reason_wap_img: [] refund_reason_wap_img: [],
serviceType: null,
// 选中售后商品
selectProduct: [],
totalNum: 0,
totalMoney: 0,
isAllSelect: false
}; };
}, },
mounted() { mounted() {
@ -128,11 +180,29 @@
this.refund_reason_wap_img.push(res.data.url); this.refund_reason_wap_img.push(res.data.url);
}, },
getOrderDetail() { getOrderDetail() {
uni.showLoading({
title: '正在查询商品',
duration: 2000,
})
orderDetail(this.id) orderDetail(this.id)
.then(res => { .then(res => {
this.orderInfo = res.data; this.orderInfo = res.data;
this.selectProduct = res.data.cartInfo.map(item => {
item.checked = false
return item
})
if (res.data.cartInfo.length === 0) {
uni.showToast({
title: "订单无可售后商品",
icon: 'none',
duration: 2000
});
return
}
uni.hideLoading()
}) })
.catch(err => { .catch(err => {
uni.hideLoading()
uni.showToast({ uni.showToast({
title: err.msg || err.response.data.msg|| err.response.data.message, title: err.msg || err.response.data.msg|| err.response.data.message,
icon: 'none', icon: 'none',
@ -145,10 +215,39 @@
this.reasonList = res.data; this.reasonList = res.data;
}); });
}, },
// 选择退款商品
switchSelect (index) {
let isAll = true
this.selectProduct[index].checked = !this.selectProduct[index].checked
this.selectProduct.forEach(item => {
if (!item.checked) {
isAll = false
}
})
this.isAllSelect = isAll
},
// 全选
allChecked () {
this.isAllSelect = !this.isAllSelect
this.selectProduct.forEach(item => {
item.checked = this.isAllSelect
})
},
// 选择退款类型
chooseType (val) {
this.selectProduct = this.selectProduct.map(item => {
if (item.checked) {
this.totalMoney += parseFloat(item.costPrice)
this.totalNum += 1
return item
}
}).filter(r => r)
this.selected = true;
this.serviceType = val;
},
submit() { submit() {
const refund_reason_wap_explain = trim(this.refund_reason_wap_explain), const refund_reason_wap_explain = trim(this.refund_reason_wap_explain);
text = this.reason; if (!this.reason) {
if (!text) {
uni.showToast({ uni.showToast({
title: "请选择退款原因", title: "请选择退款原因",
icon: 'none', icon: 'none',
@ -156,21 +255,27 @@
}); });
return return
} }
postOrderRefund({ // this.listquery.productParamList.push({
text, // productId: item.productId
uni: this.orderInfo.orderId, // })
refund_reason_wap_img: this.refund_reason_wap_img.join(","), submitAfterSealsOrder({
refund_reason_wap_explain orderCode: this.orderInfo.orderId,
}) serviceType: this.serviceType,
.then(res => { reasonForApplication: this.reason,
applicationInstructions: refund_reason_wap_explain,
applicationDescriptionPicture: this.refund_reason_wap_img.join(","),
productParamList: []
}).then(res => {
if (res.status === 200) {
uni.showToast({ uni.showToast({
title: res.msg, title: res.msg,
icon: "success", icon: "success",
duration: 2000 duration: 2000
}); });
setTimeout(() => { setTimeout(() => {
this.$yrouter.back(); this.$yrouter.push({ path: '/pages/order/ReturnList/index' });
}, 1500); }, 1500)
}
}) })
.catch(err => { .catch(err => {
uni.showToast({ uni.showToast({
@ -181,5 +286,101 @@
}); });
} }
} }
}; };
</script> </script>
<style lang="scss" scoped>
.apply-return{
.selectProduct{
margin-bottom: 180rpx;
.selectContainer{
padding: 20rpx 32rpx;
background-color: #FFF;
display: flex;
align-items: center;
.pictrue{
.image{
width: 180rpx;
height: 180rpx;
}
}
.content{
width: 100%;
height: 100%;
margin-left: 16rpx;
font-size: 24rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
.title{
width: 100%;
height: 80rpx;
text-overflow: ellipsis;
font-size: 28rpx;
}
.skus{
display: flex;
justify-content: space-between;
color: #999999;
}
.money{
margin-top: 10rpx;
display: flex;
view{
color: #EB3729;
}
}
}
}
.choose{
width: 100%;
padding: 20rpx 30rpx;
background-color: #FFF;
position: fixed;
bottom: 0;
height: 180rpx;
.checkTotal{
height: 80rpx;
font-size: 28rpx;
border-bottom: 2rpx solid #F3F4F5;
display: flex;
justify-content: space-between;
align-items: center;
.total{
display: flex;
.proTotal{
color: #666;
}
.moneyTotal{
color: #333;
margin-left: 30rpx;
}
}
}
.typeBtn{
margin-top: 10rpx;
display: flex;
justify-content: flex-end;
align-items: center;
.button{
width: 160rpx;
height: 60rpx;
margin: 0 10rpx;
line-height: 60rpx;
text-align: center;
font-size: 24rpx;
border-radius: 180rpx;
}
.def{
color: #AAAAAA;
border: 2rpx solid #DDDDDD;
}
.redBtn{
color: #FFF;
background-color: #EB3729;
}
}
}
}
}
</style>

15
pages/order/OrderDetails/index.vue
Unescape View File

@ -100,7 +100,10 @@
<view class="name"> <view class="name">
{{ orderInfo.realName }} {{ orderInfo.realName }}
<text class="phone">{{ orderInfo.userPhone }}</text> <text class="phone">{{ orderInfo.userPhone }}</text>
<text @click="telPhone(orderInfo.userPhone)" class="iconfont icon-tonghua font-color-red"></text> <text
@click="telPhone(orderInfo.userPhone)"
class="iconfont icon-tonghua font-color-red"
></text>
</view> </view>
<view>{{ orderInfo.userAddress }}</view> <view>{{ orderInfo.userAddress }}</view>
</view> </view>
@ -118,7 +121,11 @@
<image :src="`${$VUE_APP_RESOURCES_URL}/images/line.jpg`" /> <image :src="`${$VUE_APP_RESOURCES_URL}/images/line.jpg`" />
</view> </view>
</template> </template>
<OrderGoods :evaluate="status.type || 0" :isIntegral="isIntegral" :cartInfo="orderInfo.cartInfo || []"></OrderGoods> <OrderGoods
:evaluate="status.type || 0"
:isIntegral="isIntegral"
:cartInfo="orderInfo.cartInfo || []"
></OrderGoods>
<view class="wrapper"> <view class="wrapper">
<view class="item acea-row row-between"> <view class="item acea-row row-between">
<view>订单编号：</view> <view>订单编号：</view>
@ -233,8 +240,8 @@
<view class="bnt cancel" @click="cancelOrder">取消订单</view> <view class="bnt cancel" @click="cancelOrder">取消订单</view>
<view class="bnt bg-color-red" @click="pay = true">立即付款</view> <view class="bnt bg-color-red" @click="pay = true">立即付款</view>
</template> </template>
<template v-if="status.type == 1"> <template v-if="orderInfo.refundStatus === 0 && orderInfo.paid === 1">
<view class="bnt cancel" @click="goGoodsReturn(orderInfo)">申请退款</view> <view class="bnt cancel" @click="goGoodsReturn(orderInfo)">申请售后</view>
</template> </template>
<!-- --> <!-- -->
<template v-if="orderInfo.shippingType == 1 && status.type == 2"> <template v-if="orderInfo.shippingType == 1 && status.type == 2">

89
pages/order/ReturnList/index.vue
Unescape View File

@ -1,9 +1,28 @@
<template> <template>
<view class="return-list" ref="container"> <view class="return-list" ref="container">
<view class="goodWrapper" v-for="(order,orderListIndex) in orderList" :key="orderListIndex"> <!-- 分类查询 -->
<view class="nav">
<view class="item" :class="{ on: listQuery.type === 0 }" @click="changeType(0)">
<view>全部</view>
</view>
<view class="item" :class="{ on: listQuery.type === 1 }" @click="changeType(1)">
<view>售后中</view>
</view>
<view class="item" :class="{ on: listQuery.type === 2 }" @click="changeType(2)">
<view>已完成</view>
</view>
</view>
<!-- 商品列表 -->
<!-- <view class="list">
<ListItem />
</view> -->
<view class="goodWrapper"
v-for="(order,orderListIndex) in orderList"
:key="orderListIndex"
>
<view class="iconfont icon-tuikuanzhong powder" v-if="order._status._type === -1"></view> <view class="iconfont icon-tuikuanzhong powder" v-if="order._status._type === -1"></view>
<view class="iconfont icon-yituikuan" v-if="order._status._type === -2"></view> <view class="iconfont icon-yituikuan" v-if="order._status._type === -2"></view>
<view class="orderNum">订单号：{{ order.orderId }}</view> <view class="orderNum">订单号：{{ order.orderId || '' }}</view>
<view <view
class="item acea-row row-between-wrapper" class="item acea-row row-between-wrapper"
v-for="(cart,cartInfoIndex) in order.cartInfo" v-for="(cart,cartInfoIndex) in order.cartInfo"
@ -30,7 +49,7 @@
共{{ order.cartInfo.length || 0 }}件商品，总金额 共{{ order.cartInfo.length || 0 }}件商品，总金额
<text <text
class="font-color-red price" class="font-color-red price"
>￥{{ order.payPrice }}</text> >￥{{ order.payPrice || 0 }}</text>
</view> </view>
</view> </view>
<view class="noCart" v-if="orderList.length === 0 && page > 1"> <view class="noCart" v-if="orderList.length === 0 && page > 1">
@ -44,22 +63,34 @@
<script> <script>
import { getOrderList } from "@/api/order"; import { getOrderList } from "@/api/order";
import { getAfterSealsList } from "@/api/aftersales.js";
import Loading from "@/components/Loading"; import Loading from "@/components/Loading";
import ListItem from './listItem.vue'
export default { export default {
name: "ReturnList", name: "ReturnList",
components: { components: {
Loading Loading,
ListItem
}, },
data() { data() {
return { return {
orderList: [], orderList: [],
listQuery: {
page: 1, page: 1,
limit: 20, limit: 20,
type: 0
},
loading: false, loading: false,
loaded: false loaded: false
}; };
}, },
mounted() {
this.getOrderList();
},
onReachBottom() {
!this.loading && this.getOrderList();
},
methods: { methods: {
goGoodsCon(cart) { goGoodsCon(cart) {
this.$yrouter.push({ this.$yrouter.push({
@ -78,23 +109,49 @@ export default {
const { page, limit } = this; const { page, limit } = this;
if (this.loading || this.loaded) return; if (this.loading || this.loaded) return;
this.loading = true; this.loading = true;
getOrderList({ // getOrderList({
page, // page,
limit, // limit,
type: -3 // type: -3
}).then(res => { // }).then(res => {
// this.orderList = this.orderList.concat(res.data);
// this.loading = false;
// this.loaded = res.data.length < limit;
// this.page++;
// });
// 售后接口
getAfterSealsList(this.listQuery).then(res => {
// console.log(res)
this.orderList = this.orderList.concat(res.data); this.orderList = this.orderList.concat(res.data);
this.loading = false; this.loading = false;
this.loaded = res.data.length < limit; this.loaded = res.data.length < limit;
this.page++; this.page++;
}); })
}
},
mounted() {
this.getOrderList();
}, },
onReachBottom() { changeType (type) {
!this.loading && this.getOrderList(); this.listQuery.type = type
this.getOrderList()
}
} }
}; };
</script> </script>
<style scoped lang="scss">
.return-list{
.nav{
background-color: #FFF;
display: flex;
justify-content: space-around;
.item{
height: 80rpx;
line-height: 80rpx;
font-size: 14px;
font-family: PingFang SC;
color: #333333;
}
.on{
border-bottom: 6rpx solid #EB3729;
}
}
}
</style>

73
pages/order/ReturnList/listItem.vue
Unescape View File

@ -0,0 +1,73 @@
<!-- 售后列表内容 -->
<template>
<view class="productItem">
<view class="title">
<view class="shopName">
{{ 'YSHOP商铺' }}
</view>
<view class="status">
<view>审核中</view>
</view>
</view>
<view class="content">
<image src="" mode=""></image>
<view class="info">
<view class="infoTitle">
工装裤男秋冬季韩版潮流潮牌ins直筒宽松阔腿休闲百搭加绒长裤子
</view>
<view class="infoSku">
<view class="sku">
黑色 XL
</view>
<view class="num">
x {{ 1 }}
</view>
</view>
<view class="infoMoney">
退款：￥299.00
</view>
</view>
</view>
<view class="money">
</view>
<view class="btns">
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.productItem{
margin: 10rpx 0;
background-color: #FFF;
.title{
height: 80rpx;
padding: 0 30rpx;
color: #333;
font-size: 14px;
display: flex;
justify-content: space-between;
align-items: center;
}
.content{
padding: 20rpx 30rpx;
display: flex;
}
.money{
height: 80rpx;
padding: 0 30rpx;
display: flex;
justify-content: space-between;
}
.btns{
height: 50rpx;
padding: 0 30rpx;
display: flex;
justify-content: flex-end;
}
}
</style>

2
utils/request.js
Unescape View File

@ -20,7 +20,7 @@ import cookie from '@/utils/store/cookie'
const fly = new Fly() const fly = new Fly()
fly.config.baseURL = VUE_APP_API_URL fly.config.baseURL = VUE_APP_API_URL
// 小程序请求域名 // 小程序测试请求域名
// #ifdef MP-WEIXIN // #ifdef MP-WEIXIN
fly.config.baseURL = 'http://347i13244b.zicp.vip/api' fly.config.baseURL = 'http://347i13244b.zicp.vip/api'
// #endif // #endif

Write Preview
Loading…
Cancel
Save