From 5d88d474e14f38421876cf6d796e11d6e0f31e53 Mon Sep 17 00:00:00 2001
From: "liujw155@outlook.com" <liujw155@outlook.com>
Date: Mon, 29 Aug 2022 17:59:58 +0800
Subject: [PATCH] add income api

---
 src/pages.json                                     |  17 +
 .../components/details_item/details_item.vue       |  87 ++++
 src/subpackage/income/js/api.js                    |   8 +
 src/subpackage/income/js/server.js                 |  10 +
 .../income/pages/details_record/details_record.vue | 561 +++++++++++++++++++++
 src/subpackage/income/pages/search/search.vue      |  84 +++
 src/subpackage/income/static/images/bot_arrow.png  | Bin 0 -> 401 bytes
 src/subpackage/income/static/images/calendar.png   | Bin 0 -> 430 bytes
 src/subpackage/income/static/images/close.png      | Bin 0 -> 769 bytes
 src/subpackage/income/static/images/filter.png     | Bin 0 -> 483 bytes
 src/subpackage/income/static/images/search.png     | Bin 0 -> 660 bytes
 11 files changed, 767 insertions(+)
 create mode 100644 src/subpackage/income/components/details_item/details_item.vue
 create mode 100644 src/subpackage/income/js/api.js
 create mode 100644 src/subpackage/income/js/server.js
 create mode 100644 src/subpackage/income/pages/details_record/details_record.vue
 create mode 100644 src/subpackage/income/pages/search/search.vue
 create mode 100644 src/subpackage/income/static/images/bot_arrow.png
 create mode 100644 src/subpackage/income/static/images/calendar.png
 create mode 100644 src/subpackage/income/static/images/close.png
 create mode 100644 src/subpackage/income/static/images/filter.png
 create mode 100644 src/subpackage/income/static/images/search.png

