<import src="../../../../template/baseNavigationBar.wxml"/>
<template is="navigationBar" data="{{...item}}"></template>
<view class='title'>
<view class='goodsImg'>
<image src='../../../../images/5.png' mode='aspectFill'></image>
</view>
<view class='goodsTitle'>你好啊</view>
</view>
<van-cell-group style='margin-top: 20rpx'>
<van-field
value="{{ message }}"
label="退款原因"
type="textarea"
autosize
border="{{ false }}"
bind:focus='bindRefund'
/>
</van-cell-group>
<van-popup
show="{{ show }}"
position="bottom "
overlay="{{ true }}"
bind:close="onClose"
>
<van-picker
show-toolbar
title="退款原因"
columns="{{ columns }}"
bind:cancel="onCancel"
bind:confirm="onConfirm"
/>
</van-popup>
<van-cell-group style='margin-top: 20rpx'>
<van-field
value="{{ message }}"
label="退款金额 :"
type="textarea"
placeholder='$100'
autosize
border="{{ false }}"
error='true'
readonly
/>
</van-cell-group>
<van-cell-group style='margin-top: 20rpx'>
<van-field
value="{{ message }}"
label="退款说明 :"
type="textarea"
placeholder='选填'
autosize
border="{{ false }}"
/>
</van-cell-group>
<view class='upLoad'>
<view class='upRefunds'>长传凭证</view>
<view>
<view class='imgItem' bindtap='bindUpImg'>
<text class='iconfont icon-iconfontshumajiadian'></text>
<view class='refundsText'>上传凭证</view>
<view class='refundsText'>最多6张</view>
</view>
</view>
</view>
<view class='submit'>提交</view>
/* pages/User/pages/applyRefund/applyRefund.wxss */
@import "../../../../wxss/iconfont.wxss";
@import "../../../../wxss/base.wxss";
@import "../../../../wxss/baseNavigationBar.wxss";
page {
background: #f3f3f3;
}
.title {
display: flex;
padding: 20rpx;
background: white;
margin-top: 160rpx;
}
.goodsImg {
width: 120rpx;
height: 120rpx;
margin-right: 20rpx;
}
.goodsImg image {
width: 100%;
height: 100%;
}
.goodsTitle {
flex-shrink: 0;
}
.van-cell {
margin-top: 20rpx;
}
.RefundList {
background: white;
padding:0 20rpx;
}
.RefundItem {
padding: 20rpx 0;
border-bottom: 2rpx solid #f3f3f3;
}
.upLoad {
margin-top: 20rpx;
background: white;
padding: 20rpx 30rpx;
}
.imgItem {
width: 160rpx;
height: 160rpx;
margin: 10rpx 10rpx 10rpx 0;
border: 1px dashed #999
}
.icon-iconfontshumajiadian {
display: block;
font-size: 48rpx;
color: #999;
text-align: center;
margin-top: 8rpx;
}
.refundsText {
text-align: center;
color: #999;
font-size: 24rpx;
line-height: 1.6;
}
.submit {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
text-align: center;
background: #890101;
height: 80rpx;
line-height: 80rpx;
color: white;
font-size: 32rpx;
}
// pages/User/pages/applyRefund/applyRefund.js
const app = getApp();
var MBC = require("../../../../core/core.js");
var api = require("../../../../config/api.config.js");
// es5
const Toast = require('../../../../components/VantWeapp/lib/toast/toast');
Page({
/**
* 页面的初始数据
*/
data: {
item: {
iconfontBack: "icon-arrowleft",
navigationBarTitle: "申请退款"
},
show: false,
columns: ['杭州', '宁波', '温州', '嘉兴', '湖州'],
},
// 下拉框确认
onConfirm(event) {
console.log(event.detail)
},
// 下拉框取消
onCancel() {
Toast('取消');
},
// 隐藏下拉框
onClose() {
this.setData({ show: false });
},
// 显示下拉框
bindRefund:function(evnet){
this.setData({
show: true,
})
},
// 删除照片
bindUpImg:function(event){
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success(res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFilePaths
}
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
