v1.2.3

custom/manifest.json

@@ -2,8 +2,8 @@
     "name" : "custom",
     "appid" : "__UNI__F860CDD",
     "description" : "彩图奔跑APP内客户定制样式页面",
-    "versionName" : "1.2.1",
-    "versionCode" : 121,
+    "versionName" : "1.2.3",
+    "versionCode" : 123,
     "uni-app-x" : {},
     /* 快应用特有相关 */
     "quickapp" : {},

custom/pages.json

@@ -77,6 +77,24 @@
 			"style": {
 				"navigationBarTitleText": "退出比赛"
 			}
+		},
+		{
+			"path": "pages/yuedong/challenge/index",
+			"style": {
+				"navigationBarTitleText": "挑战结果"
+			}
+		},
+		{
+			"path": "pages/yuedong/challenge/success",
+			"style": {
+				"navigationBarTitleText": "挑战成功"
+			}
+		},
+		{
+			"path": "pages/yuedong/challenge/exit",
+			"style": {
+				"navigationBarTitleText": "退出比赛"
+			}
 		}
 	],
 	"globalStyle": {

custom/pages/tpl/challenge/success.uvue

@@ -55,8 +55,8 @@ https://oss-mbh5.colormaprun.com/custom/#/pages/tpl/challenge/index?pagetype=cha
 					</view>
 				</view>
 				<view class="btnBox uni-row uni-jcsa">
-					<view class="btn btnBg" @click="btnExchange">查看奖励</view>
-					<view class="btn btnBg" @click="btnRankList">查看排行榜</view>
+					<view v-if="showExchange == 'true'" class="btn btnBg" @click="btnExchange">查看奖励</view>
+					<view v-if="showRankList == 'true'"  class="btn btnBg" @click="btnRankList">查看排行榜</view>
 				</view>
 			</view>
 
@@ -86,6 +86,8 @@ https://oss-mbh5.colormaprun.com/custom/#/pages/tpl/challenge/index?pagetype=cha
 				sublogo: "",
 				subTitle: "",
 				accuracyLable: "",
+				showExchange: "true",
+				showRankList: "true",
 
 				status: "",		// success: 挑战成功, ok: 挑战完成(没在规定时间完成，但打了所有点), fail: 挑战结束
 				name: "",		// 用户名
@@ -131,6 +133,10 @@ https://oss-mbh5.colormaprun.com/custom/#/pages/tpl/challenge/index?pagetype=cha
 			this.sublogo = event["sublogo"] ?? "";
 			this.subTitle = event["subTitle"] ?? "";
 			this.accuracyLable = event["accuracyLable"] ?? "答题";
+			this.showExchange = event["showExchange"] ?? "true";
+			this.showRankList = event["showRankList"] ?? "true";
+			console.log("showExchange:", this.showExchange);
+			console.log("showRankList:", this.showRankList);
 
 			this.status = event["status"] ?? "";
 			this.name = event["name"] ?? "";

custom/pages/yuedong/challenge/exit.uvue

@@ -0,0 +1,62 @@
+<!-- 
+http://localhost:5174/custom/#/pages/yuedong/challenge/index?pagetype=challenge_result&status=fail
+https://oss-mbh5.colormaprun.com/custom/#/pages/yuedong/challenge/index?pagetype=challenge_result&status=fail
+ -->
+<template>
+	<view class="body">
+		<view class="content">
+			<view class="main">
+				<view class="exit_game"></view>
+			</view>
+		</view>
+		
+		<my-fab></my-fab>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			}
+		},
+		computed: {
+		},
+		onLoad(event) { // 类型非必填，可自动推导
+		},
+		methods: {
+		}
+	}
+</script>
+
+<style>
+	.body {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.content {
+		width: 100vw;
+		/* width: 750rpx; */
+		/* margin: 0 auto; */
+	}
+
+	.main {
+		width: 100%;
+		flex-direction: column;
+		align-items: center;
+		justify-content: flex-start;
+	}
+
+	.exit_game {
+		width: 100%;
+		height: 100vh;
+		background-image: url("/static/yuedong/challenge/exit_game.png");
+		background-repeat: no-repeat;
+		background-position-x: center;
+		background-position-y: top;
+		background-size: 100% 100%;
+	}
+</style>

custom/pages/yuedong/challenge/index.uvue

@@ -0,0 +1,47 @@
+<!-- 
+http://localhost:5173/custom/#/pages/yuedong/challenge/index?tplStyle=orange&logo=/static/shanda/logo.webp&subTitle=山东大学123周年庆&actId=18&matchType=3&pagetype=challenge_result&distance=1320&status=success&name=天生我材必有用&cal=13500100&duration=3600&accuracy=50&syscount=25
+https://oss-mbh5.colormaprun.com/custom/#/pages/yuedong/challenge/index?tplStyle=orange&logo=/static/shanda/logo.webp&subTitle=“筑梦宿州·创赢未来 ”特训营&pagetype=challenge_result&distance=1320&status=success&name=天生我材必有用&cal=13500100&duration=3600&accuracy=50&syscount=25
+https://oss-mbh5.colormaprun.com/custom/#/pages/yuedong/challenge/index?tplStyle=orange&pagetype=challenge_result&distance=1320&status=success&name=天生我材必有用&cal=13500100&duration=3600&accuracy=50&syscount=25
+ -->
+<template>
+	<view></view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			}
+		},
+		onLoad(event) { // 类型非必填，可自动推导
+			// console.log(event);
+			const queryString = this.objectToQueryString(event);
+			// console.log(queryString);
+			const status = event["status"] ?? ""
+			
+			if (status == 'success') {	// 挑战成功
+				uni.reLaunch({
+					url: '/pages/yuedong/challenge/success?' + queryString
+				});
+			}
+			else if (status == 'ok' || status == 'fail') {	// 挑战完成/挑战失败
+				uni.reLaunch({
+					url: '/pages/yuedong/challenge/exit?' + queryString
+				});
+			}
+			else {
+				this.showErr();
+			}
+		},
+		methods: {
+			showErr() {
+				uni.showToast({
+					title: '参数错误'
+				});
+			},
+			objectToQueryString(obj) {
+				return Object.keys(obj).map(k => k + '=' + obj[k]).join('&');
+			}
+		}
+	}
+</script>

