fe / xianyu-ufo-app-web · Commits

Go to a project

Authored by shuaiguo
Commit d49089d44e41a8f360400818c33b6b224be164c6 1 parent 0ba1f484

feat(我的收入)： 数据获取

Inline Side-by-side
Showing 4 changed files with 166 additions and 95 deletions
@@ -5,11 +5,11 @@ @@ -5,11 +5,11 @@
5 <span class="total-wait-apply">收款清单</span> 5 <span class="total-wait-apply">收款清单</span>
6 <span><span class="wait-label">待收金额:</span><span class="wait-price-num">￥{{props.data.waitApplyCashAmount}}</span></span> 6 <span><span class="wait-label">待收金额:</span><span class="wait-price-num">￥{{props.data.waitApplyCashAmount}}</span></span>
7 </p> 7 </p>
8 - <slot><div class="no-data">暂无收款清单</div></slot> 8 + <slot name="waitApply"><div class="no-data">暂无收款清单</div></slot>
9 </div> 9 </div>
10 <div class="income-detail-header"> 10 <div class="income-detail-header">
11 <p class="total-income">收入明细</p> 11 <p class="total-income">收入明细</p>
12 - <slot><div class="no-data">暂无收入明细</div></slot> 12 + <slot name="income"><div class="no-data">暂无收入明细</div></slot>
13 </div> 13 </div>
14 </div> 14 </div>
15 </template> 15 </template>
@@ -8,10 +8,17 @@ @@ -8,10 +8,17 @@
8 8
9 <incomeHeader :data="getAssetSummary" class="header-inner-padding"></incomeHeader> 9 <incomeHeader :data="getAssetSummary" class="header-inner-padding"></incomeHeader>
10 <payAccount class="inner-padding"></payAccount> 10 <payAccount class="inner-padding"></payAccount>
11 - <incomeDetail :data="incomeData">  
12 - <template v-for="(item,index) in incomeData.list"> 11 + <incomeDetail :data="assetData">
  12 + <template #waitApply>
  13 + <div v-for="(item,index) in assetData.waitApplyInfo.list" :key="index">
13 <incomeItem :item="item" :key="index"></incomeItem> 14 <incomeItem :item="item" :key="index"></incomeItem>
14 - </template> 15 + </div>
  16 + </template>
  17 + <template #income>
  18 + <div v-for="(item,index) in assetData.incomeInfo.list" :key="index">
  19 + <incomeItem :item="item" :key="index"></incomeItem>
  20 + </div>
  21 + </template>
15 </incomeDetail> 22 </incomeDetail>
16 <!-- 自定义下拉刷新内容 --> 23 <!-- 自定义下拉刷新内容 -->
17 <!-- <template v-if="customPullDown" slot="pulldown" slot-scope="props"> 24 <!-- <template v-if="customPullDown" slot="pulldown" slot-scope="props">
@@ -29,73 +36,77 @@ import incomeItem from './components/incomeItem'; @@ -29,73 +36,77 @@ import incomeItem from './components/incomeItem';
29 import pullDown from './components/pullDown'; 36 import pullDown from './components/pullDown';
30 import payAccount from './components/payAccount'; 37 import payAccount from './components/payAccount';
31 import { createNamespacedHelpers } from 'vuex'; 38 import { createNamespacedHelpers } from 'vuex';
32 -import {Style, Scroll} from 'cube-ui'; 39 +import {Style} from 'cube-ui';
33 import scrollMixin from '../../../mixins/scroll'; 40 import scrollMixin from '../../../mixins/scroll';
34 const {mapState, mapGetters, mapActions} = createNamespacedHelpers('home/mine'); 41 const {mapState, mapGetters, mapActions} = createNamespacedHelpers('home/mine');
  42 +
