<template>
	<view class="listBox">
		<view class="bd-btm-item" :key='ind' v-for="(item,ind) in list" @click="clickList(item)"
			v-if="item.name != '影子' && item.name != '测试牛niu' &&item.name != '111'">
			<view class="item-img-box" :style="{'height': height + 'rpx'}" >
				<image :src="item.avatar" class="item-img" mode="widthFix" >
				</image>
			</view>
			<view class="item-info">
				<view class="item-name flex">
					<view class="clamp">
						{{item.name}}
					</view>
					<image class="item-name-image" :src="baseURL + '/resource/icon/rz.png'"
						v-if="item.is_type_audit == 1"></image>
				</view>
				<view class="item-where margin-t-10">
					{{item.age}}岁
				</view>
				<view class="flex margin-t-10">
					<view class="item-zy">
						{{item.user_work_type_title}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	import {
		mapState
	} from "vuex"
	export default {
		name: "mysList",
		data() {
			return {

			};
		},
		computed: {
			...mapState(['baseURL'])
		},
		props: {
			list: {
				type: Array,
				default: []
			},
			height: {
				type: Number,
				default: 330
			},
		},
		methods: {
			clickList(item) {
				const url = '/pages/user/model/model?uid=' + item.uid + '&mtype=' + item.show_template_id + '&type=2'
				uni.navigateTo({
					url,
				})
			}
		}
	};
</script>
<style scoped lang="scss">
	.listBox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		line-height: 1;

		.bd-btm-item {
			border-top: #f2f2f2 1px solid;
			width: 330rpx;
			margin-bottom: 20rpx;
			box-shadow: 6rpx 6rpx 6rpx 6rpx rgba(46, 46, 49, 0.06);
			border-radius: 20rpx;
			overflow: hidden;

			&:first-of-type {
				border-top: none;
			}

			.item-info {
				padding: 20rpx;

				.item-name {
					font-size: 31rpx;
					font-weight: bold;
					color: #333333;
					justify-content: flex-start;

					.item-name-image {
						flex-shrink: 0;
						width: 100rpx;
						height: 30rpx;
						margin-left: 10rpx;
					}
				}

				.item-zy {
					padding: 6rpx 20rpx;
					background: #fee7e4;
					border-radius: 5rpx;
					font-size: 22rpx;
					font-weight: 500;
					color: #F86859;
				}

				.item-vist,
				.item-where {
					color: #969696;
				}

				.item-vist {
					font-size: 22rpx;
					justify-items: flex-end;
				}

				.item-where {
					font-size: 24rpx;
				}
			}

			.item-img-box {
				line-height: 0;
				overflow: hidden;
				background-color: #eee;
			}

			.item-img {
				width: 330rpx;
				
			}

		}
	}
</style>