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.
774 lines
20 KiB
774 lines
20 KiB
<template>
|
|
<view class="wrap">
|
|
<!-- 自定义导航栏 -->
|
|
<view class="navBarBox" :style="{height:navBarBoxHeight+'rpx'}">
|
|
<!-- 状态栏占位 -->
|
|
<view class="statusBar" :style="{paddingTop: statusBarHeight+'px'}"></view>
|
|
<!-- 真正的导航栏内容 -->
|
|
<view class="navBar">
|
|
<image class="logo" src="/static/logo.png" mode="scaleToFill"></image>
|
|
<!-- <view>我是导航栏标题</view> -->
|
|
</view>
|
|
</view>
|
|
<view class="content" :style="{paddingTop: navBarBoxHeight+'rpx'}">
|
|
<view class="box-top">
|
|
<image src="../../static/img/index_bg.jpg" class="index_bg"></image>
|
|
</view>
|
|
|
|
<view class="box-body">
|
|
<view class="box-notice">
|
|
<u-notice-bar @click="openInfo" :text="list" direction="column" color="#cf995a"></u-notice-bar>
|
|
</view>
|
|
<view>
|
|
<view class="box-row">
|
|
<view class="box-col" @click="handleBook(1)">
|
|
<image src="../../static/img/index_icon_1.png" class="box-body-icon"></image>
|
|
<view class='box-body-title'>团队信息</view>
|
|
</view>
|
|
<view class="box-col" @click="handleBook(2)">
|
|
<image src="../../static/img/index_icon_2.png" class="box-body-icon"></image>
|
|
<view class='box-body-title'>活动预约</view>
|
|
</view>
|
|
<view class="box-col" @click="handleBook(3)">
|
|
<image src="../../static/img/index_icon_3.png" class="box-body-icon"></image>
|
|
<view class='box-body-title'>停车场预约</view>
|
|
</view>
|
|
<view class="box-col" @click="handleBook(4)">
|
|
<image src="../../static/img/index_icon_4.png" class="box-body-icon"></image>
|
|
<view class='box-body-title'>一键导航</view>
|
|
</view>
|
|
</u-row>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 展厅导览 -->
|
|
<view class="box-bottom" style="padding-bottom:0" @click='toDl'>
|
|
<view class="exhibit">
|
|
<view>
|
|
<view>
|
|
<span></span>
|
|
<span>展厅导览</span>
|
|
</view>
|
|
<u-icon name="arrow-right"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="exhibit_list">
|
|
<img :src="dlimg" alt="" style="height:300rpx">
|
|
<span>2F 平面图</span>
|
|
</view>
|
|
</view>
|
|
<view class="box-bottom" style="padding-top:0">
|
|
<!-- 当前展览 -->
|
|
<view class="exhibit">
|
|
<view @click='toExhibitList'>
|
|
<view>
|
|
<span></span>
|
|
<span>当前展览</span>
|
|
</view>
|
|
<u-icon name="arrow-right"></u-icon>
|
|
</view>
|
|
<view class="exhibit_list" v-for="item in exhibitList" @click='todetail(item.id)'>
|
|
<img :src="item.head_upload.url" alt="">
|
|
<span>{{item.name}}</span>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 参观预约 -->
|
|
<u-popup :show="showBook" mode="bottom" @close="closeBook" :round="10" closeable>
|
|
<view class="mpopup">
|
|
<view class="mpopup-title">
|
|
<!-- 参观预约 -->
|
|
</view>
|
|
<view class="mpopup-content">
|
|
<view class="book-box">
|
|
<view class="book-box-card">
|
|
<view class="book-box-title">
|
|
日期
|
|
</view>
|
|
<view class="book-box-row">
|
|
<view class="book-box-row-date">
|
|
<block v-for="(item,index) in listDatePrice" :key="index">
|
|
<view class="book-box-row-dateitem" :class="{'book-box-row-dateitem-on':item.checked,
|
|
'book-box-row-dateitem-none':item.is_open==0,
|
|
'book-box-row-dateitem-none':item.remain_count==0}" @click="handleDate(index)">
|
|
<view class="book-box-row-dateitem-status">
|
|
<u-icon name="checkmark" color="#fff" size="20rpx"
|
|
v-if="item.checked">
|
|
</u-icon>
|
|
<view v-else>
|
|
<text
|
|
v-if="item.is_open==1">{{item.remain_count==0?"不可参观":"可参观"}}</text>
|
|
<text v-else>闭馆</text>
|
|
</view>
|
|
</view>
|
|
<view>{{item.week}}</view>
|
|
<view>{{item.datef}}</view>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
<view class="book-box-row-select" @click="openCalendar">
|
|
<view>
|
|
<view>指定</view>
|
|
<view>日期</view>
|
|
</view>
|
|
<view class="book-box-row-select-more">
|
|
<u-icon name="arrow-right" color="#cf995a" size="20rpx"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="book-box-card">
|
|
<view class="book-box-title">
|
|
进馆时间
|
|
</view>
|
|
|
|
<view class="book-box-timerow">
|
|
<view class="book-box-row-timeitem" v-for="(item,index) in currentDate.rules"
|
|
:class="{'book-box-row-timeitem-on':item.checked,'timeitem-none':item.remain_count==0,'timeitem-none':item.isCanbook==false}"
|
|
:key="index" @click="handleSelectTime(index)">
|
|
<view class="book-box-row-timeitem-status" v-if="item.checked">
|
|
<u-icon name="checkmark" color="#fff" size="20rpx"></u-icon>
|
|
</view>
|
|
<view class="book-box-row-timeitem-txt">{{item.start_time+'-'+item.end_time}}
|
|
</view>
|
|
|
|
<block v-if="item.isCanbook">
|
|
<view class="book-box-row-timeitem-txt"
|
|
v-if="item.remain_count>0&&item.remain_count<=50">
|
|
{{item.remain_count}}张
|
|
</view>
|
|
<view class="book-box-row-timeitem-txt" v-else-if="item.remain_count>50">
|
|
余票充足
|
|
</view>
|
|
<view class="book-box-row-timeitem-txt" v-else>已约满</view>
|
|
</block>
|
|
<block v-else>
|
|
<view class="book-box-row-timeitem-txt">不可参观</view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="book-box-selectInfo">
|
|
<view class="book-box-selectInfo-left">已选：{{currentDate.datef||""}}
|
|
{{(currentTime.start_time||"")+"-"+(currentTime.end_time||"")}}
|
|
</view>
|
|
<view class="book-box-selectInfo-right">
|
|
</view>
|
|
</view>
|
|
<view class="mpopup-footer">
|
|
<view style="margin-right: 0rpx;flex: 1;">
|
|
<u-button style="background-color: red;" type="primary" @click="tobook('team')">团队信息</u-button>
|
|
</view>
|
|
<!-- <view style="margin-left: 14rpx;flex: 1;">
|
|
<u-button type="primary" @click="tobook('user')">个人预约</u-button>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<u-calendar ref="calendar" :show-confirm="false" :show="showCalendar" :minDate="minDate" :maxDate="maxDate"
|
|
color="#cf995a" round="20" defaultDate="2022-02-15" @confirm="handleSelectDate" @close="closecalendar">
|
|
</u-calendar>
|
|
|
|
|
|
<u-popup :show="showAuthorization" closeable mode="bottom" @close="closePhone" :round="10">
|
|
<view class="box">
|
|
<view class="box-title" style="text-align: center;padding: 20rpx 0;font-size: 32rpx;">
|
|
请授权您的手机号
|
|
</view>
|
|
<view class="box-content" style="padding: 20px;">
|
|
<u-button type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">授权手机号
|
|
</u-button>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
<u-popup :show="showInfo" mode="center" @close="closeInfo" :round="10" closeable :customStyle="{margin:'40rpx'}">
|
|
<view class="mpopup">
|
|
<view class="mpopup-title">
|
|
{{currentNotice.name}}
|
|
</view>
|
|
<view class="mpopup-content" style="padding: 40rpx;">
|
|
<view v-html="currentNotice.content" style="font-size:28rpx;line-height: 2.3;text-indent: 2em;">
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
<tabbar :current-page="0"></tabbar>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import tabbar from "../../components/tabbar/tabbar.vue"
|
|
export default {
|
|
components:{
|
|
tabbar
|
|
},
|
|
data() {
|
|
const d = new Date()
|
|
const year = d.getFullYear()
|
|
let month = d.getMonth() + 1
|
|
month = month < 10 ? `0${month}` : month
|
|
const date = d.getDate()
|
|
return {
|
|
// 状态栏高度
|
|
statusBarHeight: 0,
|
|
navBarBoxHeight:0,
|
|
exhibitList:[],
|
|
showBook: false,
|
|
minDate: `${year}-${month}-${date + 1}`,
|
|
maxDate: `${year}-${month}-${date + 7}`,
|
|
showCalendar: false,
|
|
info: {},
|
|
list: ["暂无通知通告"],
|
|
listNotice: [],
|
|
currentNotice: {},
|
|
showInfo: false,
|
|
listDatePrice: [],
|
|
currentDate: {},
|
|
currentTime: {},
|
|
currentIndex: 0,
|
|
listCalendar: [],
|
|
showAuthorization: false,
|
|
openType: 1,
|
|
dlimg:require("../../static/img/daolan.png")
|
|
}
|
|
},
|
|
onShareAppMessage() {
|
|
return this.util.shareInfo
|
|
},
|
|
onLoad() {
|
|
|
|
//获取手机状态栏高度
|
|
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
|
|
this.navBarBoxHeight = 80 + this.statusBarHeight*2
|
|
this.loadInfo();
|
|
this.loadNotice();
|
|
this.getExhibit()
|
|
},
|
|
onReady() {
|
|
// 如果需要兼容微信小程序的话，需要用此写法
|
|
this.$refs.calendar.setFormatter(this.formatter)
|
|
},
|
|
onHide() {
|
|
this.showBook = false;
|
|
},
|
|
methods: {
|
|
toExhibitList(){
|
|
uni.navigateTo({
|
|
url: "/pages/exhibit/list"
|
|
});
|
|
},
|
|
toDl(){
|
|
uni.navigateTo({
|
|
url: "/packages/dl/index"
|
|
});
|
|
},
|
|
togame() {
|
|
uni.navigateToMiniProgram({
|
|
appId: 'wx3aafff78f8750c1d',
|
|
success(res) {
|
|
// 打开成功
|
|
}
|
|
})
|
|
},
|
|
openInfo(e) {
|
|
this.currentNotice = this.listNotice[e];
|
|
this.currentNotice.content = this.currentNotice.content.replace(/\<p/gi, "<p class='richp'");
|
|
this.showInfo = true;
|
|
},
|
|
closeInfo() {
|
|
this.showInfo = false;
|
|
},
|
|
loadNotice() {
|
|
var that = this;
|
|
this.util.request({
|
|
api: '/api/mobile/other/notice-index',
|
|
utilSuccess: function(res) {
|
|
if(res.data.length>0){
|
|
let arr = [];
|
|
for (var m of res.data) {
|
|
arr.push(m.name)
|
|
}
|
|
that.listNotice = res.data;
|
|
that.list = arr;
|
|
}
|
|
|
|
},
|
|
utilFail: function(res) {
|
|
|
|
}
|
|
})
|
|
|
|
},
|
|
closePhone() {
|
|
this.showAuthorization = false
|
|
},
|
|
getPhoneNumber(e) {
|
|
var that = this;
|
|
this.util.request({
|
|
api: '/api/mobile/user/mobile',
|
|
data: {
|
|
code: e.detail.code
|
|
},
|
|
utilSuccess: function(res) {
|
|
that.util.getUserInfo(function(r) {
|
|
that.checkUser();
|
|
}, true)
|
|
|
|
},
|
|
utilFail: function(res) {
|
|
|
|
}
|
|
})
|
|
},
|
|
|
|
closecalendar() {
|
|
this.showCalendar = false;
|
|
},
|
|
handleSelectDate(e) {
|
|
let that = this;
|
|
|
|
if (e.length != 0) {
|
|
var date = e[0]
|
|
var mod = this.listCalendar.filter((p) => {
|
|
return p.is_open == 1 && p.remain_count != 0 && p.date == date;
|
|
})
|
|
if (mod.length != 0) {
|
|
this.load3Day(date, function(isCanbook) {
|
|
if (isCanbook) {
|
|
that.showCalendar = false;
|
|
} else {
|
|
that.util.toast("您选择的日期不可参观")
|
|
}
|
|
});
|
|
} else {
|
|
that.util.toast("您选择的日期不可参观")
|
|
}
|
|
}
|
|
},
|
|
openCalendar() {
|
|
var that = this;
|
|
var edate = this.$moment().add('days', 7).format("yyyy-MM-DD");
|
|
var ndate = this.$moment().add('days', 1).format("yyyy-MM-DD")
|
|
this.loadCalendar(ndate, edate, function(res) {
|
|
that.listCalendar = res;
|
|
that.showCalendar = true;
|
|
});
|
|
},
|
|
formatter(day) {
|
|
for (var m of this.listCalendar) {
|
|
let date = this.$moment(day.date).format("yyyy-MM-DD");
|
|
if (date == m.date) {
|
|
if (m.is_open == 1)
|
|
if (m.remain_count == 0) {
|
|
day.bottomInfo = '不可参观'
|
|
} else {
|
|
day.bottomInfo = '可参观'
|
|
}
|
|
else {
|
|
day.bottomInfo = '闭馆'
|
|
}
|
|
}
|
|
}
|
|
return day
|
|
},
|
|
handleDate(index) {
|
|
var nt = this.$moment().format("yyyy-MM-DD");
|
|
let list = this.listDatePrice;
|
|
let cdate = list[index];
|
|
|
|
if (cdate.is_open === 0) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "该日期已经闭馆"
|
|
})
|
|
return;
|
|
}
|
|
if (cdate.remain_count === 0) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "该日期已不可参观"
|
|
})
|
|
return;
|
|
}
|
|
|
|
for (var m of list) {
|
|
m.checked = false;
|
|
}
|
|
cdate.checked = true;
|
|
this.currentDate = cdate;
|
|
this.loadDefaultTime(cdate.rules);
|
|
this.listDatePrice = list;
|
|
this.$forceUpdate();
|
|
},
|
|
handleSelectTime(index) {
|
|
var mod = this.currentDate.rules[index];
|
|
if (!mod.isCanbook) {
|
|
return false
|
|
}
|
|
if (mod.remain_count == 0) {
|
|
this.util.toast("该时段已约满了");
|
|
return false
|
|
}
|
|
for (var m of this.currentDate.rules) {
|
|
m.checked = false;
|
|
}
|
|
mod.checked = true;
|
|
this.currentTime = mod;
|
|
this.$forceUpdate();
|
|
},
|
|
openActivity() {
|
|
uni.navigateTo({
|
|
url: "/packages/activity/index"
|
|
})
|
|
},
|
|
openMap() {
|
|
uni.navigateTo({
|
|
url: "/packages/map/map"
|
|
})
|
|
},
|
|
openPark() {
|
|
uni.navigateTo({
|
|
url: "/packages/park/index"
|
|
})
|
|
},
|
|
loadUser(cb) {
|
|
var that = this;
|
|
this.util.getOpenidInfo(function(res) {
|
|
that.util.getUserInfo(function(r) {
|
|
cb(r);
|
|
}, true)
|
|
}, true);
|
|
},
|
|
handleBook(type) {
|
|
this.openType = type;
|
|
uni.$u.throttle(this.checkUser, 1500)
|
|
},
|
|
checkUser() {
|
|
let type = this.openType;
|
|
var that = this;
|
|
that.loadUser(function(res) {
|
|
if (that.util.isNull(res.mobile)) {
|
|
that.showAuthorization = true;
|
|
} else {
|
|
that.showAuthorization = false;
|
|
if (type == 1) that.openBook();
|
|
else if (type == 2) that.openActivity()
|
|
else if (type == 3) that.openPark()
|
|
else if (type == 4) that.openMap()
|
|
}
|
|
})
|
|
},
|
|
openBook() {
|
|
var that = this;
|
|
this.currentTime = this.currentDate = {};
|
|
|
|
var sdate = that.$moment().format("yyyy-MM-DD");
|
|
that.showBook = true;
|
|
that.load3Day(sdate)
|
|
},
|
|
closeBook() {
|
|
this.showBook = false;
|
|
},
|
|
tobook(type) {
|
|
|
|
if (this.util.isNull(this.currentDate.date)) {
|
|
this.util.toast("请选择参观的日期");
|
|
return false;
|
|
}
|
|
if (this.util.isNull(this.currentTime.id)) {
|
|
this.util.toast("请选择参观的时段");
|
|
return false;
|
|
}
|
|
uni.navigateTo({
|
|
url: "/pages/visit/book?from=" + type + "¤tDate=" + JSON.stringify(this.currentDate) +
|
|
"¤tTime=" + JSON.stringify(this.currentTime)
|
|
})
|
|
},
|
|
loadInfo() {
|
|
var that = this;
|
|
this.util.request({
|
|
api: '/api/mobile/visit/introduce',
|
|
utilSuccess: function(res) {
|
|
console.log(res);
|
|
that.info = res;
|
|
},
|
|
utilFail: function(res) {
|
|
|
|
}
|
|
})
|
|
|
|
},
|
|
// 获取展览一条
|
|
todetail(id){
|
|
uni.navigateTo({
|
|
url: "/pages/exhibit/detail?id="+id
|
|
});
|
|
},
|
|
getExhibit(){
|
|
var that = this;
|
|
this.util.request({
|
|
api: '/api/mobile/exhibit-hall/index',
|
|
data:{
|
|
page:1,
|
|
page_size:2,
|
|
state:1,
|
|
sort_name:'state',
|
|
sort_name_tow:'release_time',
|
|
sort_type:"DESC",
|
|
sort_type_tow:'DESC'
|
|
},
|
|
utilSuccess: function(res) {
|
|
that.exhibitList = res.data
|
|
},
|
|
utilFail: function(res) {
|
|
|
|
}
|
|
})
|
|
},
|
|
load3Day(sdate, callbak) { //加载7天数据
|
|
var that = this;
|
|
that.listDatePrice = [];
|
|
var edate = this.$moment(sdate).add('days', 2).format("yyyy-MM-DD");
|
|
var ndate = this.$moment(sdate).add('days', 0).format("yyyy-MM-DD")
|
|
var nt = this.$moment().format("yyyy-MM-DD");
|
|
var mt = this.$moment().add('days', 1).format("yyyy-MM-DD");
|
|
var ht = this.$moment().add('days', 2).format("yyyy-MM-DD");
|
|
var selectDate = (nt == sdate) ? ndate : sdate;
|
|
this.loadCalendar(sdate, edate, function(res) {
|
|
that.listDatePrice = res;
|
|
var i = 0;
|
|
let isOpenDate = false;
|
|
for (var m of that.listDatePrice) {
|
|
m.checked = false;
|
|
m.datef = that.$moment(m.date).format("MM月DD日");
|
|
var week = that.$moment(m.date).format("dddd");
|
|
if (m.date == nt)
|
|
m.week = "今天";
|
|
else if (m.date == mt) {
|
|
m.week = "明天";
|
|
} else if (m.date == ht) {
|
|
m.week = "后天";
|
|
} else {
|
|
m.week = week;
|
|
}
|
|
if (m.date == selectDate) {
|
|
if (m.is_open == 1 && m.remain_count > 0) {
|
|
m.checked = true;
|
|
that.currentDate = m;
|
|
that.currentIndex = i;
|
|
that.loadDefaultTime(m.rules);
|
|
isOpenDate = true;
|
|
} else {
|
|
isOpenDate = false;
|
|
}
|
|
}
|
|
i++;
|
|
}
|
|
if (callbak)
|
|
callbak(isOpenDate);
|
|
|
|
})
|
|
|
|
|
|
},
|
|
loadDefaultTime(rules) {
|
|
var that = this;
|
|
var nt = new Date();
|
|
that.currentTime = {};
|
|
let isDefault = false;
|
|
for (var mod of rules) {
|
|
mod.checked = false;
|
|
mod.endtime = that.currentDate.date + " " + mod.end_time;
|
|
var isCanbook = that.$moment(nt).isBefore(mod.endtime);
|
|
mod.isCanbook = isCanbook;
|
|
if (!isDefault && mod.remain_count > 0 && isCanbook) {
|
|
isDefault = true;
|
|
mod.checked = true;
|
|
that.currentTime = mod;
|
|
}
|
|
}
|
|
|
|
},
|
|
loadCalendar(sdate, edate, cb) {
|
|
var that = this;
|
|
this.util.request({
|
|
api: '/api/mobile/visit/get-calendar',
|
|
data: {
|
|
start_date: sdate,
|
|
end_date: edate
|
|
},
|
|
utilSuccess: function(res) {
|
|
cb(res);
|
|
},
|
|
utilFail: function(res) {
|
|
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
@import url("@/static/css/bookbox.css");
|
|
.wrap{
|
|
background-color: #cf995a;
|
|
}
|
|
.navBarBox {
|
|
position: fixed;
|
|
top:0;
|
|
left:0;
|
|
width:100%;
|
|
z-index:999;
|
|
background: linear-gradient(to bottom,#f6d593,#cf995a);
|
|
}
|
|
|
|
.navBarBox .statusBar {}
|
|
|
|
.navBarBox .navBar {
|
|
padding: 20rpx 50rpx;
|
|
padding-left: 30rpx;
|
|
text-align: left;
|
|
height:80rpx;
|
|
/* display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
align-items: center; */
|
|
}
|
|
|
|
.navBarBox .navBar .logo {
|
|
width: 262rpx;
|
|
height: 46rpx;
|
|
/*
|
|
margin-right: 10rpx; */
|
|
}
|
|
|
|
.timeitem-none {
|
|
color: #ccc;
|
|
}
|
|
|
|
|
|
.content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding-bottom:120rpx;
|
|
min-height:100vh;
|
|
background-color: #fff;
|
|
/* padding-top:190rpx; */
|
|
}
|
|
|
|
.box-top {
|
|
width: 100%;
|
|
font-size: 0;
|
|
}
|
|
|
|
.index_bg {
|
|
width: 100%;
|
|
height: 497rpx;
|
|
}
|
|
|
|
.u-notice-bar {
|
|
border-top-left-radius: 15rpx !important;
|
|
border-top-right-radius: 15rpx !important;
|
|
background-color: ##fbf3ea !important;
|
|
}
|
|
|
|
.box-body {
|
|
width: 100%;
|
|
padding: 40rpx 0;
|
|
background-color: #f6f6f6;
|
|
padding-top:0
|
|
}
|
|
.box-notice{
|
|
margin-bottom:40rpx;
|
|
}
|
|
.box-row {
|
|
display: flex;
|
|
padding: 0 50rpx;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.box-col {
|
|
text-align: center;
|
|
}
|
|
|
|
.box-body-icon {
|
|
width: 102rpx;
|
|
height: 102rpx;
|
|
}
|
|
|
|
.box-body-title {
|
|
margin-top: 10rpx;
|
|
font-size:28rpx;
|
|
|
|
}
|
|
.box-bottom{
|
|
background-color: #fff;
|
|
padding:50rpx 30rpx;
|
|
padding-top:35rpx;
|
|
width:100%;
|
|
/* padding-bottom: 0;
|
|
min-height: 41vh; */
|
|
}
|
|
.exhibit{
|
|
|
|
}
|
|
.exhibit>view:first-child{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 36rpx;
|
|
}
|
|
.exhibit>view:first-child span:first-child{
|
|
background-color: #DEA166;
|
|
width:5rpx;
|
|
height:50rpx;
|
|
margin-right:22rpx;
|
|
display: inline-block;
|
|
vertical-align: text-top;
|
|
}
|
|
.exhibit_list{
|
|
position: relative;
|
|
margin-top:35rpx;
|
|
margin-bottom:35rpx;
|
|
font-size: 0;
|
|
}
|
|
.exhibit_list img{
|
|
width:100%;
|
|
height:410rpx;
|
|
border-radius: 20rpx;
|
|
}
|
|
.exhibit_list span{
|
|
display: inline-block;
|
|
width:100%;
|
|
box-sizing: border-box;
|
|
border-radius:0 0 20rpx 20rpx;
|
|
position: absolute;
|
|
bottom:0;
|
|
left:0;
|
|
color:#fff;
|
|
font-size: 32rpx;
|
|
padding:20rpx 32rpx;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
background: linear-gradient(to bottom,rgba(255,255,255,0),rgba(0,0,0,0.5));
|
|
}
|
|
.footer-img {
|
|
width: 421rpx;
|
|
height: 364rpx;
|
|
}
|
|
|
|
.richp {
|
|
margin-bottom: 10rpx;
|
|
}
|
|
</style> |