首页,我的写扫码点餐之前提交1.0.0

2025-02-13 16:49:13 +08:00
parent 6cea5aeb42
commit f2513ef13a
48 changed files with 7757 additions and 514 deletions
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -5,7 +5,8 @@
 			<!-- 轮播图 -->
 			<swipers :carousel='hometoplist.carousel'></swipers>
 			<!-- 广告 -->
-			<advertisement :bannervo='hometoplist.bannerVO' :itemStyle='advertisementStyle'></advertisement>
+			<advertisement :bannervo='hometoplist.bannervo' :itemStyle='advertisementStyle' ref="refbannervo">
+			</advertisement>
 			<!-- 金刚区 -->
 			<diamond :district='hometoplist.district'></diamond>
 			<!-- 今日上线 -->
@@ -22,16 +23,20 @@
 						<view class="flex-between" style="flex-wrap: inherit;">
 							<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu"
 								:key="index" @click="viewHistory(item,index)"
-								:class="!item.isChild && index ? 'fourcontent_itemactev':''">
-								<!-- <view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu" :key="index"
-							@click="viewHistory(item,index)"
-							:class="!item.isChild && viewHistoryindex == index ? 'fourcontent_itemactev':''"> -->
+								:class="!item.isChild && viewHistoryindex == index ? 'fourcontent_itemactev':''">
 								<text style="margin-right: 10rpx;">{{item.name}}</text>
-								<up-icon v-if="item.isChild" style="margin-left: 10rpx;" name="arrow-down-fill"
+								<up-icon v-if="item.isChild" style="margin-left: 10rpx;"
+									:name="showproductlist && viewHistoryindex == index  ?'arrow-up-fill':'arrow-down-fill'"
 									color="#333333" size="12"></up-icon>
 							</view>
 						</view>
+						<view class="componentsclass" v-if="showproductlist">
+							<AreaSelect v-if="viewHistoryindex == 0" @updateValue="openproductlist" />
+							<grouping v-if="viewHistoryindex == 1 || viewHistoryindex == 2 || viewHistoryindex == 3"
+								@grouping="openproductlist" />
+						</view>
 					</view>
+
 				</up-sticky>

 				<!-- 首页抢购区域 -->
@@ -129,10 +134,9 @@
 						</view>
 					</view>
 					<up-loadmore height='40' :status="formhomelist.status" iconSize='16' fontSize='16' />
-					<!-- </scroll-view> -->
 				</view>
 		</view>
-		<!-- <indexs v-if="showindex == 'shopIndex'"></indexs> -->
+		<indexs v-if="showindex == 'shopIndex'"></indexs>
 	</view>
 </template>

@@ -141,7 +145,10 @@
 		ref,
 		computed,
 		onMounted,
-		reactive
+		reactive,
+		onBeforeUnmount,
+		watch,
+		getCurrentInstance
 	} from "vue";
 	import {
 		onLoad,
@@ -150,21 +157,27 @@
 		onReachBottom,
 		onPageScroll
 	} from '@dcloudio/uni-app'
+	// 获取全局属性
+	const {
+		proxy
+	} = getCurrentInstance();
 	import swipers from './components/swiper.vue' //引入轮播
 	import advertisement from './components/advertisement.vue' //广告
 	import diamond from './components/diamond.vue' //金刚区
 	import todaylist from './components/todaylist.vue' //今日上线
-	// import popupad from '@/components/popupad.vue'
-	// import productlist from './components/productlist.vue'
-	// import category from '@/components/qiyue-category/qiyue-category.vue';
-	// import indexs from './indexs.vue';
+	import indexs from './indexs.vue';
+	import AreaSelect from './components/AreaSelect.vue'; //城市联动
+	import grouping from './components/grouping.vue'; //其他
 	import Nav from '@/components/indexnav.vue'; //导航栏
-	import API from "@/common/js/api.js"
+	import {
+		APIhomehomePageUp,
+		APIhome,
+		APIshopUserInfo
+	} from "@/common/api/index/index.js"
 	import {
 		useNavbarStore
 	} from '@/stores/navbarStore';
 	const store = useNavbarStore();
