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.
341 lines
11 KiB
341 lines
11 KiB
<template>
|
|
<view>
|
|
<global-loading/>
|
|
|
|
<view v-if="ifShow">
|
|
<view class="totalAward-topBackImg flex-items flex-column">
|
|
<view class="totalAward-content flex-column font-color-FFF">
|
|
<view class="flex-column-plus flex-items mar-top-40">
|
|
<label class="mar-top-20 fs60 amount">{{ ZSalesOrderData.total }}</label>
|
|
</view>
|
|
<view class="flex-row-plus flex-sp-around fs24 mar-top-10">
|
|
<view class="awardBox">
|
|
<view class="fs36 font-color-FFF">{{ ZSalesOrderData.directPrice }}</view>
|
|
<view class="awardTit font-color-FFF">直接奖励(元）</view>
|
|
</view>
|
|
<view class="awardBox">
|
|
<view class="fs36 font-color-FFF">{{ ZSalesOrderData.indirectPrice }}</view>
|
|
<view class="awardTit font-color-FFF">间接奖励(元）</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="awardType-box flex-center">
|
|
<view class="awardType-content">
|
|
<u-tabs :list="awardTypeList" bar-width="60" :bold="false" active-color="#C5AA7B" inactive-color="#999999"
|
|
:is-scroll="false" :current="awardTypeFlag" @change="awardTypeActive"></u-tabs>
|
|
</view>
|
|
</view>
|
|
<view v-if="awardTypeFlag == 0">
|
|
<view v-if="ZStotallength>0">
|
|
<view class="flex-center" v-for="(item, index) in ZSalesOrderDatalist" :key="index">
|
|
<view class="directAward-box font-color-656 fs26" @click="arrowTypeChange1(index)">
|
|
<view style="display: flex;" class="directAwardInfo">
|
|
<view style="flex: 1;" class="flex-items flex-sp-between">
|
|
<label class="orderId-box font-color-999">{{$t('common.orderno')}}：{{ item.orderFormid }}</label>
|
|
<view class="mar-right-50 font-color-999">
|
|
佣金：<label class="font-color-C5AA7B">¥{{ item.commission }}</label>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<image v-if="item.ifOpen == false" class="arrow-down"
|
|
src="http://36.138.125.206:8081/ceres-local-file/static/images/arrowDownIcon.png"></image>
|
|
<image v-if="item.ifOpen == true" class="arrow-down"
|
|
src="http://36.138.125.206:8081/ceres-local-file/static/images/arrowUpIcon.png"></image>
|
|
</view>
|
|
</view>
|
|
<view v-if="item.ifOpen == true">
|
|
<view class="flex-row-plus flex-items flex-sp-between mar-top-30">
|
|
<label class="orderId-box font-color-999">{{$t('common.productnum')}}：{{ item.products }}</label>
|
|
<label class="commission-box mar-left-70 font-color-999">{{$t('Synthesis')}}：¥{{ item.price }}</label>
|
|
</view>
|
|
<view class="flex-row-plus flex-items flex-sp-between mar-top-30">
|
|
<label class="orderId-box font-color-999">{{$t('common.buyer')}}：{{ item.customerName }}</label>
|
|
<label class="commission-box mar-left-70">{{$t('common.status')}}：
|
|
<text class="state" :class="{current: item.state==0}">{{ item.state == 1 ? $t('common.unsettled') : $t('common.settled') }}
|
|
</text>
|
|
</label>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-else class="emptyCart-box flex-items-plus flex-column">
|
|
<image class="emptyCart-img" src="http://36.138.125.206:8081/ceres-local-file/static/img/bgnull.png"></image>
|
|
<label class="font-color-999 fs26 mar-top-30">{{$t('client.emptydata')}}</label>
|
|
</view>
|
|
</view>
|
|
<view v-if="awardTypeFlag == 1">
|
|
<view v-if="JStotallength>0">
|
|
<view class="flex-center" v-for="(item,index) in JSalesOrderDatalist" :key="index">
|
|
<view class="directAward-box font-color-656 fs26" @click="arrowTypeChange(index)">
|
|
<view style="display: flex;" class="directAwardInfo">
|
|
<view style="flex: 1;" class="flex-items flex-sp-between">
|
|
<label class="orderId-box font-color-999">{{$t('common.orderno')}}：{{ item.orderFormid }}</label>
|
|
<view class="mar-right-50 font-color-999">
|
|
佣金：<label class="font-color-C5AA7B">¥{{ item.commission }}</label>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<image v-if="item.ifOpen == false" class="arrow-down"
|
|
src="http://36.138.125.206:8081/ceres-local-file/static/images/arrowDownIcon.png"></image>
|
|
<image v-if="item.ifOpen == true" class="arrow-down"
|
|
src="http://36.138.125.206:8081/ceres-local-file/static/images/arrowUpIcon.png"></image>
|
|
</view>
|
|
</view>
|
|
<view v-if="item.ifOpen == true">
|
|
<view class="flex-row-plus flex-items flex-sp-between mar-top-30">
|
|
<label class="orderId-box font-color-999">{{$t('common.productnum')}}：{{ item.products }}</label>
|
|
<label class="commission-box mar-left-70 font-color-999">{{$t('Synthesis')}}：¥{{ item.price }}</label>
|
|
</view>
|
|
<view class="flex-row-plus flex-items flex-sp-between mar-top-30">
|
|
<label class="orderId-box font-color-999">{{$t('common.buyer')}}：{{ item.customerName }}</label>
|
|
<label class="commission-box mar-left-70">{{$t('common.status')}}：
|
|
<text class="state" :class="{current: item.state==0}">{{ item.state == 0 ? $t('common.unsettled') : $t('common.settled') }}
|
|
</text>
|
|
</label>
|
|
</view>
|
|
<view class="flex-row-plus flex-items mar-top-30">
|
|
<label class="orderId-box font-color-999">{{$t('common.distributor')}}：{{ item.distributorName }}</label>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-else class="emptyCart-box flex-items-plus flex-column">
|
|
<image class="emptyCart-img" src="http://36.138.125.206:8081/ceres-local-file/static/img/bgnull.png"></image>
|
|
<label class="font-color-999 fs26 mar-top-30">{{$t('client.emptydata')}}</label>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
const NET = require('../../utils/request')
|
|
const API = require('../../config/api')
|
|
export default {
|
|
data() {
|
|
return {
|
|
awardTypeList: [{
|
|
name: '直接奖励'
|
|
}, {
|
|
name: '间接奖励'
|
|
}],
|
|
awardTypeFlag: 0,
|
|
item: {},
|
|
SalesOrderQuery: {
|
|
model: {
|
|
tenantCode: '',
|
|
type: ''
|
|
},
|
|
current: 0,
|
|
size: 10
|
|
},
|
|
SalesOrderData: [],
|
|
ZSalesOrderData: [],
|
|
JSalesOrderData: [],
|
|
shopId: 0,
|
|
distributorId: 0,
|
|
tenantCode: {},
|
|
ZStotallength: 0,
|
|
JStotallength: 0,
|
|
page: 1,
|
|
pageSize: 20,
|
|
loadingType: 0,
|
|
loadingType1: 0,
|
|
ZSalesOrderDatalist: [],
|
|
JSalesOrderDatalist: [],
|
|
ifShow: false,
|
|
ifEmpty: false
|
|
}
|
|
},
|
|
onLoad: function (optins) {
|
|
this.shopId = optins.shopId
|
|
this.distributorId = optins.distributorId
|
|
this.getZSalesOrderData()
|
|
this.getJSalesOrderData()
|
|
},
|
|
onReachBottom() {
|
|
if (this.awardTypeFlag == 0) {
|
|
if (this.loadingType == 1) {
|
|
uni.stopPullDownRefresh()
|
|
} else {
|
|
this.page = this.page + 1
|
|
this.getZSalesOrderData()
|
|
}
|
|
} else {
|
|
if (this.loadingType1 == 1) {
|
|
uni.stopPullDownRefresh()
|
|
} else {
|
|
this.page = this.page + 1
|
|
this.getJSalesOrderData()
|
|
}
|
|
}
|
|
|
|
},
|
|
methods: {
|
|
getZSalesOrderData() {
|
|
// uni.showLoading({
|
|
// mask: true,
|
|
// title: '加载中...'
|
|
// })
|
|
NET.request(API.FindSalesOrderPage, {
|
|
shopId: this.shopId,
|
|
distributorId: this.distributorId,
|
|
type: 1,
|
|
page: this.page,
|
|
pageSize: this.pageSize
|
|
}, 'GET').then(res => {
|
|
uni.hideLoading()
|
|
if (res.data.page.list.length == 0) {
|
|
this.loadingType = 1
|
|
this.page = this.page
|
|
}
|
|
this.ZSalesOrderDatalist = this.ZSalesOrderDatalist.concat(res.data.page.list)
|
|
this.ZSalesOrderData = res.data
|
|
this.ZStotallength = this.ZSalesOrderData.page.total
|
|
this.ifShow = true
|
|
}).catch(res => {
|
|
uni.hideLoading()
|
|
})
|
|
},
|
|
getJSalesOrderData() {
|
|
// uni.showLoading({
|
|
// mask: true,
|
|
// title: '加载中...'
|
|
// })
|
|
NET.request(API.FindSalesOrderPage, {
|
|
shopId: this.shopId,
|
|
distributorId: this.distributorId,
|
|
type: 2,
|
|
page: this.page,
|
|
pageSize: this.pageSize
|
|
}, 'GET').then(res => {
|
|
uni.hideLoading()
|
|
if (res.data.page.list.length == 0) {
|
|
this.loadingType1 = 1
|
|
uni.showToast({
|
|
title: '已加载全部···',
|
|
duration: 2000,
|
|
icon: 'none'
|
|
});
|
|
this.page = this.page
|
|
}
|
|
this.JSalesOrderDatalist = this.JSalesOrderDatalist.concat(res.data.page.list)
|
|
this.JSalesOrderData = res.data
|
|
this.JStotallength = this.JSalesOrderData.page.total
|
|
}).catch(res => {
|
|
uni.hideLoading()
|
|
})
|
|
},
|
|
|
|
awardTypeActive(index) {
|
|
this.awardTypeFlag = index
|
|
this.page = 1
|
|
},
|
|
arrowTypeChange1(arrowTypeId) {
|
|
this.ZSalesOrderData.page.list[arrowTypeId].ifOpen = this.ZSalesOrderData.page.list[arrowTypeId].ifOpen == false ? true : false
|
|
},
|
|
arrowTypeChange(arrowTypeId) {
|
|
this.JSalesOrderData.page.list[arrowTypeId].ifOpen = this.JSalesOrderData.page.list[arrowTypeId].ifOpen == false ? true : false
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background: #333333;
|
|
}
|
|
|
|
.emptyCart-box {
|
|
margin-top: 70 upx;
|
|
|
|
.emptyCart-img {
|
|
width: 216 rpx;
|
|
height: 156 rpx;
|
|
}
|
|
}
|
|
|
|
.totalAward-topBackImg {
|
|
width: 100%;
|
|
height: 360 rpx;
|
|
background: url(http://36.138.125.206:8081/ceres-local-file/static/images/unliquidatedBg.png) no-repeat;
|
|
background-size: 100%;
|
|
margin-top: 30 rpx;
|
|
|
|
.totalAward-content {
|
|
width: 90%;
|
|
|
|
.awardBox {
|
|
text-align: center;
|
|
|
|
.awardTit {
|
|
opacity: 0.7;
|
|
}
|
|
}
|
|
|
|
.amount {
|
|
color: #FFEBC4;
|
|
}
|
|
}
|
|
}
|
|
|
|
.awardType-box {
|
|
border-bottom: 1 upx solid #666666;
|
|
|
|
.awardType-content {
|
|
height: 80 upx;
|
|
width: 500 upx;
|
|
}
|
|
}
|
|
|
|
.directAward-box {
|
|
width: 94%;
|
|
border-bottom: 1 upx solid #666666;
|
|
padding: 30 upx;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
flex-direction: column;
|
|
background: #FFFFFF;
|
|
margin-top: 30 rpx;
|
|
|
|
.orderId-box {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.state {
|
|
color: #16BB89;
|
|
}
|
|
|
|
.current {
|
|
color: #C83732 !important;
|
|
}
|
|
|
|
.arrow-down {
|
|
width: 24 upx;
|
|
height: 24 upx;
|
|
}
|
|
|
|
.directAwardInfo {
|
|
}
|
|
}
|
|
|
|
.totalAwardEmpty-box {
|
|
margin-top: 65 upx;
|
|
|
|
.totalAwardEmpty {
|
|
width: 270 upx;
|
|
height: 270 upx;
|
|
}
|
|
}
|
|
</style>
|
|
<style scoped>
|
|
.awardType-box /deep/ .u-tabs {
|
|
background: none !important;
|
|
}
|
|
</style>
|