v1.5.1

card/common/tools.js

@@ -1,408 +1,460 @@
-var tools = {
-	
-	// 导航到彩图奔跑APP内的某个页面或执行APP内部的某些功能
-	appAction(url) {
-		console.log("appAction", url);
-		// console.log("getApp", getApp());
-		// getApp().$audio.destroy();
-		// getApp().$audio.pause();
-		window.location.href = url;
-	},
-	
-	// 判断赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
-	checkMcState(beginSecond, endSecond) {
-		let mcState = 0;	// 未开始
-		if (beginSecond > 0 && endSecond > 0) {
-			const now = Date.now() / 1000;
-			const dif1 = beginSecond - now;
-			const dif2 = endSecond - now;
-			// const dif = 3600*24 - 60;
-			if (dif1 > 0) {
-				console.log("活动未开始");
-				mcState = 0;	// 未开始
-			} else if (dif2 > 0) {
-				console.log("活动进行中");
-				mcState = 1;	// 进行中
-			} else {
-				console.log("活动已结束");
-				mcState = 2;	// 已结束
-			}
-		}
-		return mcState;
-	},
-
-	// 动态创建<style>标签，将CSS代码插入到文档中
-	loadCssCode(cssCode) {
-		this.removeCssCode();
-		
-		const styleId = "css-custom";
-		var style = window.document.createElement("style");
-		style.type = "text/css";
-		style.id = styleId;
-		if (style.styleSheet) {
-			// This is required for IE8 and below.
-			style.styleSheet.cssText = cssCode;
-		} else {
-			style.appendChild(document.createTextNode(cssCode));
-		}
-		document.getElementsByTagName("head")[0].appendChild(style);
-		// console.log("head:", document.getElementsByTagName("head")[0]);
-		// console.log("head:", document.getElementById(styleId));
-		// console.log("style:", style);
-	},
-	
-	// 删除之前动态创建的<style>标签
-	removeCssCode() {
-		const styleId = "css-custom";
-		var oldCss = document.getElementById(styleId);
-		// console.log("oldCss:", oldCss);
-		if (oldCss != null) {
-			document.getElementsByTagName("head")[0].removeChild(oldCss);
-			console.log("oldCss 已移除");
-		}
-	},
-
-	// uni-data-select 组件，根据选中的值获取对应的文本
-	getSelectedText(obj, value) {
-		const selectedOption = obj.find(option => option.value === value);
-		return selectedOption ? selectedOption.text : '';
-	},
-
-	objectToQueryString(obj) {
-		return Object.keys(obj).map(k => k + '=' + obj[k]).join('&');
-	},
-
-	// 秒数转换成 XX天XX小时
-	convertSecondsToDHM(seconds) {
-		var days = Math.floor(seconds / (3600 * 24));
-		var hours = Math.floor((seconds % (3600 * 24)) / 3600);
-		var minutes = Math.floor((seconds % (3600 * 24)) % 3600 / 60);
-		if (days > 0)
-			// return `${days.toString().padStart(2, '0')}天${hours.toString().padStart(2, '0')}小时`;
-			return `${days}天${hours.toString().padStart(2, '0')}小时`;
-		else
-			return `${hours.toString().padStart(2, '0')}小时${minutes.toString().padStart(2, '0')}分钟`;
-	},
-
-	// 秒数转换成时分秒
-	// style:  0 [01:02:03]  1 [1h:02'3"]
-	convertSecondsToHMS(seconds, style = 0) {
-		var hours = Math.floor(seconds / 3600);
-		var minutes = Math.floor((seconds % 3600) / 60);
-		var remainingSeconds = Math.floor(seconds % 60);
-		// return hours + ":" + minutes + ":" + remainingSeconds;
-		if (style == 0)
-			return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${remainingSeconds.toString().padStart(2, '0')}`;
-		else if (style == 1) {
-			if (hours > 0)
-				return `${hours}h${minutes}′${remainingSeconds}″`;
-			else
-				return `${minutes}′${remainingSeconds}″`;
-		}
-		else if (style == 2) {
-			if (hours > 0)
-				return `${hours*60+minutes}′${remainingSeconds}″`;
-			else
-				return `${minutes}′${remainingSeconds}″`;
-		}
-	},
-
-	// 计算（中英文混合）字符串长度
-	calStrLen(str) {
-		var length = 0;
-		for (var i = 0; i < str.length; i++) {
-			// 将字符转换为 Unicode 编码
-			var charCode = str.charCodeAt(i);
-			if (charCode >= 0 && charCode <= 128) {
-				length++;
-			} else {
-				length += 2;
-			}
-		}
-
-		return length;
-	},
-
-	// 集合对象去重
-	unique(arr, field) {
-		var map = {};
-		var res = [];
-		for (var i = 0; i < arr.length; i++) {
-			if (!map[arr[i][field]]) {
-				map[arr[i][field]] = 1;
-				res.push(arr[i]);
-			}
-		}
-		return res;
-	},
-
-	// 正则取出html标签
-	repalceHtml(str) {
-		var dd = str.replace(/<\/?.+?>/g, "");
-		var dds = dd.replace(/ /g, ""); //dds为得到后的内容
-		return dds;
-	},
-
-	// 判断身份证号    
-	isSfz(idcard) {
-		var id =
-			/^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|31)|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}([0-9]|x|X)$/
-		if (idcard === '') {
-			uni.showToast({
-				title: '请输入身份证号',
-				icon: 'none'
-			})
-		} else if (!id.test(idcard)) {
-			uni.showToast({
-				title: '身份证号格式不正确!',
-				icon: 'none'
-			})
-			return false
-		} else {
-			return false
-		}
-	},
-
-	// 判断是否是手机号   
-	isPhone(val) {
-		var patrn = /^(((1[3456789][0-9]{1})|(15[0-9]{1}))+\d{8})$/
-		if (!patrn.test(val) || val === '') {
-			uni.showToast({
-				title: '手机号格式不正确',
-				icon: 'none'
-			})
-			return false
-		} else {
-			return true
-		}
-	},
-
-	// 判断邮箱
-	isEmail(email) {
-		if (email.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
-			return true;
-		else
-			return false;
-	},
-
-	//获取随机数
-	getSuiji() {
-		var Range = Max - Min;
-		var Rand = Math.random();
-		return (Min + Math.round(Rand * Range));
-	},
-
-	//计算多长时间前
-	getDateDiff(dateTimeStamp) {
-		var minute = 1000 * 60;
-		var hour = minute * 60;
-		var day = hour * 24;
-		var halfamonth = day * 15;
-		var month = day * 30;
-		var year = day * 365;
-		var now = new Date().getTime();
-		var diffValue = now - dateTimeStamp;
-		if (diffValue < 0) {
-			return;
-		}
-		var yearC = diffValue / year;
-		var monthC = diffValue / month;
-		var weekC = diffValue / (7 * day);
-		var dayC = diffValue / day;
-		var hourC = diffValue / hour;
-		var minC = diffValue / minute;
-		if (yearC >= 1) {
-			result = "" + parseInt(yearC) + "年前";
-		}
-		if (monthC >= 1) {
-			result = "" + parseInt(monthC) + "月前";
-		} else if (weekC >= 1) {
-			result = "" + parseInt(weekC) + "周前";
-		} else if (dayC >= 1) {
-			result = "" + parseInt(dayC) + "天前";
-		} else if (hourC >= 1) {
-			result = "" + parseInt(hourC) + "小时前";
-		} else if (minC >= 1) {
-			result = "" + parseInt(minC) + "分钟前";
-		} else
-			result = "刚刚";
-		return result;
-	},
-
-	// 时间戳转时间
-	timestampToTime(timestamp, i) {
-		var date = new Date(timestamp); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-		// console.log(date, timestamp)
-		var Y = date.getFullYear();
-		var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
-		var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
-		var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours());
-		var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-		var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-		if (i == 1) {
-			return Y + '-' + M + '-' + D;
-		} else if (i == 2) {
-			return Y + '年' + M + '月' + D + '日';
-		}
-		return Y + '-' + M + '-' + D + ' ' + h + ':' + m + ':' + s;
-	},
-
-	// 是否是汉字
-	isHanzi(str) {
-		let reg = /\p{Unified_Ideograph}/ug;
-		return reg.test(str);
-	},
-
-	// 是否是字母数字
-	isStringAndNumber(str) {
-		let regNumber = new RegExp(/^[0-9A-Za-z]+$/);
-		return regNumber.test(str)
-	},
-
-	// var arr3 = [30,10,111,35,1899,50,45];
-	// 集合排序  元素数字
-	listSort(list) {
-		arr3.sort(function(a, b) {
-			return a - b;
-		})
-	},
-
-	// var arr5 = [{id:10},{id:5},{id:6},{id:9},{id:2},{id:3}];
-	// 元素  对象
-	listObjectSort(arr) {
-		arr.sort(function(a, b) {
-			return a.id - b.id
-		})
-		return arr;
-	},
-
-	/*
-	 * 忽略大小写判断字符串是否相同
-	 * @param str1
-	 * @param str2
-	 * @returns {Boolean}
-	 */
-	isEqualsIgnorecase: function(str1, str2) {
-		if (str1.toUpperCase() == str2.toUpperCase()) {
-			return true;
-		} else {
-			return false;
-		}
-	},
-
-	/**
-	 * 判断是否是数字
-	 * @param value
-	 * @returns {Boolean}
-	 */
-	isNum: function(value) {
-		if (value != null && value.length > 0 && isNaN(value) == false) {
-			return true;
-		} else {
-			return false;
-		}
-	},
-
-	/**
-	 * 判断是否是中文
-	 * @param str
-	 * @returns {Boolean}
-	 */
-	isChine: function(str) {
-		var reg = /^([u4E00-u9FA5]|[uFE30-uFFA0])*$/;
-		if (reg.test(str)) {
-			return false;
-		}
-		return true;
-	},
-
-	/*验证是否为图片*/
-	tmCheckImage: function(fileName) {
-		return /(gif|jpg|jpeg|png|GIF|JPG|PNG)$/ig.test(fileName);
-	},
-
-	/*验证是否为视频*/
-	tmCheckVideo: function(fileName) {
-		return /(mp4|mp3|flv|wav)$/ig.test(fileName);
-	},
-
-	/**
-	 * 去除字符串两边的空格
-	 * @param str
-	 * @returns {number|Number}
-	 * 调用方法：var str = utils.trim("abcd")
-	 */
-	trim: function(str) {
-		String.prototype.trim = function() {
-			return str.replace(/(^\s*)|(\s*$)/g, "");
-		}
-	},
-
-	// 判断密码是否符合 至少6位,包括大小写字母、数字、特殊字符
-	isPassword(val) {
-		var reg = /^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$)^.{8,16}$/;
-		if (val === '') {
-			uni.showToast({
-				title: '请输入密码',
-				icon: 'none'
-			})
-		} else if (!reg.test(val)) {
-			uni.showToast({
-				title: '至少6位,包括大小写字母、数字、特殊字符',
-				icon: 'none'
-			})
-			return false
-		} else {
-			return true
-		}
-	},
-
-	// 电话匿名
-	noPassByMobile(str) {
-		if (null != str && str != undefined) {
-			var pat = /(\d{3})\d*(\d{4})/;
-			return str.replace(pat, '$1****$2');
-		} else {
-			return "";
-		}
-	},
-
-	// 获取两点间的距离
-	//进行经纬度转换为距离的计算
-	Rad(d) {
-		return d * Math.PI / 180.0; //经纬度转换成三角函数中度分表形式。
-	},
-
-	/*
-	 计算距离，参数分别为第一点的纬度，经度；第二点的纬度，经度
-	 默认单位km
-	*/
-	getMapDistance(lat1, lat2, lng1, lng2) {
-		lat1 = lat1 || 0;
-		lng1 = lng1 || 0;
-		lat2 = lat2 || 0;
-		lng2 = lng2 || 0;
-
-		var rad1 = lat1 * Math.PI / 180.0;
-		var rad2 = lat2 * Math.PI / 180.0;
-		var a = rad1 - rad2;
-		var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
-		var r = 6378137;
-		var distance = r * 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(rad1) * Math.cos(rad2) *
-			Math.pow(Math.sin(b / 2), 2)));
-		// console.log(lat1, lng1, lat2, lng2);
-		// console.log(distance);
-		return Math.round(distance) / 1000;
-	},
-
-	// 预览图片
-	yulanImg(item) {
-		let arr = [item]
-		uni.previewImage({
-			urls: arr,
-		});
-	},
-
-}
-
+var tools = {
+	
+	// 导航到彩图奔跑APP内的某个页面或执行APP内部的某些功能
+	appAction(url) {
+		console.log("appAction", url);
+		// console.log("getApp", getApp());
+		// getApp().$audio.destroy();
+		// getApp().$audio.pause();
+		window.location.href = url;
+	},
+	
+	// 格式化赛事时间 09-09 16:48
+	fmtMcTime(timestamp) {
		var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+		// var Y = date.getFullYear() + '-';
+		var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
+		var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
+		var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
+		var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
+		// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
+
+		const timeStr = M + D + h + m;
+		// console.log("timeStr", timeStr);
+		return timeStr;
+	},
+	
+	// 获取活动时间 09-09 16:48 至 09-30 16:48
+	getActtime(beginSecond, endSecond) {
+		const acttime = this.fmtMcTime(beginSecond) + " 至 " + this.fmtMcTime(endSecond);
+		// console.log("acttime:", acttime);
+		return acttime;
+	},
+	
+	// 格式化赛事时间 2024.9.9-30 2024.9.9-10.30 2024.9.9-2025.10.30
+	fmtMcTime2(timestamp1, timestamp2) {
+		const date1 = new Date(timestamp1 * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+		const date2 = new Date(timestamp2 * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+	
+		const Y1 = date1.getFullYear();
+		const Y2 = date2.getFullYear();
+		const M1 = date1.getMonth() + 1;
+		const M2 = date2.getMonth() + 1;
+		const D1 = date1.getDate();
+		const D2 = date2.getDate();
+	
+		var timeStr1 = Y1 + '.' + M1 + '.' + D1;
+		var timeStr2 = '';
+	
+		if (Y2 != Y1) {
+			timeStr2 += Y2 + '.' + M2 + '.' + D2;
+		} else if (M2 != M1) {
+			timeStr2 += M2 + '.' + D2;
+		} else if (D2 != D1) {
+			timeStr2 += D2;
+		}
+	
+		var timeStr = timeStr1;
+		if (timeStr2.length > 0) {
+			timeStr += '-' + timeStr2;
+		}
+		// console.log("timeStr", timeStr);
+		return timeStr;
+	},
+	
+	// 判断赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
+	checkMcState(beginSecond, endSecond) {
+		let mcState = 0;	// 未开始
+		if (beginSecond > 0 && endSecond > 0) {
+			const now = Date.now() / 1000;
+			const dif1 = beginSecond - now;
+			const dif2 = endSecond - now;
+			// const dif = 3600*24 - 60;
+			if (dif1 > 0) {
+				console.log("活动未开始");
+				mcState = 0;	// 未开始
+			} else if (dif2 > 0) {
+				console.log("活动进行中");
+				mcState = 1;	// 进行中
+			} else {
+				console.log("活动已结束");
+				mcState = 2;	// 已结束
+			}
+		}
+		return mcState;
+	},
+
+	// 动态创建<style>标签，将CSS代码插入到文档中
+	loadCssCode(cssCode) {
+		this.removeCssCode();
+		
+		const styleId = "css-custom";
+		var style = window.document.createElement("style");
+		style.type = "text/css";
+		style.id = styleId;
+		if (style.styleSheet) {
+			// This is required for IE8 and below.
+			style.styleSheet.cssText = cssCode;
+		} else {
+			style.appendChild(document.createTextNode(cssCode));
+		}
+		document.getElementsByTagName("head")[0].appendChild(style);
+		// console.log("head:", document.getElementsByTagName("head")[0]);
+		// console.log("head:", document.getElementById(styleId));
+		// console.log("style:", style);
+	},
+	
+	// 删除之前动态创建的<style>标签
+	removeCssCode() {
+		const styleId = "css-custom";
+		var oldCss = document.getElementById(styleId);
+		// console.log("oldCss:", oldCss);
+		if (oldCss != null) {
+			document.getElementsByTagName("head")[0].removeChild(oldCss);
+			console.log("oldCss 已移除");
+		}
+	},
+
+	// uni-data-select 组件，根据选中的值获取对应的文本
+	getSelectedText(obj, value) {
+		const selectedOption = obj.find(option => option.value === value);
+		return selectedOption ? selectedOption.text : '';
+	},
+
+	objectToQueryString(obj) {
+		return Object.keys(obj).map(k => k + '=' + obj[k]).join('&');
+	},
+
+	// 秒数转换成 XX天XX小时
+	convertSecondsToDHM(seconds) {
+		var days = Math.floor(seconds / (3600 * 24));
+		var hours = Math.floor((seconds % (3600 * 24)) / 3600);
+		var minutes = Math.floor((seconds % (3600 * 24)) % 3600 / 60);
+		if (days > 0)
+			// return `${days.toString().padStart(2, '0')}天${hours.toString().padStart(2, '0')}小时`;
+			return `${days}天${hours.toString().padStart(2, '0')}小时`;
+		else
+			return `${hours.toString().padStart(2, '0')}小时${minutes.toString().padStart(2, '0')}分钟`;
+	},
+
+	// 秒数转换成时分秒
+	// style:  0 [01:02:03]  1 [1h:02'3"]
+	convertSecondsToHMS(seconds, style = 0) {
+		var hours = Math.floor(seconds / 3600);
+		var minutes = Math.floor((seconds % 3600) / 60);
+		var remainingSeconds = Math.floor(seconds % 60);
+		// return hours + ":" + minutes + ":" + remainingSeconds;
+		if (style == 0)
+			return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${remainingSeconds.toString().padStart(2, '0')}`;
+		else if (style == 1) {
+			if (hours > 0)
+				return `${hours}h${minutes}′${remainingSeconds}″`;
+			else
+				return `${minutes}′${remainingSeconds}″`;
+		}
+		else if (style == 2) {
+			if (hours > 0)
+				return `${hours*60+minutes}′${remainingSeconds}″`;
+			else
+				return `${minutes}′${remainingSeconds}″`;
+		}
+	},
+
+	// 计算（中英文混合）字符串长度
+	calStrLen(str) {
+		var length = 0;
+		for (var i = 0; i < str.length; i++) {
+			// 将字符转换为 Unicode 编码
+			var charCode = str.charCodeAt(i);
+			if (charCode >= 0 && charCode <= 128) {
+				length++;
+			} else {
+				length += 2;
+			}
+		}
+
+		return length;
+	},
+
+	// 集合对象去重
+	unique(arr, field) {
+		var map = {};
+		var res = [];
+		for (var i = 0; i < arr.length; i++) {
+			if (!map[arr[i][field]]) {
+				map[arr[i][field]] = 1;
+				res.push(arr[i]);
+			}
+		}
+		return res;
+	},
+
+	// 正则取出html标签
+	repalceHtml(str) {
+		var dd = str.replace(/<\/?.+?>/g, "");
+		var dds = dd.replace(/ /g, ""); //dds为得到后的内容
+		return dds;
+	},
+
+	// 判断身份证号    
+	isSfz(idcard) {
+		var id =
+			/^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|31)|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}([0-9]|x|X)$/
+		if (idcard === '') {
+			uni.showToast({
+				title: '请输入身份证号',
+				icon: 'none'
+			})
+		} else if (!id.test(idcard)) {
+			uni.showToast({
+				title: '身份证号格式不正确!',
+				icon: 'none'
+			})
+			return false
+		} else {
+			return false
+		}
+	},
+
+	// 判断是否是手机号   
+	isPhone(val) {
+		var patrn = /^(((1[3456789][0-9]{1})|(15[0-9]{1}))+\d{8})$/
+		if (!patrn.test(val) || val === '') {
+			uni.showToast({
+				title: '手机号格式不正确',
+				icon: 'none'
+			})
+			return false
+		} else {
+			return true
+		}
+	},
+
+	// 判断邮箱
+	isEmail(email) {
+		if (email.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1)
+			return true;
+		else
+			return false;
+	},
+
+	//获取随机数
+	getSuiji() {
+		var Range = Max - Min;
+		var Rand = Math.random();
+		return (Min + Math.round(Rand * Range));
+	},
+
+	//计算多长时间前
+	getDateDiff(dateTimeStamp) {
+		var minute = 1000 * 60;
+		var hour = minute * 60;
+		var day = hour * 24;
+		var halfamonth = day * 15;
+		var month = day * 30;
+		var year = day * 365;
+		var now = new Date().getTime();
+		var diffValue = now - dateTimeStamp;
+		if (diffValue < 0) {
+			return;
+		}
+		var yearC = diffValue / year;
+		var monthC = diffValue / month;
+		var weekC = diffValue / (7 * day);
+		var dayC = diffValue / day;
+		var hourC = diffValue / hour;
+		var minC = diffValue / minute;
+		if (yearC >= 1) {
+			result = "" + parseInt(yearC) + "年前";
+		}
+		if (monthC >= 1) {
+			result = "" + parseInt(monthC) + "月前";
+		} else if (weekC >= 1) {
+			result = "" + parseInt(weekC) + "周前";
+		} else if (dayC >= 1) {
+			result = "" + parseInt(dayC) + "天前";
+		} else if (hourC >= 1) {
+			result = "" + parseInt(hourC) + "小时前";
+		} else if (minC >= 1) {
+			result = "" + parseInt(minC) + "分钟前";
+		} else
+			result = "刚刚";
+		return result;
+	},
+
+	// 时间戳转时间
+	timestampToTime(timestamp, i) {
+		var date = new Date(timestamp); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+		// console.log(date, timestamp)
+		var Y = date.getFullYear();
+		var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
+		var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
+		var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours());
+		var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
+		var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
+		if (i == 1) {
+			return Y + '-' + M + '-' + D;
+		} else if (i == 2) {
+			return Y + '年' + M + '月' + D + '日';
+		}
+		return Y + '-' + M + '-' + D + ' ' + h + ':' + m + ':' + s;
+	},
+
+	// 是否是汉字
+	isHanzi(str) {
+		let reg = /\p{Unified_Ideograph}/ug;
+		return reg.test(str);
+	},
+
+	// 是否是字母数字
+	isStringAndNumber(str) {
+		let regNumber = new RegExp(/^[0-9A-Za-z]+$/);
+		return regNumber.test(str)
+	},
+
+	// var arr3 = [30,10,111,35,1899,50,45];
+	// 集合排序  元素数字
+	listSort(list) {
+		arr3.sort(function(a, b) {
+			return a - b;
+		})
+	},
+
+	// var arr5 = [{id:10},{id:5},{id:6},{id:9},{id:2},{id:3}];
+	// 元素  对象
+	listObjectSort(arr) {
+		arr.sort(function(a, b) {
+			return a.id - b.id
+		})
+		return arr;
+	},
+
+	/*
+	 * 忽略大小写判断字符串是否相同
+	 * @param str1
+	 * @param str2
+	 * @returns {Boolean}
+	 */
+	isEqualsIgnorecase: function(str1, str2) {
+		if (str1.toUpperCase() == str2.toUpperCase()) {
+			return true;
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	 * 判断是否是数字
+	 * @param value
+	 * @returns {Boolean}
+	 */
+	isNum: function(value) {
+		if (value != null && value.length > 0 && isNaN(value) == false) {
+			return true;
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	 * 判断是否是中文
+	 * @param str
+	 * @returns {Boolean}
+	 */
+	isChine: function(str) {
+		var reg = /^([u4E00-u9FA5]|[uFE30-uFFA0])*$/;
+		if (reg.test(str)) {
+			return false;
+		}
+		return true;
+	},
+
+	/*验证是否为图片*/
+	tmCheckImage: function(fileName) {
+		return /(gif|jpg|jpeg|png|GIF|JPG|PNG)$/ig.test(fileName);
+	},
+
+	/*验证是否为视频*/
+	tmCheckVideo: function(fileName) {
+		return /(mp4|mp3|flv|wav)$/ig.test(fileName);
+	},
+
+	/**
+	 * 去除字符串两边的空格
+	 * @param str
+	 * @returns {number|Number}
+	 * 调用方法：var str = utils.trim("abcd")
+	 */
+	trim: function(str) {
+		String.prototype.trim = function() {
+			return str.replace(/(^\s*)|(\s*$)/g, "");
+		}
+	},
+
+	// 判断密码是否符合 至少6位,包括大小写字母、数字、特殊字符
+	isPassword(val) {
+		var reg = /^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$)^.{8,16}$/;
+		if (val === '') {
+			uni.showToast({
+				title: '请输入密码',
+				icon: 'none'
+			})
+		} else if (!reg.test(val)) {
+			uni.showToast({
+				title: '至少6位,包括大小写字母、数字、特殊字符',
+				icon: 'none'
+			})
+			return false
+		} else {
+			return true
+		}
+	},
+
+	// 电话匿名
+	noPassByMobile(str) {
+		if (null != str && str != undefined) {
+			var pat = /(\d{3})\d*(\d{4})/;
+			return str.replace(pat, '$1****$2');
+		} else {
+			return "";
+		}
+	},
+
+	// 获取两点间的距离
+	//进行经纬度转换为距离的计算
+	Rad(d) {
+		return d * Math.PI / 180.0; //经纬度转换成三角函数中度分表形式。
+	},
+
+	/*
+	 计算距离，参数分别为第一点的纬度，经度；第二点的纬度，经度
+	 默认单位km
+	*/
+	getMapDistance(lat1, lat2, lng1, lng2) {
+		lat1 = lat1 || 0;
+		lng1 = lng1 || 0;
+		lat2 = lat2 || 0;
+		lng2 = lng2 || 0;
+
+		var rad1 = lat1 * Math.PI / 180.0;
+		var rad2 = lat2 * Math.PI / 180.0;
+		var a = rad1 - rad2;
+		var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
+		var r = 6378137;
+		var distance = r * 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(rad1) * Math.cos(rad2) *
+			Math.pow(Math.sin(b / 2), 2)));
+		// console.log(lat1, lng1, lat2, lng2);
+		// console.log(distance);
+		return Math.round(distance) / 1000;
+	},
+
+	// 预览图片
+	yulanImg(item) {
+		let arr = [item]
+		uni.previewImage({
+			urls: arr,
+		});
+	},
+
+}
+
 export default tools;

