商家月度流水统计

src/pages.json

@@ -359,6 +359,17 @@
 				}
 			]
 		},
+		{
+			"root": "pages/water",
+			"pages": [
+				{
+					"path": "waterTotal",
+					"style": {
+						"navigationBarTitleText": "月度流水统计"
+					}
+				}
+			]
+		},
 		{
 			"root": "pages/integrated",
 			"pages": [

src/pages/tabbar/flowStatistics.vue

@@ -16,24 +16,27 @@
 		>
 			<template #top>
 				<view class="h-30rpx" />
-				<view class="bg-white rounded-12rpx p-20rpx flex justify-between items-center">
-					<text class="text-30 font-600">流水统计</text>
-					<tm-text color="#999999">{{ formatVal }}</tm-text>
-					<view class="flex items-center cursor-pointer">
-						<tm-between-time
-							start="2020-1-1"
-							end="2050-1-1"
-							v-model="state.date"
-							v-model:model-str="state.formatVal"
-							@confirm="datePickerConfirm"
-							format="YYYY-MM-DD"
-							:quickDate="[]"
-							:drawerSize="900"
-						>
-							<image class="w-[30rpx] h-[30rpx]" src="@/static/page/filter.svg" />
-							<text class="ml-1 text-30">筛选</text>
-						</tm-between-time>
+				<view class="flex items-center justify-between">
+					<view class="flex-1 bg-white rounded-12rpx p-20rpx flex justify-between items-center">
+						<text class="text-30 font-600">流水统计</text>
+						<tm-text color="#999999" font-size="26">{{ formatVal }}</tm-text>
+						<view class="flex items-center cursor-pointer">
+							<tm-between-time
+								start="2020-1-1"
+								end="2050-1-1"
+								v-model="state.date"
+								v-model:model-str="state.formatVal"
+								@confirm="datePickerConfirm"
+								format="YYYY-MM-DD"
+								:quickDate="[]"
+								drawerSize="900"
+							>
+								<image class="w-[30rpx] h-[30rpx]" src="@/static/page/filter.svg" />
+								<text class="ml-1 text-30">筛选</text>
+							</tm-between-time>
+						</view>
 					</view>
+					<tm-button size="m" class="px-1 ml-1" @click="doWaterTotal">月度流水</tm-button>
 				</view>
 			</template>
 
@@ -97,7 +100,7 @@ const state = reactive<any>({
 		createTimeList: [],
 	},
 	formatVal: "",
-	date: "",
+	date: [],
 })
 const formatVal = computed(() => (state.date.length === 2 ? state.formatVal : ""))
 const pageHook = hooks.usePage(pageRef, flowStatisticsApi.page, null, "data")
@@ -112,7 +115,6 @@ onShow(() => {
 	if (pageRef.value) {
 		pageRef.value.reload(false)
 	}
-	// getTotalWatar()
 })
 
 const query = (page: number, pagesize: number) => {
@@ -127,10 +129,10 @@ const datePickerConfirm = (date: any) => {
 	pageRef.value.reload(false)
 }
 
-// 查询全部流水
-// const getTotalWatar = async () => {
-// 	const res: any = await flowStatisticsApi.mchWaterTotal()
-// 	if (res.code == 0) {
-// 	}
-// }
+// 月度流水
+const doWaterTotal = () => {
+	uni.navigateTo({
+		url: "/pages/water/waterTotal",
+	})
+}
 </script>

src/pages/water/waterTotal.vue

@@ -0,0 +1,142 @@
+<template>
+	<crud-layout bg="/static/page/blue-bg.png">
+		<z-paging
+			ref="pageRef"
+			:fixed="false"
+			height="100%"
+			safe-area-inset-bottom
+			:loading-more-enabled="true"
+			:show-scrollbar="false"
+			:auto-clean-list-when-reload="false"
+			:auto-scroll-to-top-when-reload="false"
+		>
+			<template #top>
+				<view class="h-30rpx" />
+				<view class="bg-white rounded-12rpx p-20rpx flex justify-between items-center">
+					<text class="text-30 font-600">月度流水统计</text>
+					<tm-text color="#999999" font-size="26">{{ formatVal }}</tm-text>
+					<view class="flex items-center cursor-pointer">
+						<tm-between-time
+							type="month"
+							start="2020-1-1"
+							end="2050-1-1"
+							v-model="state.date"
+							v-model:model-str="state.formatVal"
+							@confirm="datePickerConfirm"
+							format="YYYY-MM"
+							:quickDate="[]"
+							drawerSize="900"
+						>
+							<image class="w-[30rpx] h-[30rpx]" src="@/static/page/filter.svg" />
+							<text class="ml-1 text-30">筛选</text>
+						</tm-between-time>
+					</view>
+				</view>
+			</template>
+
+			<view class="h-20rpx" />
+
+			<view v-if="state.waterData.merchantId" class="bg-white rounded-16rpx p-3 mb-2 shadow-md">
+				<view class="flex justify-between items-center text-sm text-gray-800 mb-1">
+					<view class="flex items-center">
+						<image class="w-50rpx h-50rpx rounded-8rpx" :src="filePath(state.waterData.logoPic)" mode="aspectFill" />
+						<view class="ml-2">{{ state.waterData.merchantName }}</view>
+					</view>
+					<view>{{ state.waterData.day }}</view>
+				</view>
+				<view class="bg-gray-100 rounded-12rpx p-2">
+					<view class="flex justify-between mb-2">
+						<view class="flex-1 flex items-center p-2 bg-white rounded-8rpx">
+							<text class="flex-1 text-sm text-center text-gray-600">流水金额</text>
+							<text class="flex-1 text-sm text-center text-gray-800">¥ {{ hooks.useMoney(state.waterData.totalPayPrice) }}</text>
+						</view>
+						<view class="flex-1 flex items-center p-2 bg-white rounded-8rpx ml-2">
+							<text class="flex-1 text-sm text-center text-gray-600">流水次数</text>
+							<text class="flex-1 text-sm text-center text-gray-800">{{ state.waterData.totalPayCount || 0 }}</text>
+						</view>
+					</view>
+					<view class="flex justify-between mb-2">
+						<view class="flex-1 flex items-center p-2 bg-white rounded-8rpx">
+							<text class="flex-1 text-sm text-center text-gray-600">盈利金额</text>
+							<text class="flex-1 text-sm text-center text-green-500">¥ {{ hooks.useMoney(state.waterData.totalProfitPrice) }}</text>
+						</view>
+						<view class="flex-1 flex items-center p-2 bg-white rounded-8rpx ml-2">
+							<text class="flex-1 text-sm text-center text-gray-600">盈利次数</text>
+							<text class="flex-1 text-sm text-center text-green-500">{{ state.waterData.totalProfitCount || 0 }}</text>
+						</view>
+					</view>
+					<view class="flex justify-between mb-0">
+						<view class="flex-1 flex items-center p-2 bg-white rounded-8rpx">
+							<text class="flex-1 text-sm text-center text-gray-600">退款金额</text>
+							<text class="flex-1 text-sm text-center text-red-500">¥ {{ hooks.useMoney(state.waterData.totalRefundPrice) }}</text>
+						</view>
+						<view class="flex-1 flex items-center p-2 bg-white rounded-8rpx ml-2">
+							<text class="flex-1 text-sm text-center text-gray-600">退款次数</text>
+							<text class="flex-1 text-sm text-center text-red-500">{{ state.waterData.totalRefundCount || 0 }}</text>
+						</view>
+					</view>
+				</view>
+			</view>
+		</z-paging>
+	</crud-layout>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, computed } from "vue"
+import { onLoad, onShow } from "@dcloudio/uni-app"
+import { hooks } from "@@/index"
+import { filePath } from "@@/utils/file"
+import { flowStatisticsApi } from "@@/api"
+
+const pageRef = ref<any>(null)
+const state = reactive<any>({
+	pa: {
+		createTimeList: [hooks.useTime(new Date(), "{y}-{m}-{d}"), hooks.useTime(new Date(), "{y}-{m}-{d}")],
+	},
+	formatVal: "",
+	date: [hooks.useTime(new Date(), "{y}-{m}"), hooks.useTime(new Date(), "{y}-{m}")],
+	waterData: {},
+})
+const formatVal = computed(() => (state.date.length === 2 ? state.formatVal : ""))
+
+onLoad(() => {
+	const app = getApp()
+	app._initTabbar()
+})
+onShow(() => {
+	const isLogin = hooks.useCheckLogin()
+	if (!isLogin) return
+	getWaterTotalData()
+})
+
+const getWaterTotalData = async () => {
+	const isLogin = hooks.useStaticCheckLogin()
+	if (!isLogin) return
+
+	try {
+		uni.showLoading({ title: "加载中", mask: true })
+		const res: any = await flowStatisticsApi.mchWaterTotal({
+			createTimeList: state.pa.createTimeList,
+		})
+		if (res.code == 0) {
+			state.waterData = res.data
+			uni.hideLoading()
+		} else {
+			state.waterData = {}
+			uni.showToast({ title: res.msg, icon: "none" })
+		}
+	} catch (error: any) {
+		uni.showToast({ title: error.msg, icon: "none" })
+	}
+}
+
+// 时间范围选择器确认
+const datePickerConfirm = (date: any) => {
+	if (!formatVal.value) return
+	state.pa.createTimeList = formatVal.value.split("~").map((v: any) => {
+		return v + "-01"
+	})
+	getWaterTotalData()
+	console.log(state.waterData)
+}
+</script>