diff --git a/src/pages.json b/src/pages.json
index 6082199..fe088c7 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -278,6 +278,23 @@
     ],
 	"subpackages": [
 		{
+			"root": "subpackage/income",
+			"pages": [
+				{
+					"path": "pages/search/search",
+					"style" : {
+						"navigationBarTitleText": "收款明细"
+					}
+				},
+				{
+					"path": "pages/details_record/details_record",
+					"style" : {
+						"navigationBarTitleText": "收款明细"
+					}
+				}
+			]
+		},
+		{
 			"root": "subpackage/device",
 			"pages": [
 				{
diff --git a/src/subpackage/income/components/details_item/details_item.vue b/src/subpackage/income/components/details_item/details_item.vue
new file mode 100644
index 0000000..de8d7ce
--- /dev/null
+++ b/src/subpackage/income/components/details_item/details_item.vue
@@ -0,0 +1,87 @@
+<template>
+    <view class="dl-item">
+        <view class="di-name">{{ incomeInfo.source || '-' }}</view>
+        <view class="di-top-line">
+            <view class="dtl-view">{{ incomeInfo.desc || '-' }}</view>
+            <view :class="[ 'dtl-view', incomeInfo.amount > 0 ? 'orange' : '' ]">{{ incomeInfo.amount || '-' }}</view>
+        </view>
+        
+        <view class="di-bot-line">
+            <view class="dbl-view">{{ incomeInfo.operator_text || '-' }}</view>
+            <view class="dbl-view" v-if="incomeInfo.amount < 0">{{ incomeInfo.refund_desc || '-' }}</view>
+        </view>
+        <view class="di-bot-line">
+            <view class="dbl-view">{{ incomeInfo.order_no || '-' }}</view>
+        </view>
+        <view class="di-bot-line">
+            <view class="dbl-view">{{ incomeInfo.created_at || '-' }}</view>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    props: {
+        incomeInfo: {
+            default: {},
+            type: Object,
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    .dl-item{
+        padding: 30upx 40upx 30upx 0;
+        border-bottom: 2upx solid #D8D8D8;
+        .di-name{
+            margin-bottom: 20upx;
+            line-height: 40upx;
+            font-size: 28upx;
+            color: #1A1A1A;
+            @include textHide(1);
+        }
+        .di-top-line{
+            margin-bottom: 20upx;
+            @include centerFlex(space-between);
+            >.dtl-view{
+                font-size: 32upx;
+                line-height: 44upx;
+                color: #1A1A1A;
+                @include textHide(1);
+                &:first-child{  
+                    flex-shrink: 0;
+                    max-width: 50%;
+                }
+                &+.dtl-view{
+                    font-weight: 500;
+                    text-align: right;
+                    &.orange{
+                        color: #F6843E;
+                    }
+                }
+            }
+        }
+        .di-bot-line{
+            @include centerFlex(space-between);
+            >.dbl-view{
+                font-size: 24upx;
+                line-height: 34upx;
+                color: #9C9C9F;
+                &:first-child{
+                    flex-grow: 1;
+                    @include textHide(1);
+
+                }
+                &+.dbl-view{
+                    margin-left: 16upx;
+                    flex-shrink: 0;
+                    text-align: right;
+                }
+            }
+        }
+
+
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/income/js/api.js b/src/subpackage/income/js/api.js
new file mode 100644
index 0000000..6a2e5d5
--- /dev/null
+++ b/src/subpackage/income/js/api.js
@@ -0,0 +1,8 @@
+import { ORIGIN } from '../../../js/api';
+
+export const INCOME_API = { 
+	consumeCountDetailList:`${ORIGIN}/admin/stadium/consumeCountDetail/list`,  //  收款明细列表
+	consumeRecordSceneLs:`${ORIGIN}/consumeRecordScene/list`,  //  收款明细列表
+}
+
+export default { ORIGIN, INCOME_API };
\ No newline at end of file
diff --git a/src/subpackage/income/js/server.js b/src/subpackage/income/js/server.js
new file mode 100644
index 0000000..55fd0bf
--- /dev/null
+++ b/src/subpackage/income/js/server.js
@@ -0,0 +1,10 @@
+import { Server } from '../../../js/server';
+
+class Servers extends Server {
+    constructor(props){
+        super(props)
+    }
+}
+
+
+export default new Servers();
\ No newline at end of file
diff --git a/src/subpackage/income/pages/details_record/details_record.vue b/src/subpackage/income/pages/details_record/details_record.vue
new file mode 100644
index 0000000..2ced899
--- /dev/null
+++ b/src/subpackage/income/pages/details_record/details_record.vue
@@ -0,0 +1,561 @@
+<template>
+    <view class="details-record">
+        <view class="dr-header">
+            <view class="dh-filter">
+                <view class="df-date">
+                    <view class="df-name">收款日期</view>
+                    <picker mode="date" @change="dateChange">
+                        <view class="dd-frame">
+                            <input disabled :value="incomeTime" v-if="!isFilterModal" />
+                            <view></view>
+                            <image mode="aspectFit" src="/subpackage/income/static/images/calendar.png"></image>
+                        </view>
+                    </picker>
+                    
+                </view>
+                <view class="df-right">
+                    <view class="df-name" @click="filterShow">筛选</view>
+                    <view class="dr-icons">
+                        <image @click="filterShow" mode="aspectFit" src="/subpackage/income/static/images/filter.png"></image>
+                        <view></view>
+                        <image @click="toSearch" mode="aspectFit" src="/subpackage/income/static/images/search.png"></image>
+                    </view>
+                </view>
+            </view>
+            <view class="type-bar">
+                <view 
+                     v-for="(e, i) in incomeTypeLs" :key="i"
+                    :class="['tb-item', e.eng == incomeTypeInfo.eng ?'ti-active': '']"
+                    @click="incomeTypeChange(e)"
+                >{{ e.name || '-' }}</view>
+            </view>
+            <view class="tab-bar">
+                <view :class="[ 'tb-item', type == '全部'? 'tb-active' : '' ]" @click="typeChange('全部')"><view>全部</view></view>
+                <view :class="[ 'tb-item', type == '退款'? 'tb-active' : '' ]" @click="typeChange('退款')"><view>退款</view></view>
+            </view>
+            <view class="dh-total">
+                收款{{ incomeMes.income_num || 0 }}笔（<text>￥{{ incomeMes.income_amount || 0 }}</text>） ，
+                退款{{ incomeMes.refund_num || 0 }}笔（<text>￥{{ incomeMes.refund_amount || 0 }}</text>）
+            </view>
+            
+        </view>
+        <view class="dr-ls">
+            <details-item 
+                v-for="(e, i) in incomeLs" 
+                :key="i"
+                :income-info="e"
+            ></details-item>
+        </view>
+
+        <view class="dr-mask" v-if="isFilterModal" @touchmove.stop.prevent='_=>false' @click="isFilterModal = false">
+            <view class="dm-content" @click.stop="_=>false">
+                <image 
+                    class="dc-close" 
+                    mode="aspectFit" 
+                    src="/subpackage/income/static/images/close.png" 
+                    @click="isFilterModal = false"
+                ></image>
+                <view class="dc-header" id="dcheader">
+                    <view class="dc-tit">筛选</view>
+                    <view class="dc-stadium">
+                        <view class="ds-name">门店</view>
+                        <picker>
+                            <view class="ds-frame">
+                                <input />
+                                <image mode="aspectFit" src="/subpackage/income/static/images/bot_arrow.png"></image>
+                            </view>
+                        </picker>
+                    </view>
+                    <view class="dc-scene-name">收款场景（{{ incomeTypeInfo.name || '-' }}）</view>
+                </view>
+                <scroll-view class="dc-scroll" scroll-y :style="modalScrollViewHeight?('height:'+ modalScrollViewHeight + 'px;'): ''">
+                    <view class="dc-scene-ls">
+                        <view class="dsl-item" v-for="(e, i) in sceneLs" :key="i">{{ e.name || '-' }}</view>
+                    </view>
+                </scroll-view>
+                <view class="dc-btn-bar" id="dcbotbar">
+                    <view class="dbb-btns">
+                        <view>重置</view>
+                        <view>确定</view>
+                    </view>
+                </view> 
+            </view> 
+        </view>
+    </view>
+</template>
+
+<script>
+    import details_item from '../../components/details_item/details_item.vue';
+    import util from '../../../../utils/util';
+    import { INCOME_API } from '../../js/api';
+    import server from '../../js/server';
+    let incomeTypeLs = [
+        {
+            name: '线上收款',
+            eng: 'online',
+        },
+        {
+            name: '线下收款',
+            eng: 'offline'
+        },
+        {
+            name: '联营收款',
+            eng: ' joint'
+        },
+    ];
+    export default {
+        components: {
+            'details-item': details_item
+        },
+        data(){
+            return {
+                modalScrollViewHeight: '',
+                isFilterModal: false,
+                incomeTime: '',
+
+                incomeLs: [],
+                incomeMes: {},
+                page: 1,
+
+                type: '全部',       // 全部/退款
+                incomeTypeLs,
+                incomeTypeInfo: {},    // online 线上收款  offline 线下收款  joint 联营
+
+                sceneLs: [],
+            }
+        },
+        onLoad(){
+            let _timeStr =  util.formatDate({});
+            this.incomeTime = _timeStr;
+            this.incomeTypeInfo = incomeTypeLs[0];
+            this.refreshPage();
+        },
+        methods: {
+            filterShow(){
+                let { incomeTypeInfo } = this;
+                this.isFilterModal = true;
+                this.$nextTick(_=>{
+                    this.initFilterScrollView();
+                    this.getSceneLs({
+                        income_type: incomeTypeInfo.eng || ''
+                    })
+                });
+                
+            },
+            getSceneLs({
+                brand_id = '',
+                stadium_id = '',
+                income_type = '',
+            }){
+                server.get({
+                    url: INCOME_API.consumeRecordSceneLs,
+                    data: {
+                        brand_id,
+                        stadium_id,
+                        income_type,
+                    },
+                    failMsg: '加载场景列表失败！'
+                })
+                .then(res=>{
+                    this.sceneLs = res || [];
+                })
+            },
+            incomeTypeChange(incomeTypeInfo){
+                this.incomeTypeInfo = incomeTypeInfo || {};
+                this.refreshPage();
+            },
+            typeChange(type){
+                this.type = type;
+                this.refreshPage();
+            },
+            dateChange(e){
+                let _time = e.detail.value || ''
+                this.incomeTime = _time;
+                this.refreshPage();
+            },
+            refreshPage(){
+                this.$nextTick(_=>{
+                    let { incomeTime, type, incomeTypeInfo } = this;
+                    this.page = 1;
+                    this.incomeLs = [];
+                    this.incomeMes = {};
+                    this.getRecordLs({
+                        type: type || '',
+                        time_str: incomeTime || '',
+                        income_type: incomeTypeInfo.eng || '',
+                    });
+                })
+            },
+            getRecordLs({
+                brand_id = '',
+                stadium_id = '',    // 空字符全部  -1品牌收款  其他门店id
+                time_str = '',      // 日期y-m-d
+                scene = '',         // 场景  int
+                type = '全部',      // 全部/退款
+                income_type = '',   // 收款类型  online 线上收款  offline线下收款  joint联营
+                page = 1,
+                page_size = 20,
+            }){
+                util.showLoad();
+                server.get({
+                    url: INCOME_API.consumeCountDetailList,
+                    data: {
+                        brand_id,
+                        stadium_id,
+                        time_str,
+                        page,
+                        page_size,
+                        scene,
+                        type,
+                        income_type,
+                    },
+                    failMsg: '加载失败！',
+                })
+                .then(res=>{
+                    util.hideLoad();
+                    let { list, ...data } = res;
+                    this.incomeMes = data || {};
+                    let _ls = list || [];
+                    if(page == 1)return this.incomeLs = _ls;
+                    if(!_ls || !_ls.length)return util.showNone('没有更多！');
+                    this.incomeLs = [ ...this.incomeLs, ..._ls ];
+                    this.page = page;
+                   
+                })
+            },
+            
+            toSearch(){
+                util.routeTo(`/subpackage/income/pages/search/search`, 'nT');
+            },
+            
+            async initFilterScrollView(){
+                try{
+                    let _header = await util.getNodeMes('#dcheader');
+                    let _botBar =  await util.getNodeMes('#dcbotbar');
+                    let _sysInfo = uni.getSystemInfoSync();
+                    this.modalScrollViewHeight = (_sysInfo.windowHeight || 0) - ((_header.height || 0) + (_botBar.height || 0))
+                }catch(err){
+                    console.warn('initFilterScrollView err -->', err);
+                }
+                
+            },
+        },
+    }
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    .dr-header{
+        margin-bottom: 24upx;
+        background-color: #fff;
+        .dh-filter{
+            padding: 26upx 24upx;
+            @include centerFlex(space-between);
+            .df-name{
+                flex-shrink: 0;
+                font-size: 28upx;
+                line-height: 40upx;
+                color: #9C9C9F;
+            }
+            .df-date{
+                @include centerFlex(flex-start);
+                .dd-frame{
+                    flex-shrink: 0;
+                    padding: 0 20upx;
+                    margin-left: 20upx;
+                    width: 286upx;
+                    height: 92upx;
+                    border-radius: 10upx;
+                    background-color: #F2F2F7;
+                    @include centerFlex(space-between);
+                    >input{
+                        flex-grow: 1;
+                        height: 100%;
+                        font-size: 28upx;
+                        color: #1a1a1a;
+                    }
+                    >view{
+                        flex-shrink: 0;
+                        margin: 0 20upx;
+                        height: 40upx;
+                        width: 1px;
+                        background-color: #B2B2B2;
+                    }
+                    >image{
+                        flex-shrink: 0;
+                        width: 40upx;
+                        height: 40upx;
+                    }
+                }
+            }
+            .df-right{
+                flex-shrink: 0;
+                @include centerFlex(flex-end);
+                .dr-icons{
+                    margin-left: 12upx;
+                    flex-shrink: 0;
+                    flex-wrap: nowrap;
+                    @include centerFlex(center);
+                    >image{
+                        flex-shrink: 0;
+                        flex-grow: 0;
+                        width: 40upx;
+                        height: 40upx;
+
+                    }
+                    >view{
+                        flex-grow: 0;
+                        flex-shrink: 0;
+                        margin: 0 30upx;
+                        height: 40upx;
+                        width: 1px;
+                        background-color: #B2B2B2;
+                    }
+                }
+                
+            }
+
+        }
+        .type-bar{
+            padding: 20upx 0;
+            @include centerFlex(center);
+            .tb-item{
+                margin: 0 16upx;
+                padding: 0 28upx;
+                line-height: 72upx;
+                text-align: center;
+                font-size: 36upx;
+                font-weight: 500;
+                border-radius: 36upx;
+                color: #1A1A1A;
+                &.ti-active{
+                    color: #fff;
+                    background-color: $themeColor;
+                }
+            }
+            
+        }
+        .tab-bar{
+            @include centerFlex(center);
+            border-top: 2upx solid #D8D8D8;
+            border-bottom: 2upx solid #D8D8D8;
+            .tb-item{
+                margin: 0 92upx;
+                padding: 0 28upx;
+                &.tb-active{
+                    position: relative;
+                    &::after{
+                        content: '';
+                        position: absolute;
+                        left: 0;
+                        bottom: 0;
+                        width: 100%;
+                        height: 8upx;
+                        border-radius: 4upx;
+                        background-color: $themeColor;
+                    }
+                    >view{
+                        color: $themeColor;
+                    }
+                }   
+                >view{
+                    line-height: 110upx;
+                    text-align: center;
+                    font-size: 32upx;
+                    color: #9C9C9F;
+                }
+            }
+        }
+        .dh-total{
+            padding: 0 48upx;
+            line-height: 110upx;
+            font-size: 24upx;
+            color: #9C9C9F;
+            @include textHide(1);
+            >text{
+                color: #F6843E;
+            }
+        }
+    }
+    .dr-ls{
+        padding-bottom: 120upx;
+        padding-bottom: calc( 120upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+        padding-bottom: calc( 120upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
+        padding-left: 40upx;
+        background-color: #fff;
+        .dl-item{
+            padding: 30upx 40upx 30upx 0;
+            border-bottom: 2upx solid #D8D8D8;
+            .di-name{
+                margin-bottom: 20upx;
+                line-height: 40upx;
+                font-size: 28upx;
+                color: #1A1A1A;
+                @include textHide(1);
+            }
+            .di-top-line{
+                margin-bottom: 20upx;
+                @include centerFlex(space-between);
+                >view{
+                    font-size: 32upx;
+                    line-height: 44upx;
+                    color: #1A1A1A;
+                    @include textHide(1);
+                    &:first-child{  
+                        flex-shrink: 0;
+                        max-width: 50%;
+                    }
+                    &+view{
+                        font-weight: 500;
+                        text-align: right;
+                    }
+                }
+            }
+            .di-bot-line{
+                @include centerFlex(space-between);
+                >view{
+                    font-size: 24upx;
+                    line-height: 34upx;
+                    color: #9C9C9F;
+                    &:first-child{
+                        flex-grow: 1;
+                        @include textHide(1);
+
+                    }
+                    &+view{
+                        margin-left: 16upx;
+                        flex-shrink: 0;
+                        text-align: right;
+                    }
+                }
+            }
+
+
+        }
+    }
+    .dr-mask{
+        position: fixed;
+        left: 0;
+        right: 0;
+        top: 0;
+        bottom: 0;
+        background-color: rgba($color: #000000, $alpha: .5);
+        .dm-content{
+            position: absolute;
+            right: 0;
+            bottom: 0;
+            top: 0;
+            
+            width: 600upx;
+            background-color: #fff;
+            .dc-header{
+                padding-top: 36upx;
+                padding-bottom: 40upx;
+            }
+            .dc-close{
+                position: absolute;
+                right: 34upx;
+                top: 20upx;
+                width: 40upx;
+                height: 40upx;
+            }
+            .dc-tit{
+                margin-bottom: 20upx;
+                text-align: center;
+                line-height: 40upx;
+                font-size: 28upx;
+                color: #9C9C9F;
+            }
+            .dc-stadium{
+                margin-bottom: 20upx;
+                padding: 26upx 30upx;
+                @include centerFlex(space-between);
+                .ds-name{
+                    flex-shrink: 0;
+                    font-size: 28upx;
+                    line-height: 40upx;
+                    color: #9C9C9F;
+                }
+                .ds-frame{
+                    padding: 0 20upx;
+                    width: 476upx;
+                    height: 92upx;
+                    border-radius: 10upx;
+                    background-color: #F2F2F7;
+                    @include centerFlex(space-between);
+                    >image{
+                        flex-shrink: 0;
+                        margin-left: 12upx;
+                        width: 28upx;
+                        height: 28upx;
+                    }
+                    >input{
+                        flex-grow: 1;
+                        height: 100%;
+                        font-size: 28upx;
+                        color: #1a1a1a;
+                    }
+                }
+            }
+            .dc-scene-name{
+                
+                padding-left: 34upx;
+                line-height: 44upx;
+                font-weight: 500;
+                font-size: 32upx;
+                color: #1A1A1A;
+            }
+            .dc-scroll{
+                width: 100%;
+                height: 600upx;
+                .dc-scene-ls{
+                    padding: 0 20upx;
+                    display: flex;
+                    flex-wrap: wrap;
+                    .dsl-item{
+                        margin: 14upx 10upx;
+                        width: 164upx;
+                        height: 64upx;
+                        line-height: 64upx;
+                        text-align: center;
+                        background-color: #F2F2F7;
+                        border-radius: 10upx;
+                        font-size: 24upx;
+                        color: #1A1A1A;
+                        @include textHide(1);
+                    }
+                }
+            }
+            .dc-btn-bar{
+                padding: 20upx 30upx;
+                padding-bottom: calc( 20upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+                padding-bottom: calc( 20upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
+                .dbb-btns{
+                    height: 80upx;
+                    border: 2upx solid $themeColor;
+                    background-color: $themeColor;
+                    border-radius: 40upx;
+                    @include centerFlex(space-between);
+                    >view{
+                        flex-shrink: 0;
+                        flex-grow: 0;
+                        text-align: center;
+                        line-height: 76upx;
+                        width: 50%;
+                        height: 100%;
+                        font-size: 28upx;
+                        color: #fff;
+                        border-radius: 40upx;
+                        &:first-child{
+                            background-color: #fff;
+                            color: $themeColor;
+                            border-top-right-radius: 0;
+                        }
+                    }
+                }
+            }
+            
+
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/income/pages/search/search.vue b/src/subpackage/income/pages/search/search.vue
new file mode 100644
index 0000000..5bc197d
--- /dev/null
+++ b/src/subpackage/income/pages/search/search.vue
@@ -0,0 +1,84 @@
+<template>
+    <view class="income-search">
+        <view class="is-search-bar">
+            <view class="isb-frame">
+                <image class="if-search-icon"></image>
+                <input />
+                <image class="if-close-icon"></image>
+            </view>
+        </view>
+        <view class="is-main">
+            <view class="im-null" v-if="false">
+                <image></image>
+            </view>
+            <view class="im-ls">
+                <details-item v-for="i in 20" :key="i"></details-item>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+import details_item from '../../components/details_item/details_item.vue';
+export default {
+    components: {
+        'details-item': details_item
+    }
+}
+</script>
+
+<style lang="scss">
+    @import '~style/public.scss';
+    page{
+        background-color: #fff;
+    }
+    .is-search-bar{
+        padding: 30upx 24upx;
+        .isb-frame{
+            padding: 0 24upx;
+            height: 72upx;
+            border: 2upx solid $themeColor;
+            border-radius: 36upx;
+            @include centerFlex(space-between);
+            >input{
+                flex-grow: 1;
+                height: 68upx;
+                font-size: 28upx;
+                color: #1a1a1a;
+            }
+            >image{
+                flex-shrink: 0;
+                width: 30upx;
+                height: 30upx;
+                background-color: skyblue;
+            }
+            .if-search-icon{
+                margin-right: 24upx;
+            }
+            .if-close-icon{
+                margin-left: 24upx;
+            }
+        }
+    }
+    .is-main{
+        border-top: 24upx solid #f2f1f6;
+        .im-null{
+            padding-top: 106upx;    
+            >image{
+                margin: 0 auto;
+                display: block;
+                width: 370upx;
+                height: 370upx;
+                background-color: skyblue;
+            }
+        }
+        
+        .im-ls{
+            padding-bottom: 120upx;
+            padding-bottom: calc( 120upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */
+            padding-bottom: calc( 120upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */
+            padding-left: 40upx;
+            background-color: #fff;
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/subpackage/income/static/images/bot_arrow.png b/src/subpackage/income/static/images/bot_arrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..832ff960cacdb8ec78601a7bd5188ad25422eff5
GIT binary patch
literal 401
zcmeAS@N?(olHy`uVBq!ia0vp^79h;R3?!pgsObVJg8-ipS0KG*%a$EGc5H?LAb0!r
z?VC1j0y2<EpgfR!z{1HHsE5BK$S;`T23O#xSbdq*z2_VD%*))6!R*4oz{u$7;uvCa
z`t4;yFXlv%BOepR?=s)u(yL<B-P0(Rq%5WscJP#w<A(F1Ehf{F5*3?nMY12f7Ifi|
zvWLRoC%HlrGp6TGGW%cmqc;BIhMbtjnO7s$%obJ%e>;!)#kcGCCtBB5ykf9^^3Zh8
z+VD@jS8Xld9PH+_-&p1S>A?NHn;bu}UX@R-O1HO9{=)cYvZwBB#r=)in*t}FIA|8Y
zsuikqT_84K)sc?^XRDWb)v%bnomtW1ktKF`!mC9q)tpv!FPrsZmCKH-MJt6u4MV*<
zD}PNsx?<jnDKnM}Z*-UvDx9ljxLW9QNK)8-k9UigdKXpPDO;CX|9)ql?X7qD>~C|E
d?q%t0c5Bk*T>gfWwF4MV44$rjF6*2UngEmNv#9_8

literal 0
HcmV?d00001

diff --git a/src/subpackage/income/static/images/calendar.png b/src/subpackage/income/static/images/calendar.png
new file mode 100644
index 0000000000000000000000000000000000000000..ddceee604c215c9377477f4360e902fe668fceef
GIT binary patch
literal 430
zcmeAS@N?(olHy`uVBq!ia0vp^0U*r63?ysp-_HY5S^+*Gt{}nsll~2-{cBG7*PZaM
zKM~k)(!cIxK;x;v##4UvK*s3+kjRPkf_)2ss(DL-{DK*Fxrn_y6aO{TY`I4NS%Y2N
z3=E8Fo-U3d9><d<SY4RYnD^AMc<>&6kj&t%s=8EiW4QIy1crn2d)DOL)^t?ZQ5`P8
zC-BGgCP(R=)9)WKhDtx+D!=+DxT4lHCh^_fpgUph_xG~#w{5<z>d^OnZ_@{!ruz}q
z>|#E1ve%n6T=^a6$Rg8pUa&fwDWt{o+ae~u)_}+&(Nl3Q8ZDm;MIUuI`Lym3VqNC6
zCLu#>PD8Y!de@<}<T(eJA|IBD+bj_Cd>Ff@A*8ist=dK7mge*gE{YwQ2hJQg)8H1I
zqGYV0!())))7rV<fT;6wLs6sSO-Zj;F<SY~b2=0z{Oydwsn#W$CJas{RVM4&Gh_O-
zT*5mtY7*E#9AjT(+03ml%eaG0NUgzaf=6zVVBV31CftQhrZ-pc`p!u(I=q3IA!F0o
VM{hS=OalfbgQu&X%Q~loCICE!sw@Bi

literal 0
HcmV?d00001

diff --git a/src/subpackage/income/static/images/close.png b/src/subpackage/income/static/images/close.png
new file mode 100644
index 0000000000000000000000000000000000000000..9b9d62059472e14b7286012bfc381d340b8b6c1a
GIT binary patch
literal 769
zcmV+c1OEJpP)<h;3K|Lk000e1NJLTq002M$002k`0{{R3apVJm0000pP)t-spP#A#
z005z(te~K)prERtpsJvttD&K+prEUwqOG8ytf8T-prERtpsJyvte~K)prEQn`sC37
z000qmQchF;026TK$=YA1DmossnoWv)fS#Sa0007PNkl<ZSi{Ab+mhrU2!@FYcsB3<
zw43VbS)&-!W_N1-zUb-$U&H`HVEac+0qXsl=|@+flnRHAw<iFvQ$#X{2xHQI3E;Ry
zG;or^SlE3AP+nVtv)(AO+N*m&&<K}89c}<hm<xoO0dgdm$pBEy*8oQNK*$#WrQt(q
zH3GN-AFDVC2niOHLJv>{mQ+*+U|1Bl0ET7p8IW-ufVl#cg$J_gFF?~10O@Z)!2YK(
z5KZ?vyZ~YcWA>hfQ>GkWcd5o-0FSM`e-)&TV7|gvw@dIZfF9nS&=Ac2j`x<U4?y=%
zApe~k>3sch!r8Dv9|I<DmC)Kt0OkXrFJiQ=*VOcN5jr1WO8{~c>poQf4~eU#4Sa;2
z;I^|Dq)+xnTn#kBl+f6dtg(;?gzU)+t~53>oD)O?Qr2x!3{oaSvjFKu>%SC%fqTMr
z#!7R!57Pg8fZPX$bx{q;Y0WlQ-!})bPgm9rK<2;53rV=x++FkyV*+)7RP$HJrEwr7
zny+6?36wzN%wBQvvwc7fKF<8-CLZKIL@x^p>|OjvckM+Ql(eFn_-_fBL`f3|YnJg}
z^CA>kR6`PFUBth2<Eos(;9$w4{Eu$90zEp~_UgYRcoavQ$W_{%Qclz#n}Z5IjSkmM
zVfWu%M-ZZ-OS>vmZ@|XS8Vs&I(z6z4)?}HrChH&=Sd_{Cwb4AZ+Um+?dx=nj00_d3
zy#UngyOrUqktgHA{TmNmmf%KY^K|TEyqmb>*e4J-=J%s7ry&Cqk4ImrkavsJc#d|@
zVQKt#Tr46PLx{Gpd-wq2t>1bCQlG;7<O==(6nz!T*mMyb00000NkvXXu0mjfetKiY

literal 0
HcmV?d00001

diff --git a/src/subpackage/income/static/images/filter.png b/src/subpackage/income/static/images/filter.png
new file mode 100644
index 0000000000000000000000000000000000000000..76517f8e71fd71e7d1591eaf4805188624151561
GIT binary patch
literal 483
zcmeAS@N?(olHy`uVBq!ia0vp^0U*r53?z4+XPOVB%mREuT!Hj-Fql1i_KX=bX3d%f
zBxlZ?2`7OJIDn`GazFEOe*o$fDhcunX889)?4#4|q(cSkO)o7D^V?A;lK3!!fq~J>
z)5S3);_%xU2m1~g@UYIkq3Juz;phMPcWoVVt_gXDtlt)8^yt>a=c0NCQjC6je=tzs
zO#R3n>6LJQ+8oBr)rXwUN!EDX%`a5bIpJirPFc*U@Jzz;B_F)w<}zkCoN`^~u}^vu
zcbr2(>SG~B>qZT^-Cpxeg19btdMv4lnR|C~&Fjy1k0@^ne?Nmc;dpK2`|nY2f41JW
zdiQvJ+xop($NiMU=HGdr`&CM6@9I~%QvE+}tSHNQ7hap2oN;e??JSMexAzLpa;Z#y
zz3-KEfNa@S>x4T~3oq|m_^S4|rq8DGD<1hhSFeZruD^QAV{3WE@g=<~-=*&xzI>%q
zb-et_v4DQLyAxOIcBrh@-BDev+$p<ub@yJu-tsTy8*Y7cbdyf5*(Z^&a^!elnv;Wl
z>;Kq}<@*b`mVe+m<o|c+gyNEC+?zk&-_djJ|CWO(pR8*bg97+A=;SDD1%^3;r>mdK
II;Vst00GG5G5`Po

literal 0
HcmV?d00001

diff --git a/src/subpackage/income/static/images/search.png b/src/subpackage/income/static/images/search.png
new file mode 100644
index 0000000000000000000000000000000000000000..78220ee0a90689d79a16caf396eec2bfe5af39c8
GIT binary patch
literal 660
zcmeAS@N?(olHy`uVBq!ia0vp^0U*r53?z4+XPOVB%mREuT!HlT>C<P-m@#YCEC>V0
z1_B@(C<15C1Oo^cNUE$5bq4AbDhcunX88A3=-852rCUZbt^FG_-MTlk^G=z}z`*$1
z)5S3);_%xUw~Ja8cwAdmVp!k&|DSWdIY>8jLF3G_XK&n(sw&Qop0@qp`h=gSo7M=L
zNSiyE1WCEvT9kV5i`0vwLXrAft)c((JPx|G2Z>C2v8XlvgGg8O!lt@8BK(u)o^Wvs
zNzvH)IZTB2&{oTspSt_j<e$HN=$d0(a&e&Q>aD(7R>i7pcMlY&-%kvPbAGq`o7RJ$
zdshoRykmbyNQC!N+jF~Xi^Ae<Jin!xU0OMD)syhJ$r0NdW2FB&{ad+kx!Ly%rCT26
zEzsY&xSjFLx&rS|z29DU(=6D1bpI`qF}Y&YQ<pj6_?(wf&07mkg<A=1{=a~i<7WTI
z=a$!{3M40A_LsXeEiKnSj_3I4D||lg>W7+F9=^1&AV07AkIz?ztAf*Xi*w5E|CU=|
zzpv}*k5h9ttn$h}vG&WAe`-$r0*~(XAKKk8m36aG>_@Q~zZzbOWt1&=%X~{VgKNQ^
z#$Eg?`roH9|5Wt%=eln;x%ce+s?Fl;|2~;kHa^W~+-$D-&&;ZF@pF0CW%AR09N+no
z{oJpKJAPU@GxNO-u-x)_ov5+C-JjJn9VALC&uFrJ`}$2wa;Er)NfH*SO<WU0j~Fap
zk?1n>Y0Py_XD&y%^?{$gL;pQ~y^uN1@a<CViBb&#`rlKPUOKXRdOMxi<5@UWoNLpZ
nQ+b|$Hk|gTOr5^H?Uit4v*<#PI%Nl7B4O}!^>bP0l+XkKW-2ug

literal 0
HcmV?d00001