card/components/my-pathList/my-pathList.vue

@@ -1,5 +1,6 @@
 <template>
-	<view class="main-path uni-row" :style="style ? style : 'justify-content: space-evenly;'" v-for="num of pathListLen" :key="'row-' + num">
+	<view class="main-path uni-row" :style="style ? style : 'justify-content: space-evenly;'" v-for="num of pathListLen"
+		:key="'row-' + num">
 		<template v-for="(item, index) in pathList['row'+ num]" :key="'row-' + num + '-' + index">
 			<view v-if="item.type == 1 || item.type == 2">
 				<image mode="aspectFit" class="pathimg" :src="item.img" @click="onPathImgClick(item)">
@@ -9,29 +10,41 @@
 				<image mode="aspectFit" class="pathimg2" :src="item.pathImg" @click="onPathImgClick(item, 'path')">
 				</image>
 				<view class="uni-column">
-					<image mode="aspectFit" class="navimg" :src="item.navImg" @click="onPathImgClick(item, 'nav')"></image>
+					<image mode="aspectFit" class="navimg" :src="item.navImg" @click="onPathImgClick(item, 'nav')">
+					</image>
 					<text class="navtext">（导航）</text>
 				</view>
 			</view>
 		</template>
 		<view v-if="showLine && num < pathListLen" class="line"></view>
 	</view>
+	
+	<uni-popup ref="alertDialog" type="dialog">
+		<uni-popup-dialog type="warn" cancelText="取消" confirmText="确定" title="提示" :content="alertDialog.content"
+			@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
+	</uni-popup>
 </template>
 
 <script>
 	import tools from '/common/tools';
-	
+
 	export default {
-		name:"my-pathList",
+		name: "my-pathList",
 		props: {
 			pathList: {},
 			mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
-			showLine: false	,// 是否显示线条
+			selectedPath: 0, // 用户已选择的路线(ocaId)
+			showLine: false, // 是否显示线条
 			style: ""
 		},
+		emits: ['onPathClick'],
 		data() {
 			return {
 				navPoint: {},
+				alertDialog: {
+					content: "",
+					data: null
+				}
 			};
 		},
 		computed: {
@@ -39,8 +52,10 @@
 				return Object.keys(this.pathList).length;
 			}
 		},
