【feat】【v3】

1.增加转账记录页面
2.完善账户页面

package.json

@@ -31,7 +31,7 @@
         "title": "微信小程序 sit-测试环境",
         "env": {
           "UNI_PLATFORM": "mp-weixin",
-          "BASE_API_URL": "http://192.168.123.242:8080"
+          "BASE_API_URL": "http://192.168.1.44:8080"
         }
       },
       "wp-uat": {

src/apis/accountApi.js

@@ -73,4 +73,15 @@ export function transfer(data) {
   loading: true,
   loadingText: "正在转账，请稍后..."
   });
+}
+
+/**
+ * 查询转账记录
+ */
+export function queryTransferHistory(data) {
+  return request({
+    url: "/account/queryTransferHistory",
+    method: "get",
+    data
+  });
 }

src/common/router.js

@@ -57,6 +57,11 @@ const router = {
 	 * 奖励编辑页
 	 */
 	REWARD_EDIT_PAGE: '/pages/reward/rewardEdit',
+
+	/**
+	 * 转账记录
+	 */
+	ACCOUNT_TRANSFER_HISTORY_PAGE: '/pages/account/accountTransferHistory'
 };
 
 export default router;

src/pages.json

@@ -104,9 +104,10 @@
 			}
 		},
 		{
-			"path": "pages/test",
+			"path": "pages/account/accountTransferHistory",
 			"style": {
-				"navigationBarTitleText": "test"
+				"navigationBarTitleText": "转账记录",
+				"enablePullDownRefresh": true
 			}
 		}
 	],

src/pages/account/accountList.vue

@@ -11,7 +11,7 @@
   </view>
 
   <view class="account-container">
-    <view class="account" @click="goAccountEditPage(basicAccount.id)" v-if="basicAccount">
+    <view class="account" v-if="basicAccount">
       <span class="account-name">{{ basicAccount.accountName }}</span>
       <span class="account-points">{{ basicAccount.points }}</span>
     </view>

src/pages/account/accountTransferHistory.vue

