<template>
	<view class="padding-lr">
		<view v-for="(section,i) in mineItems" :key="i">
			<u-gap height="15"/>
			<view class="cu-card padding radius shadow bg-white">
				<text class="text-bold padding-sm"> {{ section.title }} </text>
				<htz-image-upload :max="3" v-model="section.files" mediaType="all" @chooseSuccess="chooseSuccess" />
			</view>
		</view>	
	</view>
</template>

<script>
	import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue'
	export default {
		components:{ htzImageUpload },
		data() {
			return {
				mineItems: [
					{'index': 0, 'title': '课前', files: []},
					// {'index': 1, 'title': '课中', files: []},
					// {'index': 2, 'title': '课后', files: []},
				]
			};
		},
		methods: {
			chooseSuccess(res){
				this.mineItems[0].files.push(res)
	        },
		}
	}
</script>


<style lang="scss">
	.mine {
		width: 100%;
		position: absolute;
		display: flex;
		flex-direction: column;
		height: 100%;
		.mine-top {
			width: 100%;
			.mine-bg {
				width: 100%;
				height: 55vw;
			}
		}
		.mine-content {
			position: absolute;
			top: 20vw;
			width: 90%;
			left: 5%;
			.mine-card{
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				.user-card-top {
					position: absolute;
					top: 0;
					left: 0;
					align-self: flex-start;
					width: 40px;
					height: 20px;
				}
			}
		}
	}
</style>