+		mounted() {
+		},
 		methods: {
-			onPathImgClick(item, type='') {
+			onPathImgClick(item, type = '') {
 				//item.type 1: 比赛路线  2: 导航到指定地点
 				if (item.type == 1) {
 					this.dealPathClick(item);
@@ -57,9 +72,16 @@
 			dealPathClick(item) {
 				// 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
 				if (this.mcState == 1) {
-					const url = `action://to_detail/?id=${item.path.ocaId}&matchType=${item.path.mcType}`;
-					// window.location.href = url;
-					tools.appAction(url);
+					if (this.selectedPath > 0 && this.selectedPath != item.path.ocaId) {
+						this.alertDialog.content = "该路线与您之前选择的不一致，确定要更换路线吗？"
+						this.alertDialog.data = item;
+						this.$refs.alertDialog.open();
+					} else {
+						const url = `action://to_detail/?id=${item.path.ocaId}&matchType=${item.path.mcType}`;
+						// window.location.href = url;
+						tools.appAction(url);
+						this.$emit('onPathClick', item);
+					}
 				} else if (this.mcState == 0) {
 					uni.showToast({
 						title: '比赛尚未开始',
@@ -77,18 +99,26 @@
 			dealNavClick(item) {
 				this.navPoint = item.point;
 				// this.$refs.mypopupmap.popupOpen();
-				
+
 				const url =
 					`action://to_map_app?title=${this.navPoint.name}&latitude=${this.navPoint.latitude}&longitude=${this.navPoint.longitude}`;
 				// window.location.href = url;
 				tools.appAction(url);
+			},
+			dialogConfirm() {
+				const item = this.alertDialog.data;
+				const url = `action://to_detail/?id=${item.path.ocaId}&matchType=${item.path.mcType}`;
+				// window.location.href = url;
+				tools.appAction(url);
+				this.$emit('onPathClick', item);
+			},
+			dialogClose() {
 			}
 		}
 	}
 </script>
 
 <style scoped>
-
 	.pathimg {
 		width: 127px;
 		height: 115px;
@@ -119,12 +149,12 @@
 		/* justify-content: flex-start; */
 		/* justify-content: space-evenly; */
 	}
-	
+
 	.path-nav {
 		width: 50%;
 		justify-content: center;
 	}
-	
+
 	.line {
 		width: 100%;
 		height: 0px;
@@ -132,5 +162,4 @@
 		border: 1px dashed;
 		border-color: #c6c6c6;
 	}
-	
 </style>

card/components/my-popup/my-popup.vue

@@ -117,11 +117,11 @@
 				}
 
 				this.swiperCurrent = 0;
-				this.$refs.popup.open()
+				this.$refs.popup.open();
 				this.isOpen = true;
 			},
 			popupClose() {
-				this.$refs.popup.close()
+				this.$refs.popup.close();
 				this.isOpen = false;
 				this.$emit('popup-close');
 			},

card/components/my-tab/my-tab.vue

@@ -43,6 +43,7 @@
 		},
 		mounted() {
 			// console.log("initActIndex:" , this.initActIndex);
+			// console.log("tabItems:" , this.tabItems);
 			this.tabCurrent = this.initActIndex;
 		},
 		methods: {
@@ -81,8 +82,10 @@
 				if (mark.textColor.length > 0) {
 					if (this.tabCurrent != index) {
 						styleStr += "color: " + mark.textColor + ";";
+						styleStr += "background: url('" + mark.icon + "') no-repeat;";
+					} else {
+						styleStr += "background: url('" + mark.icon + "') #2e85ec no-repeat;";
 					}
-					styleStr += "background: url('" + mark.icon + "') no-repeat;";
 					styleStr += "background-position-x: 90%;";
 					styleStr += "background-position-y: 2%;";
 					styleStr += "background-size: 14px;";
@@ -135,7 +138,7 @@
 	.tab-active {
 		width: 100%;
 		height: 60rpx;
-		background: #2e85ec;
+		background-color: #2e85ec;
 		color: #ffffff;
 	}
 

card/manifest.json

@@ -2,8 +2,8 @@
     "name" : "card",
     "appid" : "__UNI__A61F96B",
     "description" : "",
-    "versionName" : "1.5.0",
-    "versionCode" : 150,
+    "versionName" : "1.5.1",
+    "versionCode" : 151,
     "transformPx" : false,
     /* 5+App特有相关 */
     "app-plus" : {

card/pages/bm/style1/rankList.vue

@@ -289,21 +289,11 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/rankList
 				}
 			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取活动时间
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
 			},
 			getTeamName(teamType, teamIndex) {
 				return teamName[teamType][teamIndex];

card/pages/bm/style1/signup.vue

@@ -10,7 +10,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 				<view class="topbar uni-row">
 					<image mode="aspectFit" class="topbar-back" @click="btnBack" src="/static/default/back.png"></image>
 					<text class="mcName">{{mcName}}</text>
-					<text class="topbar-rule" @click="btnInfo" >规则</text>
+					<text class="topbar-rule" @click="btnInfo">规则</text>
 					<!-- <image mode="aspectFit" class="topbar-info" @click="btnInfo" src="/static/default/info.png"></image> -->
 				</view>
 				<view :class="cssLogo"></view>
@@ -29,15 +29,14 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 					:localdata="teamList"></uni-data-select>
 				<view class="introduce uni-column">
 					<text class="introduce-title">{{introduce.title}}</text>
-					<text
-						class="introduce-content">{{introduce.content}}</text>
+					<text class="introduce-content">{{introduce.content}}</text>
 				</view>
 				<button class="btnSignup btnSignup-enable" v-if="mcState<=1" @click="btnSignup">报 名</button>
 				<button class="btnSignup btnSignup-disable" v-if="mcState==2">活动已结束</button>
 			</view>
-			
+
 			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
-			
+
 			<uni-popup ref="alertDialog" type="dialog">
 				<uni-popup-dialog type="info" cancelText="取消" confirmText="确认" title="您选择的是:" @confirm="dialogConfirm"
 					@close="dialogClose">
@@ -54,7 +53,10 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 
 <script>
 	import tools from '../../../common/tools';
-	import { teamName, defaultPopUpDataList } from '../../../common/define';
+	import {
+		teamName,
+		defaultPopUpDataList
+	} from '../../../common/define';
 	import {
 		token,
 		apiCardDetailQuery,
@@ -90,8 +92,8 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 				orgList: [], // 分组下拉列表数据源
 				teamList: [], // 
 				interval: null,
-				
-				mcState: 0 ,// 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
+
+				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
 				teamType: 0, // 队伍类型  0: 红黄蓝紫 1: 学生/家长
 				cssTop: "",
 				cssLogo: "",
@@ -102,8 +104,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 				popupDataList: [],
 			}
 		},
-		computed: {
-		},
+		computed: {},
 		onLoad(query) { // 类型非必填，可自动推导
 			// console.log(query);
 			this.queryObj = query;
@@ -112,15 +113,15 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 			this.from = query["from"] ?? "";
 			this.token = query["token"] ?? token;
 			this.ecId = query["id"] ?? 0;
-			
+
 			this.firstEnterKey += "-" + this.ecId;
 			console.log("firstEnterKey:", this.firstEnterKey);
-			
+
 			this.rankKey += "-" + this.ecId;
 			console.log("rankKey:", this.rankKey);
-			
+
 			tools.removeCssCode();
-			
+
 			this.getCardConfigQuery();
 			this.getCardDetailQuery();
 			this.getUserCurrentRankNumQuery();
@@ -202,12 +203,12 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 			},
 			loadConfig(config) {
 				// console.log("config", config);
-				
+
 				// 加载CSS样式
 				const css = config.css;
 				if (css != undefined && css.length > 0) {
 					tools.loadCssCode(css);
-					
+
 					if (css.indexOf(".top{") >= 0) {
 						this.cssTop = "top";
 					}
@@ -215,7 +216,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 						this.cssLogo = "logo";
 					}
 				}
-				
+
 				if (this.cssTop == "") {
 					this.cssTop = "top-default";
 				}
@@ -224,12 +225,12 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 				}
 				console.log("[loadConfig] cssTop:", this.cssTop);
 				console.log("[loadConfig] cssLogo:", this.cssLogo);
-				
+
 				// 加载队伍类型  0: 红黄蓝紫 1: 学生/家长
 				if (config.teamType != undefined && config.teamType >= 0) {
 					this.teamType = config.teamType;
 				}
-				
+
 				// 加载介绍内容
 				const introduce = config.introduce;
 				if (introduce != undefined) {
@@ -240,7 +241,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 						this.introduce.content = introduce.content;
 					}
 				}
-				
+
 				// 加载弹窗数据
 				const popupDataList = config.popupDataList;
 				// console.log("[loadConfig] popupDataList:", popupDataList);
@@ -264,7 +265,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 			getTeamList(teamNum) {
 				var teamList = [];
 				if (teamNum > 0) {
-					for (let i=0; i<=teamNum; i++) {
+					for (let i = 0; i <= teamNum; i++) {
 						teamList[i] = {};
 						teamList[i].value = i;
 						// teamList[i].text = `第 ${i+1} 队`;
@@ -274,21 +275,11 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 				this.teamList = teamList;
 			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取倒计时
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
 			},
 			getCardConfigQuery() {
 				uni.request({
@@ -349,9 +340,9 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 						},
 						"teamType": 1
 						}; */
-						
+
 						this.loadConfig(config);
-						
+
 						setTimeout(this.dealFirstEnter, 500);
 					},
 					fail: (err) => {
@@ -382,7 +373,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 						this.coiId = data.coiId;
 						this.coiName = data.coiName;
 						this.teamNum = data.teamNum;
-						
+
 						this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
 
 						this.getActtime();
@@ -438,7 +429,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 						this.coiRs = res.data.data.coiRs;
 						const rsNum = this.coiRs.length;
 						this.orgList = [];
-						for (let i=0; i<rsNum; i++) {
+						for (let i = 0; i < rsNum; i++) {
 							this.orgList[i] = {};
 							this.orgList[i].value = this.coiRs[i].coiId;
 							this.orgList[i].text = this.coiRs[i].coiName;
@@ -470,7 +461,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 					},
 					success: (res) => {
 						// console.log("onlineMcSignUp", res)
-						
+
 						if (checkResCode(res)) {
 							uni.showToast({
 								title: '比赛报名成功！',
@@ -509,7 +500,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 			btnInfo() {
 				this.$refs.mypopup.popupOpen();
 			},
-			orgChange(value, resetTeamNum=true) {
+			orgChange(value, resetTeamNum = true) {
 				// console.log("[orgChange] value:", value);
 				if (resetTeamNum) {
 					this.teamNum = 0;
@@ -522,13 +513,13 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 				} else {
 					this.getTeamList(0);
 				}
-				
+
 			},
 			btnSignup() {
 				if (!checkToken(this.token)) {
 					return;
 				}
-				
+
 				if (!(this.coiId > 0)) {
 					uni.showToast({
 						title: '请选择组织名称',
@@ -549,7 +540,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 				this.teamName = tools.getSelectedText(this.teamList, this.teamNum);
 				this.$refs.alertDialog.open();
 			},
-			dialogConfirm() {			
+			dialogConfirm() {
 				this.onlineMcSignUp();
 			},
 			dialogClose() {}
@@ -570,14 +561,14 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 		padding-top: 36px;
 		padding-bottom: 30px;
 		justify-content: space-between;
-		background-image: url("/static/backgroud/top_colorbar.png"), linear-gradient(180deg,#f8a95a 0%,#d25f11 100%);
+		background-image: url("/static/backgroud/top_colorbar.png"), linear-gradient(180deg, #f8a95a 0%, #d25f11 100%);
 		/* background-image: url("/static/backgroud/top_colorbar.png"), linear-gradient(180deg,#7aedff 0%,#047200 100%); */
 		/* background-image: url("/static/backgroud/top_colorbar.png"), linear-gradient(180deg,#178bff 0%,#004d9b 100%); */
 		background-repeat: no-repeat;
 		background-position: center, 0px 0px;
-		background-size: auto 176px , cover;
+		background-size: auto 176px, cover;
 	}
-	
+
 	.logo-default {
 		width: 150px;
 		height: 150px;
@@ -588,7 +579,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 		background-position-y: center;
 		background-size: contain;
 	}
-	
+
 	.topbar {
 		width: 90%;
 		padding: 0rpx 30rpx;
@@ -610,7 +601,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 		color: white;
 		font-size: 32rpx;
 	}
-	
+
 	.mcName {
 		color: white;
 		font-size: 40rpx;
@@ -677,7 +668,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 		line-height: 100rpx;
 		border-radius: 55rpx;
 	}
-	
+
 	.btnSignup-enable {
 		background-color: #2e85ec;
 	}
@@ -685,7 +676,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style1/signup
 	.btnSignup-disable {
 		background-color: #c3c3c3;
 	}
-	
+
 	.dialog-content {
 		width: 279px;
 		height: 152px;

card/pages/bm/style2/rankList.vue

@@ -287,21 +287,11 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style2/rankList
 				}
 			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取活动时间
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
 			},
 			getTeamName(teamType, teamIndex) {
 				return teamName[teamType][teamIndex];

card/pages/bm/style2/rankOverview.vue

@@ -1,701 +1,691 @@
-<!-- 
-[报名] 样式2 - 排名总览
-http://localhost:5173/card/#/pages/bm/style2/rankOverview
-https://oss-mbh5.colormaprun.com/card/#/pages/bm/style2/rankOverview
- -->
-<template>
-	<view class="body">
-		<view class="content">
-			<view class="uni-column" :class="cssTop">
-				<view class="topbar uni-row" :class="cssTopbarColor">
-					<uni-icons type="left" class="topbar-back" @click="btnBack"></uni-icons>
-					<text class="mcName" @click="playMusic">{{mcName}}</text>
-					<text class="topbar-rule" @click="btnInfo">规则</text>
-					<!-- <image mode="aspectFit" class="topbar-info" @click="btnInfo" src="/static/default/info.png"></image> -->
-				</view>
-
-				<view class="topbtm uni-column">
-					<text class="topbtm-name">姓名：{{nickName}}</text>
-				</view>
-			</view>
-			<view class="top-oval">
-				<!-- <text class="top-oval-text" @click="onOverviewClick('totalNum')">点击查看排行榜</text> -->
-			</view>
-
-			<view class="mid uni-column">
-				<view class="mid-1 uni-row uni-jcsb">
-					<view class="overview-1 uni-column" @click="onOverviewClick('totalDistanct')">
-						<text class="ovline1">总距离 {{fmtDistanct(totalDistanct)}} km</text>
-						<text class="ovline2">第 {{totalDistanctRankNum > 0 ? totalDistanctRankNum : '- -'}} 名</text>
-					</view>
-					<view class="overview-2 uni-column" @click="onOverviewClick('totalNum')">
-						<text class="">总场次 {{totalNum}}</text>
-					</view>
-					<view class="overview-3 uni-column" @click="onOverviewClick('totalCp')">
-						<text class="ovline1">总打点数 {{totalCp}} 个</text>
-						<text class="ovline2">第 {{totalCpRankNum > 0 ? totalCpRankNum : '- -'}} 名</text>
-					</view>
-				</view>
-				<view class="mid-2 uni-row uni-jcse">
-					<view class="overview-4 uni-column" @click="onOverviewClick('totalSysPoint')">
-						<text class="ovline1">总百味豆 {{totalSysPoint}} 个</text>
-						<text class="ovline2">第 {{totalSysPointRankNum > 0 ? totalSysPointRankNum : '- -'}} 名</text>
-					</view>
-					<view class="overview-5 uni-column" @click="onOverviewClick('fastPace')">
-						<text class="ovline1">最快配速 {{fmtPace(fastPace)}}</text>
-						<text class="ovline2">第 {{fastPaceRankNum > 0 ? fastPaceRankNum : '- -'}} 名</text>
-					</view>
-				</view>
-			</view>
-
-			<view class="main uni-column">
-				<text class="main-title">选择比赛路线</text>
-				<my-pathList :style="pathListStyle.style" :pathList="pathList" :mcState="mcState" :showLine="pathListStyle.showLine"></my-pathList>
-			</view>
-
-			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
-			<!-- <my-popup-map ref="mypopupmap" :point="navPoint"></my-popup-map> -->
-		</view>
-	</view>
-</template>
-
-<script>
-	import tools from '/common/tools';
-	import {
-		defaultPopUpDataList
-	} from '/common/define';
-	import {
-		token,
-		apiMatchRsDetailQuery,
-		apiCardConfigQuery,
-		checkResCode
-	} from '/common/api';
-
-	export default {
-		data() {
-			return {
-				// audioSrc: "/static/audio/2.mp3",
-				// audioSrc: "https://oss-mbh5.colormaprun.com/card/static/audio/2.mp3",
-				// audioSrc: "http://t-oss-mbh5.colormaprun.com/card/static/audio/2.mp3",
-				pageName: "rankOverview",
-				firstEnterKey: 'firstEnter-bm-style2',
-				rankKey: "rank-bm-style2",
-				queryObj: {},
-				queryString: "",
-				token: "",
-
-				ecId: 0, // 卡片id
-				mcId: 0, // 赛事id
-				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
-				mcName: "", // 赛事名称
-				acttime: "", // 活动时间
-				beginSecond: null, // 活动或赛事开始时间戳，单位秒
-				endSecond: null, // 活动或赛事结束时间戳，单位秒
-				nickName: "", // 昵称
-				totalNum: null, // 总场次
-				totalDistanct: null, // 总距离,单位米
-				totalDistanctRankNum: null, // 总距离排名
-				totalCp: null, // 总打点数
-				totalCpRankNum: null, // 总打点数排名
-				totalSysPoint: null, // 总百味豆
-				totalSysPointRankNum: null, // 总百味豆排名
-				fastPace: null, // 个人最快配速
-				fastPaceRankNum: null, // 个人最快配速排名
-				ocaRs: [], // 卡片对应活动集合
-
-				interval: null,
-				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
-				cssTop: "",
-				cssTopbarColor: "",
-				pathList: {},
-				pathListStyle: {},
-				popupDataList: [],
-				navPoint: {},
-			}
-		},
-		computed: {
-			pathListLen() {
-				return Object.keys(this.pathList).length;
-			}
-		},
-		onLoad(query) { // 类型非必填，可自动推导
-			// console.log("query:", query);
-			this.queryObj = query;
-			this.queryString = tools.objectToQueryString(this.queryObj);
-			// console.log(queryString);
-			this.token = query["token"] ?? token;
-			this.ecId = query["id"] ?? 0;
-
-			this.firstEnterKey += "-" + this.ecId;
-			console.log("firstEnterKey:", this.firstEnterKey);
-
-			this.rankKey += "-" + this.ecId;
-			console.log("rankKey:", this.rankKey);
-
-			tools.removeCssCode();
-
-			this.getCardConfigQuery();
-		},
-		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
-		onReady() {
-			// this.dealFirstEnter();
-			// this.playMusic();
-		},
-		onShow() {
-			// uni.showToast({
-			// 	icon: "none",
-			// 	title: "[rankOverview] onShow"
-			// })
-			// if (this.$audio.audioStatus == 2 && this.$audio.audioSrc == this.audioSrc) {
-			// 	this.$audio.play();
-			// }
-		},
-		onUnload() {
-			this.clear();
-		},
-		methods: {
-			playMusic() {
-				return;
-				// uni.showToast({
-				// 	title: 'playMusic',
-				// 	icon: 'none',
-				// 	duration: 2000
-				// });
-				// if (this.$audio.audioStatus == 0 || this.$audio.audioSrc != this.audioSrc) {
-				// 	this.$audio.playAudio(this.audioSrc);
-				// }
-			},
-			dealNotice(rank) {
-				// console.log('[dealFirstEnter]');
-				let that = this;
-				uni.getStorage({
-					key: that.rankKey,
-					success: (res) => {
-						console.log('[getStorage]', that.rankKey, res.data);
-						const oldRank = res.data;
-						if (oldRank != rank) {
-							// that.notice = true;
-							that.setRankValue(rank);
-						}
-					},
-					fail: (e) => {
-						console.log('[getStorage] fail', that.rankKey, e);
-						// that.notice = false;
-						that.setRankValue(rank);
-					},
-				})
-			},
-			setRankValue(data) {
-				let that = this;
-				uni.setStorage({
-					key: that.rankKey,
-					data: data,
-					success: () => {
-						console.log('[setStorage] success', that.rankKey, data);
-					},
-					fail: (e) => {
-						console.log('[setStorage] fail', that.rankKey, e);
-					},
-				})
-			},
-			dealFirstEnter() {
-				// console.log('[dealFirstEnter]');
-				let that = this;
-				uni.getStorage({
-					key: that.firstEnterKey,
-					success: (res) => {
-						console.log('[getStorage]', that.firstEnterKey, res.data);
-					},
-					fail: (e) => {
-						console.log('[getStorage] fail', that.firstEnterKey, e);
-						that.btnInfo();
-						that.setFirstEnterValue(true);
-					},
-				})
-			},
-			setFirstEnterValue(data) {
-				let that = this;
-				uni.setStorage({
-					key: that.firstEnterKey,
-					data: data,
-					success: () => {
-						console.log('[setStorage] success', that.firstEnterKey, data);
-					},
-					fail: (e) => {
-						console.log('[setStorage] fail', that.firstEnterKey, e);
-					},
-				})
-			},
-			clear() {
-				if (this.interval != null) {
-					clearInterval(this.interval);
-					this.interval = null;
-				}
-			},
-			loadConfig(config) {
-				// console.log("config", config);
-
-				// 加载CSS样式
-				const css = config.css;
-				if (css != undefined && css.length > 0) {
-					tools.loadCssCode(css);
-
-					if (css.indexOf(".top{") >= 0) {
-						this.cssTop = "top";
-					}
-					if (css.indexOf(".topbar-color{") >= 0) {
-						this.cssTopbarColor = "topbar-color";
-					}
-				}
-
-				if (this.cssTop == "") {
-					this.cssTop = "top-default";
-				}
-				if (this.cssTopbarColor == "") {
-					this.cssTopbarColor = "topbar-color-default";
-				}
-				console.log("[loadConfig] cssTop:", this.cssTop);
-				console.log("[loadConfig] cssTopbarColor:", this.cssTopbarColor);
-
-				// 加载比赛路线数据
-				const pathList = config.pathList;
-				// console.log("[loadConfig] pathList:", pathList);
-				if (pathList != undefined) {
-					this.pathList = pathList;
-				}
-
-				// 加载比赛路线样式
-				const pathListStyle = config.pathListStyle;
-				// console.log("[loadConfig] pathList:", pathList);
-				if (pathListStyle != undefined) {
-					this.pathListStyle = pathListStyle;
-				}
-
-				// 加载弹窗数据
-				const popupDataList = config.popupDataList;
-				// console.log("[loadConfig] popupDataList:", popupDataList);
-				if (popupDataList != undefined && popupDataList.length > 0) {
-					for (var i = 0; i < popupDataList.length; i++) {
-						// console.log("[loadConfig] popupDataList", i, popupDataList[i]);
-						if (popupDataList[i] == 'default') {
-							for (var j = 0; j < defaultPopUpDataList.length; j++) {
-								this.popupDataList.push(defaultPopUpDataList[j]);
-							}
-						} else {
-							this.popupDataList.push(popupDataList[i]);
-						}
-					}
-				} else {
-					this.popupDataList = defaultPopUpDataList;
-					console.log("[loadConfig] popupDataList 加载默认列表");
-				}
-				// console.log("[loadConfig] popupDataList:", this.popupDataList);
-			},
-			// 获取倒计时
-			getCountdown() {
-				// console.log(this.endSecond)
-				if (this.endSecond > 0) {
-					const now = Date.now() / 1000;
-					const dif = this.endSecond - now;
-					// const dif = 3600*24 - 60;
-					if (dif > 0) {
-						this.countdown = '距结束 ' + tools.convertSecondsToDHM(dif);
-					} else {
-						this.countdown = "活动已结束";
-					}
-					// this.countdown = tools.convertSecondsToHMS(dif);
-				} else {
-					this.countdown = "距结束 --天--小时";
-				}
-			},
-			// 格式化 距离
-			fmtDistanct(val) {
-				if (val < 1000)
-					return Math.round(val * 10 / 1000) / 10;
-				else
-					return Math.round(val / 1000);
-			},
-			// 格式化 配速
-			fmtPace(val) {
-				return tools.convertSecondsToHMS(val, 2);
-			},
-			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
-			},
-			// 获取活动时间
-			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
-			},
-			getCardConfigQuery() {
-				uni.request({
-					url: apiCardConfigQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId,
-						pageName: this.pageName
-					},
-					success: (res) => {
-						// console.log("getCardConfigQuery", res)
-						const data = res.data.data;
-						// console.log("configJson", data.configJson);
-						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
-						// console.log("configJson", data.configJson);
-						/* const config = {
-							"css": `
-								.top{
-									position: relative;
-									z-index: 10;
-									width: 100%;
-									height: 300px;
-									padding-top: 36px;
-									justify-content: space-between;
-									background-image: url('static/backgroud/top_bg_sea.png');
-									background-repeat: no-repeat;
-									background-position-x: center;
-									background-position-y: bottom;
-									background-size: cover;
-								}
-							`,
-							"pathList": {
-								"row1": [{
-										"type": 2, // 1: 比赛路线  2: 导航到指定地点
-										"img": "/static/common/dhdqdwz.png",
-										"point": {
-											"longitude": 117.022194,
-											"latitude": 36.661612,
-											"name": "小飞龙定向赛起始点"
-										}
-									},
-									{
-										"type": 1, // 1: 比赛路线  2: 导航到指定地点
-										"img": "/static/common/cjlx12dw.png",
-										"path": {
-											"ocaId": 1,
-											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
-										}
-									}
-								],
-								"row2": [{
-										"type": 1, // 1: 比赛路线  2: 导航到指定地点
-										"img": "/static/common/zjlx16dw.png",
-										"path": {
-											"ocaId": 2,
-											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
-										}
-									},
-									{
-										"type": 1, // 1: 比赛路线  2: 导航到指定地点
-										"img": "/static/common/gjlx20dw.png",
-										"path": {
-											"ocaId": 3,
-											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
-										}
-									}
-								]
-							},
-							"pathListStyle" : {
-								"showLine" : false,
-								"style": "justify-content: space-evenly;"
-							},
-							"popupDataList": [{
-									"type": 1,
-									"data": {
-										"title": "小飞龙定向赛",
-										"img": "/static/logo/xfl.png",
-										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
-									}
-								},
-								{
-									type: 2,
-									data: {
-										title: "规则",
-										img: "/static/common/guize.png",
-									}
-								}, {
-									type: 2,
-									data: {
-										title: "奖励",
-										img: "/static/common/jiangli.png",
-									}
-								},
-								"default"
-							]
-						}; */
-
-						this.loadConfig(config);
-						this.matchRsDetailQuery();
-
-						setTimeout(this.dealFirstEnter, 500);
-					},
-					fail: (err) => {
-						console.log("getCardConfigQuery err", err)
-					},
-				});
-			},
-			// 卡片对应线上赛多个活动查询
-			matchRsDetailQuery() {
-				uni.request({
-					url: apiMatchRsDetailQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId
-					},
-					success: (res) => {
-						console.log("matchRsDetailQuery", res);
-						if (checkResCode(res)) {
-							const data = res.data.data;
-							this.mcType = data.mcType;
-							this.mcId = data.mcId;
-							this.mcName = data.mcName;
-							this.beginSecond = data.beginSecond;
-							this.endSecond = data.endSecond;
-							this.nickName = data.nickName;
-							this.totalNum = data.totalNum;
-							this.totalDistanct = data.totalDistanct;
-							this.totalDistanctRankNum = data.totalDistanctRankNum;
-							this.totalCp = data.totalCp;
-							this.totalCpRankNum = data.totalCpRankNum;
-							this.totalSysPoint = data.totalSysPoint;
-							this.totalSysPointRankNum = data.totalSysPointRankNum;
-							this.fastPace = data.fastPace;
-							this.fastPaceRankNum = data.fastPaceRankNum;
-							this.ocaRs = data.ocaRs;
-
-							this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
-
-							const rank = JSON.stringify(data);
-							this.dealNotice(rank);
-
-							this.getCountdown();
-							this.getActtime();
-
-							this.clear();
-							this.interval = setInterval(this.getCountdown, 60000);
-						}
-					},
-					fail: (err) => {
-						console.log("matchRsDetailQuery err", err)
-					},
-				});
-			},
-			btnBack() {
-				// window.history.back();
-				// const url = `action://to_home/`;
-				// window.location.href = url;
-				// tools.appAction(url);
-				
-				uni.navigateTo({
-					url: "/pages/bm/style2/rankList?" + this.queryString
-				});
-			},
-			btnInfo() {
-				// console.log(this.$refs.mypopup);
-				this.$refs.mypopup.popupOpen();
-			},
-			onOverviewClick(ovtype) {
-				this.queryObj.ovtype = ovtype;
-				this.queryString = tools.objectToQueryString(this.queryObj);
-				uni.navigateTo({
-					url: "/pages/bm/style2/rankList?" + this.queryString
-				});
-			},
-		}
-	}
-</script>
-
-<style scoped>
-	.content {
-		width: 100vw;
-		height: 100vh;
-		overflow-x: hidden;
-	}
-
-	.top-default {
-		position: relative;
-		z-index: 10;
-		width: 100%;
-		height: 300px;
-		padding-top: 36px;
-		justify-content: space-between;
-		background-image: url("/static/backgroud/top_bg_aoti2.png");
-		background-repeat: no-repeat;
-		background-position-x: center;
-		background-position-y: bottom;
-		/* background-size: 100% 100%; */
-		background-size: cover;
-	}
-
-	.top-oval {
-		position: relative;
-		z-index: 0;
-		margin-top: -180px;
-		margin-left: -10%;
-		width: 120%;
-		height: 280px;
-		background: linear-gradient(180deg, #ffffff 12.18%, #eeeeee 100%);
-		border-radius: 50%;
-		text-align: center;
-	}
-	
-	.top-oval-text {
-		color: #333333;
-		font-size: 13px;
-		line-height: 386px;
-		pointer-events: auto;
-	}
-
-	.topbar {
-		width: 90%;
-		justify-content: space-between;
-	}
-
-	.topbar-color-default {
-		color: #5b9100;
-	}
-
-	.topbar-back {
-		width: 43rpx;
-		height: 43rpx;
-		color: inherit !important;
-		font-size: 48rpx !important;
-		/* opacity: 0; */
-	}
-
-	.topbar-info {
-		width: 46rpx;
-		height: 46rpx;
-	}
-
-	.topbar-rule {
-		font-size: 32rpx;
-	}
-
-	.mcName {
-		font-size: 40rpx;
-		font-weight: 550;
-	}
-
-	.topbtm {
-		width: 100%;
-		/* height: 60rpx; */
-		margin-bottom: 40px;
-		justify-content: space-evenly;
-	}
-
-	.topbtm-name {
-		/* width: 320rpx; */
-		/* height: 28px; */
-		padding: 5px 12px;
-		background-color: #9fda39;
-		border-radius: 5px;
-		/* backdrop-filter: blur(30px); */
-		text-align: center;
-		font-weight: 500;
-		color: #497400;
-		font-size: 14px;
-	}
-
-	.mid {
-		position: relative;
-		z-index: 20;
-		margin-top: -130px;
-		pointer-events: none;
-	}
-
-	.mid-1 {
-		width: 92%;
-	}
-
-	.mid-2 {
-		width: 66%;
-	}
-
-	.overview-1 {
-		width: 111px;
-		height: 54px;
-		background: #ffb40b;
-		border-radius: 50%;
-		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
-		pointer-events: auto;
-	}
-
-	.overview-2 {
-		margin-top: -43px;
-		color: #ffffff;
-		font-size: 18px;
-		pointer-events: auto;
-	}
-
-	.overview-3 {
-		width: 111px;
-		height: 54px;
-		background: #f39509;
-		border-radius: 50%;
-		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
-		pointer-events: auto;
-	}
-
-	.overview-4 {
-		width: 111px;
-		height: 54px;
-		background: #81cd00;
-		border-radius: 50%;
-		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
-		pointer-events: auto;
-	}
-
-	.overview-5 {
-		width: 111px;
-		height: 54px;
-		background: #64cbb0;
-		border-radius: 50%;
-		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
-		pointer-events: auto;
-	}
-
-	.ovline1 {
-		margin-top: 9px;
-		color: #ffffff;
-		font-size: 12px;
-	}
-
-	.ovline2 {
-		color: #ffffff;
-		font-size: 16px;
-	}
-
-	.main {
-		width: 100%;
-		margin-top: 36px;
-		margin-bottom: 10px;
-		/* height: 70vh; */
-		justify-content: space-around;
-		/* justify-content: space-between; */
-	}
-
-	.main-title {
-		margin-bottom: 10px;
-		font-weight: 550;
-		color: #333333;
-		font-size: 16px;
-	}
-
+<!-- 
+[报名] 样式2 - 排名总览
+http://localhost:5173/card/#/pages/bm/style2/rankOverview
+https://oss-mbh5.colormaprun.com/card/#/pages/bm/style2/rankOverview
+ -->
+<template>
+	<view class="body">
+		<view class="content">
+			<view class="uni-column" :class="cssTop">
+				<view class="topbar uni-row" :class="cssTopbarColor">
+					<uni-icons type="left" class="topbar-back" @click="btnBack"></uni-icons>
+					<text class="mcName" @click="playMusic">{{mcName}}</text>
+					<text class="topbar-rule" @click="btnInfo">规则</text>
+					<!-- <image mode="aspectFit" class="topbar-info" @click="btnInfo" src="/static/default/info.png"></image> -->
+				</view>
+
+				<view class="topbtm uni-column">
+					<text class="topbtm-name">姓名：{{nickName}}</text>
+				</view>
+			</view>
+			<view class="top-oval">
+				<!-- <text class="top-oval-text" @click="onOverviewClick('totalNum')">点击查看排行榜</text> -->
+			</view>
+
+			<view class="mid uni-column">
+				<view class="mid-1 uni-row uni-jcsb">
+					<view class="overview-1 uni-column" @click="onOverviewClick('totalDistanct')">
+						<text class="ovline1">总距离 {{fmtDistanct(totalDistanct)}} km</text>
+						<text class="ovline2">第 {{totalDistanctRankNum > 0 ? totalDistanctRankNum : '- -'}} 名</text>
+					</view>
+					<view class="overview-2 uni-column" @click="onOverviewClick('totalNum')">
+						<text class="">总场次 {{totalNum}}</text>
+					</view>
+					<view class="overview-3 uni-column" @click="onOverviewClick('totalCp')">
+						<text class="ovline1">总打点数 {{totalCp}} 个</text>
+						<text class="ovline2">第 {{totalCpRankNum > 0 ? totalCpRankNum : '- -'}} 名</text>
+					</view>
+				</view>
+				<view class="mid-2 uni-row uni-jcse">
+					<view class="overview-4 uni-column" @click="onOverviewClick('totalSysPoint')">
+						<text class="ovline1">总百味豆 {{totalSysPoint}} 个</text>
+						<text class="ovline2">第 {{totalSysPointRankNum > 0 ? totalSysPointRankNum : '- -'}} 名</text>
+					</view>
+					<view class="overview-5 uni-column" @click="onOverviewClick('fastPace')">
+						<text class="ovline1">最快配速 {{fmtPace(fastPace)}}</text>
+						<text class="ovline2">第 {{fastPaceRankNum > 0 ? fastPaceRankNum : '- -'}} 名</text>
+					</view>
+				</view>
+			</view>
+
+			<view class="main uni-column">
+				<text class="main-title">选择比赛路线</text>
+				<my-pathList :style="pathListStyle.style" :pathList="pathList" :mcState="mcState"
+					:showLine="pathListStyle.showLine"></my-pathList>
+			</view>
+
+			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
+			<!-- <my-popup-map ref="mypopupmap" :point="navPoint"></my-popup-map> -->
+		</view>
+	</view>
+</template>
+
+<script>
+	import tools from '/common/tools';
+	import {
+		defaultPopUpDataList
+	} from '/common/define';
+	import {
+		token,
+		apiMatchRsDetailQuery,
+		apiCardConfigQuery,
+		checkResCode
+	} from '/common/api';
+
+	export default {
+		data() {
+			return {
+				// audioSrc: "/static/audio/2.mp3",
+				// audioSrc: "https://oss-mbh5.colormaprun.com/card/static/audio/2.mp3",
+				// audioSrc: "http://t-oss-mbh5.colormaprun.com/card/static/audio/2.mp3",
+				pageName: "rankOverview",
+				firstEnterKey: 'firstEnter-bm-style2',
+				rankKey: "rank-bm-style2",
+				queryObj: {},
+				queryString: "",
+				token: "",
+
+				ecId: 0, // 卡片id
+				mcId: 0, // 赛事id
+				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+				mcName: "", // 赛事名称
+				acttime: "", // 活动时间
+				beginSecond: null, // 活动或赛事开始时间戳，单位秒
+				endSecond: null, // 活动或赛事结束时间戳，单位秒
+				nickName: "", // 昵称
+				totalNum: null, // 总场次
+				totalDistanct: null, // 总距离,单位米
+				totalDistanctRankNum: null, // 总距离排名
+				totalCp: null, // 总打点数
+				totalCpRankNum: null, // 总打点数排名
+				totalSysPoint: null, // 总百味豆
+				totalSysPointRankNum: null, // 总百味豆排名
+				fastPace: null, // 个人最快配速
+				fastPaceRankNum: null, // 个人最快配速排名
+				ocaRs: [], // 卡片对应活动集合
+
+				interval: null,
+				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
+				cssTop: "",
+				cssTopbarColor: "",
+				pathList: {},
+				pathListStyle: {},
+				popupDataList: [],
+				navPoint: {},
+			}
+		},
+		computed: {
+			pathListLen() {
+				return Object.keys(this.pathList).length;
+			}
+		},
+		onLoad(query) { // 类型非必填，可自动推导
+			// console.log("query:", query);
+			this.queryObj = query;
+			this.queryString = tools.objectToQueryString(this.queryObj);
+			// console.log(queryString);
+			this.token = query["token"] ?? token;
+			this.ecId = query["id"] ?? 0;
+
+			this.firstEnterKey += "-" + this.ecId;
+			console.log("firstEnterKey:", this.firstEnterKey);
+
+			this.rankKey += "-" + this.ecId;
+			console.log("rankKey:", this.rankKey);
+
+			tools.removeCssCode();
+
+			this.getCardConfigQuery();
+		},
+		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
+		onReady() {
+			// this.dealFirstEnter();
+			// this.playMusic();
+		},
+		onShow() {
+			// uni.showToast({
+			// 	icon: "none",
+			// 	title: "[rankOverview] onShow"
+			// })
+			// if (this.$audio.audioStatus == 2 && this.$audio.audioSrc == this.audioSrc) {
+			// 	this.$audio.play();
+			// }
+		},
+		onUnload() {
+			this.clear();
+		},
+		methods: {
+			playMusic() {
+				return;
+				// uni.showToast({
+				// 	title: 'playMusic',
+				// 	icon: 'none',
+				// 	duration: 2000
+				// });
+				// if (this.$audio.audioStatus == 0 || this.$audio.audioSrc != this.audioSrc) {
+				// 	this.$audio.playAudio(this.audioSrc);
+				// }
+			},
+			dealNotice(rank) {
+				// console.log('[dealFirstEnter]');
+				let that = this;
+				uni.getStorage({
+					key: that.rankKey,
+					success: (res) => {
+						console.log('[getStorage]', that.rankKey, res.data);
+						const oldRank = res.data;
+						if (oldRank != rank) {
+							// that.notice = true;
+							that.setRankValue(rank);
+						}
+					},
+					fail: (e) => {
+						console.log('[getStorage] fail', that.rankKey, e);
+						// that.notice = false;
+						that.setRankValue(rank);
+					},
+				})
+			},
+			setRankValue(data) {
+				let that = this;
+				uni.setStorage({
+					key: that.rankKey,
+					data: data,
+					success: () => {
+						console.log('[setStorage] success', that.rankKey, data);
+					},
+					fail: (e) => {
+						console.log('[setStorage] fail', that.rankKey, e);
+					},
+				})
+			},
+			dealFirstEnter() {
+				// console.log('[dealFirstEnter]');
+				let that = this;
+				uni.getStorage({
+					key: that.firstEnterKey,
+					success: (res) => {
+						console.log('[getStorage]', that.firstEnterKey, res.data);
+					},
+					fail: (e) => {
+						console.log('[getStorage] fail', that.firstEnterKey, e);
+						that.btnInfo();
+						that.setFirstEnterValue(true);
+					},
+				})
+			},
+			setFirstEnterValue(data) {
+				let that = this;
+				uni.setStorage({
+					key: that.firstEnterKey,
+					data: data,
+					success: () => {
+						console.log('[setStorage] success', that.firstEnterKey, data);
+					},
+					fail: (e) => {
+						console.log('[setStorage] fail', that.firstEnterKey, e);
+					},
+				})
+			},
+			clear() {
+				if (this.interval != null) {
+					clearInterval(this.interval);
+					this.interval = null;
+				}
+			},
+			loadConfig(config) {
+				// console.log("config", config);
+
+				// 加载CSS样式
+				const css = config.css;
+				if (css != undefined && css.length > 0) {
+					tools.loadCssCode(css);
+
+					if (css.indexOf(".top{") >= 0) {
+						this.cssTop = "top";
+					}
+					if (css.indexOf(".topbar-color{") >= 0) {
+						this.cssTopbarColor = "topbar-color";
+					}
+				}
+
+				if (this.cssTop == "") {
+					this.cssTop = "top-default";
+				}
+				if (this.cssTopbarColor == "") {
+					this.cssTopbarColor = "topbar-color-default";
+				}
+				console.log("[loadConfig] cssTop:", this.cssTop);
+				console.log("[loadConfig] cssTopbarColor:", this.cssTopbarColor);
+
+				// 加载比赛路线数据
+				const pathList = config.pathList;
+				// console.log("[loadConfig] pathList:", pathList);
+				if (pathList != undefined) {
+					this.pathList = pathList;
+				}
+
+				// 加载比赛路线样式
+				const pathListStyle = config.pathListStyle;
+				// console.log("[loadConfig] pathList:", pathList);
+				if (pathListStyle != undefined) {
+					this.pathListStyle = pathListStyle;
+				}
+
+				// 加载弹窗数据
+				const popupDataList = config.popupDataList;
+				// console.log("[loadConfig] popupDataList:", popupDataList);
+				if (popupDataList != undefined && popupDataList.length > 0) {
+					for (var i = 0; i < popupDataList.length; i++) {
+						// console.log("[loadConfig] popupDataList", i, popupDataList[i]);
+						if (popupDataList[i] == 'default') {
+							for (var j = 0; j < defaultPopUpDataList.length; j++) {
+								this.popupDataList.push(defaultPopUpDataList[j]);
+							}
+						} else {
+							this.popupDataList.push(popupDataList[i]);
+						}
+					}
+				} else {
+					this.popupDataList = defaultPopUpDataList;
+					console.log("[loadConfig] popupDataList 加载默认列表");
+				}
+				// console.log("[loadConfig] popupDataList:", this.popupDataList);
+			},
+			// 获取倒计时
+			getCountdown() {
+				// console.log(this.endSecond)
+				if (this.endSecond > 0) {
+					const now = Date.now() / 1000;
+					const dif = this.endSecond - now;
+					// const dif = 3600*24 - 60;
+					if (dif > 0) {
+						this.countdown = '距结束 ' + tools.convertSecondsToDHM(dif);
+					} else {
+						this.countdown = "活动已结束";
+					}
+					// this.countdown = tools.convertSecondsToHMS(dif);
+				} else {
+					this.countdown = "距结束 --天--小时";
+				}
+			},
+			// 格式化 距离
+			fmtDistanct(val) {
+				if (val < 1000)
+					return Math.round(val * 10 / 1000) / 10;
+				else
+					return Math.round(val / 1000);
+			},
+			// 格式化 配速
+			fmtPace(val) {
+				return tools.convertSecondsToHMS(val, 2);
+			},
+			fmtMcTime(timestamp) {
+				return tools.fmtMcTime(timestamp);
+			},
+			// 获取活动时间
+			getActtime() {
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
+			},
+			getCardConfigQuery() {
+				uni.request({
+					url: apiCardConfigQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId,
+						pageName: this.pageName
+					},
+					success: (res) => {
+						// console.log("getCardConfigQuery", res)
+						const data = res.data.data;
+						// console.log("configJson", data.configJson);
+						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
+						// console.log("configJson", data.configJson);
+						/* const config = {
+							"css": `
+								.top{
+									position: relative;
+									z-index: 10;
+									width: 100%;
+									height: 300px;
+									padding-top: 36px;
+									justify-content: space-between;
+									background-image: url('static/backgroud/top_bg_sea.png');
+									background-repeat: no-repeat;
+									background-position-x: center;
+									background-position-y: bottom;
+									background-size: cover;
+								}
+							`,
+							"pathList": {
+								"row1": [{
+										"type": 2, // 1: 比赛路线  2: 导航到指定地点
+										"img": "/static/common/dhdqdwz.png",
+										"point": {
+											"longitude": 117.022194,
+											"latitude": 36.661612,
+											"name": "小飞龙定向赛起始点"
+										}
+									},
+									{
+										"type": 1, // 1: 比赛路线  2: 导航到指定地点
+										"img": "/static/common/cjlx12dw.png",
+										"path": {
+											"ocaId": 1,
+											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+										}
+									}
+								],
+								"row2": [{
+										"type": 1, // 1: 比赛路线  2: 导航到指定地点
+										"img": "/static/common/zjlx16dw.png",
+										"path": {
+											"ocaId": 2,
+											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+										}
+									},
+									{
+										"type": 1, // 1: 比赛路线  2: 导航到指定地点
+										"img": "/static/common/gjlx20dw.png",
+										"path": {
+											"ocaId": 3,
+											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+										}
+									}
+								]
+							},
+							"pathListStyle" : {
+								"showLine" : false,
+								"style": "justify-content: space-evenly;"
+							},
+							"popupDataList": [{
+									"type": 1,
+									"data": {
+										"title": "小飞龙定向赛",
+										"img": "/static/logo/xfl.png",
+										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+									}
+								},
+								{
+									type: 2,
+									data: {
+										title: "规则",
+										img: "/static/common/guize.png",
+									}
+								}, {
+									type: 2,
+									data: {
+										title: "奖励",
+										img: "/static/common/jiangli.png",
+									}
+								},
+								"default"
+							]
+						}; */
+
+						this.loadConfig(config);
+						this.matchRsDetailQuery();
+
+						setTimeout(this.dealFirstEnter, 500);
+					},
+					fail: (err) => {
+						console.log("getCardConfigQuery err", err)
+					},
+				});
+			},
+			// 卡片对应线上赛多个活动查询
+			matchRsDetailQuery() {
+				uni.request({
+					url: apiMatchRsDetailQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId
+					},
+					success: (res) => {
+						console.log("matchRsDetailQuery", res);
+						if (checkResCode(res)) {
+							const data = res.data.data;
+							this.mcType = data.mcType;
+							this.mcId = data.mcId;
+							this.mcName = data.mcName;
+							this.beginSecond = data.beginSecond;
+							this.endSecond = data.endSecond;
+							this.nickName = data.nickName;
+							this.totalNum = data.totalNum;
+							this.totalDistanct = data.totalDistanct;
+							this.totalDistanctRankNum = data.totalDistanctRankNum;
+							this.totalCp = data.totalCp;
+							this.totalCpRankNum = data.totalCpRankNum;
+							this.totalSysPoint = data.totalSysPoint;
+							this.totalSysPointRankNum = data.totalSysPointRankNum;
+							this.fastPace = data.fastPace;
+							this.fastPaceRankNum = data.fastPaceRankNum;
+							this.ocaRs = data.ocaRs;
+
+							this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
+
+							const rank = JSON.stringify(data);
+							this.dealNotice(rank);
+
+							this.getCountdown();
+							this.getActtime();
+
+							this.clear();
+							this.interval = setInterval(this.getCountdown, 60000);
+						}
+					},
+					fail: (err) => {
+						console.log("matchRsDetailQuery err", err)
+					},
+				});
+			},
+			btnBack() {
+				// window.history.back();
+				// const url = `action://to_home/`;
+				// window.location.href = url;
+				// tools.appAction(url);
+
+				uni.navigateTo({
+					url: "/pages/bm/style2/rankList?" + this.queryString
+				});
+			},
+			btnInfo() {
+				// console.log(this.$refs.mypopup);
+				this.$refs.mypopup.popupOpen();
+			},
+			onOverviewClick(ovtype) {
+				this.queryObj.ovtype = ovtype;
+				this.queryString = tools.objectToQueryString(this.queryObj);
+				uni.navigateTo({
+					url: "/pages/bm/style2/rankList?" + this.queryString
+				});
+			},
+		}
+	}
+</script>
+
+<style scoped>
+	.content {
+		width: 100vw;
+		height: 100vh;
+		overflow-x: hidden;
+	}
+
+	.top-default {
+		position: relative;
+		z-index: 10;
+		width: 100%;
+		height: 300px;
+		padding-top: 36px;
+		justify-content: space-between;
+		background-image: url("/static/backgroud/top_bg_aoti2.png");
+		background-repeat: no-repeat;
+		background-position-x: center;
+		background-position-y: bottom;
+		/* background-size: 100% 100%; */
+		background-size: cover;
+	}
+
+	.top-oval {
+		position: relative;
+		z-index: 0;
+		margin-top: -180px;
+		margin-left: -10%;
+		width: 120%;
+		height: 280px;
+		background: linear-gradient(180deg, #ffffff 12.18%, #eeeeee 100%);
+		border-radius: 50%;
+		text-align: center;
+	}
+
+	.top-oval-text {
+		color: #333333;
+		font-size: 13px;
+		line-height: 386px;
+		pointer-events: auto;
+	}
+
+	.topbar {
+		width: 90%;
+		justify-content: space-between;
+	}
+
+	.topbar-color-default {
+		color: #5b9100;
+	}
+
+	.topbar-back {
+		width: 43rpx;
+		height: 43rpx;
+		color: inherit !important;
+		font-size: 48rpx !important;
+		/* opacity: 0; */
+	}
+
+	.topbar-info {
+		width: 46rpx;
+		height: 46rpx;
+	}
+
+	.topbar-rule {
+		font-size: 32rpx;
+	}
+
+	.mcName {
+		font-size: 40rpx;
+		font-weight: 550;
+	}
+
+	.topbtm {
+		width: 100%;
+		/* height: 60rpx; */
+		margin-bottom: 40px;
+		justify-content: space-evenly;
+	}
+
+	.topbtm-name {
+		/* width: 320rpx; */
+		/* height: 28px; */
+		padding: 5px 12px;
+		background-color: #9fda39;
+		border-radius: 5px;
+		/* backdrop-filter: blur(30px); */
+		text-align: center;
+		font-weight: 500;
+		color: #497400;
+		font-size: 14px;
+	}
+
+	.mid {
+		position: relative;
+		z-index: 20;
+		margin-top: -130px;
+		pointer-events: none;
+	}
+
+	.mid-1 {
+		width: 92%;
+	}
+
+	.mid-2 {
+		width: 66%;
+	}
+
+	.overview-1 {
+		width: 111px;
+		height: 54px;
+		background: #ffb40b;
+		border-radius: 50%;
+		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
+		pointer-events: auto;
+	}
+
+	.overview-2 {
+		margin-top: -43px;
+		color: #ffffff;
+		font-size: 18px;
+		pointer-events: auto;
+	}
+
+	.overview-3 {
+		width: 111px;
+		height: 54px;
+		background: #f39509;
+		border-radius: 50%;
+		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
+		pointer-events: auto;
+	}
+
+	.overview-4 {
+		width: 111px;
+		height: 54px;
+		background: #81cd00;
+		border-radius: 50%;
+		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
+		pointer-events: auto;
+	}
+
+	.overview-5 {
+		width: 111px;
+		height: 54px;
+		background: #64cbb0;
+		border-radius: 50%;
+		box-shadow: 3px 3px 0px rgba(140, 140, 140, 1);
+		pointer-events: auto;
+	}
+
+	.ovline1 {
+		margin-top: 9px;
+		color: #ffffff;
+		font-size: 12px;
+	}
+
+	.ovline2 {
+		color: #ffffff;
+		font-size: 16px;
+	}
+
+	.main {
+		width: 100%;
+		margin-top: 36px;
+		margin-bottom: 10px;
+		/* height: 70vh; */
+		justify-content: space-around;
+		/* justify-content: space-between; */
+	}
+
+	.main-title {
+		margin-bottom: 10px;
+		font-weight: 550;
+		color: #333333;
+		font-size: 16px;
+	}
 </style>

card/pages/bm/style2/signup.vue

@@ -1,679 +1,668 @@
-<!-- 
-[报名] 样式2 - 报名
-http://localhost:5173/card/#/pages/bm/style2/signup
-https://oss-mbh5.colormaprun.com/card/#/pages/bm/style2/signup
- -->
-<template>
-	<view class="body">
-		<view class="content uni-column">
-			<view class="uni-column" :class="cssTop">
-				<view class="topbar uni-row" :class="cssTopbarColor">
-					<uni-icons type="left" class="topbar-back" @click="btnBack"></uni-icons>
-					<text class="mcName">{{mcName}}</text>
-					<text class="topbar-rule" @click="btnInfo">规则</text>
-				</view>
-			</view>
-			<view class="main uni-column">
-				<view class="timebar uni-row">
-					<image mode="aspectFit" class="clock" src="/static/default/clock.png"></image>
-					<text class="acttime">{{acttime}}</text>
-				</view>
-				
-				<input class="uni-input" maxlength="30" placeholder="请填写姓名" v-model="nickName" />
-
-				<view class="introduce uni-column">
-					<text class="introduce-title">{{introduce.title}}</text>
-					<text class="introduce-content">{{introduce.content}}</text>
-				</view>
-				<button class="btnSignup btnSignup-enable" v-if="mcState<=1" @click="btnSignup">报 名</button>
-				<button class="btnSignup btnSignup-disable" v-if="mcState==2">活动已结束</button>
-			</view>
-
-			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
-
-			<uni-popup ref="alertDialog" type="dialog">
-				<uni-popup-dialog type="info" cancelText="取消" confirmText="确认" title="您填写的姓名:" @confirm="dialogConfirm"
-					@close="dialogClose">
-					<view class="dialog-content uni-column">
-						<text class="dialog-content-1">{{nickName}}</text>
-					</view>
-				</uni-popup-dialog>
-			</uni-popup>
-		</view>
-	</view>
-</template>
-
-<script>
-	import tools from '../../../common/tools';
-	import {
-		defaultPopUpDataList
-	} from '../../../common/define';
-	import {
-		token,
-		apiCardDetailQuery,
-		apiOnlineMcSignUpDetail,
-		apiOnlineMcSignUp,
-		apiCardConfigQuery,
-		apiMatchRsDetailQuery,
-		checkResCode,
-		checkToken
-	} from '../../../common/api';
-
-	export default {
-		data() {
-			return {
-				pageName: "signup",
-				firstEnterKey: 'firstEnter-bm-style2',
-				rankKey: "rank-bm-style2",
-				queryObj: {},
-				queryString: "",
-				from: "", // 来源页面
-				token: "",
-				ecId: 0, // 卡片id
-				mcId: 0, // 赛事id
-				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
-				mcName: "", // 赛事名称
-				acttime: "", // 活动时间
-				beginSecond: null, // 活动或赛事开始时间戳，单位秒
-				endSecond: null, // 活动或赛事结束时间戳，单位秒
-				coiId: 0, // 已报名单位id
-				coiName: "", // 已报名单位名称，可为空
-				teamNum: 0, // 已报名队伍编号，可为0
-				nickName: "", // 昵称
-				// coiRs: [], // 组织信息集合
-				// orgList: [], // 分组下拉列表数据源
-				// teamList: [], // 
-				interval: null,
-
-				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
-				// teamType: 0, // 队伍类型  0: 红黄蓝紫 1: 学生/家长
-				cssTop: "",
-				cssTopbarColor: "",
-				cssLogo: "",
-				introduce: {
-					title: "",
-					content: ""
-				},
-				popupDataList: [],
-			}
-		},
-		computed: {},
-		onLoad(query) { // 类型非必填，可自动推导
-			// console.log(query);
-			this.queryObj = query;
-			this.queryString = tools.objectToQueryString(this.queryObj);
-			// console.log(queryString);
-			this.from = query["from"] ?? "";
-			this.token = query["token"] ?? token;
-			this.ecId = query["id"] ?? 0;
-
-			this.firstEnterKey += "-" + this.ecId;
-			console.log("firstEnterKey:", this.firstEnterKey);
-
-			this.rankKey += "-" + this.ecId;
-			console.log("rankKey:", this.rankKey);
-
-			tools.removeCssCode();
-
-			this.getCardConfigQuery();
-			this.getCardDetailQuery();
-			this.matchRsDetailQuery();
-		},
-		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
-		onReady() {
-			// this.dealFirstEnter();
-		},
-		onUnload() {
-			this.clear();
-		},
-		methods: {
-			dealNotice(rank) {
-				// console.log('[dealNotice]');
-				let that = this;
-				uni.getStorage({
-					key: that.rankKey,
-					success: (res) => {
-						console.log('[getStorage]', that.rankKey, res.data);
-						const oldRank = res.data;
-						if (oldRank != rank) {
-							// that.notice = true;
-							that.setRankValue(rank);
-						}
-					},
-					fail: (e) => {
-						console.log('[getStorage] fail', that.rankKey, e);
-						// that.notice = false;
-						that.setRankValue(rank);
-					},
-				})
-			},
-			setRankValue(data) {
-				let that = this;
-				uni.setStorage({
-					key: that.rankKey,
-					data: data,
-					success: () => {
-						console.log('[setStorage] success', that.rankKey, data);
-					},
-					fail: (e) => {
-						console.log('[setStorage] fail', that.rankKey, e);
-					},
-				})
-			},
-			dealFirstEnter() {
-				// console.log('[dealFirstEnter]');
-				let that = this;
-				uni.getStorage({
-					key: that.firstEnterKey,
-					success: (res) => {
-						console.log('[getStorage]', that.firstEnterKey, res.data);
-					},
-					fail: (e) => {
-						console.log('[getStorage] fail', that.firstEnterKey, e);
-						that.btnInfo();
-						that.setFirstEnterValue(true);
-					},
-				})
-			},
-			setFirstEnterValue(data) {
-				let that = this;
-				uni.setStorage({
-					key: that.firstEnterKey,
-					data: data,
-					success: () => {
-						console.log('[setStorage] success', that.firstEnterKey, data);
-					},
-					fail: (e) => {
-						console.log('[setStorage] fail', that.firstEnterKey, e);
-					},
-				})
-			},
-			clear() {
-				if (this.interval != null) {
-					clearInterval(this.interval);
-					this.interval = null;
-				}
-			},
-			loadConfig(config) {
-				// console.log("config", config);
-
-				// 加载CSS样式
-				const css = config.css;
-				if (css != undefined && css.length > 0) {
-					tools.loadCssCode(css);
-
-					if (css.indexOf(".top{") >= 0) {
-						this.cssTop = "top";
-					}
-					if (css.indexOf(".topbar-color{") >= 0) {
-						this.cssTopbarColor = "topbar-color";
-					}
-				}
-
-				if (this.cssTop == "") {
-					this.cssTop = "top-default";
-				}
-				if (this.cssTopbarColor == "") {
-					this.cssTopbarColor = "topbar-color-default";
-				}
-				console.log("[loadConfig] cssTop:", this.cssTop);
-				console.log("[loadConfig] cssTopbarColor:", this.cssTopbarColor);
-
-				// 加载队伍类型  0: 红黄蓝紫 1: 学生/家长
-				/* if (config.teamType != undefined && config.teamType >= 0) {
-					this.teamType = config.teamType;
-				} */
-
-				// 加载介绍内容
-				const introduce = config.introduce;
-				if (introduce != undefined) {
-					if (introduce.title != undefined) {
-						this.introduce.title = introduce.title;
-					}
-					if (introduce.content != undefined) {
-						this.introduce.content = introduce.content;
-					}
-				}
-
-				// 加载弹窗数据
-				const popupDataList = config.popupDataList;
-				// console.log("[loadConfig] popupDataList:", popupDataList);
-				if (popupDataList != undefined && popupDataList.length > 0) {
-					for (var i = 0; i < popupDataList.length; i++) {
-						// console.log("[loadConfig] popupDataList", i, popupDataList[i]);
-						if (popupDataList[i] == 'default') {
-							for (var j = 0; j < defaultPopUpDataList.length; j++) {
-								this.popupDataList.push(defaultPopUpDataList[j]);
-							}
-						} else {
-							this.popupDataList.push(popupDataList[i]);
-						}
-					}
-				} else {
-					this.popupDataList = defaultPopUpDataList;
-					console.log("[loadConfig] popupDataList 加载默认列表");
-				}
-				// console.log("[loadConfig] popupDataList:", this.popupDataList);
-			},
-			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
-			},
-			// 获取倒计时
-			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
-			},
-			getCardConfigQuery() {
-				uni.request({
-					url: apiCardConfigQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId,
-						pageName: this.pageName
-					},
-					success: (res) => {
-						// console.log("getCardConfigQuery", res)
-						const data = res.data.data;
-						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
-						// console.log("configJson", data.configJson);
-						/* const config = {
-							"css": `
-								.top{
-									width: 100%;
-									height: 230px;
-									padding-top: 36px;
-									justify-content: space-between;
-									background-image: url("static/backgroud/top_bg_aoti.png");
-									background-repeat: no-repeat;
-									background-position: center;
-									background-size: cover;
-								}
-								.topbar-color{
-									color: #5b9100;
-								}
-								.swiper-item-button {
-									background-color: #81cd00 !important;
-								}
-							`,
-							"popupDataList": [{
-									"type": 1,
-									"data": {
-										"title": "小飞龙定向赛",
-										"img": "/static/common/aoti.png",
-										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
-									}
-								},
-								"default"
-							],
-							"introduce": {
-								"title": "介绍：",
-								"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
-							}
-						}; */
-
-						this.loadConfig(config);
-
-						setTimeout(this.dealFirstEnter, 500);
-					},
-					fail: (err) => {
-						console.log("getCardConfigQuery err", err)
-					},
-				});
-			},
-			// 卡片信息查询
-			getCardDetailQuery() {
-				uni.request({
-					url: apiCardDetailQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId
-					},
-					success: (res) => {
-						// console.log("getCardDetailQuery", res);
-						const data = res.data.data;
-						this.mcType = data.mcType;
-						this.mcId = data.mcId;
-						this.mcName = data.mcName;
-						this.beginSecond = data.beginSecond;
-						this.endSecond = data.endSecond;
-						this.coiId = data.coiId;
-						this.coiName = data.coiName;
-						this.teamNum = data.teamNum;
-
-						this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
-
-						this.getActtime();
-						// this.getOnlineMcSignUpDetail();
-
-						this.clear();
-						this.interval = setInterval(this.getActtime, 60000);
-					},
-					fail: (err) => {
-						console.log("getCardDetailQuery err", err)
-					},
-				});
-			},
-			// 卡片对应线上赛多个活动查询
-			matchRsDetailQuery() {
-				uni.request({
-					url: apiMatchRsDetailQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId
-					},
-					success: (res) => {
-						// console.log("matchRsDetailQuery", res);
-						if (res.data.code == 0) {
-							const data = res.data.data;
-							const rank = JSON.stringify(data);
-							this.dealNotice(rank);
-						}
-					},
-					fail: (err) => {
-						console.log("matchRsDetailQuery err", err)
-					},
-				});
-			},
-			// 卡片用户当前排名查询
-			// getUserCurrentRankNumQuery() {
-			// 	uni.request({
-			// 		url: apiUserCurrentRankNumQuery,
-			// 		header: {
-			// 			"Content-Type": "application/x-www-form-urlencoded",
-			// 			"token": this.token,
-			// 		},
-			// 		method: "POST",
-			// 		data: {
-			// 			ecId: this.ecId
-			// 		},
-			// 		success: (res) => {
-			// 			// console.log("getUserCurrentRankNumQuery", res)
-			// 			if (res.data.code == 0) {
-			// 				const data = res.data.data;
-			// 				const rankNum = data.rankNum;
-			// 				this.dealNotice(rankNum);
-			// 			}
-			// 		},
-			// 		fail: (err) => {
-			// 			console.log("getUserCurrentRankNumQuery err", err)
-			// 		},
-			// 	});
-			// },
-			// 线上赛报名页面信息详情
-			/* getOnlineMcSignUpDetail() {
-				uni.request({
-					url: apiOnlineMcSignUpDetail,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						mcId: this.mcId,
-					},
-					success: (res) => {
-						// console.log("getOnlineMcSignUpDetail", res)
-						this.coiRs = res.data.data.coiRs;
-						const rsNum = this.coiRs.length;
-						this.orgList = [];
-						for (let i = 0; i < rsNum; i++) {
-							this.orgList[i] = {};
-							this.orgList[i].value = this.coiRs[i].coiId;
-							this.orgList[i].text = this.coiRs[i].coiName;
-							this.orgList[i].teamNum = this.coiRs[i].teamNum;
-						}
-						// console.log("orgList", this.orgList);
-						if (this.coiId > 0) {
-							this.orgChange(this.coiId, false);
-						}
-					},
-					fail: (err) => {
-						console.log("getOnlineMcSignUpDetail err", err)
-					},
-				});
-			}, */
-			// 线上赛报名
-			onlineMcSignUp() {
-				uni.request({
-					url: apiOnlineMcSignUp,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						mcId: this.mcId,
-						coiId: this.coiId,
-						selectTeam: this.teamNum,
-						nickName: this.nickName
-					},
-					success: (res) => {
-						// console.log("onlineMcSignUp", res);
-
-						if (checkResCode(res)) {
-							uni.showToast({
-								title: '比赛报名成功！',
-								icon: 'none',
-								duration: 3000
-							});
-
-							uni.navigateTo({
-								// url: '/pages/bm/style2/rankOverview?' + this.queryString
-								url: '/pages/bm/style2/rankList?' + this.queryString
-							});
-						}
-					},
-					fail: (err) => {
-						console.log("onlineMcSignUp err", err);
-						uni.showToast({
-							title: '出错了，报名失败',
-							icon: 'none',
-							duration: 3000
-						});
-					},
-				});
-			},
-			btnBack() {
-				// console.log("from:", this.from)
-				if (this.from != '') {
-					// window.history.back();
-					uni.navigateTo({
-						url: '/pages/bm/style2/rankList?' + this.queryString
-					});
-				} else {
-					const url = `action://to_home/`;
-					// window.location.href = url;
-					tools.appAction(url);
-				}
-			},
-			btnInfo() {
-				this.$refs.mypopup.popupOpen();
-			},
-			btnSignup() {
-				if (!checkToken(this.token)) {
-					return;
-				}
-
-				if (!(this.nickName.trim().length > 0)) {
-					uni.showToast({
-						title: '请填写姓名',
-						icon: 'none',
-						duration: 2000
-					});
-					return;
-				}
-
-				this.nickName = this.nickName.trim();
-				this.$refs.alertDialog.open();
-			},
-			dialogConfirm() {
-				this.onlineMcSignUp();
-			},
-			dialogClose() {}
-		}
-	}
-</script>
-
-<style scoped>
-	.content {
-		width: 100vw;
-		height: 100vh;
-	}
-
-	.top-default {
-		width: 100%;
-		height: 230px;
-		padding-top: 36px;
-		justify-content: space-between;
-		background-image: url("/static/backgroud/top_bg_aoti.png");
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: cover;
-	}
-
-	.topbar {
-		width: 90%;
-		justify-content: space-between;
-	}
-
-	.topbar-color-default {
-		color: #5b9100;
-	}
-
-	.topbar-back {
-		width: 43rpx;
-		height: 43rpx;
-		color: inherit !important;
-		font-size: 48rpx !important;
-		/* opacity: 0; */
-	}
-
-	.topbar-rule {
-		font-size: 32rpx;
-	}
-
-	.mcName {
-		font-size: 40rpx;
-		font-weight: 550;
-	}
-
-	.main {
-		width: 76%;
-		min-height: 800rpx;
-		/* margin-top: 20rpx; */
-		justify-content: space-around;
-	}
-
-	.timebar {
-		width: 80%;
-		height: 65rpx;
-		margin-top: 20rpx;
-		padding: 0 50rpx;
-		justify-content: space-evenly;
-		background: #ffffff;
-		border: 0.5px solid;
-		border-color: #e7e7e7;
-		border-radius: 20px;
-		box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
-	}
-
-	.acttime {
-		font-weight: 550;
-		color: #333333;
-		font-size: 30rpx;
-	}
-
-	.clock {
-		width: 30rpx;
-		height: 30rpx;
-		margin-right: 20rpx;
-	}
-	
-	.uni-input {
-		width: 90%;
-		height: 85rpx;
-		padding: 0 30rpx;
-		background: #f1f1f1;
-		border-radius: 9px;
-	}
-	
-	.input-placeholder {
-		color: #333333;
-		font-size: 16px;
-	}
-
-	.introduce {
-		width: 100%;
-		margin-top: 10rpx;
-		margin-bottom: 80rpx;
-		align-items: flex-start;
-		justify-content: space-around;
-	}
-
-	.introduce-title {
-		color: #333333;
-		font-size: 30rpx;
-		line-height: 60rpx;
-	}
-
-	.introduce-content {
-		color: #333333;
-		font-size: 25rpx;
-		line-height: 36rpx;
-	}
-
-	.btnSignup {
-		width: 100%;
-		height: 100rpx;
-		margin-bottom: 30rpx;
-		color: white;
-		font-weight: bold;
-		line-height: 100rpx;
-		border-radius: 55rpx;
-	}
-
-	.btnSignup-enable {
-		background-color: #81cd00;
-	}
-
-	.btnSignup-disable {
-		background-color: #c3c3c3;
-	}
-
-	.dialog-content {
-		width: 279px;
-		height: 110px;
-		background: #f1f1f1;
-		border-radius: 9px;
-		justify-content: center;
-		text-align: center;
-		font-weight: 550;
-		color: #333333;
-	}
-
-	.dialog-content-1 {
-		font-size: 40rpx;
-	}
-
+<!-- 
+[报名] 样式2 - 报名
+http://localhost:5173/card/#/pages/bm/style2/signup
+https://oss-mbh5.colormaprun.com/card/#/pages/bm/style2/signup
+ -->
+<template>
+	<view class="body">
+		<view class="content uni-column">
+			<view class="uni-column" :class="cssTop">
+				<view class="topbar uni-row" :class="cssTopbarColor">
+					<uni-icons type="left" class="topbar-back" @click="btnBack"></uni-icons>
+					<text class="mcName">{{mcName}}</text>
+					<text class="topbar-rule" @click="btnInfo">规则</text>
+				</view>
+			</view>
+			<view class="main uni-column">
+				<view class="timebar uni-row">
+					<image mode="aspectFit" class="clock" src="/static/default/clock.png"></image>
+					<text class="acttime">{{acttime}}</text>
+				</view>
+
+				<input class="uni-input" maxlength="30" placeholder="请填写姓名" v-model="nickName" />
+
+				<view class="introduce uni-column">
+					<text class="introduce-title">{{introduce.title}}</text>
+					<text class="introduce-content">{{introduce.content}}</text>
+				</view>
+				<button class="btnSignup btnSignup-enable" v-if="mcState<=1" @click="btnSignup">报 名</button>
+				<button class="btnSignup btnSignup-disable" v-if="mcState==2">活动已结束</button>
+			</view>
+
+			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
+
+			<uni-popup ref="alertDialog" type="dialog">
+				<uni-popup-dialog type="info" cancelText="取消" confirmText="确认" title="您填写的姓名:" @confirm="dialogConfirm"
+					@close="dialogClose">
+					<view class="dialog-content uni-column">
+						<text class="dialog-content-1">{{nickName}}</text>
+					</view>
+				</uni-popup-dialog>
+			</uni-popup>
+		</view>
+	</view>
+</template>
+
+<script>
+	import tools from '../../../common/tools';
+	import {
+		defaultPopUpDataList
+	} from '../../../common/define';
+	import {
+		token,
+		apiCardDetailQuery,
+		apiOnlineMcSignUpDetail,
+		apiOnlineMcSignUp,
+		apiCardConfigQuery,
+		apiMatchRsDetailQuery,
+		checkResCode,
+		checkToken
+	} from '../../../common/api';
+
+	export default {
+		data() {
+			return {
+				pageName: "signup",
+				firstEnterKey: 'firstEnter-bm-style2',
+				rankKey: "rank-bm-style2",
+				queryObj: {},
+				queryString: "",
+				from: "", // 来源页面
+				token: "",
+				ecId: 0, // 卡片id
+				mcId: 0, // 赛事id
+				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+				mcName: "", // 赛事名称
+				acttime: "", // 活动时间
+				beginSecond: null, // 活动或赛事开始时间戳，单位秒
+				endSecond: null, // 活动或赛事结束时间戳，单位秒
+				coiId: 0, // 已报名单位id
+				coiName: "", // 已报名单位名称，可为空
+				teamNum: 0, // 已报名队伍编号，可为0
+				nickName: "", // 昵称
+				// coiRs: [], // 组织信息集合
+				// orgList: [], // 分组下拉列表数据源
+				// teamList: [], // 
+				interval: null,
+
+				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
+				// teamType: 0, // 队伍类型  0: 红黄蓝紫 1: 学生/家长
+				cssTop: "",
+				cssTopbarColor: "",
+				cssLogo: "",
+				introduce: {
+					title: "",
+					content: ""
+				},
+				popupDataList: [],
+			}
+		},
+		computed: {},
+		onLoad(query) { // 类型非必填，可自动推导
+			// console.log(query);
+			this.queryObj = query;
+			this.queryString = tools.objectToQueryString(this.queryObj);
+			// console.log(queryString);
+			this.from = query["from"] ?? "";
+			this.token = query["token"] ?? token;
+			this.ecId = query["id"] ?? 0;
+
+			this.firstEnterKey += "-" + this.ecId;
+			console.log("firstEnterKey:", this.firstEnterKey);
+
+			this.rankKey += "-" + this.ecId;
+			console.log("rankKey:", this.rankKey);
+
+			tools.removeCssCode();
+
+			this.getCardConfigQuery();
+			this.getCardDetailQuery();
+			this.matchRsDetailQuery();
+		},
+		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
+		onReady() {
+			// this.dealFirstEnter();
+		},
+		onUnload() {
+			this.clear();
+		},
+		methods: {
+			dealNotice(rank) {
+				// console.log('[dealNotice]');
+				let that = this;
+				uni.getStorage({
+					key: that.rankKey,
+					success: (res) => {
+						console.log('[getStorage]', that.rankKey, res.data);
+						const oldRank = res.data;
+						if (oldRank != rank) {
+							// that.notice = true;
+							that.setRankValue(rank);
+						}
+					},
+					fail: (e) => {
+						console.log('[getStorage] fail', that.rankKey, e);
+						// that.notice = false;
+						that.setRankValue(rank);
+					},
+				})
+			},
+			setRankValue(data) {
+				let that = this;
+				uni.setStorage({
+					key: that.rankKey,
+					data: data,
+					success: () => {
+						console.log('[setStorage] success', that.rankKey, data);
+					},
+					fail: (e) => {
+						console.log('[setStorage] fail', that.rankKey, e);
+					},
+				})
+			},
+			dealFirstEnter() {
+				// console.log('[dealFirstEnter]');
+				let that = this;
+				uni.getStorage({
+					key: that.firstEnterKey,
+					success: (res) => {
+						console.log('[getStorage]', that.firstEnterKey, res.data);
+					},
+					fail: (e) => {
+						console.log('[getStorage] fail', that.firstEnterKey, e);
+						that.btnInfo();
+						that.setFirstEnterValue(true);
+					},
+				})
+			},
+			setFirstEnterValue(data) {
+				let that = this;
+				uni.setStorage({
+					key: that.firstEnterKey,
+					data: data,
+					success: () => {
+						console.log('[setStorage] success', that.firstEnterKey, data);
+					},
+					fail: (e) => {
+						console.log('[setStorage] fail', that.firstEnterKey, e);
+					},
+				})
+			},
+			clear() {
+				if (this.interval != null) {
+					clearInterval(this.interval);
+					this.interval = null;
+				}
+			},
+			loadConfig(config) {
+				// console.log("config", config);
+
+				// 加载CSS样式
+				const css = config.css;
+				if (css != undefined && css.length > 0) {
+					tools.loadCssCode(css);
+
+					if (css.indexOf(".top{") >= 0) {
+						this.cssTop = "top";
+					}
+					if (css.indexOf(".topbar-color{") >= 0) {
+						this.cssTopbarColor = "topbar-color";
+					}
+				}
+
+				if (this.cssTop == "") {
+					this.cssTop = "top-default";
+				}
+				if (this.cssTopbarColor == "") {
+					this.cssTopbarColor = "topbar-color-default";
+				}
+				console.log("[loadConfig] cssTop:", this.cssTop);
+				console.log("[loadConfig] cssTopbarColor:", this.cssTopbarColor);
+
+				// 加载队伍类型  0: 红黄蓝紫 1: 学生/家长
+				/* if (config.teamType != undefined && config.teamType >= 0) {
+					this.teamType = config.teamType;
+				} */
+
+				// 加载介绍内容
+				const introduce = config.introduce;
+				if (introduce != undefined) {
+					if (introduce.title != undefined) {
+						this.introduce.title = introduce.title;
+					}
+					if (introduce.content != undefined) {
+						this.introduce.content = introduce.content;
+					}
+				}
+
+				// 加载弹窗数据
+				const popupDataList = config.popupDataList;
+				// console.log("[loadConfig] popupDataList:", popupDataList);
+				if (popupDataList != undefined && popupDataList.length > 0) {
+					for (var i = 0; i < popupDataList.length; i++) {
+						// console.log("[loadConfig] popupDataList", i, popupDataList[i]);
+						if (popupDataList[i] == 'default') {
+							for (var j = 0; j < defaultPopUpDataList.length; j++) {
+								this.popupDataList.push(defaultPopUpDataList[j]);
+							}
+						} else {
+							this.popupDataList.push(popupDataList[i]);
+						}
+					}
+				} else {
+					this.popupDataList = defaultPopUpDataList;
+					console.log("[loadConfig] popupDataList 加载默认列表");
+				}
+				// console.log("[loadConfig] popupDataList:", this.popupDataList);
+			},
+			fmtMcTime(timestamp) {
+				return tools.fmtMcTime(timestamp);
+			},
+			// 获取倒计时
+			getActtime() {
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
+			},
+			getCardConfigQuery() {
+				uni.request({
+					url: apiCardConfigQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId,
+						pageName: this.pageName
+					},
+					success: (res) => {
+						// console.log("getCardConfigQuery", res)
+						const data = res.data.data;
+						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
+						// console.log("configJson", data.configJson);
+						/* const config = {
+							"css": `
+								.top{
+									width: 100%;
+									height: 230px;
+									padding-top: 36px;
+									justify-content: space-between;
+									background-image: url("static/backgroud/top_bg_aoti.png");
+									background-repeat: no-repeat;
+									background-position: center;
+									background-size: cover;
+								}
+								.topbar-color{
+									color: #5b9100;
+								}
+								.swiper-item-button {
+									background-color: #81cd00 !important;
+								}
+							`,
+							"popupDataList": [{
+									"type": 1,
+									"data": {
+										"title": "小飞龙定向赛",
+										"img": "/static/common/aoti.png",
+										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+									}
+								},
+								"default"
+							],
+							"introduce": {
+								"title": "介绍：",
+								"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+							}
+						}; */
+
+						this.loadConfig(config);
+
+						setTimeout(this.dealFirstEnter, 500);
+					},
+					fail: (err) => {
+						console.log("getCardConfigQuery err", err)
+					},
+				});
+			},
+			// 卡片信息查询
+			getCardDetailQuery() {
+				uni.request({
+					url: apiCardDetailQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId
+					},
+					success: (res) => {
+						// console.log("getCardDetailQuery", res);
+						const data = res.data.data;
+						this.mcType = data.mcType;
+						this.mcId = data.mcId;
+						this.mcName = data.mcName;
+						this.beginSecond = data.beginSecond;
+						this.endSecond = data.endSecond;
+						this.coiId = data.coiId;
+						this.coiName = data.coiName;
+						this.teamNum = data.teamNum;
+
+						this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
+
+						this.getActtime();
+						// this.getOnlineMcSignUpDetail();
+
+						this.clear();
+						this.interval = setInterval(this.getActtime, 60000);
+					},
+					fail: (err) => {
+						console.log("getCardDetailQuery err", err)
+					},
+				});
+			},
+			// 卡片对应线上赛多个活动查询
+			matchRsDetailQuery() {
+				uni.request({
+					url: apiMatchRsDetailQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId
+					},
+					success: (res) => {
+						// console.log("matchRsDetailQuery", res);
+						if (res.data.code == 0) {
+							const data = res.data.data;
+							const rank = JSON.stringify(data);
+							this.dealNotice(rank);
+						}
+					},
+					fail: (err) => {
+						console.log("matchRsDetailQuery err", err)
+					},
+				});
+			},
+			// 卡片用户当前排名查询
+			// getUserCurrentRankNumQuery() {
+			// 	uni.request({
+			// 		url: apiUserCurrentRankNumQuery,
+			// 		header: {
+			// 			"Content-Type": "application/x-www-form-urlencoded",
+			// 			"token": this.token,
+			// 		},
+			// 		method: "POST",
+			// 		data: {
+			// 			ecId: this.ecId
+			// 		},
+			// 		success: (res) => {
+			// 			// console.log("getUserCurrentRankNumQuery", res)
+			// 			if (res.data.code == 0) {
+			// 				const data = res.data.data;
+			// 				const rankNum = data.rankNum;
+			// 				this.dealNotice(rankNum);
+			// 			}
+			// 		},
+			// 		fail: (err) => {
+			// 			console.log("getUserCurrentRankNumQuery err", err)
+			// 		},
+			// 	});
+			// },
+			// 线上赛报名页面信息详情
+			/* getOnlineMcSignUpDetail() {
+				uni.request({
+					url: apiOnlineMcSignUpDetail,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						mcId: this.mcId,
+					},
+					success: (res) => {
+						// console.log("getOnlineMcSignUpDetail", res)
+						this.coiRs = res.data.data.coiRs;
+						const rsNum = this.coiRs.length;
+						this.orgList = [];
+						for (let i = 0; i < rsNum; i++) {
+							this.orgList[i] = {};
+							this.orgList[i].value = this.coiRs[i].coiId;
+							this.orgList[i].text = this.coiRs[i].coiName;
+							this.orgList[i].teamNum = this.coiRs[i].teamNum;
+						}
+						// console.log("orgList", this.orgList);
+						if (this.coiId > 0) {
+							this.orgChange(this.coiId, false);
+						}
+					},
+					fail: (err) => {
+						console.log("getOnlineMcSignUpDetail err", err)
+					},
+				});
+			}, */
+			// 线上赛报名
+			onlineMcSignUp() {
+				uni.request({
+					url: apiOnlineMcSignUp,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						mcId: this.mcId,
+						coiId: this.coiId,
+						selectTeam: this.teamNum,
+						nickName: this.nickName
+					},
+					success: (res) => {
+						// console.log("onlineMcSignUp", res);
+
+						if (checkResCode(res)) {
+							uni.showToast({
+								title: '比赛报名成功！',
+								icon: 'none',
+								duration: 3000
+							});
+
+							uni.navigateTo({
+								// url: '/pages/bm/style2/rankOverview?' + this.queryString
+								url: '/pages/bm/style2/rankList?' + this.queryString
+							});
+						}
+					},
+					fail: (err) => {
+						console.log("onlineMcSignUp err", err);
+						uni.showToast({
+							title: '出错了，报名失败',
+							icon: 'none',
+							duration: 3000
+						});
+					},
+				});
+			},
+			btnBack() {
+				// console.log("from:", this.from)
+				if (this.from != '') {
+					// window.history.back();
+					uni.navigateTo({
+						url: '/pages/bm/style2/rankList?' + this.queryString
+					});
+				} else {
+					const url = `action://to_home/`;
+					// window.location.href = url;
+					tools.appAction(url);
+				}
+			},
+			btnInfo() {
+				this.$refs.mypopup.popupOpen();
+			},
+			btnSignup() {
+				if (!checkToken(this.token)) {
+					return;
+				}
+
+				if (!(this.nickName.trim().length > 0)) {
+					uni.showToast({
+						title: '请填写姓名',
+						icon: 'none',
+						duration: 2000
+					});
+					return;
+				}
+
+				this.nickName = this.nickName.trim();
+				this.$refs.alertDialog.open();
+			},
+			dialogConfirm() {
+				this.onlineMcSignUp();
+			},
+			dialogClose() {}
+		}
+	}
+</script>
+
+<style scoped>
+	.content {
+		width: 100vw;
+		height: 100vh;
+	}
+
+	.top-default {
+		width: 100%;
+		height: 230px;
+		padding-top: 36px;
+		justify-content: space-between;
+		background-image: url("/static/backgroud/top_bg_aoti.png");
+		background-repeat: no-repeat;
+		background-position: center;
+		background-size: cover;
+	}
+
+	.topbar {
+		width: 90%;
+		justify-content: space-between;
+	}
+
+	.topbar-color-default {
+		color: #5b9100;
+	}
+
+	.topbar-back {
+		width: 43rpx;
+		height: 43rpx;
+		color: inherit !important;
+		font-size: 48rpx !important;
+		/* opacity: 0; */
+	}
+
+	.topbar-rule {
+		font-size: 32rpx;
+	}
+
+	.mcName {
+		font-size: 40rpx;
+		font-weight: 550;
+	}
+
+	.main {
+		width: 76%;
+		min-height: 800rpx;
+		/* margin-top: 20rpx; */
+		justify-content: space-around;
+	}
+
+	.timebar {
+		width: 80%;
+		height: 65rpx;
+		margin-top: 20rpx;
+		padding: 0 50rpx;
+		justify-content: space-evenly;
+		background: #ffffff;
+		border: 0.5px solid;
+		border-color: #e7e7e7;
+		border-radius: 20px;
+		box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
+	}
+
+	.acttime {
+		font-weight: 550;
+		color: #333333;
+		font-size: 30rpx;
+	}
+
+	.clock {
+		width: 30rpx;
+		height: 30rpx;
+		margin-right: 20rpx;
+	}
+
+	.uni-input {
+		width: 90%;
+		height: 85rpx;
+		padding: 0 30rpx;
+		background: #f1f1f1;
+		border-radius: 9px;
+	}
+
+	.input-placeholder {
+		color: #333333;
+		font-size: 16px;
+	}
+
+	.introduce {
+		width: 100%;
+		margin-top: 10rpx;
+		margin-bottom: 80rpx;
+		align-items: flex-start;
+		justify-content: space-around;
+	}
+
+	.introduce-title {
+		color: #333333;
+		font-size: 30rpx;
+		line-height: 60rpx;
+	}
+
+	.introduce-content {
+		color: #333333;
+		font-size: 25rpx;
+		line-height: 36rpx;
+	}
+
+	.btnSignup {
+		width: 100%;
+		height: 100rpx;
+		margin-bottom: 30rpx;
+		color: white;
+		font-weight: bold;
+		line-height: 100rpx;
+		border-radius: 55rpx;
+	}
+
+	.btnSignup-enable {
+		background-color: #81cd00;
+	}
+
+	.btnSignup-disable {
+		background-color: #c3c3c3;
+	}
+
+	.dialog-content {
+		width: 279px;
+		height: 110px;
+		background: #f1f1f1;
+		border-radius: 9px;
+		justify-content: center;
+		text-align: center;
+		font-weight: 550;
+		color: #333333;
+	}
+
+	.dialog-content-1 {
+		font-size: 40rpx;
+	}
 </style>

card/pages/bm/style3/cardconfig.md

@@ -218,6 +218,10 @@
 		.btnBack{
 			background-color: #ff870d !important;
 		}
+		.main-bar{
+			background-color: #FFEDDB !important;
+			color: #ff870d !important;
+		}
 		.swiper-item-button {
 			background-color: #ff870e !important;
 		}

card/pages/bm/style3/rankList.vue

@@ -22,6 +22,12 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 				</view>
 			</view>
 			<view class="main uni-column">
+				<view class="main-bar uni-row uni-jcse">
+					<text>总距离：{{fmtDistanct(totalDistanct)}}km</text>
+					<text>总打点数：{{totalCp}}个</text>
+					<text>总百味豆数：{{totalSysPoint}}个</text>
+				</view>
+				
 				<uni-segmented-control class="main-tab" :current="tabCurrent" :values="tabItems"
 					@clickItem="onClickTabItem" styleType="button" :activeColor="tabActiveColor"></uni-segmented-control>
 				<view class="tab-view uni-column">
@@ -82,15 +88,15 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 				endSecond: null, // 活动或赛事结束时间戳，单位秒
 				ocaId: 0,	// 关联id，带入到App活动详情页面
 				nickName: "", // 昵称
-				// totalNum: null, // 总场次
-				// totalDistanct: null, // 总距离,单位米
-				// totalDistanctRankNum: null, // 总距离排名
-				// totalCp: null, // 总打点数
-				// totalCpRankNum: null, // 总打点数排名
-				// totalSysPoint: null, // 总百味豆
-				// totalSysPointRankNum: null, // 总百味豆排名
-				// fastPace: null, // 个人最快配速
-				// fastPaceRankNum: null, // 个人最快配速排名
+				totalNum: null, // 总场次
+				totalDistanct: null, // 总距离,单位米
+				totalDistanctRankNum: null, // 总距离排名
+				totalCp: null, // 总打点数
+				totalCpRankNum: null, // 总打点数排名
+				totalSysPoint: null, // 总百味豆
+				totalSysPointRankNum: null, // 总百味豆排名
+				fastPace: null, // 个人最快配速
+				fastPaceRankNum: null, // 个人最快配速排名
 				// ocaRs: [], // 卡片对应活动集合
 
 				mcState: 0 ,	// 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
@@ -301,22 +307,20 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 					this.countdown = "距结束 --天--小时";
 				}
 			},
+			// 格式化 距离
+			fmtDistanct(val) {
+				return Math.round(val * 100 / 1000) / 100;
+				/* if (val < 10000)
+					return Math.round(val * 10 / 1000) / 10;
+				else
+					return Math.round(val / 1000); */
+			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取活动时间
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
 			},
 			getTeamName(teamType, teamIndex) {
 				return teamName[teamType][teamIndex];
@@ -365,6 +369,10 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 							.btnBack{
 								background-color: #ff870d !important;
 							}
+							.main-bar{
+								background-color: #FFEDDB !important;
+								color: #ff870d !important;
+							}
 							.swiper-item-button {
 								background-color: #ff870e !important;
 							}
@@ -458,7 +466,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 						ecId: this.ecId
 					},
 					success: (res) => {
-						// console.log("matchRsDetailQuery", res);
+						console.log("matchRsDetailQuery", res);
 						if (checkResCode(res)) {
 							const data = res.data.data;
 							this.mcType = data.mcType;
@@ -467,15 +475,15 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 							this.beginSecond = data.beginSecond;
 							this.endSecond = data.endSecond;
 							this.nickName = data.nickName;
-							// this.totalNum = data.totalNum;
-							// this.totalDistanct = data.totalDistanct;
-							// this.totalDistanctRankNum = data.totalDistanctRankNum;
-							// this.totalCp = data.totalCp;
-							// this.totalCpRankNum = data.totalCpRankNum;
-							// this.totalSysPoint = data.totalSysPoint;
-							// this.totalSysPointRankNum = data.totalSysPointRankNum;
-							// this.fastPace = data.fastPace;
-							// this.fastPaceRankNum = data.fastPaceRankNum;
+							this.totalNum = data.totalNum;
+							this.totalDistanct = data.totalDistanct;
+							this.totalDistanctRankNum = data.totalDistanctRankNum;
+							this.totalCp = data.totalCp;
+							this.totalCpRankNum = data.totalCpRankNum;
+							this.totalSysPoint = data.totalSysPoint;
+							this.totalSysPointRankNum = data.totalSysPointRankNum;
+							this.fastPace = data.fastPace;
+							this.fastPaceRankNum = data.fastPaceRankNum;
 							// this.ocaRs = data.ocaRs;
 				
 							this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
@@ -631,13 +639,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 		color: #5b9100;
 	}
 	
-	.topbar-back {
-		width: 43rpx;
-		height: 43rpx;
-		color: inherit !important;
-		font-size: 48rpx !important;
-		/* opacity: 0; */
-	}
+	.topbar-back {
		width: 43rpx;
		height: 43rpx;
		color: inherit !important;
		font-size: 48rpx !important;
		/* opacity: 0; */
	}
 	
 	.topbar-info {
 		width: 46rpx;
@@ -697,6 +699,16 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankList
 		justify-content: space-around;
 		/* justify-content: space-between; */
 	}
+	
+	.main-bar {
+		width: 100%;
+		height: 21px;
+		background-color: #d8e8c6;
+		
+		font-size: 10px;
+		font-weight: 500;
+		color: #3d6706;
+	}
 
 	.main-tab {
 		width: 90%;

card/pages/bm/style3/rankOverview.vue

@@ -320,21 +320,11 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/rankOverview
 				return tools.convertSecondsToHMS(val, 2);
 			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取活动时间
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
 			},
 			getCardConfigQuery() {
 				uni.request({

card/pages/bm/style3/signup.vue

@@ -1,685 +1,674 @@
-<!-- 
-[报名] 样式3 - 报名
-http://localhost:5173/card/#/pages/bm/style3/signup
-https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/signup
- -->
-<template>
-	<view class="body">
-		<view class="content uni-column">
-			<view class="uni-column" :class="cssTop">
-				<view class="topbar uni-row" :class="cssTopbarColor">
-					<uni-icons type="left" class="topbar-back" @click="btnBack"></uni-icons>
-					<text class="mcName">{{mcName}}</text>
-					<text class="topbar-rule" @click="btnInfo">规则</text>
-				</view>
-			</view>
-			<view class="main uni-column">
-				<view class="timebar uni-row">
-					<image mode="aspectFit" class="clock" src="/static/default/clock.png"></image>
-					<text class="acttime">{{acttime}}</text>
-				</view>
-				
-				<input class="uni-input" maxlength="30" placeholder="请填写姓名" v-model="nickName" />
-
-				<view class="introduce uni-column">
-					<text class="introduce-title">{{introduce.title}}</text>
-					<text class="introduce-content">{{introduce.content}}</text>
-				</view>
-				<button class="btnSignup btnSignup-enable" v-if="mcState<=1" @click="btnSignup">报 名</button>
-				<button class="btnSignup btnSignup-disable" v-if="mcState==2">活动已结束</button>
-			</view>
-
-			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
-
-			<uni-popup ref="alertDialog" type="dialog">
-				<uni-popup-dialog type="info" cancelText="取消" confirmText="确认" title="您填写的姓名:" @confirm="dialogConfirm"
-					@close="dialogClose">
-					<view class="dialog-content uni-column">
-						<text class="dialog-content-1">{{nickName}}</text>
-					</view>
-				</uni-popup-dialog>
-			</uni-popup>
-		</view>
-	</view>
-</template>
-
-<script>
-	import tools from '../../../common/tools';
-	import {
-		defaultPopUpDataList
-	} from '../../../common/define';
-	import {
-		token,
-		apiCardDetailQuery,
-		apiOnlineMcSignUpDetail,
-		apiOnlineMcSignUp,
-		apiCardConfigQuery,
-		apiMatchRsDetailQuery,
-		checkResCode,
-		checkToken
-	} from '../../../common/api';
-
-	export default {
-		data() {
-			return {
-				pageName: "signup",
-				firstEnterKey: 'firstEnter-bm-style3',
-				rankKey: "rank-bm-style3",
-				queryObj: {},
-				queryString: "",
-				from: "", // 来源页面
-				token: "",
-				ecId: 0, // 卡片id
-				mcId: 0, // 赛事id
-				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
-				mcName: "", // 赛事名称
-				acttime: "", // 活动时间
-				beginSecond: null, // 活动或赛事开始时间戳，单位秒
-				endSecond: null, // 活动或赛事结束时间戳，单位秒
-				coiId: 0, // 已报名单位id
-				coiName: "", // 已报名单位名称，可为空
-				teamNum: 0, // 已报名队伍编号，可为0
-				nickName: "", // 昵称
-				// coiRs: [], // 组织信息集合
-				// orgList: [], // 分组下拉列表数据源
-				// teamList: [], // 
-				interval: null,
-
-				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
-				// teamType: 0, // 队伍类型  0: 红黄蓝紫 1: 学生/家长
-				cssTop: "",
-				cssTopbarColor: "",
-				cssLogo: "",
-				introduce: {
-					title: "",
-					content: ""
-				},
-				popupDataList: [],
-			}
-		},
-		computed: {},
-		onLoad(query) { // 类型非必填，可自动推导
-			// console.log(query);
-			this.queryObj = query;
-			this.queryString = tools.objectToQueryString(this.queryObj);
-			// console.log(queryString);
-			this.from = query["from"] ?? "";
-			this.token = query["token"] ?? token;
-			this.ecId = query["id"] ?? 0;
-
-			this.firstEnterKey += "-" + this.ecId;
-			console.log("firstEnterKey:", this.firstEnterKey);
-
-			this.rankKey += "-" + this.ecId;
-			console.log("rankKey:", this.rankKey);
-
-			tools.removeCssCode();
-
-			this.getCardConfigQuery();
-			this.getCardDetailQuery();
-			this.matchRsDetailQuery();
-		},
-		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
-		onReady() {
-			// this.dealFirstEnter();
-		},
-		onUnload() {
-			this.clear();
-		},
-		methods: {
-			dealNotice(rank) {
-				// console.log('[dealNotice]');
-				let that = this;
-				uni.getStorage({
-					key: that.rankKey,
-					success: (res) => {
-						console.log('[getStorage]', that.rankKey, res.data);
-						const oldRank = res.data;
-						if (oldRank != rank) {
-							// that.notice = true;
-							that.setRankValue(rank);
-						}
-					},
-					fail: (e) => {
-						console.log('[getStorage] fail', that.rankKey, e);
-						// that.notice = false;
-						that.setRankValue(rank);
-					},
-				})
-			},
-			setRankValue(data) {
-				let that = this;
-				uni.setStorage({
-					key: that.rankKey,
-					data: data,
-					success: () => {
-						console.log('[setStorage] success', that.rankKey, data);
-					},
-					fail: (e) => {
-						console.log('[setStorage] fail', that.rankKey, e);
-					},
-				})
-			},
-			dealFirstEnter() {
-				// console.log('[dealFirstEnter]');
-				let that = this;
-				uni.getStorage({
-					key: that.firstEnterKey,
-					success: (res) => {
-						console.log('[getStorage]', that.firstEnterKey, res.data);
-					},
-					fail: (e) => {
-						console.log('[getStorage] fail', that.firstEnterKey, e);
-						that.btnInfo();
-						that.setFirstEnterValue(true);
-					},
-				})
-			},
-			setFirstEnterValue(data) {
-				let that = this;
-				uni.setStorage({
-					key: that.firstEnterKey,
-					data: data,
-					success: () => {
-						console.log('[setStorage] success', that.firstEnterKey, data);
-					},
-					fail: (e) => {
-						console.log('[setStorage] fail', that.firstEnterKey, e);
-					},
-				})
-			},
-			clear() {
-				if (this.interval != null) {
-					clearInterval(this.interval);
-					this.interval = null;
-				}
-			},
-			loadConfig(config) {
-				// console.log("config", config);
-
-				// 加载CSS样式
-				const css = config.css;
-				if (css != undefined && css.length > 0) {
-					tools.loadCssCode(css);
-
-					if (css.indexOf(".top{") >= 0) {
-						this.cssTop = "top";
-					}
-					if (css.indexOf(".topbar-color{") >= 0) {
-						this.cssTopbarColor = "topbar-color";
-					}
-				}
-
-				if (this.cssTop == "") {
-					this.cssTop = "top-default";
-				}
-				if (this.cssTopbarColor == "") {
-					this.cssTopbarColor = "topbar-color-default";
-				}
-				console.log("[loadConfig] cssTop:", this.cssTop);
-				console.log("[loadConfig] cssTopbarColor:", this.cssTopbarColor);
-
-				// 加载队伍类型  0: 红黄蓝紫 1: 学生/家长
-				/* if (config.teamType != undefined && config.teamType >= 0) {
-					this.teamType = config.teamType;
-				} */
-
-				// 加载介绍内容
-				const introduce = config.introduce;
-				if (introduce != undefined) {
-					if (introduce.title != undefined) {
-						this.introduce.title = introduce.title;
-					}
-					if (introduce.content != undefined) {
-						this.introduce.content = introduce.content;
-					}
-				}
-
-				// 加载弹窗数据
-				const popupDataList = config.popupDataList;
-				// console.log("[loadConfig] popupDataList:", popupDataList);
-				if (popupDataList != undefined && popupDataList.length > 0) {
-					for (var i = 0; i < popupDataList.length; i++) {
-						// console.log("[loadConfig] popupDataList", i, popupDataList[i]);
-						if (popupDataList[i] == 'default') {
-							for (var j = 0; j < defaultPopUpDataList.length; j++) {
-								this.popupDataList.push(defaultPopUpDataList[j]);
-							}
-						} else {
-							this.popupDataList.push(popupDataList[i]);
-						}
-					}
-				} else {
-					this.popupDataList = defaultPopUpDataList;
-					console.log("[loadConfig] popupDataList 加载默认列表");
-				}
-				// console.log("[loadConfig] popupDataList:", this.popupDataList);
-			},
-			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
-			},
-			// 获取倒计时
-			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
-			},
-			getCardConfigQuery() {
-				uni.request({
-					url: apiCardConfigQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId,
-						pageName: this.pageName
-					},
-					success: (res) => {
-						// console.log("getCardConfigQuery", res)
-						const data = res.data.data;
-						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
-						// console.log("configJson", data.configJson);
-						/* const config = {
-							"css": `
-								.top{
-									width: 100%;
-									height: 170px;
-									padding-top: 36px;
-									justify-content: space-between;
-									background-image: url('static/backgroud/top_bg_egg3.png');
-									background-repeat: no-repeat;
-									background-position: center;
-									background-size: cover;
-								}
-								.topbar-color{
-									color: #333333;
-								}
-								.btnSignup-enable {
-									background-color: #ff870e !important;
-								}
-								.swiper-item-button {
-									background-color: #ff870e !important;
-								}
-							`,
-							"popupDataList": [{
-									"type": 1,
-									"data": {
-										"title": "小飞龙定向赛",
-										"img": "/static/common/egg.png",
-										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
-									}
-								},
-								"default"
-							],
-							"introduce": {
-								"title": "介绍：",
-								"content": " · 小飞龙定向赛再次来袭！这次有五个场地哟~\r\n · 神秘“蛋叔”闪亮登场~\r\n · 蛋叔放大招，百味豆换鸡蛋！\r\n · 时不可待！冲鸭！\r\n\r\n · 能不能把蛋叔整郁闷，就看你的啦~\r\n · 还等啥？火速报名吧！"
-							}
-						}; */
-
-						this.loadConfig(config);
-
-						setTimeout(this.dealFirstEnter, 500);
-					},
-					fail: (err) => {
-						console.log("getCardConfigQuery err", err)
-					},
-				});
-			},
-			// 卡片信息查询
-			getCardDetailQuery() {
-				uni.request({
-					url: apiCardDetailQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId
-					},
-					success: (res) => {
-						// console.log("getCardDetailQuery", res);
-						const data = res.data.data;
-						this.mcType = data.mcType;
-						this.mcId = data.mcId;
-						this.mcName = data.mcName;
-						this.beginSecond = data.beginSecond;
-						this.endSecond = data.endSecond;
-						this.coiId = data.coiId;
-						this.coiName = data.coiName;
-						this.teamNum = data.teamNum;
-
-						this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
-
-						this.getActtime();
-						// this.getOnlineMcSignUpDetail();
-
-						this.clear();
-						this.interval = setInterval(this.getActtime, 60000);
-					},
-					fail: (err) => {
-						console.log("getCardDetailQuery err", err)
-					},
-				});
-			},
-			// 卡片对应线上赛多个活动查询
-			matchRsDetailQuery() {
-				uni.request({
-					url: apiMatchRsDetailQuery,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						ecId: this.ecId
-					},
-					success: (res) => {
-						// console.log("matchRsDetailQuery", res);
-						if (res.data.code == 0) {
-							const data = res.data.data;
-							const rank = JSON.stringify(data);
-							this.dealNotice(rank);
-						}
-					},
-					fail: (err) => {
-						console.log("matchRsDetailQuery err", err)
-					},
-				});
-			},
-			// 卡片用户当前排名查询
-			// getUserCurrentRankNumQuery() {
-			// 	uni.request({
-			// 		url: apiUserCurrentRankNumQuery,
-			// 		header: {
-			// 			"Content-Type": "application/x-www-form-urlencoded",
-			// 			"token": this.token,
-			// 		},
-			// 		method: "POST",
-			// 		data: {
-			// 			ecId: this.ecId
-			// 		},
-			// 		success: (res) => {
-			// 			// console.log("getUserCurrentRankNumQuery", res)
-			// 			if (res.data.code == 0) {
-			// 				const data = res.data.data;
-			// 				const rankNum = data.rankNum;
-			// 				this.dealNotice(rankNum);
-			// 			}
-			// 		},
-			// 		fail: (err) => {
-			// 			console.log("getUserCurrentRankNumQuery err", err)
-			// 		},
-			// 	});
-			// },
-			// 线上赛报名页面信息详情
-			/* getOnlineMcSignUpDetail() {
-				uni.request({
-					url: apiOnlineMcSignUpDetail,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						mcId: this.mcId,
-					},
-					success: (res) => {
-						// console.log("getOnlineMcSignUpDetail", res)
-						this.coiRs = res.data.data.coiRs;
-						const rsNum = this.coiRs.length;
-						this.orgList = [];
-						for (let i = 0; i < rsNum; i++) {
-							this.orgList[i] = {};
-							this.orgList[i].value = this.coiRs[i].coiId;
-							this.orgList[i].text = this.coiRs[i].coiName;
-							this.orgList[i].teamNum = this.coiRs[i].teamNum;
-						}
-						// console.log("orgList", this.orgList);
-						if (this.coiId > 0) {
-							this.orgChange(this.coiId, false);
-						}
-					},
-					fail: (err) => {
-						console.log("getOnlineMcSignUpDetail err", err)
-					},
-				});
-			}, */
-			// 线上赛报名
-			onlineMcSignUp() {
-				uni.request({
-					url: apiOnlineMcSignUp,
-					header: {
-						"Content-Type": "application/x-www-form-urlencoded",
-						"token": this.token,
-					},
-					method: "POST",
-					data: {
-						mcId: this.mcId,
-						coiId: this.coiId,
-						selectTeam: this.teamNum,
-						nickName: this.nickName
-					},
-					success: (res) => {
-						// console.log("onlineMcSignUp", res);
-
-						if (checkResCode(res)) {
-							uni.showToast({
-								title: '比赛报名成功！',
-								icon: 'none',
-								duration: 3000
-							});
-
-							uni.navigateTo({
-								// url: '/pages/bm/style3/rankOverview?' + this.queryString
-								url: '/pages/bm/style3/rankList?' + this.queryString
-							});
-						}
-					},
-					fail: (err) => {
-						console.log("onlineMcSignUp err", err);
-						uni.showToast({
-							title: '出错了，报名失败',
-							icon: 'none',
-							duration: 3000
-						});
-					},
-				});
-			},
-			btnBack() {
-				// console.log("from:", this.from)
-				if (this.from != '') {
-					// window.history.back();
-					uni.navigateTo({
-						url: '/pages/bm/style3/rankList?' + this.queryString
-					});
-				} else {
-					const url = `action://to_home/`;
-					// window.location.href = url;
-					tools.appAction(url);
-				}
-			},
-			btnInfo() {
-				this.$refs.mypopup.popupOpen();
-			},
-			btnSignup() {
-				if (!checkToken(this.token)) {
-					return;
-				}
-
-				if (!(this.nickName.trim().length > 0)) {
-					uni.showToast({
-						title: '请填写姓名',
-						icon: 'none',
-						duration: 2000
-					});
-					return;
-				}
-
-				this.nickName = this.nickName.trim();
-				this.$refs.alertDialog.open();
-			},
-			dialogConfirm() {
-				this.onlineMcSignUp();
-			},
-			dialogClose() {}
-		}
-	}
-</script>
-
-<style scoped>
-	.content {
-		width: 100vw;
-		height: 100vh;
-	}
-
-	.top-default {
-		width: 100%;
-		height: 170px;
-		padding-top: 36px;
-		justify-content: space-between;
-		background-image: url("/static/backgroud/top_bg_egg3.png");
-		background-repeat: no-repeat;
-		background-position: center;
-		background-size: cover;
-	}
-
-	.topbar {
-		width: 90%;
-		justify-content: space-between;
-	}
-
-	.topbar-color-default {
-		color: #333333;
-	}
-
-	.topbar-back {
-		width: 43rpx;
-		height: 43rpx;
-		color: inherit !important;
-		font-size: 48rpx !important;
-		/* opacity: 0; */
-	}
-
-	.topbar-rule {
-		font-size: 32rpx;
-	}
-
-	.mcName {
-		font-size: 40rpx;
-		font-weight: 550;
-	}
-
-	.main {
-		width: 76%;
-		min-height: 800rpx;
-		/* margin-top: 20rpx; */
-		justify-content: space-around;
-	}
-
-	.timebar {
-		width: 80%;
-		height: 65rpx;
-		margin-top: 20rpx;
-		padding: 0 50rpx;
-		justify-content: space-evenly;
-		background: #ffffff;
-		border: 0.5px solid;
-		border-color: #e7e7e7;
-		border-radius: 20px;
-		box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
-	}
-
-	.acttime {
-		font-weight: 550;
-		color: #333333;
-		font-size: 30rpx;
-	}
-
-	.clock {
-		width: 30rpx;
-		height: 30rpx;
-		margin-right: 20rpx;
-	}
-	
-	.uni-input {
-		width: 90%;
-		height: 85rpx;
-		/* margin-top: 30rpx; */
-		padding: 0 30rpx;
-		background: #f1f1f1;
-		border-radius: 9px;
-	}
-	
-	.input-placeholder {
-		color: #333333;
-		font-size: 16px;
-	}
-
-	.introduce {
-		width: 100%;
-		margin-top: 10rpx;
-		margin-bottom: 30rpx;
-		align-items: flex-start;
-		justify-content: space-around;
-	}
-
-	.introduce-title {
-		color: #333333;
-		font-size: 30rpx;
-		line-height: 60rpx;
-		font-family: Source Han Sans CN;
-	}
-
-	.introduce-content {
-		color: #333333;
-		font-size: 25rpx;
-		line-height: 36rpx;
-		font-family: Source Han Sans CN;
-	}
-
-	.btnSignup {
-		width: 100%;
-		height: 100rpx;
-		margin-bottom: 30rpx;
-		color: white;
-		font-weight: bold;
-		line-height: 100rpx;
-		border-radius: 55rpx;
-	}
-
-	.btnSignup-enable {
-		background-color: #81cd00;
-	}
-
-	.btnSignup-disable {
-		background-color: #c3c3c3;
-	}
-
-	.dialog-content {
-		width: 279px;
-		height: 110px;
-		background: #f1f1f1;
-		border-radius: 9px;
-		justify-content: center;
-		text-align: center;
-		font-weight: 550;
-		color: #333333;
-	}
-
-	.dialog-content-1 {
-		font-size: 40rpx;
-	}
-
+<!-- 
+[报名] 样式3 - 报名
+http://localhost:5173/card/#/pages/bm/style3/signup
+https://oss-mbh5.colormaprun.com/card/#/pages/bm/style3/signup
+ -->
+<template>
+	<view class="body">
+		<view class="content uni-column">
+			<view class="uni-column" :class="cssTop">
+				<view class="topbar uni-row" :class="cssTopbarColor">
+					<uni-icons type="left" class="topbar-back" @click="btnBack"></uni-icons>
+					<text class="mcName">{{mcName}}</text>
+					<text class="topbar-rule" @click="btnInfo">规则</text>
+				</view>
+			</view>
+			<view class="main uni-column">
+				<view class="timebar uni-row">
+					<image mode="aspectFit" class="clock" src="/static/default/clock.png"></image>
+					<text class="acttime">{{acttime}}</text>
+				</view>
+
+				<input class="uni-input" maxlength="30" placeholder="请填写姓名" v-model="nickName" />
+
+				<view class="introduce uni-column">
+					<text class="introduce-title">{{introduce.title}}</text>
+					<text class="introduce-content">{{introduce.content}}</text>
+				</view>
+				<button class="btnSignup btnSignup-enable" v-if="mcState<=1" @click="btnSignup">报 名</button>
+				<button class="btnSignup btnSignup-disable" v-if="mcState==2">活动已结束</button>
+			</view>
+
+			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
+
+			<uni-popup ref="alertDialog" type="dialog">
+				<uni-popup-dialog type="info" cancelText="取消" confirmText="确认" title="您填写的姓名:" @confirm="dialogConfirm"
+					@close="dialogClose">
+					<view class="dialog-content uni-column">
+						<text class="dialog-content-1">{{nickName}}</text>
+					</view>
+				</uni-popup-dialog>
+			</uni-popup>
+		</view>
+	</view>
+</template>
+
+<script>
+	import tools from '../../../common/tools';
+	import {
+		defaultPopUpDataList
+	} from '../../../common/define';
+	import {
+		token,
+		apiCardDetailQuery,
+		apiOnlineMcSignUpDetail,
+		apiOnlineMcSignUp,
+		apiCardConfigQuery,
+		apiMatchRsDetailQuery,
+		checkResCode,
+		checkToken
+	} from '../../../common/api';
+
+	export default {
+		data() {
+			return {
+				pageName: "signup",
+				firstEnterKey: 'firstEnter-bm-style3',
+				rankKey: "rank-bm-style3",
+				queryObj: {},
+				queryString: "",
+				from: "", // 来源页面
+				token: "",
+				ecId: 0, // 卡片id
+				mcId: 0, // 赛事id
+				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+				mcName: "", // 赛事名称
+				acttime: "", // 活动时间
+				beginSecond: null, // 活动或赛事开始时间戳，单位秒
+				endSecond: null, // 活动或赛事结束时间戳，单位秒
+				coiId: 0, // 已报名单位id
+				coiName: "", // 已报名单位名称，可为空
+				teamNum: 0, // 已报名队伍编号，可为0
+				nickName: "", // 昵称
+				// coiRs: [], // 组织信息集合
+				// orgList: [], // 分组下拉列表数据源
+				// teamList: [], // 
+				interval: null,
+
+				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
+				// teamType: 0, // 队伍类型  0: 红黄蓝紫 1: 学生/家长
+				cssTop: "",
+				cssTopbarColor: "",
+				cssLogo: "",
+				introduce: {
+					title: "",
+					content: ""
+				},
+				popupDataList: [],
+			}
+		},
+		computed: {},
+		onLoad(query) { // 类型非必填，可自动推导
+			// console.log(query);
+			this.queryObj = query;
+			this.queryString = tools.objectToQueryString(this.queryObj);
+			// console.log(queryString);
+			this.from = query["from"] ?? "";
+			this.token = query["token"] ?? token;
+			this.ecId = query["id"] ?? 0;
+
+			this.firstEnterKey += "-" + this.ecId;
+			console.log("firstEnterKey:", this.firstEnterKey);
+
+			this.rankKey += "-" + this.ecId;
+			console.log("rankKey:", this.rankKey);
+
+			tools.removeCssCode();
+
+			this.getCardConfigQuery();
+			this.getCardDetailQuery();
+			this.matchRsDetailQuery();
+		},
+		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
+		onReady() {
+			// this.dealFirstEnter();
+		},
+		onUnload() {
+			this.clear();
+		},
+		methods: {
+			dealNotice(rank) {
+				// console.log('[dealNotice]');
+				let that = this;
+				uni.getStorage({
+					key: that.rankKey,
+					success: (res) => {
+						console.log('[getStorage]', that.rankKey, res.data);
+						const oldRank = res.data;
+						if (oldRank != rank) {
+							// that.notice = true;
+							that.setRankValue(rank);
+						}
+					},
+					fail: (e) => {
+						console.log('[getStorage] fail', that.rankKey, e);
+						// that.notice = false;
+						that.setRankValue(rank);
+					},
+				})
+			},
+			setRankValue(data) {
+				let that = this;
+				uni.setStorage({
+					key: that.rankKey,
+					data: data,
+					success: () => {
+						console.log('[setStorage] success', that.rankKey, data);
+					},
+					fail: (e) => {
+						console.log('[setStorage] fail', that.rankKey, e);
+					},
+				})
+			},
+			dealFirstEnter() {
+				// console.log('[dealFirstEnter]');
+				let that = this;
+				uni.getStorage({
+					key: that.firstEnterKey,
+					success: (res) => {
+						console.log('[getStorage]', that.firstEnterKey, res.data);
+					},
+					fail: (e) => {
+						console.log('[getStorage] fail', that.firstEnterKey, e);
+						that.btnInfo();
+						that.setFirstEnterValue(true);
+					},
+				})
+			},
+			setFirstEnterValue(data) {
+				let that = this;
+				uni.setStorage({
+					key: that.firstEnterKey,
+					data: data,
+					success: () => {
+						console.log('[setStorage] success', that.firstEnterKey, data);
+					},
+					fail: (e) => {
+						console.log('[setStorage] fail', that.firstEnterKey, e);
+					},
+				})
+			},
+			clear() {
+				if (this.interval != null) {
+					clearInterval(this.interval);
+					this.interval = null;
+				}
+			},
+			loadConfig(config) {
+				// console.log("config", config);
+
+				// 加载CSS样式
+				const css = config.css;
+				if (css != undefined && css.length > 0) {
+					tools.loadCssCode(css);
+
+					if (css.indexOf(".top{") >= 0) {
+						this.cssTop = "top";
+					}
+					if (css.indexOf(".topbar-color{") >= 0) {
+						this.cssTopbarColor = "topbar-color";
+					}
+				}
+
+				if (this.cssTop == "") {
+					this.cssTop = "top-default";
+				}
+				if (this.cssTopbarColor == "") {
+					this.cssTopbarColor = "topbar-color-default";
+				}
+				console.log("[loadConfig] cssTop:", this.cssTop);
+				console.log("[loadConfig] cssTopbarColor:", this.cssTopbarColor);
+
+				// 加载队伍类型  0: 红黄蓝紫 1: 学生/家长
+				/* if (config.teamType != undefined && config.teamType >= 0) {
+					this.teamType = config.teamType;
+				} */
+
+				// 加载介绍内容
+				const introduce = config.introduce;
+				if (introduce != undefined) {
+					if (introduce.title != undefined) {
+						this.introduce.title = introduce.title;
+					}
+					if (introduce.content != undefined) {
+						this.introduce.content = introduce.content;
+					}
+				}
+
+				// 加载弹窗数据
+				const popupDataList = config.popupDataList;
+				// console.log("[loadConfig] popupDataList:", popupDataList);
+				if (popupDataList != undefined && popupDataList.length > 0) {
+					for (var i = 0; i < popupDataList.length; i++) {
+						// console.log("[loadConfig] popupDataList", i, popupDataList[i]);
+						if (popupDataList[i] == 'default') {
+							for (var j = 0; j < defaultPopUpDataList.length; j++) {
+								this.popupDataList.push(defaultPopUpDataList[j]);
+							}
+						} else {
+							this.popupDataList.push(popupDataList[i]);
+						}
+					}
+				} else {
+					this.popupDataList = defaultPopUpDataList;
+					console.log("[loadConfig] popupDataList 加载默认列表");
+				}
+				// console.log("[loadConfig] popupDataList:", this.popupDataList);
+			},
+			fmtMcTime(timestamp) {
+				return tools.fmtMcTime(timestamp);
+			},
+			// 获取倒计时
+			getActtime() {
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
+			},
+			getCardConfigQuery() {
+				uni.request({
+					url: apiCardConfigQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId,
+						pageName: this.pageName
+					},
+					success: (res) => {
+						// console.log("getCardConfigQuery", res)
+						const data = res.data.data;
+						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
+						// console.log("configJson", data.configJson);
+						/* const config = {
+							"css": `
+								.top{
+									width: 100%;
+									height: 170px;
+									padding-top: 36px;
+									justify-content: space-between;
+									background-image: url('static/backgroud/top_bg_egg3.png');
+									background-repeat: no-repeat;
+									background-position: center;
+									background-size: cover;
+								}
+								.topbar-color{
+									color: #333333;
+								}
+								.btnSignup-enable {
+									background-color: #ff870e !important;
+								}
+								.swiper-item-button {
+									background-color: #ff870e !important;
+								}
+							`,
+							"popupDataList": [{
+									"type": 1,
+									"data": {
+										"title": "小飞龙定向赛",
+										"img": "/static/common/egg.png",
+										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+									}
+								},
+								"default"
+							],
+							"introduce": {
+								"title": "介绍：",
+								"content": " · 小飞龙定向赛再次来袭！这次有五个场地哟~\r\n · 神秘“蛋叔”闪亮登场~\r\n · 蛋叔放大招，百味豆换鸡蛋！\r\n · 时不可待！冲鸭！\r\n\r\n · 能不能把蛋叔整郁闷，就看你的啦~\r\n · 还等啥？火速报名吧！"
+							}
+						}; */
+
+						this.loadConfig(config);
+
+						setTimeout(this.dealFirstEnter, 500);
+					},
+					fail: (err) => {
+						console.log("getCardConfigQuery err", err)
+					},
+				});
+			},
+			// 卡片信息查询
+			getCardDetailQuery() {
+				uni.request({
+					url: apiCardDetailQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId
+					},
+					success: (res) => {
+						// console.log("getCardDetailQuery", res);
+						const data = res.data.data;
+						this.mcType = data.mcType;
+						this.mcId = data.mcId;
+						this.mcName = data.mcName;
+						this.beginSecond = data.beginSecond;
+						this.endSecond = data.endSecond;
+						this.coiId = data.coiId;
+						this.coiName = data.coiName;
+						this.teamNum = data.teamNum;
+
+						this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
+
+						this.getActtime();
+						// this.getOnlineMcSignUpDetail();
+
+						this.clear();
+						this.interval = setInterval(this.getActtime, 60000);
+					},
+					fail: (err) => {
+						console.log("getCardDetailQuery err", err)
+					},
+				});
+			},
+			// 卡片对应线上赛多个活动查询
+			matchRsDetailQuery() {
+				uni.request({
+					url: apiMatchRsDetailQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId
+					},
+					success: (res) => {
+						// console.log("matchRsDetailQuery", res);
+						if (res.data.code == 0) {
+							const data = res.data.data;
+							const rank = JSON.stringify(data);
+							this.dealNotice(rank);
+						}
+					},
+					fail: (err) => {
+						console.log("matchRsDetailQuery err", err)
+					},
+				});
+			},
+			// 卡片用户当前排名查询
+			// getUserCurrentRankNumQuery() {
+			// 	uni.request({
+			// 		url: apiUserCurrentRankNumQuery,
+			// 		header: {
+			// 			"Content-Type": "application/x-www-form-urlencoded",
+			// 			"token": this.token,
+			// 		},
+			// 		method: "POST",
+			// 		data: {
+			// 			ecId: this.ecId
+			// 		},
+			// 		success: (res) => {
+			// 			// console.log("getUserCurrentRankNumQuery", res)
+			// 			if (res.data.code == 0) {
+			// 				const data = res.data.data;
+			// 				const rankNum = data.rankNum;
+			// 				this.dealNotice(rankNum);
+			// 			}
+			// 		},
+			// 		fail: (err) => {
+			// 			console.log("getUserCurrentRankNumQuery err", err)
+			// 		},
+			// 	});
+			// },
+			// 线上赛报名页面信息详情
+			/* getOnlineMcSignUpDetail() {
+				uni.request({
+					url: apiOnlineMcSignUpDetail,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						mcId: this.mcId,
+					},
+					success: (res) => {
+						// console.log("getOnlineMcSignUpDetail", res)
+						this.coiRs = res.data.data.coiRs;
+						const rsNum = this.coiRs.length;
+						this.orgList = [];
+						for (let i = 0; i < rsNum; i++) {
+							this.orgList[i] = {};
+							this.orgList[i].value = this.coiRs[i].coiId;
+							this.orgList[i].text = this.coiRs[i].coiName;
+							this.orgList[i].teamNum = this.coiRs[i].teamNum;
+						}
+						// console.log("orgList", this.orgList);
+						if (this.coiId > 0) {
+							this.orgChange(this.coiId, false);
+						}
+					},
+					fail: (err) => {
+						console.log("getOnlineMcSignUpDetail err", err)
+					},
+				});
+			}, */
+			// 线上赛报名
+			onlineMcSignUp() {
+				uni.request({
+					url: apiOnlineMcSignUp,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						mcId: this.mcId,
+						coiId: this.coiId,
+						selectTeam: this.teamNum,
+						nickName: this.nickName
+					},
+					success: (res) => {
+						// console.log("onlineMcSignUp", res);
+
+						if (checkResCode(res)) {
+							uni.showToast({
+								title: '比赛报名成功！',
+								icon: 'none',
+								duration: 3000
+							});
+
+							uni.navigateTo({
+								// url: '/pages/bm/style3/rankOverview?' + this.queryString
+								url: '/pages/bm/style3/rankList?' + this.queryString
+							});
+						}
+					},
+					fail: (err) => {
+						console.log("onlineMcSignUp err", err);
+						uni.showToast({
+							title: '出错了，报名失败',
+							icon: 'none',
+							duration: 3000
+						});
+					},
+				});
+			},
+			btnBack() {
+				// console.log("from:", this.from)
+				if (this.from != '') {
+					// window.history.back();
+					uni.navigateTo({
+						url: '/pages/bm/style3/rankList?' + this.queryString
+					});
+				} else {
+					const url = `action://to_home/`;
+					// window.location.href = url;
+					tools.appAction(url);
+				}
+			},
+			btnInfo() {
+				this.$refs.mypopup.popupOpen();
+			},
+			btnSignup() {
+				if (!checkToken(this.token)) {
+					return;
+				}
+
+				if (!(this.nickName.trim().length > 0)) {
+					uni.showToast({
+						title: '请填写姓名',
+						icon: 'none',
+						duration: 2000
+					});
+					return;
+				}
+
+				this.nickName = this.nickName.trim();
+				this.$refs.alertDialog.open();
+			},
+			dialogConfirm() {
+				this.onlineMcSignUp();
+			},
+			dialogClose() {}
+		}
+	}
+</script>
+
+<style scoped>
+	.content {
+		width: 100vw;
+		height: 100vh;
+	}
+
+	.top-default {
+		width: 100%;
+		height: 170px;
+		padding-top: 36px;
+		justify-content: space-between;
+		background-image: url("/static/backgroud/top_bg_egg3.png");
+		background-repeat: no-repeat;
+		background-position: center;
+		background-size: cover;
+	}
+
+	.topbar {
+		width: 90%;
+		justify-content: space-between;
+	}
+
+	.topbar-color-default {
+		color: #333333;
+	}
+
+	.topbar-back {
+		width: 43rpx;
+		height: 43rpx;
+		color: inherit !important;
+		font-size: 48rpx !important;
+		/* opacity: 0; */
+	}
+
+	.topbar-rule {
+		font-size: 32rpx;
+	}
+
+	.mcName {
+		font-size: 40rpx;
+		font-weight: 550;
+	}
+
+	.main {
+		width: 76%;
+		min-height: 800rpx;
+		/* margin-top: 20rpx; */
+		justify-content: space-around;
+	}
+
+	.timebar {
+		width: 80%;
+		height: 65rpx;
+		margin-top: 20rpx;
+		padding: 0 50rpx;
+		justify-content: space-evenly;
+		background: #ffffff;
+		border: 0.5px solid;
+		border-color: #e7e7e7;
+		border-radius: 20px;
+		box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
+	}
+
+	.acttime {
+		font-weight: 550;
+		color: #333333;
+		font-size: 30rpx;
+	}
+
+	.clock {
+		width: 30rpx;
+		height: 30rpx;
+		margin-right: 20rpx;
+	}
+
+	.uni-input {
+		width: 90%;
+		height: 85rpx;
+		/* margin-top: 30rpx; */
+		padding: 0 30rpx;
+		background: #f1f1f1;
+		border-radius: 9px;
+	}
+
+	.input-placeholder {
+		color: #333333;
+		font-size: 16px;
+	}
+
+	.introduce {
+		width: 100%;
+		margin-top: 10rpx;
+		margin-bottom: 30rpx;
+		align-items: flex-start;
+		justify-content: space-around;
+	}
+
+	.introduce-title {
+		color: #333333;
+		font-size: 30rpx;
+		line-height: 60rpx;
+		font-family: Source Han Sans CN;
+	}
+
+	.introduce-content {
+		color: #333333;
+		font-size: 25rpx;
+		line-height: 36rpx;
+		font-family: Source Han Sans CN;
+	}
+
+	.btnSignup {
+		width: 100%;
+		height: 100rpx;
+		margin-bottom: 30rpx;
+		color: white;
+		font-weight: bold;
+		line-height: 100rpx;
+		border-radius: 55rpx;
+	}
+
+	.btnSignup-enable {
+		background-color: #81cd00;
+	}
+
+	.btnSignup-disable {
+		background-color: #c3c3c3;
+	}
+
+	.dialog-content {
+		width: 279px;
+		height: 110px;
+		background: #f1f1f1;
+		border-radius: 9px;
+		justify-content: center;
+		text-align: center;
+		font-weight: 550;
+		color: #333333;
+	}
+
+	.dialog-content-1 {
+		font-size: 40rpx;
+	}
 </style>

