190 lines
4.4 KiB
Vue
190 lines
4.4 KiB
Vue
<template>
|
||
<view class="bg_F2F2F2">
|
||
<ServiceTop page_title='退款/售后'></ServiceTop>
|
||
<!-- 占位 -->
|
||
<view class="place"></view>
|
||
<!-- 商品列表 -->
|
||
<view class="goods_list">
|
||
<view class="order_list">
|
||
<view class="padding-30 order_items margin-shu20 x-bg-white" v-for="(item,index) of serviceList" :key='index' @click="to_refundDetail(item.id,index)">
|
||
<view class="d-flex">
|
||
<view>退款订单详情</view>
|
||
<view class="margin-zy20">{{item.order_sn}}</view>
|
||
<view class="order_state text-center x-text-white">{{item.status_text}}</view>
|
||
</view>
|
||
<view class="list x-bg-white margin-bottom22 padding-sx30">
|
||
<view class="list_items">
|
||
<view class="items_li d-flex a-center">
|
||
<view class="d-flex goods_items a-center w-100">
|
||
<view class="box_img">
|
||
<image :src="item.app_thumb" mode="" class="h-100 w-100"></image>
|
||
</view>
|
||
<view class="goods_txt flex-1 padding-zy30">
|
||
<view class="font-weight">{{item.name}}</view>
|
||
<view class="">{{item.manufacturer_name}}</view>
|
||
<view class="">{{item.spec_desc}} {{item.retail_flag}}</view>
|
||
<view class="d-flex j-sb">
|
||
<view class="x-text-159">￥ {{item.unit_price}}</view>
|
||
<view class="">X {{item.goods_number}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="d-flex padding-zy30 j-end">
|
||
<text class="x_text_hui">退款金额 :</text>
|
||
<text class="x-text-159">￥ {{item.total_price}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="loading-text">{{loadingText}}</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import ServiceTop from '../../components/HeaderTop/ServiceTop.vue'
|
||
import service from '../../utils/models/service.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
page:1,
|
||
isScroll:true,
|
||
serviceList:[],
|
||
loadingText:"正在加载...",
|
||
};
|
||
},
|
||
components: {
|
||
ServiceTop
|
||
},
|
||
//下拉刷新，需要自己在page.json文件中配置开启页面下拉刷新 "enablePullDownRefresh": true
|
||
onPullDownRefresh() {
|
||
setTimeout(()=>{
|
||
this.reload();
|
||
uni.stopPullDownRefresh();
|
||
}, 1000);
|
||
},
|
||
//上拉加载，需要自己在page.json文件中配置"onReachBottomDistance"
|
||
onReachBottom(){
|
||
if(!this.isScroll){
|
||
this.loadingText="到底了";
|
||
return false;
|
||
}else{
|
||
this.loadingText="正在加载...";
|
||
setTimeout(() => {
|
||
this.getList();
|
||
}, 500);
|
||
}
|
||
},
|
||
methods:{
|
||
// 查看订单详情
|
||
to_refundDetail(id,index){
|
||
uni.navigateTo({
|
||
url:'../refund/refund_details?id='+id+'&index='+index
|
||
})
|
||
},
|
||
async getList() {
|
||
let parames = {
|
||
page:this.page
|
||
}
|
||
|
||
let data = await service.getList(parames)
|
||
if(data.data.current_page == data.data.last_page){
|
||
this.isScroll = false
|
||
}
|
||
for (let i = 0; i < data.data.data.length; i++) {
|
||
this.serviceList.push(data.data.data[i])
|
||
}
|
||
this.page++
|
||
this.handleError(data, res => {
|
||
|
||
})
|
||
}
|
||
},
|
||
created(){
|
||
if(this.page){
|
||
this.isScroll = true
|
||
this.serviceList = []
|
||
}
|
||
this.getList()
|
||
},
|
||
onShow:function(e) {
|
||
let pages = getCurrentPages();
|
||
let currPage = pages[pages.length-1];
|
||
if (currPage.index){
|
||
this.serviceList[currPage.index]['status_text'] = currPage.status_text
|
||
}
|
||
}
|
||
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.place{
|
||
background-color: #ffffff;
|
||
height: 148upx;
|
||
}
|
||
.loading-text{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
height: 60upx;
|
||
color: #979797;
|
||
font-size: 24upx;
|
||
}
|
||
.order_list {
|
||
height: 100%;
|
||
overflow-y: auto;
|
||
.order_state{
|
||
border-radius: 20upx 0 0 20upx;
|
||
height:46upx;
|
||
width:140upx;
|
||
background-color: #EDCA4A;
|
||
line-height: 46upx;
|
||
right:0;
|
||
}
|
||
.order_items {
|
||
border-radius: 20upx;
|
||
}
|
||
}
|
||
|
||
.list {
|
||
font-size: 26upx;
|
||
|
||
.list_items {
|
||
.box_img {
|
||
height: 153.3upx;
|
||
width: 198upx;
|
||
background-color: #F2F2F2;
|
||
padding: 10upx 20upx;
|
||
margin: 0 10upx;
|
||
}
|
||
|
||
.goods_items {
|
||
display: flex;
|
||
.goods_count {
|
||
bottom: -14upx;
|
||
right: 8upx;
|
||
}
|
||
}
|
||
|
||
.line {
|
||
height: 4upx;
|
||
background-color: #F2F2F2;
|
||
}
|
||
}
|
||
.look_logistics{
|
||
border-radius: 20upx;
|
||
width:132upx;
|
||
height:45upx;
|
||
line-height: 45upx;
|
||
text-align: center;
|
||
border:1upx solid #C3C3C3;
|
||
right:22upx;
|
||
bottom:-54upx;
|
||
}
|
||
}
|
||
</style>
|