35 export default { 43 export default {
36 - mixins: [scrollMixin],  
37 - data() {  
38 - return {  
39 - page: 0,  
40 - totalPage: 0 44 + mixins: [scrollMixin],
  45 + data() {
  46 + return {
  47 + page: 0,
  48 + totalPage: 0
  49 + };
  50 + },
  51 + computed: {
  52 + ...mapGetters(['getAssetSummary']),
  53 + ...mapState({
  54 + assetData: (state) => state.assetData,
  55 + isEnd: state => {
  56 + const {incomeInfo} = state.assetData;
  57 +
  58 + return incomeInfo.isEnd;
41 } 59 }
42 - },  
43 - computed:{  
44 - ...mapGetters(['getAssetSummary']),  
45 - ...mapState({  
46 - incomeData: (state) => state.assetData  
47 - }),  
48 - loadingOptions() {  
49 - return {  
50 - hide: !this.totalPage,  
51 - noMore: this.page >= this.totalPage  
52 - }; 60 + }),
  61 + loadingOptions() {
  62 + return {
  63 + hide: !this.totalPage,
  64 + noMore: this.page >= this.totalPage
  65 + };
  66 + }
  67 + },
  68 + created() {
  69 + },
  70 + activated() {
  71 + this.fetchAssetsAsync(true);
  72 + },
  73 + watch: {
  74 + 'assetData.incomeInfo.list': function(val) {
  75 + if (val.length === 0) {
  76 + this.options.pullUpLoad.txt.noMore = '';
  77 + } else {
  78 + this.options.pullUpLoad.txt.noMore = '到底啦~';
53 } 79 }
54 - },  
55 - created() {  
56 - },  
57 - activated() {  
58 - this.fetchAssetsAsync(true)  
59 - },  
60 - watch: {  
61 - "incomeData.list": function(val) {  
62 - if(val.length === 0) {  
63 - this.options.pullUpLoad.txt.noMore = ''  
64 - // this.$refs.scroll.disable()  
65 - } else {  
66 - this.options.pullUpLoad.txt.noMore = '到底啦~'  
67 - // this.$refs.scroll.enable()  
68 - } 80 + }
  81 + },
  82 + methods: {
  83 + ...mapActions(['fetchAssets']),
  84 + onPullingUp() {
  85 + if (!this.isEnd) {
  86 + this.fetchAssetsAsync(false);
  87 + } else {
  88 + this.$refs.scroll.forceUpdate();
69 } 89 }
70 }, 90 },
71 - methods: {  
72 - ...mapActions(['fetchAssets']),  
73 - onPullingUp() {  
74 - if(!this.incomeData.endReached) {  
75 - this.fetchAssetsAsync(false)  
76 - } else {  
77 - this.$refs.scroll.forceUpdate()  
78 - }  
79 - },  
80 - fetchAssetsAsync(reFetch) {  
81 - return this.fetchAssets(reFetch).then(res => {  
82 - if (res.code === 200) {  
83 - let { page, pagetotal } = res.data || {}; 91 + fetchAssetsAsync(reFetch) {
  92 + return this.fetchAssets(reFetch).then(res => {
  93 + if (res) {
  94 + let { currentPage, totalPage } = res || {};
84 95
85 - this.page = page || 0;  
86 - this.totalPage = pagetotal || 0;  
87 - }  
88 - });  
89 - }  
90 - },  
91 - components: {  
92 - incomeHeader,  
93 - incomeDetail,  
94 - incomeItem,  
95 - pullDown,  
96 - payAccount,  
97 - Style 96 + this.page = currentPage || 0;
  97 + this.totalPage = totalPage || 0;
  98 + }
  99 + });
98 } 100 }
  101 + },
  102 + components: {
  103 + incomeHeader,
  104 + incomeDetail,
  105 + incomeItem,
  106 + pullDown,
  107 + payAccount,
  108 + Style
  109 + }
99 }; 110 };
100 </script> 111 </script>
101 112
@@ -24,14 +24,24 @@ export default function() { @@ -24,14 +24,24 @@ export default function() {
24 askBuyNum: 0, 24 askBuyNum: 0,
25 couponNum: 0, 25 couponNum: 0,
26 assetData: { 26 assetData: {
27 - isFetching: false,  
28 - list: [],  
29 - currentPage: 1,  
30 - pageSize: 20,  
31 - endReached: false,  
32 compensateIncome: '¥0.00', 27 compensateIncome: '¥0.00',
33 goodsIncome: '¥0.00', 28 goodsIncome: '¥0.00',
34 totalIncome: '¥0.00', 29 totalIncome: '¥0.00',
  30 + waitApplyCashAmount: '0.00',
  31 + waitApplyInfo: {
  32 + isEnd: false,
  33 + currentPage: 1,
  34 + pageSize: 20,
  35 + totalPage: 0,
  36 + list: []
  37 + },
  38 + incomeInfo: {
  39 + isEnd: false,
  40 + currentPage: 1,
  41 + pageSize: 20,
  42 + totalPage: 0,
  43 + list: []
  44 + }
35 }, 45 },
36 walletData: { 46 walletData: {
37 isFetching: false, 47 isFetching: false,
@@ -293,6 +303,18 @@ export default function() { @@ -293,6 +303,18 @@ export default function() {
293 state.resource1 = Object.assign({}, state.resource1, resource1); 303 state.resource1 = Object.assign({}, state.resource1, resource1);
294 state.resource2 = Object.assign({}, state.resource1, resource2); 304 state.resource2 = Object.assign({}, state.resource1, resource2);
295 }, 305 },
  306 +
  307 + setAssetStatisticalInfo(state, summary = {}) {
  308 + const {compensateIncome, goodsIncome, totalIncome, waitApplyCashAmount} = summary;
  309 +
  310 + state.assetData.compensateIncome = formatNumber(compensateIncome || 0);
  311 + state.assetData.goodsIncome = formatNumber(goodsIncome || 0);
  312 + state.assetData.totalIncome = formatNumber(totalIncome || 0);
  313 + state.assetData.waitApplyCashAmount = waitApplyCashAmount;
  314 + },
  315 + setAssets(state, assetsInfo = {}) {
  316 + state.assetData = {...state.assetData, ...assetsInfo};
  317 + }
296 }, 318 },
297 actions: { 319 actions: {
298 async fetchRollBoardList({ commit }) { 320 async fetchRollBoardList({ commit }) {
@@ -379,38 +401,82 @@ export default function() { @@ -379,38 +401,82 @@ export default function() {
379 commit('addCouponSummary', { count: result.data }); 401 commit('addCouponSummary', { count: result.data });
380 } 402 }
381 }, 403 },
382 - async fetchAssets({ commit, state }, isRefresh) {  
383 - let {  
384 - isFetching,  
385 - endReached,  
386 - currentPage,  
387 - list,  
388 - pageSize,  
389 - } = state.assetData; 404 + async fetchAssets({state, dispatch}, isRefresh) {
  405 + const {incomeInfo, waitApplyInfo} = state.assetData;
390 406
391 - if (isFetching || (!isRefresh && endReached)) { 407 + if (!isRefresh && waitApplyInfo.isEnd && incomeInfo.isEnd) {
392 return; 408 return;
393 } 409 }
394 - let oldList = isRefresh ? [] : list;  
395 410
396 - // commit('assetFetching', {isFetching: true});  
397 - let page = isRefresh ? 1 : currentPage + 1; 411 + if (waitApplyInfo.isEnd) {
  412 + const res = await dispatch('fetchInComeAssets');
  413 +
  414 + return res;
  415 + } else {
  416 + const res = await dispatch('fetchWaitApplyAssets', isRefresh);
  417 +
  418 + return res;
  419 + }
  420 + },
  421 +
  422 + async fetchInComeAssets({commit, state}, isRefresh) {
  423 + let {currentPage, list, pageSize} = state.assetData.incomeInfo;
  424 +
  425 + const page = isRefresh ? 1 : currentPage + 1;
  426 +
  427 + if (isRefresh) {
  428 + list = [];
  429 + }
  430 +
398 const result = await this.$api.get('/api/ufo/mine/assets', { 431 const result = await this.$api.get('/api/ufo/mine/assets', {
399 - type: 1, 432 + type: 2,
400 page, 433 page,
401 limit: pageSize, 434 limit: pageSize,
402 }); 435 });
403 436
404 - // commit('assetFetching', {isFetching: false});  
405 if (result.code === 200) { 437 if (result.code === 200) {
406 let assetData = parseAssetList(result.data); 438 let assetData = parseAssetList(result.data);
407 - let newList = [...oldList, ...assetData.list];  
408 439
409 - assetData.list = newList;  
410 - commit('addAssets', assetData); 440 + assetData.list = [...list, ...assetData.list];
  441 +
  442 + commit('setAssetStatisticalInfo', result.data.summary);
  443 + commit('setAssets', {incomeInfo: assetData});
  444 +
  445 + return assetData;
411 } 446 }
  447 + },
  448 +
  449 + async fetchWaitApplyAssets({commit, state, dispatch}, isRefresh) {
  450 + let {currentPage, list, pageSize} = state.assetData.waitApplyInfo;
412 451
413 - return result; 452 + const page = isRefresh ? 1 : currentPage + 1;
  453 +
  454 + if (isRefresh) {
  455 + list = [];
  456 + }
  457 +
  458 + const result = await this.$api.get('/api/ufo/mine/assets', {
  459 + type: 1,
  460 + page,
  461 + limit: pageSize,
  462 + });
  463 +
  464 + if (result.code === 200) {
  465 + let assetData = parseAssetList(result.data);
  466 +
  467 + assetData.list = [...list, ...assetData.list];
  468 +
  469 + commit('setAssetStatisticalInfo', result.data.summary);
  470 + commit('setAssets', {waitApplyInfo: assetData});
  471 +
  472 + if (assetData.isEnd) {
  473 + const res = await dispatch('fetchInComeAssets', isRefresh);
  474 +
  475 + return res;
  476 + }
  477 +
  478 + return assetData;
  479 + }
414 }, 480 },
415 481
416 async applyCash(_, id) { 482 async applyCash(_, id) {
@@ -5,7 +5,6 @@ export function parseAssetList(json) { @@ -5,7 +5,6 @@ export function parseAssetList(json) {
5 data, 5 data,
6 page, 6 page,
7 pagetotal, 7 pagetotal,
8 - summary  
9 } = json; 8 } = json;
10 let parsedList = data ? data.map((item) => { 9 let parsedList = data ? data.map((item) => {
11 let price = ''; 10 let price = '';
@@ -40,19 +39,14 @@ export function parseAssetList(json) { @@ -40,19 +39,14 @@ export function parseAssetList(json) {
40 isWaitApply: item.links.includes('applyCash') 39 isWaitApply: item.links.includes('applyCash')
41 }; 40 };
42 }) : []; 41 }) : [];
43 - let endReached = parsedList.length === 0 || page === pagetotal; 42 + let isEnd = parsedList.length === 0 || page === pagetotal;
44 let dealedList = { 43 let dealedList = {
45 currentPage: page, 44 currentPage: page,
  45 + totalPage: pagetotal,
46 list: parsedList, 46 list: parsedList,
47 - endReached, 47 + isEnd,
48 }; 48 };
49 49
50 - if (summary) {  
51 - dealedList.compensateIncome = summary.compensateIncome;  
52 - dealedList.goodsIncome = summary.goodsIncome;  
53 - dealedList.totalIncome = summary.totalIncome;  
54 - dealedList.waitApplyCashAmount = summary.waitApplyCashAmount;  
55 - }  
56 return dealedList; 50 return dealedList;
57 } 51 }
58 export function formatNumber(number) { 52 export function formatNumber(number) {