Pārlūkot izejas kodu

feat:合作伙伴和我的分组页面

zhanghui 2 gadi atpakaļ
vecāks
revīzija
8026685fdb

+ 16 - 0
pages.json

@@ -106,6 +106,22 @@
 				"navigationStyle": "custom",
 				"enablePullDownRefresh" : false
 			}
+		},
+		{
+			"path" : "pages/myGroup/myGroup",
+			"style" :
+			{
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
+		},
+		{
+			"path" : "pages/cooperation/cooperation",
+			"style" :
+			{
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
 		}
 	],
 	"tabBar": {

+ 39 - 0
pages/cooperation/cooperation.vue

@@ -0,0 +1,39 @@
+<template>
+	<view class="page">
+		<uni-nav-bar  :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true"  left-icon="left" title="合作伙伴" @clickLeft="back" />
+		<view :style="{height:height}" class="list">
+			<mescroll-item ref="MescrollItem" :i="0"  :index="0"  :height="height">
+			</mescroll-item>
+		</view>
+	</view>
+</template>
+
+<script>
+	import MescrollItem from "./module/mescrollUni-item.vue";
+	export default {
+		components: {
+			MescrollItem
+		},
+		data() {
+			return {
+				height:''
+			}
+		},
+		onLoad(e) {
+			let sysInfo = uni.getSystemInfoSync()
+			this.height = sysInfo.windowHeight  - 70 + 'px' //除标题栏栏外的屏幕可用高度
+		},
+		methods: {
+			back() {
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+		}
+	}
+</script>
+
+
+<style lang="scss" scoped>
+	@import './index.rpx.css';
+</style>

+ 5 - 0
pages/cooperation/index.rpx.css

@@ -0,0 +1,5 @@
+.page {
+	background: #F7F7F7;
+	padding: 0 32rpx;
+	height: 100vh;
+}

+ 57 - 0
pages/cooperation/module/index.rpx.css

@@ -0,0 +1,57 @@
+.item{
+    width: 638rpx;
+    height: 280rpx;
+    background: #FFFFFF;
+    border-radius: 16rpx;
+    margin-top: 24rpx;
+    padding: 0 24rpx;
+    position: relative;
+}
+.storeName{
+    height: 48rpx;
+    font-size: 28rpx;
+    font-weight: 400;
+    color: #666666;
+    line-height: 48rpx;
+    margin-top: 24rpx;
+}
+.time{
+    height: 48rpx;
+    font-size: 28rpx;
+    font-weight: 400;
+    color: #999999;
+    line-height: 48rpx;
+    margin-top: 24rpx;
+}
+.name{
+    height: 48rpx;
+    font-size: 28rpx;
+    font-weight: 700;
+    color: #333333;
+    line-height: 48rpx;
+    margin-top: 8rpx;
+}
+.icon-num{
+    margin-top: 16rpx;
+}
+.key{
+    height: 44rpx;
+    font-size: 28rpx;
+    font-weight: 400;
+    color: #999999;
+    line-height: 44rpx;
+    margin-left: 12rpx;
+}
+.number{
+    height: 44rpx;
+    font-size: 28rpx;
+    font-weight: 700;
+    color: #333333;
+    line-height: 44rpx;
+    margin-left: 12rpx;
+}
+.xiugai{
+    position:absolute;
+    bottom: 26rpx;
+    right: 26rpx;
+}

+ 148 - 0
pages/cooperation/module/mescrollUni-item.vue

@@ -0,0 +1,148 @@
+<template>
+	<!--
+    swiper中的transfrom会使fixed失效,此时用height固定高度;
+    swiper中无法触发mescroll-mixins.js的onPageScroll和onReachBottom方法,只能用mescroll-uni,不能用mescroll-body
+    -->
+	<!-- ref动态生成: 字节跳动小程序编辑器不支持一个页面存在相同的ref (如不考虑字节跳动小程序可固定值为 ref="mescrollRef") -->
+	<!-- top的高度等于悬浮菜单tabs的高度 -->
+	<mescroll-uni :ref="'mescrollRef' + i" @init="mescrollInit" :height="height" :down="downOption" @down="downCallback"
+		:up="upOption" @up="upCallback" @emptyclick="emptyClick">
+		<view>
+			<view class="item" v-for="(item,index) in 10" :key="index">
+				<view class="flex-row justify-between">
+					<text class="storeName">好又多母婴店</text>
+					<text class="time">2023-01-05</text>
+				</view>
+				<view class="flex-row justify-between">
+					<text class="name">张三</text>
+				</view>
+				<view class="flex-row icon-num">
+					<u-icon size="24" name="/static/group/zhituirenshu.png"></u-icon>
+					<text class="key">直推人数:</text>
+					<text class="number">300人</text>
+				</view>
+				<view class="flex-row icon-num">
+					<u-icon size="24" name="/static/group/xiaofeijine.png"></u-icon>
+					<text class="key">消费金额:</text>
+					<text class="number">300元</text>
+				</view>
+				<u-icon size="30" name="/static/group/xiugai.png" class="xiugai"></u-icon>
+			</view>
+		</view>
+
+	</mescroll-uni>
+</template>
+
+<script>
+	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
+	import MescrollMoreItemMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-more-item.js"
+	export default {
+		mixins: [MescrollMixin, MescrollMoreItemMixin], // 注意此处还需使用MescrollMoreItemMixin (必须写在MescrollMixin后面)
+		components: {
+		},
+
+		data() {
+			return {
+				downOption: {
+					auto: false // 不自动加载 (mixin已处理第一个tab触发downCallback)
+				},
+				upOption: {
+					auto: false, // 不自动加载
+					// page: {
+					// 	num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
+					// 	size: 10 // 每页数据的数量
+					// },
+					noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
+					empty: {
+						icon: '/static/dataNull.png',
+						tip: '暂无内容', // 提示
+						// btnText: '去看看'
+					},
+					textNoMore: '没有更多了'
+				},
+				list:[],
+			}
+		},
+		props: {
+			i: Number, // 每个tab页的专属下标 (除了支付宝小程序必须在这里定义, 其他平台都可不用写, 因为已在MescrollMoreItemMixin定义)
+			index: { // 当前tab的下标 (除了支付宝小程序必须在这里定义, 其他平台都可不用写, 因为已在MescrollMoreItemMixin定义)
+				type: Number,
+				default () {
+					return 0
+				}
+			},
+
+			height: [Number, String], // mescroll的高度
+
+		},
+		watch:{
+
+		},
+
+		created(){
+
+
+		},
+
+		methods: {
+
+
+			/*下拉刷新的回调 */
+			downCallback() {
+				// 这里加载你想下拉刷新的数据, 比如刷新轮播数据
+				// loadSwiper();
+				// 下拉刷新的回调,默认重置上拉加载列表为第一页 (自动执行 page.num=1, 再触发upCallback方法 )
+				this.mescroll.resetUpScroll()
+			},
+			/*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
+			upCallback(page) {
+
+				//联网加载数据
+				let httpData = {
+					pageNum:page.num,
+					pageSize:10
+				}
+
+				this.$api.service.getRecord(httpData).then((res) => {
+					//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
+					this.mescroll.endSuccess(res.data.data.length,res.data.data.length === 10);
+					//设置列表数据
+					if (page.num === 1) this.list = []; //如果是第一页需手动制空列表
+					this.list = this.list.concat(res.data.data); //追加新数据
+					console.log(this.list)
+				}).catch((err) => {
+					//联网失败, 结束加载
+					this.mescroll.endErr();
+				})
+
+
+			},
+
+			//点击空布局按钮的回调
+			emptyClick() {
+				uni.showToast({
+					title: '点击了按钮,具体逻辑自行实现'
+				})
+			},
+			// 搜索
+			doSearch() {
+				this.list = []; // 先清空列表,显示加载进度
+				this.mescroll.resetUpScroll();
+			},
+
+
+
+
+			goOrderDetail(item){
+				uni.navigateTo({
+					url:'/myPages/transactionRecordDetail/index?item='+JSON.stringify(item)
+				})
+			},
+		}
+	}
+</script>
+<style>
+	@import '/common/css/common.css';
+	@import './index.rpx.css';
+
+</style>

+ 2 - 14
pages/my/my.vue

@@ -1,6 +1,5 @@
 <template>
 	<view class="page" :style="{height:height}">
-<!--		<uni-nav-bar  :fixed="true" background-color="#F7F7F7" :border="false" :statusBar="true"   title="个人中心"  />-->
 		<view class="flex-row use">
 			<view class="avatar" @click="goUserInfo">
 				<image :src="userInfo.selfPhotoUrl || '/static/ud4.png'"></image>
@@ -17,7 +16,6 @@
 		</view>
 
 		<view class="statistics flex-col">
-
 			<view class="flex-row justify-around" v-if="userInfo.isManager == '1'">
 				<view class="flex-row justify-center out ">
 					<view class="flex-col  statisticsItem " @click="navigateTo('/pages/specialistsList/specialistsList')">
@@ -29,7 +27,7 @@
 					</view>
 				</view>
 				<view class="flex-row justify-center out leftBorder">
-					<view class="flex-col statisticsItem " >
+					<view class="flex-col statisticsItem " @click="navigateTo('/pages/cooperation/cooperation')">
 						<view>
 							<image src="/static/my/hezuohuoban.png" class="statisticsImg"></image>
 						</view>
@@ -63,19 +61,9 @@
 
 		<view class="flex-col justify-start list">
 			<uni-list :border="false">
-				<uni-list-item v-if="userInfo.isManager == 1"  :clickable="true" title="我的分组" to="/pages/specialistsList/specialistsList"
-							   showArrow thumb="/static/my/fenzu.png" thumb-size="sm" rightText=""   />
-<!--				<uni-list-item v-if="userInfo.isManager == 1" :clickable="true" title="推广收益(元)"  to="/pages/earningsList/earningsList"-->
-<!--							   showArrow thumb="/static/my/benyuerenwu.png" thumb-size="sm" rightText="" />-->
-<!--				<uni-list-item v-if="userInfo.isManager == 1" :clickable="true" title="我的直推(人)" to="/pages/directPromotionList/directPromotionList"-->
-<!--							   showArrow thumb="/static/my/fuwuTimeLong.png" thumb-size="sm" rightText="" />-->
-				<!--					<uni-list-item v-if="userInfo.isManager !== 1" :clickable="true" title="我的间推(人)" to="/pages/indirectPromotionList/indirectPromotionList"-->
-				<!--								   showArrow thumb="/static/my/fuwuNmber.png" thumb-size="sm" rightText="800" />-->
+				<uni-list-item v-if="userInfo.isManager == 1"  :clickable="true" title="我的分组" to="/pages/myGroup/myGroup" showArrow thumb="/static/my/fenzu.png" thumb-size="sm" rightText=""/>
 			</uni-list>
 		</view>
-
-
-
 	</view>
 </template>
 

+ 69 - 0
pages/myGroup/index.rpx.css

@@ -0,0 +1,69 @@
+.page {
+	background: #F7F7F7;
+	padding: 0 32rpx;
+	height: 100vh;
+}
+.addGroup{
+	width: 686rpx;
+	height: 84rpx;
+	background: #FFE05C;
+	border-radius: 54rpx;
+	font-size: 28rpx;
+	font-weight: 400;
+	color: #333333;
+	line-height: 84rpx;
+	text-align: center;
+	margin-top: 24rpx;
+}
+.item{
+	width: 638rpx;
+	height: 226rpx;
+	background: #FFFFFF;
+	border-radius: 16rpx;
+	margin-top: 24rpx;
+	padding: 0 24rpx;
+	position: relative;
+}
+.storeName{
+	height: 48rpx;
+	font-size: 28rpx;
+	font-weight: 400;
+	color: #666666;
+	line-height: 48rpx;
+	margin-top: 24rpx;
+}
+.time{
+	height: 48rpx;
+	font-size: 28rpx;
+	font-weight: 400;
+	color: #999999;
+	line-height: 48rpx;
+	margin-top: 24rpx;
+}
+.name{
+	height: 48rpx;
+	font-size: 28rpx;
+	font-weight: 700;
+	color: #333333;
+	line-height: 48rpx;
+}
+.icon-num{
+	margin-top: 24rpx;
+}
+.key{
+
+	height: 44rpx;
+	font-size: 28rpx;
+	font-weight: 400;
+	color: #999999;
+	line-height: 44rpx;
+	margin-left: 12rpx;
+}
+.number{
+	height: 44rpx;
+	font-size: 28rpx;
+	font-weight: 700;
+	color: #333333;
+	line-height: 44rpx;
+	margin-left: 12rpx;
+}

+ 56 - 0
pages/myGroup/myGroup.vue

@@ -0,0 +1,56 @@
+<template>
+	<view class="page">
+		<uni-nav-bar  :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true"  left-icon="left" title="我的分组" @clickLeft="back" />
+		<view>
+			<scroll-view scroll-y :style="{height:height}">
+				<view class="flex-col  item" v-for="(item,index) in 100" :key="index">
+					<view class="flex-row justify-between">
+						<text class="storeName">好又多母婴店</text>
+						<text class="time">消费额:1000.55</text>
+					</view>
+					<view class="flex-row icon-num">
+						<u-icon size="24" name="/static/group/fuzeren.png"></u-icon>
+						<text class="key">负责人:</text>
+						<text class="number">张珊</text>
+					</view>
+					<view class="flex-row icon-num">
+						<u-icon size="24" name="/static/group/chengyuan.png"></u-icon>
+						<text class="key">成员:</text>
+						<text class="number">300人</text>
+					</view>
+				</view>
+			</scroll-view>
+		</view>
+		<view class="addGroup">
+			<text>新增分组</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		components: {
+		},
+		data() {
+			return {
+				height:''
+			}
+		},
+		onLoad(e) {
+			let sysInfo = uni.getSystemInfoSync()
+			this.height = sysInfo.windowHeight  - 120 + 'px' //除标题栏栏外的屏幕可用高度
+		},
+		methods: {
+			back() {
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+		}
+	}
+</script>
+
+
+<style lang="scss" scoped>
+	@import './index.rpx.css';
+</style>

BIN
static/group/chengyuan.png


BIN
static/group/fuzeren.png


BIN
static/group/xiaofeijine.png


BIN
static/group/xiugai.png


BIN
static/group/zhituirenshu.png