150 lines
3.5 KiB
Vue
150 lines
3.5 KiB
Vue
<template>
|
|
<up-sticky bgColor="#fff">
|
|
<up-tabs :list="tabsLst" :itemStyle="{width:'33vw',paddingBottom:'20rpx'}" lineColor='#50C758' :current='mark'
|
|
@change="tabsChange"></up-tabs>
|
|
</up-sticky>
|
|
<block v-if="lists.length>0">
|
|
<view class="content" v-if='type==1||type==2'>
|
|
<view class="li" v-for="(item,index) in lists" :key="index">
|
|
<view class="li-top">
|
|
<text>{{item.title}}</text>
|
|
<text style="font-weight: bold;" :style="{color:item.type=='in'?'#50C758':'red'
|
|
}">{{ item.type=='in'?'+':'-' }}{{item.amount}}</text>
|
|
</view>
|
|
<view class="li-top" style="margin-bottom: 0;">
|
|
<text style="font-size: 24rpx;color: grey;">{{item.create_time}}</text>
|
|
<text style="font-size: 24rpx;color: grey;">余额 {{item.balance}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="content" v-if='type==3||type==5'>
|
|
<view class="li" v-for="(item,index) in lists" :key="index">
|
|
<view class="li-top">
|
|
<text>{{item.title}}</text>
|
|
<text style="font-weight: bold;" :style="{color:item.financial_pm?'#50C758':'red'
|
|
}">{{ item.financial_pm?'+':'-' }}{{item.number}}</text>
|
|
</view>
|
|
<view class="li-top" style="margin-bottom: 0;">
|
|
<text style="font-size: 24rpx;color: grey;">{{item.create_time}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="content" v-if='type==4'>
|
|
<view class="li" v-for="(item,index) in lists" :key="index">
|
|
<view class="li-top">
|
|
<text>{{item.title}}</text>
|
|
<text style="font-weight: bold;" :style="{color:!item.status?'#50C758':'red'
|
|
}">{{ !item.status?'+':'-' }}{{item.number}}</text>
|
|
</view>
|
|
<view class="li-top" style="margin-bottom: 0;">
|
|
<text style="font-size: 24rpx;color: grey;">{{item.create_time}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
<up-empty v-else mode="history" style="margin-top: 20vh;" text='没有更多内容了'>
|
|
</up-empty>
|
|
|
|
<view style="height: 50rpx;">
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref,
|
|
reactive
|
|
} from "vue"
|
|
import {
|
|
onLoad,
|
|
onPullDownRefresh
|
|
} from "@dcloudio/uni-app"
|
|
import {
|
|
getFundList,
|
|
getUserSingList
|
|
} from "@/api/address.js"
|
|
|
|
const navLists = ['', '采购款明细', '余额明细', '礼品券明细', '返还金明细', '冻结券明细']
|
|
const tabsLst = reactive([{
|
|
name: '全部'
|
|
},
|
|
{
|
|
name: '收入'
|
|
},
|
|
{
|
|
name: '支出'
|
|
},
|
|
]);
|
|
|
|
const mark = ref(0)
|
|
const tabsChange = (e) => {
|
|
mark.value = e.index
|
|
getLists()
|
|
}
|
|
|
|
const lists = ref([])
|
|
let type = ref('')
|
|
const getLists = async (isPullDown = false) => {
|
|
if (type.value == 3 || type.value == 5) {
|
|
let res = await getUserSingList({
|
|
type: type.value == 3 ? 1 : 0,
|
|
page_no: 1,
|
|
page_size: 999,
|
|
mark: mark.value || ''
|
|
})
|
|
lists.value = res.data.lists
|
|
console.log(lists.value)
|
|
|
|
} else {
|
|
|
|
let res = await getFundList({
|
|
type: type.value,
|
|
mark: mark.value || ''
|
|
})
|
|
lists.value = res.data.lists
|
|
}
|
|
|
|
if (isPullDown) uni.stopPullDownRefresh()
|
|
|
|
}
|
|
|
|
onLoad((opt) => {
|
|
type.value = opt.type
|
|
uni.setNavigationBarTitle({
|
|
title: navLists[type.value]
|
|
})
|
|
getLists()
|
|
})
|
|
|
|
onPullDownRefresh(() => {
|
|
getLists(true)
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.content {
|
|
background-color: white;
|
|
width: 690rpx;
|
|
padding: 20rpx;
|
|
margin: 0 auto;
|
|
box-sizing: border-box;
|
|
margin: 0 auto;
|
|
margin-top: 30rpx;
|
|
border-radius: 20rpx;
|
|
margin-bottom: 100rpx;
|
|
|
|
.li {
|
|
margin-top: 20rpx;
|
|
border-bottom: 1px solid #EDF2FA;
|
|
padding-bottom: 20rpx;
|
|
|
|
.li-top {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
</style> |