111

2025-11-11 18:39:32 +08:00
parent e6a2312cdc
commit 3cd473bedb
697 changed files with 84607 additions and 0 deletions
--- a/scoring/pages/index/index.vue
+++ b/scoring/pages/index/index.vue
@@ -0,0 +1,161 @@
+<template>
+	<view class="index">
+		<view class="notice">
+			<view class="icon">
+				<uni-icons type="sound" size="20"></uni-icons>
+			</view>
+			<view class="text">
+				您还有未结束的对局, 
+				<text class="underline">点击前往</text>
+			</view>
+		</view>
+		<view class="function-list">
+			<view class="function-item">
+				<view class="function-icon">
+					<image src="https://t14.baidu.com/it/u=3165460156,649373630&fm=224&app=112&f=JPEG?w=500&h=500"></image>
+				</view>
+				<view class="function-introduce">
+					<view class="function-name">
+						多人模式
+					</view>
+					<view class="function-desc">
+						所有玩家自己计分
+					</view>
+				</view>
+			</view>
+			<view class="function-item"@click="goToSingleMode">
+				<view class="function-icon">
+					<image src="https://pic.rmb.bdstatic.com/bjh/down/1742bc3845cbbcf0c78c01eb59bb1c1a.jpeg"></image>
+				</view>
+				<view class="function-introduce">
+					<view class="function-name">
+						单人模式
+					</view>
+					<view class="function-desc">
+						房主给所有玩家计分
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { getOpenId } from '@/utils/wxutils.js'
+
+// 跳转到单人模式页面
+const goToSingleMode = () => {
+  // 生成随机房间ID
+  const roomId = Math.floor(Math.random() * 10000000).toString().padStart(8, '0');
+  
+  uni.navigateTo({
+    url: `/pages/single-room/index?roomId=${roomId}`
+  });
+}
+
+// 如果您有未结束对局的功能，可以添加以下方法
+const goToUnfinishedGame = () => {
+  // 这里可以跳转到未结束的对局
+  uni.showToast({
+    title: '前往未结束对局',
+    icon: 'none'
+  });
+}
+
+onMounted(() => {
+  // 页面加载时的初始化逻辑
+})
+
+</script>
+
+<style lang="less" scoped>
+.index {
+	width: 750rpx;
+	margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+}
+.notice {
+	width: 80%;
+	margin: 20rpx auto;
+	padding: 20rpx;	
+	box-sizing: border-box;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: flex-start;
+	gap: 10rpx;
+	background-color: #fff;
+	box-shadow: 5rpx 5rpx 10rpx rgba(0, 0, 0, 0.1);
+	border-radius: 20rpx;
+	.icon {
+		width: 40rpx;
+		height: 40rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		box-sizing: border-box;
+		color: #fa5d5d;
+	}
+	.text {
+		font-size: 32rpx;
+		font-weight: 400;
+		color: #000;
+	}
+	.underline {
+		text-decoration: underline;
+		color: #fa5d5d;	
+	}
+}
+.function-list {
+	width: 100%;
+	box-sizing: border-box;
+}
+.function-item {
+	--content-height: 100rpx;
+	width: 70%;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	padding: 20rpx;
+	box-sizing: border-box;
+	background-color: #fff;
+	cursor: pointer;
+	margin: 40rpx auto;
+	box-shadow: 5rpx 5rpx 10rpx rgba(0, 0, 0, 0.1);
+	gap: 10rpx;
+	border-radius: 20rpx;
+	.function-icon {
+		width: var(--content-height);
+		height: var(--content-height);
+		border-radius: 10%;
+		overflow: hidden;
+		box-sizing: border-box;
+		flex-shrink: 0;
+		image {
+			width: 100%;
+			height: 100%;
+		}
+	}
+	.function-introduce {
+		flex: 1;
+		height: var(--content-height);
+		display: flex;
+		flex-direction: column;
+		align-items: flex-start;
+		justify-content: flex-start;
+		box-sizing: border-box;
+		.function-name {
+			font-size: 32rpx;
+			font-weight: 500;
+			color: #000;
+		}
+		.function-desc {
+			font-size: 26rpx;
+			font-weight: 400;
+			color: #a8a8a8;
+		}
+	}
+}
+</style>