You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
383 lines
9.1 KiB
383 lines
9.1 KiB
<template>
|
|
<view>
|
|
<loadlogo v-if="!loadlogo" />
|
|
<view class="container" v-if="loadlogo">
|
|
<far-bottom></far-bottom>
|
|
<view class="header">
|
|
<view class="tabBar b-f dis-flex">
|
|
<view class="tabBar-item p-r f-24 col-9 t-c" :class="{'tabBar-active-text':currentTab === item.typeTab}" v-for="(item,index) in tabBar"
|
|
@click="curtabBar(item.typeTab)">{{item.title}}
|
|
<view :class="{'active':currentTab === item.typeTab}"></view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="content">
|
|
<view class="search-main m-top-btm40">
|
|
<view class="client-total m-btm30">
|
|
<view class="f-24 col-9 m-right20">退款 {{refunded_order}} 已结算 {{settled_order}} 未结算 {{unsettled_order}}</view>
|
|
</view>
|
|
<view class="search-box dis-flex flex-y-center">
|
|
<view class="search-input p-left-right-30 ">
|
|
<input type="number" value="" placeholder="输入订单号查询" placeholder-style="color:#999999;" class="f-24" v-model="searchText" />
|
|
</view>
|
|
<view class="search-btn col-f f-24 t-c" @click="search">搜索</view>
|
|
</view>
|
|
</view>
|
|
<block v-if="!!list && list.length>0">
|
|
<view class="order-list-box">
|
|
<view class="scroll-view" >
|
|
<view class="order-list">
|
|
<view class="order-item b-f bor-radius-10upx padding-box-all m-btm30" v-for="(item,index) in list">
|
|
<view class="user-detail p-r dis-flex flex-y-center">
|
|
<view class="user-avatar m-right30" :style="{'background-image':'url('+item.avatar+')'}"></view>
|
|
<view class="user-nickname">
|
|
<view class="f-24 col-9 scale-us m-btm10">下单用户</view>
|
|
<view class="f-24 col-3">{{item.nickname}}</view>
|
|
<view class="order-status f-24">{{item.status==='0'?orderStatus[3]['title']:(item.status==='1'? orderStatus[0]['title']:(item.status==='2'? orderStatus[1]['title']:orderStatus[2]['title']))}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="order-goods dis-flex border-line border-bottom">
|
|
<view class="goods-image bor-radius-10upx m-right30" :style="{'background-image':'url('+item.goods_logo+')'}"></view>
|
|
<view class="goods-detail">
|
|
<view class="goods-title twolist-hidden col-3 f-24">{{item.goods_name}}</view>
|
|
<view class="f-24 col-9 goods-now-price">实付金额 ￥{{item.orderprice}}</view>
|
|
<view class="f-28 commission-price">{{dealer_Info.yjtext}} ￥{{item.commission}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="order-detail">
|
|
<view class="order-number dis-flex flex-y-center flex-x-between">
|
|
<view class="col-9 f-24">订单号：{{item.orderno}}</view>
|
|
<view class="copy-btn t-c col-9 f-24" @click="copy_orderno(item.orderno)">复制</view>
|
|
</view>
|
|
<view class="f-24 col-9 m-top-btm20">支付时间：{{item.paytime}}</view>
|
|
<view class="f-24 col-9" v-if="!!item.use_time&&item.use_time.length>0">{{item.consumption_type===1?'收货时间':(item.consumption_type===2?'核销时间':'使用时间')}}：{{item.use_time[0]}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<load-more :isMore="loadingMore"></load-more>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
<block v-else>
|
|
<noneMores></noneMores>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import App from '@/common/js/app.js'
|
|
import Loadlogo from '@/components/template/loadlogo'
|
|
import loadMore from '@/components/template/loadmore.vue'
|
|
import noneMores from '@/components/template/nonemores.vue';
|
|
export default {
|
|
data() {
|
|
return {
|
|
currentTab: '0',
|
|
loadlogo: false, //页面是否加载完成,
|
|
loadingMore: false, //列表加载更多
|
|
current_page: 1, //当前页数
|
|
searchText: '', //搜索订单号
|
|
list: [], //我的推广商品列表
|
|
page_total: null, //总共页数
|
|
unsettled_order: null, // 未结算数量
|
|
settled_order: null, // 已结算数量
|
|
refunded_order: null, //退款数量
|
|
slide_Top: 0, // 滚动距离
|
|
tabBar: [{
|
|
title: '全部',
|
|
typeTab: '0',
|
|
},
|
|
{
|
|
title: '未结算',
|
|
typeTab: '1',
|
|
},
|
|
{
|
|
title: '已结算',
|
|
typeTab: '2',
|
|
},
|
|
{
|
|
title: '已退款',
|
|
typeTab: '3',
|
|
},
|
|
],
|
|
orderStatus: [{
|
|
title: '未结算',
|
|
Status: 'not'
|
|
},
|
|
{
|
|
title: '已结算',
|
|
Status: 'alerea'
|
|
},
|
|
{
|
|
title: '已退款',
|
|
Status: 'refund'
|
|
},
|
|
{
|
|
title: '暂未结算',
|
|
Status: 'settle'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.searchText = options.order_no;
|
|
},
|
|
components: {
|
|
loadMore,
|
|
Loadlogo,
|
|
noneMores
|
|
},
|
|
computed: {
|
|
dealer_Info() {
|
|
if (!!uni.getStorageSync('TextSubstitution')) {
|
|
return uni.getStorageSync('TextSubstitution')
|
|
}
|
|
}
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
mounted() {
|
|
this.getGenerList();
|
|
},
|
|
methods: {
|
|
//推广订单列表
|
|
getGenerList(state = 0, page = 1, isPage = false) {
|
|
let _this = this,
|
|
requestData = {
|
|
order_no: _this.searchText || '',
|
|
page,
|
|
state,
|
|
};
|
|
App._post_form('&p=distribution&do=disOrder', requestData, res => {
|
|
let ShopData = res.data;
|
|
if (isPage) {
|
|
if (ShopData.list.length > 0) {
|
|
_this["list"].push(...ShopData.list);
|
|
} else {
|
|
_this.loadingMore = true;
|
|
}
|
|
} else {
|
|
_this.setData(ShopData)
|
|
_this.loadingMore = ShopData.list.length === 0 || _this.current_page === ShopData.page_total;
|
|
}
|
|
}, false, () => {
|
|
uni.hideLoading();
|
|
_this.loadlogo = true;
|
|
})
|
|
},
|
|
//选项
|
|
curtabBar(current) {
|
|
let _this = this;
|
|
uni.showLoading({})
|
|
_this.slide_Top = 0;
|
|
_this.current_page = 1;
|
|
_this.currentTab = current;
|
|
_this.searchText = '';
|
|
_this.getGenerList(current);
|
|
},
|
|
/**
|
|
* 滑动高度
|
|
*/
|
|
scrolly(e) {
|
|
this.slide_Top = e.detail.scrollTop;
|
|
},
|
|
//加载更多
|
|
ReachBottom() {
|
|
|
|
},
|
|
// 搜索
|
|
search() {
|
|
uni.showLoading({})
|
|
this.current_page = 1;
|
|
this.currentTab = '0';
|
|
this.getGenerList(this.currentTab);
|
|
},
|
|
// 剪切板
|
|
copy_orderno(copyText) {
|
|
//#ifdef H5
|
|
App.clipboard(copyText);
|
|
//#endif
|
|
uni.setClipboardData({
|
|
data: copyText,
|
|
success: function(data) {
|
|
App.showSuccess('复制成功')
|
|
}
|
|
})
|
|
}
|
|
},
|
|
onReachBottom() {
|
|
debugger
|
|
let _this = this;
|
|
if (_this.current_page >= _this.page_total) {
|
|
_this.loadingMore = true;
|
|
return false;
|
|
}
|
|
_this.getGenerList(_this.currentTab, ++_this.current_page, true);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #f7f7f7;
|
|
}
|
|
|
|
//头部
|
|
.header {
|
|
|
|
// 导航
|
|
.tabBar {
|
|
width: 100%;
|
|
|
|
.tabBar-active-text {
|
|
font-size: 30upx;
|
|
color: #333333;
|
|
}
|
|
|
|
.tabBar-item {
|
|
width: 25%;
|
|
height: 96upx;
|
|
line-height: 96upx;
|
|
|
|
.active {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
background-color: #FF4444;
|
|
width: 50upx;
|
|
height: 8upx;
|
|
border-radius: 20upx;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
//内容
|
|
.content {
|
|
padding: 0 30upx;
|
|
|
|
// 搜索栏内容
|
|
.search-main {
|
|
.search-box {
|
|
.search-input {
|
|
margin-right: 40upx;
|
|
background-color: #EEEEEE;
|
|
height: 60upx;
|
|
border-radius: 30upx;
|
|
flex: 1;
|
|
|
|
input {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.search-btn {
|
|
width: 90upx;
|
|
line-height: 60upx;
|
|
height: 60upx;
|
|
background: #FF4444;
|
|
border-radius: 30upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
//订单列表内容
|
|
.order-list-box {
|
|
.scroll-view {
|
|
height: 70vh;
|
|
|
|
.order-list {
|
|
.order-item {
|
|
|
|
// 用户信息 订单状态
|
|
.user-detail {
|
|
.user-avatar {
|
|
width: 80upx;
|
|
height: 80upx;
|
|
background-repeat: no-repeat;
|
|
background-size: 80upx 80upx;
|
|
border-radius: 50%;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.user-nickname {
|
|
.scale-us {
|
|
transform: scale(.95);
|
|
}
|
|
|
|
.order-status {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
color: #FE504F;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 订单商品
|
|
.order-goods {
|
|
padding: 30upx 0;
|
|
|
|
.goods-image {
|
|
width: 150upx;
|
|
height: 150upx;
|
|
background-repeat: no-repeat;
|
|
background-size: 150upx 150upx;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.goods-detail {
|
|
.goods-title {
|
|
height: 2.6em;
|
|
}
|
|
|
|
.goods-now-price {
|
|
margin: 11upx 0 8upx;
|
|
}
|
|
|
|
.commission-price {
|
|
color: #FF4444
|
|
}
|
|
}
|
|
}
|
|
|
|
// 订单详情
|
|
.order-detail {
|
|
padding-top: 40upx;
|
|
|
|
.order-number {
|
|
.copy-btn {
|
|
width: 80upx;
|
|
height: 40upx;
|
|
line-height: 40upx;
|
|
border: 1px solid #BFBFBF;
|
|
border-radius: 8upx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
//提示图
|
|
|
|
.no-shop-image {
|
|
.not-image {
|
|
margin: 20% auto 0;
|
|
width: 400upx;
|
|
height: 200upx;
|
|
background-image: url('https://s10.mogucdn.com/p2/161213/upload_27e7gegi3f9acl5e05f3951if5855_514x260.png');
|
|
background-size: 400upx 200upx;
|
|
background-repeat: no-repeat;
|
|
}
|
|
}
|
|
</style>
|
|
|