首页

pages/weeklyMenu/index.vue

@@ -0,0 +1,97 @@
+<template>
+	<view class="work-container">
+		<!-- 第一个条目 -->
+		<view class="item">
+			<image class="image" src="/static/images/weeklyMenu/banner.png"></image>
+			<view class="content">
+				<text class="title">早，中档口</text>
+				<text class="sub-title">食堂：宏源大厦</text>
+				<text class="sub-title">档口：早，中档口</text>
+			</view>
+		</view>
+
+		<!-- 第二个条目 -->
+		<view class="item">
+			<image class="image" src="/static/images/weeklyMenu/banner1.png"></image>
+			<view class="content">
+				<text class="title">午，中档口</text>
+				<text class="sub-title">食堂：宏源大厦</text>
+				<text class="sub-title">档口：午，中档口</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				qrCodeUrl: '/static/images/code.png' // 替换为实际的二维码URL
+			};
+		},
+		methods: {
+			refreshQrCode() {
+				// 模拟刷新二维码
+				this.qrCodeUrl = `/static/images/code.png`;
+			}
+		}
+	};
+</script>
+
+<style scoped>
+	page {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+		background-color: #F9FBFF;
+		min-height: 100%;
+		height: auto;
+	}
+
+	.work-container {
+		background-color: #F9FBFF;
+		text-align: center;
+	}
+
+	.item {
+		display: flex;
+		margin: 0 40rpx 40rpx 40rpx;
+		background-color: #fff;
+		border-radius: 8rpx;
+		box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1);
+	}
+
+	.image {
+		width: 200rpx;
+		height: 200rpx;
+		border-radius: 8rpx;
+		margin: 20rpx;
+	}
+
+	/* 确保所有文本默认左对齐 */
+	.content {
+	  flex: 1;
+	  display: flex;
+	  flex-direction: column;
+	  justify-content: space-evenly;
+	  /* 添加以下样式以确保内容左对齐 */
+	  align-items: flex-start; /* 确保子元素水平方向上左对齐 */
+	}
+	
+	.title, .sub-title {
+	  text-align: left; /* 确保文本左对齐 */
+	  margin: 0; /* 移除任何可能存在的默认边距 */
+	}
+
+	.title {
+		font-size: 18px;
+		color: #333;
+		font-weight: 600;
+		margin-bottom: 5rpx;
+	}
+
+	.sub-title {
+		font-size: 16px;
+		color: #444;
+	}
+</style>