|
|
@@ -6,15 +6,17 @@
|
|
|
<template #footer>
|
|
|
<Field name="operateType" label="资金类型" is-link input-align="right">
|
|
|
<template #input>
|
|
|
- <app-select v-model="operatetype" placeholder="请选择资金类型" :options="operateTypeSearchList" :optionProps="{ label: 'label', value: 'value' }" @confirm="onSelectConfirm"/>
|
|
|
+ <app-select v-model="operatetype" placeholder="请选择资金类型" :options="operateTypeSearchList"
|
|
|
+ :optionProps="{ label: 'label', value: 'value' }" @confirm="onSelectConfirm" />
|
|
|
</template>
|
|
|
</Field>
|
|
|
- <Cell title="查询日期" :value="dateRange.join('-')" @click="showCalendar = true" is-link />
|
|
|
+ <Cell title="查询日期" :value="`${hisAmountLogReq.startDate}-${hisAmountLogReq.endDate}`"
|
|
|
+ @click="showCalendar = true" is-link />
|
|
|
</template>
|
|
|
</app-navbar>
|
|
|
</template>
|
|
|
- <app-pull-refresh ref="pullRefreshRef" v-model:loading="loading" v-model:error="error" v-model:pageIndex="pageIndex"
|
|
|
- :page-count="pageCount" @refresh="onRefresh">
|
|
|
+ <app-pull-refresh ref="pullRefreshRef" v-model:loading="loading" v-model:error="error"
|
|
|
+ v-model:pageIndex="pageIndex" :page-count="pageCount" @refresh="onRefresh">
|
|
|
<app-list class="bank-hisstatement__table" :columns="columns" :data-list="dataList">
|
|
|
<template #createtime="{ value }">
|
|
|
<span>{{ formatDate(value, 'YYYY-MM-DD') }}</span>
|
|
|
@@ -22,13 +24,14 @@
|
|
|
</template>
|
|
|
</app-list>
|
|
|
</app-pull-refresh>
|
|
|
- <Calendar v-model:show="showCalendar" type="range" :max-date="new Date()" :min-date="moment().subtract(1, 'years').toDate()" @confirm="onConfirm" />
|
|
|
+ <Calendar v-model:show="showCalendar" type="range" :max-range="7" :default-date="dateValue"
|
|
|
+ :max-date="new Date()" :min-date="moment().subtract(1, 'years').toDate()" @confirm="onConfirm" />
|
|
|
</app-view>
|
|
|
</app-modal>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-import { shallowRef, ref } from 'vue'
|
|
|
+import { shallowRef, ref, computed } from 'vue'
|
|
|
import { formatDate } from '@/filters'
|
|
|
import { useRequest } from '@/hooks/request'
|
|
|
import { queryHisAmountLog } from '@/services/api/bank'
|
|
|
@@ -44,16 +47,27 @@ const showModal = shallowRef(true)
|
|
|
const dataList = shallowRef<Model.HisAmountLogRsp[]>([])
|
|
|
const error = shallowRef(false)
|
|
|
const showCalendar = shallowRef(false) // 是否显示日期选择器
|
|
|
-const dateRange = ref<string[]>([]) // 日期范围
|
|
|
const pullRefreshRef = shallowRef()
|
|
|
/// 资金类型
|
|
|
const operatetype = shallowRef(0)
|
|
|
|
|
|
+const endDate = moment(new Date())
|
|
|
+const startDate = endDate.clone().subtract(6, 'days')
|
|
|
+const dateValue = ref([startDate.toDate(), endDate.toDate()])
|
|
|
+
|
|
|
+const hisAmountLogReq = computed(() => {
|
|
|
+ const [begindate, enddate] = dateValue.value
|
|
|
+ return {
|
|
|
+ startDate: formatDate(begindate.toISOString(), 'YYYY-MM-DD'),
|
|
|
+ endDate: formatDate(enddate.toISOString(), 'YYYY-MM-DD'),
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
/// 查询数据
|
|
|
const operateTypeSearchList = [{
|
|
|
- label: '全部',
|
|
|
- value: 0
|
|
|
- }].concat(getOperateTypeSearchList())
|
|
|
+ label: '全部',
|
|
|
+ value: 0
|
|
|
+}].concat(getOperateTypeSearchList())
|
|
|
|
|
|
const columns: Model.TableColumn[] = [
|
|
|
{ field: 'createtime', label: '时间' },
|
|
|
@@ -71,7 +85,7 @@ const { loading, pageIndex, pageCount, run } = useRequest(queryHisAmountLog, {
|
|
|
if (pageIndex.value === 1) {
|
|
|
dataList.value = res.data
|
|
|
return
|
|
|
- }
|
|
|
+ }
|
|
|
dataList.value.push(...res.data)
|
|
|
},
|
|
|
onError: () => {
|
|
|
@@ -82,7 +96,7 @@ const { loading, pageIndex, pageCount, run } = useRequest(queryHisAmountLog, {
|
|
|
// 选择日期
|
|
|
const onConfirm = ([start, end]: Date[]) => {
|
|
|
showCalendar.value = false
|
|
|
- dateRange.value = [formatDate(start.toISOString(), 'YYYY-MM-DD'), formatDate(end.toISOString(), 'YYYY-MM-DD')]
|
|
|
+ dateValue.value = [start, end]
|
|
|
pageIndex.value = 1
|
|
|
pullRefreshRef.value?.refresh()
|
|
|
}
|
|
|
@@ -96,11 +110,7 @@ const onSelectConfirm = (value: number) => {
|
|
|
}
|
|
|
|
|
|
const onRefresh = () => {
|
|
|
- const [begindate, enddate] = dateRange.value
|
|
|
- run({
|
|
|
- startDate: begindate,
|
|
|
- endDate: enddate,
|
|
|
- })
|
|
|
+ run(hisAmountLogReq.value)
|
|
|
}
|
|
|
|
|
|
// 关闭弹窗
|
