WenWuGuanJia/index_fenbao/fuWu/jiJin/jiJin.vue

<template>
	<view class="box">
		<u-navbar :autoBack="true" title="志愿捐助" bgColor="rgba(255,255,255,0)" :placeholder="true" titleStyle="font-weight:bold;color:#000000"></u-navbar>
		<view>
			<u-swiper
				:list="swiperList"
				:height="180"
				:indicator="true"
				radius="5"
				:autoplay="true"
				:circular="true"
				indicatorStyle="bottom: 10px"
				indicatorMode="dot"
				indicatorActiveColor="#fff"
				indicatorInactiveColor="rgba(255, 255, 255, 0.35)"
			></u-swiper>
		</view>
		<view class="map_tit">
			<image style="width: 186rpx; height: 40rpx" src="/static/img/right_img.png"></image>
			<view class="">文保项目</view>
			<image style="width: 186rpx; height: 40rpx" src="/static/img/left_img.png"></image>
		</view>
		<view class="ban_box">
			<u-empty text="暂无项目" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty>

			<!-- 		<view class="item" v-for="(itemn, index) in 2" :key="item.index" :class="{ active: index % 2 === 1 }">
				<view class="" style="display: flex">
					<view style="position: absolute; top: -40rpx">
						<image style="width: 190rpx; height: 245rpx" src="https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/wb_img.png"></image>
					</view>
					<view class="item_tit" style="margin-left: 220rpx">
						<view class="">
							<view class="">文保名称：</view>
							<view class="">简介：</view>
						</view>
						<view style="margin-top: 30rpx">
							<view class="">进展情况：</view>
							<view class="">参与人员：</view>
						</view>
					</view>
				</view>
				<view class="tjxc">立即捐赠</view>
			</view> -->
		</view>

		<view class="map_tit">
			<image style="width: 186rpx; height: 40rpx" src="/static/img/right_img.png"></image>
			<view class="">联系我们</view>
			<image style="width: 186rpx; height: 40rpx" src="/static/img/left_img.png"></image>
		</view>
		<view class="lx_box">
			<view class="">厦门市文旅局</view>
			<view class="">地址:厦门市思明区体育路95-17号</view>
			<!-- <view class="">0592-5371993</view> -->
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			swiperList: ['https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/gj_zyjz.jpg']
		};
	},
	onLoad() {
		this.getMainBodyColumnContentList();
	},
	methods: {
		getMainBodyColumnContentList() {
			this.$api.getMainBodyColumnContentList({ main_body_id: 1, model_id: 12 }, function (res) {
				console.log(res, '文保基金');
			});
		}
	}
};
</script>

<style>
.box {
	width: 100%;
	padding-bottom: 50rpx;
	background-image: url('https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/xy_bgt.png');
	background-repeat: repeat-y;
	background-attachment: fixed;
	background-size: 100% 100%;
	min-height: 100%;
	height: auto;
	/* background-color: #fff9e9; */
}
.active {
	order: 2;
	background-color: #a6c8ca !important;
}
.map_tit {
	display: flex;
	align-items: center;
	margin-left: 125rpx;
	margin-top: 50rpx;
	margin-bottom: 20rpx;
	font-size: 32rpx;
	font-family: Songti SC, Songti SC;
	font-weight: 900;
	line-height: 52rpx;
	color: #444444;
}
.ban_box {
	width: 90%;
	margin: auto;
	/* margin-top: 80rpx; */
}
.item {
	position: relative;
	display: flex;
	justify-content: space-between;
	width: 680rpx;
	height: 260rpx;
	margin-top: 85rpx;
	padding: 20rpx;
	border-radius: 10rpx;
	background-color: #b0c3a1;
}
.tjxc {
	width: 180rpx;
	height: 50rpx;
	margin-top: 150rpx;
	font-size: 30rpx;
	font-weight: 600;
	color: #8e470c;
	line-height: 50rpx;
	text-align: center;
	background-image: url('/static/img/search_bg1.png');
	background-size: 100% 100%;
}
.item_tit {
	font-size: 30rpx;
	font-weight: 600;
}

.lx_box {
	width: 90%;
	height: 200rpx;
	margin: auto;
	text-align: center;
	margin-top: 20rpx;
	padding-top: 55rpx;
	line-height: 50rpx;
	border-radius: 10rpx;
	background-color: #f8e8c3;
}
</style>