-
 	// 动态更新导航栏配置
 	store.updateNavbarConfig({
 		showBack: true, //左边返回键
@@ -178,8 +191,8 @@
 	const showindex = ref('index')
 	//计算广告图片的重合尺寸是位移
 	const getStyle = (e) => {
-		if (e > hometoplist.bannerVO.counponsInfo.length / 2) {
-			var right = hometoplist.bannerVO.counponsInfo.length - e
+		if (e > hometoplist.bannervo.counponsInfo.length / 2) {
+			var right = hometoplist.bannervo.counponsInfo.length - e
 			return {
 				transform: 'scale(' + (1) + ') translate(-' + (right * 20) + '%,0px)',
 				zIndex: 9999 - right,
@@ -193,20 +206,22 @@
 			}
 		}
 	}
-	const advertisementStyle = ref([{
-		transform: 'scale(' + (1) + ') translate(-' + (0 * 20) + '%,0px)',
-		zIndex: 9999,
-		opacity: 1
-	}])
+	const advertisementStyle = ref([])
+	const refbannervo = ref(null);
 	//数据
-	const hometoplist = reactive({})
+	const hometoplist = reactive({
+		bannervo: {
+			counponsInfo: [],
+			coupons: ''
+		}
+	})
 	// 首页上面数据
 	const hometop = async () => {
 		try {
-			let res = await API.homehomePageUp()
+			let res = await APIhomehomePageUp()
 			Object.assign(hometoplist, res.data)
-			if (hometoplist.bannerVO.counponsInfo) {
-				hometoplist.bannerVO.counponsInfo.forEach((item, index) => {
+			if (hometoplist.bannervo.counponsInfo) {
+				hometoplist.bannervo.counponsInfo.forEach((item, index) => {
 					advertisementStyle.value.push(getStyle(index))
 				})
 			}
@@ -232,7 +247,7 @@
 	const homelist = ref([]) //接收数据
 	const onLoadhome = async () => {
 		try {
-			let res = await API.home(formhomelist)
+			let res = await APIhome(formhomelist)
 			var dates = new Date().getTime();
 			res.data.list.forEach((item, index) => {
 				var leftTime = item.endTime - dates; //计算两日期之间相差的毫秒数
@@ -288,16 +303,21 @@
 		})
 		onLoadhome()
 	}
-	const updateCity = async (data) => {
-		console.log(data)
-		// this.list[data].end_times = 0;
-	}

+	// 弹出层处理
+	const showproductlist = ref(false);
+	// 定义方法  
+	const openproductlist = (e) => {
+		hometoplist.menu[viewHistoryindex.value].name = e //下标更改name
+		showproductlist.value = !showproductlist.value
+	}

 	// 存储每个元素距离顶部的距离
 	const elementTop = ref(0);
 	// 存储是否吸顶的状态
 	const isSticky = ref(true);
+	//下标
+	const viewHistoryindex = ref(null)
 	// 点击滑动元素
 	const viewHistory = async (item, index) => {
 		if (isSticky) {
@@ -306,7 +326,12 @@
 				duration: 300
 			});
 		}
-
+		// 是否有弹出层
+		if (item.isChild) {
+			showproductlist.value = showproductlist.value ? viewHistoryindex.value == index ? false : true : !
+				showproductlist.value
+		}
+		viewHistoryindex.value = index
 	}
 	// 滑动
 	onPageScroll((res) => {
@@ -315,86 +340,71 @@
 	});
 	onShow(() => {})
 	onMounted(async () => {
-		// 获取初始定位高度
-		setTimeout(() => {
-			const query = uni.createSelectorQuery().select('#fourcontent');
-			query.boundingClientRect((rect) => {
-				console.log(rect.top, 111)
-				elementTop.value = rect.top - store.height
-			}).exec();
-		}, 500)
-		// 查询是否有无内存
+		await proxy.$onLaunched;
+		console.log(uni.cache.get('shopId'))
 		if (uni.cache.get('shopId') && uni.cache.get('token')) {
 			showindex.value = 'shopIndex'
-			uni.cache.set('types', 'index');
-			let res = await API.shopUserInfo({
+			let res = await APIshopUserInfo({
 				"shopId": uni.cache.get('shopId'),
-				"userId": uni.cache.get('userInfo').id,
+				"userId": uni.getStorageSync('userInfo').id,
 			})
 			if (res.code == 0) {
-				shopUserInfo = res.data
-				// uni.cache.set('shopUserInfo', this.shopUserInfo)
+				//商家信息
+				uni.cache.set('shopUserInfo', res.data)
 			}
-			if (uni.cache.get('forceUpdate') == 1) {
-				// this.forceUpdate = !this.forceUpdate;
-			}
-			// this.getShopExtend()
 		} else {
-			uni.getLocation({
-				type: 'wgs84',
-				success: async (res) => {
-					// console.log(res)
-					let successres = await API.geocodelocation({
-						lng: res.longitude,
-						lat: res.latitude,
-					})
-					if (successres.code == 0) {
-						let datastorage = {
-							country: successres.data.addressComponent.country, // "中国"
-							province: successres.data.addressComponent
-								.province, //province: "陕西省"
-							address: successres.data.addressComponent.city, //district: "西安市"
-							district: successres.data.addressComponent
-								.district, //district: "未央区"
-							lng: res.longitude,
-							lat: res.latitude,
-						}
-						uni.cache.set('getLocationstorage', datastorage);
-					}
-				},
-				fail: async (err) => {
-					showindex.value = 'index'
-				}
-			});
+			hometop()
+			init_fn()
+			showindex.value = 'index'
+			// 获取初始定位高度
+			setTimeout(() => {
+				const query = uni.createSelectorQuery().select('#fourcontent');
+				query.boundingClientRect((rect) => {
+					elementTop.value = rect.top - store.height
+				}).exec();
+			}, 500)
 		}
-		hometop()
-		init_fn()
-
-
 	});
+
 	onReachBottom(() => {
 		onLoadhome()
 	})
-	onLoad(() => {

-	})
+	// 页面离开时清除定时器
+	// onBeforeUnmount(() => {
+	// 	if (refbannervo.value) {
+	// 		refbannervo.value.clearTimer();
+	// 	}
+	// });
 </script>

-<style lang="scss">
+<style lang="scss" scoped>
 	.content {
-		height: 1000vh;
 		background: #F9F9F9;

 		.fourcontent {
-			padding: 32rpx 28rpx;
+			padding: 32rpx 0;
 			overflow-x: auto;
 			flex-wrap: nowrap;
 			background: #f9f9f9;
+			margin: 0 32rpx;
+
+			.componentsclass {
+				margin-top: 32rpx;
+				left: 0;
+				position: absolute;
+				width: 100%;
+				height: 100vh;
+				transition-duration: 350ms;
+				transition-timing-function: ease-out;
+				z-index: 10075;
+				background-color: rgba(0, 0, 0, 0.5);
+			}

 			.fourcontent_item {
 				flex-wrap: nowrap;
-				margin-left: 22rpx;
-				padding: 11rpx 31rpx;
+				margin-left: 20rpx;
+				padding: 10rpx 24rpx;
 				background: #FFFFFF;
 				border-radius: 8rpx 8rpx 8rpx 8rpx;

@@ -412,6 +422,8 @@
 			}
 		}

+
+
 		.fivecontent {
 			padding: 0 28rpx;
 			height: 100vh;