景徳镇旅游微信小程序
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.
 
 
 

120 lines
2.1 KiB

<template>
<!-- 申请遗迹 -->
<view class="apply">
<navbar title="申请遗迹" leftClick @leftClick="$utils.navigateBack" />
<view class="top-img">
<image src="../static/applyRelic/jdz.png" mode="aspectFill" style="width: 100%; height: 100%;"></image>
</view>
<view class="middle-box">
<view class="middle-img">
<view>
<image src="../static/applyRelic/2.png" mode="aspectFill" />
</view>
<view>
<image src="../static/applyRelic/2.png" mode="aspectFill" />
</view>
<view>
<image src="../static/applyRelic/2.png" mode="aspectFill" />
</view>
</view>
<view class="middle-font">
<view>
申请历程
</view>
<view>
申遗缘由
</view>
<view>
遗产价值
</view>
</view>
</view>
<view class="apply-list">
<uv-list @scrolltolower="scrolltolower">
<uv-list-item
title="景德镇:保护文化遗产,复兴千年瓷都"
note="2024-09-01"
border="true"
v-for="(item,index) in 10" :key="index"
>
<template #footer>
<uv-image src="https://cdn.uviewui.com/uview/album/1.jpg" radius="10rpx" width="240rpx"
height="160rpx" />
</template>
</uv-list-item>
</uv-list>
</view>
<tabber />
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style scoped lang="scss">
.apply {
.top-img {
height: 380rpx;
}
.middle-box {
display: flex;
position: relative;
height: 220rpx;
align-items: center;
justify-content: space-around;
background-color: #fff;
.middle-img {
display: flex;
align-items: center;
justify-content: space-around;
width: 100%;
view {
width: 160rpx;
height: 160rpx;
image {
width: 100%;
height: 100%;
}
}
}
.middle-font {
position: absolute;
display: flex;
width: 100%;
justify-content: space-around;
view {
width: 60rpx;
color: #FFFDF6;
font-weight: 600;
}
}
}
.apply-list {
width: 94%;
margin-left: 3%;
/deep/ .uv-list-item{
background-color: #FFFDF6 !important;
}
}
}
</style>