报表

api/goods.js

@@ -0,0 +1,171 @@
+const goods = [{
+	"id": "1",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd1.jpg",
+	"goodName": "【1】  六罐装荷兰美素佳儿金装2段900g",
+	"goodPrice": 1149.00,
+	"goodSold": 648
+}, {
+	"id": "2",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd2.jpg",
+	"goodName": "【2】  韩国Amore爱茉莉红吕洗发水套装修复受损发质",
+	"goodPrice": 89.00,
+	"goodSold": 128
+}, {
+	"id": "3",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd3.jpg",
+	"goodName": "【3】  Friso美素佳儿 金装婴儿配方奶粉3段900g",
+	"goodPrice": 195.00,
+	"goodSold": 968
+}, {
+	"id": "4",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd4.jpg",
+	"goodName": "【4】  Fisher goodPrice费雪 费雪三轮儿童滑行车",
+	"goodPrice": 299.00,
+	"goodSold": 85
+}, {
+	"id": "5",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd5.jpg",
+	"goodName": "【5】  Babylee巴布力 实木婴儿床 雷卡拉130*70cm",
+	"goodPrice": 1889.00,
+	"goodSold": 18
+}, {
+	"id": "6",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd6.jpg",
+	"goodName": "【6】  Pigeon贝亲 独立三层奶粉盒 送小罐奶粉1段200g",
+	"goodPrice": 70.00,
+	"goodSold": 658
+}, {
+	"id": "7",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd7.jpg",
+	"goodName": "【7】 TTBOO兔兔小布 肩纽扣套装",
+	"goodPrice": 268.00,
+	"goodSold": 128
+}, {
+	"id": "8",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd8.jpg",
+	"goodName": "【8】  Nuna璐拉 婴儿布里奇果精纯嫩肤沐浴露婴儿精纯芦荟胶",
+	"goodPrice": 140.00,
+	"goodSold": 366
+}, {
+	"id": "9",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd9.jpg",
+	"goodName": "【9】  illuma启赋 奶粉3段900g",
+	"goodPrice": 252.00,
+	"goodSold": 98
+}, {
+	"id": "10",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd10.jpg",
+	"goodName": "【10】  Abbott雅培乳蛋白部分水解婴儿配方奶粉3段820g",
+	"goodPrice": 89.00,
+	"goodSold": 128
+}, {
+	"id": "11",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd11.jpg",
+	"goodName": "【11】  韩蜜 酷炫唇蜜（礼盒套装）2.8g*4",
+	"goodPrice": 179.00,
+	"goodSold": 35
+}, {
+	"id": "12",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd12.jpg",
+	"goodName": "【12】  保税区直发【3包装】日本Merries花王纸尿裤NB90",
+	"goodPrice": 289.00,
+	"goodSold": 1928
+}, {
+	"id": "13",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd13.jpg",
+	"goodName": "【13】  Comotomo可么多么 硅胶奶瓶（0-3月奶嘴）150ml绿色",
+	"goodPrice": 203.00,
+	"goodSold": 87
+}, {
+	"id": "14",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd14.jpg",
+	"goodName": "【14】  香港直邮德国瑞德露Rival de Loop芦荟精华安瓶",
+	"goodPrice": 152.00,
+	"goodSold": 61
+}, {
+	"id": "15",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd15.jpg",
+	"goodName": "【15】  保税区直发药师堂尊马油香草味温和保湿无刺激面霜",
+	"goodPrice": 269.00,
+	"goodSold": 73
+}, {
+	"id": "16",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd16.jpg",
+	"goodName": "【16】  香港直邮日本Spatreatment眼膜保湿去细纹法令纹",
+	"goodPrice": 219.00,
+	"goodSold": 13
+}, {
+	"id": "17",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd17.jpg",
+	"goodName": "【17】  韩国MEDIHEALNMF可莱丝针剂睡眠面膜",
+	"goodPrice": 81.00,
+	"goodSold": 128
+}, {
+	"id": "18",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd18.jpg",
+	"goodName": "【18】  DHC蝶翠诗橄榄蜂蜜滋养洗脸手工皂90g",
+	"goodPrice": 123.00,
+	"goodSold": 77
+}, {
+	"id": "19",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd19.jpg",
+	"goodName": "【19】  日本资生堂CPB肌肤之钥新版隔离霜 清爽型 30ml",
+	"goodPrice": 429.00,
+	"goodSold": 36
+}, {
+	"id": "20",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd20.jpg",
+	"goodName": "【20】 Heinz亨氏 婴儿面条优加面条全素套餐组合3口味3盒",
+	"goodPrice": 39.00,
+	"goodSold": 61
+}, {
+	"id": "21",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd21.jpg",
+	"goodName": "【21】  Heinz亨氏 乐维滋果汁泥组合5口味15袋",
+	"goodPrice": 69.00,
+	"goodSold": 55
+}, {
+	"id": "22",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd22.jpg",
+	"goodName": "【22】  保税区直发澳大利亚Swisse高浓度蔓越莓胶囊30粒",
+	"goodPrice": 271.00,
+	"goodSold": 19
+}, {
+	"id": "23",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd23.jpg",
+	"goodName": "【23】  挪威Nordic Naturals小鱼婴幼儿鱼油DHA滴剂",
+	"goodPrice": 102.00,
+	"goodSold": 125
+}, {
+	"id": "24",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd24.jpg",
+	"goodName": "【24】  澳大利亚Bio island DHA for Pregnancy海藻油DHA",
+	"goodPrice": 289.00,
+	"goodSold": 28
+}, {
+	"id": "25",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd25.jpg",
+	"goodName": "【25】  澳大利亚Fatblaster Coconut Detox椰子水",
+	"goodPrice": 152.00,
+	"goodSold": 17
+}, {
+	"id": "26",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd26.jpg",
+	"goodName": "【26】  Suitsky舒比奇 高护极薄舒爽纸尿片尿不湿XL60",
+	"goodPrice": 99.00,
+	"goodSold": 181
+}, {
+	"id": "27",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd27.jpg",
+	"goodName": "【27】  英国JUST SOAP手工皂 玫瑰天竺葵蛋糕皂",
+	"goodPrice": 72.00,
+	"goodSold": 66
+}, {
+	"id": "28",
+	"goodImg": "https://www.mescroll.com/demo/res/img/pd28.jpg",
+	"goodName": "【28】  德国NUK 多色婴幼儿带盖学饮杯",
+	"goodPrice": 92.00,
+	"goodSold": 138
+}]
+
+export default goods;

api/mock.js