card/pages/bm/style4/cardconfig.md

@@ -3,7 +3,6 @@
 [山大]
 
 index卡片URL参数：type=团建活动&btnText=进入活动
-signup卡片URL参数：labelName=姓名&labelOrg=院系
 
 "index": {
 	"css": "
@@ -30,30 +29,39 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 	"css": "
 		.top{
 			width: 100%;
-			height: 170px;
+			height: 220px;
 			padding-top: 36px;
 			justify-content: space-between;
-			background-image: url('static/backgroud/top_bg_egg3.png');
+			background-image: url('static/backgroud/top_bg_sddx.png');
 			background-repeat: no-repeat;
 			background-position: center;
 			background-size: cover;
 		}
+		.logo{
+			background-image: url('static/logo/sddx.png');
+		}
+		.top-acttime{
+			display: flex !important;
+		}
 		.topbar-color{
-			color: #333333;
+			color: #ffffff;
 		}
 		.btnSignup-enable {
-			background-color: #ff870e !important;
+			background-color: #a43a07 !important;
 		}
 		.swiper-item-button {
-			background-color: #ff870e !important;
+			background-color: #a43a07 !important;
+		}
+		.uni-swiper-dot-active {
+			background: #a43a07 !important;
 		}
 	",
 	"popupDataList": [{
 			"type": 1,
 			"data": {
-				"title": "小飞龙定向赛",
-				"img": "/static/common/egg.png",
-				"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+				"title": "山大校园定向赛",
+				"img": "/static/logo/sddx.png",
+				"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
 			}
 		},
 		{
@@ -73,29 +81,56 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 	],
 	"introduce": {
 		"title": "介绍：",
-		"content": " · 小飞龙定向赛再次来袭！这次有五个场地哟~\r\n · 神秘“蛋叔”闪亮登场~\r\n · 蛋叔放大招，百味豆换鸡蛋！\r\n · 时不可待！冲鸭！\r\n\r\n · 能不能把蛋叔整郁闷，就看你的啦~\r\n · 还等啥？火速报名吧！"
+		"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
+	},
+	"param": {
+		"labelName": "姓名",
+		"labelOrg": "院系"
 	}
 },
 "rankOverview": {
 	"css": "
 		.top{
 			position: relative;
-			z-index: 10;
 			width: 100%;
-			height: 270px;
+			height: 220px;
 			padding-top: 36px;
 			justify-content: space-between;
-			background-image: url('static/backgroud/top_bg_egg2.png');
+			background-image: url('static/backgroud/top_bg_sddx.png');
 			background-repeat: no-repeat;
 			background-position-x: center;
-			background-position-y: -8px;
-			background-size: 100% 100%;
+			background-position-y: center;
+			background-size: cover;
+		}
+		.logo{
+			background-image: url('static/logo/sddx.png');
+		}
+		.top-acttime{
+			display: flex !important;
+		}
+		.topbar-color{
+			color: #ffffff;
+		}
+		.mid {
+			margin-top: -40px !important;
+		}
+		.btnStartGame{
+			background-color: #a43a07 !important;
+		}
+		.e-select{
+			background-color: #a43a07 !important;
+		}
+		.swiper-item-button{
+			background-color: #a43a07 !important;
+		}
+		.uni-swiper-dot-active{
+			background: #a43a07 !important;
 		}
 	",
 	"pathList": {
 		"row1": [{
 				"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-				"pathImg": "/static/common/lingxiucheng.png",
+				"pathImg": "/static/common/sdzxxq.png",
 				"path": {
 					"ocaId": 1,
 					"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
@@ -104,12 +139,12 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 				"point": {
 					"longitude": 117.022194,
 					"latitude": 36.661612,
-					"name": "领秀城起始点"
+					"name": "山大中心校区起始点"
 				}
 			},
 			{
 				"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-				"pathImg": "/static/common/quanchenggongyuan.png",
+				"pathImg": "/static/common/sdbtqxq.png",
 				"path": {
 					"ocaId": 1,
 					"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
@@ -118,13 +153,13 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 				"point": {
 					"longitude": 117.022194,
 					"latitude": 36.661612,
-					"name": "泉城公园起始点"
+					"name": "山大趵突泉校区起始点"
 				}
 			}
 		],
 		"row2": [{
 				"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-				"pathImg": "/static/common/baihuagongyuan.png",
+				"pathImg": "/static/common/sdhjlxq.png",
 				"path": {
 					"ocaId": 1,
 					"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
@@ -133,12 +168,12 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 				"point": {
 					"longitude": 117.022194,
 					"latitude": 36.661612,
-					"name": "百花公园起始点"
+					"name": "山大洪家楼校区起始点"
 				}
 			},
 			{
 				"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-				"pathImg": "/static/common/aotizhongxin.png",
+				"pathImg": "/static/common/sdrjyxq.png",
 				"path": {
 					"ocaId": 1,
 					"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
@@ -147,24 +182,39 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 				"point": {
 					"longitude": 117.022194,
 					"latitude": 36.661612,
-					"name": "奥体中心起始点"
+					"name": "山大软件园校区起始点"
 				}
 			}
 		],
 		"row3": [{
-			"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-			"pathImg": "/static/common/muniushan.png",
-			"path": {
-				"ocaId": 1,
-				"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+				"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
+				"pathImg": "/static/common/sdxlsxq.png",
+				"path": {
+					"ocaId": 1,
+					"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+				},
+				"navImg": "/static/common/nav.png",
+				"point": {
+					"longitude": 117.022194,
+					"latitude": 36.661612,
+					"name": "山大兴隆山校区起始点"
+				}
 			},
-			"navImg": "/static/common/nav.png",
-			"point": {
-				"longitude": 117.022194,
-				"latitude": 36.661612,
-				"name": "牧牛山起始点"
+			{
+				"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
+				"pathImg": "/static/common/sdqfsxq.png",
+				"path": {
+					"ocaId": 1,
+					"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+				},
+				"navImg": "/static/common/nav.png",
+				"point": {
+					"longitude": 117.022194,
+					"latitude": 36.661612,
+					"name": "山大千佛山校区起始点"
+				}
 			}
-		}]
+		]
 	},
 	"pathListStyle" : {
 		"showLine" : true,
@@ -173,9 +223,9 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 	"popupDataList": [{
 			"type": 1,
 			"data": {
-				"title": "小飞龙定向赛",
-				"img": "/static/common/egg.png",
-				"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+				"title": "山大校园定向赛",
+				"img": "/static/logo/sddx.png",
+				"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
 			}
 		},
 		{
@@ -202,39 +252,41 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 			height: 170px;
 			padding-top: 36px;
 			justify-content: space-between;
-			background-image: url('static/backgroud/top_bg_egg3.png');
+			background-image: url('static/backgroud/top_bg_sddx.png');
 			background-repeat: no-repeat;
-			background-position: center;
+			background-position-x: center;
+			background-position-y: bottom;
 			background-size: cover;
 		}
-		.topbar-color{
-			color: #333333;
+		.logo{
+			background-image: url('static/logo/sddx.png');
 		}
-		.topbtm-name{
-			background-color: #c77f34 !important;
-			color: #ffffff !important;
+		.tcbar{
+			display: flex !important;
 		}
-		.topbtm-egg{
-			background-color: #c6690a !important;
-			color: #ffffff !important;
+		.topbar-color{
+			color: #ffffff;
 		}
 		.btnBack{
-			background-color: #ff870d !important;
+			background-color: #a43a07 !important;
+		}
+		.tab-active{
+			background-color: #a43a07 !important;
 		}
 		.swiper-item-button {
-			background-color: #ff870e !important;
+			background-color: #a43a07 !important;
 		}
 		.uni-swiper-dot-active {
-			background: #ff870e !important;
+			background: #a43a07 !important;
 		}
 	",
 	"tabActiveColor": "#ff870d",
 	"popupDataList": [{
 			"type": 1,
 			"data": {
-				"title": "小飞龙定向赛",
-				"img": "/static/common/egg.png",
-				"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+				"title": "山大校园定向赛",
+				"img": "/static/logo/sddx.png",
+				"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
 			}
 		},
 		{
@@ -265,5 +317,8 @@ signup卡片URL参数：labelName=姓名&labelOrg=院系
 				}
 			}
 		}
-	]
+	],
+	"param": {
+		"labelRightAnswerNum": "校园文化输出"
+	}
 }

card/pages/bm/style4/index.vue

@@ -236,9 +236,9 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/index
 					success: (res) => {
 						console.log("getCardConfigQuery", res);
 						const data = res.data.data;
-						// const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
+						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
 						// console.log("configJson", config);
-						const config = {
+						/* const config = {
 						"css": `
 							.content-bg{
 								background: url('static/cardbg/shanda.png');
@@ -258,7 +258,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/index
 								background-color: #ffffff !important;
 							}
 						`
-						};
+						}; */
 						
 						this.loadConfig(config);
 					},

card/pages/bm/style4/rankList.vue

@@ -18,7 +18,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 					<view class="logo"></view>
 					<view class="tcbar uni-row uni-jcsb">
 						<text class="tcbar-text">赛事总里程：{{fmtDistanct(totalDistance)}} 千米</text>
-						<text class="tcbar-text">校园文化输出：{{totalRightAnswerNum}} 次</text>
+						<text class="tcbar-text">{{configParam.labelRightAnswerNum}}：{{totalRightAnswerNum}} 次</text>
 					</view>
 				</view>
 
@@ -29,16 +29,18 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 				</view> -->
 			</view>
 			<view class="main uni-column">
-				<my-tab ref="tab1" :tabItems="tab1Items" :type="1" @onTabClick="onTab1Click" @onSelectChange="onSelectChange"></my-tab>
-				<my-tab ref="tab2" :tabItems="tab2Items" :tabItemsMark="tab2ItemsMark" :type="0" @onTabClick="onTab2Click" :fontSize="12"></my-tab>
-				
+				<my-tab ref="tab1" :tabItems="tab1Items" :type="1" @onTabClick="onTab1Click"
+					@onSelectChange="onSelectChange"></my-tab>
+				<my-tab ref="tab2" :tabItems="tab2Items" :tabItemsMark="tab2ItemsMark" :type="0"
+					@onTabClick="onTab2Click" :fontSize="12"></my-tab>
+
 				<view class="tab-view uni-column">
 					<!-- 团体成绩列表 -->
 					<template v-if="tab1Current==0" v-for="(item, index) in rank1List" :key="index">
 						<my-ranklist v-show="tab2Current === index" :rankRs="rankList[item]"
 							:rank-type="rankTypeList[index]"></my-ranklist>
 					</template>
-						
+
 					<!-- 个人成绩列表 -->
 					<template v-if="tab1Current==1" v-for="(item, index) in rank2List" :key="index">
 						<my-ranklist v-show="tab2Current === index" :rankRs="rankList[item]"
@@ -81,6 +83,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 				pageName: "rankList",
 				firstEnterKey: 'firstEnter-bm-style4',
 				rankKey: "rank-bm-style4",
+				mapKey: "rank-bm-style4-map",
 				queryObj: {},
 				queryString: "",
 				token: "",
@@ -95,7 +98,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 				endSecond: null, // 活动或赛事结束时间戳，单位秒
 				ocaId: 0, // 关联id，带入到App活动详情页面
 				nickName: "", // 昵称
-				
+
 				mapList: [], // 卡片对应地图列表详情
 				totalDistance: 0, // 赛事所有人累计里程，单位米
 				totalRightAnswerNum: 0, // 赛事所有人正确答题数（校园文化输出）
@@ -127,11 +130,12 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 				// ],
 				// tab2Items: ["总距离", "打点数", "百味豆", "配速"],
 				tab2Items: ["总里程", "累计打点", "校园文化", "最快配速", "单场用时"],
-				tab2ItemsMark: [
-					{textColor: "#ff6203", icon: "static/common/award.png"}
-				],
+				tab2ItemsMark: [{
+					textColor: "#ff6203",
+					icon: "static/common/award.png"
+				}],
 				tabActiveColor: "#81cd00",
-				
+
 				// 成绩类型列表
 				rankTypeList: ["totalDistance", "totalCp", "rightAnswerPer", "fastPace", "speed"],
 				// 团体成绩列表
@@ -141,6 +145,10 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 
 				cssTop: "",
 				cssTopbarColor: "",
+				configParam: {
+					labelRightAnswerNum: "文化输出"
+				},
+				selectedMapId: 0, // 用户选择的地图ID
 				popupDataList: [],
 				popupExchgList: []
 			}
@@ -161,8 +169,17 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 			this.rankKey += "-" + this.ecId;
 			console.log("rankKey:", this.rankKey);
 
+			this.mapKey += "-" + this.ecId;
+			console.log("mapKey:", this.mapKey);
+
 			tools.removeCssCode();
 
+			const mapValue = uni.getStorageSync(this.mapKey);
+			if (mapValue) {
+				console.log("mapValue:", mapValue);
+				this.selectedMapId = mapValue;
+			}
+
 			this.getCardConfigQuery();
 		},
 		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
@@ -299,6 +316,15 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 					}
 				}
 				// console.log("[loadConfig] popupExchgList:", this.popupExchgList);
+				
+				// 加载页面参数
+				const param = config.param;
+				if (param != undefined) {
+					if (param.labelRightAnswerNum != undefined && param.labelRightAnswerNum.length > 0) {
+						this.configParam.labelRightAnswerNum = param.labelRightAnswerNum;
+					}
+				}
+				// console.log("[loadConfig] param:", this.configParam);
 			},
 			// 获取倒计时
 			getCountdown() {
@@ -326,21 +352,11 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 					return Math.round(val / 1000); */
 			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取活动时间
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
 			},
 			getTeamName(teamType, teamIndex) {
 				return teamName[teamType][teamIndex];
@@ -361,41 +377,50 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 						// console.log("getCardConfigQuery", res)
 						const data = res.data.data;
 						// console.log("configJson", data.configJson);
-						// const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
+						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
 						// console.log("configJson", data.configJson);
-						const config = {
+						/* const config = {
 							"css": `
-							.top{
-								width: 100%;
-								height: 170px;
-								padding-top: 36px;
-								justify-content: space-between;
-								background-image: url('static/backgroud/top_bg_sddx.png');
-								background-repeat: no-repeat;
-								background-position-x: center;
-								background-position-y: bottom;
-								background-size: cover;
-							}
-							.topbar-color{
-								color: #ffffff;
-							}
-							.btnBack{
-								background-color: #a43a07 !important;
-							}
-							.swiper-item-button {
-								background-color: #a43a07 !important;
-							}
-							.uni-swiper-dot-active {
-								background: #a43a07 !important;
-							}
-						`,
+								.top{
+									width: 100%;
+									height: 170px;
+									padding-top: 36px;
+									justify-content: space-between;
+									background-image: url('static/backgroud/top_bg_sddx.png');
+									background-repeat: no-repeat;
+									background-position-x: center;
+									background-position-y: bottom;
+									background-size: cover;
+								}
+								.logo{
+									background-image: url('static/logo/sddx.png');
+								}
+								.tcbar{
+									display: flex !important;
+								}
+								.topbar-color{
+									color: #ffffff;
+								}
+								.btnBack{
+									background-color: #a43a07 !important;
+								}
+								.tab-active{
+									background-color: #a43a07 !important;
+								}
+								.swiper-item-button {
+									background-color: #a43a07 !important;
+								}
+								.uni-swiper-dot-active {
+									background: #a43a07 !important;
+								}
+							`,
 							"tabActiveColor": "#a43a07",
 							"popupDataList": [{
 									"type": 1,
 									"data": {
-										"title": "小飞龙定向赛",
-										"img": "/static/common/egg.png",
-										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+										"title": "山大校园定向赛",
+										"img": "/static/logo/sddx.png",
+										"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
 									}
 								},
 								"default"
@@ -411,8 +436,11 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 										"name": "万盛隆购物超市"
 									}
 								}
-							}]
-						};
+							}],
+							"param": {
+								"labelRightAnswerNum": "校园文化输出"
+							}
+						}; */
 
 						this.loadConfig(config);
 						this.matchRsDetailQuery();
@@ -524,20 +552,20 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 						mcId: this.mcId
 					},
 					success: (res) => {
-						console.log("mapListQuery", res);
+						// console.log("mapListQuery", res);
 						if (res.data.code == 0) {
 							const data = res.data.data;
 							this.mapList = data;
-							
+
 							let mapItems = {
-								selectValue: 0,
+								selectValue: this.selectedMapId,
 								data: []
 							};
 							for (var i = 0; i < data.length; i++) {
-								if (i == 0) {
+								if (mapItems.selectValue == 0 && i == 0) {
 									mapItems.selectValue = data[i].ocaId;
 								}
-								let map  = {};
+								let map = {};
 								map.text = "个人(" + data[i].mapName + ")";
 								map.value = data[i].ocaId;
 								mapItems.data.push(map);
@@ -692,6 +720,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 				console.log("onSelectChange: ", val);
 				this.ocaId = val.value;
 				this.getCardRankDetailQuery();
+				uni.setStorageSync(this.mapKey, this.ocaId);
 			},
 		}
 	}
@@ -751,7 +780,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 		height: 80px;
 		margin-top: 10px;
 		margin-bottom: 10px;
-		background-image: url('/static/logo/sddx.png');
+		/* background-image: url('/static/logo/sddx.png'); */
 		background-repeat: no-repeat;
 		background-position-x: center;
 		background-position-y: center;
@@ -759,6 +788,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 	}
 
 	.tcbar {
+		display: none;
 		width: 92%;
 		padding: 6px 12px;
 		background: #9a300e;
@@ -822,9 +852,9 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 		/* justify-content: space-between; */
 	}
 
-	/deep/ .tab-active {
+	/* /deep/ .tab-active {
 		background-color: #a43a07 !important;
-	}
+	} */
 
 	.main-tab {
 		width: 90%;
@@ -839,18 +869,16 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 
 	.btnBack {
 		width: 70%;
-		/* height: 6vh; */
 		height: 80rpx;
-		/* margin-bottom: 1vh; */
 		margin-bottom: 20rpx;
 		/* font-weight: bold; */
 		color: white;
 		font-size: 32rpx;
 		line-height: 80rpx;
 		border-radius: 27px;
-		background-color: #ff870d;
+		background-color: #2e85ec;
 	}
-	
+
 	/* .swiper-item-button {
 		background-color: #ff870e !important;
 	}
@@ -858,5 +886,4 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankList
 	.uni-swiper-dot-active {
 		background: #ff870e !important;
 	} */
-	
 </style>

card/pages/bm/style4/rankOverview.vue

@@ -13,44 +13,49 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 					<text class="topbar-rule" @click="btnInfo">规则</text>
 					<!-- <image mode="aspectFit" class="topbar-info" @click="btnInfo" src="/static/default/info.png"></image> -->
 				</view>
+				<view class="topcontent uni-column uni-jcsa">
+					<view class="logo"></view>
+					<text class="top-acttime">{{fmtMcTime2(beginSecond, endSecond)}}</text>
+				</view>
 			</view>
-			
+
 			<view class="mid uni-column">
-				<view class="mid-1 uni-row uni-jcsb">
-					<text>{{nickName}}</text>
-					<text>总场次：{{totalNum}}</text>
+				<view class="mid-0 uni-row uni-jcsb">
+					<e-select class="" v-model="ocaId" :options="mapList" :search="false" :inputClick="true"
+						:clearable="false" @change="eSelectChange"></e-select>
+				</view>
+				<view class="mid-1 uni-row uni-jcsa">
+					<text class="mid-1-text">{{nickName}}</text>
+					<text class="mid-1-text">{{coiName}}</text>
+					<text class="mid-1-text" style="color: #aaaaaa;" v-if="mcState==1 && allowMcSignUp"
+						@click="btnReGroup">修改</text>
 				</view>
 				<view class="mid-2 uni-row uni-jcsa">
 					<view class="uni-column">
-						<text class="mid-2-value" style="color: #ff0045;">{{totalSysPoint}}</text>
-						<text class="mid-2-text">百味豆(个)</text>
+						<text class="mid-2-value">{{regionTotalNum}}</text>
+						<text class="mid-2-text">总场次</text>
 					</view>
 
 					<view class="mid-line"></view>
-
 					<view class="uni-column">
-						<text class="mid-2-value">{{fmtDistanct(totalDistanct)}}</text>
-						<text class="mid-2-text">总里程km</text>
+						<text class="mid-2-value">{{regionTotalCp}}</text>
+						<text class="mid-2-text">总打点数</text>
 					</view>
 
 					<view class="mid-line"></view>
 					<view class="uni-column">
-						<text class="mid-2-value">{{totalCp}}</text>
-						<text class="mid-2-text">打点数(个)</text>
+						<text class="mid-2-value">{{regionTotalCpRankNum}}</text>
+						<text class="mid-2-text">个人排名</text>
 					</view>
 
-					<view class="mid-line"></view>
-
-					<view class="uni-column">
-						<text class="mid-2-value">{{fmtPace(fastPace)}}</text>
-						<text class="mid-2-text">最快配速</text>
-					</view>
 				</view>
 			</view>
 
 			<view class="main uni-column">
 				<text class="main-title">选择比赛路线</text>
-				<my-pathList :style="pathListStyle.style" :pathList="pathList" :mcState="mcState" :showLine="pathListStyle.showLine"></my-pathList>
+				<my-pathList :style="pathListStyle.style" :pathList="pathList" :selectedPath="ocaId"
+					:mcState="mcState" :showLine="pathListStyle.showLine" @onPathClick="onPathClick"></my-pathList>
+				<button class="btnStartGame" @click="btnStartGame">开始比赛</button>
 			</view>
 
 			<my-popup ref="mypopup" :dataList="popupDataList" :acttime="acttime"></my-popup>
@@ -66,8 +71,10 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 	} from '/common/define';
 	import {
 		token,
+		apiMapListQuery,
 		apiMatchRsDetailQuery,
 		apiCardConfigQuery,
+		apiIsAllowMcSignUp,
 		checkResCode
 	} from '/common/api';
 
@@ -80,6 +87,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 				pageName: "rankOverview",
 				firstEnterKey: 'firstEnter-bm-style4',
 				rankKey: "rank-bm-style4",
+				mapKey: "rank-bm-style4-map",
 				queryObj: {},
 				queryString: "",
 				token: "",
@@ -88,10 +96,13 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 				mcId: 0, // 赛事id
 				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
 				mcName: "", // 赛事名称
+				coiName: "", // 已报名单位名称
 				acttime: "", // 活动时间
 				beginSecond: null, // 活动或赛事开始时间戳，单位秒
 				endSecond: null, // 活动或赛事结束时间戳，单位秒
+				ocaId: 0, // 关联id，带入到App活动详情页面
 				nickName: "", // 昵称
+
 				totalNum: null, // 总场次
 				totalDistanct: null, // 总距离,单位米
 				totalDistanctRankNum: null, // 总距离排名
@@ -101,10 +112,16 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 				totalSysPointRankNum: null, // 总百味豆排名
 				fastPace: null, // 个人最快配速
 				fastPaceRankNum: null, // 个人最快配速排名
+				regionTotalNum: null, // 地图内总场次
+				regionTotalCp: null, // 地图内打点数
+				regionTotalCpRankNum: null, // 地图内个人打点排名
 				ocaRs: [], // 卡片对应活动集合
 
+				mapList: [], // 地图列表
+
 				interval: null,
 				mcState: 0, // 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
+				allowMcSignUp: false, // 是否允许重新分组
 				cssTop: "",
 				cssTopbarColor: "",
 				pathList: {},
@@ -132,8 +149,17 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 			this.rankKey += "-" + this.ecId;
 			console.log("rankKey:", this.rankKey);
 
+			this.mapKey += "-" + this.ecId;
+			console.log("mapKey:", this.mapKey);
+
 			tools.removeCssCode();
 
+			const mapValue = uni.getStorageSync(this.mapKey);
+			if (mapValue) {
+				console.log("mapValue:", mapValue);
+				this.ocaId = mapValue;
+			}
+
 			this.getCardConfigQuery();
 		},
 		// 页面初次渲染完成，此时组件已挂载完成，DOM 树($el)已可用
@@ -263,7 +289,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 				if (pathList != undefined) {
 					this.pathList = pathList;
 				}
-				
+
 				// 加载比赛路线样式
 				const pathListStyle = config.pathListStyle;
 				// console.log("[loadConfig] pathList:", pathList);
@@ -321,21 +347,14 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 				return tools.convertSecondsToHMS(val, 2);
 			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取活动时间
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
+			},
+			fmtMcTime2(timestamp1, timestamp2) {
+				return tools.fmtMcTime2(timestamp1, timestamp2);
 			},
 			getCardConfigQuery() {
 				uni.request({
@@ -359,102 +378,140 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 							"css": `
 								.top{
 									position: relative;
-									z-index: 10;
 									width: 100%;
-									height: 270px;
+									height: 220px;
 									padding-top: 36px;
 									justify-content: space-between;
-									background-image: url('static/backgroud/top_bg_egg2.png');
+									background-image: url('static/backgroud/top_bg_sddx.png');
 									background-repeat: no-repeat;
 									background-position-x: center;
-									background-position-y: -8px;
-									background-size: 100% 100%;
+									background-position-y: center;
+									background-size: cover;
+								}
+								.logo{
+									background-image: url('static/logo/sddx.png');
+								}
+								.top-acttime{
+									display: flex !important;
+								}
+								.topbar-color{
+									color: #ffffff;
+								}
+								.mid{
+									margin-top: -40px !important;
+								}
+								.btnStartGame{
+									background-color: #a43a07 !important;
+								}
+								.e-select{
+									background-color: #a43a07 !important;
+								}
+								.swiper-item-button{
+									background-color: #a43a07 !important;
+								}
+								.uni-swiper-dot-active{
+									background: #a43a07 !important;
 								}
 							`,
 							"pathList": {
 								"row1": [{
 										"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-										"pathImg": "/static/common/lingxiucheng.png",
+										"pathImg": "/static/common/sdzxxq.png",
 										"path": {
-											"ocaId": 1,
+											"ocaId": 17,
 											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
 										},
 										"navImg": "/static/common/nav.png",
 										"point": {
 											"longitude": 117.022194,
 											"latitude": 36.661612,
-											"name": "领秀城起始点"
+											"name": "山大中心校区起始点"
 										}
 									},
 									{
 										"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-										"pathImg": "/static/common/quanchenggongyuan.png",
+										"pathImg": "/static/common/sdbtqxq.png",
 										"path": {
-											"ocaId": 1,
+											"ocaId": 13,
 											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
 										},
 										"navImg": "/static/common/nav.png",
 										"point": {
 											"longitude": 117.022194,
 											"latitude": 36.661612,
-											"name": "泉城公园起始点"
+											"name": "山大趵突泉校区起始点"
 										}
 									}
 								],
 								"row2": [{
 										"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-										"pathImg": "/static/common/baihuagongyuan.png",
+										"pathImg": "/static/common/sdhjlxq.png",
 										"path": {
-											"ocaId": 1,
+											"ocaId": 15,
 											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
 										},
 										"navImg": "/static/common/nav.png",
 										"point": {
 											"longitude": 117.022194,
 											"latitude": 36.661612,
-											"name": "百花公园起始点"
+											"name": "山大洪家楼校区起始点"
 										}
 									},
 									{
 										"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-										"pathImg": "/static/common/aotizhongxin.png",
+										"pathImg": "/static/common/sdrjyxq.png",
 										"path": {
-											"ocaId": 1,
+											"ocaId": 14,
 											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
 										},
 										"navImg": "/static/common/nav.png",
 										"point": {
 											"longitude": 117.022194,
 											"latitude": 36.661612,
-											"name": "奥体中心起始点"
+											"name": "山大软件园校区起始点"
 										}
 									}
 								],
 								"row3": [{
-									"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
-									"pathImg": "/static/common/muniushan.png",
-									"path": {
-										"ocaId": 1,
-										"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+										"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
+										"pathImg": "/static/common/sdxlsxq.png",
+										"path": {
+											"ocaId": 18,
+											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+										},
+										"navImg": "/static/common/nav.png",
+										"point": {
+											"longitude": 117.022194,
+											"latitude": 36.661612,
+											"name": "山大兴隆山校区起始点"
+										}
 									},
-									"navImg": "/static/common/nav.png",
-									"point": {
-										"longitude": 117.022194,
-										"latitude": 36.661612,
-										"name": "牧牛山起始点"
+									{
+										"type": 3, // 1: 比赛路线  2: 导航到指定地点  3: 比赛路线 + 导航
+										"pathImg": "/static/common/sdqfsxq.png",
+										"path": {
+											"ocaId": 16,
+											"mcType": 3 // 赛事类型 1 普通活动 2 线下赛 3 线上赛
+										},
+										"navImg": "/static/common/nav.png",
+										"point": {
+											"longitude": 117.022194,
+											"latitude": 36.661612,
+											"name": "山大千佛山校区起始点"
+										}
 									}
-								}]
+								]
 							},
-							"pathListStyle" : {
-								"showLine" : true,
+							"pathListStyle": {
+								"showLine": true,
 								"style": "justify-content: flex-start;"
 							},
 							"popupDataList": [{
 									"type": 1,
 									"data": {
-										"title": "小飞龙定向赛",
-										"img": "/static/logo/xfl.png",
-										"content": "济南奥体中心“一场三馆”包括体育场、体育馆、网球馆和游泳馆，呈现出“东荷西柳”的总体布局。 体育场以济南的“市树”柳树为母题，将垂柳柔美飘逸的形态固化为建筑语言。"
+										"title": "山大校园定向赛",
+										"img": "/static/logo/sddx.png",
+										"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
 									}
 								},
 								{
@@ -484,6 +541,40 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 					},
 				});
 			},
+			// 卡片对应地图列表详情查询
+			mapListQuery() {
+				uni.request({
+					url: apiMapListQuery,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						mcId: this.mcId
+					},
+					success: (res) => {
+						// console.log("mapListQuery", res);
+						if (res.data.code == 0) {
+							const data = res.data.data;
+							this.mapList = data;
+
+							let mapItems = [];
+							for (var i = 0; i < data.length; i++) {
+								let map = {};
+								map.text = data[i].mapName;
+								map.value = data[i].ocaId;
+								mapItems.push(map);
+							}
+							this.mapList = mapItems;
+							// console.log("mapList", this.mapList);
+						}
+					},
+					fail: (err) => {
+						console.log("mapListQuery err", err);
+					},
+				});
+			},
 			// 卡片对应线上赛多个活动查询
 			matchRsDetailQuery() {
 				uni.request({
@@ -494,15 +585,17 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 					},
 					method: "POST",
 					data: {
-						ecId: this.ecId
+						ecId: this.ecId,
+						ocaId: this.ocaId
 					},
 					success: (res) => {
-						console.log("matchRsDetailQuery", res);
+						// console.log("matchRsDetailQuery", res);
 						if (checkResCode(res)) {
 							const data = res.data.data;
 							this.mcType = data.mcType;
 							this.mcId = data.mcId;
 							this.mcName = data.mcName;
+							this.coiName = data.coiName;
 							this.beginSecond = data.beginSecond;
 							this.endSecond = data.endSecond;
 							this.nickName = data.nickName;
@@ -515,6 +608,9 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 							this.totalSysPointRankNum = data.totalSysPointRankNum;
 							this.fastPace = data.fastPace;
 							this.fastPaceRankNum = data.fastPaceRankNum;
+							this.regionTotalNum = data.regionTotalNum;
+							this.regionTotalCp = data.regionTotalCp;
+							this.regionTotalCpRankNum = data.regionTotalCpRankNum;
 							this.ocaRs = data.ocaRs;
 
 							this.mcState = tools.checkMcState(this.beginSecond, this.endSecond);
@@ -525,6 +621,9 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 							this.getCountdown();
 							this.getActtime();
 
+							this.isAllowMcSignUp();
+							this.mapListQuery();
+
 							this.clear();
 							this.interval = setInterval(this.getCountdown, 60000);
 						}
@@ -534,6 +633,30 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 					},
 				});
 			},
+			// 是否允许重新分组（报名）
+			isAllowMcSignUp() {
+				uni.request({
+					url: apiIsAllowMcSignUp,
+					header: {
+						"Content-Type": "application/x-www-form-urlencoded",
+						"token": this.token,
+					},
+					method: "POST",
+					data: {
+						ecId: this.ecId
+					},
+					success: (res) => {
+						// console.log("isAllowMcSignUp", res)
+						if (res.data.code == 0) {
+							const data = res.data.data;
+							this.allowMcSignUp = data.allowSignUp;
+						}
+					},
+					fail: (err) => {
+						console.log("isAllowMcSignUp err", err)
+					},
+				});
+			},
 			btnBack() {
 				// const url = `action://to_home/`;
 				// window.location.href = url;
@@ -547,6 +670,13 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 				// console.log(this.$refs.mypopup);
 				this.$refs.mypopup.popupOpen();
 			},
+			btnReGroup() {
+				this.queryObj.from = "rankOverview";
+				this.queryString = tools.objectToQueryString(this.queryObj);
+				uni.navigateTo({
+					url: '/pages/bm/style4/signup?' + this.queryString
+				});
+			},
 			onOverviewClick(ovtype) {
 				this.queryObj.ovtype = ovtype;
 				this.queryString = tools.objectToQueryString(this.queryObj);
@@ -554,6 +684,40 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 					url: "/pages/bm/style4/rankList?" + this.queryString
 				});
 			},
+			eSelectChange(data) {
+				console.log("eSelectChange:", data);
+				this.ocaId = data.value;
+				this.matchRsDetailQuery();
+				uni.setStorageSync(this.mapKey, this.ocaId);
+			},
+			onPathClick(data) {
+				console.log("onPathClick:", data);
+				if (this.ocaId != data.path.ocaId) {
+					this.ocaId = data.path.ocaId;
+					this.matchRsDetailQuery();
+					uni.setStorageSync(this.mapKey, data.path.ocaId);
+				}
+			},
+			btnStartGame() {
+				// 赛事/活动状态 0: 未开始  1: 进行中  2: 已结束
+				if (this.mcState == 1) {
+					const url = `action://to_detail/?id=${this.ocaId}&matchType=${this.mcType}`;
+					// window.location.href = url;
+					tools.appAction(url);
+				} else if (this.mcState == 0) {
+					uni.showToast({
+						title: '比赛尚未开始',
+						icon: 'none',
+						duration: 3000
+					});
+				} else if (this.mcState == 2) {
+					uni.showToast({
+						title: '比赛已结束',
+						icon: 'none',
+						duration: 3000
+					});
+				}
+			}
 		}
 	}
 </script>
@@ -580,25 +744,6 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 		/* background-size: cover; */
 	}
 
