saas_miniprogram/components/course/handoutsBox.vue

<template>
	<view>
		<template v-if="handoutsId">
			<u-search v-if="isShowSearch" placeholder="搜索讲义名称" bg-color="#ffffff" margin="0 0 20rpx" v-model="fileName"
				@custom="search" @search="search"></u-search>

			<view class="handouts-box" v-for="item in courseHandoutsData.fileList" :key="item.fileId">
				<handouts-tree :canDownload="courseHandoutsData.canDownload" :isShowDownIcon="isShowDownIcon"
					:fileInfo="item"></handouts-tree>
			</view>
		</template>
		<view v-else style="text-align: center">暂无讲义</view>
	</view>
</template>

<script>
	import handoutsTree from "@/components/course/handoutsTree.vue";
	export default {
		name: "HandoutsBox",
		props: {
			handoutsId: {
				type: Number,
			},
			isShowSearch: {
				type: Boolean,
				default: true,
			},
			isShowDownIcon: {
				type: Boolean,
				default: true,
			},
			isBuy: {
				type: Boolean,
				default: true
			}
		},
		data() {
			return {
				fileName: "",
				courseHandoutsData: {},
			};
		},

		mounted() {
			this.handoutsId && this.courseHandouts();
		},
		methods: {
			search(val) {
				this.courseHandouts();
			},
			courseHandouts() {
				console.log("阿达")
				this.$api[this.isBuy ? 'courseHandouts' : 'appcommoncourseHandouts']({
						handoutsId: this.handoutsId,
						fileName: this.fileName,
					})
					.then((res) => {
						this.courseHandoutsData = res.data.data;
					});
			},
		},

		components: {
			handoutsTree,
		},
	};
</script>

<style lang="scss" scoped>
	.handouts-box {
		border-radius: 20rpx;
		background: #ffffff;
		margin-bottom: 20rpx;
	}
</style>