@@ -0,0 +1,183 @@
+<template>
+  <!-- 月份选择器 -->
+  <view class="date-picker">
+    <view class="date-picker-item arrow left-arrow">
+      <uni-icons type="left" size="30" @click="plusMonth(-1)"></uni-icons>
+    </view>
+    <view class="date-picker-item">
+      <picker mode="date" fields="month" :value="currentMonth" @change="monthChange">
+        <view class="picker-view">{{ currentMonth }}</view>
+      </picker>
+    </view>
+    <view class="date-picker-item arrow right-arrow">
+      <uni-icons type="right" size="30" @click="plusMonth(1)"></uni-icons>
+    </view>
+  </view>
+
+  <!-- 数据列表 -->
+  <uni-list :border="true">
+    <uni-list-item v-for="item in listData" :key="item.id">
+      <template v-slot:body>
+        <view class="item-box">
+          <span class="item-label">转账类型</span>
+          <span class="item-label">{{ item.transferCategory == 'TRANSFER' ? '转账' : '结算' }}</span>
+        </view>
+        <view class="item-box" v-if="item.transferCategory == 'TRANSFER'">
+          <span class="item-label">转出账户</span>
+          <span class="item-label">{{ item.senderAccountName }}</span>
+        </view>
+        <view class="item-box" v-if="item.transferCategory == 'TRANSFER'">
+          <span class="item-label">转出账户转入前积分</span>
+          <span class="item-label">{{ item.saPointsBeforeTransfer }}</span>
+        </view>
+        <view class="item-box" v-if="item.transferCategory == 'TRANSFER'">
+          <span class="item-label">转出账户转入后积分</span>
+          <span class="item-label">{{ item.saPointsAfterTransfer }}</span>
+        </view>
+        <view class="item-box">
+          <span class="item-label">转出账户</span>
+          <span class="item-label">{{ item.recipientAccountName }}</span>
+        </view>
+        <view class="item-box">
+          <span class="item-label">转入账户转入前积分</span>
+          <span class="item-label">{{ item.raPointsBeforeTransfer }}</span>
+        </view>
+        <view class="item-box">
+          <span class="item-label">转入账户转入后积分</span>
+          <span class="item-label">{{ item.raPointsAfterTransfer }}</span>
+        </view>
+        <view class="item-box">
+          <span class="item-label">转账积分</span>
+          <span class="item-label">{{ item.transferPoints }}</span>
+        </view>
+        <view class="item-box">
+          <span class="item-label">转账时间</span>
+          <span class="item-value">{{ item.transferTime }}</span>
+        </view>
+      </template>
+    </uni-list-item>
+  </uni-list>
+  <uni-load-more status="no-more" v-if="!listData || listData.length == 0" />
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { accountApi } from '@/apis/apis';
+import { onLoad, onShow, onPullDownRefresh } from '@dcloudio/uni-app';
+
+// 属性
+/**
+ * 当前选中的月
+ */
+const currentMonth = ref('2025-04');
+
+/**
+ * 数据
+ */
+const listData = ref([]);
+
+// 方法
+/**
+ * 月份选择器
+ */
+const monthChange = (e) => {
+  currentMonth.value = e.detail.value
+}
+
+/**
+ * 月份加减
+ */
+const plusMonth = (num) => {
+  // 转换成date对象
+  let tempDate = new Date(currentMonth.value);
+  // 月份加减
+  tempDate.setMonth(tempDate.getMonth() + num);
+
+  // daet对象转换成字符串
+  let tempYear = tempDate.getFullYear();
+  let tempMonth = (tempDate.getMonth() + 1).toString().padStart(2, "0"); // 月份从0开始，+1后格式化为两位数
+  currentMonth.value = `${tempYear}-${tempMonth}`;
+
+  loadData();
+}
+
+/**
+ * 获取转账数据
+ */
+const loadData = async () => {
+  let res = await accountApi.queryTransferHistory({ 'transferMonth': currentMonth.value });
+  listData.value = res ? res : [];
+}
+
+// 生命周期
+onLoad(() => {
+  // daet对象转换成字符串
+  let tempDate = new Date();
+  let tempYear = tempDate.getFullYear();
+  let tempMonth = (tempDate.getMonth() + 1).toString().padStart(2, "0"); // 月份从0开始，+1后格式化为两位数
+  currentMonth.value = `${tempYear}-${tempMonth}`;
+});
+
+onShow(() => {
+  loadData();
+})
+
+onPullDownRefresh(() => {
+  loadData();
+});
+</script>
+
+<style lang="scss" scoped>
+.date-picker {
+  display: flex;
+
+  .date-picker-item {
+    flex: 1;
+
+    picker {
+      width: 100%;
+      height: 100%;
+      display: flex;
+
+      display: flex;
+      /* 水平居中 */
+      justify-content: center;
+      /* 垂直居中 */
+      align-items: center;
+    }
+  }
+
+  .arrow {
+    /* 启用 Flexbox 布局 */
+    display: flex;
+    /* 垂直居中 */
+    align-items: center;
+  }
+
+  .left-arrow {
+    /* 将子元素对齐到右侧 */
+    justify-content: flex-end;
+  }
+
+  .right-arrow {
+    /* 将子元素对齐到右侧 */
+    justify-content: flex-start;
+  }
+}
+
+::v-deep .uni-list-item__container .uni-list-item__header {
+  width: 0%;
+}
+
+::v-deep .uni-list-item__container>view {
+  width: 100%;
+}
+
+.item-box {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  width: 100%;
+}
+</style>

src/pages/task/taskDetail.vue

@@ -1,9 +1,5 @@
 <template>
 
-  <view class="charts-box">
-    <qiun-data-charts type="line" :opts="chartOpts" :chartData="chartData" :canvas2d="true" />
-  </view>
-
   <view class="tab-header">
     <uni-segmented-control :current="currentTabIndex" :values="tabs" style-type="button" active-color="#BDE0FF"
       @clickItem="switchTab" />
@@ -26,54 +22,6 @@
         <uni-icons type="right" size="30" @click="plusMonth(1)"></uni-icons>
       </view>
     </view>