-	/* .top-oval {
-		position: relative;
-		z-index: 0;
-		margin-top: -180px;
-		margin-left: -10%;
-		width: 120%;
-		height: 280px;
-		background: linear-gradient(180deg, #ffffff 12.18%, #eeeeee 100%);
-		border-radius: 50%;
-		text-align: center;
-	}
-
-	.top-oval-text {
-		color: #333333;
-		font-size: 13px;
-		line-height: 386px;
-		pointer-events: auto;
-	}
- */
 	.topbar {
 		width: 90%;
 		justify-content: space-between;
@@ -630,6 +775,32 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 		font-weight: 550;
 	}
 
+	.topcontent {
+		height: 90%;
+		margin-bottom: 50px;
+	}
+
+	.logo {
+		width: 80px;
+		height: 80px;
+		margin-top: 10px;
+		/* background-image: url('/static/logo/sddx.png'); */
+		background-repeat: no-repeat;
+		background-position-x: center;
+		background-position-y: center;
+		background-size: contain;
+	}
+
+	.top-acttime {
+		display: none;
+		text-shadow: 3px 3px 0px #640008;
+		font-family: YouSheBiaoTiHei;
+		/* font-family: Arial, Helvetica, sans-serif; */
+		font-weight: bold;
+		color: #ffee0b;
+		font-size: 26px;
+	}
+
 	.topbtm {
 		width: 100%;
 		/* height: 60rpx; */
@@ -652,7 +823,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 
 	.mid {
 		width: 90%;
-		height: 120px;
+		height: 150px;
 		position: relative;
 		z-index: 20;
 		margin-top: -100px;
@@ -662,14 +833,27 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 		font-family: Source Han Sans CN;
 	}
 
-	.mid-1 {
-		width: 90%;
+	.mid-0 {
+		width: 56%;
 		margin: 12px;
 		font-weight: 500;
 		color: #8e8e8e;
 		font-size: 14px;
 	}
 
+	.mid-1 {
+		width: 90%;
+		margin-bottom: 12px;
+
+	}
+
+	.mid-1-text {
+		/* min-width: 60px; */
+		font-weight: 500;
+		color: #9a300e;
+		font-size: 12px;
+	}
+
 	.mid-2 {
 		width: 92%;
 		/* margin: 0 10px; */
@@ -678,6 +862,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 	.mid-2-value {
 		font-weight: 900;
 		font-size: 22px;
+		line-height: 25px;
 	}
 
 	.mid-2-text {
@@ -687,7 +872,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 
 	.mid-line {
 		width: 0px;
-		height: 45.04px;
+		height: 40px;
 		border: 1px solid;
 		border-color: #e6e6e6;
 	}
@@ -749,7 +934,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 	.main {
 		width: 100%;
 		margin-top: 20px;
-		margin-bottom: 10px;
+		margin-bottom: 20px;
 		/* height: 70vh; */
 		justify-content: space-around;
 		/* justify-content: space-between; */
@@ -761,4 +946,47 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/rankOverview
 		color: #333333;
 		font-size: 16px;
 	}
+	
+	.btnStartGame {
+		width: 70%;
+		height: 80rpx;
+		margin-top: 50rpx;
+		/* font-weight: bold; */
+		color: white;
+		font-size: 32rpx;
+		line-height: 80rpx;
+		border-radius: 27px;
+		background-color: #2e85ec;
+	}
+
+	/deep/ .e-select {
+		/* width: 60%; */
+		height: 60rpx;
+		background: #2e85ec;
+		color: #ffffff;
+		border-radius: 18px;
+		justify-content: space-around;
+
+		font-size: 16px;
+		font-weight: 500;
+		line-height: 60rpx;
+		text-align: center;
+		border: none !important;
+	}
+
+	/deep/ .e-select-input-text {
+		color: inherit !important;
+	}
+
+	/deep/ .e-select-selector-item {
+		color: #818181;
+	}
+
+	/deep/ .uni-icons {
+		color: inherit !important;
+	}
+
+	/deep/ .e-select-icon {
+		width: 26px !important;
+	}
 </style>

card/pages/bm/style4/signup.vue

@@ -23,9 +23,9 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 					<text class="acttime">{{acttime}}</text>
 				</view>
 
-				<input class="uni-input" maxlength="30" :placeholder="'请填写'+labelName" v-model="nickName" />
+				<input class="uni-input" maxlength="30" :placeholder="'请填写'+configParam.labelName" v-model="nickName" />
 				<e-select v-model="coiId" :options="coiRs" :props="eSelectionProps"
-					clearable :placeholder="'请选择'+labelOrg" @getText="getESelectText" @change="eSelectChange"></e-select>
+					clearable :placeholder="'请选择'+configParam.labelOrg" @getText="getESelectText" @change="eSelectChange"></e-select>
 
 				<view class="introduce uni-column">
 					<text class="introduce-title">{{introduce.title}}</text>
@@ -52,8 +52,8 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 					<view class="dialog-content uni-column">
 						<text class="dialog-content-1">{{mcName}}</text>
 						<view class="uni-column uni-ais">
-							<text class="dialog-content-2">{{labelName}}: {{nickName}}</text>
-							<text class="dialog-content-2">{{labelOrg}}: {{coiName}}</text>
+							<text class="dialog-content-2">{{configParam.labelName}}: {{nickName}}</text>
+							<text class="dialog-content-2">{{configParam.labelOrg}}: {{coiName}}</text>
 							<!-- <text class="dialog-content-2">{{teamName}}</text> -->
 						</view>
 					</view>
@@ -89,8 +89,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 				queryString: "",
 				from: "", // 来源页面
 				token: "",
-				labelName: "",
-				labelOrg: "",
+								
 				ecId: 0, // 卡片id
 				mcId: 0, // 赛事id
 				mcType: 0, // 赛事类型 1 普通活动 2 线下赛 3 线上赛
@@ -117,6 +116,10 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 					content: ""
 				},
 				popupDataList: [],
+				configParam: {
+					labelName: "昵称",
+					labelOrg: "组织",
+				},
 
 				eSelectionProps: {
 					text: 'coiName',
@@ -134,8 +137,6 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 			this.from = query["from"] ?? "";
 			this.token = query["token"] ?? token;
 			this.ecId = query["id"] ?? 0;
-			this.labelName = query["labelName"] ?? "昵称";
-			this.labelOrg = query["labelOrg"] ?? "组织";
 
 			this.firstEnterKey += "-" + this.ecId;
 			console.log("firstEnterKey:", this.firstEnterKey);
@@ -284,52 +285,28 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 					console.log("[loadConfig] popupDataList 加载默认列表");
 				}
 				// console.log("[loadConfig] popupDataList:", this.popupDataList);
+				
+				// 加载页面参数
+				const param = config.param;
+				if (param != undefined) {
+					if (param.labelName != undefined && param.labelName.length > 0) {
+						this.configParam.labelName = param.labelName;
+					}
+					if (param.labelOrg != undefined && param.labelOrg.length > 0) {
+						this.configParam.labelOrg = param.labelOrg;
+					}
+				}
+				// console.log("[loadConfig] param:", this.configParam);
 			},
 			fmtMcTime(timestamp) {
-				var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				// var Y = date.getFullYear() + '-';
-				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
-				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
-				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
-				// var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
-
-				const timeStr = M + D + h + m;
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime(timestamp);
 			},
 			// 获取倒计时
 			getActtime() {
-				this.acttime = this.fmtMcTime(this.beginSecond) + " 至 " + this.fmtMcTime(this.endSecond);
+				this.acttime = tools.getActtime(this.beginSecond, this.endSecond);
 			},
 			fmtMcTime2(timestamp1, timestamp2) {
-				const date1 = new Date(timestamp1 * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-				const date2 = new Date(timestamp2 * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-
-				const Y1 = date1.getFullYear();
-				const Y2 = date2.getFullYear();
-				const M1 = date1.getMonth() + 1;
-				const M2 = date2.getMonth() + 1;
-				const D1 = date1.getDate();
-				const D2 = date2.getDate();
-
-				var timeStr1 = Y1 + '.' + M1 + '.' + D1;
-				var timeStr2 = '';
-
-				if (Y2 != Y1) {
-					timeStr2 += Y2 + '.' + M2 + '.' + D2;
-				} else if (M2 != M1) {
-					timeStr2 += M2 + '.' + D2;
-				} else if (D2 != D1) {
-					timeStr2 += D2;
-				}
-
-				var timeStr = timeStr1;
-				if (timeStr2.length > 0) {
-					timeStr += '-' + timeStr2;
-				}
-				// console.log("timeStr", timeStr);
-				return timeStr;
+				return tools.fmtMcTime2(timestamp1, timestamp2);
 			},
 			getCardConfigQuery() {
 				uni.request({
@@ -346,11 +323,11 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 					success: (res) => {
 						// console.log("getCardConfigQuery", res)
 						const data = res.data.data;
-						// const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
+						const config = data.configJson != "" ? JSON.parse(data.configJson) : "";
 						// console.log("configJson", data.configJson);
-						const config = {
+						/* const config = {
 							"css": `
-								.top2{
+								.top{
 									width: 100%;
 									height: 220px;
 									padding-top: 36px;
@@ -360,6 +337,12 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 									background-position: center;
 									background-size: cover;
 								}
+								.logo{
+									background-image: url('static/logo/sddx.png');
+								}
+								.top-acttime{
+									display: flex !important;
+								}
 								.topbar-color{
 									color: #ffffff;
 								}
@@ -376,7 +359,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 							"popupDataList": [{
 									"type": 1,
 									"data": {
-										"title": "小飞龙定向赛",
+										"title": "山大校园定向赛",
 										"img": "/static/logo/sddx.png",
 										"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
 									}
@@ -386,8 +369,12 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 							"introduce": {
 								"title": "介绍：",
 								"content": "　　开学季来袭！山大校园定向赛燃情启幕！探索校园每一个角落，挑战智慧与体能，全校师生共同开启新学期活力篇章！等你来挑战！"
+							},
+							"param": {
+								"labelName": "姓名",
+								"labelOrg": "院系"
 							}
-						};
+						}; */
 
 						this.loadConfig(config);
 
@@ -568,7 +555,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 				if (this.from != '') {
 					// window.history.back();
 					uni.navigateTo({
-						url: '/pages/bm/style4/rankList?' + this.queryString
+						url: '/pages/bm/style4/' + this.from + '?' + this.queryString
 					});
 				} else {
 					const url = `action://to_home/`;
@@ -586,7 +573,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 				
 				if (!(this.nickName.trim().length > 0)) {
 					uni.showToast({
-						title: `请填写${this.labelName}`,
+						title: `请填写${this.configParam.labelName}`,
 						icon: 'none',
 						duration: 2000
 					});
@@ -595,7 +582,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 				
 				if (!(this.coiId > 0)) {
 					uni.showToast({
-						title: `请选择${this.labelOrg}`,
+						title: `请选择${this.configParam.labelOrg}`,
 						icon: 'none',
 						duration: 2000
 					});
@@ -673,7 +660,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 		width: 80px;
 		height: 80px;
 		margin-top: 10px;
-		background-image: url('/static/logo/sddx.png');
+		/* background-image: url('/static/logo/sddx.png'); */
 		background-repeat: no-repeat;
 		background-position-x: center;
 		background-position-y: center;
@@ -681,6 +668,7 @@ https://oss-mbh5.colormaprun.com/card/#/pages/bm/style4/signup
 	}
 
 	.top-acttime {
+		display: none;
 		text-shadow: 3px 3px 0px #640008;
 		font-family: YouSheBiaoTiHei;
 		/* font-family: Arial, Helvetica, sans-serif; */