1
This commit is contained in:
hongqiwei
@@ -0,0 +1,309 @@
|
|||||||
|
<!--#
|
||||||
|
layout("/layouts/platform_h5.html"){
|
||||||
|
#-->
|
||||||
|
|
||||||
|
<div id="app" v-cloak>
|
||||||
|
<div class="featured-page">
|
||||||
|
<van-nav-bar
|
||||||
|
title="精彩活动"
|
||||||
|
left-text="返回"
|
||||||
|
left-arrow
|
||||||
|
fixed
|
||||||
|
placeholder
|
||||||
|
@click-left="goBack"
|
||||||
|
></van-nav-bar>
|
||||||
|
|
||||||
|
<div class="featured-banner">
|
||||||
|
<img :src="topImage" alt="">
|
||||||
|
<div class="featured-banner__shade"></div>
|
||||||
|
<div class="featured-banner__text">
|
||||||
|
<div class="featured-banner__title">精彩活动</div>
|
||||||
|
<div class="featured-banner__sub">发现更多校园工会活动</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="featured-list">
|
||||||
|
<template v-if="activityOptions && activityOptions.length > 0">
|
||||||
|
<div v-for="item in activityOptions" :key="item.id" class="act-item" @click="enterAct(item)">
|
||||||
|
<van-tag class="act-item-wrapper-tag" v-if="$moment().unix() > $moment(item.endDate).unix()">
|
||||||
|
已结束
|
||||||
|
</van-tag>
|
||||||
|
|
||||||
|
<van-tag class="act-item-wrapper-tag" type="success"
|
||||||
|
v-else-if="$moment().unix() > $moment(item.startDate).unix() && $moment().unix() < $moment(item.endDate).unix()">
|
||||||
|
进行中
|
||||||
|
</van-tag>
|
||||||
|
|
||||||
|
<van-tag class="act-item-wrapper-tag" type="success" v-else-if="$moment().unix() < $moment(item.startDate).unix()">
|
||||||
|
即将开始
|
||||||
|
</van-tag>
|
||||||
|
|
||||||
|
<div class="act-item-cover">
|
||||||
|
<van-image v-if="item.cover" width="120" height="84" :src="item.cover"></van-image>
|
||||||
|
</div>
|
||||||
|
<div class="act-item-wrapper">
|
||||||
|
<div class="content-title">{{ item.name }}</div>
|
||||||
|
<div class="content-text">
|
||||||
|
<div>开始时间：{{ $moment(item.startDate).format('MM-DD HH:mm') }}</div>
|
||||||
|
<div class="mt5">结束时间：{{ $moment(item.endDate).format('MM-DD HH:mm') }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<van-empty v-if="!activityOptions || activityOptions.length === 0" description="暂无精彩活动"></van-empty>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script nonce="${cspNonce!}">
|
||||||
|
new Vue({
|
||||||
|
el: "#app",
|
||||||
|
data: function () {
|
||||||
|
return {
|
||||||
|
topImage: "/assets/mobile/img/home/home1.png",
|
||||||
|
activityOptions: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 顶部导航返回入口，统一复用返回首页逻辑。
|
||||||
|
goBack: function () {
|
||||||
|
this.returnHome()
|
||||||
|
},
|
||||||
|
// 返回移动端首页并恢复首页 tab，PJAX 不可用时退回整页跳转。
|
||||||
|
returnHome: function () {
|
||||||
|
if (window.store && typeof window.store.commit === "function") {
|
||||||
|
window.store.commit("setActiveTarBar", "home")
|
||||||
|
}
|
||||||
|
if (!window.$ || !$.support || !$.support.pjax) {
|
||||||
|
window.location.replace("/platform/h5/home")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
var fallbackTimer = window.setTimeout(function () {
|
||||||
|
window.location.replace("/platform/h5/home")
|
||||||
|
}, 1200)
|
||||||
|
$(document).one("pjax:complete", function () {
|
||||||
|
window.clearTimeout(fallbackTimer)
|
||||||
|
})
|
||||||
|
$(document).one("pjax:error pjax:timeout", function () {
|
||||||
|
window.clearTimeout(fallbackTimer)
|
||||||
|
window.location.replace("/platform/h5/home")
|
||||||
|
})
|
||||||
|
$.pjax({
|
||||||
|
url: "/platform/h5/home",
|
||||||
|
container: "#container",
|
||||||
|
fragment: "#container",
|
||||||
|
push: false,
|
||||||
|
replace: true,
|
||||||
|
timeout: 8000
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 加载精彩活动页顶部图片，未配置时使用默认首页图兜底。
|
||||||
|
loadTopImage: function () {
|
||||||
|
var self = this
|
||||||
|
this.$axios.post("/open/common/getConfigKey", { key: "AppFeaturedActivityImg" }).then(function (res) {
|
||||||
|
if (res.code === 0 && res.data) {
|
||||||
|
self.topImage = String(res.data).split(",")[0]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 查询首页活动并排除福利类活动，形成精彩活动列表。
|
||||||
|
listActivity: function () {
|
||||||
|
var self = this
|
||||||
|
this.$axios.post("/platform/home/listHomeActivity").then(function (resp) {
|
||||||
|
if (resp.code === 0) {
|
||||||
|
self.activityOptions = (resp.data || []).filter(function (item) {
|
||||||
|
return !self.isWelfareItem(item)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 根据活动地址识别福利类活动，用于与节日福利页拆分展示。
|
||||||
|
isWelfareItem: function (item) {
|
||||||
|
var url = ((item && item.url) || "") + "," + ((item && item.h5Url) || "")
|
||||||
|
return url.indexOf("/welfare/") > -1
|
||||||
|
},
|
||||||
|
// 点击活动时先校验开始时间，未开始活动只提示不跳转。
|
||||||
|
enterAct: function (item) {
|
||||||
|
if (this.$moment().unix() < this.$moment(item.startDate).unix()) {
|
||||||
|
this.$toast("活动即将开始")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$pjaxReplace(item.h5Url)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created: function () {
|
||||||
|
this.loadTopImage()
|
||||||
|
this.listActivity()
|
||||||
|
},
|
||||||
|
style: /*language=CSS*/ `
|
||||||
|
body {
|
||||||
|
background-color: #f4f7fb;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-page {
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: #f4f7fb;
|
||||||
|
padding-bottom: 18px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-page /deep/ .van-nav-bar {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-page /deep/ .van-nav-bar__title {
|
||||||
|
color: #1f2937;
|
||||||
|
font-size: 17px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-page /deep/ .van-nav-bar .van-icon,
|
||||||
|
.featured-page /deep/ .van-nav-bar__text {
|
||||||
|
color: #1989fa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-banner {
|
||||||
|
position: relative;
|
||||||
|
height: 140px;
|
||||||
|
margin: 12px 12px 10px;
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
background-color: #e9eef6;
|
||||||
|
box-shadow: 0 8px 22px rgba(31, 41, 55, .1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-banner img {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-banner__shade {
|
||||||
|
position: absolute;
|
||||||
|
inset: 0;
|
||||||
|
background: linear-gradient(90deg, rgba(0, 0, 0, .42), rgba(0, 0, 0, .08));
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-banner__text {
|
||||||
|
position: absolute;
|
||||||
|
left: 18px;
|
||||||
|
bottom: 18px;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 0 2px 10px rgba(0, 0, 0, .26);
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-banner__title {
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 30px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-banner__sub {
|
||||||
|
margin-top: 5px;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 18px;
|
||||||
|
opacity: .92;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-list {
|
||||||
|
margin: 0 10px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 8px 0;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item {
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
padding: 10px 12px;
|
||||||
|
background-color: #fff;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item + .act-item {
|
||||||
|
border-top: 1px solid #f0f2f5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-list /deep/ .act-item-wrapper-tag {
|
||||||
|
position: absolute !important;
|
||||||
|
top: 10px !important;
|
||||||
|
left: 12px !important;
|
||||||
|
z-index: 2;
|
||||||
|
width: auto !important;
|
||||||
|
min-width: 42px;
|
||||||
|
height: 20px !important;
|
||||||
|
flex: none !important;
|
||||||
|
padding: 0 6px !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
border: 0 !important;
|
||||||
|
border-radius: 2px !important;
|
||||||
|
display: inline-flex !important;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #fff !important;
|
||||||
|
background-color: #1f73b7 !important;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 20px;
|
||||||
|
white-space: nowrap !important;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.featured-list /deep/ .act-item-wrapper-tag.van-tag--success {
|
||||||
|
background-color: #1f73b7 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item-cover {
|
||||||
|
width: 120px;
|
||||||
|
height: 84px;
|
||||||
|
flex: 0 0 120px;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: #f2f3f5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item-cover /deep/ .van-image,
|
||||||
|
.act-item-cover /deep/ img {
|
||||||
|
display: block;
|
||||||
|
width: 120px;
|
||||||
|
height: 84px;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item-wrapper {
|
||||||
|
min-width: 0;
|
||||||
|
flex: 1;
|
||||||
|
padding-left: 12px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-title {
|
||||||
|
color: #111827;
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 21px;
|
||||||
|
font-weight: 600;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-text {
|
||||||
|
margin-top: 9px;
|
||||||
|
color: #6b7280;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt5 {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<!--#
|
||||||
|
}
|
||||||
|
#-->
|
||||||
@@ -0,0 +1,309 @@
|
|||||||
|
<!--#
|
||||||
|
layout("/layouts/platform_h5.html"){
|
||||||
|
#-->
|
||||||
|
|
||||||
|
<div id="app" v-cloak>
|
||||||
|
<div class="festival-page">
|
||||||
|
<van-nav-bar
|
||||||
|
title="节日福利"
|
||||||
|
left-text="返回"
|
||||||
|
left-arrow
|
||||||
|
fixed
|
||||||
|
placeholder
|
||||||
|
@click-left="goBack"
|
||||||
|
></van-nav-bar>
|
||||||
|
|
||||||
|
<div class="festival-banner">
|
||||||
|
<img :src="topImage" alt="">
|
||||||
|
<div class="festival-banner__shade"></div>
|
||||||
|
<div class="festival-banner__text">
|
||||||
|
<div class="festival-banner__title">节日福利</div>
|
||||||
|
<div class="festival-banner__sub">查看可参与的节日福利活动</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="festival-list">
|
||||||
|
<template v-if="activityOptions && activityOptions.length > 0">
|
||||||
|
<div v-for="item in activityOptions" :key="item.id" class="act-item" @click="enterAct(item)">
|
||||||
|
<van-tag class="act-item-wrapper-tag" v-if="$moment().unix() > $moment(item.endDate).unix()">
|
||||||
|
已结束
|
||||||
|
</van-tag>
|
||||||
|
|
||||||
|
<van-tag class="act-item-wrapper-tag" type="success"
|
||||||
|
v-else-if="$moment().unix() > $moment(item.startDate).unix() && $moment().unix() < $moment(item.endDate).unix()">
|
||||||
|
进行中
|
||||||
|
</van-tag>
|
||||||
|
|
||||||
|
<van-tag class="act-item-wrapper-tag" type="success" v-else-if="$moment().unix() < $moment(item.startDate).unix()">
|
||||||
|
即将开始
|
||||||
|
</van-tag>
|
||||||
|
|
||||||
|
<div class="act-item-cover">
|
||||||
|
<van-image v-if="item.cover" width="120" height="84" :src="item.cover"></van-image>
|
||||||
|
</div>
|
||||||
|
<div class="act-item-wrapper">
|
||||||
|
<div class="content-title">{{ item.name }}</div>
|
||||||
|
<div class="content-text">
|
||||||
|
<div>开始时间：{{ $moment(item.startDate).format('MM-DD HH:mm') }}</div>
|
||||||
|
<div class="mt5">结束时间：{{ $moment(item.endDate).format('MM-DD HH:mm') }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<van-empty v-if="!activityOptions || activityOptions.length === 0" description="暂无节日福利"></van-empty>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script nonce="${cspNonce!}">
|
||||||
|
new Vue({
|
||||||
|
el: "#app",
|
||||||
|
data: function () {
|
||||||
|
return {
|
||||||
|
topImage: "/assets/mobile/img/home/home2.png",
|
||||||
|
activityOptions: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 顶部导航返回入口，统一复用返回首页逻辑。
|
||||||
|
goBack: function () {
|
||||||
|
this.returnHome()
|
||||||
|
},
|
||||||
|
// 返回移动端首页并恢复首页 tab，PJAX 不可用时退回整页跳转。
|
||||||
|
returnHome: function () {
|
||||||
|
if (window.store && typeof window.store.commit === "function") {
|
||||||
|
window.store.commit("setActiveTarBar", "home")
|
||||||
|
}
|
||||||
|
if (!window.$ || !$.support || !$.support.pjax) {
|
||||||
|
window.location.replace("/platform/h5/home")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
var fallbackTimer = window.setTimeout(function () {
|
||||||
|
window.location.replace("/platform/h5/home")
|
||||||
|
}, 1200)
|
||||||
|
$(document).one("pjax:complete", function () {
|
||||||
|
window.clearTimeout(fallbackTimer)
|
||||||
|
})
|
||||||
|
$(document).one("pjax:error pjax:timeout", function () {
|
||||||
|
window.clearTimeout(fallbackTimer)
|
||||||
|
window.location.replace("/platform/h5/home")
|
||||||
|
})
|
||||||
|
$.pjax({
|
||||||
|
url: "/platform/h5/home",
|
||||||
|
container: "#container",
|
||||||
|
fragment: "#container",
|
||||||
|
push: false,
|
||||||
|
replace: true,
|
||||||
|
timeout: 8000
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 加载节日福利页顶部图片，未配置时使用默认首页图兜底。
|
||||||
|
loadTopImage: function () {
|
||||||
|
var self = this
|
||||||
|
this.$axios.post("/open/common/getConfigKey", { key: "AppFestivalBenefitImg" }).then(function (res) {
|
||||||
|
if (res.code === 0 && res.data) {
|
||||||
|
self.topImage = String(res.data).split(",")[0]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 查询首页活动并仅保留福利类活动，形成节日福利列表。
|
||||||
|
listActivity: function () {
|
||||||
|
var self = this
|
||||||
|
this.$axios.post("/platform/home/listHomeActivity").then(function (resp) {
|
||||||
|
if (resp.code === 0) {
|
||||||
|
self.activityOptions = (resp.data || []).filter(function (item) {
|
||||||
|
return self.isWelfareItem(item)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 根据活动地址识别福利类活动，用于与精彩活动页拆分展示。
|
||||||
|
isWelfareItem: function (item) {
|
||||||
|
var url = ((item && item.url) || "") + "," + ((item && item.h5Url) || "")
|
||||||
|
return url.indexOf("/welfare/") > -1
|
||||||
|
},
|
||||||
|
// 点击活动时先校验开始时间，未开始活动只提示不跳转。
|
||||||
|
enterAct: function (item) {
|
||||||
|
if (this.$moment().unix() < this.$moment(item.startDate).unix()) {
|
||||||
|
this.$toast("活动即将开始")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$pjaxReplace(item.h5Url)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created: function () {
|
||||||
|
this.loadTopImage()
|
||||||
|
this.listActivity()
|
||||||
|
},
|
||||||
|
style: /*language=CSS*/ `
|
||||||
|
body {
|
||||||
|
background-color: #f4f7fb;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-page {
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: #f4f7fb;
|
||||||
|
padding-bottom: 18px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-page /deep/ .van-nav-bar {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-page /deep/ .van-nav-bar__title {
|
||||||
|
color: #1f2937;
|
||||||
|
font-size: 17px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-page /deep/ .van-nav-bar .van-icon,
|
||||||
|
.festival-page /deep/ .van-nav-bar__text {
|
||||||
|
color: #1989fa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-banner {
|
||||||
|
position: relative;
|
||||||
|
height: 140px;
|
||||||
|
margin: 12px 12px 10px;
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
background-color: #e9eef6;
|
||||||
|
box-shadow: 0 8px 22px rgba(31, 41, 55, .1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-banner img {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-banner__shade {
|
||||||
|
position: absolute;
|
||||||
|
inset: 0;
|
||||||
|
background: linear-gradient(90deg, rgba(0, 0, 0, .42), rgba(0, 0, 0, .08));
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-banner__text {
|
||||||
|
position: absolute;
|
||||||
|
left: 18px;
|
||||||
|
bottom: 18px;
|
||||||
|
color: #fff;
|
||||||
|
text-shadow: 0 2px 10px rgba(0, 0, 0, .26);
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-banner__title {
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 30px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-banner__sub {
|
||||||
|
margin-top: 5px;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 18px;
|
||||||
|
opacity: .92;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-list {
|
||||||
|
margin: 0 10px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 8px 0;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item {
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
padding: 10px 12px;
|
||||||
|
background-color: #fff;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item + .act-item {
|
||||||
|
border-top: 1px solid #f0f2f5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-list /deep/ .act-item-wrapper-tag {
|
||||||
|
position: absolute !important;
|
||||||
|
top: 10px !important;
|
||||||
|
left: 12px !important;
|
||||||
|
z-index: 2;
|
||||||
|
width: auto !important;
|
||||||
|
min-width: 42px;
|
||||||
|
height: 20px !important;
|
||||||
|
flex: none !important;
|
||||||
|
padding: 0 6px !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
border: 0 !important;
|
||||||
|
border-radius: 2px !important;
|
||||||
|
display: inline-flex !important;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #fff !important;
|
||||||
|
background-color: #1f73b7 !important;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 20px;
|
||||||
|
white-space: nowrap !important;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.festival-list /deep/ .act-item-wrapper-tag.van-tag--success {
|
||||||
|
background-color: #1f73b7 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item-cover {
|
||||||
|
width: 120px;
|
||||||
|
height: 84px;
|
||||||
|
flex: 0 0 120px;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: #f2f3f5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item-cover /deep/ .van-image,
|
||||||
|
.act-item-cover /deep/ img {
|
||||||
|
display: block;
|
||||||
|
width: 120px;
|
||||||
|
height: 84px;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
.act-item-wrapper {
|
||||||
|
min-width: 0;
|
||||||
|
flex: 1;
|
||||||
|
padding-left: 12px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-title {
|
||||||
|
color: #111827;
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 21px;
|
||||||
|
font-weight: 600;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-text {
|
||||||
|
margin-top: 9px;
|
||||||
|
color: #6b7280;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mt5 {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<!--#
|
||||||
|
}
|
||||||
|
#-->
|
||||||
Reference in New Issue
Block a user