From 9821d970a3dafbd2197ced939aadfeb6ceb0b776 Mon Sep 17 00:00:00 2001
From: duan <1004387497@qq.com>
Date: Fri, 13 Sep 2024 14:56:53 +0800
Subject: [PATCH] =?UTF-8?q?=E9=94=80=E5=94=AE=E7=BB=9F=E8=AE=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 http/businessHttp.js                          |  12 +-
 http/yskApi/requestAll.js                     |  20 +
 pageConsumables/index.vue                     | 269 +++++++++++
 pageConsumables/inventoryCheck.vue            | 149 ++++++
 pageConsumables/outbound.vue                  | 168 +++++++
 pageConsumables/warehouseEntry.vue            | 168 +++++++
 .../components/my-date-pickerview.vue         | 448 ++++++++++++++++++
 pageSalesSummary/index.vue                    | 346 ++++++++++++--
 pageSalesSummary/productSalesRanking.vue      |  87 ++++
 pageSalesSummary/svg/bgimg.svg                |  80 ++++
 pages.json                                    |  42 +-
 pages/index/index.vue                         |   5 +
 12 files changed, 1760 insertions(+), 34 deletions(-)
 create mode 100644 http/yskApi/requestAll.js
 create mode 100644 pageConsumables/index.vue
 create mode 100644 pageConsumables/inventoryCheck.vue
 create mode 100644 pageConsumables/outbound.vue
 create mode 100644 pageConsumables/warehouseEntry.vue
 create mode 100644 pageSalesSummary/components/my-date-pickerview.vue
 create mode 100644 pageSalesSummary/productSalesRanking.vue
 create mode 100644 pageSalesSummary/svg/bgimg.svg

diff --git a/http/businessHttp.js b/http/businessHttp.js
index bef368b..2938964 100644
--- a/http/businessHttp.js
+++ b/http/businessHttp.js
@@ -2,12 +2,12 @@
  * 因为两个小程序接口不一致，餐饮商超商家端的接口使用该http
  */
 import useStorage from '@/commons/utils/useStroage.js'
-
+import go from '@/commons/utils/go.js';
 // const baseURL = 'http://192.168.2.128:9000/cashierService'
 // const baseURL = 'http://192.168.2.41:9888/cashierService'
 let baseURL = 'https://wxcashiertest.sxczgkj.cn/cashierService'
 // #ifdef H5
-baseURL = '/shopApi'
+baseURL = '/ysk'
 // #endif
 // const baseURL = 'https://cashier.sxczgkj.cn/cashierService'
 export default function(api = '', data = {}, method = 'GET') {
@@ -20,7 +20,8 @@ export default function(api = '', data = {}, method = 'GET') {
 				'environment': 'wx',
 				'type': 'ios',
 				'version': '1.0.0',
-				'token': useStorage.get('token'),
+				'token': useStorage.get('iToken'),
+				'Authorization': useStorage.get('iToken'),
 				'Content-Type': 'application/json'
 			},
 			success: res => {
@@ -31,6 +32,11 @@ export default function(api = '', data = {}, method = 'GET') {
 						icon: 'none',
 						"title": res.data.msg
 					})
+					if(res.data.code==-4){
+						setTimeout(()=>{
+							go.to('PAGES_LOGIN', {}, 'redirect')
+						},2000)
+					}
 					reject(res.data.msg)
 				}
 			},
