<template>
  <view class="mian">
	<image class="banner" src="../../static/sidedish/banner.jpg" mode="widthFix"></image>
	<view class="class_content">
		<view class="class_scroll">
			<scroll-view
			:enhanced="true"
			:show-scrollbar="false" 
			scroll-x="true" 
			:scroll-with-animation="true"
			:scroll-left="ScrollLeft"
			class="class_scroll_ul">
				<view class="class_item class_item_active">推荐</view>
				<view class="class_item">特惠专区</view>
				<view class="class_item">时令春菜</view>
				<view class="class_item">鸭货卤味</view>
				<view class="class_item">鸡/鹅肉类</view>
				<view class="class_item">轻食萨拉</view>
				<view class="class_item ">猪肉类</view>
			</scroll-view>
		</view>
		<view class="content">
			<view class="content_item">
				<view class="content_head">
					<view class="content_head_l">
						<image class="content_head_img" src="../../static/sidedish/flame.png"></image>
						<view class="content_head_title">鲜花人气榜</view>
					</view>
					<view class="content_head_btn">
						<image class="content_head_btnimg" src="../../static/sidedish/addCart.png"></image>
					</view>
				</view>
				<view class="content_shop">
					<scroll-view class="content_shop_ul" :scroll-with-animation="true" :enhanced="true"  :show-scrollbar="false" scroll-x="true">
						<view class="content_shop_item" @click="goDetail()">
							<view class="content_shop_item_img">
								<!-- <view class="content_shop_item_tag"></view> -->
								<image class="content_shop_item_tag" src="../../static/sidedish/no1.png"></image>
								<image class="content_shop_item_imgUrl" src="../../static/Mask.png" mode="widthFix"></image>
							</view>
							<view class="content_shop_item_title">火锅配菜青菜</view>
							<view class="content_shop_item_bottom">
								<view class="content_shop_item_l">
									<view class="content_shop_item_price price">39.9</view>
									<view class="content_shop_market prices">59.9</view>
								</view>
								<view class="content_shop_item_cart">
									<image class="content_shop_item_cart_img" src="../../static/oncatr01.png" mode="widthFix"></image>
								</view>
							</view>
						</view>
						<view class="content_shop_item" @click="goDetail()">
							<view class="content_shop_item_img">
								<image class="content_shop_item_tag" src="../../static/sidedish/no2.png"></image>
								<image class="content_shop_item_imgUrl" src="../../static/Mask.png" mode="widthFix"></image>
							</view>
							<view class="content_shop_item_title">火锅配菜青菜</view>
							<view class="content_shop_item_bottom">
								<view class="content_shop_item_l">
									<view class="content_shop_item_price price">39.9</view>
									<view class="content_shop_market prices">59.9</view>
								</view>
								<view class="content_shop_item_cart">
									<image class="content_shop_item_cart_img" src="../../static/oncatr01.png" mode="widthFix"></image>
								</view>
							</view>
						</view>
						<view class="content_shop_item" @click="goDetail()">
							<view class="content_shop_item_img">
								<image class="content_shop_item_tag" src="../../static/sidedish/no3.png"></image>
								<image class="content_shop_item_imgUrl" src="../../static/Mask.png" mode="widthFix"></image>
							</view>
							<view class="content_shop_item_title">火锅配菜青菜</view>
							<view class="content_shop_item_bottom">
								<view class="content_shop_item_l">
									<view class="content_shop_item_price price">39.9</view>
									<view class="content_shop_market prices">59.9</view>
								</view>
								<view class="content_shop_item_cart">
									<image class="content_shop_item_cart_img" src="../../static/oncatr01.png" mode="widthFix"></image>
								</view>
							</view>
						</view>
						<view class="content_shop_item" @click="goDetail()">
							<view class="content_shop_item_img">
								<view class="content_shop_item_tagImg">4</view>
								<image class="content_shop_item_imgUrl" src="../../static/Mask.png" mode="widthFix"></image>
							</view>
							<view class="content_shop_item_title">火锅配菜青菜</view>
							<view class="content_shop_item_bottom">
								<view class="content_shop_item_l">
									<view class="content_shop_item_price price">39.9</view>
									<view class="content_shop_market prices">59.9</view>
								</view>
								<view class="content_shop_item_cart">
									<image class="content_shop_item_cart_img" src="../../static/oncatr01.png" mode="widthFix"></image>
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
			
		</view>
	</view>
  </view>
</template>

<script setup>
import { computed,ref } from 'vue';
import { useCounterStore } from '@/store/counter'; // 引入 Pinia Store
import { storeToRefs } from 'pinia';//实现解构付值
import { onLoad,onShow,onPullDownRefresh,onReachBottom } from "@dcloudio/uni-app"
const counterStore = useCounterStore(); // 使用 Store
const ScrollLeft = ref(0);
//使用pinia：storeToRefs方法包裹(保持响应式更新，不使用视图无法更新)
// const { count,doubleCount } = storeToRefs(counterStore);
const goDetail= ()=>{
	uni.navigateTo({
		url:`/shopProDetail/detail/detail`
	})
}
onLoad((options) => {

});
onShow(() => {
  
});
onPullDownRefresh(()=>{
	uni.stopPullDownRefresh();
})
onReachBottom(()=>{
	
})
</script>

<style lang="scss">
	@import './style.scss';
</style>