You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
456 lines
15 KiB
456 lines
15 KiB
<!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">
|
|
<link rel="icon" type="image/png" href="/img/ord/icon-128.png" />
|
|
<link href="https://fonts.yecdn.com/css2?family=Noto+Serif+SC:wght@300;700&display=swap" rel="stylesheet">
|
|
<link href="https://fonts.yecdn.com/css2?family=Noto+Sans+SC&display=swap" rel="stylesheet">
|
|
<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">
|
|
<title>华清大学特普通奖 报名页面</title>
|
|
<style>
|
|
body,
|
|
pre {
|
|
font-family: 'Noto Sans SC', sans-serif;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6,
|
|
.sort-by{
|
|
font-family: 'Noto Serif SC', serif;
|
|
font-weight: 300;
|
|
}
|
|
|
|
.sort-by b {
|
|
font-weight: 700;
|
|
}
|
|
|
|
a,
|
|
a:hover,
|
|
.btn-link,
|
|
.btn-link:hover {
|
|
color: inherit;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
nav .page-link {
|
|
color: #000;
|
|
}
|
|
|
|
nav .page-item.active .page-link {
|
|
background-color: #000;
|
|
border-color: #000;
|
|
}
|
|
|
|
.btn-lg {
|
|
font-size: 2em;
|
|
font-family: 'Noto Serif SC', serif;
|
|
}
|
|
|
|
.part1 {
|
|
max-width: 500px;
|
|
float: left;
|
|
padding-right: 10px;
|
|
position: relative;
|
|
}
|
|
|
|
.part2 {
|
|
min-width: 200px;
|
|
overflow: hidden;
|
|
padding-left: 25px;
|
|
}
|
|
|
|
.qbox {
|
|
border: 2px black solid;
|
|
background: white;
|
|
padding: 5px;
|
|
color: black;
|
|
margin: 5px 5px 40px;
|
|
}
|
|
|
|
.new .qbox {
|
|
background: black;
|
|
color: white;
|
|
}
|
|
|
|
.judge .qbox {
|
|
background: white;
|
|
color: black;
|
|
padding: 5px 15px;
|
|
}
|
|
|
|
.twin.new .qbox input,
|
|
.twin.new .qbox textarea {
|
|
border-bottom: 2px solid;
|
|
background: black;
|
|
color: white;
|
|
}
|
|
|
|
.twin .qbox input,
|
|
.twin .qbox textarea {
|
|
border: none;
|
|
border-bottom: 1px solid;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.qbox .inner {
|
|
margin: 15px 0 20px 15px;
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
.like {
|
|
fill: #fff;
|
|
}
|
|
|
|
.liked {
|
|
fill: #000;
|
|
}
|
|
|
|
.timeago {
|
|
font-size: 0.5em;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.display_name {
|
|
margin: 0;
|
|
}
|
|
|
|
.card-body {
|
|
padding: 0.75em;
|
|
}
|
|
|
|
.behind {
|
|
z-index: 98;
|
|
cursor: pointer;
|
|
transform: translateY(5px) scale(0.98);
|
|
transform-origin: top;
|
|
transition-property: transform;
|
|
transition-duration: 0.5s;
|
|
}
|
|
|
|
.front {
|
|
z-index: 99;
|
|
transition-property: transform;
|
|
transition-duration: 0.5s;
|
|
}
|
|
|
|
.judge {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
margin: 0 0 30px 20px;
|
|
width: 90%;
|
|
}
|
|
.twin {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.new {
|
|
position: relative;
|
|
margin: 30px 20px 30px 0;
|
|
}
|
|
|
|
.twin-collapse {
|
|
max-height: 360px;
|
|
}
|
|
|
|
.show-mask {
|
|
display: block;
|
|
position: absolute;
|
|
top: 20px;
|
|
right: 35px;
|
|
text-align: center;
|
|
padding-top: 330px;
|
|
width: 100%;
|
|
z-index: 999;
|
|
}
|
|
|
|
.footer {
|
|
background: black;
|
|
color: white;
|
|
text-align: center;
|
|
font-size: 80%;
|
|
border-top: solid 1px white;
|
|
}
|
|
|
|
.footer p {
|
|
margin: 10px 0 0;
|
|
float: bottom;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body style="background: #fff url('/img/ord/bg.jpg') repeat-x fixed center top / 650px">
|
|
<div class="container" style="overflow: hidden;min-height: 100vh">
|
|
<div style='padding:15px'>
|
|
<img src="/img/ord/logo.png" width="200px" />
|
|
</div>
|
|
|
|
<div class="part1">
|
|
|
|
<div id="new" class="new twin-collapse twin front">
|
|
<form action="new" method="post">
|
|
<div class="form-group qbox">
|
|
<h1 style="margin: -14px -13px 20px">自荐提名</h1>
|
|
<textarea class="form-control" name="text" rows="5" maxlength="4000" placeholder="
|
|
一段自我陈述，
|
|
向大家展示普通的自己。" required="required"></textarea>
|
|
<hr />
|
|
<textarea class="form-control" name="privateText" rows="4" maxlength="1000" 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>
|
|
<hr />
|
|
<hr />
|
|
{% for v in vs %}
|
|
<div class="form-group row">
|
|
<label for="{{v.name}}" class="col-sm-8 col-form-label">{{v.ques}}</label>
|
|
<div class="col-sm-4">
|
|
<input type="text" class="form-control" name="{{v.name}}" placeholder="{{v.hint}}" required="required">
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
<button type="submit" class="btn btn-link btn-lg">报名</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div style="font-size:80%;">
|
|
<ul>
|
|
<li>如需附上补充材料，请使用清华云盘。为了避免泄露姓名推荐使用<a href="/safeShare" target="_blank">safeShare</a>。其他云盘是不被接受的。</li>
|
|
<li>需要回答几个简单的问题以初步验证学生身份，入围后的线上答辩环节将于<a href="https://thu.closed.social/">闭社</a>平台进行（需清华邮箱注册）以正式验证身份。</li>
|
|
<li>如果出错（例如验证问题答错了），请回退，多数浏览器都会恢复之前填写的内容。</li>
|
|
<li>获得五个赞并留下联系方式（如微信号、手机号或邮箱）者被视为正式提名，会有工作人员与之联系并发放奖品。</li>
|
|
<li>点击倒三角按钮展开评论，发布评论请前往<a href="https://thu.closed.social/">闭社</a>。</li>
|
|
<li>如需删除报名，请联系工作人员（微信:ordinary_thuer）。</li>
|
|
</ul>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="judge twin-collapse twin behind">
|
|
<form action="judge" method="post">
|
|
<div class="form-group qbox">
|
|
<h1 style="text-align:right;margin:-12px -20px 20px">成为评委</h1>
|
|
<div style="font-size:80%">
|
|
<p>为了更好地选出十位普通人的代表，为了更好地展现大众的声音，我们希望招募更多的评委。</p>
|
|
<p>成为评委的条件：</p>
|
|
<ul>
|
|
<li>是华清大学在读学生</li>
|
|
<li>没有报名参选</li>
|
|
<li>愿意对报名者进行评分</li>
|
|
</ul>
|
|
<p>我们原则上不拒绝任何的评委报名。</p>
|
|
<p>目前在三个平台上建了三个评委群，分别是闭聊(Matrix)，Telegram，微信。前两个消息自动同步，加入哪个都是等价的，微信群与另外两个群不连通。(注意Telegram墙内不可直接访问。闭聊由闭社提供，使用闭社帐号登陆，如使用其他服务器上的Matrix帐号加群需要验证华清身份。)</p>
|
|
<p>选择想加入的群，完成验证，进入评委群。如果不愿意加群，也可以私信主办方保持沟通和上传打分结果。</p>
|
|
</div>
|
|
|
|
<div style="text-align:center">
|
|
<div class="form-check form-check-inline">
|
|
<input class="form-check-input" type="radio" name="groupType" value="mx" required>
|
|
<label class="form-check-label" for="mx">闭聊</label>
|
|
</div>
|
|
<div class="form-check form-check-inline">
|
|
<input class="form-check-input" type="radio" name="groupType" value="tg" required>
|
|
<label class="form-check-label" for="tg">Telegram</label>
|
|
</div>
|
|
<div class="form-check form-check-inline">
|
|
<input class="form-check-input" type="radio" name="groupType" value="wx" required>
|
|
<label class="form-check-label" for="wx">微信</label>
|
|
</div>
|
|
</div>
|
|
<hr/>
|
|
{% for v in vs %}
|
|
<div class="form-group row">
|
|
<label for="{{v.name}}" class="col-sm-8 col-form-label">{{v.ques}}</label>
|
|
<div class="col-sm-4">
|
|
<input type="text" class="form-control" name="{{v.name}}" placeholder="{{v.hint}}" required="required">
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
<button type="submit" class="btn btn-link btn-lg">进群</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<a href="##" onclick="showNew()" class="show-mask">
|
|
<span>
|
|
<svg fill="#fff" viewBox="0 12 24 48" width="24">
|
|
<path d="m0 24 l12 18 l12 -18 z"></path>
|
|
</svg>
|
|
</span>
|
|
</a>
|
|
|
|
|
|
<script>
|
|
function showNew() {
|
|
$('.twin').removeClass('twin-collapse');
|
|
$('.show-mask').hide();
|
|
}
|
|
</script>
|
|
|
|
</div>
|
|
|
|
<div class="part2" id="part2">
|
|
<div style="display:flex;justify-content:space-between;align-items: flex-end">
|
|
<h1>已有报名</h1>
|
|
<span style="margin:8px" class="sort-by">
|
|
{% if sort_by == 'likeNum' %}
|
|
<a href="?sort_by=time#part2">按时间</a> | <b>按赞数</b>
|
|
{% else %}
|
|
<b>按时间</b> | <a href="?sort_by=likeNum#part2">按赞数</a>
|
|
{% endif %}
|
|
</span>
|
|
</div>
|
|
{% for c in pagination.items %}
|
|
<div class="qbox">
|
|
<small>No. {{c.id}}</small>
|
|
<pre class="inner">{{c.content}}</pre>
|
|
{% if showPrivate %}
|
|
<hr />
|
|
<pre class="inner">{{c.private}}</pre>
|
|
<hr />
|
|
{% endif %}
|
|
{% if c.url %}
|
|
<p class="inner"><a href="{{c.url}}" target="_black">补充材料</a></p>
|
|
{% endif %}
|
|
<div style="text-align:right;margin: 27px 0 -5px">
|
|
<time class="timeago" datetime="{{c.time}}"></time>
|
|
<a href="##" class="btn btn-link" id="like-{{c.toot}}" onClick="like('{{c.toot}}')" style="text-decoration: none;">
|
|
<svg viewBox="-20 0 552 512" height="16" class="{{c.liked}}">
|
|
<path stroke="#000" stroke-width="30" d="M474.644,74.27C449.391,45.616,414.358,29.836,376,29.836c-53.948,0-88.103,32.22-107.255,59.25
|
|
c-4.969,7.014-9.196,14.047-12.745,20.665c-3.549-6.618-7.775-13.651-12.745-20.665c-19.152-27.03-53.307-59.25-107.255-59.25
|
|
c-38.358,0-73.391,15.781-98.645,44.435C13.267,101.605,0,138.213,0,177.351c0,42.603,16.633,82.228,52.345,124.7
|
|
c31.917,37.96,77.834,77.088,131.005,122.397c19.813,16.884,40.302,34.344,62.115,53.429l0.655,0.574
|
|
c2.828,2.476,6.354,3.713,9.88,3.713s7.052-1.238,9.88-3.713l0.655-0.574c21.813-19.085,42.302-36.544,62.118-53.431
|
|
c53.168-45.306,99.085-84.434,131.002-122.395C495.367,259.578,512,219.954,512,177.351
|
|
C512,138.213,498.733,101.605,474.644,74.27z" />
|
|
</svg>
|
|
<span>
|
|
{{c.likeNum}}
|
|
</span>
|
|
</a>
|
|
<a class="btn btn-link request-answer" data-toggle="collapse" href="#collapse-{{c.toot}}" role="button" aria-expanded="false" aria-controls="collapse-{{c.toot}}">
|
|
<svg fill="#000" viewBox="0 24 24 20" height="16">
|
|
<path d="m0 24 l12 18 l12 -18 z"></path>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
<div class="collapse" id="collapse-{{c.toot}}">
|
|
<div class="card card-body">
|
|
加载中...
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<nav>
|
|
<ul class="pagination">
|
|
{%- for page in pagination.iter_pages() %}
|
|
{% if page %}
|
|
{% if page != pagination.page %}
|
|
<li class="page-item"><a class="page-link" href="{{ url_for('can_list', page=page, per_page=pagination.per_page, key=key, sort_by=sort_by) }}">{{ page }}</a></li>
|
|
{% else %}
|
|
<li class="page-item active">
|
|
<a class="page-link" href="#">{{ page }}<span class="sr-only">(current)</span></a>
|
|
</li>
|
|
{% endif %}
|
|
{% else %}
|
|
<li class="page-item"><span class=ellipsis>…</span></li>
|
|
{% endif %}
|
|
{%- endfor %}
|
|
</ul>
|
|
</nav>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div class="footer">
|
|
<p>
|
|
由<a href="//closed.social" target="_blank">闭社</a>提供技术支持
|
|
</p>
|
|
<p> 🄯 2020 Copyleft: closed.social</p>
|
|
</div>
|
|
</body>
|
|
|
|
<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>
|
|
|
|
<script>
|
|
function like(toot) {
|
|
if ($(`#like-${toot} svg`).hasClass("liked")) {
|
|
alert('赞都赞了，别撤回嘛');
|
|
return;
|
|
}
|
|
$.ajax({
|
|
type: 'POST',
|
|
url: toot + '/like',
|
|
success: (result, status, xhr) => {
|
|
console.log(result + ' : ' + status);
|
|
$(`#like-${toot} span`).text(result);
|
|
$(`#like-${toot} svg`).toggleClass("like liked");
|
|
},
|
|
error: (xhr, status, error) => {
|
|
alert(error + ': ' + xhr.responseText);
|
|
}
|
|
});
|
|
}
|
|
|
|
$(document).ready(function(){
|
|
$('.timeago').timeago();
|
|
|
|
$('.twin').click((e) => {
|
|
if($(e.currentTarget).hasClass('front'))
|
|
return;
|
|
let behind_box = $('.behind');
|
|
let front_box = $('.front');
|
|
behind_box.toggleClass('behind front');
|
|
front_box.toggleClass('front behind');
|
|
});
|
|
|
|
$('.collapse').on('show.bs.collapse', (e) => {
|
|
let self = e.target;
|
|
let toot = self.id.split('-')[1];
|
|
$.ajax({
|
|
type: 'GET',
|
|
url: toot + '/comments',
|
|
success: (result, status, xhr) => {
|
|
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 class="inner">${rp.content}</pre><time class="timeago" datetime="${rp.time}"></time></div>`)
|
|
});
|
|
$(self).find('.timeago').timeago();
|
|
} else {
|
|
$(self).empty();
|
|
$(self).append(`<div class="card card-body"><p>(暂无评论) <sub><a target="_blank" href="{{base_toot_url}}${toot}">发表第一条评论</sub></p></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>
|
|
|
|
</html>
|