aiyushanuninew/pages/index/index.vue

<template>
	<layout>
		<uv-sticky bg-color="#F5F5F5" offset-top="0" customNavHeight="0">
			<!--   <uv-navbar
	      :fixed="false"
	      :safeAreaInsetTop="true"
	      height="0"
	      bgColor="transparent"
	      leftIcon=""
	    /> -->
			<!-- #ifndef MP -->
			<blank size="0"></blank>
			<!-- #endif -->

			<blank size="0"></blank>
		</uv-sticky>

		<blank size="0"></blank>


		<view class="page flex-col">
			<view class="group_6 flex-row">
				<view class="group_7 flex-col">
					<view class="group_8 flex-row justify-between">
						<view class="group_9 flex-col" @tap="takein">
							<image class="image_1" referrerpolicy="no-referrer"
								src="/static/images/index/store_pickup.png" mode="widthFix" />
							<view class="text-group_13 flex-col justify-between">
								<text class="text_1">到店自取</text>
								<text class="text_2">下单免排队</text>
							</view>
						</view>
						<view class="image-text_7 flex-col" @tap="takeout">
							<image class="image_2" referrerpolicy="no-referrer"
								src="/static/images/index/delivery.png" />
							<view class="text-group_14 flex-col justify-between">
								<text class="text_3">外卖外送</text>
								<text class="text_4">美食送到家</text>
							</view>
						</view>
					</view>
					<!-- <view class="text-wrapper_3 flex-row justify-between">
		          <text class="text_2">下单免排队</text>
		          <text class="text_4">美食送到家</text>
		        </view> -->
					<view class="block_5 flex-row" @tap="coupons">
						<view class="image-text_8 flex-row justify-between">
							<image class="label_3" referrerpolicy="no-referrer"
								src="/static/images/index/coupons.png" />
							<text class="text-group_9">我的卡券</text>
						</view>
						<view class="image-text_9 flex-row justify-between">
							<text class="text-group_10">去领取</text>
							<view class="iconfont iconarrow-right line-height-100 green flex-fill"></view>
							<!-- <view class="section_2 flex-col"></view> -->
						</view>
					</view>
				</view>
			</view>
			<view class="group_2 flex-col">
				<view class="box_3 flex-col">
					<view class="block_6 flex-row"></view>
					<view class="image-wrapper_7 flex-row"></view>
				</view>
				<view class="box_6 flex-row">
					<view class="image-wrapper_3 flex-col">
						<image class="image_10" referrerpolicy="no-referrer"
							:src="isLogin && member.avatar ? member.avatar : '/static/images/index/user.png'" />
					</view>
					<view class="text-group_15 flex-col justify-between">
						<text class="text_6">Hi,{{ isLogin ? member.nickname : '新朋友' }}</text>
						<text class="text_7">爱愈膳汤铺随时欢迎您回家</text>
					</view>
					<!--   <view class="text-group_16 flex-col justify-between">
		          <text class="text_8">积分</text>
		          <text class="text_9">1000</text>
		        </view> -->
				</view>
			</view>
		</view>

		<!-- 新增弹窗遮罩层 -->
		<view class="popup-mask" v-if="showPopup" @tap="closePopup">
			<view class="popup-content" @tap.stop>
				<image class="close-icon" src="https://file.aiyushantp.com/file/c6e67d802e15b81e979106492db02723b26c1e9c3112c4f21ce3d22f6cba0668.png" mode="widthFix" @tap="closePopup" />
				<image class="popup-image" src="https://file.aiyushantp.com/file/cb5c3b28270cf94771b21e517deb1e50aea6789d1c31310b99a289d94d5368c6.png" mode="widthFix" />
			</view>
		</view>
	</layout>
</template>

<script setup>
import {
	ref
} from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import {
	menuAds
} from '@/api/market'
import { storeToRefs } from 'pinia'
import { useMainStore } from '@/store/store'
//
const main = useMainStore()
const { member, store, isLogin } = storeToRefs(main)
//const store = ref(main.store)
const listAds = ref([])
// const isLogin = ref(main.isLogin)

const handGetListAds = async () => {
	let shop_id = store.id ? store.id : 0;
	let data = await menuAds({
		shop_id: shop_id
	});
	if (data) {
		listAds.value = data.list;
		console.log('listAds:', listAds.value)
		uni.setStorage({
			key: 'isActive',
			data: data.isActive
		});
		if (data.list.length > 0) {
			uni.setStorage({
				key: 'shopAd',
				data: data.list[0].image
			});
		}
	}
}

const takein = () => {
	main.SET_ORDER_TYPE('takein')
	uni.switchTab({
		url: '/pages/menu/menu'
	})
}

const takeout = () => {
	main.SET_ORDER_TYPE('takeout')
	uni.switchTab({
		url: '/pages/menu/menu'
	})
}

const coupons = () => {
	console.log("--> % orderType:\n", main.orderType)
	console.log("--> % isLogin:\n", main.isLogin)
	uni.navigateTo({
		url: '/pages/components/pages/coupons/coupons'
	})
}

const goScore = () => {
	uni.navigateTo({
		url: '/pages/components/pages/scoreproduct/list'
	})
}




const showPopup = ref(false)

const closePopup = () => {
	showPopup.value = false
}

onLoad(() => {
	handGetListAds()
})
const onShareAppMessage = (res) => {
	return {
		title: '爱愈膳汤铺', // 分享卡片标题
		path: '/pages/index/index', // 分享后打开的页面路径（可携带参数）
		imageUrl: 'https://file.aiyushantp.com/file/b22aa4e4625714e2747b15cfa174ea2351e59df4bacec69d338f9c87c7dae5ca.png' // 分享卡片图片（建议300x300像素）
	}
}

const onShareTimeline = () => {
	return {
		title: '爱愈膳汤铺', // 分享卡片标题
		imageUrl: 'https://file.aiyushantp.com/file/b22aa4e4625714e2747b15cfa174ea2351e59df4bacec69d338f9c87c7dae5ca.png' // 分享卡片图片（建议300x300像素）
	}
}

</script>

<style lang="scss">
@import '../../static/style/common.css';
@import './index.rpx.css';

/* 新增弹窗样式 */
.popup-mask {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.7);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 999;
}

.popup-content {
	position: relative;
	width: 80%;
}

.close-icon {
	position: absolute;
	top: -20px;
	left: -20px;
	width: 40px;
	height: 40px;
	z-index: 1000;
}

.popup-image {
	width: 100%;
	border-radius: 10px;
}
</style>