custom/pages/yuedong/challenge/success.uvue

@@ -0,0 +1,318 @@
+<!-- 
+http://localhost:5174/custom/#/pages/yuedong/challenge/index?sublogo=sddx_jjyjy.png&subTitle=“筑梦宿州·创赢未来 ”特训营&accuracyLable=正确答题&actId=18&matchType=3&pagetype=challenge_result&distance=1320&status=success&name=天生我材必有用&cal=13500100&duration=3600&accuracy=50&syscount=25
+http://localhost:5174/custom/#/pages/yuedong/challenge/index?subTitle=山东大学123周年庆&actId=18&matchType=3&pagetype=challenge_result&distance=1320&status=success&name=天生我材必有用&cal=13500100&duration=3600&accuracy=50&syscount=25
+
+https://oss-mbh5.colormaprun.com/custom/#/pages/yuedong/challenge/index?sublogo=sddx_jjyjy.png&subTitle=“筑梦宿州·创赢未来 ”特训营&accuracyLable=正确答题&pagetype=challenge_result&distance=1320&status=success&name=天生我材必有用&cal=13500100&duration=3600&accuracy=50&syscount=25
+https://oss-mbh5.colormaprun.com/custom/#/pages/yuedong/challenge/index?pagetype=challenge_result&distance=1320&status=success&name=天生我材必有用&cal=13500100&duration=3600&accuracy=50&syscount=25
+ -->
+<template>
+	<view class="body">
+		<view class="content">
+			<view class="top"></view>
+			<view class="main">
+				<view class="main-content">
+					<view class="namebox">
+						<text class="name">{{nameSub}}</text>
+					</view>
+					<view class="rank">
+						<view class="statistic">
+							<text class="statistic-title">总里程：</text>
+							<view class="statistic-right">
+								<text class="statistic-value">{{distanceKm}}</text><text
+									class="statistic-unit">Km</text>
+							</view>
+						</view>
+						<view class="statistic">
+							<text class="statistic-title">总用时：</text>
+							<view class="statistic-right">
+								<text class="statistic-value">{{durationMin}}</text><text
+									class="statistic-unit">min</text>
+							</view>
+						</view>
+						<view class="statistic">
+							<text class="statistic-title">脑力值：</text>
+							<view class="statistic-right">
+								<text class="statistic-value">{{accuracy}}</text><text class="statistic-unit">%</text>
+							</view>
+						</view>
+						<view class="statistic">
+							<text class="statistic-title">悦动豆：</text>
+							<view class="statistic-right">
+								<text class="statistic-value">{{syscount}}</text><text class="statistic-unit"></text>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<!-- <view class="btnRankList" @click="btnRankList">点击查看排行榜</view> -->
+		</view>
+		
+		<my-fab></my-fab>
+	</view>
+</template>
+
+<script>
+	import tools from '/common/tools';
+	import {
+		token,
+		apiCardUrlQuery,
+		checkResCode
+	} from '/common/api';
+
+	export default {
+		data() {
+			return {
+				token: "",
+				matchType: 0, 	// 游戏类型 1 普通活动 2 线下赛 3 线上赛
+				ecId: 0, 		// 卡片id
+				ecName: "",		// 卡片名称
+				logo: "",
+				sublogo: "",
+				subTitle: "",
+				accuracyLable: "",
+				
+				status: "",		// success: 挑战成功, ok: 挑战完成(没在规定时间完成，但打了所有点), fail: 挑战结束
+				name: "",		// 用户名
+				duration: 0,	// 总用时，秒
+				distance: 0,	// 总里程，米
+				cal: 0,			// 卡路里，卡 int
+				accuracy: 0,	// 脑力值百分比
+				syscount: 0,	// 点数
+				
+				actId: 0, 		// 活动或关联id
+				urlRs: [],		// Url集合
+			}
+		},
+		computed: {
+			nameSub() {
+				// const maxlen = 8;
+				const nameLen = tools.calStrLen(this.name);
+				console.log('nameLen', nameLen);
+				if (nameLen <= 10) {
+					return '选手: ' + this.name;
+				}
+				// else if (nameLen >= maxlen) {
+				// 	return this.name.substring(0,maxlen-1) + '...';
+				// }
+				else {
+					return this.name;
+				}
+			},
+			durationMin() {
+				return Math.round(this.duration * 10 / 60) / 10;
+			},
+			distanceKm() {
+				return Math.round(this.distance * 10 / 1000) / 10;
+			}
+		},
+		onLoad(event) { // 类型非必填，可自动推导
+			console.log('[challenge result] onLoad');
+			
+			this.token = event["token"] ?? token;
+			this.actId = event["id"] ?? 0;
+			this.matchType = event["matchType"] ?? 0;
+			this.logo = event["logo"] ?? "logo.webp";
+			this.logo = "/static/shanda/" + this.logo;
+			this.sublogo = event["sublogo"] ?? "";
+			if (this.sublogo != "") {
+				this.sublogo = "/static/shanda/" + this.sublogo;
+			}
+			this.subTitle = event["subTitle"] ?? "";
+			this.accuracyLable = event["accuracyLable"] ?? "校园文化";
+			
+			this.status = event["status"] ?? "";
+			this.name = event["name"] ?? "";
+			this.duration = event["duration"] ?? 0;
+			this.distance = event["distance"] ?? 0;
+			this.cal = event["cal"] ?? 0;
+			this.accuracy = event["accuracy"] ?? 0;
+			this.syscount = event["syscount"] ?? 0;
+			
+			// console.log("event:", JSON.stringify(event));
+			// uni.showToast({
+			// 	title: 'event：' + JSON.stringify(event),
+			// 	icon: 'none',
+			// 	duration: 10000
+			// });
+			
+			this.cardUrlQuery();
+		},
+		methods: {
+			// 根据游戏id查询卡片信息
+			cardUrlQuery() {
+				uni.request({
+					url: apiCardUrlQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						actId: this.actId,
+						matchType: this.matchType
+					},
+					success: (res) => {
+						// console.log("cardUrlQuery", res);
+						if (res.data.code == 0) {
+							const data = res.data.data;
+							this.ecId = data.ecId;
+							this.ecName = data.ecName;
+							this.urlRs = data.urlRs;
+						}
+					},
+					fail: (err) => {
+						console.log("cardUrlQuery err", err);
+					},
+				});
+			},
+			btnRankList() {
+				// console.log("urlRs", this.urlRs);
+				// const rankListUrl = this.urlRs.find(item => item.name === 'rankListUrl');
+				const rankListUrl = this.urlRs.rankListUrl;
+				// console.log("rankListUrl", rankListUrl);
+				if (rankListUrl != null) {
+					let url = "";
+					if (rankListUrl.indexOf('?') !== -1) {
+						url = rankListUrl + '&token=' + this.token + '&id=' + this.ecId;
+					} else {
+						url = rankListUrl + '?token=' + this.token + '&id=' + this.ecId;
+					}
+					console.log("url", url);
+					// uni.navigateTo({
+					// 	url: url
+					// });
+					window.location.href = url;
+				} else {
+					uni.showToast({
+						// title: '网址错误：' + rankListUrl,
+						title: '请升级APP到最新版才能查看排行榜',
+						icon: 'none',
+						duration: 3000
+					});
+				}
+			}
+		}
+	}
+</script>
+
+<style>
+	.body {
+		background-color: #2d2d2d;
+	}
+
+	.content {
+		width: 750rpx;
+		min-height: 100vh;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: flex-end;
+	}
+
+	.top {
+		width: 100%;
+		height: 70vh;
+		background-image: url("static/yuedong/challenge/success_bg.png");
+		background-repeat: no-repeat;
+		background-position-x: center;
+		background-position-y: top;
+		background-size: 100% 100%;
+	}
+
+	.main {
+		width: 100%;
+		height: 30vh;
+		flex-direction: column;
+		justify-content: flex-start;
+		align-items: center;
+	}
+
+	.main-content {
+		display: flex;
+		flex-direction: row;
+		width: 100%;
+		height: 400rpx;
+		/* background-color: #b0352e; */
+		background-image: url("/static/yuedong/challenge/rank_bg.png");
+		background-repeat: no-repeat;
+		background-position-x: center;
+		background-position-y: center;
+		background-size: 100% auto;
+	}
+
+	.rank {
+		width: 220rpx;
+		/* height: 500rpx; */
+		margin-left: 60rpx;
+		margin-top: 120rpx;
+	}
+
+	.namebox {
+		width: 330rpx;
+	}
+
+	.name {
+		width: 280rpx;
+		/* 确保文本在一行内显示 */
+		white-space: nowrap;
+		/* 超出容器部分的文本隐藏起来 */
+		overflow: hidden;
+		/* 使用省略号表示被截断的文本 */
+		/* text-overflow: ellipsis; */
+		text-align: center;
+		margin-top: 250rpx;
+		margin-left: 20rpx;
+		font-family: Source Han Sans CN;
+		font-weight: 500;
+		font-size: 32rpx;
+		color: #ffffff;
+	}
+
+	.statistic {
+		height: 30rpx;
+		margin-bottom: 16rpx;
+		flex-direction: row;
+		align-items: center;
+		justify-content: flex-start;
+	}
+
+	.statistic-right {
+		flex-direction: row;
+		align-items: baseline;
+	}
+
+	.statistic-title {
+		font-family: Source Han Sans CN;
+		font-weight: 500;
+		font-size: 28rpx;
+		color: #ffffff;
+	}
+
+	.statistic-value {
+		font-family: Source Han Sans CN;
+		font-size: 28rpx;
+		color: #ffffff;
+		font-weight: bold;
+	}
+
+	.statistic-unit {
+		font-family: Source Han Sans CN;
+		font-size: 25rpx;
+		color: #ffffff;
+		padding-left: 10rpx;
+	}
+
+	.btnRankList {
+		/* opacity: 30%; */
+		width: 194px;
+		height: 35px;
+		margin-bottom: 60rpx;
+		background: #b0352e;
+		border-radius: 18px;
+		align-items: center;
+		color: #ffffff;
+		font-size: 16px;
+		line-height: 32px;
+	}
+
+</style>