|
|
@ -1,25 +1,25 @@ |
|
|
|
<!DOCTYPE html> |
|
|
|
<html lang="zh-CN"> |
|
|
|
<head> |
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> |
|
|
|
<meta property="og:title" content="华清特奖报名" /> |
|
|
|
<meta property="og:description" content="华清大学特普通奖学金" /> |
|
|
|
<link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"> |
|
|
|
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> |
|
|
|
<script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script> |
|
|
|
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-timeago/1.6.7/jquery.timeago.min.js"></script> |
|
|
|
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-timeago/1.6.7/locales/jquery.timeago.zh-CN.js"></script> |
|
|
|
<title>华清特奖报名</title> |
|
|
|
<style> |
|
|
|
.qbox { |
|
|
|
background:#e8e8e8; |
|
|
|
padding:5px; |
|
|
|
color:black; |
|
|
|
box-shadow: 2px 2px 10px 2px rgb(219 219 220); |
|
|
|
border-radius: .5rem; |
|
|
|
margin: 25px 0; |
|
|
|
} |
|
|
|
<head> |
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> |
|
|
|
<meta property="og:title" content="华清特奖报名" /> |
|
|
|
<meta property="og:description" content="华清大学特普通奖学金" /> |
|
|
|
<link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"> |
|
|
|
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> |
|
|
|
<script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script> |
|
|
|
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-timeago/1.6.7/jquery.timeago.min.js"></script> |
|
|
|
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-timeago/1.6.7/locales/jquery.timeago.zh-CN.js"></script> |
|
|
|
<title>华清特奖报名</title> |
|
|
|
<style> |
|
|
|
.qbox { |
|
|
|
background:#e8e8e8; |
|
|
|
padding:5px; |
|
|
|
color:black; |
|
|
|
box-shadow: 2px 2px 17px 2px rgb(219 219 220); |
|
|
|
border-radius: .5rem; |
|
|
|
margin: 35px 5px; |
|
|
|
} |
|
|
|
.qbox .inner { |
|
|
|
margin: 15px 0 0 15px; |
|
|
|
white-space: pre-wrap; |
|
|
@ -34,108 +34,151 @@ |
|
|
|
.card-body { |
|
|
|
padding: 0.75em; |
|
|
|
} |
|
|
|
</style> |
|
|
|
</head> |
|
|
|
<body style="background-color: #001a37;color:#e8e8e8"> |
|
|
|
|
|
|
|
<div style="max-width:700px;" class="container"> |
|
|
|
<div style="background-color:rgba(230,230,250,0.5);margin-bottom:40px"> |
|
|
|
.new { |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.new-collapse { |
|
|
|
max-height: 125px; |
|
|
|
-webkit-mask-image: linear-gradient(#1a1a1a,transparent); |
|
|
|
mask-image: linear-gradient(#1a1a1a,transparent); |
|
|
|
} |
|
|
|
.show-button { |
|
|
|
position: relative; |
|
|
|
text-align: center; |
|
|
|
margin-top: -125px; |
|
|
|
padding-top: 110px; |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
@keyframes downn { |
|
|
|
0% { |
|
|
|
transform: translate(0px, -5px); |
|
|
|
} |
|
|
|
50% { |
|
|
|
transform: translate(0px, 2px); |
|
|
|
} |
|
|
|
100% { |
|
|
|
transform: translate(0px, -5px); |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
|
|
|
</head> |
|
|
|
<body style="background-color: #001a37;color:#e8e8e8"> |
|
|
|
|
|
|
|
<div align='center' style='background-color:rgba(180,180,250,0.5);padding:10px;color:#ffffff;'> |
|
|
|
<h1 align='center'>华清大学<br/>特普通奖学金</h1> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style="max-width:700px;" class="container";> |
|
|
|
<div style='padding:20px;text-align:center'> |
|
|
|
<h1>华清大学<br/>特普通奖学金</h1> |
|
|
|
</div> |
|
|
|
|
|
|
|
<form action="new" method="post"> |
|
|
|
<div class="form-group qbox"> |
|
|
|
<label>自荐提名</label> |
|
|
|
<textarea class="form-control" name="text" rows="5" maxlength="400" placeholder="简单介绍一下普通的自己,禁止内卷,限400字" required="required"></textarea> |
|
|
|
<div class="form-group row"> |
|
|
|
<label for="url" class="col-sm-3 col-form-label">补充材料(可选)</label> |
|
|
|
<div class="col-sm-9"> |
|
|
|
<input type="url" class="form-control" id="url" name="url" placeholder="链接,如:https://closed.social/safeShare/1xxxxxx" pattern="https://closed\.social/safeShare/\d([a-zA-Z]+)?"> |
|
|
|
<div id="new" class="new new-collapse"> |
|
|
|
<form action="new" method="post"> |
|
|
|
<div class="form-group qbox"> |
|
|
|
<h4>自荐提名</h4> |
|
|
|
<textarea class="form-control" name="text" rows="5" maxlength="400" placeholder="一段简单的自我陈述,向大家展示普通的自己。鼓励写写自己未被计入主流评价体系的闪光点,或是独特的经历与坚持。" required="required"></textarea> |
|
|
|
<hr/> |
|
|
|
<textarea class="form-control" name="privateText" rows="3" maxlength="400" placeholder="可以在这里写一些不想被公开的内容,只有评委们能看到。如果你希望留下联系方式,也可以写在这里。"></textarea> |
|
|
|
<hr/> |
|
|
|
<div class="form-group row"> |
|
|
|
<label for="url" class="col-sm-3 col-form-label">补充材料(可选)</label> |
|
|
|
<div class="col-sm-9"> |
|
|
|
<input type="url" class="form-control" id="url" name="url" placeholder="清华云盘链接或safeShare链接,以https://开头" pattern="https://(cloud\.tsinghua\.edu\.cn/f/[0-9a-z]+/(\?dl=1)?)|(closed\.social/safeShare/\d([a-zA-Z]+)?)"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{% for v in vs %} |
|
|
|
<div class="form-group row"> |
|
|
|
<label for="{{v.name}}" class="col-sm-4 col-form-label">{{v.ques}}</label> |
|
|
|
<div class="col-sm-8"> |
|
|
|
<input type="text" class="form-control" id="{{v.name}}" name="{{v.name}}" placeholder="{{v.hint}}"> |
|
|
|
<hr/> |
|
|
|
{% for v in vs %} |
|
|
|
<div class="form-group row"> |
|
|
|
<label for="{{v.name}}" class="col-sm-4 col-form-label">{{v.ques}}</label> |
|
|
|
<div class="col-sm-8"> |
|
|
|
<input type="text" class="form-control" id="{{v.name}}" name="{{v.name}}" placeholder="{{v.hint}}"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{% endfor %} |
|
|
|
<button type="submit" class="btn btn-primary">报名!</button> |
|
|
|
</div> |
|
|
|
{% endfor %} |
|
|
|
<button type="submit" class="btn btn-primary">报名!</button> |
|
|
|
</form> |
|
|
|
|
|
|
|
<div style="font-size:80%"> |
|
|
|
<p>提示:</p> |
|
|
|
<ol> |
|
|
|
<li>初选报名不需要登陆任何帐号,你可以留下联系方式或可验证身份的信息(如公钥/数字签名),也可以不留。</li> |
|
|
|
<li>如果需要附上补充材料,请使用清华云盘。为了避免泄露姓名推荐使用<a href="/safeShare" target="_blank">safeShare</a>,我们不接受其他云盘。</li> |
|
|
|
<li>下方的评论来自闭社用户。如需删除自己发布的介绍请让任意一位工作人员评论“删除”。</li> |
|
|
|
<li>需要回答几个简单的问题以初步验证清华身份。入围后需要用清华邮箱注册闭社以正式验证清华身份。</li> |
|
|
|
<li>建议在电脑上操作以免丢失未保存的内容。如果出错(例如验证问题答错了),请回退,多数浏览器都会恢复之前填写的内容。</li> |
|
|
|
</ol> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<a href="##" onclick="showNew()" style="display:block"> |
|
|
|
<div class="show-button"> |
|
|
|
展开<span style="display: inline-flex; align-items: center;animation: downn 2s infinite;"><svg class="Zi Zi--ArrowDown ContentItem-arrowIcon" fill="currentColor" viewBox="0 0 24 24" width="24" height="24"><path d="M12 13L8.285 9.218a.758.758 0 0 0-1.064 0 .738.738 0 0 0 0 1.052l4.249 4.512a.758.758 0 0 0 1.064 0l4.246-4.512a.738.738 0 0 0 0-1.052.757.757 0 0 0-1.063 0L12.002 13z" fill-rule="evenodd"></path></svg></span> |
|
|
|
</div> |
|
|
|
</form> |
|
|
|
</a> |
|
|
|
|
|
|
|
<div style="font-size:80%"> |
|
|
|
<p>提示:</p> |
|
|
|
<ol> |
|
|
|
<li>初选报名不需要登陆任何帐号,你可以留下联系方式或可验证身份的信息(如公钥/数字签名),也可以不留。</li> |
|
|
|
<li>如果需要附上补充材料,请使用清华云盘。为了避免泄露姓名请使用<a href="/safeShare" target="_blank">safeShare</a>,我们不接受其他云盘。</li> |
|
|
|
<li>下方的评论来自闭社用户。如需删除自己发布的介绍请让任意一位工作人员评论“删除”。</li> |
|
|
|
<li>需要回答几个简单的问题以初步验证清华身份。入围后需要用清华邮箱注册闭社以正式验证清华身份。</li> |
|
|
|
<li>建议在电脑上操作以免丢失未保存的内容。如果出错(例如验证问题答错了),请回退,多数浏览器都会恢复之前填写的内容。</li> |
|
|
|
</ol> |
|
|
|
<script> |
|
|
|
function showNew() { |
|
|
|
$('#new').removeClass('new-collapse'); |
|
|
|
$('.show-button').hide(); |
|
|
|
} |
|
|
|
</script> |
|
|
|
<br/> |
|
|
|
<br/> |
|
|
|
<h3>已有的报名</h3> |
|
|
|
|
|
|
|
{% for c in cans %} |
|
|
|
<div class="qbox"> |
|
|
|
<pre class="inner">{{c.content}}</pre> |
|
|
|
{% if c.url %} |
|
|
|
<p class="inner"><a href="{{c.url}}" target="_black">补充材料</a></p> |
|
|
|
{% endif %} |
|
|
|
<div style="text-align:right"> |
|
|
|
<time class="timeago" datetime="{{c.time}}"></time> |
|
|
|
<a class="btn btn-link request-answer" data-toggle="collapse" href="#collapse-{{c.toot}}" role="button" aria-expanded="false" aria-controls="collapse-{{c.toot}}"> |
|
|
|
查看评论 |
|
|
|
<span><svg fill="#007bff" viewBox="0 0 24 24" width="24" height="24" ><path d="M12 13L8.285 9.218a.758.758 0 0 0-1.064 0 .738.738 0 0 0 0 1.052l4.249 4.512a.758.758 0 0 0 1.064 0l4.246-4.512a.738.738 0 0 0 0-1.052.757.757 0 0 0-1.063 0L12.002 13z" style="animation: downn 1.5s infinite;"></path></svg></span> |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
<div class="collapse" id="collapse-{{c.toot}}"> |
|
|
|
<div class="card card-body"> |
|
|
|
加载中... |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<hr/> |
|
|
|
<h3>已有的报名</h3> |
|
|
|
|
|
|
|
{% for c in cans %} |
|
|
|
<div class="qbox"> |
|
|
|
<pre class="inner">{{c.content}}</pre> |
|
|
|
{% if c.url %} |
|
|
|
<p class="inner"><a href="{{c.url}}" target="_black">补充材料</a></p> |
|
|
|
{% endif %} |
|
|
|
<div style="text-align:right"> |
|
|
|
<time class="timeago" datetime="{{c.time}}"></time> |
|
|
|
<a class="btn btn-link request-answer" data-toggle="collapse" href="#collapse-{{c.toot}}" role="button" aria-expanded="false" aria-controls="collapse-{{c.toot}}"> |
|
|
|
查看评论 |
|
|
|
<span><svg fill="#007bff" viewBox="0 0 24 24" width="24" height="24" ><path d="M12 13L8.285 9.218a.758.758 0 0 0-1.064 0 .738.738 0 0 0 0 1.052l4.249 4.512a.758.758 0 0 0 1.064 0l4.246-4.512a.738.738 0 0 0 0-1.052.757.757 0 0 0-1.063 0L12.002 13z" style="animation: downn 1.5s infinite;"></path></svg></span> |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
<div class="collapse" id="collapse-{{c.toot}}"> |
|
|
|
<div class="card card-body"> |
|
|
|
加载中... |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{% endfor %} |
|
|
|
|
|
|
|
<script> |
|
|
|
$('.timeago').timeago(); |
|
|
|
$('.collapse').on('show.bs.collapse', (e) => { |
|
|
|
let self = e.target; |
|
|
|
let toot = self.id.split('-')[1]; |
|
|
|
$.ajax({ |
|
|
|
type:'GET', |
|
|
|
url:toot, |
|
|
|
success:(result,status,xhr) => { |
|
|
|
console.log(result+' : '+status); |
|
|
|
if(result.replies.length) { |
|
|
|
$(self).empty(); |
|
|
|
result.replies.forEach((rp) => { |
|
|
|
$(self).append(`<div class="card card-body"><p class="display_name"><a href="${rp.url}">${rp.disp}</a>:</p><pre>${rp.content}</pre><time class="timeago" datetime="${rp.time}"></time></div>`) |
|
|
|
}); |
|
|
|
console.log($(self).find('.timeago')); |
|
|
|
$(self).find('.timeago').timeago(); |
|
|
|
}else { |
|
|
|
$(self).empty(); |
|
|
|
$(self).append(`<div class="card card-body">(暂无回复)</div>`) |
|
|
|
} |
|
|
|
}, |
|
|
|
error:(xhr,status,error) => { |
|
|
|
console.log(error, status, xhr.status, xhr.responseText); |
|
|
|
$(self).empty(); |
|
|
|
$(self).append(`<div class="card card-body"><p style="color:red">${xhr.status} ${xhr.responseText}</p></div>`); |
|
|
|
if(xhr.status == 404) |
|
|
|
setTimeout(()=>{$(self).parent().remove()}, 3000); |
|
|
|
} |
|
|
|
}); |
|
|
|
{% endfor %} |
|
|
|
|
|
|
|
<script> |
|
|
|
$('.timeago').timeago(); |
|
|
|
$('.collapse').on('show.bs.collapse', (e) => { |
|
|
|
let self = e.target; |
|
|
|
let toot = self.id.split('-')[1]; |
|
|
|
$.ajax({ |
|
|
|
type:'GET', |
|
|
|
url:toot, |
|
|
|
success:(result,status,xhr) => { |
|
|
|
console.log(result+' : '+status); |
|
|
|
if(result.replies.length) { |
|
|
|
$(self).empty(); |
|
|
|
result.replies.forEach((rp) => { |
|
|
|
$(self).append(`<div class="card card-body"><p class="display_name"><a href="${rp.url}">${rp.disp}</a>:</p><pre>${rp.content}</pre><time class="timeago" datetime="${rp.time}"></time></div>`) |
|
|
|
}); |
|
|
|
</script> |
|
|
|
console.log($(self).find('.timeago')); |
|
|
|
$(self).find('.timeago').timeago(); |
|
|
|
}else { |
|
|
|
$(self).empty(); |
|
|
|
$(self).append(`<div class="card card-body">(暂无评论)</div>`) |
|
|
|
} |
|
|
|
}, |
|
|
|
error:(xhr,status,error) => { |
|
|
|
console.log(error, status, xhr.status, xhr.responseText); |
|
|
|
$(self).empty(); |
|
|
|
$(self).append(`<div class="card card-body"><p style="color:red">${xhr.status} ${xhr.responseText}</p></div>`); |
|
|
|
if(xhr.status == 404) |
|
|
|
setTimeout(()=>{$(self).parent().remove()}, 3000); |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
</script> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</body> |
|
|
|
</body> |
|
|
|
</html> |