结算

api/account.js

@@ -0,0 +1,45 @@
+import { http } from '@/common/service/service.js' 
+
+const apiService = {
+  // 获取当前账户余额
+	getAccountInfo() {
+		return http.get('/merchant/account/index');
+	},
+
+  // 获取财务订单统计
+	getFinanceStats(params) {
+		return http.get('/merchant/account/orderStats',{params});
+	},
+
+  // 获取账户明细
+	getAccountList(params) {
+		return http.get('/merchant/account/flowList',{params});
+	},
+
+  // 初始化提现数据
+	initWithdrawalData() {
+		return http.get('/merchant/withdraw/initApply');
+	},
+
+  // 申请提现
+	applyWithdrawal(params) {
+		return http.post('/merchant/withdraw/apply',params);
+	},
+
+  // 提现详情
+	getWithdrawalDetails(id) {
+		return http.get(`/merchant/withdraw/detail?withdrawNo=${id}`);
+	},
+
+  // 结算详情
+	settlementDetail(id) {
+		return http.get(`/merchant/account/settlementDetail?settlementId=${id}`);
+	},
+
+  // 结算订单详情
+	orderClearDetail(id) {
+		return http.get(`/merchant/account/orderClearDetail?orderId=${id}`);
+	},
+};
+
+export default apiService;

common/router/modules/routes.js

@@ -693,6 +693,69 @@ const routes = [{
 		meta: {
 			title: '我的团长',
 		},
-	}
+	},
+  {
+		path: '/pages/finance/index',
+		name: 'Finance',
+		meta: {
+			title: '财务',
+		},
+	},
+  {
+		path: '/pages/finance/balance',
+		name: 'Balance',
+		meta: {
+			title: '账户余额',
+		},
+	},
+  {
+		path: '/pages/finance/withdrawal',
+		name: 'Withdrawal',
+		meta: {
+			title: '提现',
+		},
+	},
+  {
+		path: '/pages/finance/submitted',
+		name: 'Submitted',
+		meta: {
+			title: '已提交',
+		},
+	},
+  {
+		path: '/pages/finance/accountRecord',
+		name: 'AccountRecord',
+		meta: {
+			title: '账户明细',
+		},
+	},
+  {
+		path: '/pages/finance/accountRecord',
+		name: 'AccountRecord',
+		meta: {
+			title: '账户明细',
+		},
+	},
+  {
+		path: '/pages/finance/settlementDetails',
+		name: 'SettlementDetails',
+		meta: {
+			title: '结算详情',
+		},
+	},
+  {
+		path: '/pages/finance/orderDetails',
+		name: 'OrderDetails',
+		meta: {
+			title: '订单详情',
+		},
+	},
+  {
+		path: '/pages/finance/withdrawalDetails',
+		name: 'WithdrawalDetails',
+		meta: {
+			title: '提现详情',
+		},
+	},
 ]
 export default routes

common/util/util.js

@@ -25,4 +25,18 @@ export const getUrlParams = (url) => {
         });
     }
     return result;
+};
+
+// 格式化金额，添加千位分隔符
+export const formatAmount = (amount, type) => {
+  if (type === 'quantity') {
+    if (amount === null || amount === undefined) return '0';
+    return String(amount).replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+  } else {
+    if (amount === null || amount === undefined) return '0.00';
+    return parseFloat(amount)
+      .toFixed(2)
+      .replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+  }
+  
 };

components/dengrq-datetime-picker/dateSelector/index.vue

@@ -17,12 +17,12 @@
       <view class="select-date-wrapper">
         <view class="select-date" :class="{ active: activeDate == 'startDate' }" @tap="onTapStartDate">
           <view class="select-date-value" v-if="startDate">{{ startDate }}</view>
-          <view class="select-date-placeholder" v-else>请选择时间</view>
+          <view class="select-date-placeholder" v-else>开始时间</view>
         </view>
-        <view style="margin: 0 16px">~</view>
+        <view style="margin: 0 16px">至</view>
         <view class="select-date" :class="{ active: activeDate == 'endDate' }" @tap="onTapEndDate">
           <view class="select-date-value" v-if="endDate">{{ endDate }}</view>
-          <view class="select-date-placeholder" v-else>请选择时间</view>
+          <view class="select-date-placeholder" v-else>结束时间</view>
         </view>
       </view>
 

components/list-scroll-view/index.vue

@@ -11,6 +11,10 @@
 			@scroll="onScroll">
 			<view class="lsv-list">
 				<slot name="list" :data="dataList" :is-scrolling="isScrolling"></slot>
+				<!-- 始终显示的底部提示 -->
+				<view class="lsv-footer">
+					{{ hasMoreData ? '上拉加载更多' : '-- 暂无更多数据 --' }}
+				</view>
 			</view>
 		</mescroll-uni>
 	</view>