@@ -0,0 +1,178 @@
+/*
+本地模拟接口请求, 仅demo演示用.
+实际项目以您服务器接口返回的数据为准,无需本地处理分页.
+请参考官方写法: https://www.mescroll.com/uni.html?v=20200210#tagUpCallback
+* */
+
+// 模拟数据
+import goods from "./goods.js";
+
+// 获取新闻列表
+export function apiNewList(pageNum, pageSize) {
+	return new Promise((resolute, reject)=>{
+		//延时一秒,模拟联网
+		setTimeout(function() {
+			try {
+				let list = [];
+				if (!pageNum) {
+					//模拟下拉刷新返回的数据
+					let id=new Date().getTime();
+					let newObj = {
+						id:id,
+						title: "【新增新闻" + id + "】 标题",
+						content: "新增新闻的内容"
+					};
+					list.push(newObj);
+				} else {
+					//模拟上拉加载返回的数据
+					for (let i = 0; i < pageSize; i++) {
+						let upIndex = (pageNum - 1) * pageSize + i + 1;
+						let newObj = {
+							id:upIndex,
+							title: "【新闻" + upIndex + "】 标题标题标题标题标题",
+							content: "内容内容内容内容内容内容内容内容内容"
+						};
+						list.push(newObj);
+					}
+					console.log("page.num=" + pageNum + ", page.size=" + pageSize + ", curPageData.length=" + list.length);
+				}
+				//模拟接口请求成功
+				resolute(list);
+			} catch (e) {
+				//模拟接口请求失败
+				reject(e);
+			}
+		}, 1000)
+	})
+}
+
+// 搜索商品
+export function apiGoods(pageNum, pageSize, keyword) {
+	return new Promise((resolute, reject)=>{
+		//延时一秒,模拟联网
+		setTimeout(()=> {
+			try{
+				let data = {
+					list: [], // 数据列表
+					totalCount: 0, // 总数量
+					totalPage: 0, // 总页数
+					hasNext: false // 是否有下一页
+				}
+				
+				// 符合关键词的记录
+				let keywordList = [];
+				if (!keyword || keyword == "全部") {
+					// 搜索全部商品
+					keywordList = goods;
+				}else{
+					// 关键词搜索
+					if(keyword=="母婴") keyword="婴"; // 为这个关键词展示多几条数据
+					for (let i = 0; i < goods.length; i++) {
+						let good = goods[i]
+						if (good.goodName.indexOf(keyword) !== -1) {
+							keywordList.push(good)
+						}
+					}
+				}
+				
+				// 分页
+				for (let i = (pageNum - 1) * pageSize; i < pageNum * pageSize; i++) {
+					if (i >= keywordList.length) break
+					data.list.push(keywordList[i])
+				}
+				
+				// 汇总数据
+				data.totalCount = keywordList.length;
+				data.totalPage = Math.ceil(data.totalCount/pageSize);
+				data.hasNext = pageNum < data.totalPage
+				
+				//模拟接口请求成功
+				console.log("pageNum=" + pageNum + ", pageSize=" + pageSize + ", data.list.length=" + data.list.length + ", totalCount=" + data.totalCount + ", totalPage=" + data.totalPage + ", hasNext=" + data.hasNext + (keyword ? ", keyword=" + keyword : ""));
+				resolute(data);
+			} catch (e) {
+				//模拟接口请求失败
+				reject(e);
+			}
+		},1000)
+	})
+}
+
+// 获取微博列表
+export function apiWeiboList(pageNum, pageSize) {
+	return new Promise((resolute, reject)=>{
+		//延时2秒,模拟联网
+		setTimeout(function() {
+			try {
+				let list = [];
+				if(!pageNum){
+					//此处模拟下拉刷新返回的数据
+					let id=new Date().getTime();
+					let newObj={id:id, title:"【新增微博"+id+"】 新增微博", content:"新增微博的内容,新增微博的内容"};
+					list.push(newObj);
+				}else{
+					//此处模拟上拉加载返回的数据
+					for (let i = 0; i < pageSize; i++) {
+						let upIndex=(pageNum-1)*pageSize+i+1;
+						let newObj={id:upIndex, title:"【微博"+upIndex+"】 标题标题标题标题标题标题", content:"内容内容内容内容内容内容内容内容内容内容"};
+						list.push(newObj);
+					}
+					console.log("page.num=" + pageNum + ", page.size=" + pageSize + ", curPageData.length=" + list.length);
+				}
+				//模拟接口请求成功
+				resolute(list);
+			} catch (e) {
+				//模拟接口请求失败
+				reject(e);
+			}
+		}, 2000)
+	})
+}
+
+
+// 获取消息列表(共5页消息)
+export function apiMsgList(pageNum, pageSize) {
+	return new Promise((resolute, reject)=>{
+		//延时一秒,模拟联网
+		setTimeout(function() {
+			try {
+				let list = [];
+				//模拟下拉加载更多记录
+				for (let i = 0; i < pageSize; i++) {
+					let msgId = (pageNum - 1) * pageSize + i + 1;
+					let newObj = {
+						id: msgId,
+						title: "【消息" + msgId + "】",
+						content: "内容: 下拉获取聊天记录"
+					};
+					// 此处模拟只有5页的消息 (第5页只有3条)
+					if(pageNum>=5 && i>=3){}else{
+						list.unshift(newObj);
+					}
+				}
+				console.log("page.num=" + pageNum + ", page.size=" + pageSize + ", curPageData.length=" + list.length);
+				//模拟接口请求成功
+				resolute(list);
+			} catch (e) {
+				//模拟接口请求失败
+				reject(e);
+			}
+		}, 1000)
+	})
+}
+
+// 获取tabs类目
+export function apiGetTabs() {
+	return new Promise((resolute, reject)=>{
+		//延时,模拟联网
+		setTimeout(function() {
+			try {
+				let tabs = ['全部', '奶粉', '面膜', '图书', '果汁', '奶瓶', '美素', '花王', '韩蜜', '口红', '毛巾', '玩具', '衣服'];
+				//模拟接口请求成功
+				resolute(tabs);
+			} catch (e) {
+				//模拟接口请求失败
+				reject(e);
+			}
+		}, 10)
+	})
+}

components/good-list/good-list.vue

