26 changed files with 1317 additions and 181 deletions
@ -0,0 +1,143 @@ |
|||
// uploadImages/uploadImg.js
|
|||
const WXAPI = require('../../utils/config.js') |
|||
Component({ |
|||
/** |
|||
* 组件的属性列表 |
|||
*/ |
|||
properties: { |
|||
count: { //最多选择图片的张数,默认9张
|
|||
type: Number, |
|||
value: 9 |
|||
}, |
|||
uploadUrl: { //图片上传的服务器路径
|
|||
type: String, |
|||
value: '' |
|||
}, |
|||
showUrl: { //图片的拼接路径
|
|||
type: String, |
|||
value: '' |
|||
}, |
|||
albumType: { //album 从相册选图,camera 使用相机,默认二者都有
|
|||
type: String, |
|||
value: '' |
|||
}, |
|||
detailPics: { |
|||
type: Array, |
|||
value: [] |
|||
} |
|||
}, |
|||
|
|||
/** |
|||
* 组件的初始数据 |
|||
*/ |
|||
data: { |
|||
detailPics: [], //上传的结果图片集合
|
|||
}, |
|||
onShow() { |
|||
console.log(1) |
|||
}, |
|||
/** |
|||
* 组件的方法列表 |
|||
*/ |
|||
methods: { |
|||
/** |
|||
* 上传详细图片 |
|||
*/ |
|||
uploadDetailImage: function (e) { //这里是选取图片的方法
|
|||
var that = this; |
|||
var pics = []; |
|||
var detailPics = that.data.detailPics; |
|||
if (detailPics.length >= that.data.count) { |
|||
wx.showToast({ |
|||
title: '最多选择' + that.data.count + '张!', |
|||
}) |
|||
return; |
|||
} |
|||
wx.chooseMedia({ |
|||
count: that.data.count, // 最多可以选择的图片张数,默认9
|
|||
sizeType: ['original', 'compressed'], // original 原图,compressed 压缩图,默认二者都有
|
|||
sourceType: that.data.albumType == '0' ? ['camera'] : ['album', 'camera'], // album 从相册选图,camera 使用相机,默认二者都有
|
|||
success: function (res) { |
|||
var imgs = res.tempFiles; |
|||
var ticket = wx.getStorageSync('ticket'); |
|||
var urlArr = [] |
|||
for (var i = 0; i < imgs.length; i++) { |
|||
pics.push(imgs[i]) |
|||
var url = imgs[i].tempFilePath |
|||
//取得文件的后缀
|
|||
var extensiton = url.substr(url.lastIndexOf('.') + 1).toLowerCase(); |
|||
// 根据时间戳生成唯一的主文件名称
|
|||
var mainname = '' + Date.now() + Math.ceil(Math.random() * 9999); |
|||
var uploadUrl = WXAPI.API_BASE_URL + 'Common/UploadUserFile?ticket=' + ticket + '&name=' + mainname + '.' + extensiton; |
|||
urlArr.push(uploadUrl) |
|||
} |
|||
that.uploadImg({ |
|||
url: urlArr, //这里是你图片上传的接口
|
|||
path: pics, //这里是选取的图片的地址数组
|
|||
}); |
|||
}, |
|||
}) |
|||
}, |
|||
//多张图片上传
|
|||
uploadImg: function (data) { |
|||
// console.log(this.globalData.openId)
|
|||
wx.showLoading({ |
|||
title: '上传中...', |
|||
mask: true, |
|||
}) |
|||
var that = this, |
|||
i = data.i ? data.i : 0, |
|||
success = data.success ? data.success : 0, |
|||
fail = data.fail ? data.fail : 0; |
|||
wx.uploadFile({ |
|||
url: data.url[i], |
|||
header: { 'content-type': 'multipart/form-data' }, |
|||
filePath: data.path[i].tempFilePath, |
|||
name: 'image', |
|||
formData: { "openid": '1' }, |
|||
success: (resp) => { |
|||
wx.hideLoading(); |
|||
success++; |
|||
var info = JSON.parse(resp.data);//返回的结果,可能不同项目结果不一样
|
|||
// console.log(info)
|
|||
var picName = that.data.showUrl + info.data.url; |
|||
var detailPics = that.data.detailPics; |
|||
detailPics.push(picName) |
|||
that.setData({ |
|||
detailPics: detailPics |
|||
}) |
|||
}, |
|||
fail: (res) => { |
|||
fail++; |
|||
console.log('fail:' + i + "fail:" + fail); |
|||
}, |
|||
complete: () => { |
|||
i++; |
|||
if (i == data.path.length) { //当图片传完时,停止调用
|
|||
console.log('执行完毕'); |
|||
// console.log('成功:' + success + " 失败:" + fail);
|
|||
var eventDetail = { |
|||
picsList: that.data.detailPics |
|||
} // detail对象,提供给事件监听函数
|
|||
var eventOption = {} // 触发事件的选项
|
|||
that.triggerEvent('event', eventDetail, eventOption) |
|||
} else { //若图片还没有传完,则继续调用函数
|
|||
data.i = i; |
|||
data.success = success; |
|||
data.fail = fail; |
|||
that.uploadImg(data); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
//预览图片
|
|||
imagePreview: function (e) { |
|||
console.log(e.target.dataset) |
|||
var current = e.target.dataset.src; |
|||
wx.previewImage({ |
|||
current: current, // 当前显示图片的http链接
|
|||
urls: this.data.detailPics // 需要预览的图片http链接列表
|
|||
}) |
|||
}, |
|||
} |
|||
}) |
@ -0,0 +1,4 @@ |
|||
{ |
|||
"component": true, |
|||
"usingComponents": {} |
|||
} |
@ -0,0 +1,19 @@ |
|||
<!--uploadImages/uploadImg.wxml--> |
|||
<view class='content'> |
|||
<!-- <view class='img-box'> --> |
|||
<scroll-view class='img-box' scroll-x="true"> |
|||
<view class='img-list'> |
|||
<block wx:for="{{detailPics}}" wx:key="index"> |
|||
<view class='img-item'> |
|||
<image src='{{item}}' mode="aspectFill" bindtap="imagePreview" bindlongpress="longpressImg"></image> |
|||
</view> |
|||
</block> |
|||
<view class='chooseImg' bindtap='uploadDetailImage'> |
|||
<!-- <view class="weui-uploader__input-box"></view> --> |
|||
<image class="weui-uploader__input-box" src="/images/upload.png"></image> |
|||
</view> |
|||
</view> |
|||
<!-- <view class='tips'>长按对应的图片即可删除</view> --> |
|||
</scroll-view> |
|||
<!-- </view> --> |
|||
</view> |
@ -0,0 +1,76 @@ |
|||
/* uploadImages/uploadImg.wxss */ |
|||
page { |
|||
background-color: #f1f0f5; |
|||
} |
|||
|
|||
.content { |
|||
width: 100%; |
|||
background-color: #fff; |
|||
} |
|||
|
|||
.img-box { |
|||
width: 100%; |
|||
margin-left: 35rpx; |
|||
margin-right: 35rpx; |
|||
} |
|||
|
|||
.img-list { |
|||
display: flex; |
|||
display: -webkit-flex; |
|||
flex-direction: row; |
|||
justify-content: flex-start; |
|||
align-items: center; |
|||
/* flex-wrap: wrap; */ |
|||
} |
|||
|
|||
.img-item { |
|||
width: 150rpx; |
|||
text-align: left; |
|||
margin-right: 20rpx; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
|
|||
.img-item image { |
|||
width: 150rpx; |
|||
height: 150rpx; |
|||
} |
|||
|
|||
.chooseImg { |
|||
background-color: #fff; |
|||
} |
|||
|
|||
.weui-uploader__input-box { |
|||
float: left; |
|||
position: relative; |
|||
margin-right: 9px; |
|||
margin-bottom: 9px; |
|||
width: 150rpx; |
|||
height: 150rpx; |
|||
/* border: 1px solid #d9d9d9; */ |
|||
} |
|||
|
|||
/* .weui-uploader__input-box:after, .weui-uploader__input-box:before { |
|||
content: " "; |
|||
position: absolute; |
|||
top: 50%; |
|||
left: 50%; |
|||
-webkit-transform: translate(-50%, -50%); |
|||
transform: translate(-50%, -50%); |
|||
background-color: #d9d9d9; |
|||
} */ |
|||
|
|||
.weui-uploader__input-box:before { |
|||
width: 2px; |
|||
height: 35px; |
|||
} |
|||
|
|||
.weui-uploader__input-box:after { |
|||
width: 35px; |
|||
height: 2px; |
|||
} |
|||
|
|||
.tips { |
|||
color: #666; |
|||
font-size: 25rpx; |
|||
padding-bottom: 20rpx; |
|||
} |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 2.2 KiB |
@ -0,0 +1,214 @@ |
|||
// pages/aftersales/apply.js
|
|||
var app = getApp() |
|||
var WXAPI = require('../../utils/server.js'); |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
refund_type: '', // 区分退款方式1退货退款,2仅退款, 3换货
|
|||
order: "", |
|||
r_status: '', // 商品当前状态
|
|||
content: '', |
|||
orderId: '', |
|||
srcList: [], |
|||
re_price: '', |
|||
remark: '', |
|||
return_suess: false, |
|||
order: {}, |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad(options) { |
|||
console.log(options) |
|||
this.setData({ |
|||
refund_type: options.refund_type, |
|||
orderId:options.orderId |
|||
}); |
|||
this.loadData(options.orderId); |
|||
}, |
|||
loadData: function (orderId) { |
|||
var that = this; |
|||
WXAPI.returnMethod({ |
|||
accessId: app.globalData.accessId, |
|||
storeId: 239, |
|||
storeType: 1, |
|||
order_details_id: orderId, |
|||
}).then(res => { |
|||
if (res.code == 200) { |
|||
var data = res.data |
|||
that.setData({ |
|||
re_price: data.refund_price, |
|||
refund_price: data.refund_price, |
|||
order: data.list, |
|||
status: data.status, |
|||
refund_only_status: data.refund_only_status, |
|||
return_refund_status: data.return_refund_status, |
|||
exchange_goods_status: data.exchange_goods_status, |
|||
orderType: data.orderType |
|||
}); |
|||
} |
|||
}) |
|||
}, |
|||
refundPriceInput: function(e) { |
|||
this.setData({ |
|||
re_price: e.detail.value |
|||
}) |
|||
}, |
|||
chooseImage: function (e) { |
|||
var that = this; |
|||
// 选择图片
|
|||
wx.chooseMedia({ |
|||
count: 3, // 默认9
|
|||
sizeType: ['original', 'compressed'], // original 原图,compressed 压缩图,默认二者都有
|
|||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
|
|||
success: function (res) { |
|||
var tempFiles = res.tempFiles; |
|||
var images = that.data.srcList; |
|||
if (images.length > 2) { |
|||
wx.showToast({ |
|||
title: '亲!最多上传3张哦!', |
|||
icon: 'none', |
|||
duration: 2000 |
|||
}); |
|||
} else { |
|||
if (images) { |
|||
images = images.concat(tempFiles); |
|||
} else { |
|||
images = tempFiles; |
|||
} |
|||
that.setData({ |
|||
srcList: images, |
|||
}); |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
deleteAct: function (e) { |
|||
var index = e.currentTarget.dataset.index; |
|||
var that = this; |
|||
if (that.data.srcList.length > 0) { |
|||
that.data.srcList.splice(index, 1) |
|||
that.setData({ |
|||
srcList: that.data.srcList |
|||
}); |
|||
} else { |
|||
return; |
|||
} |
|||
}, |
|||
remarkInput: function(e) { |
|||
this.setData({ |
|||
remark: e.detail.value |
|||
}) |
|||
}, |
|||
confirmAct() { |
|||
var that = this |
|||
if (that.data.srcList.length == 0) { |
|||
WXAPI.returnData({ |
|||
accessId: app.globalData.accessId, |
|||
storeId: 239, |
|||
storeType: 1, |
|||
order_details_id: that.data.orderId, |
|||
refund_amount: that.data.refund_price, |
|||
explain: that.data.remark, |
|||
type: that.data.refund_type, |
|||
refund_apply_money: that.data.re_price, |
|||
}).then(res => { |
|||
if (res.code == 200) { |
|||
var data = res.data |
|||
that.setData({ |
|||
return_suess: true, |
|||
order: data |
|||
}); |
|||
} |
|||
}) |
|||
} else { |
|||
wx.uploadFile({ |
|||
url: 'https://mall.gylservice.com/gw?api=app.order.ReturnData', |
|||
filePath: this.data.srcList[0].tempFilePath, |
|||
name: 'file', |
|||
header: { |
|||
'content-type': 'multipart/form-data' |
|||
}, // 设置请求的 header
|
|||
formData: { |
|||
accessId: app.globalData.accessId, |
|||
storeId: 239, |
|||
storeType: 1, |
|||
order_details_id: that.data.orderId, |
|||
refund_amount: that.data.refund_price, |
|||
explain: that.data.remark, |
|||
type: that.data.refund_type, |
|||
upload_z_num: 1, |
|||
upload_num: 0, |
|||
refund_apply_money: that.data.re_price, |
|||
}, // HTTP 请求中其他额外的 form data
|
|||
success: function (res) { |
|||
console.log(res); |
|||
var data = JSON.parse(res.data) |
|||
that.setData({ |
|||
return_suess: true, |
|||
order: data |
|||
}); |
|||
}, |
|||
fail: function (res) { |
|||
console.log(res); |
|||
} |
|||
}) |
|||
} |
|||
}, |
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload() { |
|||
if (this.data.return_suess == true) { |
|||
wx.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
} |
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage() { |
|||
|
|||
} |
|||
}) |
@ -0,0 +1,4 @@ |
|||
{ |
|||
"usingComponents": {}, |
|||
"navigationBarTitleText": "申请售后" |
|||
} |
@ -0,0 +1,123 @@ |
|||
<!--viewages/aftersales/aviewviewly.wxml--> |
|||
<view class="container"> |
|||
<view wx:if="{{!return_suess}}" style="position: relative;overflow: hidden;"> |
|||
<view class="order_goods"> |
|||
<view class="order_two" wx:for="{{order}}" wx:key="index"> |
|||
<image src="{{item.image}}" class="shopImage" /> |
|||
<view class="order_two_a" bindtap="_goods(item.p_id,item.recycle,item.pluginId)"> |
|||
<view class="order_p_name">{{ item.p_name }}</view> |
|||
<view class="price_num"> |
|||
<view class="price"> |
|||
<view class="price_symbol">¥{{item.p_price}}</view> |
|||
</view> |
|||
<view class="color_two">x{{ item.num }}</view> |
|||
</view> |
|||
<view class="color_one">{{ item.size }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="refund_pay"> |
|||
<view class="right_d"> |
|||
<view class="right_d_view"> |
|||
<view class="leftText"> |
|||
<view>售后类型:</view> |
|||
</view> |
|||
<view class="rightText" wx:if="{{refund_type==2}}">仅退款</view> |
|||
<view class="rightText" wx:if="{{refund_type==1}}">退货退款</view> |
|||
<view class="rightText" wx:if="{{refund_type==3}}">换货</view> |
|||
</view> |
|||
</view> |
|||
<view wx:if="{{r_status != 3 && refund_type != 3}}"> |
|||
<view class="right_d"> |
|||
<view class="right_d_view"> |
|||
<view class="leftText">退款金额:</view> |
|||
<view class="refund_color font_red">¥</view> |
|||
<input class="refund_color font_red" type="number" value="{{re_price}}" bindinput="refundPriceInput" /> |
|||
</view> |
|||
<view class="right_d_right"> |
|||
<view class="refund_color yh-refund_color">最多¥{{ refund_price }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view wx:if="{{r_status == 3}}" style="display: flex;justify-content: start;"> |
|||
<view class="leftText"> |
|||
<view>退款说明:</view> |
|||
</view> |
|||
<view>ddfddf</view> |
|||
</view> |
|||
|
|||
<view style="display:flex;"> |
|||
<view class="leftText"> |
|||
<view>{{ r_status != 3 ? ( refund_type != 3 ? '退款说明:' : '申请原因:' ) : '申请原因:' }}</view> |
|||
</view> |
|||
<view class="input"> |
|||
<textarea class="input_text" rows="4" auto-height="true" placeholder="最多100字" placeholder-style="color:#b8b8b8" bindinput="remarkInput" /> |
|||
<view class='words_num'> |
|||
<view>{{remark.length}}</view>/100 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="evaluat_imageBox"> |
|||
<view class="yh-evaluat_view leftText"> |
|||
<view>上传凭证:</view> |
|||
</view> |
|||
<view class="evaluat_view" wx:for="{{srcList}}" wx:key="index"> |
|||
<image class="evaluat_image" src="{{item.tempFilePath}}" bindtap="touchstartAct" /> |
|||
<image class="image_dele" src="/images/delete.png" data-index="{{index}}" bindtap="deleteAct" /> |
|||
</view> |
|||
<view class="uploadImage" bindtap="chooseImage" data-index="{{index}}" wx:if="{{srcList.length < 3 ? true : false}}"> |
|||
<image class="xiangji" src="/images/xiangji.png" /> |
|||
<view class="p">最多上传3张</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="yh-return_suess-view"></view> |
|||
<view class="bottom" bindtap="confirmAct"> |
|||
<view>提交</view> |
|||
</view> |
|||
</view> |
|||
<!-- 申请成功 --> |
|||
<view class="return_end" wx:if="{{return_suess}}" style="position: relative;overflow: hidden;"> |
|||
<view class="pic"> |
|||
<image src="/images/gouhei.png" /> |
|||
</view> |
|||
<view class="end_one">{{ refund_type != 3 ? '退款申请提交成功' : '换货申请提交成功'}}</view> |
|||
<view class="end_two">请耐心等待工作人员审核</view> |
|||
<view class="yh-return-end-view"></view> |
|||
<view class="return_message">{{ refund_type != 3 ? '退款信息' : '退货信息'}}</view> |
|||
<view class="end_msg_ul"> |
|||
<view class="end_message"> |
|||
<view class="end_lef">商品名称:</view> |
|||
<view class="detail">{{ order.product_title[0] }}</view> |
|||
</view> |
|||
<view class="end_message"> |
|||
<view class="end_lef">订单号:</view> |
|||
<view class="detail">{{ order.sNo }}</view> |
|||
</view> |
|||
<view class="end_message"> |
|||
<view class="end_lef">申请时间:</view> |
|||
<view class="detail">{{ order.time }}</view> |
|||
</view> |
|||
<view class="end_message"> |
|||
<view class="end_lef">退款类型:</view> |
|||
<view class="detail">{{ refund_type == 3 ? '换货' : refund_type == 2 ? '仅退款' : '退货退款' }}</view> |
|||
</view> |
|||
<view class="end_message" wx:if="{{refund_type !== '3'}}"> |
|||
<view class="end_lef">退款金额:</view> |
|||
<view class="detail">¥{{ re_price }}</view> |
|||
</view> |
|||
<view class="end_message"> |
|||
<view class="end_lef">退款说明:</view> |
|||
<view class="detail">{{ remark }}</view> |
|||
</view> |
|||
<view class="end_message"> |
|||
<view class="end_lef">上传凭证:</view> |
|||
<view class="evaluat_li" wx:for="{{srcList}}" wx:key="index"> |
|||
<image class="evaluat_img" src="{{item}}" bindtap="touchstart" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
@ -0,0 +1,310 @@ |
|||
/* pages/aftersales/apply.wxss */ |
|||
.page{ |
|||
width: 100% |
|||
} |
|||
.container{ |
|||
background-color: #F4F5F6; |
|||
} |
|||
.order_goods{ |
|||
border-radius: 0px 0px 24rpx 24rpx; |
|||
margin-bottom:24rpx ; |
|||
} |
|||
.order_two { |
|||
display: flex; |
|||
border-radius: 0px 0px 24rpx 24rpx; |
|||
border: none; |
|||
background-color: #fff; |
|||
padding: 32rpx; |
|||
} |
|||
.shopImage{ |
|||
width: 216rpx; |
|||
height: 216rpx; |
|||
border-radius: 16rpx; |
|||
margin-right: 24rpx; |
|||
} |
|||
.order_two_a { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: space-around; |
|||
height: 216rpx; |
|||
} |
|||
.price_num { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-size: 32rpx; |
|||
color: #FA5151; |
|||
|
|||
} |
|||
.price_num .price{ |
|||
font-weight: 600; |
|||
} |
|||
.price .price_symbol{ |
|||
font-size: 32rpx; |
|||
} |
|||
.order_p_name { |
|||
text-align: start; |
|||
height: auto; |
|||
margin: 0 0 20rpx 0; |
|||
font-size: 32rpx; |
|||
color: #333333; |
|||
overflow:hidden; |
|||
text-overflow:ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
.color_one{ |
|||
text-align: start; |
|||
max-width: 260rpx; |
|||
white-space: nowrap; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
font-size: 28rpx; |
|||
color: #999999; |
|||
} |
|||
.color_two { |
|||
font-size: 28rpx; |
|||
color: #999999; |
|||
} |
|||
.refund_pay { |
|||
border-radius:24rpx; |
|||
margin-left: 5rpx; |
|||
font-size: 32rpx; |
|||
color: #020202; |
|||
background-color: #fff; |
|||
} |
|||
.right_d{ |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.right_d_view { |
|||
display: flex; |
|||
align-items: center; |
|||
width: 100%; |
|||
flex: 1; |
|||
} |
|||
.leftText{ |
|||
width: 160rpx; |
|||
white-space: nowrap; |
|||
} |
|||
.rightText{ |
|||
position: absolute; |
|||
right: 32rpx; |
|||
} |
|||
.refund_pay>view { |
|||
width:auto; |
|||
padding: 32rpx 0rpx 32rpx 0; |
|||
margin: 0 32rpx 0 32rpx ; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.uploadImage { |
|||
font-size: 24rpx; |
|||
border:1rpx dashed #CCCCCC; |
|||
/* position: relative; */ |
|||
color: #333333; |
|||
width: 160rpx; |
|||
height: 160rpx; |
|||
float: left; |
|||
margin-right: 15rpx; |
|||
text-align: center; |
|||
border-radius: 20rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
flex-direction: column; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
.uploadImage .p { |
|||
font-size: 24rpx; |
|||
margin: 0 auto; |
|||
color: #b8b8b8; |
|||
} |
|||
|
|||
.xiangji { |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
|
|||
.input { |
|||
position: relative; |
|||
width: 100%; |
|||
} |
|||
.words_num{ |
|||
display: flex; |
|||
position: absolute; |
|||
right: 24rpx; |
|||
bottom: 24rpx; |
|||
font-size: 28rpx; |
|||
color: #333333; |
|||
} |
|||
.words_num view{ |
|||
color: #999999; |
|||
} |
|||
.input_text { |
|||
border-radius: 16rpx; |
|||
min-height: 136rpx; |
|||
font-size: 28rpx; |
|||
width: 526rpx; |
|||
box-sizing: border-box; |
|||
color:#020202; |
|||
padding:16rpx; |
|||
margin-left: 10rpx; |
|||
word-break: break-all; |
|||
border: 1rpx solid rgba(0,0,0,0.1); |
|||
} |
|||
|
|||
.refund_money { |
|||
border: none; |
|||
width: 51%; |
|||
margin: 2rpx 0 0 10rpx; |
|||
} |
|||
|
|||
.refund_color { |
|||
font-size: 32rpx; |
|||
color: #9D9D9D; |
|||
} |
|||
|
|||
.font_red { |
|||
color: #FA5151; |
|||
} |
|||
yh-return_suess-view { |
|||
height: 150rpx; |
|||
} |
|||
.bottom { |
|||
position: fixed; |
|||
bottom: 0; |
|||
width: 100%; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
background-color: #ffffff; |
|||
box-shadow: 0 0 0 0 rgba(0,0,0,0.2); |
|||
padding-bottom: env(safe-area-inset-bottom); |
|||
} |
|||
.bottom view{ |
|||
width: 686rpx; |
|||
height: 92rpx; |
|||
font-size: 32rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
line-height: 92rpx; |
|||
border-radius: 52rpx; |
|||
margin: 20rpx; |
|||
padding:0; |
|||
background-color: #FA5151; |
|||
} |
|||
.p_name { |
|||
width: 100%; |
|||
display: -webkit-box; |
|||
-webkit-box-orient: vertical; |
|||
-webkit-line-clamp: 2; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.image_dele { |
|||
position: absolute; |
|||
top: -10rpx; |
|||
right: 0; |
|||
height: 20rpx; |
|||
width: 20rpx; |
|||
} |
|||
|
|||
.evaluat_image { |
|||
height: 100%; |
|||
width: 100%; |
|||
} |
|||
|
|||
.image_dele { |
|||
height: 28rpx; |
|||
width: 28rpx; |
|||
} |
|||
.evaluat_imageBox { |
|||
display: flex; |
|||
} |
|||
.evaluat_view { |
|||
float: left; |
|||
height: 150rpx; |
|||
width: 150rpx; |
|||
margin-right: 10rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.evaluat_view:after { |
|||
display: block; |
|||
content: ""; |
|||
clear: both; |
|||
} |
|||
/* 申请成功 */ |
|||
.return_end { |
|||
font-size: 28rpx; |
|||
color: #020202; |
|||
/* background-color: white; */ |
|||
} |
|||
|
|||
.pic { |
|||
margin-top: 60rpx; |
|||
text-align: center; |
|||
} |
|||
|
|||
.pic image { |
|||
width: 100rpx; |
|||
height: 100rpx; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
.end_one { |
|||
font-size: 30rpx; |
|||
text-align: center; |
|||
margin-top: 30rpx; |
|||
} |
|||
|
|||
.end_two { |
|||
font-size: 24rpx; |
|||
color: #9D9D9D; |
|||
text-align: center; |
|||
margin: 18rpx 0 60rpx 0; |
|||
} |
|||
|
|||
.return_message { |
|||
padding: 30rpx; |
|||
border-bottom: 1px solid #eee; |
|||
font-size: 32rpx; |
|||
} |
|||
|
|||
.end_message { |
|||
display: flex; |
|||
} |
|||
|
|||
.end_message { |
|||
padding: 30rpx 30rpx 0 30rpx; |
|||
} |
|||
|
|||
.end_text { |
|||
width: 450rpx; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
text-align: right; |
|||
} |
|||
|
|||
.end_lef { |
|||
text-align: justify; |
|||
width: 150rpx; |
|||
height: 39rpx; |
|||
color: #666; |
|||
} |
|||
|
|||
.detail{ |
|||
color: #666; |
|||
} |
|||
.yh-return-end-view { |
|||
height: 30rpx; |
|||
width: 100%; |
|||
background-color: #eee; |
|||
} |
@ -0,0 +1,84 @@ |
|||
// pages/aftersales/asdetail.js
|
|||
var app = getApp() |
|||
var WXAPI = require('../../utils/server.js'); |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
info: {}, |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad(options) { |
|||
this.loadData(options) |
|||
}, |
|||
loadData: function(options){ |
|||
var that = this |
|||
WXAPI.returnDetail({ |
|||
accessId: app.globalData.accessId, |
|||
storeId: 239, |
|||
storeType: 1, |
|||
pid: options.pid, |
|||
orderDetailId: options.orderId, |
|||
}).then(res => { |
|||
if (res.code == 200) { |
|||
var data = res.data |
|||
that.setData({ |
|||
info: data.info |
|||
}); |
|||
} |
|||
}) |
|||
}, |
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage() { |
|||
|
|||
} |
|||
}) |
@ -0,0 +1,4 @@ |
|||
{ |
|||
"usingComponents": {}, |
|||
"navigationBarTitleText": "售后详情" |
|||
} |
@ -0,0 +1,88 @@ |
|||
<!--pages/aftersales/asdetail.wxml--> |
|||
<view class="container"> |
|||
<view class="status-view"> |
|||
<block wx:if="{{info.type == 0}}"> |
|||
<view class="statusLabel">待审核</view> |
|||
<view class='statusDesc'>您的售后申请正在审核中,请耐心等待2-3个工作日</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 1}}"> |
|||
<view class="statusLabel">待回寄</view> |
|||
<view class='statusDesc'>商家已同意,请用户寄回商品</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 2}}"> |
|||
<view class="statusLabel">已拒绝</view> |
|||
<view class='statusDesc'>商家拒绝退货退款</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 3}}"> |
|||
<view class="statusLabel">待卖家收货</view> |
|||
<view class='statusDesc'>用户已寄出,等待商家收货</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 4}}"> |
|||
<view class="statusLabel">已退款</view> |
|||
<view class='statusDesc'>收到寄回商品,同意并退款</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 5}}"> |
|||
<view class="statusLabel">已拒绝</view> |
|||
<view class='statusDesc'>商家拒绝并退回商品</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 8}}"> |
|||
<view class="statusLabel">已拒绝</view> |
|||
<view class='statusDesc'>商家拒绝退款</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 9}}"> |
|||
<view class="statusLabel">已退款</view> |
|||
<view class='statusDesc'>商家同意并退款</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 10}}"> |
|||
<view class="statusLabel">已拒绝</view> |
|||
<view class='statusDesc'>商家拒绝售后</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 11}}"> |
|||
<view class="statusLabel">待收货</view> |
|||
<view class='statusDesc'>商家同意并且寄回商品</view> |
|||
</block> |
|||
<block wx:elif="{{info.type == 12}}"> |
|||
<view class="statusLabel">已结束</view> |
|||
<view class='statusDesc'>售后结束</view> |
|||
</block> |
|||
</view> |
|||
<view class="yh-line"></view> |
|||
<view class="rt-product-box"> |
|||
<view class="yh-block-title"> |
|||
<view>售后信息</view> |
|||
</view> |
|||
<view style="height:2rpx;background-color:#F4F4F4;margin-top:30rpx;"></view> |
|||
<view class="address-row"> |
|||
<view>商品名称:</view> |
|||
<view class="yh-p_name">{{info.p_name}}</view> |
|||
</view> |
|||
<view class="address-row"> |
|||
<view>订单号:</view> |
|||
<view>{{info.r_sNo}}</view> |
|||
</view> |
|||
<view class="address-row"> |
|||
<view>申请时间:</view> |
|||
<view>{{info.re_time}}</view> |
|||
</view> |
|||
<view class="address-row"> |
|||
<view>售后类型:</view> |
|||
<view>{{info.re_type==1?'退货退款':info.re_type==3?'换货':'仅退款'}}</view> |
|||
</view> |
|||
<view class="address-row h_auto"> |
|||
<view>申请原因:</view> |
|||
<view class='yx_right'>{{info.content}}</view> |
|||
</view> |
|||
<view class="address-row h_auto" wx:if="{{info.re_photo&&info.re_photo.length > 0}}"> |
|||
<view>上传凭证:</view> |
|||
<view class="flex"> |
|||
<view class="re_photo" wx:for="{{info.re_photo}}" wx:key='index'> |
|||
<image src="{{item}}" mode=""/> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="address-row" wx:if="{{info.re_type != 3}}"> |
|||
<view>退款金额:</view> |
|||
<view>¥{{info.p_price}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
@ -0,0 +1,69 @@ |
|||
/* pages/aftersales/asdetail.wxss */ |
|||
.page{ |
|||
width: 100% |
|||
} |
|||
.container{ |
|||
background-color: white; |
|||
} |
|||
.rt-product-box{ |
|||
background-color: white; |
|||
padding: 30rpx; |
|||
} |
|||
.yh-line { |
|||
height: 20rpx; |
|||
background: #F4F4F4; |
|||
} |
|||
|
|||
.yh-block-title { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
.yh-p_name { |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
width: 240px; |
|||
overflow: hidden; |
|||
} |
|||
.re_photo { |
|||
width: 120rpx; |
|||
height: 120rpx; |
|||
margin-right: 10rpx; |
|||
margin-top: 15rpx; |
|||
} |
|||
|
|||
.re_photo image { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.address-row { |
|||
display: flex; |
|||
line-height: 40rpx; |
|||
font-size: 28rpx; |
|||
padding: 0 0rpx; |
|||
color: #666666; |
|||
margin: 20rpx 0; |
|||
} |
|||
|
|||
.address-row view:first-child{ |
|||
white-space: nowrap; |
|||
} |
|||
.status-view{ |
|||
height: 200rpx; |
|||
width: 100%; |
|||
background-color: #FA5151; |
|||
} |
|||
.statusLabel{ |
|||
position: absolute; |
|||
margin-top: 50rpx; |
|||
margin-left: 40rpx; |
|||
color: white; |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
} |
|||
.statusDesc{ |
|||
position: absolute; |
|||
margin-top: 120rpx; |
|||
margin-left: 40rpx; |
|||
color: #bbbbbb; |
|||
font-size: 28rpx; |
|||
} |
Loading…
Reference in new issue