源文件

2024-05-23 14:39:33 +08:00
commit a1128dd791
2997 changed files with 500069 additions and 0 deletions
--- a/jeepay-ui-uapp-face/pages/handover/handoverList.vue
+++ b/jeepay-ui-uapp-face/pages/handover/handoverList.vue
@@ -0,0 +1,155 @@
+<template>
+  <view class="page-wrapper">
+    <view class="custom-content">
+      <view class="start-time" :style="{ color: vdata.startTime ? '#000' : '#666' }" @tap="refStartTime.show">{{
+        vdata.startTime || '请选择开始时间'
+      }}</view>
+      <view class="endTime-time" :style="{ color: vdata.endTime ? '#000' : '#666' }" @tap="refEndTime.show">{{
+        vdata.endTime || '请选择结束时间'
+      }}</view>
+    </view>
+    <block v-for="v in vdata.list" :key="v.id">
+      <view class="list-main" @tap="toDetails(v.id)">
+        <view class="left">
+          <view class="title">{{ v.realname }}</view>
+          <view class="time">{{ v.workStartTime }}</view>
+        </view>
+        <view class="line">—</view>
+        <view class="right">
+          <view class="amount title">￥{{ (v.successAmount / 100).toFixed(2) }}</view>
+          <view class="time">{{ v.workEndTime || '未下班' }}</view>
+        </view>
+      </view>
+    </block>
+    <view class="list-null" v-if="!vdata.hasNext">暂无更多数据</view>
+  </view>
+  <xp-picker mode="ymdhi" ref="refStartTime" @confirm="timeConfirm($event, 'startTime')">
+    <view></view>
+  </xp-picker>
+  <xp-picker mode="ymdhi" ref="refEndTime" @confirm="timeConfirm($event, 'endTime')">
+    <view></view>
+  </xp-picker>
+</template>
+
+<script setup>
+import { reactive, ref } from 'vue'
+import { onLoad, onReachBottom, onUnload } from '@dcloudio/uni-app'
+import { $handoverList } from '@/http/apiManager'
+import dayjs from 'dayjs'
+const refStartTime = ref(null)
+const refEndTime = ref(null)
+const vdata = reactive({
+  list: [],
+  hasNext: true,
+})
+const params = {
+  pageSize: 10,
+  pageNumber: 1,
+  queryDateRange: '',
+}
+const getList = () => {
+  if (!vdata.hasNext) return
+  $handoverList(params).then(({ bizData }) => {
+    vdata.list.push(...bizData.records)
+    vdata.hasNext = bizData.hasNext
+  })
+}
+getList()
+onReachBottom(() => {
+  params.pageNumber += 1
+  getList()
+})
+/**
+ * @param {e} Object 组件原生 回调 时间戳 日期
+ * @param {key} String vdata 对象的 key 值 赋值使用
+ * */
+const timeConfirm = (e, key) => {
+  vdata[key] = dayjs(e.timestamp).format('YYYY-MM-DD hh:mm')
+
+  if (key == 'endTime' || (vdata.endTime != undefined && dayjs(vdata.startTime).isAfter(vdata.endTime))) {
+    console.log('进入请求')
+    params.queryDateRange = `customDateTime_${vdata.startTime + ':00'}_${vdata.endTime + ':00'}`
+    vdata.list = []
+    params.pageNumber = 1
+    vdata.hasNext = true
+    getList()
+  }
+}
+/**
+ * @param {id} String 用于 和后端交互请求详情
+ * */
+const toDetails = (id) => {
+  uni.navigateTo({
+    url: '/pages/handover/handover?id=' + id,
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.list-main {
+  display: flex;
+  justify-content: space-between;
+  padding: 15rpx;
+  margin: 30rpx;
+  background-color: #fff;
+  border-radius: 14rpx;
+
+  .title {
+    font-size: 22rpx;
+    font-weight: 600;
+    margin-bottom: 10rpx;
+  }
+
+  .amount {
+    color: $v-primary;
+  }
+
+  .line {
+    align-self: flex-end;
+  }
+
+  .right {
+    text-align: right;
+  }
+
+  .time,
+  .line {
+    color: #ccc;
+  }
+}
+
+.custom-content {
+  display: flex;
+  justify-content: space-around;
+  margin-top: 30rpx;
+
+  view {
+    flex: 0 0 30%;
+    padding: 10rpx 0;
+    background-color: #ded7d7;
+    text-align: center;
+    border-radius: 10rpx;
+    font-size: 16rpx;
+  }
+}
+
+.list-null {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  color: #666;
+  margin: 30rpx 0;
+  padding: 0 30rpx;
+  font-size: 24rpx;
+  font-weight: 600;
+
+  &::after,
+  &::before {
+    content: '';
+    display: block;
+    width: 35%;
+    height: 2rpx;
+    background-color: #ededed;
+  }
+}
+</style>