@@ -0,0 +1,67 @@
+<!-- 商品列表组件 <good-list :list="xx"></good-list> -->
+<template>
+	<view class="good-list">
+		<view :id="'good'+good.id" class="good-li" v-for="good in list" :key="good.id">
+			<image class="good-img" :src="good.goodImg" mode="widthFix"/>
+			<view class="flex-item">
+				<view class="good-name">{{good.goodName}}</view>
+				<text class="good-price">{{good.goodPrice}} 元</text>
+				<text class="good-sold">已售{{good.goodSold}}件</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props:{
+			list: {
+				type: Array,
+				default(){
+					return []
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.good-list{
+		background-color: #fff;
+		
+		.good-li{
+			display: flex;
+			align-items: center;
+			padding: 20upx;
+			border-bottom: 1upx solid #eee;
+			
+			.good-img{
+				width: 160upx;
+				height: 160upx;
+				margin-right: 20rpx;
+			}
+			
+			.flex-item{
+				flex: 1;
+				
+				.good-name{
+					font-size: 26upx;
+					line-height: 40upx;
+					height: 80upx;
+					margin-bottom: 20upx;
+					overflow: hidden;
+				}
+				.good-price{
+					font-size: 26upx;
+					color: red;
+				}
+				.good-sold{
+					font-size: 24upx;
+					margin-left: 16upx;
+					color: gray;
+				}
+				
+			}
+		}
+	}
+</style>

components/me-tabs/me-tabs.vue

@@ -0,0 +1,229 @@
+<!-- tab组件: <me-tabs v-model="tabIndex" :tabs="tabs" @change="tabChange"></me-tabs> -->
+<template>
+	<view class="me-tabs" :class="{'tabs-fixed': fixed}"
+		:style="{height: tabHeightVal, top:topFixed, 'margin-top':topMargin}">
+		<scroll-view v-if="tabs.length" :id="viewId" :scroll-left="scrollLeft" scroll-x scroll-with-animation
+			:scroll-animation-duration="300">
+			<view class="tabs-item" :class="{'tabs-flex':!isScroll, 'tabs-scroll':isScroll}">
+				<!-- tab -->
+				<view class="tab-item" :style="{width: tabWidthVal, height: tabHeightVal, 'line-height':tabHeightVal}"
+					v-for="(tab, i) in tabs" :class="{'active': value===i}" :key="i" @click="tabClick(i)">
+					{{getTabName(tab)}}
+				</view>
+				<!-- 下划线 -->
+				<view class="tabs-line" :style="{left:lineLeft}"></view>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			tabs: { // 支持格式: ['全部', '待付款'] 或 [{name:'全部'}, {name:'待付款'}]
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			nameKey: { // 取name的字段
+				type: String,
+				default: 'name'
+			},
+			value: { // 当前显示的下标 (使用v-model语法糖: 1.props需为value; 2.需回调input事件)
+				type: [String, Number],
+				default: 0
+			},
+			fixed: Boolean, // 是否悬浮,默认false
+			tabWidth: Number, // 每个tab的宽度,默认不设置值,为flex平均分配; 如果指定宽度,则不使用flex,每个tab居左,超过则水平滑动(单位默认rpx)
+			height: { // 高度,单位rpx
+				type: Number,
+				default: 64
+			},
+			top: { // 顶部偏移的距离,默认单位rpx (当fixed=true时,已加上windowTop)
+				type: Number,
+				default: 0
+			}
+		},
+		data() {
+			return {
+				viewId: 'id_' + Math.random().toString(36).substr(2, 16),
+				scrollLeft: 0,
+				windowWidth: 0,
+				windowTop: 0
+			}
+		},
+		computed: {
+			isScroll() {
+				return this.tabWidth && this.tabs.length // 指定了tabWidth的宽度,则支持水平滑动
+			},
+			tabHeightPx() {
+				return uni.upx2px(this.height)
+			},
+			tabHeightVal() {
+				return this.tabHeightPx + 'px'
+			},
+			tabWidthPx() {
+				return uni.upx2px(this.tabWidth)
+			},
+			tabWidthVal() {
+				return this.isScroll ? this.tabWidthPx + 'px' : ''
+			},
+			lineLeft() {
+				if (this.isScroll) {
+					return this.tabWidthPx * this.value + this.tabWidthPx / 2 + 'px' // 需转为px (用rpx的话iOS真机显示有误差)
+				} else {
+					return 100 / this.tabs.length * (this.value + 1) - 100 / (this.tabs.length * 2) + '%'
+				}
+			},
+			topFixed() {
+				return this.fixed ? this.windowTop + uni.upx2px(this.top) + 'px' : 0
+			},
+			topMargin() {
+				return this.fixed ? 0 : this.top + 'rpx'
+			}
+		},
+		watch: {
+			tabs() {
+				this.warpWidth = null; // 重新计算容器宽度
+				this.scrollCenter(); // 水平滚动到中间
+			},
+			value() {
+				this.scrollCenter(); // 水平滚动到中间
+			}
+		},
+		created() {
+			let sys = uni.getSystemInfoSync();
+			this.windowWidth = sys.windowWidth
+			this.windowTop = sys.windowTop
+		},
+		mounted() {
+			this.scrollCenter() // 滚动到当前下标
+		},
+		methods: {
+			getTabName(tab) {
+				return typeof tab === "object" ? tab[this.nameKey] : tab
+			},
+			tabClick(i) {
+				if (this.value != i) {
+					this.$emit("input", i);
+					this.$emit("change", i);
+				}
+			},
+			async scrollCenter() {
+				if (!this.isScroll) return;
+				if (!this.warpWidth) { // tabs容器的宽度
+					let rect = await this.initWarpRect()
+					this.warpWidth = rect ? rect.width : this.windowWidth; // 某些情况下取不到宽度,暂时取屏幕宽度
+				}
+				let tabLeft = this.tabWidthPx * this.value + this.tabWidthPx / 2; // 当前tab中心点到左边的距离
+				let diff = tabLeft - this.warpWidth / 2 // 如果超过tabs容器的一半,则滚动差值
+				this.scrollLeft = diff;
+				// #ifdef MP-TOUTIAO
+				this.scrollTimer && clearTimeout(this.scrollTimer)
+				this.scrollTimer = setTimeout(() => { // 字节跳动小程序,需延时再次设置scrollLeft,否则tab切换跨度较大时不生效
+					this.scrollLeft = Math.ceil(diff)
+				}, 400)
+				// #endif
+			},
+			initWarpRect() {
+				return new Promise(resolve => {
+					setTimeout(() => { // 延时确保dom已渲染, 不使用$nextclick
+						let query = uni.createSelectorQuery();
+						// #ifndef MP-ALIPAY
+						query = query.in(this) // 支付宝小程序不支持in(this),而字节跳动小程序必须写in(this), 否则都取不到值
+						// #endif
+						query.select('#' + this.viewId).boundingClientRect(data => {
+							resolve(data)
+						}).exec();
+					}, 20)
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.me-tabs {
+		position: relative;
+		font-size: 24rpx;
+		border-bottom: 1rpx solid #eee;
+		box-sizing: border-box;
+		overflow-y: hidden;
+		background-color: #fff;
+
+		&.tabs-fixed {
+			z-index: 990;
+			position: fixed;
+			left: 0;
+			width: 100%;
+		}
+
+		.tabs-item {
+			position: relative;
+			white-space: nowrap;
+			padding-bottom: 30rpx; // 撑开高度,再配合me-tabs的overflow-y: hidden,以达到隐藏滚动条的目的
+			box-sizing: border-box;
+			padding: 0 35rpx 30rpx 35rpx;
+
+			.tab-item {
+				position: relative;
+				text-align: center;
+				box-sizing: border-box;
+				font-size: 32rpx;
+				color: #7D7D7F;
+				margin-right: 64rpx;
+
+				&.active {
+					font-size: 36rpx;
+					font-weight: bold;
+					color: #000000;
+
+				}
+
+				&.active::after {
+					content: '';
+					z-index: 1;
+					position: absolute;
+					bottom: 0rpx; // 至少与.tabs-item的padding-bottom一致,才能保证在底部边缘
+					width: 36rpx;
+					height: 6rpx;
+					border-radius: 6rpx;
+					left: 0;
+					right: 0;
+					margin: auto;
+					background: #22C572;
+				}
+			}
+		}
+
+		// 平分的方式显示item
+		.tabs-flex {
+			display: flex;
+
+			// .tab-item {
+			// 	flex: 1;
+			// }
+		}
+
+		// 居左显示item,支持水平滑动
+		.tabs-scroll {
+			.tab-item {
+				display: inline-block;
+			}
+		}
+
+		// 选中tab的线
+		// .tabs-line {
+		// 	z-index: 1;
+		// 	position: absolute;
+		// 	bottom: 30rpx; // 至少与.tabs-item的padding-bottom一致,才能保证在底部边缘
+		// 	width: 36rpx;
+		// 	height: 6rpx;
+		// 	transform: translateX(-50%);
+		// 	border-radius: 6rpx;
+		// 	transition: left .3s;
+		// 	background: #22C572;
+		// }
+	}
+</style>

pages.json

@@ -16,7 +16,7 @@
 				"text": "资讯"
 			},
 			{
-				"pagePath": "pages/business/businessNew",
+				"pagePath": "pages/business/business",
 				"iconPath": "static/img/jiaoyi.png",
 				"selectedIconPath": "static/img/jiaoyi_check.png",
 				"text": "交易"

pages/business/businessNew.vue

@@ -0,0 +1,266 @@
+<template>
+	<view>
+		<u-navbar back-text="" title="交易" title-size='36' back-icon-name='search' :title-bold='true'
+			:border-bottom='false' back-icon-color='#333333' title-color='#000000'>
+			<view class="slot-wrap" slot="right">
+				我的关注
+			</view>
+		</u-navbar>
+		<view class="top-warp">
+			<me-tabs v-model="tabIndex" :tabs="tabs" @change="tabChange"></me-tabs>
+		</view>
+		<mescroll-body ref="mescrollRef" @init="mescrollInit" top="80" @down="downCallback" :up="upOption"
+			@up="upCallback" @emptyclick="emptyClick">
+			<!-- 数据列表 -->
+			<view class="list" v-if="goods.length!=0">
+				<view class="list-item" v-for="(item,index) in goods">
+					<view class="row1 flex jcsb alc">
+						<view class="left flex alc">
+							<image src="../../static/img/face/27.png" mode="widthFix" class="head-img"></image>
+							<view class="">
+								<view class="title">
+									中天昊元粮库
+								</view>
+								<view class="bottom">
+									<text class="color1">采购</text>
+									<text class="color2">销售</text>
+									<text class="color3">5分钟前</text>
+								</view>
+							</view>
+						</view>
+						<view class="right">
+							<u-icon name="plus" color="#333333" size="17"></u-icon><text class="case">关注</text>
+						</view>
+					</view>
+				</view>
+			</view>
+
+			<!-- <good-list :list="goods"></good-list> -->
+		</mescroll-body>
+	</view>
+</template>
+
+<script>
+	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
+	import {
+		apiGoods
+	} from "@/api/mock.js"
+
+	export default {
+		mixins: [MescrollMixin], // 使用mixin
+		data() {
+			return {
+				upOption: {
+					// page: {
+					// 	num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
+					// 	size: 10 // 每页数据的数量
+					// },
+					noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
+					empty: {
+						tip: '~ 搜索无数据 ~', // 提示
+						btnText: '去看看'
+					}
+				},
+				goods: [], //列表数据
+				tabs: [{
+					name: '全部',
+					type: 'xx'
+				}, {
+					name: '采购',
+					type: 'xx'
+				}, {
+					name: '销售',
+					type: 'xx'
+				}, {
+					name: '关注',
+					type: 'xx'
+				}],
+				tabIndex: 0 // tab下标
+			}
+		},
+
+
+		onShow() {
+			uni.showTabBar()
+			uni.hideKeyboard()
+			var userInfo = uni.getStorageSync("userInfo")
+			var that = this
+			console.log("userInfo", userInfo)
+			// setTimeout(function() {
+			// 	that.$api.doRequest('get', '/appVersion/test', {
+			// 		userId: "7e83070d05fc4d50aaa46e00a3ee03d8"
+			// 	}).then(res => {
+
+			// 	})
+			// }, 500);
+			uni.removeTabBarBadge({
+				index: 4
+			})
+			this.$api.doRequest('get', '/newNoticeTask/query/noticeTasks').then(res => {
+				if (res.data.data) {
+					let name = 'myTip';
+					let value = res.data.data.total;
+					that.$store.commit('$uStore', {
+						name,
+						value
+					});
+					if (value != 0 && value) {
+						uni.setTabBarBadge({
+							index: 4,
+							text: value + ""
+						})
+					}
+					name = 'taskTip';
+					value = res.data.data.total;
+					that.$store.commit('$uStore', {
+						name,
+						value
+					});
+				}
+			})
+		},
+		onLoad(options) {
+
+		},
+
+
+		methods: {
+			/*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
+			upCallback(page) {
+				//联网加载数据
+				let curTab = this.tabs[this.tabIndex]
+				let keyword = curTab.name // 具体项目中,您可能取的是tab中的type,status等字段
+				apiGoods(page.num, page.size, keyword).then(res => {
+					//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
+					this.mescroll.endSuccess(res.list.length);
+					//设置列表数据
+					if (page.num == 1) this.goods = []; //如果是第一页需手动制空列表
+					this.goods = this.goods.concat(res.list); //追加新数据
+				}).catch(() => {
+					//联网失败, 结束加载
+					this.mescroll.endErr();
+				})
+			},
+			//点击空布局按钮的回调
+			emptyClick() {
+				uni.showToast({
+					title: '点击了按钮,具体逻辑自行实现'
+				})
+			},
+
+			// 切换菜单
+			tabChange() {
+				this.goods = [] // 先置空列表,显示加载进度
+				this.mescroll.resetUpScroll() // 再刷新列表数据
+			}
+
+		}
+	}
+</script>
+
+<style lang='scss'>
+	page,
+	.content {
+		background: #F5F6FA;
+	}
+
+	.flex {
+		display: flex;
+	}
+
+	.alc {
+		align-items: center;
+	}
+
+	.jcse {
+		justify-content: space-evenly;
+	}
+
+	.jcsb {
+		justify-content: space-between;
+	}
+
+	.top-warp {
+		z-index: 9990;
+		position: fixed;
+		top: --window-top;
+		/* css变量 */
+		left: 0;
+		width: 100%;
+		/* height: 120upx; */
+		background-color: white;
+	}
+
+
+	.top-warp .tip {
+		font-size: 28upx;
+		height: 60upx;
+		line-height: 60upx;
+		text-align: center;
+	}
+
+	.slot-wrap {
+		margin-right: 45rpx;
+		font-size: 32rpx;
+	}
+
+	.list {
+		margin: 0 20rpx;
+
+		.list-item {
+			padding: 26rpx 17rpx;
+			background: #fff;
+			margin-bottom: 20rpx;
+			border-radius: 20rpx;
+
+			.row1 {
+
+				.head-img {
+					width: 72rpx;
+					background-color: red;
+					border-radius: 8rpx;
+					margin-right: 22rpx;
+				}
+
+				.left {
+					.title {
+						font-weight: 700;
+						color: #333333;
+					}
+
+					.bottom {
+						.color1 {
+							font-size: 24rpx;
+							padding: 4rpx 10rpx;
+							color: #fff;
+							display: inline-block;
+							background: linear-gradient(180deg, #607AE0 0%, #516CDC 100%);
+							border-radius: 4rpx;
+						}
+
+						.color2 {
+							font-size: 24rpx;
+							padding: 4rpx 10rpx;
+							color: #fff;
+							display: inline-block;
+							background: linear-gradient(180deg, #FD714F 0%, #FD613C 100%);
+							border-radius: 4rpx;
+						}
+
+						.color3 {
+							font-size: 24rpx;
+							color: #AFB3BF;
+							margin-left: 14rpx;
+
+						}
+					}
+				}
+
+				.right {
+
+					border: 1px solid #CDCDCD;
+				}
+			}
+		}
+	}
+</style>

pages/dataReport/Inventoryentrydetails.vue

@@ -15,7 +15,7 @@
 		<view>
 			<view class='contractwrap' v-for='(item,index) in warehouseList'>
 				<view class='flex contractwrap-title'>
-					<view class='contractNo'>{{item.contractNo}}</view>
+					<view class='contractNo'>{{item.warehouseName}}</view>
 					<view class='contractNo'>{{item.issuingTime}}</view>
 				</view>
 				<view v-for='(item1,index1) in item.goodsNameList ' style='background:#EFFAF4;border-radius:10rpx;'>

pages/dataReport/breakdownofprofit.vue

@@ -2,7 +2,8 @@
 	<view>
 		<view class='fixedbox' :style='{"top":customBar+"px"}'>
 			<view class='search'>
-				<u-search  placeholder='可按合同编号或买方、卖方名称查找' search-icon-color='#AFB3BF' bg-color='#F5F6F9' :shape='"round"'  :clearabled="true" :show-action='false'></u-search>
+				<u-search placeholder='可按合同编号或买方、卖方名称查找' search-icon-color='#AFB3BF' bg-color='#F5F6F9' :shape='"round"'
+					:clearabled="true" :show-action='false'></u-search>
 			</view>
 			<view style='background:#fff;'>
 				<view class='contracttypewrap'>
@@ -17,31 +18,32 @@
 		<view style='margin:184rpx 20rpx 20rpx;' v-if='contractList.length>0'>
 			<view class='contractwrap' v-for='(item,index) in contractList'>
 				<view class='flex contractwrap-title'>
-					<view class='contractNo'>{{item.contractNo}}</view>
+					<view class='contractNo' style="font-weight: 700;">{{item.contractNo}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">买方</view>
 					<view>{{item.buyer}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">卖方</view>
 					<view>{{item.seller}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">最终完成量（吨）</view>
 					<view>{{item.finalTradingVolume}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">利润（元）</view>
 					<view>{{item.profit}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">结算日期</view>
 					<view>{{item.settlementDate}}</view>
 				</view>
 			</view>
 		</view>
-		<view v-if='show' :style="{'margin-top':contractList.length==0?'184rpx':'0'}" style='text-align:center;background:#F2F6FA;'>暂无更多数据</view>
+		<view v-if='show' :style="{'margin-top':contractList.length==0?'184rpx':'0'}"
+			style='text-align:center;background:#F2F6FA;'>暂无更多数据</view>
 	</view>
 </template>
 
@@ -49,63 +51,63 @@
 	export default {
 		data() {
 			return {
-				customBar:0,
-				contractType:1,
-				searchContractType:1,
+				customBar: 0,
+				contractType: 1,
+				searchContractType: 1,
 				currentPage: 1,
 				pageSize: 10,
-				show:false,
-				contractList:[]
+				show: false,
+				contractList: []
 			}
 		},
-		onLoad(){
-			
+		onLoad() {
+
 			uni.getSystemInfo({
-			    success: (e) => {
-			      // this.compareVersion(e.SDKVersion, '2.5.0')
-			      let statusBar = 0  //状态栏高度
-			      let customBar = 0  // 状态栏高度 + 导航栏高度  
-			      let navbar = 0 // 自定义标题与胶囊对齐高度
-			      
-			      
-			      // #ifdef MP
-			      statusBar = e.statusBarHeight
-			      customBar = e.statusBarHeight + 45
-			      if (e.platform === 'android') {
-			        this.$store.commit('SET_SYSTEM_IOSANDROID', false)
-			        customBar = e.statusBarHeight + 50
-			      }
-			      // #endif
-			      
-			      
-			      // #ifdef MP-WEIXIN
-			      statusBar = e.statusBarHeight
-			      const custom = wx.getMenuButtonBoundingClientRect()
-			      customBar = custom.bottom + custom.top - e.statusBarHeight
-			 
-			      navbar = (custom.top - e.statusBarHeight) * 2 + custom.height
-			      // #endif
-			 
-			 
-			      // #ifdef MP-ALIPAY
-			      statusBar = e.statusBarHeight
-			      customBar = e.statusBarHeight + e.titleBarHeight
-			      // #endif
-			 
-			 
-			      // #ifdef APP-PLUS
-			      console.log('app-plus', e)
-			      statusBar = e.statusBarHeight
-			      customBar = e.statusBarHeight + 45
-			      // #endif
-			 
-			 
-			      // #ifdef H5
-			      statusBar = 0
-			      customBar = e.statusBarHeight + 45
-			      // #endif
-					this.customBar=customBar
-			    }
+				success: (e) => {
+					// this.compareVersion(e.SDKVersion, '2.5.0')
+					let statusBar = 0 //状态栏高度
+					let customBar = 0 // 状态栏高度 + 导航栏高度  
+					let navbar = 0 // 自定义标题与胶囊对齐高度
+
+
+					// #ifdef MP
+					statusBar = e.statusBarHeight
+					customBar = e.statusBarHeight + 45
+					if (e.platform === 'android') {
+						this.$store.commit('SET_SYSTEM_IOSANDROID', false)
+						customBar = e.statusBarHeight + 50
+					}
+					// #endif
+
+
+					// #ifdef MP-WEIXIN
+					statusBar = e.statusBarHeight
+					const custom = wx.getMenuButtonBoundingClientRect()
+					customBar = custom.bottom + custom.top - e.statusBarHeight
+
+					navbar = (custom.top - e.statusBarHeight) * 2 + custom.height
+					// #endif
+
+
+					// #ifdef MP-ALIPAY
+					statusBar = e.statusBarHeight
+					customBar = e.statusBarHeight + e.titleBarHeight
+					// #endif
+
+
+					// #ifdef APP-PLUS
+					console.log('app-plus', e)
+					statusBar = e.statusBarHeight
+					customBar = e.statusBarHeight + 45
+					// #endif
+
+
+					// #ifdef H5
+					statusBar = 0
+					customBar = e.statusBarHeight + 45
+					// #endif
+					this.customBar = customBar
+				}
 			})
 		},
 		onShow() {
@@ -113,36 +115,39 @@
 		},
 		onReachBottom() { //上拉触底函数
 			// if (this.statusFlag == 3) {
-				if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
-					this.pageSize += 1
-					this.currentPage += 1
-					this.getList()
-				}
+			if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
+				this.pageSize += 1
+				this.currentPage += 1
+				this.getList()
+			}
 			// }
 		},
 		methods: {
-			getList(){
+			getList() {
+				uni.showLoading({
+					title: '数据加载中'
+				})
 				this.$api.doRequest('get', '/contractManagementInfo/selectContractInfo', {
-					searchContractType:this.searchContractType,
+					searchContractType: this.searchContractType,
 					currentPage: this.currentPage,
 					pageSize: this.pageSize,
 				}).then(res => {
-					if(res.data.code){
+					if (res.data.code) {
 						uni.hideLoading()
-						if(res.data.data.records.length>0){
-							this.show=false
-							if(this.currentPage==1){
-								this.contractList=res.data.data.records
-							}else{
-								this.contractList=this.contractList.concat(res.data.data.records)
+						if (res.data.data.records.length > 0) {
+							this.show = false
+							if (this.currentPage == 1) {
+								this.contractList = res.data.data.records
+							} else {
+								this.contractList = this.contractList.concat(res.data.data.records)
 							}
-						}else{
-							this.show=true
-							if(this.currentPage==1){
-								this.contractList=[]
+						} else {
+							this.show = true
+							if (this.currentPage == 1) {
+								this.contractList = []
 							}
 						}
-					}else{
+					} else {
 						uni.hideLoading()
 						uni.showToast({
 							title: "系统异常，请联系管理员",
@@ -156,65 +161,78 @@
 	}
 </script>
 
-<style  lang='scss' scoped>
-	.fixedbox{
-		position:fixed;width:100%;top:0;background:#fff;
-		padding-top:20rpx;
-	}
-.contracttypewrap{
-	display:flex;
-	background:#fff;
-	font-size:32rpx;
-	margin: 0 auto;
-	width:93%;
-	.item{
-		padding:20rpx;
-		color:#7A7A7A;
-		width:33.3333%;
-		text-align:center;
+<style lang='scss' scoped>
+	.fixedbox {
+		position: fixed;
+		width: 100%;
+		top: 0;
+		background: #fff;
+		padding-top: 20rpx;
 	}
-	.item.left{
-		text-align:left;
-	}
-	.item.right{
-		text-align:right;
+
+	.contracttypewrap {
+		display: flex;
+		background: #fff;
+		font-size: 32rpx;
+		margin: 0 auto;
+		width: 93%;
+
+		.item {
+			padding: 20rpx;
+			color: #7A7A7A;
+			width: 33.3333%;
+			text-align: center;
+		}
+
+		.item.left {
+			text-align: left;
+		}
+
+		.item.right {
+			text-align: right;
+		}
+
+		.item.active {
+			color: #262626;
+			font-weight: 600;
+		}
 	}
-	.item.active{
-		color:#262626;
-		font-weight:600;
+
+	.contractwrap {
+		background: #fff;
+		margin: 20rpx;
+		padding: 20rpx;
+		border-radius: 20rpx;
+
+		.contractwrap-title {
+			font-size: 28rpx;
+			padding: 20rpx;
+			justify-content: space-between;
+			border-bottom: 2rpx solid #eee;
+			align-items: center;
+
+		}
+
+		.contractwrap-item {
+			display: flex;
+			justify-content: space-between;
+			padding: 10rpx 20rpx;
+			font-size: 28rpx;
+
+			.title {
+				font-size: 24rpx;
+				color: #8F8F8F;
+			}
+		}
 	}
-}
-
-.contractwrap{
-	background:#fff;
-	margin:20rpx;
-	padding:20rpx;
-	border-radius:20rpx;
-	.contractwrap-title{
-		font-size:28rpx;
-		padding:20rpx;
-		justify-content: space-between;
-		border-bottom:2rpx solid #eee;
-		align-items: center;
-		
+
+	.search {
+		width: 100vw;
+		background: #fff;
 	}
-	.contractwrap-item{
-		display:flex;
-		justify-content: space-between;
-		padding:10rpx 20rpx;
-		font-size:28rpx;
-		.title{
-			font-size:24rpx;
-			color:#8F8F8F;
-		}
+
+	.u-search {
+		width: 94%;
+		margin: 0 auto !important;
 	}
-}
-.search{
-	width:100vw;
-	background:#fff;
-}
-.u-search{
-	width:94%;
-	margin:0 auto !important;
-}
 </style>

pages/dataReport/contractdetails/contractdetails.vue

@@ -2,15 +2,21 @@
 	<view>
 		<view class='fixedbox' :style='{"top":customBar+"px"}'>
 			<view class='search'>
-				<u-search  placeholder='可按合同编号或买方、卖方名称查找' search-icon-color='#AFB3BF' bg-color='#F5F6F9' :shape='"round"'  :clearabled="true" :show-action='false'></u-search>
+				<u-search placeholder='可按合同编号或买方、卖方名称查找' search-icon-color='#AFB3BF' bg-color='#F5F6F9' :shape='"round"'
+					:clearabled="true" :show-action='false'></u-search>
 			</view>
 			<view style='background:#fff;'>
 				<view class='contracttypewrap'>
-					<view  :class='agreementType=="销售合同"?"active":""' @click='contractclick("销售合同")' class='item left'>销售</view>
-					<view :class='agreementType=="采购合同"?"active":""' @click='contractclick("采购合同")' class='item'>采购</view>
-					<view :class='agreementType=="收购合同"?"active":""' @click='contractclick("收购合同")' class='item'>收购</view>
-					<view :class='agreementType=="代收合同"?"active":""' @click='contractclick("代收合同")' class='item'>代收</view>
-					<view :class='agreementType=="代储合同"?"active":""' @click='contractclick("代储合同")' class='item right'>代储</view>
+					<view :class='agreementType=="销售合同"?"active":""' @click='contractclick("销售合同")' class='item left'>销售
+					</view>
+					<view :class='agreementType=="采购合同"?"active":""' @click='contractclick("采购合同")' class='item'>采购
+					</view>
+					<view :class='agreementType=="收购合同"?"active":""' @click='contractclick("收购合同")' class='item'>收购
+					</view>
+					<view :class='agreementType=="代收合同"?"active":""' @click='contractclick("代收合同")' class='item'>代收
+					</view>
+					<view :class='agreementType=="代储合同"?"active":""' @click='contractclick("代储合同")' class='item right'>
+						代储</view>
 				</view>
 			</view>
 			<view class='costwrap'>
@@ -20,7 +26,7 @@
 				<view :class='searchType==2?"active":""' @click='searchTypeclick(2)' class='item'>已完成</view>
 			</view>
 		</view>
-		
+
 		<view style='margin:260rpx 20rpx 20rpx;' v-if='contractList.length>0'>
 			<view class='contractwrap' v-for='(item,index) in contractList'>
 				<view class='flex contractwrap-title'>
@@ -29,41 +35,44 @@
 					<view v-if='item.status=="已完成"' style='color:#AFB3BF;' class='status'>{{item.status}}</view>
 					<view v-if='item.status=="执行中"' style='color:#22C572;' class='status'>{{item.status}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">买方</view>
 					<view>{{item.buyer}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">卖方</view>
 					<view>{{item.seller}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">合同重量（吨）</view>
 					<view>{{item.weight}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">合同单价（元/吨）</view>
-					<view>{{item.unitContractPrice?item.unitContractPrice:0}}</view>
+					<view v-if="item.priceType='随行就市'">随行就市</view>
+					<view v-else>{{item.unitContractPrice?item.unitContractPrice:0}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">合同总价（元）</view>
-					<view>{{item.totalContractPrice?item.totalContractPrice:0}}</view>
+					<view v-if="item.priceType='随行就市'"></view>
+					<view v-else>{{item.totalContractPrice?item.totalContractPrice:0}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">已付款（元）</view>
 					<view>{{item.mildewGrain}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">已开发票（元）</view>
 					<view>{{item.invoiced?item.invoiced:0}}</view>
 				</view>
-				<view  class='flex contractwrap-item'>
+				<view class='flex contractwrap-item'>
 					<view class="title">签订日期</view>
 					<view>{{item.signingDate}}</view>
 				</view>
 			</view>
 		</view>
-		<view v-if='show' :style="{'margin-top':contractList.length==0?'260rpx':'0'}" style='text-align:center;background:#F2F6FA;'>暂无更多数据</view>
+		<view v-if='show' :style="{'margin-top':contractList.length==0?'260rpx':'0'}"
+			style='text-align:center;background:#F2F6FA;'>暂无更多数据</view>
 	</view>
 </template>
 
@@ -71,64 +80,64 @@
 	export default {
 		data() {
 			return {
-				customBar:0,
+				customBar: 0,
 				// contractType:1,
-				agreementType:'销售合同',
-				currentPage:1,
-				pageSize:10,
-				searchType:'',
-				show:false,
-				contractList:[]
+				agreementType: '销售合同',
+				currentPage: 1,
+				pageSize: 10,
+				searchType: '',
+				show: false,
+				contractList: []
 			}
 		},
-		onLoad(){
-			
+		onLoad() {
+
 			uni.getSystemInfo({
-			    success: (e) => {
-			      // this.compareVersion(e.SDKVersion, '2.5.0')
-			      let statusBar = 0  //状态栏高度
-			      let customBar = 0  // 状态栏高度 + 导航栏高度  
-			      let navbar = 0 // 自定义标题与胶囊对齐高度
-			      
-			      
-			      // #ifdef MP
-			      statusBar = e.statusBarHeight
-			      customBar = e.statusBarHeight + 45
-			      if (e.platform === 'android') {
-			        this.$store.commit('SET_SYSTEM_IOSANDROID', false)
-			        customBar = e.statusBarHeight + 50
-			      }
-			      // #endif
-			      
-			      
-			      // #ifdef MP-WEIXIN
-			      statusBar = e.statusBarHeight
-			      const custom = wx.getMenuButtonBoundingClientRect()
-			      customBar = custom.bottom + custom.top - e.statusBarHeight
-			 
-			      navbar = (custom.top - e.statusBarHeight) * 2 + custom.height
-			      // #endif
-			 
-			 
-			      // #ifdef MP-ALIPAY
-			      statusBar = e.statusBarHeight
-			      customBar = e.statusBarHeight + e.titleBarHeight
-			      // #endif
-			 
-			 
-			      // #ifdef APP-PLUS
-			      console.log('app-plus', e)
-			      statusBar = e.statusBarHeight
-			      customBar = e.statusBarHeight + 45
-			      // #endif
-			 
-			 
-			      // #ifdef H5
-			      statusBar = 0
-			      customBar = e.statusBarHeight + 45
-			      // #endif
-					this.customBar=customBar
-			    }
+				success: (e) => {
+					// this.compareVersion(e.SDKVersion, '2.5.0')
+					let statusBar = 0 //状态栏高度
+					let customBar = 0 // 状态栏高度 + 导航栏高度  
+					let navbar = 0 // 自定义标题与胶囊对齐高度
+
+
+					// #ifdef MP
+					statusBar = e.statusBarHeight
+					customBar = e.statusBarHeight + 45
+					if (e.platform === 'android') {
+						this.$store.commit('SET_SYSTEM_IOSANDROID', false)
+						customBar = e.statusBarHeight + 50
+					}
+					// #endif
+
+
+					// #ifdef MP-WEIXIN
+					statusBar = e.statusBarHeight
+					const custom = wx.getMenuButtonBoundingClientRect()
+					customBar = custom.bottom + custom.top - e.statusBarHeight
+
+					navbar = (custom.top - e.statusBarHeight) * 2 + custom.height
+					// #endif
+
+
+					// #ifdef MP-ALIPAY
+					statusBar = e.statusBarHeight
+					customBar = e.statusBarHeight + e.titleBarHeight
+					// #endif
+
+
+					// #ifdef APP-PLUS
+					console.log('app-plus', e)
+					statusBar = e.statusBarHeight
+					customBar = e.statusBarHeight + 45
+					// #endif
+
+
+					// #ifdef H5
+					statusBar = 0
+					customBar = e.statusBarHeight + 45
+					// #endif
+					this.customBar = customBar
+				}
 			})
 		},
 		onShow() {
@@ -136,53 +145,53 @@
 		},
 		onReachBottom() { //上拉触底函数
 			// if (this.statusFlag == 3) {
-				if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
-					this.pageSize += 1
-					this.currentPage += 1
-					this.getList()
-				}
+			if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
+				this.pageSize += 1
+				this.currentPage += 1
+				this.getList()
+			}
 			// }
 		},
 		methods: {
-			contractclick(status){
+			contractclick(status) {
 				this.currentPage = 1
-				this.agreementType=status
+				this.agreementType = status
 				this.getList()
 			},
-			searchTypeclick(status){
+			searchTypeclick(status) {
 				this.currentPage = 1
-				this.searchType=status
+				this.searchType = status
 				this.getList()
 			},
-			getList(){
+			getList() {
 				uni.showLoading({
 					title: "正在加载"
 				})
 				this.$api.doRequest('get', '/contractManagementInfo/selectInfo', {
-					compId:uni.getStorageSync('pcUserInfo').compId,
-					goodsType:1,
+					compId: uni.getStorageSync('pcUserInfo').compId,
+					goodsType: 1,
 					agreementType: this.agreementType,
 					currentPage: this.currentPage,
 					pageSize: this.pageSize,
-					searchType:this.searchType,
-					appFlag:1,
+					searchType: this.searchType,
+					appFlag: 1,
 				}).then(res => {
-					if(res.data.code){
+					if (res.data.code) {
 						uni.hideLoading()
-						if(res.data.data.records.length>0){
-							this.show=false
-							if(this.currentPage==1){
-								this.contractList=res.data.data.records
-							}else{
-								this.contractList=this.contractList.concat(res.data.data.records)
+						if (res.data.data.records.length > 0) {
+							this.show = false
+							if (this.currentPage == 1) {
+								this.contractList = res.data.data.records
+							} else {
+								this.contractList = this.contractList.concat(res.data.data.records)
 							}
-						}else{
-							this.show=true
-							if(this.currentPage==1){
-								this.contractList=[]
+						} else {
+							this.show = true
+							if (this.currentPage == 1) {
+								this.contractList = []
 							}
 						}
-					}else{
+					} else {
 						uni.hideLoading()
 						uni.showToast({
 							title: "系统异常，请联系管理员",
@@ -196,78 +205,96 @@
 	}
 </script>
 
-<style  lang='scss' scoped>
-	.fixedbox{
-		position:fixed;width:100%;top:0;background:#fff;
-		padding-top:20rpx;
+<style lang='scss' scoped>
+	.fixedbox {
+		position: fixed;
+		width: 100%;
+		top: 0;
+		background: #fff;
+		padding-top: 20rpx;
 	}
-.contracttypewrap{
-	display:flex;
-	background:#fff;
-	font-size:32rpx;
-	margin: 0 auto;
-	width:93%;
-	.item{
-		padding:20rpx;
-		color:#7A7A7A;
-		width:33.3333%;
-		text-align:center;
-	}
-	.item.left{
-		text-align:left;
-	}
-	.item.right{
-		text-align:right;
-	}
-	.item.active{
-		color:#262626;
-		font-weight:600;
+
+	.contracttypewrap {
+		display: flex;
+		background: #fff;
+		font-size: 32rpx;
+		margin: 0 auto;
+		width: 93%;
+
+		.item {
+			padding: 20rpx;
+			color: #7A7A7A;
+			width: 33.3333%;
+			text-align: center;
+		}
+
+		.item.left {
+			text-align: left;
+		}
+
+		.item.right {
+			text-align: right;
+		}
+
+		.item.active {
+			color: #262626;
+			font-weight: 600;
+		}
 	}
-}
-.costwrap{
-	display:flex;
-	margin:10rpx 34rpx;
-	.item{
-		padding:10rpx 20rpx;
-		color:#333333;
-		text-align:center;
-		border-radius:30rpx;
+
+	.costwrap {
+		display: flex;
+		margin: 10rpx 34rpx;
+
+		.item {
+			padding: 10rpx 20rpx;
+			color: #333333;
+			text-align: center;
+			border-radius: 30rpx;
+		}
+
+		.item.active {
+			color: #fff;
+			background: #22C572;
+		}
 	}
-	.item.active{
-		color:#fff;
-		background:#22C572;
+
+	.contractwrap {
+		background: #fff;
+		margin: 20rpx;
+		padding: 20rpx;
+		border-radius: 20rpx;
+
+		.contractwrap-title {
+			font-size: 28rpx;
+			padding: 20rpx;
+			justify-content: space-between;
+			border-bottom: 2rpx solid #eee;
+			align-items: center;
+			font-weight: 700;
+
+		}
+
+		.contractwrap-item {
+			display: flex;
+			justify-content: space-between;
+			padding: 10rpx 20rpx;
+			font-size: 28rpx;
+
+			.title {
+				font-size: 24rpx;
+				color: #8F8F8F;
+			}
+		}
 	}
-}
-.contractwrap{
-	background:#fff;
-	margin:20rpx;
-	padding:20rpx;
-	border-radius:20rpx;
-	.contractwrap-title{
-		font-size:28rpx;
-		padding:20rpx;
-		justify-content: space-between;
-		border-bottom:2rpx solid #eee;
-		align-items: center;
-		
+
+	.search {
+		width: 100vw;
+		background: #fff;
 	}
-	.contractwrap-item{
-		display:flex;
-		justify-content: space-between;
-		padding:10rpx 20rpx;
-		font-size:28rpx;
-		.title{
-			font-size:24rpx;
-			color:#8F8F8F;
-		}
+
+	.u-search {
+		width: 94%;
+		margin: 0 auto !important;
 	}
-}
-.search{
-	width:100vw;
-	background:#fff;
-}
-.u-search{
-	width:94%;
-	margin:0 auto !important;
-}
 </style>

pages/dataReport/costbreakdown.vue

@@ -89,22 +89,22 @@
 			}
 		},
 		onLoad(options) {
-			console.log(options.data)
-
-			if (options.type == 1) {
-				// 获取月份的天数
-				let _days = new Date(options.data.split('-')[0], options.data.split('-')[1], 0).getDate()
-				console.log(_days)
-				this.expenseInfo = {
-					startDate: options.data + '-01',
-					endDate: options.data + '-' + _days
-				}
-			} else if (options.type == 2) {
-				this.expenseInfo = {
-					startDate: options.data + '-01-01',
-					endDate: options.data + '-12-31'
-				}
-			}
+			// console.log(options.data)
+
+			// if (options.type == 2) {
+			// 	// 获取月份的天数
+			// 	let _days = new Date(options.data.split('-')[0], options.data.split('-')[1], 0).getDate()
+			// 	console.log(_days)
+			// 	this.expenseInfo = {
+			// 		startDate: options.data + '-01',
+			// 		endDate: options.data + '-' + _days
+			// 	}
+			// } else if (options.type == 1) {
+			// 	this.expenseInfo = {
+			// 		startDate: options.data + '-01-01',
+			// 		endDate: options.data + '-12-31'
+			// 	}
+			// }
 			console.log(this.expenseInfo)
 			uni.getSystemInfo({
 				success: (e) => {