Escort/src/pages/other/income-details.vue

114 lines
2.7 KiB
Vue
Executable File

<template>
<z-paging
:ref="paging"
v-model="recordList"
@query="queryList"
:min-delay="300"
use-page-scroll
>
<template #top>
<view
class="flex items-center justify-between px-50rpx pt-20rpx pb-40rpx"
>
<view
@click="handleAll"
class="flex justify-center items-center w-150rpx h-64rpx rounded-36rpx"
:class="!isSelect ? 'bg-primary text-white' : 'bg-#f2f2f2 text-#000'"
>
全部
</view>
<view
@click="datetimeShow = true"
class="flex justify-center items-center w-250rpx h-64rpx rounded-36rpx"
:class="isSelect ? 'bg-primary text-white' : 'bg-#f2f2f2 text-#000'"
>
{{ $u.timeFormat(datetime, 'yyyy-mm') }}
</view>
</view>
</template>
<view class="px-34rpx relative">
<view
class="flex justify-between pb-20rpx border-b-#E5E5E5 border-b-1px mb-20rpx"
v-for="item in recordList"
:key="item.id"
>
<view class="flex flex-col text-28rpx">
<text class="">提现金额</text>
<text class="text-24rpx text-#999">{{
$u.timeFormat(item.createTime, 'yyyy年mm月dd')
}}</text>
</view>
<view class="text-#FF3939">-{{ item.price || 0 }}</view>
<!-- <u-text
text="+100"
mode="price"
margin="0 5px 0 0"
type="tips"
color="#FF3939"
></u-text> -->
</view>
</view>
<u-datetime-picker
:show="datetimeShow"
v-model="datetime"
@confirm="handleDatePickerConfirm"
@cancel="datetimeShow = false"
:minDate="new Date('2023-01-01').getTime()"
:maxDate="new Date('2030-12-31').getTime()"
mode="year-month"
confirmColor="#FF8CA6"
@close="datetimeShow = false"
closeOnClickOverlay
></u-datetime-picker>
</z-paging>
</template>
<script setup>
const instance = getCurrentInstance()
const { $u, $api } = instance.proxy
const datetimeShow = ref(false)
const datetime = ref(new Date().getTime())
const recordList = ref([])
const isSelect = ref(false)
const paging = ref(null)
const handleDatePickerConfirm = ({ value }) => {
datetime.value = $u.timeFormat(value, 'yyyy-mm')
datetimeShow.value = false
isSelect.value = true
getRecordList()
}
const handleAll = () => {
isSelect.value = false
getRecordList()
}
const getRecordList = async (pageNum = 1, pageSize = 10) => {
const res = await $api.cashSubmitRecord({
time: isSelect.value ? datetime.value : '',
pageNum,
pageSize
})
if (res.success) {
recordList.value = res.page?.list || []
paging.value?.complete(res.page?.list || [])
} else {
paging.value?.complete(false)
}
}
const queryList = (pageNo, pageSize) => {
getRecordList(pageNo, pageSize)
}
queryList(1, 100)
</script>
<style lang="scss" scoped>
page {
background-color: #fff;
}
</style>