|
|
|
|
@ -1,6 +1,6 @@
|
|
|
|
|
<template> |
|
|
|
|
<div v-wechat-title="basic.title + ' - ' +$route.meta.title"></div> |
|
|
|
|
<div class="w1200"> |
|
|
|
|
<div class="w1200 m-pd20"> |
|
|
|
|
|
|
|
|
|
<div style="padding: 50px 0 150px;" v-if="empty===-1"> |
|
|
|
|
<el-empty :image-size="150" :description="msg"></el-empty> |
|
|
|
|
@ -36,7 +36,7 @@
|
|
|
|
|
|
|
|
|
|
<template #default> |
|
|
|
|
<div class="rtinfo"> |
|
|
|
|
<h2 class="til">{{basic.title}}<i>直播课</i></h2> |
|
|
|
|
<h2 class="til hide-txt2">{{basic.title}}<i>直播课</i></h2> |
|
|
|
|
<ul class="ulinfo flex-2"> |
|
|
|
|
<li>直播时间：{{basic.start_time}}</li> |
|
|
|
|
<li>报名人数：{{basic.number_people}}人</li> |
|
|
|
|
@ -133,8 +133,7 @@
|
|
|
|
|
<el-popover placement="top" :width="300" trigger="click"> |
|
|
|
|
<p style="padding: 12px 0 16px; text-align: center;" class="f14">您还未登录哦~~登录后再报名吧！</p> |
|
|
|
|
<div style="text-align: center; padding: 14px 0;"> |
|
|
|
|
<a :href="com_login_url" |
|
|
|
|
class="el-btn medium">立即登录</a> |
|
|
|
|
<a :href="com_login_url" class="el-btn medium">立即登录</a> |
|
|
|
|
</div> |
|
|
|
|
<template #reference> |
|
|
|
|
<a href="javascript:;" class="plbtn">立即报名</a> |
|
|
|
|
@ -169,7 +168,7 @@
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<!-- 右侧 --> |
|
|
|
|
<div class="rt-box"> |
|
|
|
|
<div class="rt-box m-dn"> |
|
|
|
|
<div class="rtbox"> |
|
|
|
|
<h2>活动组织者</h2> |
|
|
|
|
<ul class="bbom" style="line-height: 32px;"> |
|
|
|
|
@ -1159,13 +1158,164 @@
|
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
|
|
/*响应式-移动端*/ |
|
|
|
|
@import '~@/assets/css/m.css'; |
|
|
|
|
|
|
|
|
|
@media screen and (max-width: 1200px) { |
|
|
|
|
|
|
|
|
|
.basic { |
|
|
|
|
display: flex; |
|
|
|
|
margin: 24px 0 24px; |
|
|
|
|
height: auto !important; |
|
|
|
|
background-color: #F3F8FF; |
|
|
|
|
border-radius: 16px; |
|
|
|
|
|
|
|
|
|
.lfinfo { |
|
|
|
|
width: 47% !important; |
|
|
|
|
height: 240px !important; |
|
|
|
|
|
|
|
|
|
.img { |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
border-radius: 16px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.rtinfo { |
|
|
|
|
width: 53% !important; |
|
|
|
|
padding: 14px 24px 14px 24px !important; |
|
|
|
|
line-height: 1; |
|
|
|
|
|
|
|
|
|
.til { |
|
|
|
|
font-size: 16px !important; |
|
|
|
|
line-height: 24px !important; |
|
|
|
|
padding-bottom: 0 !important; |
|
|
|
|
margin-bottom: 12px; |
|
|
|
|
|
|
|
|
|
i { |
|
|
|
|
display: inline-block; |
|
|
|
|
vertical-align: middle; |
|
|
|
|
margin-left: 8px; |
|
|
|
|
color: #fff; |
|
|
|
|
font-size: 12px; |
|
|
|
|
padding: 0 10px; |
|
|
|
|
width: 56px; |
|
|
|
|
height: 20px !important; |
|
|
|
|
line-height: 20px !important; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
background: linear-gradient(270deg, #FF7C6B 0%, #FF4B72 100%); |
|
|
|
|
border-radius: 12px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.ulinfo { |
|
|
|
|
|
|
|
|
|
li { |
|
|
|
|
padding-bottom: 10px !important; |
|
|
|
|
font-size: 14px !important; |
|
|
|
|
color: #808696; |
|
|
|
|
|
|
|
|
|
.fxweixin { |
|
|
|
|
display: none; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.dateFormat { |
|
|
|
|
&.f16 { |
|
|
|
|
font-size: 14px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.f20 { |
|
|
|
|
font-size: 16px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&.nopb { |
|
|
|
|
padding-bottom: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&.price { |
|
|
|
|
.saleprice { |
|
|
|
|
font-size: 32px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
del { |
|
|
|
|
margin-left: 8px; |
|
|
|
|
color: #B3C1D3; |
|
|
|
|
font-size: 18px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.free { |
|
|
|
|
font-size: 24px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.fxweixin { |
|
|
|
|
cursor: pointer; |
|
|
|
|
margin-left: 14px; |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
color: #28C346; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.fxurl { |
|
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
color: #409EFF; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.plbtn { |
|
|
|
|
letter-spacing: 4px; |
|
|
|
|
margin-top: 0px !important; |
|
|
|
|
display: block; |
|
|
|
|
color: #fff; |
|
|
|
|
text-align: center; |
|
|
|
|
font-size: 16px !important; |
|
|
|
|
width: 80% !important; |
|
|
|
|
height: 40px !important; |
|
|
|
|
line-height: 40px !important; |
|
|
|
|
background: linear-gradient(270deg, #FF7C6B 0%, #FF4B72 100%); |
|
|
|
|
border-radius: 8px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.plbtn2 { |
|
|
|
|
letter-spacing: 4px; |
|
|
|
|
margin-top: 6px; |
|
|
|
|
display: block; |
|
|
|
|
text-align: center; |
|
|
|
|
font-size: 20px; |
|
|
|
|
width: 360px; |
|
|
|
|
height: 58px; |
|
|
|
|
line-height: 58px; |
|
|
|
|
background: #D2DCE7; |
|
|
|
|
color: #7E8FA3; |
|
|
|
|
border-radius: 8px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
|
|
.sign-form-ok { |
|
|
|
|
width: 500px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/*响应式-移动端*/ |
|
|
|
|
@media screen and (max-width: 500px) { |
|
|
|
|
@media screen and (max-width: 650px) { |
|
|
|
|
.w1200 { |
|
|
|
|
width: 100%; |
|
|
|
|
padding: 0 12px; |
|
|
|
|
@ -1325,10 +1475,10 @@
|
|
|
|
|
.plbtn2 { |
|
|
|
|
display: block; |
|
|
|
|
margin: 6px auto 10px auto; |
|
|
|
|
font-size: 18px !important; |
|
|
|
|
font-size: 16px !important; |
|
|
|
|
width: 100% !important; |
|
|
|
|
height: 48px !important; |
|
|
|
|
line-height: 48px !important; |
|
|
|
|
height: 42px !important; |
|
|
|
|
line-height: 42px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
