wally
/
plugin-templete
1
0
Fork 1
Code Issues Releases Wiki Activity
Browse Source

学员报名页面

tiaosheng-xy-bm
jarvis 4 years ago
parent
7f30a51e9a
commit
eaba80ab16
1 changed files with 110 additions and 20 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 130
      index.html

130
index.html
View File

@ -28,7 +28,7 @@
<div class="h-6 bg-gray-100"></div>
</div>
</div>
<div class="task-bar h-96 w-full bg-gray-100 p-4">
<div class="task-bar h-96 w-full bg-gray-100">
<div class="flex mb-3">
<!-- <div class="flex flex-col items-center">
<div class="rounded-full h-8 w-8 mb-1 bg-gray-100 border-2 border-blue-500"></div>
@ -37,35 +37,108 @@
</div>
</div> -->
<div class="flex-1" style="height: 10rem;">
<div class="rounded-lg bg-white p-3" style="height: 100%;">
<div class="flex-1" style="height: 50rem;">
<div class="rounded-lg" style="height: 100%;">
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="alert('hello')">测试组建1</button>
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button>
<div data-tname="考勤" data-pid="1433332016270811136" data-uid="1217647686598135808" data-rid="rid333" data-tid="tid444" data-did="did555" style="height:50px;width:100%">
<div data-root="p1432643387798069248" style="height:100%;width:100%;">
<div class="title"></div>
<div class="flex justify-between mt-4">
<div class="text-sm">培训报名</div>
<div>
<button class="nightClockBtn text-xs rounded-md py-1 px-3">报名失败</button>
<button class="nightClockBtn bg-blue-500 text-xs rounded-md py-1 px-3 text-white" onclick="apply()">报名</button>
<form action="">
<div class="h-12 pl-4 text-sm" style="line-height: 3rem;color: #595959;">个人基本信息</div>
<div class="bg-white pl-4 pr-4">
<div>
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">姓名<span class="text-red-500 ml-1 align-middle">*</span></label>
<input class="text-sm text-right outline-none" id="name" type="text" placeholder="请输入您的姓名">
</div>
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">身份证号<span class="text-red-500 ml-1 align-middle">*</span></label>
<input class="text-sm text-right outline-none" id="idNumber" type="text" placeholder="请输入您的身份证号">
</div>
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">年龄</label>
<input class="text-sm text-right outline-none" id="age" value="age" type="number" placeholder="请输入您的年龄">
</div>
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">性别</label>
<div>
<input class="text-sm" type="radio" name="gender" value="woman"> 女
<input class="text-sm" type="radio" name="gender" value="man"> 男
</div>
</div>
</div>
<div class="flex justify-between items-center h-12 pl-8 pr-8">
<label class="text-sm text-gray-400" border-b>身份</label>
<div class="flex flex-nowrap rounded-md startBtnBox">
<div class="startBtn text-sm">跳绳爱好者</div>
<div class="flex flex-nowrap ml-4">
<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" />
</div>
</div>
</div>
</div>
</div>
<div class="border-2 w-full mt-2.5 flex justify-between p-2 text-sm">
<p style="color: #999999;">山西跳协**培训红头文件</p>
<button class="text-xs text-blue-400 border border-blue-400 rounded-full w-10 h-5">查看</button>
</div>
<div class="h-12 pl-4 text-sm" style="line-height: 3rem;color: #595959;">联系方式</div>
<div class="bg-white pl-4 pr-4">
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">地址</label>
<input class="text-sm text-right outline-none" id="address" type="text" placeholder="请输入您的详细地址">
</div>
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">电话<span class="text-red-500 ml-1 align-middle">*</span></label>
<input class="text-sm text-right outline-none" id="phone" type="text" placeholder="请输入您的电话">
</div>
</div>
<div class="h-12 pl-4 text-sm" style="line-height: 3rem;color: #595959;">培训信息</div>
<div class="bg-white pl-4 pr-4">
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">培训目标<span class="text-red-500 ml-1 align-middle">*</span></label>
<div class="flex flex-nowrap rounded-md startBtnBox">
<div class="startBtn text-sm">裁判员</div>
<div class="flex flex-nowrap ml-4">
<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" />
</div>
</div>
</div>
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">培训项目<span class="text-red-500 ml-1 align-middle">*</span></label>
<div class="flex flex-nowrap rounded-md startBtnBox">
<div class="startBtn text-sm text-gray-400">请选择培训项目</div>
<div class="flex flex-nowrap ml-4">
<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" />
</div>
</div>
</div>
</div>
<!-- <div class="bg-white pl-4 pr-4">
<div class="flex justify-between items-center h-12 pl-8 pr-8 border-b">
<label class="text-sm text-gray-400">选择支付方式</label>
<div class="flex flex-nowrap rounded-md startBtnBox">
<div class="flex flex-nowrap ml-4" onclick="p1432643387798069248.jumpDetails(this)">
<img style="width:15px" src="https://www.tall.wiki/staticrec/icon/right.svg" />
</div>
</div>
</div>
<div class="paymentDocument pl-8">
<p class="text-sm text-gray-400">上传支付凭证（仅支持jpg格式）</p>
<div class="uploadJpg bg-gray-100 border-dashed border-gray-900">
</div>
</div>
</div> -->
<div class="apply pl-8 pr-8">
<button class="bg-blue-500 text-white text-base apply-btn" onclick="immediatelyApply()">立即报名</button>
</div>
</form>
</div>
</div>
<script>
function apply(){
console.log(1);
window.location.href='./apply.html'
function immediatelyApply(){
console.log('立即报名');
}
// var p1432643387798069248 = {
// token: '',
// projectId: '',
@ -433,12 +506,12 @@
<!-- 示例插件2 id=100-->
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button>
<script>
const p100 = {
/* const p100 = {
name: 'hello tall plugin',
show() {
alert(this.name)
}
}
} */
</script>
</div>
</div>
@ -453,5 +526,22 @@
.content::-webkit-scrollbar, .task-bar::-webkit-scrollbar{
display: none;
}
.paymentDocument{
height: 10.25rem;
padding-top: .9375rem;
}
.uploadJpg{
width: 6.5rem;
height: 6.5rem;
margin-top: .8125rem;
}
.apply{
height: 2.5rem;
margin-top: 3.75rem;
}
.apply-btn{
width: 100%;
height: 100%;
}
</style>
</html>

Write Preview
Loading…
Cancel
Save