-
-    <!-- 统计数据 -->
-    <view class="stat-board">
-      <view class="stat-board-title">打卡统计</view>
-      <view class="stat-board-content">
-        <view class="stat-item">
-          <view class="stat-item-label">本月需打卡</view>
-          <view class="stat-item-value">{{ statMonth.punchInTotalCount }}次</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">本月已打卡</view>
-          <view class="stat-item-value">{{ statMonth.punchInCount }}次</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">完成打卡</view>
-          <view class="stat-item-value">{{ statMonth.punchInDoneCount }}次</view>
-        </view>
-      </view>
-      <view class="stat-board-content stat-mt16">
-        <view class="stat-item">
-          <view class="stat-item-label">打卡率</view>
-          <view class="stat-item-value">{{ statMonth.punchInRate }}%</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">完成率</view>
-          <view class="stat-item-value">{{ statMonth.punchInDoneRate }}%</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">本月获取积分数</view>
-          <view class="stat-item-value">{{ statMonth.points }}</view>
-        </view>
-      </view>
-    </view>
-
-    <uni-section title="打卡日志" padding="16px" type="line">
-      <uni-list>
-        <uni-list-item v-for="taskHistory in statMonth.piTaskHistoryStatVOS" :key="taskHistory.punchInDate">
-          <template v-slot:body>
-            {{ taskHistory.punchInDate }}
-            <span v-if="taskHistory.punchInResult == PUNCH_IN_RESULT.DONE"> 完成打卡</span>
-            <span v-else> 未完成打卡</span>
-            <span v-if="taskHistory.punchInMethod == PUNCH_IN_METHOD.COUNT">，打卡{{ taskHistory.countTrack }}次</span>
-            <span v-if="taskHistory.punchInMethod == PUNCH_IN_METHOD.TIMING">，打卡时长{{ taskHistory.timeTrack }}</span>
-          </template>
-        </uni-list-item>
-      </uni-list>
-      <uni-load-more status="no-more" v-if="statMonth.piTaskHistoryStatVOS.length == 0" />
-    </uni-section>
   </view>
 
   <!-- 年 -->
@@ -92,61 +40,66 @@
         <uni-icons type="right" size="30" @click="plusYear(1)"></uni-icons>
       </view>
     </view>
+  </view>
 
-    <!-- 统计数据 -->
-    <view class="stat-board">
-      <view class="stat-board-title">打卡统计</view>
-      <view class="stat-board-content">
-        <view class="stat-item">
-          <view class="stat-item-label">全年需打卡</view>
-          <view class="stat-item-value">{{ statYear.punchInTotalCount }}次</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">已打卡</view>
-          <view class="stat-item-value">{{ statYear.punchInCount }}次</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">完成打卡</view>
-          <view class="stat-item-value">{{ statYear.punchInDoneCount }}次</view>
-        </view>
+  <!-- 统计数据 -->
+  <view class="stat-board">
+    <view class="stat-board-title">打卡统计</view>
+    <view class="stat-board-content">
+      <view class="stat-item">
+        <view class="stat-item-label">{{ currentTabIndex === 0 ? '本月' : '全年' }}需打卡</view>
+        <view class="stat-item-value">{{ statData.punchInTotalCount }}次</view>
+      </view>
+      <view class="stat-item">
+        <view class="stat-item-label">{{ currentTabIndex === 0 ? '本月' : '全年' }}已打卡</view>
+        <view class="stat-item-value">{{ statData.punchInCount }}次</view>
       </view>
-      <view class="stat-board-content stat-mt16">
-        <view class="stat-item">
-          <view class="stat-item-label">打卡率</view>
-          <view class="stat-item-value">{{ statYear.punchInRate }}%</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">完成率</view>
-          <view class="stat-item-value">{{ statYear.punchInDoneRate }}%</view>
-        </view>
-        <view class="stat-item">
-          <view class="stat-item-label">全年获取积分数</view>
-          <view class="stat-item-value">{{ statYear.points }}</view>
-        </view>
+      <view class="stat-item">
+        <view class="stat-item-label">完成打卡</view>
+        <view class="stat-item-value">{{ statData.punchInDoneCount }}次</view>
       </view>
     </view>
