mplace_source/components/zaiui-common/view/resource - 副本.vue

<template>
	<view class="zaiui-news-box" :class="show?'show':''">
		<!--标题栏-->
		<bar-title bgColor="bg-white" title="资源" :isBack="false">
			<block slot="content">资源</block>
		</bar-title>
		
		<!--消息列表-->
		<view class="bg-white zaiui-news-list-box">
			<view class="margin-bottom cu-list menu-avatar">
				
				<view class="cu-item goods" v-for="item in list" :key="item.id" :class="modalName=='move-box-'+ 1?'move-cur':''" :data-id="item.id" @tap="tapNews">
					<view class="action">
						<view class="cu-avatar radius" :style="`background-image:url(${item.pic});`"/>
					</view>
					<view class="content">
						<view class="text-black">
							<text class="margin-right-xs">{{item.name}}</text>
							<!-- <text class="cu-tag bg-blue sm radius">
								<text class="cuIcon-male"></text>
							</text> -->
						</view>
						<view class="text-gray text-sm text-cut">{{item.info||'-'}}</view>
						<view class="text-gray text-sm">{{item.cdate_str}}</view>
					</view>
				</view>
				
			</view>
		</view>
		
		<!--占位底部距离-->
		<view class="cu-tabbar-height"/>
	</view>
</template>

<script>
	import barTitle from '@/components/zaiui-common/basics/bar-title';
	
	import _tool from '@/static/zaiui/util/tools.js';	//工具函数
	export default {
		name: 'news',
		components: { 
			barTitle
		},
		data() {
			return {
				list: [],
				modalName: ''
			}
		},
		props: {
			show: {
				type: Boolean,
				default: true
			},
			scrollY: {
				type: Number,
				default: 0
			},
			scrollBottom: {
				type: Number,
				default: 0
			}
		},
		watch: {
			
		},
		created() {
			//加载虚拟数据
			this.loadList()
		},
		mounted() {
			_tool.setBarColor(true);
			uni.pageScrollTo({
			    scrollTop: 0,
			    duration: 0
			});
		},
		methods: {
			loadList() {
				this.req({
					url: '?l=resource.home', 
					data: {type: 1},
					success: res => {
						if(res.data.status == 1) {
							console.log(res.data.data)
							this.list = res.data.data.list;
						}else {
							this.error = res.data.msg
						}
					}
				})
			},
			//被点击
			tapNews(e) {
				uni.navigateTo({
					url: '/pages/goods/resource?id='+e.currentTarget.dataset.id
				});
					
			}
		}
	}
</script>

<style lang="scss" scoped>
	.zaiui-news-box {
		width: 100%;
		display: none;
		.zaiui-follow-box {
			.action-text-cut {
				width: 70%;
			}
		}
		.zaiui-grid-menu {
			.cu-list.grid.no-border>.cu-item {
				.cu-avatar {
					margin: 0 auto;
				}
			}
		}
		.zaiui-news-list-box {
			padding: 0 9.09upx;
			.cu-list.menu-avatar>.cu-item>.cu-avatar {
				width: 81.81upx;
				height: 81.81upx;
			}
			.cu-list.menu-avatar>.cu-item {
				height: 163.63upx;
				align-items: inherit;
				.cu-avatar {
					margin-top: 25.45upx;
					.cu-tag.badge {
					    width: 21.81upx;
					    height: 21.81upx;
					    top: 0;
					    right: 0;
					    border: 1.81upx solid #fff;	
					}
				}
				.content {
				    left: 160upx;
					margin-top: 18.18upx;
				    width: calc(100% - 90.9upx - 54.54upx - 18.18upx);
				    line-height: 1.7em;	
					.cu-tag {
						padding: 0 3.63upx;
						text {
							position: relative;
							top: -2upx;
						}
					}
				}
				&:after {
					width: 0;
					height: 0;
					border-bottom: 0;
				}
			}
			.cu-list.menu-avatar>.cu-item.goods {
				.content {
				    width: calc(100% - 309.09upx);
				}
				.action {
					position: absolute;	
				    left: 11upx;
					width: 127.27upx;
					.cu-avatar {
						width: 127.27upx;
						height: 127.27upx;
						margin-top: 18.18upx;
					}
				}
			}
		}
	}
	.zaiui-news-box.show {
		display: block;
	}
</style>