|
@@ -32,66 +32,71 @@
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
<!-- 分账列表 -->
|
|
<!-- 分账列表 -->
|
|
|
- <view class="split-list" v-if="list.length > 0">
|
|
|
|
|
- <view class="split-item" v-for="(item, index) in list" :key="index">
|
|
|
|
|
- <view class="item-header">
|
|
|
|
|
- <text class="item-type" :style="getTypeStyle(item.type)">{{ fmtDictName('SplitRecord.type', item.type) }}</text>
|
|
|
|
|
- <text class="item-amount">{{ formatAmount(item.amount) }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="item-content">
|
|
|
|
|
- <view class="info-row">
|
|
|
|
|
- <text class="info-label">入账站点</text>
|
|
|
|
|
- <text class="info-value">{{ item.toStationName || '-' }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="info-row">
|
|
|
|
|
- <text class="info-label">出账站点</text>
|
|
|
|
|
- <text class="info-value">{{ item.fromStationName || '-' }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="info-row">
|
|
|
|
|
- <text class="info-label">分账交易流水号</text>
|
|
|
|
|
- <text class="info-value trade-no">{{ item.tradeNo || '-' }}</text>
|
|
|
|
|
|
|
+ <scroll-view
|
|
|
|
|
+ class="split-scroll"
|
|
|
|
|
+ scroll-y
|
|
|
|
|
+ @scrolltolower="loadMore"
|
|
|
|
|
+ :style="{ height: scrollHeight + 'px' }">
|
|
|
|
|
+ <view class="split-list" v-if="list.length > 0">
|
|
|
|
|
+ <view class="split-item" v-for="(item, index) in list" :key="index">
|
|
|
|
|
+ <view class="item-header">
|
|
|
|
|
+ <text class="item-type" :style="getTypeStyle(item.type)">{{ fmtDictName('SplitRecord.type', item.type) }}</text>
|
|
|
|
|
+ <text class="item-amount">{{ formatAmount(item.amount) }}</text>
|
|
|
</view>
|
|
</view>
|
|
|
- <view class="info-row">
|
|
|
|
|
- <text class="info-label">创建时间</text>
|
|
|
|
|
- <text class="info-value">{{ formatTime(item.createTime) }}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="info-row">
|
|
|
|
|
- <text class="info-label">更新时间</text>
|
|
|
|
|
- <text class="info-value">{{ formatTime(item.updateTime) }}</text>
|
|
|
|
|
|
|
+ <view class="item-content">
|
|
|
|
|
+ <view class="info-row">
|
|
|
|
|
+ <text class="info-label">入账站点</text>
|
|
|
|
|
+ <text class="info-value">{{ item.toStationName || '-' }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="info-row">
|
|
|
|
|
+ <text class="info-label">出账站点</text>
|
|
|
|
|
+ <text class="info-value">{{ item.fromStationName || '-' }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="info-row">
|
|
|
|
|
+ <text class="info-label">分账交易流水号</text>
|
|
|
|
|
+ <text class="info-value trade-no">{{ item.tradeNo || '-' }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="info-row">
|
|
|
|
|
+ <text class="info-label">创建时间</text>
|
|
|
|
|
+ <text class="info-value">{{ formatTime(item.createTime) }}</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="info-row">
|
|
|
|
|
+ <text class="info-label">更新时间</text>
|
|
|
|
|
+ <text class="info-value">{{ formatTime(item.updateTime) }}</text>
|
|
|
|
|
+ </view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
- </view>
|
|
|
|
|
|
|
|
|
|
- <!-- 加载更多 -->
|
|
|
|
|
- <view class="load-more" v-if="list.length > 0">
|
|
|
|
|
- <text class="load-more-text" v-if="loadMoreStatus === 'more'">上拉加载更多</text>
|
|
|
|
|
- <text class="load-more-text" v-else-if="loadMoreStatus === 'loading'">正在加载...</text>
|
|
|
|
|
- <text class="load-more-text" v-else>没有更多数据了</text>
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ <!-- 加载更多 -->
|
|
|
|
|
+ <view class="load-more" v-if="list.length > 0">
|
|
|
|
|
+ <text class="load-more-text" v-if="loadMoreStatus === 'more'">上拉加载更多</text>
|
|
|
|
|
+ <text class="load-more-text" v-else-if="loadMoreStatus === 'loading'">正在加载...</text>
|
|
|
|
|
+ <text class="load-more-text" v-else>没有更多数据了</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
|
|
|
- <!-- 空状态 -->
|
|
|
|
|
- <view class="empty-state" v-if="list.length === 0 && !loading">
|
|
|
|
|
- <view class="empty-icon-wrapper">
|
|
|
|
|
- <AppIcon name="trending-up" :size="80" color="#999999" />
|
|
|
|
|
|
|
+ <!-- 空状态 -->
|
|
|
|
|
+ <view class="empty-state" v-if="list.length === 0 && !loading">
|
|
|
|
|
+ <view class="empty-icon-wrapper">
|
|
|
|
|
+ <AppIcon name="trending-up" :size="80" color="#999999" />
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <text class="empty-text">暂无分账记录</text>
|
|
|
</view>
|
|
</view>
|
|
|
- <text class="empty-text">暂无分账记录</text>
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
|
|
|
- <!-- 加载状态 -->
|
|
|
|
|
- <view class="loading-state" v-if="loading && list.length === 0">
|
|
|
|
|
- <view class="loading-spinner"></view>
|
|
|
|
|
- <text class="loading-text">加载中...</text>
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ <!-- 加载状态 -->
|
|
|
|
|
+ <view class="loading-state" v-if="loading && list.length === 0">
|
|
|
|
|
+ <view class="loading-spinner"></view>
|
|
|
|
|
+ <text class="loading-text">加载中...</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </scroll-view>
|
|
|
</view>
|
|
</view>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
|
import { ref, onMounted } from 'vue'
|
|
import { ref, onMounted } from 'vue'
|
|
|
-import { onReachBottom } from '@dcloudio/uni-app'
|
|
|
|
|
import { getSplitRecords } from '../../api/finance.js'
|
|
import { getSplitRecords } from '../../api/finance.js'
|
|
|
import { getStationList } from '../../api/station.js'
|
|
import { getStationList } from '../../api/station.js'
|
|
|
-import { formatTime, formatAmount, fmtDictName, getDictColor } from '../../utils/index.js'
|
|
|
|
|
|
|
+import { formatTime, formatAmount, fmtDictName, getDictColor, showToast } from '../../utils/index.js'
|
|
|
import { loadDicts } from '../../utils/dict.js'
|
|
import { loadDicts } from '../../utils/dict.js'
|
|
|
|
|
|
|
|
const list = ref([])
|
|
const list = ref([])
|
|
@@ -106,6 +111,7 @@ const selectedStationId = ref('')
|
|
|
const selectedStationName = ref('')
|
|
const selectedStationName = ref('')
|
|
|
const activeType = ref('')
|
|
const activeType = ref('')
|
|
|
const activeTypeLabel = ref('')
|
|
const activeTypeLabel = ref('')
|
|
|
|
|
+const scrollHeight = ref(600)
|
|
|
|
|
|
|
|
const typeOptions = [
|
|
const typeOptions = [
|
|
|
{ label: '全部类型', value: '' }
|
|
{ label: '全部类型', value: '' }
|
|
@@ -208,15 +214,13 @@ const loadMore = () => {
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-onReachBottom(() => {
|
|
|
|
|
- loadMore()
|
|
|
|
|
-})
|
|
|
|
|
-
|
|
|
|
|
const handleSearch = () => {
|
|
const handleSearch = () => {
|
|
|
loadData()
|
|
loadData()
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
onMounted(async () => {
|
|
onMounted(async () => {
|
|
|
|
|
+ const sysInfo = uni.getSystemInfoSync()
|
|
|
|
|
+ scrollHeight.value = sysInfo.windowHeight - 44 // 减去导航栏高度
|
|
|
await loadDicts()
|
|
await loadDicts()
|
|
|
loadStations()
|
|
loadStations()
|
|
|
loadData()
|
|
loadData()
|
|
@@ -227,7 +231,12 @@ onMounted(async () => {
|
|
|
.split-container {
|
|
.split-container {
|
|
|
min-height: 100vh;
|
|
min-height: 100vh;
|
|
|
background-color: #F5F7FA;
|
|
background-color: #F5F7FA;
|
|
|
- padding-bottom: 60rpx;
|
|
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.split-scroll {
|
|
|
|
|
+ flex: 1;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.filter-section {
|
|
.filter-section {
|