+    <view class="stat-board-content stat-mt16">
+      <view class="stat-item">
+        <view class="stat-item-label">打卡率</view>
+        <view class="stat-item-value">{{ statData.punchInRate }}%</view>
+      </view>
+      <view class="stat-item">
+        <view class="stat-item-label">完成率</view>
+        <view class="stat-item-value">{{ statData.punchInDoneRate }}%</view>
+      </view>
+      <view class="stat-item">
+        <view class="stat-item-label">{{ currentTabIndex === 0 ? '本月' : '全年' }}获取积分数</view>
+        <view class="stat-item-value">{{ statData.points }}</view>
+      </view>
+    </view>
+  </view>
 
-    <uni-section title="打卡日志" padding="16px" type="line">
-      <uni-list>
-        <uni-list-item v-for="taskHistory in statYear.piTaskHistoryStatVOS" :key="taskHistory.punchInDate">
-          <template v-slot:body>
-            {{ taskHistory.punchInDate }}
-            <span v-if="taskHistory.punchInResult == PUNCH_IN_RESULT.DONE"> 完成打卡</span>
-            <span v-else> 未完成打卡</span>
-            <span v-if="taskHistory.punchInMethod == PUNCH_IN_METHOD.COUNT">，打卡{{ taskHistory.countTrack }}次</span>
-            <span v-if="taskHistory.punchInMethod == PUNCH_IN_METHOD.TIMING">，打卡时长{{ taskHistory.timeTrack }}</span>
-          </template>
-        </uni-list-item>
-      </uni-list>
-      <uni-load-more status="no-more" v-if="statYear.piTaskHistoryStatVOS.length == 0" />
-    </uni-section>
+  <view class="charts-box">
+    <qiun-data-charts type="line" :opts="chartOpts" :chartData="statData.lineVO" :canvas2d="true"
+      :loadingType="chatLoadingType" canvasId="mbnxeAGxItOvNjxrYfKUKyifYeNyjLGj" />
   </view>
 
+  <!-- <uni-section title="打卡日志" padding="16px" type="line">
+    <uni-list>
+      <uni-list-item v-for="taskHistory in statData.piTaskHistoryStatVOS" :key="taskHistory.punchInDate">
+        <template v-slot:body>
+          {{ taskHistory.punchInDate }}
+          <span v-if="taskHistory.punchInResult == PUNCH_IN_RESULT.DONE"> 完成打卡</span>
+          <span v-else> 未完成打卡</span>
+          <span v-if="taskHistory.punchInMethod == PUNCH_IN_METHOD.COUNT">，打卡{{ taskHistory.countTrack }}次</span>
+          <span v-if="taskHistory.punchInMethod == PUNCH_IN_METHOD.TIMING">，打卡时长{{ taskHistory.timeTrack }}</span>
+        </template>
+</uni-list-item>
+</uni-list>
+<uni-load-more status="no-more" v-if="statData.piTaskHistoryStatVOS.length == 0" />
+</uni-section> -->
+
 </template>
 
 <script setup>
 import { ref } from 'vue';
-import { onLoad, onPullDownRefresh, onShow, onReady } from '@dcloudio/uni-app';
+import { onLoad, onPullDownRefresh } from '@dcloudio/uni-app';
 import { punchInApi } from '@/apis/apis';
 import { PUNCH_IN_RESULT, PUNCH_IN_METHOD, STAT_PERIOD } from '@/common/enums';
 
@@ -182,35 +135,28 @@ const currentMonth = ref('2025-04');
 const currentYear = ref('2025');
 
 /**
- * 打卡统计数据-月
+ * 默认统计数据（空）
  */
-const statMonth = ref({
+const defaultStatData = {
   punchInTotalCount: 0,
   punchInCount: 0,
   punchInDoneCount: 0,
   punchInRate: 0,
   punchInDoneRate: 0,
   points: 0,
-  piTaskHistoryStatVOS: []
-});
+  piTaskHistoryStatVOS: [],
+  lineVO: {}
+};
 
 /**
- * 打卡统计数据-年
+ * 打卡统计数据
  */
-const statYear = ref({
-  punchInTotalCount: 0,
-  punchInCount: 0,
-  punchInDoneCount: 0,
-  punchInRate: 0,
-  punchInDoneRate: 0,
-  points: 0,
-  piTaskHistoryStatVOS: []
-});
+const statData = ref(defaultStatData);
 
 /**
- * 图表数据
+ * 图表加载动画
  */