@@ -58,6 +62,8 @@ export default {
 		return {
 			params: {},
 			dataList: [],
+			// 是否有更多数据
+			hasMoreData: true,
 			// 下拉刷新的配置
 			downOption: {
 				
@@ -73,6 +79,7 @@ export default {
 			let obj = {
 				// noMoreSize: 5, // 如果列表已无数据,可设置列表的总数量要大于5条才显示无更多数据;
 				onScroll: true,
+				textLoading: '上拉加载更多...',
 				textNoMore: '-- 暂无更多数据 --', 
 				page: {
 					size: this.pageSize // 每页数据的数量,默认10
@@ -103,6 +110,7 @@ export default {
 		},
 		// 下拉刷新
 		downCallback() {
+			this.hasMoreData = true; // 下拉刷新时重置为有更多数据
 			this.mescroll.resetUpScroll();
 		},
 		// 上拉加载
@@ -143,6 +151,8 @@ export default {
 					this.$emit('afterFetch', result);
 					// 数据
 					this.dataList = this.dataList.concat(records);
+					// 判断是否还有更多数据
+					this.hasMoreData = this.dataList.length < (result.total || result[this.keyName].total);
 					this.mescroll.endBySize(records.length, result.total || result[this.keyName].total);
 				} else {
 					this.$tip.error('数据请求发生错误');
@@ -154,6 +164,7 @@ export default {
 		},
 		reloadList(p) {
 			this.params = p;
+			this.hasMoreData = true; // 重新加载时重置为有更多数据
 			this.mescroll.resetUpScroll();
 		}
 	}
@@ -166,6 +177,13 @@ export default {
 	position: relative;
 	.lsv-list {
 		min-height: 100%;
+		.lsv-footer {
+			text-align: center;
+			padding: 20rpx 0;
+			font-size: 26rpx;
+			color: #999;
+			border-top: 1rpx solid #f7f8fc;
+		}
 	}
 }
-</style>
+</style>

components/yzhua006-update/app-update.vue

@@ -89,8 +89,6 @@ export default {
   methods: {
     // 检查更新
     update() {
-
-      console.log('-----------')
       // alert(plus.runtime.appid)
       // 获取手机系统信息
       uni.getSystemInfo({

pages.json

@@ -74,7 +74,62 @@
 			"path": "pages/order/record",
 			"style": {}
 		},
-
+		{
+			"path": "pages/finance/index",
+			"style": {
+				"navigationBarTitleText": "财务",
+				"navigationStyle": "custom"
+			}
+		},
+    {
+			"path": "pages/finance/balance",
+			"style": {
+				"navigationBarTitleText": "账户余额",
+				"navigationStyle": "custom"
+			}
+		},
+    {
+			"path": "pages/finance/accountRecord",
+			"style": {
+				"navigationBarTitleText": "账户明细",
+				"navigationStyle": "custom"
+			}
+		},
+    {
+			"path": "pages/finance/withdrawal",
+			"style": {
+				"navigationBarTitleText": "提现",
+				"navigationStyle": "custom"
+			}
+		},
+    {
+			"path": "pages/finance/submitted",
+			"style": {
+				"navigationBarTitleText": "已提交",
+				"navigationStyle": "custom"
+			}
+		},
+    {
+			"path": "pages/finance/settlementDetails",
+			"style": {
+				"navigationBarTitleText": "结算详情",
+				"navigationStyle": "custom"
+			}
+		},
+    {
+			"path": "pages/finance/orderDetails",
+			"style": {
+				"navigationBarTitleText": "订单详情",
+				"navigationStyle": "custom"
+			}
+		},
+    {
+			"path": "pages/finance/withdrawalDetails",
+			"style": {
+				"navigationBarTitleText": "提现详情",
+				"navigationStyle": "custom"
+			}
+		},
 		{
 			"path": "pages/index/full",
 			"style": {}
@@ -484,7 +539,8 @@
 			"transparentTitle": "always",
 			"allowsBounceVertical": "NO"
 		},
-		"navigationBarBackgroundColor": "#0081ff",
+		"navigationBarBackgroundColor": "#ffffff",
+    "navigationBarTitleColor": "#333333",
 		"navigationBarTitleText": "JEECG BOOT",
 		"navigationStyle": "custom",
 		"navigationBarTextStyle": "black"
@@ -504,6 +560,12 @@
 				"pagePath": "pages/order/index",
 				"iconPath": "static/tabbar/order_tab.png",
 				"selectedIconPath": "static/tabbar/order_select_tab.png"
+			},
+      {
+				"text": "财务",
+				"pagePath": "pages/finance/index",
+				"iconPath": "static/tabbar/set_tab.png",
+				"selectedIconPath": "static/tabbar/set_select_tab.png"
 			}
 			// { 
 			// 	"text": "消息",

pages/finance/accountRecord.vue

@@ -0,0 +1,295 @@
+<template>
+  <view class="account-record">
+    <view class="fix">
+      <view class="top"></view>
+      <view class="head">
+        <span class="cuIcon-back" @click="back"></span>
+        <view class="case"> {{ navTitle }} </view>
+      </view>
+
+      <!-- 当type为all或settlement时展示Tab -->
+      <view v-if="showTab" class="tab-container">
+        <view
+          class="tab-item"
+          v-for="(tab, index) in settlementTabs"
+          :key="index"
+          :class="{ active: currentTab === index }"
+          @click="switchTab(index)"
+        >
+          {{ tab }}
+        </view>
+      </view>
+    </view>
+
+    <!-- 列表区域 -->
+    <mescroll-uni
+      class="list-box"
+      ref="mescrollRef"
+      :fixed="false"
+      @up="getList"
+      @down="downCallback"
+      @init="mescrollInit"
+      :use="false"
+    >
+      <AccountList :list="accountData"></AccountList>
+    </mescroll-uni>
+  </view>
+</template>
+
+<script>
+import api from '@/api/account';
+import accountMenus from './dictionary';
+import AccountList from './components/account-list.vue';
+
+export default {
+  name: 'AccountRecord',
+  components: {
+    AccountList,
+  },
+  data() {
+    return {
+      navTitle: '账户明细',
+      // Tab选项
+      settlementTabs: ['全部', '结算', '提现'],
+      accountMenus,
+      params: {},
+      // 当前选中的Tab索引
+      currentTab: 0,
+      // 从跳转参数获取的type
+      type: '',
+      // 是否显示Tab
+      showTab: false,
+      // 列表数据
+      accountData: [],
+      mescroll: null,
+      // upOption: {
+      //   use: true,
+      //   auto: true,
+      //   page: {
+      //     num: 1,
+      //     size: 10,
+      //   },
+      //   textLoading: '加载中...',
+      //   textNoMore: '-- 暂无更多数据 --',
+      // },
+      // downOption: {
+      //   use: true,
+      //   auto: false,
+      //   offset: 80,
+      //   textDown: '下拉刷新',
+      //   textLoading: '刷新中...',
+      // },
+    };
+  },
+  onLoad(options) {
+    if (options.type) {
+      this.type = options.type;
+
+      if (this.type === 'all' || this.type === 'settlement') {
+        this.showTab = true;
+        this.currentTab = this.type === 'all' ? 0 : 1;
+      } else {
+        this.navTitle = this.accountMenus.find((menu) => menu.type === this.type).title;
+        this.showTab = false;
+      }
+    }
+    this.mescroll && this.mescroll.triggerUpScroll();
+  },
+  onShow() {
+    if (this.accountData.length === 0) {
+      this.mescroll && this.mescroll.triggerUpScroll();
+    }
+  },
+  methods: {
+    // 初始化mescroll
+    mescrollInit(mescroll) {
+      this.mescroll = mescroll;
+    },
+    // 下拉刷新回调
+    downCallback() {
+      // 重置页码
+      this.mescroll.resetUpScroll();
+      // 清空数据列表
+      this.accountData = [];
+    },
+    // 切换Tab
+    switchTab(index) {
+      this.currentTab = index;
+      this.params.mainType = index === 0 ? '' : index === 1 ? 'SETTLE' : 'WITHDRAW';
+      this.getList({ num: 1, size: 10, ...this.params });
+    },
+    // 获取列表数据
+    getList(page) {
+      let params = this.buildParams(page);
+      api
+        .getAccountList(params)
+        .then((res) => {
+          if (res.data.code === 200) {
+            const records = res.data.result.records || [];
+            const total = res.data.result.total || 0;
+
+            // 更新数据列表
+            if (page.num === 1) {
+              this.accountData = records;
+            } else {
+              this.accountData = this.accountData.concat(records);
+            }
+            // 结束上拉加载
+            this.mescroll.endSuccess(records.length, total);
+            uni.showTabBar();
+          } else {
+            this.mescroll.endErr();
+          }
+        })
+        .catch(() => {
+          this.mescroll.endErr();
+        });
+    },
+    // 构造请求参数
+    buildParams(page) {
+      let params = {
+        pageSize: page.size,
+        pageNo: page.num,
+      };
+
+      if (this.type === 'all' || this.type === 'settlement') {
+        switch (this.currentTab) {
+          case 0: // 全部
+            params.mainType = '';
+            break;
+          case 1: // 结算
+            params.mainType = 'SETTLE';
+            break;
+          case 2: // 提现
+            params.mainType = 'WITHDRAW';
+            break;
+        }
+      } else if (this.type === 'pending') {
+        params.mainType = 'SETTLE';
+        params.subType = 'PENDING';
+      } else if (this.type === 'auditing') {
+        params.mainType = 'WITHDRAW';
+        params.subType = 'PENDING';
+      } else if (this.type === 'completed') {
+        params.mainType = 'WITHDRAW';
+        params.subType = 'DONE';
+      }
+
+      return params;
+    },
+    resetList() {
+      // 重置页码
+      if (this.mescroll) {
+        this.mescroll.resetUpScroll();
+      }
+      // 清空数据列表
+      this.accountData = [];
+    },
+    //返回
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.account-record {
+  width: 100vw;
+  height: 100vh;
+  position: fixed;
+  background: #f7f8fc;
+
+  .fix {
+    width: 100%;
+    height: auto;
+    background: #ffffff;
+    position: sticky;
+    top: 0px;
+    border-bottom: 1px solid #eeeeee;
+
+    /*#ifdef APP-PLUS*/
+    .top {
+      width: 100%;
+      height: var(--status-bar-height);
+      background: #fff;
+    }
+
+    /*#endif*/
+
+    .head {
+      width: 100%;
+      height: 112rpx;
+      padding: 20rpx;
+      display: flex;
+      align-items: center;
+      background: #fff;
+      position: relative;
+      border-bottom: 1rpx solid #eeeeee;
+
+      .cuIcon-back {
+        font-size: 40rpx;
+        margin-right: 40rpx;
+      }
+
+      .case {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-weight: 500;
+        font-size: 38rpx;
+        color: #333333;
+      }
+    }
+  }
+
+  .tab-container {
+    display: flex;
+    width: 100%;
+    height: 80rpx;
+    line-height: 80rpx;
+    background: #fff;
+    border-radius: 0rpx 0rpx 13rpx 13rpx;
+
+    .tab-item {
+      flex: 1;
+      text-align: center;
+      font-weight: 400;
+      font-size: 29rpx;
+      color: #333333;
+      position: relative;
+
+      &.active {
+        font-weight: 500;
+        font-size: 31rpx;
+        color: #449aff;
+
+        &::after {
+          content: '';
+          position: absolute;
+          bottom: 5rpx;
+          left: 50%;
+          transform: translateX(-50%);
+          width: 50rpx;
+          height: 6rpx;
+          background: #449aff;
+          border-radius: 7rpx;
+        }
+      }
+    }
+  }
+
+  .list-box {
+    height: 100%;
+    flex: 1;
+    overflow-y: auto;
+    padding: 0 31rpx;
+    font-size: 28rpx;
+    color: #333;
+    margin: 17rpx 31rpx;
+    background: #fff;
+  }
+}
+</style>

pages/finance/balance.vue

@@ -0,0 +1,313 @@
+<template>
+  <view class="container">
+    <view class="top"></view>
+    <view class="head">
+      <span class="cuIcon-back" @click="back"></span>
+      <view class="case"> 账户余额 </view>
+    </view>
+
+    <view class="main-box">
+      <view class="one-box">
+        <view>
+          <view class="title">账户余额（元）</view>
+          <view class="money">{{ formatAmount(balance) }}</view>
+        </view>
+        <view v-if="1">
+          <view class="btn-cash" @click="toPage('withdrawal')">
+            <image src="/static/finance/account/cash.png" mode="aspectFit" class="btn-img"></image>
+            <view>提现</view>
+          </view>
+        </view>
+      </view>
+
+      <view class="two-box">
+        <u-grid :col="4" :border="false">
+          <u-grid-item
+            v-for="(item, k) in accountMenus"
+            :key="k"
+            :customStyle="{
+              paddingTop: '21rpx',
+              paddingBottom: '21rpx',
+            }"
+            style="background: 'none'"
+            @click="toPage(item.type)"
+          >
+            <image class="icon" :src="item.icon" mode="aspectFit"></image>
+            <text class="desc">{{ item.title }}</text>
+          </u-grid-item>
+        </u-grid>
+      </view>
+
+      <view class="thr-box">
+        <u-sticky :offset-top="20" :customNavHeight="44">
+          <view class="section-title">
+            <view>
+              <text>账户明细</text>
+            </view>
+
+            <view class="action" @click="toPage('all')">
+              <text>全部</text>
+              <u-icon name="arrow-right" color="#999" size="26" top="1"></u-icon>
+            </view>
+          </view>
+        </u-sticky>
+        <!-- 账户列表 -->
+        <mescroll-uni
+          class="list-box"
+          ref="mescrollRef"
+          :fixed="false"
+          @up="getList"
+          @down="downCallback"
+          @init="mescrollInit"
+          :use="false"
+        >
+          <AccountList :list="accountData"></AccountList>
+        </mescroll-uni>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import api from '@/api/account';
+import { formatAmount } from '@/common/util/util';
+import accountMenus from './dictionary';
+import AccountList from './components/account-list.vue';
+
+export default {
+  name: 'Finance',
+  components: {
+    AccountList,
+  },
+  data() {
+    return {
+      accountMenus,
+      formatAmount,
+      accountData: [],
+      mescroll: null,
+      balance: 0,
+    };
+  },
+  onShow() {
+    if (!this.balance) {
+      this.getFinanceInfo();
+    }
+  },
+  onLoad(options) {
+    this.balance = options.balance;
+  },
+  methods: {
+    getFinanceInfo() {
+      api.getAccountInfo().then((res) => {
+        if (res.data.code === 200 && res.data.result) {
+          this.balance = res.data.result.availableAmount;
+        }
+      });
+    },
+    // 账户列表
+    getList(page) {
+      let params = {
+        // mainType: '', // 结算SETTLE 提现WITHDRAW
+        // subType: '', // 进行中PENDING 已提现DONE
+        pageNo: page.num,
+        pageSize: page.size,
+      };
+      api
+        .getAccountList(params)
+        .then((res) => {
+          if (res.data.code === 200) {
+            const records = res.data.result.records || [];
+            const total = res.data.result.total || 0;
+            if (page.num === 1) {
+              this.accountData = records;
+            } else {
+              this.accountData = this.accountData.concat(records);
+            }
+
+            this.mescroll.endSuccess(records.length, total);
+            uni.showTabBar();
+          } else {
+            this.mescroll.hideUpScroll();
+            this.mescroll.endErr();
+          }
+        })
+        .catch(() => {
+          this.mescroll.endErr();
+        });
+    },
+    // 跳转账户明细
+    toPage(type) {
+      let path = type === 'withdrawal' ? type : `accountRecord?type=${type}`;
+      uni.navigateTo({
+        url: `/pages/finance/${path}`,
+      });
+    },
+    mescrollInit(mescroll) {
+      this.mescroll = mescroll;
+    },
+    // 下拉刷新回调
+    downCallback() {
+      this.mescroll.resetUpScroll();
+      this.accountData = [];
+    },
+    back() {
+      uni.switchTab({
+        url: '/pages/finance/index',
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  width: 100vw;
+  height: 100vh;
+  overflow: auto;
+  background: #f7f8fc;
+  font-family: Source Han Sans SC;
+
+  /*#ifdef APP-PLUS*/
+  .top {
+    width: 100%;
+    height: var(--status-bar-height);
+    background: #fff;
+  }
+
+  /*#endif*/
+
+  .head {
+    width: 100%;
+    height: 112rpx;
+    padding: 20rpx;
+    display: flex;
+    align-items: center;
+    background: #fff;
+    position: fixed;
+    z-index: 999;
+    border-bottom: 1rpx solid #eeeeee;
+
+    .cuIcon-back {
+      font-size: 40rpx;
+      margin-right: 40rpx;
+    }
+
+    .case {
+      position: absolute;
+      left: 50%;
+      transform: translateX(-50%);
+      font-weight: 500;
+      font-size: 38rpx;
+      color: #333333;
+    }
+  }
+
+  .main-box {
+    border-top: 1rpx solid #eeeeee;
+    padding-top: 112rpx;
+
+    .one-box {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin: 22rpx 31rpx 0;
+      padding: 21rpx 19rpx 19rpx 31rpx;
+      background: linear-gradient(286deg, #34bbff 0%, #4496fb 100%);
+      box-shadow: 0rpx 4rpx 10rpx 0rpx #dae3f4;
+      border-radius: 21rpx 21rpx 0rpx 0rpx;
+
+      .title {
+        font-family: Source Han Sans CN;
+        font-weight: 400;
+        font-size: 25rpx;
+        color: #ffffff;
+      }
+      .money {
+        font-family: DIN Alternate;
+        font-weight: bold;
+        font-size: 63rpx;
+        color: #ffffff;
+      }
+      .item {
+        font-weight: 400;
+        font-size: 26rpx;
+        color: #666666;
+      }
+      .btn-cash {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 144rpx;
+        height: 63rpx;
+        background: #ffffff;
+        border-radius: 8rpx 8rpx 8rpx 8rpx;
+        font-family: Source Han Sans SC;
+        font-weight: 500;
+        font-size: 29rpx;
+        color: #38b2fe;
+
+        .btn-img {
+          width: 33rpx;
+          height: 33rpx;
+          margin-right: 10rpx;
+        }
+      }
+    }
+    .two-box {
+      height: 151rpx;
+      background: linear-gradient(180deg, #c3ebff 0%, #f7f8fc 100%);
+      box-shadow: inset 0rpx 2rpx 0rpx 0rpx rgba(255, 255, 255, 0.4);
+      border-radius: 21rpx 21rpx 0rpx 0rpx;
+
+      .icon {
+        width: 62rpx;
+        height: 62rpx;
+      }
+      .desc {
+        font-weight: 400;
+        font-size: 25rpx;
+        color: #7a7f89;
+        margin-top: 10rpx;
+      }
+    }
+
+    .thr-box {
+      margin: 10rpx 31rpx 40rpx;
+      padding: 0 31rpx;
+      background: #ffffff;
+      border-radius: 10rpx 10rpx 10rpx 10rpx;
+
+      .section-title {
+        width: 100%;
+        height: 80rpx;
+        font-weight: 500;
+        font-size: 31rpx;
+        color: #333333;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        background: #fff;
+        border-bottom: 1rpx solid #eeeeee;
+      }
+
+      .list-box {
+        flex: 1;
+        overflow-y: auto;
+      }
+
+      .action {
+        font-weight: 400;
+        font-size: 27rpx;
+        color: #666666;
+        display: flex;
+        align-items: center;
+      }
+    }
+  }
+}
+::v-deep {
+  .u-grid-item {
+    background: none;
+  }
+}
+</style>

pages/finance/components/account-list.vue

@@ -0,0 +1,106 @@
+<template>
+  <view class="list">
+    <view class="list_item" v-for="(item, index) in list" :key="index" @click="goDetails(item)">
+      <view class="left">
+        <image src="/static/finance/account/icon-list.png" mode="aspectFit"></image>
+      </view>
+      <view class="center">
+        <view class="name">{{ item.title }}</view>
+        <view class="value">{{ item.occurTime }}</view>
+      </view>
+      <view class="right">
+        <view class="money">{{ item.amountText }}</view>
+        <view class="value">余额{{ item.balanceAfter || 0 }}</view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    list: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  methods: {
+    goDetails(item) {
+      let pathName = '';
+      switch (item.mainType) {
+        case 'SETTLE':
+          pathName = 'settlementDetails';
+          break;
+        case 'PENDING_SETTLE':
+          pathName = 'orderDetails';
+          break;
+        case 'WITHDRAW':
+          pathName = 'withdrawalDetails';
+          break;
+      }
+      uni.navigateTo({
+        url: `/pages/finance/${pathName}?id=${item.bizId}`,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.list {
+  .list_item {
+    width: 100%;
+    padding: 22rpx 0;
+    overflow: auto;
+    display: flex;
+    align-items: center;
+    border-bottom: 1rpx solid #eeeeee;
+    font-weight: 400;
+
+    &:last-child {
+      border-bottom: none;
+    }
+
+    .left {
+      width: 68rpx;
+      height: 68rpx;
+      margin-right: 16rpx;
+
+      image {
+        width: 68rpx;
+        height: 68rpx;
+      }
+    }
+
+    .center {
+      flex: 1;
+      margin-right: 16rpx;
+
+      .name {
+        font-size: 29rpx;
+        color: #333333;
+        margin-bottom: 5rpx;
+      }
+    }
+
+    .right {
+      width: auto;
+      text-align: right;
+      display: flex;
+      flex-direction: column;
+
+      .money {
+        font-weight: 500;
+        font-size: 31rpx;
+        color: #333333;
+        margin-bottom: 5rpx;
+      }
+    }
+
+    .value {
+      font-size: 21rpx;
+      color: #999999;
+    }
+  }
+}
+</style>

pages/finance/components/order-list.vue

@@ -0,0 +1,80 @@
+<template>
+  <view class="list">
+    <view class="list_item" v-for="(item, index) in list" :key="index" @click="goDetails(item)">
+      <view class="left">
+        <view class="name">订单号:{{ item.orderId }}</view>
+        <view class="value">{{ item.buyTime }}</view>
+      </view>
+      <view class="right">
+        <view>+{{ item.orderPrice }}</view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    list: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  methods: {
+    goDetails(item) {
+      uni.navigateTo({
+        url: `/pages/finance/orderDetails?orderId=${item.orderId}`,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.list {
+  border: 1rpx solid #f7f8fc;
+  .list_item {
+    width: 100%;
+    padding: 21rpx;
+    overflow: auto;
+    display: flex;
+    align-items: center;
+    border-bottom: 1rpx solid #EEEEEE;
+    font-weight: 400;
+
+    &:last-child {
+      border-bottom: none;
+    }
+
+    .left {
+      flex: 1;
+      margin-right: 16rpx;
+
+      .name {
+        width: 463rpx;
+        font-size: 29rpx;
+        color: #333333;
+        margin-bottom: 5rpx;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      .value {
+        font-size: 21rpx;
+        color: #999999;
+      }
+    }
+
+    .right {
+      width: auto;
+      text-align: right;
+      display: flex;
+      flex-direction: column;
+      font-weight: 500;
+      font-size: 31rpx;
+      color: #333333;
+    }
+  }
+}
+</style>

pages/finance/dictionary.js

@@ -0,0 +1,28 @@
+const accountMenus = [
+        {
+          type: 'settlement',
+          title: '结算记录',
+          icon: '/static/finance/account/settlement.png',
+          path: '/packageC/pages/mine/settlementRecord/index',
+        },
+        {
+          type: 'pending',
+          title: '待结算明细',
+          icon: '/static/finance/account/pending.png',
+          path: '/packageC/pages/mine/settlementRecord/index',
+        },
+        {
+          type: 'auditing',
+          title: '提现审核中',
+          icon: '/static/finance/account/auditing.png',
+          path: '/packageC/pages/mine/settlementRecord/index',
+        },
+        {
+          type: 'completed',
+          title: '已提现明细',
+          icon: '/static/finance/account/completed.png',
+          path: '/packageC/pages/mine/settlementRecord/index',
+        },
+      ]
+
+export default accountMenus 

pages/finance/index.vue

@@ -0,0 +1,416 @@
+<template>
+  <view class="container">
+    <view class="top"></view>
+    <view class="title">财务数据</view>
+
+    <view class="balance-card">
+      <!-- 账户余额 -->
+      <view class="balance-info">
+        <view @click="goPage">
+          <view class="flex">
+            <text class="balance-label">账户余额</text>
+            <u-icon name="arrow-right" class="ml-1" color="#fff" size="24"></u-icon>
+          </view>
+          <text class="balance-amount">{{ formatAmount(financeData.availableAmount) }}</text>
+        </view>
+        <view>
+          <button class="withdraw-btn" @click="goWithdrawal">提现</button>
+        </view>
+      </view>
+
+      <!-- 金额统计 -->
+      <view class="stats-row u-m-b-20">
+        <view class="stat-item">
+          <text class="stat-label">已结算金额 (元)</text>
+          <text class="stat-value">{{ formatAmount(financeData.totalSettledAmount) }}</text>
+        </view>
+        <view class="stat-item">
+          <text class="stat-label">待结算金额 (元)</text>
+          <text class="stat-value">{{ formatAmount(financeData.pendingSettledAmount) }}</text>
+        </view>
+      </view>
+      <view class="stats-row">
+        <view class="stat-item">
+          <text class="stat-label">已提现金额 (元)</text>
+          <text class="stat-value">{{ formatAmount(financeData.totalWithdrawnAmount) }}</text>
+        </view>
+        <view class="stat-item">
+          <text class="stat-label">提现中金额 (元)</text>
+          <text class="stat-value">{{ formatAmount(financeData.frozenAmount) }}</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 业务类型 -->
+    <view class="business-tabs">
+      <view
+        v-for="(tab, index) in businessTabs"
+        :key="tab.name"
+        :class="index == currentTab ? 'tab-item active' : 'tab-item'"
+        @click="onTabChange(index)"
+        >{{ tab.name }}</view
+      >
+    </view>
+
+    <!-- 订单统计 -->
+    <view class="amount-card">
+      <!-- 日期选择 -->
+      <view class="date-picker">
+        <view @click="selectDate">
+          <text>{{ startDate ? startDate : '开始时间' }}</text>
+          <text class="date-separator">至</text>
+          <text>{{ endDate ? endDate : '结束时间' }}</text>
+          <u-icon v-if="!startDate || !endDate" class="ml-1" name="arrow-down-fill" size="18" color="#666666"></u-icon>
+        </view>
+        <uni-icons
+          v-if="startDate"
+          class="ml-1"
+          type="clear"
+          size="18"
+          color="#909399"
+          @click="resetDateRange"
+        ></uni-icons>
+      </view>
+      <!-- 普通/团餐 -->
+      <view v-if="currentTab == 0 || currentTab == 2">
+        <view class="row u-m-b-12">
+          <view class="item">
+            <text class="label">{{ currentTab == 0 ? '订单金额 (元)' : '团餐订单金额 (元)' }}</text>
+            <text class="value">{{ formatAmount(orderData.orderAmount) || '0.00' }}</text>
+          </view>
+          <view class="item">
+            <text class="label">{{ currentTab == 0 ? '退款金额 (元)' : '团餐退款金额 (元)' }}</text>
+            <text class="value">{{ formatAmount(orderData.refundAmount) || '0.00' }}</text>
+          </view>
+        </view>
+        <view class="row u-m-b-12">
+          <view class="item">
+            <text class="label">{{ currentTab == 0 ? '支付订单量' : '团餐订单量' }}</text>
+            <text class="value">{{ formatAmount(orderData.orderCount, 'quantity') || '0' }}</text>
+          </view>
+          <view class="item">
+            <text class="label">退款订单量</text>
+            <text class="value">{{ formatAmount(orderData.refundCount, 'quantity') || '0' }}</text>
+          </view>
+        </view>
+        <view class="row" v-if="currentTab == 2">
+          <view class="item">
+            <text class="label">普通订单金额 (元)</text>
+            <text class="value">{{ formatAmount(orderData.normalOrderAmount) || '0.00' }}</text>
+          </view>
+          <view class="item">
+            <text class="label">企业订单金额 (元)</text>
+            <text class="value">{{ formatAmount(orderData.enterpriseOrderAmount) || '0.00' }}</text>
+          </view>
+        </view>
+      </view>
+      <!-- 渠道订单 -->
+      <view v-if="currentTab == 1">
+        <view class="row u-m-b-12">
+          <view class="item">
+            <text class="label">权益券金额 (元)</text>
+            <text class="value">{{ formatAmount(orderData.couponAmount) || '0.00' }}</text>
+          </view>
+          <view class="item">
+            <text class="label">实付金额 (元)</text>
+            <text class="value">{{ formatAmount(orderData.actualPayAmount) || '0.00' }}</text>
+          </view>
+        </view>
+        <view class="row">
+          <view class="item">
+            <text class="label">应收金额 (元)</text>
+            <text class="value">{{ formatAmount(orderData.receivableAmount) || '0.00' }}</text>
+          </view>
+          <view class="item">
+            <text class="label">订单量</text>
+            <text class="value">{{ formatAmount(orderData.orderCount, 'quantity') || '0' }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+    <rangTime ref="rangTime" :mode="1" title="选择日期" @onSubmit="onEndTimeChange" />
+  </view>
+</template>
+
+<script>
+import api from '@/api/account.js';
+import { formatAmount } from '@/common/util/util';
+import rangTime from '@/components/dengrq-datetime-picker/dateSelector/index.vue';
+
+export default {
+  components: {
+    rangTime,
+  },
+  data() {
+    return {
+      formatAmount,
+      currentTab: 0,
+      financeData: {},
+      orderData: {},
+      startDate: '',
+      endDate: '',
+      businessTabs: [
+        { name: '普通业务', type: 'NORMAL' },
+        { name: '渠道业务', type: 'CHANNEL' },
+        { name: '团餐业务', type: 'GROUP_MEAL' },
+      ],
+    };
+  },
+  onShow() {
+    this.getData();
+    this.getFinanceInfo();
+  },
+  methods: {
+    getData() {
+      api.getAccountInfo().then((res) => {
+        if (res.data.code === 200 && res.data.result) {
+          this.financeData = res.data.result;
+        }
+      });
+    },
+    getFinanceInfo() {
+      const params = {
+        bizType: this.businessTabs[this.currentTab].type,
+      };
+      if (this.startDate) {
+        params.startDate = this.startDate;
+        params.endDate = this.endDate;
+      }
+      api.getFinanceStats(params).then((res) => {
+        if (res.data.code === 200 && res.data.result) {
+          this.orderData = res.data.result;
+          this.startDate = res.data.result.startDate;
+          this.endDate = res.data.result.endDate;
+          this.$refs.rangTime.startDate = this.startDate;
+          this.$refs.rangTime.endDate = this.endDate;
+        }
+      });
+    },
+    onTabChange(e) {
+      this.currentTab = e;
+      this.resetDateRange();
+    },
+    // 选择日期
+    selectDate() {
+      this.$refs.rangTime.open();
+    },
+    onEndTimeChange(val) {
+      this.startDate = val.startDate;
+      this.endDate = val.endDate;
+      console.log(this.startDate, this.endDate);
+      this.$forceUpdate();
+      this.getFinanceInfo();
+    },
+    resetDateRange() {
+      this.startDate = '';
+      this.endDate = '';
+      this.$refs.rangTime.startDate = '';
+      this.$refs.rangTime.endDate = '';
+      this.getFinanceInfo();
+    },
+    // 跳转账号余额
+    goPage() {
+      uni.navigateTo({
+        url: `/pages/finance/balance?balance=${this.financeData.availableAmount}`,
+      });
+    },
+    // 跳转提现
+    goWithdrawal() {
+      uni.navigateTo({
+        url: `/pages/finance/withdrawal?balance=${this.financeData.availableAmount}`,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  width: 100%;
+  background: #ffffff;
+  font-family: Source Han Sans CN;
+
+  .top {
+    width: 100%;
+    height: var(--status-bar-height);
+    background:
+      linear-gradient(90deg, #e3f4f8 0%, #ebf7f7 47.5%, #d6eff7 100%),
+      linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
+  }
+
+  .title {
+    height: 117rpx;
+    font-family: Source Han Sans SC;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 38rpx;
+    color: #333333;
+    font-weight: 500;
+    border-bottom: 1rpx solid #eeeeee;
+    background:
+      linear-gradient(90deg, #e3f4f8 0%, #ebf7f7 47.5%, #d6eff7 100%),
+      linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
+  }
+
+  .balance-card {
+    margin: 21rpx 25rpx 10rpx;
+    padding: 21rpx 31rpx 31rpx;
+    background: linear-gradient(286deg, #34bbff 0%, #4496fb 100%);
+    box-shadow: 0rpx 4rpx 10rpx 0rpx #dae3f4;
+    border-radius: 21rpx 21rpx 21rpx 21rpx;
+    border: 1rpx solid rgba(255, 255, 255, 0.6);
+
+    .balance-info {
+      flex: 1;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      border-bottom: 1rpx solid rgba(255, 255, 255, 0.2);
+      margin-bottom: 21rpx;
+
+      .balance-label {
+        display: block;
+        font-weight: 400;
+        font-size: 25rpx;
+        color: #ffffff;
+      }
+
+      .balance-amount {
+        font-family:
+          DIN Alternate,
+          DIN Alternate;
+        font-weight: bold;
+        font-size: 63rpx;
+        color: #ffffff;
+      }
+
+      .withdraw-btn {
+        width: 129rpx;
+        height: 63rpx;
+        background: #ffffff;
+        border-radius: 8rpx 8rpx 8rpx 8rpx;
+        font-family: Source Han Sans SC;
+        font-weight: 500;
+        font-size: 29rpx;
+        color: #38b2fe;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+  }
+
+  .stats-row {
+    display: flex;
+    text-align: left;
+
+    :last-child {
+      margin-bottom: 0;
+    }
+
+    .stat-item {
+      flex: 1;
+      text-align: center;
+
+      .stat-label {
+        display: block;
+        font-weight: 400;
+        font-size: 21rpx;
+        color: #ffffff;
+      }
+
+      .stat-value {
+        font-family: DIN Alternate;
+        font-weight: bold;
+        font-size: 38rpx;
+        color: #ffffff;
+      }
+    }
+  }
+
+  .amount-card {
+    margin: 21rpx 25rpx 0;
+    padding: 17rpx 0 21rpx;
+    background: #f7f8fc;
+    border-radius: 21rpx 21rpx 21rpx 21rpx;
+
+    .row {
+      display: flex;
+      text-align: left;
+
+      :last-child {
+        margin-bottom: 0;
+      }
+
+      .item {
+        flex: 1;
+        text-align: center;
+
+        .label {
+          display: block;
+          font-weight: 400;
+          font-size: 21rpx;
+          color: #666666;
+        }
+
+        .value {
+          font-family: Source Han Sans SC;
+          font-weight: 500;
+          font-size: 33rpx;
+          color: #333333;
+        }
+      }
+    }
+  }
+
+  .business-tabs {
+    display: flex;
+    justify-content: space-around;
+
+    .tab-item {
+      // flex: 1;
+      position: relative;
+      padding: 18rpx 0;
+      cursor: pointer;
+      font-family: Source Han Sans SC;
+      color: #333333;
+      font-weight: 400;
+      font-size: 29rpx;
+    }
+
+    .active {
+      font-weight: 500;
+      color: #449aff;
+    }
+    .tab-item.active::after {
+      content: '';
+      position: absolute;
+      bottom: -28px;
+      left: 35%;
+      width: 38rpx;
+      height: 100%;
+      background: url('@/static/product/tab-act.png') no-repeat;
+      background-size: contain;
+    }
+  }
+
+  .date-picker {
+    display: flex;
+    justify-content: center;
+    border-radius: 12rpx;
+    margin: 0 28rpx 17rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    font-weight: 400;
+    font-size: 27rpx;
+    color: #666666;
+
+    .date-separator {
+      margin: 0 5px;
+    }
+  }
+}
+</style>

pages/finance/orderDetails.vue

@@ -0,0 +1,347 @@
+<template>
+  <view class="order">
+    <view class="fix">
+      <view class="top"></view>
+      <view class="head">
+        <span class="cuIcon-back" @click="back"></span>
+        <view class="case"> 结算详情 </view>
+      </view>
+    </view>
+
+    <view class="order-card">
+      <view class="order-header">
+        <view class="amount">{{ orderInfo.payableToMerchant }}</view>
+        <view class="title">应收金额</view>
+      </view>
+      <view class="order-info">
+        <view class="info">
+          <view class="label">订单编号</view>
+          <view class="value">{{ orderInfo.orderId }}</view>
+        </view>
+        <view class="info">
+          <view class="label">商品名称</view>
+          <view class="value">{{ orderInfo.productName }}</view>
+        </view>
+        <view class="info">
+          <view class="label">下单时间</view>
+          <view class="value">{{ orderInfo.buyTime }}</view>
+        </view>
+        <view class="info">
+          <view class="label">核销时间</view>
+          <view class="value">{{ orderInfo.writeOffTime }}</view>
+        </view>
+        <view class="info">
+          <view class="label">订单金额</view>
+          <view class="value">{{ orderInfo.orderPrice }}</view>
+        </view>
+        <view class="info">
+          <view class="label">实付金额</view>
+          <view class="value">{{ orderInfo.actualPayAmount }}</view>
+        </view>
+        <view class="info">
+          <view class="label">应收金额 </view>
+          <view class="value">{{ orderInfo.payableToMerchant }}</view>
+        </view>
+        <view class="info">
+          <view class="label">
+            邀新分佣成本
+            <image
+              src="/static/finance/status/icon-remind.png"
+              mode="aspectFit"
+              style="width: 33rpx; height: 33rpx; margin-left: 8rpx"
+              @click.stop="toggleTooltip('showTooltip')"
+            ></image>
+            <view class="tooltip" v-show="showTooltip">商户占比{{orderInfo.inviteNewUserCommissionMerchantRate}}%</view>
+          </view>
+          <view class="value">{{ orderInfo.inviteNewUserCommissionMerchantCost }}</view>
+        </view>
+        <view class="info">
+          <view class="label">
+            优惠券成本
+            <image
+              class="tip-img"
+              src="/static/finance/status/icon-remind.png"
+              mode="aspectFit"
+              style="width: 33rpx; height: 33rpx; margin-left: 8rpx"
+              @click.stop="toggleTooltip('showTooltip1')"
+            ></image>
+            <view class="tooltip" v-show="showTooltip1">商户占比{{orderInfo.couponMerchantRate}}%</view>
+          </view>
+          <view class="value">{{ orderInfo.couponMerchantCost }}</view>
+        </view>
+        <view class="info">
+          <view class="label">
+            会员折扣成本
+            <image
+              src="/static/finance/status/icon-remind.png"
+              mode="aspectFit"
+              style="width: 33rpx; height: 33rpx; margin-left: 8rpx"
+              @click.stop="toggleTooltip('showTooltip2')"
+            ></image>
+            <view class="tooltip" v-show="showTooltip2">商户占比{{orderInfo.memberDiscountMerchantRate}}%</view>
+          </view>
+          <view class="value">{{ orderInfo.memberDiscountMerchantCost }}</view>
+        </view>
+        <view class="info">
+          <view class="label">
+            金豆抵扣成本
+            <image
+              src="/static/finance/status/icon-remind.png"
+              mode="aspectFit"
+              style="width: 33rpx; height: 33rpx; margin-left: 8rpx"
+              @click.stop="toggleTooltip('showTooltip3')"
+            ></image>
+            <view class="tooltip" v-show="showTooltip3">商户占比{{orderInfo.jinbiMerchantRate}}%</view>
+          </view>
+          <view class="value">{{ orderInfo.jinbiMerchantCost }}</view>
+        </view>
+        <view class="info">
+          <view class="label">
+            推广分佣成本
+            <image
+              src="/static/finance/status/icon-remind.png"
+              mode="aspectFit"
+              style="width: 33rpx; height: 33rpx; margin-left: 8rpx"
+              @click.stop="toggleTooltip('showTooltip4')"
+            ></image>
+            <view class="tooltip" v-show="showTooltip4">商户占比{{orderInfo.distributorCommissionMerchantRate}}%</view>
+          </view>
+          <view class="value">{{ orderInfo.distributorCommissionMerchantCost }}</view>
+        </view>
+      </view>
+
+      <!-- 备注说明 -->
+      <view class="remark">
+        注：应收金额=订单金额*商品分佣占比-邀新分佣成本-优惠券成本-会员折扣成本-金豆抵扣成本-推广分佣成本</view
+      >
+    </view>
+  </view>
+</template>
+
+<script>
+import api from '@/api/account';
+
+export default {
+  name: 'OrderDetails',
+  data() {
+    return {
+      orderId: '',
+      showTooltip: false,
+      showTooltip1: false,
+      showTooltip2: false,
+      showTooltip3: false,
+      showTooltip4: false,
+      orderInfo: {},
+      tooltipTimer: null
+    };
+  },
+  mounted() {
+    // 点击其他区域隐藏提示
+    document.addEventListener('click', this.handleClickOutside);
+  },
+  beforeUnmount() {
+    // 移除事件监听
+    document.removeEventListener('click', this.handleClickOutside);
+    // 清除定时器
+    if (this.tooltipTimer) {
+      clearTimeout(this.tooltipTimer);
+    }
+  },
+  onLoad(options) {
+    if (options.id) {
+      this.orderId = options.id;
+    }
+  },
+  onShow() {
+    this.getOrderDetails(this.orderId);
+  },
+  methods: {
+    getOrderDetails(id) {
+      api.orderClearDetail(id).then((res) => {
+        if (res.data.code === 200) {
+          this.orderInfo = res.data.result;
+        }
+      });
+    },
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    // 处理点击事件，显示提示并设置10秒自动隐藏
+    toggleTooltip(tooltipName) {
+      // 清除之前的定时器
+      if (this.tooltipTimer) {
+        clearTimeout(this.tooltipTimer);
+      }
+      // 显示当前提示，隐藏其他提示
+      this.showTooltip = tooltipName === 'showTooltip';
+      this.showTooltip1 = tooltipName === 'showTooltip1';
+      this.showTooltip2 = tooltipName === 'showTooltip2';
+      this.showTooltip3 = tooltipName === 'showTooltip3';
+      this.showTooltip4 = tooltipName === 'showTooltip4';
+      
+      // 如果是显示状态，设置10秒后自动隐藏
+      if (this[tooltipName]) {
+        this.tooltipTimer = setTimeout(() => {
+          this[tooltipName] = false;
+        }, 10000); // 10秒自动隐藏
+      }
+    },
+    // 点击其他区域隐藏提示
+    handleClickOutside(event) {
+      // 检查点击目标是否在提示或图片上
+      const tooltipElements = document.querySelectorAll('.tooltip, .tip-img, image[src*="icon-remind.png"]');
+      let isClickOnTooltip = false;
+      
+      tooltipElements.forEach(element => {
+        if (element.contains(event.target)) {
+          isClickOnTooltip = true;
+        }
+      });
+      
+      // 如果点击的不是提示或图片，隐藏所有提示
+      if (!isClickOnTooltip) {
+        this.showTooltip = false;
+        this.showTooltip1 = false;
+        this.showTooltip2 = false;
+        this.showTooltip3 = false;
+        this.showTooltip4 = false;
+        // 清除定时器
+        if (this.tooltipTimer) {
+          clearTimeout(this.tooltipTimer);
+        }
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.order {
+  background: #f7f8fc;
+  min-height: 100vh;
+  font-family: Source Han Sans SC;
+  font-weight: 500;
+
+  .fix {
+    position: sticky;
+    top: 0;
+
+    /*#ifdef APP-PLUS*/
+    .top {
+      width: 100%;
+      height: var(--status-bar-height);
+      background: #fff;
+    }
+
+    /*#endif*/
+
+    .head {
+      width: 100%;
+      height: 112rpx;
+      padding: 20rpx;
+      display: flex;
+      align-items: center;
+      background: #fff;
+      position: relative;
+      border-bottom: 1rpx solid #eeeeee;
+
+      .cuIcon-back {
+        font-size: 40rpx;
+        margin-right: 40rpx;
+      }
+
+      .case {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-weight: 500;
+        font-size: 38rpx;
+        color: #333333;
+      }
+    }
+  }
+
+  .order-card {
+    padding: 42rpx 31rpx 85rpx;
+    overflow: hidden;
+    background: #ffffff;
+  }
+}
+
+.order-header {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  .amount {
+    font-size: 63rpx;
+    color: #1f1f1f;
+  }
+
+  .title {
+    font-size: 28rpx;
+    color: #666666;
+    margin: 11rpx 0 42rpx;
+  }
+}
+
+.order-info {
+  .info {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding-bottom: 21rpx;
+
+    .label {
+      display: flex;
+      align-items: center;
+      font-weight: 400;
+      font-size: 31rpx;
+      color: #666666;
+      position: relative;
+
+      .tooltip {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 158rpx;
+        height: 42rpx;
+        background: rgba(0, 0, 0, 0.6);
+        border-radius: 4rpx 4rpx 4rpx 4rpx;
+        font-family: PingFang SC;
+        font-weight: 400;
+        font-size: 23rpx;
+        color: #ffffff;
+        margin-left: 10rpx;
+
+        &::after {
+          content: '';
+          position: absolute;
+          right: 158rpx;
+          bottom: 14rpx;
+          width: 0;
+          height: 0;
+          border-bottom: 10rpx solid transparent;
+          border-right: 10rpx solid rgba(0, 0, 0, 0.6);
+          border-top: 10rpx solid transparent;
+          border-left: 0;
+        }
+      }
+    }
+
+    .value {
+      font-size: 31rpx;
+      color: #333333;
+    }
+  }
+}
+
+.remark {
+  font-weight: 400;
+  font-size: 25rpx;
+  color: #666666;
+  margin-top: 10rpx;
+}
+</style>

pages/finance/settlementDetails.vue

@@ -0,0 +1,219 @@
+<template>
+  <view class="settle">
+    <view class="fix">
+      <view class="top"></view>
+      <view class="head">
+        <span class="cuIcon-back" @click="back"></span>
+        <view class="case"> 结算详情 </view>
+      </view>
+    </view>
+
+    <view class="settle-card">
+      <view class="settle-header">
+        <view class="amount">¥{{ settlementInfo.amountPayable }}</view>
+      </view>
+      <view class="settle-info">
+        <view class="info">
+          <view class="label">结算单号</view>
+          <view class="value">{{ settlementInfo.statementNumber }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">结算时间</view>
+          <view class="value">{{ settlementInfo.settlementTime }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">结算金额</view>
+          <view class="value">{{ settlementInfo.amountPayable }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">结算明细范围</view>
+          <view class="value"
+            >{{ settlementInfo.settlementScopeStartTime }} - {{ settlementInfo.settlementScopeEndTime }}</view
+          >
+        </view>
+
+        <view class="info">
+          <view class="label">操作人</view>
+          <view class="value">{{ settlementInfo.operator }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">结算状态</view>
+          <view class="value">{{ settlementInfo.settleStatusName }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">结算单据</view>
+          <view class="value">{{ settlementInfo.settlementVoucher }}</view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 订单列表 -->
+    <view class="list-card">
+      <OrderList :list="orderList"></OrderList>
+    </view>
+  </view>
+</template>
+
+<script>
+import api from '@/api/account';
+import OrderList from './components/order-list.vue';
+
+export default {
+  name: 'SettlementDetails',
+  components: {
+    OrderList,
+  },
+  data() {
+    return {
+      bizId: '',
+      // 结算信息
+      settlementInfo: {},
+      // 订单列表
+      orderList: [],
+    };
+  },
+  onLoad(options) {
+    if (options.id) {
+      this.bizId = options.id;
+    }
+  },
+  onShow() {
+    this.getDetails(this.bizId);
+  },
+  methods: {
+    getDetails(id) {
+      api
+        .settlementDetail(id)
+        .then((res) => {
+          if (res.data.code === 200) {
+            this.settlementInfo = res.data.result;
+            this.orderList = res.data.result.orderList || [];
+          } else {
+            uni.showToast({
+              title: res.data.msg || '获取结算详情失败',
+              icon: 'none',
+            });
+          }
+        })
+        .catch(() => {
+          uni.showToast({
+            title: '获取结算详情失败',
+            icon: 'none',
+          });
+        });
+    },
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.settle {
+  background: #f7f8fc;
+  min-height: 100vh;
+  font-family: Source Han Sans SC;
+  padding-bottom: 100rpx;
+
+  .fix {
+    position: sticky;
+    top: 0;
+    /*#ifdef APP-PLUS*/
+    .top {
+      width: 100%;
+      height: var(--status-bar-height);
+      background: #fff;
+    }
+
+    /*#endif*/
+
+    .head {
+      width: 100%;
+      height: 112rpx;
+      padding: 20rpx;
+      display: flex;
+      align-items: center;
+      background: #fff;
+      position: relative;
+      border-bottom: 1rpx solid #eeeeee;
+
+      .cuIcon-back {
+        font-size: 40rpx;
+        margin-right: 40rpx;
+      }
+
+      .case {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-weight: 500;
+        font-size: 38rpx;
+        color: #333333;
+      }
+    }
+  }
+
+  .settle-card {
+    background-color: #fff;
+    padding: 40rpx 31rpx 10rpx;
+  }
+}
+
+.settle-header {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  font-weight: 500;
+
+  .amount {
+    font-weight: 500;
+    font-size: 63rpx;
+    color: #1f1f1f;
+    margin-bottom: 41rpx;
+  }
+}
+.settle-info {
+  background-color: #fff;
+  margin-bottom: 20rpx;
+}
+
+.info {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-bottom: 21rpx;
+
+  &:last-child {
+    border-bottom: none;
+  }
+
+  .label {
+    font-weight: 400;
+    font-size: 31rpx;
+    color: #666666;
+  }
+
+  .value {
+    font-weight: 500;
+    font-size: 31rpx;
+    color: #333333;
+  }
+}
+
+.list-card {
+  height: 100%;
+  flex: 1;
+  overflow: hidden;
+  margin: 21rpx 31rpx;
+  background-color: #fff;
+}
+</style>

pages/finance/submitted.vue

@@ -0,0 +1,114 @@
+<template>
+  <view class="container">
+    <view class="top"></view>
+    <view class="head">
+      <span class="cuIcon-back" @click="goBack"></span>
+      <view class="case"> 已提交 </view>
+    </view>
+
+    <view class="content">
+      <image class="icon" src="/static/finance/status/success.png" />
+
+      <text class="title">提交成功</text>
+      <text class="desc">已提交审核，请耐心等待平台审核</text>
+
+      <view class="btn" @click="goBack">返回账户</view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goBack() {
+      uni.navigateTo({
+        url: '/pages/finance/balance',
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  width: 100vw;
+  height: 100vh;
+  overflow: auto;
+  background: #ffffff;
+  font-family: Source Han Sans SC;
+
+  /*#ifdef APP-PLUS*/
+  .top {
+    width: 100%;
+    height: var(--status-bar-height);
+    background: #fff;
+  }
+
+  /*#endif*/
+
+  .head {
+    width: 100%;
+    height: 112rpx;
+    padding: 20rpx;
+    display: flex;
+    align-items: center;
+    background: #fff;
+    position: relative;
+    border-bottom: 1rpx solid #eeeeee;
+
+    .cuIcon-back {
+      font-size: 40rpx;
+      margin-right: 40rpx;
+    }
+
+    .case {
+      position: absolute;
+      left: 50%;
+      transform: translateX(-50%);
+      font-weight: 500;
+      font-size: 38rpx;
+      color: #333333;
+    }
+  }
+
+  .content {
+    flex: 1;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+
+    .icon {
+      width: 104rpx;
+      height: 104rpx;
+      margin: 83rpx 0 21rpx;
+    }
+
+    .title {
+      font-weight: 500;
+      font-size: 50rpx;
+      color: #333333;
+      margin-bottom: 10rpx;
+    }
+
+    .desc {
+      font-weight: 400;
+      font-size: 29rpx;
+      color: #666666;
+      margin-bottom: 125rpx;
+    }
+
+    .btn {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 642rpx;
+      height: 79rpx;
+      background: linear-gradient(90deg, #4daeee 0%, #449aff 100%);
+      border-radius: 55rpx 55rpx 55rpx 55rpx;
+      font-weight: 500;
+      font-size: 29rpx;
+      color: #ffffff;
+    }
+  }
+}
+</style>

pages/finance/withdrawal.vue

@@ -0,0 +1,422 @@
+<template>
+  <view class="container">
+    <view class="fix">
+      <view class="top"></view>
+      <view class="head">
+        <span class="cuIcon-back" @click="back"></span>
+        <view class="case"> 申请提现 </view>
+      </view>
+    </view>
+
+    <view class="form-card">
+      <view class="section-input">
+        <view class="label">提现金额 <i class="text-bg"></i></view>
+        <view class="input-row">
+          <text class="currency-symbol">¥</text>
+          <u-input
+            type="digit"
+            height="80"
+            placeholder="请输入提现金额"
+            :customStyle="{
+              fontSize: '52rpx',
+              padding: '0 10rpx',
+            }"
+            v-model="withdrawalAmount"
+            @input="handleInput"
+          ></u-input>
+        </view>
+        <view v-if="isExceeded" class="error">输入金额超过可提现余额</view>
+
+        <view class="balance-info">
+          <text>可提现余额{{ availableAmount }}元，</text>
+          <text>手续费每笔{{ handlingFee }}元</text>
+          <text class="all-withdraw-btn" @click="allWithdraw">全部提现</text>
+        </view>
+      </view>
+    </view>
+
+    <view class="form-card">
+      <view class="label">账户信息 <i class="text-bg"></i></view>
+      <view class="bank-info">
+        <view class="bank-label">银行账户</view>
+        <view class="u-flex">
+          <u-image :src="bankCardInfo.bankLogo" width="42rpx" height="42rpx"></u-image>
+          <view class="bank-number">{{ bankCardInfo.bankName }}({{ bankCardInfo.bankCardNumber }})</view>
+        </view>
+      </view>
+    </view>
+
+    <view class="form-card">
+      <view class="u-flex justify-between">
+        <view class="title">开票信息<i class="text-bg"></i></view>
+        <view class="note">注：提现申请请上传开票凭证</view>
+      </view>
+      <view class="invoice-info">
+        <text class="title">发票抬头</text>
+        <text class="value">{{ invoiceInfo.companyName }}</text>
+      </view>
+      <view class="invoice-info">
+        <text class="title">纳税人识别号</text>
+        <text>{{ invoiceInfo.taxNo }}</text>
+      </view>
+      <view class="invoice-info">
+        <text class="title">地址电话</text>
+        <text class="value">{{ invoiceInfo.address }} {{ invoiceInfo.phone }}</text>
+      </view>
+      <view class="invoice-info last">
+        <text class="title">开户银行及账号</text>
+        <text class="value">{{ invoiceInfo.openingBank }} {{ invoiceInfo.bankAccount }}</text>
+      </view>
+    </view>
+
+    <view class="form-card">
+      <view class="label"><text class="required">*</text>上传发票 <i class="text-bg"></i></view>
+      <u-upload
+        ref="uUpload"
+        :action="action"
+        :file-list="billList"
+        @on-success="handleSuccess"
+        @on-remove="handleRemove"
+        @on-choose-complete="onChooseComplete"
+        max-count="5"
+        multiple
+        previewFullImage
+        :auto-upload="true"
+        customBtn
+        width="146rpx"
+        height="146rpx"
+      >
+        <template slot="addBtn">
+          <image src="/static/coupon/upload.png" mode="widthFix" style="width: 146rpx; height: 146rpx"></image>
+        </template>
+      </u-upload>
+    </view>
+    <view class="footer-bar">
+      <u-button
+        type="primary"
+        :disabled="!withdrawalAmount || parseFloat(withdrawalAmount) <= 0 || isExceeded"
+        @click="applyWithdrawal"
+        >申请提现</u-button
+      >
+    </view>
+  </view>
+</template>
+
+<script>
+import api from '@/api/account';
+import configService from '@/common/service/config.service';
+import { formatAmount } from '@/common/util/util';
+
+export default {
+  data() {
+    return {
+      formatAmount,
+      action: configService.apiUrl + '/sys/common/upload',
+      imageHttp: configService.apiUrl + '/',
+      billList: [], //发票回显
+      uploadedFiles: [], //已上传文件列表
+      bankCard: {},
+      availableAmount: '', // 当前可提现余额
+      handlingFee: 0, // 手续费
+      withdrawalAmount: '', // 提现金额输入框的值
+      isExceeded: false, // 是否超过可提现余额
+      bankCardInfo: {}, // 银行卡信息
+      invoiceInfo: {}, // 开票信息
+    };
+  },
+  watch: {
+    withdrawalAmount(newVal, oldVal) {
+      // 检查金额是否超过可提现余额
+      if (parseFloat(newVal) > parseFloat(this.availableAmount)) {
+        this.isExceeded = true;
+      } else {
+        this.isExceeded = false;
+      }
+    },
+  },
+  onShow() {
+    this.init();
+  },
+  formatAmount,
+  methods: {
+    // 初始化提现数据
+    async init() {
+      const res = await api.initWithdrawalData();
+      if (res.data.code === 200 && res.data.result) {
+        const data = res.data.result;
+        this.availableAmount = data.availableAmount;
+        this.handlingFee = data.handlingFee;
+        this.bankCardInfo = data.bankCardInfo;
+        this.invoiceInfo = data.invoiceInfo;
+      }
+    },
+    handleInput(val) {
+      if (!val) {
+        this.withdrawalAmount = '';
+        return;
+      }
+      /// 保留2位小数
+      val = val.replace(/(\.\d{2})\d+/g, '$1');
+      // 处理前导0
+      val = val.replace(/^0+(?=\d)/, '');
+
+      this.$nextTick(() => {
+        this.withdrawalAmount = val;
+      });
+    },
+    // 上传发票
+    handleSuccess(res) {
+      if (res.code === 0) {
+        this.uploadedFiles.push(this.imageHttp + res.message);
+        console.log(this.uploadedFiles);
+      } else {
+        uni.showToast({
+          title: '上传失败: ' + res.message,
+          icon: 'none',
+        });
+      }
+    },
+    // 移除图片
+    handleRemove(index) {
+      this.uploadedFiles.splice(index, 1);
+    },
+    // 选择图片
+    onChooseComplete(lists) {
+      this.billList = lists;
+    },
+    // 全部提现
+    allWithdraw() {
+      this.withdrawalAmount = this.availableAmount;
+    },
+    // 申请提现
+    applyWithdrawal() {
+      if (!this.uploadedFiles.length) {
+        uni.showToast({
+          title: '请上传发票',
+          icon: 'none',
+        });
+        return;
+      }
+      uni.showLoading({ title: '提交中' });
+      api
+        .applyWithdrawal({
+          applyAmount: this.withdrawalAmount,
+          bankCardId: this.bankCardInfo.bankCardId,
+          handlingFee: this.handlingFee,
+          invoiceImgs: this.uploadedFiles,
+        })
+        .then((res) => {
+          if (res.data.code === 200) {
+            uni.hideLoading();
+            uni.showToast({ title: '提现申请成功', icon: 'success' });
+            setTimeout(() => {
+              uni.navigateTo({
+                url: '/pages/finance/submitted',
+              });
+            }, 1500);
+          }else {
+            uni.hideLoading();
+            uni.showToast({ title: res.data.message, icon: 'none' });
+          }
+        });
+    },
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  min-height: 100vh;
+  background-color: #f7f8fc;
+  font-family: Source Han Sans SC;
+  font-weight: 400;
+  padding-bottom: 120rpx;
+
+  .fix {
+    position: sticky;
+    top: 0;
+    /*#ifdef APP-PLUS*/
+    .top {
+      width: 100%;
+      height: var(--status-bar-height);
+      background: #fff;
+    }
+
+    /*#endif*/
+
+    .head {
+      width: 100%;
+      height: 112rpx;
+      padding: 20rpx;
+      display: flex;
+      align-items: center;
+      background: #fff;
+      position: relative;
+      border-bottom: 1rpx solid #eeeeee;
+
+      .cuIcon-back {
+        font-size: 40rpx;
+        margin-right: 40rpx;
+      }
+
+      .case {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-weight: 500;
+        font-size: 38rpx;
+        color: #333333;
+      }
+    }
+  }
+
+  .form-card {
+    background-color: #fff;
+    padding: 30rpx;
+    margin-bottom: 30rpx;
+    padding: 17rpx 31rpx 21rpx;
+    box-shadow: 0rpx 2rpx 8rpx 0rpx rgba(214, 225, 237, 0.1);
+
+    .label {
+      font-size: 30rpx;
+      color: #333333;
+      margin-bottom: 21rpx;
+
+      .text-bg {
+        width: 120rpx;
+      }
+    }
+  }
+}
+
+// 提现至：银行卡选择区域
+.section-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 30rpx 0;
+  border-bottom: 1rpx solid #eee;
+
+  .label {
+    font-weight: 500;
+    font-size: 31rpx;
+    color: #333333;
+  }
+
+  .content {
+    display: flex;
+    align-items: center;
+  }
+}
+
+// 提现金额输入区域
+.section-input {
+  .input-row {
+    display: flex;
+    align-items: center;
+    padding: 20rpx 0;
+    border-bottom: 1rpx solid #eee;
+
+    .currency-symbol {
+      font-weight: bold;
+      font-size: 54rpx;
+      color: #333333;
+      padding-right: 23rpx;
+    }
+  }
+
+  .error {
+    text-align: right;
+    font-size: 25rpx;
+    color: #e55e4f;
+  }
+
+  .balance-info {
+    font-size: 26rpx;
+    color: rgba(51, 51, 51, 0.6);
+    margin-top: 16rpx;
+    font-family: Source Han Sans CN;
+
+    .all-withdraw-btn {
+      font-size: 27rpx;
+      color: #2d4d89;
+      margin-left: 10rpx;
+
+      &:active {
+        opacity: 0.8;
+      }
+    }
+  }
+}
+
+// 银行信息
+.bank-info {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 44rpx;
+
+  .bank-label {
+    font-size: 29rpx;
+    color: #666666;
+  }
+
+  .bank-number {
+    padding: 0 0 5rpx 2rpx;
+    font-size: 31rpx;
+    color: #333333;
+  }
+}
+
+// 开票信息区域
+.note {
+  font-size: 27rpx;
+  color: #999999;
+  margin-bottom: 26rpx;
+}
+
+.invoice-info {
+  padding: 21rpx 0;
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 1rpx solid #eeeeee;
+
+  .title {
+    font-size: 29rpx;
+    color: #666666;
+  }
+
+  .value {
+    font-size: 31rpx;
+    color: #333333;
+    max-width: 450rpx;
+    text-align: right;
+  }
+}
+
+.last {
+  border-bottom: none;
+}
+
+.required {
+  color: #ff4d4f;
+}
+
+// 底部按钮
+.footer-bar {
+  ::v-deep .u-btn {
+    width: 100%;
+    height: 76rpx;
+    border-radius: 54rpx;
+    background: linear-gradient(90deg, #77b6ff 0%, #449aff 100%);
+    &.u-btn--primary--disabled {
+      background: #a0cfff;
+    }
+  }
+}
+</style>

pages/finance/withdrawalDetails.vue

@@ -0,0 +1,280 @@
+<template>
+  <view class="cash">
+    <view class="top"></view>
+    <view class="head">
+      <span class="cuIcon-back" @click="back"></span>
+      <view class="case"> 提现详情 </view>
+    </view>
+
+    <view class="cash-card">
+      <view class="cash-header">
+        <view class="img">
+          <image :src="`/static/finance/status/${reviewIcon}.png`" mode="aspectFit"></image>
+        </view>
+        <view class="amount">-¥{{ cashInfo.applyAmount }}</view>
+        <view class="title">{{ cashInfo.statusName }}</view>
+      </view>
+      <view class="cash-info">
+        <view class="info">
+          <view class="label">申请时间</view>
+          <view class="value">{{ cashInfo.applyTime }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">申请人</view>
+          <view class="value">{{ cashInfo.applicantName }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">审批时间</view>
+          <view class="value">{{ cashInfo.auditTime }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">审批人</view>
+          <view class="value">{{ cashInfo.auditByName }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">订单号</view>
+          <view class="value">{{ cashInfo.withdrawNo }}</view>
+        </view>
+
+        <view class="info">
+          <view class="label">发票</view>
+          <view class="value view-btn" @click="openInvoicePopup">查看</view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 查看发票弹窗 -->
+    <u-popup v-model="showInvoicePopup" mode="center" :round="20" closeable>
+      <view class="invoice-popup">
+        <view class="invoice-slider">
+          <swiper
+            :current="currentIndex"
+            @change="onSwiperChange"
+            circular
+            indicator-dots
+            indicator-color="#ffffff"
+            indicator-active-color="#ff0000"
+          >
+            <swiper-item v-for="(item, index) in cashInfo.invoiceImgs" :key="index">
+              <view class="invoice-item">
+                <image :src="item" mode="aspectFit"></image>
+              </view>
+            </swiper-item>
+          </swiper>
+        </view>
+      </view>
+    </u-popup>
+  </view>
+</template>
+
+<script>
+import api from '@/api/account';
+
+export default {
+  name: 'cashDetails',
+  data() {
+    return {
+      bizId: '',
+      cashInfo: {},
+      showInvoicePopup: false,
+      reviewIcon: 'processing',
+      currentIndex: 0,
+    };
+  },
+  onLoad(options) {
+    if (options.id) {
+      this.bizId = options.id;
+    }
+  },
+  onShow() {
+    this.getCashDetails(this.bizId);
+  },
+  methods: {
+    getCashDetails(bizId) {
+      api.getWithdrawalDetails(bizId).then((res) => {
+        if (res.data.code === 200) {
+          this.cashInfo = res.data.result;
+          switch (this.cashInfo.statusName) {
+            case '提现成功':
+              this.reviewIcon = 'success';
+              break;
+            case '提现失败':
+              this.reviewIcon = 'fail';
+              break;
+            case '审核中':
+              this.reviewIcon = 'processing';
+              break;
+          }
+        }
+      });
+    },
+    back() {
+      uni.navigateBack();
+    },
+    openInvoicePopup() {
+      this.showInvoicePopup = true;
+    },
+    onSwiperChange(e) {
+      this.currentIndex = e.detail.current;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.cash {
+  background: #f8f8f8;
+  min-height: 100vh;
+  font-weight: 500;
+
+  /*#ifdef APP-PLUS*/
+  .top {
+    width: 100%;
+    height: var(--status-bar-height);
+    background: #fff;
+  }
+
+  /*#endif*/
+
+  .head {
+    width: 100%;
+    height: 112rpx;
+    padding: 20rpx;
+    display: flex;
+    align-items: center;
+    background: #fff;
+    position: relative;
+    border-bottom: 1rpx solid #eeeeee;
+
+    .cuIcon-back {
+      font-size: 40rpx;
+      margin-right: 40rpx;
+    }
+
+    .case {
+      position: absolute;
+      left: 50%;
+      transform: translateX(-50%);
+      font-weight: 500;
+      font-size: 38rpx;
+      color: #333333;
+    }
+  }
+
+  .cash-card {
+    border-radius: 10rpx;
+    overflow: hidden;
+    padding: 50rpx 32rpx 0;
+    background: #fff;
+  }
+}
+
+.cash-header {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background-color: #ffffff;
+
+  image {
+    width: 88rpx;
+    height: 88rpx;
+  }
+
+  .amount {
+    font-size: 60rpx;
+    color: #1f1f1f;
+    margin: 30rpx 0 20rpx;
+  }
+
+  .title {
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #666666;
+    margin-bottom: 40rpx;
+  }
+}
+
+.cash-info {
+  background-color: #fff;
+  padding: 0 30rpx;
+}
+
+.info {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-bottom: 30rpx;
+  font-size: 30rpx;
+
+  .label {
+    display: flex;
+    align-items: center;
+    font-weight: 400;
+    color: #666666;
+    line-height: 30rpx;
+  }
+
+  .value {
+    font-family: Source Han Sans SC;
+    font-weight: 500;
+    font-size: 30rpx;
+    color: #333333;
+  }
+
+  .view-btn {
+    color: #449aff;
+  }
+}
+
+/* 发票弹窗样式 */
+.invoice-popup {
+  width: 100vw;
+  height: 100vh;
+  background: #000000;
+  border-radius: 10rpx;
+  padding: 20rpx;
+  position: relative;
+}
+
+.close-btn {
+  position: absolute;
+  top: 10rpx;
+  right: 10rpx;
+  width: 40rpx;
+  height: 40rpx;
+  z-index: 10;
+}
+
+.close-btn image {
+  width: 100%;
+  height: 100%;
+}
+
+.invoice-slider {
+  width: 100%;
+  margin-top: 50%;
+}
+
+.invoice-item {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+::v-deep {
+  uni-swiper .uni-swiper-wrapper {
+    width: 100vw;
+    height: 100vh;
+  }
+
+  uni-swiper .uni-swiper-dots-horizontal {
+    bottom: 50%;
+}
+}
+</style>