www_fpvone_cn/application/index/view/match/club_match.html

357 lines
14 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<link rel="stylesheet" type="text/css" href="__CDN__/assets/css/door/css/flyer.css">
<link rel="stylesheet" type="text/css" href="__CDN__/assets/css/door/css/myMarch.css?v={$site.version}">
<style>
.layui-layer-btn .layui-layer-btn0{
background: #000;
}
.layui-layer-title{
font-weight: bold;
text-align: center;
font-size: 18px;
}
.matchwin .layui-layer-btn{
text-align: center;
padding: 20px;
}
.matchwin .layui-layer-btn a{
height: 50px;
width: 30%;
line-height: 50px;
font-size: 18px;
}
/*俱乐部赛事*/
.table-list{
width: 90%;
margin: 30px auto;
line-height: 50px;
}
.table-list thead{
background: #EEEEEE;
}
.table-list tr{
display: flex;
}
.table-list td{
padding: 0 10px;
text-align: center;
flex: 1;
}
.table-list button{
border: 0;
padding: 0 10px;
line-height: 30px;
border: 1px solid #aaa;
border-radius: 5px;
background: transparent;
background: #000;
color: #fff;
}
.clubbox{
display: flex;
justify-content: space-between;
align-items: center;
}
.clubbox p{
margin-bottom:15px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
}
.clubbox .logo{
max-height: 40px;
}
.clubbox img{
width: 60px;
margin: 0 16px;
height: 60px;
}
@media screen and (max-width: 768px){
.table-list td:nth-child(3){
display: none;
}
.table-list td:nth-child(4){
flex: 1.8;
}
.table-list button{
padding: 0 10px;
width: 120px;
border-radius: 3px;
}
}
</style>
<div class="fly-right">
<div class="fr-wrap">
<p class="my-event">俱乐部赛事 | Club Events</p>
<div class="myMarch-name">
<p>
<span>赛事报名</span>
<span>Apply</span>
</p>
<a href="tel:13136225305">加急审核请致电13136225305</a>
</div>
<div class="marchList">
{empty name="club_matchlist"}
<div class="onebox">
<div class="onematch">您还未参与任何赛事</div>
<!--<div class="start">-->
<!-- <a href="/">去参加赛事 Participate In Events</a>-->
<!--</div>-->
</div>
{else /}
<ul>
<div>
<p>赛事</p>
<p>申请时间</p>
<p>参与资格</p>
<p>操作</p>
</div>
{foreach $club_matchlist as $key=>$vo }
{if $vo.match}
<li onclick="choosefly({$vo.match.id},'{$vo.match.title}')">
<p class="myname">{$vo.match.title ?? '已过期赛事'}</p>
<p>{$vo.created_at ?? '未知时间'}</p>
<p
class="{if $vo.status == 1} auditing {elseif $vo.status == 2} audited {else /} noaudit {/if}">
{if $vo.status == 1} 审核中 {elseif $vo.status == 2} 审核通过 {else /} 审核不通过 {/if}
</p>
<p class="btnbox"><button class="coursebtn">查看详情</button>
</p>
</li>
{/if}
{/foreach}
</ul>
{$page}
{/empty}
</div>
</div>
</div>
<div id="choosefly" style="display:none;">
<table border="0" id="table-list-club" class="table-list">
<thead>
<td>俱乐部名称</td>
<td>操作</td>
</thead>
<tbody>
</tbody>
</table>
<table border="0" id="table-list-player" class="table-list">
<thead>
<td>参赛飞手</td>
<td>性别</td>
<td>出生日期</td>
<td>操作</td>
</thead>
<tbody>
</tbody>
</table>
</div>
<div class="coursepop"></div>
<script src="__CDN__/assets/css/door/js/jquery.form.min.js"></script>
<script src="__CDN__/assets/css/door/layui/layui.js"></script>
<script src="/assets/addons/cms/js/html2canvas.min.js"></script>
<script>
const choosefly=function(id,title){
const match_id=id;
let select_player=[];
layer.open({
type:1,
title:title,
content:$('#choosefly').html(),
area:['60%','70%'],
skin:'matchwin',
shadeClose:true,
success:function(){
$.post('/index/club/club_allplayer',{
match_id
},function(res){
if(res.code){
let tablehtml=''
let nobtn=''
$('#table-list-club tbody').html(`
<tr>
<td style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width:170px;">${res.data.club.name}</td>
<td><button onclick="getcourse('${res.data.club.id}','${res.data.player[0].match_id}',0)">生成成绩证书</button></td>
</tr>
`)
for(let i in res.data.player){
tablehtml+=`
<tr>
<td>${res.data.player[i].player.real_name}</td>
<td>${res.data.player[i].player.gender}</td>
<td>${res.data.player[i].player.birthday}</td>
<td><button onclick="getcourse('${res.data.player[i].player_id}','${res.data.player[i].match_id}',1)">生成成绩证书</button></td>
</tr>
`
}
$('#table-list-player tbody').html(tablehtml);
}
})
}
})
}
// 生成成绩证书
function getcourse(id,match_id,status) {
if(status){
$.ajax({
url: '/index/league/get_cert',
type: 'post',
data: { match_id, player_id:id},
dataType: 'json',
success: (res) => {
if(res.code){
coursedata(res.data,status)
}else{
layer.msg('未查询到成绩!');
}
},
error: (err) => {
layer.msg('未查询到成绩!');
}
})
}else{
$.ajax({
url: '/index/league/get_club_cert',
type: 'post',
data: { match_id, club_id:id },
dataType: 'json',
success: (res) => {
if(res.code){
coursedata(res.data,status)
}else{
layer.msg('未查询到成绩!');
}
},
error: (err) => {
layer.msg('未查询到成绩!');
}
})
}
function coursedata(data,status) {
console.log(data)
let nowtimestamp = parseInt(new Date().getTime() / 1000);
let ezuhe = data.endtime.etime + ' ' + data.endtime.match_end_time;
let etimestamp = parseInt(new Date(ezuhe.replace(/-/g, "/")).getTime() / 1000);
let vhtml='';
if(status){
vhtml=`
<img src="${data.endtime.course_poster}" width="350" height="600" style="position:absolute;z-index:-1;" />
<div class="contbox">
<div class="info">
<div class="pic" style="margin-right:10px;"><img src="${data.player.player_pic}" height="70"></div>
<div class="text">
<p>
<span>姓名:</span>
<span>${data.player.real_name}</span>
</p>
<p>
<span>编号:</span>
<span>${data.player.member_number}</span>
</p>
<p>
<span>性别:</span>
<span>${data.player.gender}</span>
</p>
</div>
</div>
<div class="pm">
<p>
<span>所属队伍:</span>
<span>${data.club.name_short}</span>
</p>
<p>
<span>参赛名次:</span>
<span>第${data.player.number}名</span>
</p>
<p>
<span>本站积分:</span>
<span>${data.player.grade}</span>
</p>
</div>
</div>
<div id="qrcode" class="code" style="display:inline-block;position:relative;left:44px;">
<img width="60" src="https://www.fpvone.cn/qrcode/build?text=https://www.fpvone.cn/p/zhengshurenzheng?number=${data.certificate_number.certificate_number}" />
</div>
`
}else{
vhtml=`
<img src="${data.endtime.club_course_poster}" width="350" height="600" style="position:absolute;z-index:-1;" />
<div class="contbox clubbox">
<div class="pic">
<img src="${data.club.logo}">
</div>
<div class="text">
<p>
<span>队伍简称:</span>
<span>${data.club.name_short}</span>
</p>
<p class="logo">
<span>队伍口号:</span>
<span>${data.club.competition_slogan}</span>
</p>
<p>
<span>所属地区:</span>
<span>${data.club.province}</span>
</p>
<p>
<span>参赛名次:</span>
<span>${data.club.number}</span>
</p>
<p>
<span>本站积分:</span>
<span>${data.club.grade}</span>
</p>
</div>
</div>
<div id="qrcode" class="code" style="display:inline-block;position:relative;left:44px;margin-top:24px;">
<img width="50" src="https://www.fpvone.cn/qrcode/build?text=https://www.fpvone.cn/p/julebuzhengshurenzheng?number=${data.certificate_number.certificate_number}" />
</div>
`
}
if (data.endtime.is_open_course == 1) {
layui.layer.msg(`成绩证书已关闭!`);
} else {
if (nowtimestamp > etimestamp) {
let loadicon = layui.layer.load(0, { shade: [0.15, '#ccc'] });
$('.coursepop').html(vhtml)
let node = $(".coursepop")[0];
setTimeout(() => {
layer.close(loadicon);
html2canvas(node, {
useCORS: true,
allowTaint: true,
taintTest: false,
width: node.scrollWidth,
height: node.scrollHeight,
scale: window.devicePixelRatio
}).then((canvas) => {
let hcurl = canvas.toDataURL('image/png')
layui.layer.open({
type: 1,
title: false, // 不显示标题栏
closeBtn: 0,
area: ['350px', '600px'],
shadeClose: true, // 点击遮罩关闭层
content: `
<img width="100%" src="${hcurl}" />
`
});
})
.catch((err) => {
console.log('err', err)
})
}, 500);
} else {
layui.layer.msg(`${ezuhe}后可生成成绩证书!`);
}
}
}
}
</script>