-const chartData = ref({});
+const chatLoadingType = ref(0);
 
 /**
  * 图表配置
@@ -218,10 +164,12 @@ const chartData = ref({});
 const chartOpts = ref({
   color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", "#ea7ccc"],
   padding: [15, 10, 0, 15],
-  enableScroll: false,
+  enableScroll: true,
   legend: {},
   xAxis: {
-    disableGrid: true
+    disableGrid: true,
+    scrollShow: true,
+    itemCount: 1
   },
   yAxis: {
     gridType: "dash",
@@ -243,6 +191,7 @@ const chartOpts = ref({
 const switchTab = (e) => {
   if (currentTabIndex.value !== e.currentIndex) {
     currentTabIndex.value = e.currentIndex
+    currentStatPeriod.value = e.currentIndex == 0 ? STAT_PERIOD.MONTH : STAT_PERIOD.YEAR;
     loadData();
   }
 }
@@ -274,6 +223,8 @@ const plusMonth = (num) => {
   let tempYear = tempDate.getFullYear();
   let tempMonth = (tempDate.getMonth() + 1).toString().padStart(2, "0"); // 月份从0开始，+1后格式化为两位数
   currentMonth.value = `${tempYear}-${tempMonth}`;
+
+  loadData();
 }
 
 /**
@@ -292,30 +243,15 @@ const plusYear = (num) => {
  * 加载数据
  */
 const loadData = async () => {
+  // chatLoadingType.value = 2;
   let res = await punchInApi.queryStat({
     "statPeriod": currentStatPeriod.value,
     "statTime": currentStatPeriod.value == STAT_PERIOD.MONTH ? currentMonth.value : currentYear.value,
     "taskId": currentTaskId.value
   });
-
-  // 没有统计数据
-  if (!res) {
-    res = {
-      punchInTotalCount: 0,
-      punchInCount: 0,
-      punchInDoneCount: 0,
-      punchInRate: 0,
-      punchInDoneRate: 0,
-      points: 0,
-      piTaskHistoryStatVOS: []
-    };
-  }
-
-  if (currentStatPeriod.value == STAT_PERIOD.MONTH) {
-    statMonth.value = res;
-  } else {
-    statYear.value = res;
-  }
+  // chatLoadingType.value = 0;
+  // 统计数据为空，则使用默认数据
+  statData.value = res ? res : defaultStatData;
 }
 
 
@@ -333,34 +269,7 @@ onLoad(async (e) => {
   }
 });
 
-function getServerData() {
-  //模拟从服务器获取数据时的延时
-  setTimeout(() => {
-    //模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
-    let res = {
-      categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
-      series: [
-        {
-          name: "目标值",
-          data: [35, 36, 31, 33, 13, 34]
-        },
-        {
-          name: "完成量",
-          data: [18, 27, 21, 24, 6, 28]
-        }
-      ]
-    };
-    chartData.value = JSON.parse(JSON.stringify(res));
-  }, 500);
-}
-
-onReady(() => {
-
-
-});
-
 onPullDownRefresh(() => {
-  getServerData();
   loadData();
   uni.stopPullDownRefresh();
 });
@@ -409,14 +318,10 @@ onPullDownRefresh(() => {
   }
 }
 
-
 .charts-box {
-  width: 50%;
-  min-width: 375px !important;
+  padding: 16rpx 16rpx;
+  width: 100%;
   height: 400rpx;
-  margin-left: auto;
-  margin-right: auto;
-  border: 1px solid blue;
 }
 
 .stat-board {

src/pages/userCenter.vue

@@ -71,7 +71,8 @@
           :extraIcon="{ color: '#000000', size: 22, type: 'info' }" link="navigateTo" :to="router.ABOUT_US_PAGE">
         </uni-list-item>
         <uni-list-item title="账户转账记录" :showArrow="true" :showExtraIcon="true" clickable
-          :extraIcon="{ color: '#000000', size: 22, type: 'minus' }" link="navigateTo" :to="router.DISCLAIMER_PAGE">
+          :extraIcon="{ color: '#000000', size: 22, type: 'minus' }" link="navigateTo"
+          :to="router.ACCOUNT_TRANSFER_HISTORY_PAGE">
         </uni-list-item>
       </uni-list>
     </view>