diff --git a/http/yskApi/requestAll.js b/http/yskApi/requestAll.js
new file mode 100644
index 0000000..daa329c
--- /dev/null
+++ b/http/yskApi/requestAll.js
@@ -0,0 +1,20 @@
+import http from './http.js'
+const request = http.request
+// 销售总会list
+export function summaryTrade(data) {
+	return request({
+		url: '/api/summary/trade',
+		method: 'post',
+		data: {
+			...data
+		}
+	})
+}
+// 销售排行榜
+export function dateProduct(params) {
+	return request({
+		url: '/api/summary/dateProduct',
+		method: 'get',
+		params
+	})
+}
\ No newline at end of file
diff --git a/pageConsumables/index.vue b/pageConsumables/index.vue
new file mode 100644
index 0000000..a8ad785
--- /dev/null
+++ b/pageConsumables/index.vue
@@ -0,0 +1,269 @@
+<template>
+	<view class="ConsumablesTop">
+		<view>
+			货品类别
+		</view>
+		<view>
+			搜索货品ID/货品编码
+		</view>
+		<view>
+			新增类别
+		</view>
+	</view>
+	<ul class="ConsumablesConent">
+		<li>
+			<view>
+				吸管 <view> 分类 </view>
+			</view>
+			<view>
+				<view>
+					<view style="color: #333333;">
+						根
+					</view>
+					<view>
+						耗材单位
+					</view>
+				</view>
+				<view>
+					<view style="color: #318AFE;">
+						根
+					</view>
+					<view>
+						耗材单位
+					</view>
+				</view>
+			</view>
+			<view>
+				<view class="">
+					已绑定商品(10)
+				</view>
+				<view class="">
+					<up-button type="primary" color="#999" :plain="true" text="查看记录"></up-button>
+					<up-button type="primary" @click="toggle" :plain="true" text="更多操作"></up-button>
+				</view>
+			</view>
+		</li>
+	</ul>
+	<view class="ConsumablesBottom">
+		<view class="">
+			新增耗材
+		</view>
+		<view class="">
+			供应商管理
+		</view>
+	</view>
+	<my-action-sheet @itemClick="sheetClick" ref="refMoreSheet" :list="actionSheet.list"></my-action-sheet>
+</template>
+
+<script setup>
+	import myActionSheet from '@/components/my-components/my-action-sheet';
+	import {
+		ref,
+		reactive
+	} from 'vue';
+	import go from '@/commons/utils/go.js';
+	let refMoreSheet = ref(null)
+	const actionSheet = reactive({
+		list: ['报损', '编辑', '清点', '入库', '出库']
+	})
+	let toggle = () => {
+		refMoreSheet.value.open()
+	}
+	let sheetClick = (index) => {
+		console.log(index)
+		if (index == 0) {} else if (index == 1) {
+
+		} else if (index == 2) {
+			toUrl('PAGES_SALES_INVENTORYCHECK')
+		} else if (index == 3) {
+			toUrl('PAGES_SALES_WAREHOUSEENTRY')
+		} else if (index == 4) {
+			toUrl('PAGES_SALES_OUTBOUND')
+		}
+	}
+
+	let toUrl = (url) => {
+		go.to(url)
+	}
+</script>
+
+<style scoped lang="less">
+	page{
+		background-color: #f9f9f9;
+	}
+	ul,
+	li {
+		list-style: none;
+		padding: 0;
+	}
+
+	.ConsumablesTop {
+		display: flex;
+		justify-content: space-around;
+		align-items: center;
+		padding-bottom: 22rpx;
+
+		>view:first-child,
+		>view:last-child {
+			font-size: 24rpx;
+			font-family: Source Han Sans CN, Source Han Sans CN;
+			font-weight: 500;
+			color: #333333;
+		}
+
+		>view:last-child {
+			color: #318AFE;
+		}
+
+		>view:nth-child(2) {
+			width: 414rpx;
+			height: 60rpx;
+			line-height: 60rpx;
+			background: #F9F9F9;
+			border-radius: 32rpx 32rpx 32rpx 32rpx;
+
+			font-family: Source Han Sans CN, Source Han Sans CN;
+			font-weight: 400;
+			font-size: 28rpx;
+			color: #999999;
+
+		}
+	}
+
+	.ConsumablesConent {
+		min-height: 80vh;
+		background-color: #f9f9f9;
+		padding-top: 1rpx;
+
+		>li {
+			width: 694rpx;
+			height: 332rpx;
+			background: #FFFFFF;
+			border-radius: 10rpx 10rpx 10rpx 10rpx;
+			padding: 32rpx 16rpx;
+			box-sizing: border-box;
+			margin: 32rpx auto;
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+
+			>view:first-child {
+				font-family: Source Han Sans CN, Source Han Sans CN;
+				font-weight: 500;
+				font-size: 24rpx;
+				color: #333333;
+				.df;
+
+				>view {
+					width: 90rpx;
+					height: 36rpx;
+					line-height: 36rpx;
+					background: #EBF4FC;
+					border-radius: 4rpx 4rpx 4rpx 4rpx;
+					text-align: center;
+					font-family: Source Han Sans CN, Source Han Sans CN;
+					font-weight: 400;
+					font-size: 24rpx;
+					color: #318AFE;
+					margin-left: 12rpx;
+				}
+			}
+
+			>view:nth-child(2) {
+				width: 662rpx;
+				height: 128rpx;
+				background: #F9F9F9;
+				border-radius: 12rpx 12rpx 12rpx 12rpx;
+				.df;
+				justify-content: space-around;
+				text-align: center;
+
+				font-family: Source Han Sans CN, Source Han Sans CN;
+				font-weight: 400;
+				font-size: 24rpx;
+				color: #666666;
+			}
+
+			>view:last-child {
+				.df;
+				justify-content: space-between;
+
+				>view:last-child {
+					.df;
+
+					>button {
+						width: 128rpx;
+						height: 48rpx;
+						background: #FFFFFF;
+						border-radius: 28rpx 28rpx 28rpx 28rpx;
+					}
+
+					>button:last-child {
+						margin-left: 24rpx;
+					}
+				}
+			}
+		}
+	}
+
+	.ConsumablesBottom {
+		.df;
+		position: fixed;
+		bottom: 20rpx;
+		left: 50%;
+		transform: translateX(-50%);
+
+		>view {
+			width: 346rpx;
+			height: 80rpx;
+			line-height: 80rpx;
+			text-align: center;
+			border: 2rpx solid #318AFE;
+
+			font-family: Source Han Sans CN, Source Han Sans CN;
+			font-weight: 500;
+			font-size: 32rpx;
+		}
+
+		>view:first-child {
+			border-radius: 56rpx 0rpx 0rpx 56rpx;
+			color: #318AFE;
+		}
+
+		>view:last-child {
+			border-radius: 0 56rpx 56rpx 0;
+			background-color: #318AFE;
+			color: #fff;
+		}
+	}
+
+	.popup-content {
+		padding: 15px;
+		background-color: #fff;
+		margin: 0 auto;
+
+		>view {
+			height: 88rpx;
+			line-height: 88rpx;
+			width: 660rpx;
+			border-top: 10rpx solid #f9f9f9;
+			text-align: center;
+		}
+
+		.operate {
+			>li {
+				height: 88rpx;
+				line-height: 88rpx;
+				text-align: center;
+				width: 660rpx;
+				border-bottom: 2rpx solid #E5E5E5;
+
+			}
+		}
+	}
+
+	.df() {
+		display: flex;
+		align-items: center;
+	}
+</style>
\ No newline at end of file
diff --git a/pageConsumables/inventoryCheck.vue b/pageConsumables/inventoryCheck.vue
new file mode 100644
index 0000000..ea1be64
--- /dev/null
+++ b/pageConsumables/inventoryCheck.vue
@@ -0,0 +1,149 @@
+<template>
+	<view class="warehouseEntry">
+		<ul>
+			<li>
+				<view>
+					耗材名称
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li>
+				<view>
+					账户库存
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li>
+				<view>
+					实际数量
+				</view>
+				<view>
+					<input type="text" placeholder="输入数量" name="" id="">
+				</view>
+			</li>
+			<li>
+				<view>
+					总盈亏
+				</view>
+				<view>
+					<input type="text" placeholder="输入总价值(元)" name="" id="">
+				</view>
+			</li>
+		</ul>
+		<view :style="{height:showStatus?statusHeight:0}" class="tranistion status  overflow-hide">
+			<view @tap="changeNowStatusIndex(index)" class="u-flex u-p-l-30 lh30 u-p-r-30 u-row-between"
+				v-for="(item,index) in status" :key="index">
+				<view :class="{'color-main':nowStatusIndex===index}">{{item}}</view>
+				<uni-icons v-if="nowStatusIndex===index" type="checkmarkempty" :color="color.ColorMain"></uni-icons>
+			</view>
+			<view :style="{height: '14px'}"></view>
+		</view>
+	</view>
+	<view class="bottombutton">
+		<up-button type="primary" style="background-color:  #318AFE;color: #fff;" @tap="toggle" :plain="true"
+			text="保存"></up-button>
+		<up-button type="text" style="background-color:  #f9f9f9;color: #999;" @tap="toggle" :plain="true"
+			text="取消"></up-button>
+	</view>
+</template>
+
+
+<script setup>
+	import {
+		ref,
+		computed
+	} from 'vue';
+	import color from '@/commons/color.js';
+	let showStatus = ref(false)
+
+	function showStatusToggle() {
+		showStatus.value = !showStatus.value
+	}
+	let nowStatusIndex = ref(0)
+
+	function changeNowStatusIndex(i) {
+		nowStatusIndex.value = i
+		showStatus.value = false
+	}
+	const status = ['开多钱', '好像上次', '海峡市场']
+	const statusHeight = computed(() => {
+		return 30 * status.length + 14 + 'px'
+	})
+</script>
+
+<style scoped lang="less">
+	page {
+		background-color: #f9f9f9;
+	}
+
+	.df() {
+		display: flex;
+		align-items: center;
+	}
+
+	ul,
+	li {
+		list-style: none;
+		padding: 0;
+	}
+
+	.status {
+		margin: 0 32rpx;
+		position: absolute;
+	 
+		left: 0;
+		right: 0;
+		z-index: 10;
+		background-color: #fff;
+	}
+
+	.warehouseEntry {
+		width: 694rpx;
+		height: 496rpx;
+		background: #FFFFFF;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		margin: 32rpx;
+		padding: 1rpx 24rpx;
+		box-sizing: border-box;
+
+		>ul {
+			>li {
+				width: 646rpx;
+				height: 84rpx;
+				background: #fcfcfc;
+				border: 2rpx solid #F9F9F9;
+				margin-top: 32rpx;
+				.df;
+
+				>view:first-child {
+					width: 190rpx;
+					height: 84rpx;
+					line-height: 84rpx;
+					// text-align: left;
+					padding-left: 24rpx;
+					background: #F9F9F9;
+					border-radius: 8rpx 0rpx 0rpx 8rpx;
+					border: 2rpx solid #F9F9F9;
+					font-family: Source Han Sans CN, Source Han Sans CN;
+					font-weight: 400;
+					font-size: 32rpx;
+					color: #333333;
+				}
+			}
+		}
+	}
+
+	.bottombutton {
+		margin-top: 84rpx;
+
+		>button {
+			width: 530rpx;
+			height: 80rpx;
+			border-radius: 56rpx 56rpx 56rpx 56rpx;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pageConsumables/outbound.vue b/pageConsumables/outbound.vue
new file mode 100644
index 0000000..32e9134
--- /dev/null
+++ b/pageConsumables/outbound.vue
@@ -0,0 +1,168 @@
+<template>
+	<view class="warehouseEntry">
+		<ul>
+			<li>
+				<view>
+					耗材名称
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li>
+				<view>
+					现有库存
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li>
+				<view>
+					出库数量
+				</view>
+				<view>
+					<input type="text" placeholder="输入数量" name="" id="">
+				</view>
+			</li>
+			<li>
+				<view>
+					总价值
+				</view>
+				<view>
+					<input type="text" placeholder="输入总价值(元)" name="" id="">
+				</view>
+			</li>
+			<li>
+				<view>
+					单价
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li style="justify-content: space-between;">
+				<view>
+					供应商
+				</view>
+				<view style="width: 54%;" @tap="showStatusToggle">
+					{{status[nowStatusIndex]}}
+				</view>
+				<uni-icons type="bottom" size="16"></uni-icons>
+				<up-button type="text" style="color: #318AFE;width: 64rpx;" @tap="toggle" :plain="true"
+					text="新增"></up-button>
+			</li>
+		</ul>
+		<view :style="{height:showStatus?statusHeight:0}" class="tranistion status  overflow-hide">
+			<view @tap="changeNowStatusIndex(index)" class="u-flex u-p-l-30 lh30 u-p-r-30 u-row-between"
+				v-for="(item,index) in status" :key="index">
+				<view :class="{'color-main':nowStatusIndex===index}">{{item}}</view>
+				<uni-icons v-if="nowStatusIndex===index" type="checkmarkempty" :color="color.ColorMain"></uni-icons>
+			</view>
+			<view :style="{height: '14px'}"></view>
+		</view>
+	</view>
+	<view class="bottombutton">
+		<up-button type="primary" style="background-color:  #318AFE;color: #fff;" @tap="toggle" :plain="true"
+			text="保存"></up-button>
+		<up-button type="text" style="background-color:  #f9f9f9;color: #999;" @tap="toggle" :plain="true"
+			text="取消"></up-button>
+	</view>
+</template>
+
+
+<script setup>
+	import {
+		ref,
+		computed
+	} from 'vue';
+	import color from '@/commons/color.js';
+	let showStatus = ref(false)
+
+	function showStatusToggle() {
+		showStatus.value = !showStatus.value
+	}
+	let nowStatusIndex = ref(0)
+
+	function changeNowStatusIndex(i) {
+		nowStatusIndex.value = i
+		showStatus.value = false
+	}
+	const status = ['开多钱', '好像上次', '海峡市场']
+	const statusHeight = computed(() => {
+		return 30 * status.length + 14 + 'px'
+	})
+</script>
+
+<style scoped lang="less">
+	page {
+		background-color: #f9f9f9;
+	}
+
+	.df() {
+		display: flex;
+		align-items: center;
+	}
+
+	ul,
+	li {
+		list-style: none;
+		padding: 0;
+	}
+
+	.status {
+		margin: 0 32rpx;
+		position: absolute;
+		// top: 100%;
+		left: 0;
+		right: 0;
+		z-index: 10;
+		background-color: #fff;
+	}
+
+	.warehouseEntry {
+		width: 694rpx;
+		height: 740rpx;
+		background: #FFFFFF;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		margin: 32rpx;
+		padding: 1rpx 24rpx;
+		box-sizing: border-box;
+
+		>ul {
+			>li {
+				width: 646rpx;
+				height: 84rpx;
+				background: #fcfcfc;
+				border: 2rpx solid #F9F9F9;
+				margin-top: 32rpx;
+				.df;
+
+				>view:first-child {
+					width: 190rpx;
+					height: 84rpx;
+					line-height: 84rpx;
+					// text-align: left;
+					padding-left: 24rpx;
+					background: #F9F9F9;
+					border-radius: 8rpx 0rpx 0rpx 8rpx;
+					border: 2rpx solid #F9F9F9;
+					font-family: Source Han Sans CN, Source Han Sans CN;
+					font-weight: 400;
+					font-size: 32rpx;
+					color: #333333;
+				}
+			}
+		}
+	}
+
+	.bottombutton {
+		margin-top: 84rpx;
+
+		>button {
+			width: 530rpx;
+			height: 80rpx;
+			border-radius: 56rpx 56rpx 56rpx 56rpx;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pageConsumables/warehouseEntry.vue b/pageConsumables/warehouseEntry.vue
new file mode 100644
index 0000000..4f62122
--- /dev/null
+++ b/pageConsumables/warehouseEntry.vue
@@ -0,0 +1,168 @@
+<template>
+	<view class="warehouseEntry">
+		<ul>
+			<li>
+				<view>
+					耗材名称
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li>
+				<view>
+					现有库存
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li>
+				<view>
+					入库数量
+				</view>
+				<view>
+					<input type="text" placeholder="输入数量" name="" id="">
+				</view>
+			</li>
+			<li>
+				<view>
+					总价值
+				</view>
+				<view>
+					<input type="text" placeholder="输入总价值(元)" name="" id="">
+				</view>
+			</li>
+			<li>
+				<view>
+					单价
+				</view>
+				<view>
+					耗材
+				</view>
+			</li>
+			<li style="justify-content: space-between;">
+				<view>
+					供应商
+				</view>
+				<view style="width: 54%;" @tap="showStatusToggle">
+					{{status[nowStatusIndex]}}
+				</view>
+				<uni-icons type="bottom" size="16"></uni-icons>
+				<up-button type="text" style="color: #318AFE;width: 64rpx;" @tap="toggle" :plain="true"
+					text="新增"></up-button>
+			</li>
+		</ul>
+		<view :style="{height:showStatus?statusHeight:0}" class="tranistion status  overflow-hide">
+			<view @tap="changeNowStatusIndex(index)" class="u-flex u-p-l-30 lh30 u-p-r-30 u-row-between"
+				v-for="(item,index) in status" :key="index">
+				<view :class="{'color-main':nowStatusIndex===index}">{{item}}</view>
+				<uni-icons v-if="nowStatusIndex===index" type="checkmarkempty" :color="color.ColorMain"></uni-icons>
+			</view>
+			<view :style="{height: '14px'}"></view>
+		</view>
+	</view>
+	<view class="bottombutton">
+		<up-button type="primary" style="background-color:  #318AFE;color: #fff;" @tap="toggle" :plain="true"
+			text="保存"></up-button>
+		<up-button type="text" style="background-color:  #f9f9f9;color: #999;" @tap="toggle" :plain="true"
+			text="取消"></up-button>
+	</view>
+</template>
+
+
+<script setup>
+	import {
+		ref,
+		computed
+	} from 'vue';
+	import color from '@/commons/color.js';
+	let showStatus = ref(false)
+
+	function showStatusToggle() {
+		showStatus.value = !showStatus.value
+	}
+	let nowStatusIndex = ref(0)
+
+	function changeNowStatusIndex(i) {
+		nowStatusIndex.value = i
+		showStatus.value = false
+	}
+	const status = ['开多钱', '好像上次', '海峡市场']
+	const statusHeight = computed(() => {
+		return 30 * status.length + 14 + 'px'
+	})
+</script>
+
+<style scoped lang="less">
+	page {
+		background-color: #f9f9f9;
+	}
+
+	.df() {
+		display: flex;
+		align-items: center;
+	}
+
+	ul,
+	li {
+		list-style: none;
+		padding: 0;
+	}
+
+	.status {
+		margin: 0 32rpx;
+		position: absolute;
+		// top: 100%;
+		left: 0;
+		right: 0;
+		z-index: 10;
+		background-color: #fff;
+	}
+
+	.warehouseEntry {
+		width: 694rpx;
+		height: 740rpx;
+		background: #FFFFFF;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		margin: 32rpx;
+		padding: 1rpx 24rpx;
+		box-sizing: border-box;
+
+		>ul {
+			>li {
+				width: 646rpx;
+				height: 84rpx;
+				background: #fcfcfc;
+				border: 2rpx solid #F9F9F9;
+				margin-top: 32rpx;
+				.df;
+
+				>view:first-child {
+					width: 190rpx;
+					height: 84rpx;
+					line-height: 84rpx;
+					// text-align: left;
+					padding-left: 24rpx;
+					background: #F9F9F9;
+					border-radius: 8rpx 0rpx 0rpx 8rpx;
+					border: 2rpx solid #F9F9F9;
+					font-family: Source Han Sans CN, Source Han Sans CN;
+					font-weight: 400;
+					font-size: 32rpx;
+					color: #333333;
+				}
+			}
+		}
+	}
+
+	.bottombutton {
+		margin-top: 84rpx;
+
+		>button {
+			width: 530rpx;
+			height: 80rpx;
+			border-radius: 56rpx 56rpx 56rpx 56rpx;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pageSalesSummary/components/my-date-pickerview.vue b/pageSalesSummary/components/my-date-pickerview.vue
new file mode 100644
index 0000000..df67817
--- /dev/null
+++ b/pageSalesSummary/components/my-date-pickerview.vue
@@ -0,0 +1,448 @@
+<template>
+	<view class="mask" v-if="show" @tap="close">
+		<view class="box" @tap.stop="nullFunction">
+			<view class="u-flex u-relative u-row-center u-p-30 top">
+				<view class="font-bold u-font-32">筛选日期时间</view>
+				<view class="close" @tap="close">
+					<uni-icons type="closeempty" size="24"></uni-icons>
+				</view>
+
+			</view>
+			<!-- 	<view class="u-p-30 u-flex u-flex-wrap gap-20 fastTime">
+					<view class="item" v-for="(item,index) in fastTime" :key="index" @tap="changeTime(item.key)">
+						{{item.title}}
+					</view>
+				</view> -->
+			<picker-view :immediate-change="true" @pickend="pickend" :value="value" @change="bindChange"
+				class="picker-view">
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in years" :key="index">{{item}}年</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in months" :key="index">{{item}}月</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in days" :key="index">{{item}}日</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in hours" :key="index">{{item}}时</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in minutes" :key="index">{{item}}分</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in seconds" :key="index">{{item}}秒</view>
+				</picker-view-column>
+			</picker-view>
+			<view class="u-text-center color-999">至</view>
+			<picker-view :immediate-change="true" :value="value1" @pickend="pickend1" @change="bindChange1"
+				class="picker-view">
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in years" :key="index">{{item}}年</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in months" :key="index">{{item}}月</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in days1" :key="index">{{item}}日</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in hours" :key="index">{{item}}时</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in minutes" :key="index">{{item}}分</view>
+				</picker-view-column>
+				<picker-view-column>
+					<view class="item" v-for="(item,index) in seconds" :key="index">{{item}}秒</view>
+				</picker-view-column>
+			</picker-view>
+
+			<!-- 站位 -->
+			<view style="height: 80px;"></view>
+			<view class="fixed_b">
+				<my-button shape="circle" @tap="confirm">确定</my-button>
+			</view>
+		</view>
+
+	</view>
+
+</template>
+
+<script setup>
+	import myButton from "@/components/my-components/my-button.vue"
+	import {
+		reactive,
+		ref
+	} from 'vue';
+	const $nowDate = new Date()
+	const nowDate = {
+		year: $nowDate.getFullYear(),
+		month: $nowDate.getMonth() + 1,
+		day: $nowDate.getDate(),
+		hours: $nowDate.getHours(),
+		minutes: $nowDate.getMinutes(),
+		seconds: $nowDate.getSeconds()
+	}
+	const yearsLen = 30
+	const years = new Array(yearsLen).fill(1).map((v, index) => {
+		return nowDate.year - index
+	}).reverse()
+	const months = new Array(12).fill(1).map((v, index) => {
+		return index + 1
+	})
+	const days = ref(new Array(getMonthArea($nowDate, 'end').getDate()).fill(1).map((v, index) => {
+		return index + 1
+	}))
+	const days1 = ref(new Array(getMonthArea($nowDate, 'end').getDate()).fill(1).map((v, index) => {
+		return index + 1
+	}))
+	const hours = new Array(24).fill(1).map((v, index) => {
+		return index
+	})
+	const minutes = new Array(60).fill(1).map((v, index) => {
+		return index
+	})
+	const seconds = new Array(60).fill(1).map((v, index) => {
+		return index
+	})
+	const fastTime = reactive([{
+			title: '今日',
+			key: 'now'
+		},
+		{
+			title: '昨日',
+			key: 'prve'
+		},
+		{
+			title: '本月',
+			key: 'nowMonth'
+		},
+		{
+			title: '上月',
+			key: 'prveMonth'
+		}
+	])
+
+
+
+	function setPrveDay() {
+
+	}
+
+	function setNowMoneth() {
+
+	}
+
+	function setprveMoneth() {
+
+	}
+
+
+	function setDay(start, end) {
+		value.value = [
+			start.year,
+			start.month,
+			start.day,
+			0,
+			0,
+			0,
+		]
+		value1.value = [
+			end.year,
+			end.month,
+			end.day,
+			23,
+			59,
+			59,
+		]
+	}
+
+	function changeTime(key) {
+		const yearIndex = years.findIndex(v => v == nowDate.year)
+		const prveyearIndex = years.findIndex(v => v == nowDate.year) - 1
+		const nowMonthIndex = nowDate.month - 1
+		const nowDayIndex = nowDate.day - 1
+		const dataMap = {
+			now: function() {
+				return {
+					start: {
+						year: yearIndex,
+						month: nowMonthIndex,
+						day: nowDayIndex
+					},
+					end: {
+						year: yearIndex,
+						month: nowMonthIndex,
+						day: nowDayIndex
+					}
+				}
+			},
+			prve: function() {
+				const oneDay=1000*60*60*24
+				const date=new Date(new Date(nowDate.year,nowDate.month,nowDate.day,0,0,0).getTime()-oneDay) 
+				return {
+					start: {
+						year:years.findIndex(v=>v==date.getFullYear()),
+						month:date.getMonth()-1<0?11:date.getMonth()-1,
+						day: date.getDate()-1
+					},
+					end: {
+						year:years.findIndex(v=>v==date.getFullYear()),
+						month:date.getMonth()-1<0?11:date.getMonth()-1,
+						day: date.getDate()-1
+					}
+				}
+			},
+			nowMonth: function() {
+				return {
+					start: {
+						year:yearIndex,
+						month:nowMonthIndex,
+						day: 0
+					},
+					end: {
+						year:yearIndex,
+						month:nowMonthIndex,
+						day:new Date(nowDate.year, nowDate.month , 0).getDate() - 1
+					}
+				}
+			},
+			prveMonth: function() {
+				const oneDay=1000*60*60*24
+				const date=new Date(new Date(nowDate.year, nowDate.month-1,0,0,0).getTime()-oneDay) 
+				console.log(date.getMonth());
+				return {
+					start: {
+						year:years.findIndex(v=>v==date.getFullYear()),
+						month:date.getMonth(),
+						day: 0
+					},
+					end: {
+						year:years.findIndex(v=>v==date.getFullYear()),
+						month:date.getMonth(),
+						day: date.getDate()
+					}
+				}
+			}
+		}
+		const data = dataMap[key]()
+		setDay(data.start, data.end)
+		changeDays(false,value.value)
+		changeDays(true,value1.value)
+		
+		console.log(value1.value);
+		const start = returnDateString(value.value)
+		const end = returnDateString(value1.value)
+		
+		emits('confirm', {
+			text: `${start}——${end}`,
+			start,
+			end
+		})
+		close()
+	}
+	let value = ref([
+		years.length - 1,
+		nowDate.month - 1,
+		nowDate.day - 1,
+		0,
+		0,
+		0,
+	])
+	let value1 = ref([
+		years.length - 1,
+		nowDate.month - 1,
+		nowDate.day - 1,
+		23,
+		59,
+		59,
+	])
+
+	let show = ref(false)
+	const emits = defineEmits('close', 'open', 'confirm')
+
+	function toggle() {
+		show.value = !show.value
+		if (show.value) {
+			emits('open', true)
+		} else {
+			emits('close', false)
+		}
+	}
+
+	function close() {
+		show.value = false
+		emits('close', false)
+	}
+
+	function open() {
+		show.value = true
+		emits('open', true)
+	}
+
+	function returnDateString(arr) {
+		const year = years[arr[0]]
+		const month = arr[1] + 1
+		const day = arr[2] + 1
+		const hour = ('0' + arr[3]).slice(-2)
+		const min = ('0' + arr[4]).slice(-2)
+		const sen = ('0' + arr[5]).slice(-2)
+		return `${year}-${month}-${day} ${hour}:${min}:${sen}`
+	}
+
+
+	function confirm(e) {
+		const start = returnDateString(value.value)
+		const end = returnDateString(value1.value)
+		console.log(start);
+		console.log(end);
+		emits('confirm', {
+			text: `${start}——${end}`,
+			start,
+			end
+		})
+		close()
+	}
+
+	function returnMonthStart(arr) {
+		return new Date(years[arr[0]], months[arr[1]] - 1, 1).getDate();
+	}
+
+	function returnMonthEnd(arr) {
+		return new Date(years[arr[0]], months[arr[1]], 0).getDate();
+	}
+	
+	function changeDays(isDays1,arr){
+		const end = returnMonthEnd(arr)
+		if (end) {
+			if(isDays1){
+				days1.value= new Array(end).fill(1).map((v,
+					index) => {
+					return index + 1
+				})
+			}else{
+				days.value= new Array(end).fill(1).map((v,
+					index) => {
+					return index + 1
+				})
+			}
+			
+		}
+	}
+
+	function bindChange(e) {
+		value.value = e.detail.value
+		changeDays(false, e.detail.value)
+	}
+
+	function bindChange1(e) {
+		value1.value = e.detail.value
+		changeDays(true, e.detail.value)
+	}
+
+	function getDayDate(date = new Date(), type) {
+		const now = date
+		if (type === 'start') {
+			const startOfDay = new Date(now.getFullYear(), now.getMonth(), now.getDate());
+			return startOfDay
+		}
+		if (type === 'end') {
+			const endOfDay = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59, 999);
+			return endOfDay;
+		}
+	}
+
+	function getMonthArea(date = new Date(), type) {
+		let now = date
+		let currentMonthStart = new Date(now.getFullYear(), now.getMonth(), 1);
+		let currentMonthEnd = new Date(now.getFullYear(), now.getMonth() + 1, 0, 23, 59, 59, 999);
+		if (type === 'start') {
+			return currentMonthStart
+		}
+		if (type === 'end') {
+			return currentMonthEnd;
+		}
+		return {
+			start: currentMonthStart,
+			end: currentMonthEnd
+		};
+	}
+
+	function nullFunction() {
+
+	}
+
+	function pickend(e) {
+		console.log(e);
+	}
+
+	function pickend1(e) {
+		console.log(e);
+	}
+	defineExpose({
+		close,
+		open,
+		confirm,
+		toggle
+	})
+</script>
+
+<style lang="scss">
+	.fastTime {
+		.item {
+			background-color: rgb(247, 247, 247);
+			padding: 6rpx 40rpx;
+			border-radius: 6rpx;
+			font-size: 32rpx;
+		}
+	}
+
+	.top {
+		border-bottom: 1px solid #eee;
+	}
+
+	.close {
+		position: absolute;
+		top: 50%;
+		transform: translateY(-50%);
+		right: 30rpx;
+	}
+
+	.mask {
+		position: fixed;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		top: 0;
+		background-color: rgba(0, 0, 0, .7);
+
+		.box {
+			position: absolute;
+			background-color: #fff;
+			bottom: 0;
+			left: 0;
+			right: 0;
+			border-radius: 16rpx 16rpx 0 0;
+		}
+	}
+
+	.fixed_b {
+		position: absolute;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		padding: 30rpx;
+		z-index: 100;
+		background-color: #fff;
+	}
+
+	.picker-view {
+		width: 750rpx;
+		height: 300rpx;
+	}
+
+	.item {
+		line-height: 34px;
+		text-align: center;
+	}
+</style>
\ No newline at end of file
diff --git a/pageSalesSummary/index.vue b/pageSalesSummary/index.vue
index 9004904..3b062f7 100644
--- a/pageSalesSummary/index.vue
+++ b/pageSalesSummary/index.vue
@@ -1,42 +1,332 @@
 <template>
-	<view>
-		<button class="button" type="primary" @click="toggle('bottom')"><text class="button-text">底部</text></button>
+	<view class="time-wrapper">
+		<view v-for="(v, i) in timeList" :key="i" class="timelistbox">
+			<view class="time-item" @tap="changeTime(v.value)" :class="{ 'time-selected':v.value==selected }">
+				{{v.label}}
+			</view>
+			<view class="xian" v-if="v.value==selected "> </view>
+		</view>
 	</view>
-	<!-- 弹窗 -->
-	<uni-popup ref="popup" background-color="#fff" @change="change">
-		<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }"><text
-				class="text">popup 内容</text></view>
-	</uni-popup>
+
+	<view class="pageSalesSummaryContent">
+		<view class="">
+			<view class="">
+				实收金额(元)
+			</view>
+			<view class="">
+				{{list.sale?list.sale.incomeAmountAll:0}}
+			</view>
+		</view>
+		<view class="">
+			<view class="">
+				优惠金额(元)
+			</view>
+			<view class="">
+				{{list.count?list.count.saveAmount:0}}
+			</view>
+		</view>
+		<view class="">
+			<view class="">
+				客单价(元)
+			</view>
+			<view class="">
+				{{list.count?list.count.unitPrice:0}}
+			</view>
+		</view>
+		<view class="">
+			<view class="">
+				会员消费(元)
+			</view>
+			<view class="">
+				{{list.vip?list.vip.useAmount:0}}
+			</view>
+		</view>
+		<view class="">
+			<view class="">
+				新增会员(人)
+			</view>
+			<view class="">
+				{{list.vip?list.vip.newFlow:0}}
+			</view>
+		</view>
+		<view class="">
+			<view class="">
+				翻台率(%)
+			</view>
+			<view class="">
+				{{list.count?list.count.turnoverRate:0}}
+			</view>
+		</view>
+	</view>
+	<view class="table-scroll">
+		<table cellspacing="0">
+			<thead>
+				<tr style="background-color: #aebad2;color: #fff;" height='80'>
+					<th>排名</th>
+					<th>商品名称</th>
+					<th>数量</th>
+					<th>金额</th>
+				</tr>
+			</thead>
+			<tbody>
+				<tr v-for="item in tableList" :key="item.productId">
+					<td>{{item.productId}}</td>
+					<td>{{item.productName}}</td>
+					<td>{{item.productNum}}</td>
+					<td>{{item.amount}}</td>
+				</tr>
+			</tbody>
+		</table>
+	</view>
+	<view class="bottombtn" @tap="toUrl">
+		更多 <uni-icons type="right" size="16"></uni-icons>
+	</view>
+	<datePickerview @confirm="datePickerConfirm" ref="datePicker"></datePickerview>
 </template>
 
-<script>
-	export default {
-		data() {
-			return {
-
-			}
+<script setup>
+	import datePickerview from './components/my-date-pickerview.vue'
+	import {
+		summaryTrade,
+		dateProduct
+	} from '@/http/yskApi/requestAll.js';
+	import {
+		onMounted,
+		getCurrentInstance,
+		ref
+	} from 'vue';
+	import dayjs from 'dayjs' //时间格式库
+	import go from '@/commons/utils/go.js'
+	const timeList = [{
+			label: '今天',
+			value: 'today'
 		},
-		setup() {
-			const toggle = (type) => {
-				// console.log(refs, '调试1')
-				this.$refs.popup.open(type)
-			}
+		{
+			label: '昨天',
+			value: 'yesterday'
 		},
-		methods: {
-			toggle(type) {
-				this.$refs.popup.open(type)
-			}
+		{
+			label: '本周',
+			value: 'circumference'
+		}, {
+			label: '本月',
+			value: 'moon'
+		},
+		{
+			label: '自定义',
+			value: 'custom'
 		}
+	]
+	let selected = ref('today')
+	let list = ref([])
+	const currentInstance = getCurrentInstance()
+	let tableList = ref([])
+
+	function toUrl() {
+		go.to('PAGES_PRODUCT_SALES_RANKING')
+	}
+
+	function getlist(start, end) {
+		let startTime, endTime;
+		if (selected.value == 'today') {
+			startTime = dayjs().format('YYYY-MM-DD') + ' 00:00:00'
+			endTime = dayjs().format('YYYY-MM-DD') + ' 23:59:59'
+		} else if (selected.value == 'yesterday') {
+			startTime = formatTime() + ' 00:00:00'
+			endTime = formatTime() + ' 23:59:59'
+		} else if (selected.value == 'circumference') {
+			startTime = dayjs().add(-7, 'day').format('YYYY-MM-DD 00:00:00')
+			endTime = dayjs().format('YYYY-MM-DD 23:59:59')
+		} else if (selected.value == 'moon') {
+			startTime = dayjs().add(-30, 'day').format('YYYY-MM-DD 00:00:00')
+			endTime = dayjs().format('YYYY-MM-DD 23:59:59')
+		} else if (selected.value == 'custom') {
+			startTime = start
+			endTime = end
+		}
+		summaryTrade({
+			shopId: uni.getStorageSync('shopId'),
+			startTime,
+			endTime,
+		}).then((res) => {
+			list.value = res
+		})
+	}
+	onMounted(() => {
+		getlist()
+		gettableData()
+	})
+
+	function datePickerConfirm(e) {
+		getlist(e.start, e.end)
+		// gettableData() day如日期不能是1 7 30 就回报错
+
+	}
+
+	function changeTime(e) {
+		selected.value = e
+		if (e == 'custom') {
+			currentInstance.ctx.$refs.datePicker.toggle()
+		} else {
+			getlist()
+			gettableData()
+		}
+	}
+
+	// 获取表格数据
+	function gettableData() {
+		let day = 1;
+		if (selected.value == 'today') {
+			day = 1
+		} else if (selected.value == 'yesterday') {
+			day = 1
+		} else if (selected.value == 'circumference') {
+			day = 7
+		} else if (selected.value == 'moon') {
+			day = 30
+		} else if (selected.value == 'custom') {
+			day = 30
+		}
+		dateProduct({
+			shopId: uni.getStorageSync('shopId'),
+			day,
+			page: 1,
+			size: 5
+		}).then((res) => {
+			// console.log(res, 'toapjso1')
+			tableList.value = res.totalProduct
+		})
+
+	}
+	// 获取当前时间
+	function getdate() {
+		const dt = new Date();
+		const y = dt.getFullYear();
+		const m = (dt.getMonth() + 1 + "").padStart(2, "0");
+		const d = (dt.getDate() + "").padStart(2, "0");
+		const hh = (dt.getHours() + "").padStart(2, "0");
+		const mm = (dt.getMinutes() + "").padStart(2, "0");
+		const ss = (dt.getSeconds() + "").padStart(2, "0");
+		return `${y}-${m}-${d}`;
+	}
+	// 获取昨天时间
+	const formatTime = () => {
+		let strDate = getdate()
+		let dateFormat = new Date(strDate);
+		dateFormat = dateFormat.setDate(dateFormat.getDate() - 1);
+		dateFormat = new Date(dateFormat);
+		let y = dateFormat.getFullYear()
+		let m = (dateFormat.getMonth() + 1).toString().padStart(2, '0')
+		let d = dateFormat.getDate().toString().padStart(2, '0')
+		return `${y}-${m}-${d}`
 	}
 </script>
 
-<style scoped lang="scss">
-	.popup-content {
+<style scoped lang="less">
+	page {
+		background-color: #f9f9f9;
+	}
+
+	.time-wrapper {
+		display: flex;
+		justify-content: space-around;
+		background-color: #fff;
+		padding-bottom: 20rpx;
+
+		.timelistbox {
+			position: relative;
+
+			.time-item {
+				width: 90rpx;
+				text-align: center;
+				padding-bottom: 10rpx;
+			}
+
+			.xian {
+				width: 40rpx;
+				height: 3rpx;
+				background-color: #459DFF;
+				position: absolute;
+				left: 26rpx;
+				bottom: 0;
+			}
+		}
+
+		.time-selected {
+			color: #459DFF;
+		}
+	}
+
+	.pageSalesSummaryContent {
+		width: 694rpx;
+		height: 320rpx;
+		margin: 20rpx 28rpx;
+		background-image: url('./svg/bgimg.svg');
+		background-size: 694rpx 320rpx;
+		padding: 48rpx 28rpx;
+		.df;
+		flex-wrap: wrap;
+
+		>view {
+			padding-right: 52rpx;
+			color: #fff;
+			font-family: Source Han Sans CN, Source Han Sans CN;
+			font-weight: 400;
+			font-size: 28rpx;
+		}
+	}
+
+	// 表格
+	.table-scroll {
+		// width: calc(100% - 5px);
+		overflow-x: scroll;
+		white-space: nowrap;
+		margin: 0 28rpx;
+		margin-right: 30rpx;
+		border-radius: 30rpx 30rpx 0 0;
+
+	}
+
+	.table-scroll table {
+		table-layout: fixed;
+		width: calc(100% - 10rpx);
+	}
+
+	.table-scroll thead {
+		display: table-row;
+		background-color: bisque;
+
+	}
+
+	.table-scroll tbody {
+		overflow-y: scroll;
+		overflow-x: hidden;
+		display: block;
+		width: 1040rpx;
+		// width: calc(100% );
+	}
+
+	.table-scroll th,
+	td {
+		height: 80rpx;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		min-width: 250rpx;
+		border: 2rpx solid #7E9BD4;
+	}
+
+	.bottombtn {
+		width: 694rpx;
+		height: 56rpx;
+		line-height: 56rpx;
+		text-align: center;
+		margin: 0rpx auto;
+		background: #F1F1F1;
+		border-radius: 0rpx 0rpx 28rpx 28rpx;
+	}
+
+	.df() {
 		display: flex;
 		align-items: center;
-		justify-content: center;
-		padding: 15px;
-		height: 50px;
-		background-color: #fff;
 	}
 </style>
\ No newline at end of file
diff --git a/pageSalesSummary/productSalesRanking.vue b/pageSalesSummary/productSalesRanking.vue
new file mode 100644
index 0000000..8168838
--- /dev/null
+++ b/pageSalesSummary/productSalesRanking.vue
@@ -0,0 +1,87 @@
+<template>
+	<view class="table-scroll">
+		<table cellspacing="0">
+			<thead>
+				<tr style="background-color: #aebad2;color: #fff;" height='80'>
+					<th>排名</th>
+					<th>商品名称</th>
+					<th>数量</th>
+					<th>金额</th>
+				</tr>
+			</thead>
+			<tbody>
+				<tr v-for="item in tableList" :key="item.productId">
+					<td>{{item.productId}}</td>
+					<td>{{item.productName}}</td>
+					<td>{{item.productNum}}</td>
+					<td>{{item.amount}}</td>
+				</tr>
+			</tbody>
+		</table>
+	</view>
+</template>
+
+<script setup>
+	import {
+		onMounted,
+		ref
+	} from 'vue';
+	import {
+		summaryTrade,
+		dateProduct
+	} from '@/http/yskApi/requestAll.js';
+	let tableList = ref([])
+	onMounted(() => {
+		gettableData()
+	})
+	// 获取表格数据
+	function gettableData() {
+		dateProduct({
+			shopId: uni.getStorageSync('shopId'),
+			day: 30,
+			page: 1,
+			size: 50
+		}).then((res) => {
+			tableList.value = res.totalProduct
+		})
+
+	}
+</script>
+
+<style>
+	.table-scroll {
+		overflow-x: scroll;
+		white-space: nowrap;
+		margin: 0 28rpx;
+		margin-right: 30rpx;
+		border-radius: 30rpx 30rpx 0 0;
+
+	}
+
+	.table-scroll table {
+		table-layout: fixed;
+		width: calc(100% - 10rpx);
+	}
+
+	.table-scroll thead {
+		display: table-row;
+		background-color: bisque;
+
+	}
+
+	.table-scroll tbody {
+		overflow-y: scroll;
+		overflow-x: hidden;
+		display: block;
+		width: 1040rpx;
+	}
+
+	.table-scroll th,
+	td {
+		height: 80rpx;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		min-width: 250rpx;
+		border: 2rpx solid #7E9BD4;
+	}
+</style>
\ No newline at end of file
diff --git a/pageSalesSummary/svg/bgimg.svg b/pageSalesSummary/svg/bgimg.svg
new file mode 100644
index 0000000..86852d5
--- /dev/null
+++ b/pageSalesSummary/svg/bgimg.svg
@@ -0,0 +1,80 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="347" height="160" viewBox="0 0 347 160">
+  <defs>
+    <clipPath id="clip-path">
+      <rect id="矩形_16626" data-name="矩形 16626" width="347" height="160" rx="6" transform="translate(-9146 18040)" fill="#7a8999"/>
+    </clipPath>
+    <linearGradient id="linear-gradient" x1="0.449" y1="-0.022" x2="0.774" y2="1.011" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#449eff"/>
+      <stop offset="0" stop-color="#469fff" stop-opacity="0.996"/>
+      <stop offset="1" stop-color="#b5caf9" stop-opacity="0.851"/>
+    </linearGradient>
+    <linearGradient id="linear-gradient-2" x1="-0.101" y1="-0.308" x2="0.782" y2="0.948" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#449eff"/>
+      <stop offset="0.455" stop-color="#79b6fe"/>
+      <stop offset="1" stop-color="#8bb5fa"/>
+    </linearGradient>
+    <filter id="交叉_21" x="259" y="-35" width="133" height="135" filterUnits="userSpaceOnUse">
+      <feOffset dy="10" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="15" result="blur"/>
+      <feFlood flood-color="#5c70f8" flood-opacity="0.204"/>
+      <feComposite operator="in" in2="blur"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+    <clipPath id="clip-path-2">
+      <rect id="矩形_16186" data-name="矩形 16186" width="347" height="106" transform="translate(14 250)" fill="#fff" stroke="#707070" stroke-width="1"/>
+    </clipPath>
+    <filter id="路径_9826" x="-1.906" y="56.99" width="351.111" height="69.518" filterUnits="userSpaceOnUse">
+      <feOffset dy="2" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="0.5" result="blur-2"/>
+      <feFlood flood-color="#ebd2d2" flood-opacity="0.169"/>
+      <feComposite operator="in" in2="blur-2"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+    <linearGradient id="linear-gradient-3" x1="0.494" y1="0.679" x2="0.5" y2="-0.811" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#fff" stop-opacity="0"/>
+      <stop offset="0.288" stop-color="#fff" stop-opacity="0"/>
+      <stop offset="0.663" stop-color="#fff"/>
+      <stop offset="1" stop-color="#fff"/>
+    </linearGradient>
+    <filter id="路径_9827" x="-4.805" y="57" width="353.304" height="164.295" filterUnits="userSpaceOnUse">
+      <feOffset dy="1" input="SourceAlpha"/>
+      <feGaussianBlur stdDeviation="0.5" result="blur-3"/>
+      <feFlood flood-color="#ff4d4d" flood-opacity="0.161"/>
+      <feComposite operator="in" in2="blur-3"/>
+      <feComposite in="SourceGraphic"/>
+    </filter>
+  </defs>
+  <g id="蒙版组_1155" data-name="蒙版组 1155" transform="translate(9146 -18040)" clip-path="url(#clip-path)">
+    <rect id="矩形_1403" data-name="矩形 1403" width="347" height="160" rx="6" transform="translate(-9146 18040)" fill="url(#linear-gradient)"/>
+    <g id="组_1622" data-name="组 1622" transform="translate(-9146 18056.176)">
+      <circle id="椭圆_11" data-name="椭圆 11" cx="2.5" cy="2.5" r="2.5" transform="translate(0 -0.176)" fill="#fff" opacity="0.093"/>
+      <circle id="椭圆_22" data-name="椭圆 22" cx="2.5" cy="2.5" r="2.5" transform="translate(0 12.824)" fill="#fff" opacity="0.093"/>
+      <circle id="椭圆_28" data-name="椭圆 28" cx="2.5" cy="2.5" r="2.5" transform="translate(0 25.824)" fill="#fff" opacity="0.093"/>
+      <circle id="椭圆_12" data-name="椭圆 12" cx="2.5" cy="2.5" r="2.5" transform="translate(13 -0.176)" fill="#fff" opacity="0.093"/>
+      <circle id="椭圆_21" data-name="椭圆 21" cx="2.5" cy="2.5" r="2.5" transform="translate(13 12.824)" fill="#fff" opacity="0.093"/>
+      <circle id="椭圆_27" data-name="椭圆 27" cx="2.5" cy="2.5" r="2.5" transform="translate(13 25.824)" fill="#fff" opacity="0.093"/>
+      <circle id="椭圆_13" data-name="椭圆 13" cx="2.5" cy="2.5" r="2.5" transform="translate(26 -0.176)" fill="#fff" opacity="0.059"/>
+      <circle id="椭圆_20" data-name="椭圆 20" cx="2.5" cy="2.5" r="2.5" transform="translate(26 12.824)" fill="#fff" opacity="0.059"/>
+      <circle id="椭圆_26" data-name="椭圆 26" cx="2.5" cy="2.5" r="2.5" transform="translate(26 25.824)" fill="#fff" opacity="0.059"/>
+      <circle id="椭圆_14" data-name="椭圆 14" cx="2.5" cy="2.5" r="2.5" transform="translate(39 -0.176)" fill="#fff" opacity="0.04"/>
+      <circle id="椭圆_19" data-name="椭圆 19" cx="2.5" cy="2.5" r="2.5" transform="translate(39 12.824)" fill="#fff" opacity="0.04"/>
+      <circle id="椭圆_25" data-name="椭圆 25" cx="2.5" cy="2.5" r="2.5" transform="translate(39 25.824)" fill="#fff" opacity="0.04"/>
+      <circle id="椭圆_15" data-name="椭圆 15" cx="2.5" cy="2.5" r="2.5" transform="translate(52 -0.176)" fill="#fff" opacity="0.018"/>
+      <circle id="椭圆_18" data-name="椭圆 18" cx="2.5" cy="2.5" r="2.5" transform="translate(52 12.824)" fill="#fff" opacity="0.018"/>
+      <circle id="椭圆_24" data-name="椭圆 24" cx="2.5" cy="2.5" r="2.5" transform="translate(52 25.824)" fill="#fff" opacity="0.018"/>
+    </g>
+    <g transform="matrix(1, 0, 0, 1, -9146, 18040)" filter="url(#交叉_21)">
+      <path id="交叉_21-2" data-name="交叉 21" d="M304,28a27.877,27.877,0,0,1,5.75-17H341a6,6,0,0,1,6,6V51.647A28,28,0,0,1,304,28Z" transform="translate(0 -11)" fill="url(#linear-gradient-2)"/>
+    </g>
+    <g id="蒙版组_907" data-name="蒙版组 907" transform="translate(-9160 17844)" clip-path="url(#clip-path-2)">
+      <g id="组_16894" data-name="组 16894" transform="translate(-196.193 -86.495)">
+        <g transform="matrix(1, 0, 0, 1, 210.19, 282.5)" filter="url(#路径_9826)">
+          <path id="路径_9826-2" data-name="路径 9826" d="M208.52,385.434s39.063-63.028,91.077,0c0,0,16.463,19.137,46.725,19.561,24.33.341,47.329-12.3,63.147-33.292,19.168-25.44,60.676-62.291,105.343,13.423,4.4,7.467,11.032,13.049,18.785,14.856,6.629,1.546,14.526.594,21.641-7.675" transform="translate(-208.24 -282.5)" fill="none" stroke="rgba(255,255,255,0.21)" stroke-linecap="round" stroke-miterlimit="10" stroke-width="1"/>
+        </g>
+        <g transform="matrix(1, 0, 0, 1, 210.19, 282.5)" filter="url(#路径_9827)">
+          <path id="路径_9827-2" data-name="路径 9827" d="M206.889,483.334l3.366-98.808s38.321-62.12,90.5.908c0,0,16.512,19.137,46.871,19.561,24.405.341,47.475-12.3,63.342-33.292,19.229-25.44,60.868-62.291,105.675,13.423,4.417,7.467,11.067,13.049,18.842,14.856,6.652,1.546,14.573.594,21.71-7.675l-2.5,96.286c-7.139,8.269-15.058,9.221-21.71,7.675-7.777-1.81-14.427-7.39-18.844-14.856C469.334,405.7,427.7,442.55,408.466,467.99c-15.867,20.992-38.939,33.632-63.344,33.292-30.358-.424-46.871-19.561-46.871-19.561-52.177-63.028-88-5.531-88-5.531" transform="translate(-210.19 -282.5)" fill="url(#linear-gradient-3)"/>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/pages.json b/pages.json
index 1fb827e..5c0de9d 100644
--- a/pages.json
+++ b/pages.json
@@ -1225,8 +1225,45 @@
 				"style": {
 					"navigationBarTitleText": "销售汇总"
 				}
+			},{
+				"pageId": "PAGES_PRODUCT_SALES_RANKING",
+				"path": "productSalesRanking",
+				"style": {
+					"navigationBarTitleText": "商品销售排行"
+				}
+			}
+			
+			]
+		},
+		{
+			"root": "pageConsumables",
+			"pages": [{
+				"pageId": "PAGES_SALES_CONSUMABLES",
+				"path": "index",
+				"style": {
+					"navigationBarTitleText": "耗材管理"
+				}
+			}, {
+				"pageId": "PAGES_SALES_WAREHOUSEENTRY",
+				"path": "warehouseEntry",
+				"style": {
+					"navigationBarTitleText": "入库"
+				}
+			}, {
+				"pageId": "PAGES_SALES_OUTBOUND",
+				"path": "outbound",
+				"style": {
+					"navigationBarTitleText": "出库"
+				}
+			}, {
+				"pageId": "PAGES_SALES_INVENTORYCHECK",
+				"path": "inventoryCheck",
+				"style": {
+					"navigationBarTitleText": "盘点"
+				}
 			}]
 		},
+
 		{
 			"root": "pagePrinter",
 			"pages": [{
@@ -1248,7 +1285,7 @@
 					"pageId": "PAGES_PRINTER_EDIT",
 					"path": "index/editPrinter",
 					"style": {
-						"navigationBarTitleText" : "打印机编辑"
+						"navigationBarTitleText": "打印机编辑"
 					}
 				}
 
@@ -1276,8 +1313,7 @@
 		"spacing": "5px",
 		"height": "58px",
 		"backgroundColor": "#FCFCFC",
-		"list": [
-			{
+		"list": [{
 				"pagePath": "pages/index/index",
 				"iconPath": "static/tabImg/index.png",
 				"selectedIconPath": "static/tabImg/index-select.png",
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 563c10e..b517ee0 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -186,6 +186,11 @@
 			title: '销售汇总',
 			icon: '/static/indexImg/PAGE_SALES_SUMMARY.svg',
 			pageUrl: 'PAGES_SALES_SUMMARY'
+		},
+		{
+			title: '耗材管理',
+			icon: '/static/indexImg/PAGE_SALES_SUMMARY.svg',
+			pageUrl: 'PAGES_SALES_CONSUMABLES'
 		}
 
 	];