<template>
	<div>
		<div>
			<VideoDetails :isState="isState" ref="VideoDetailsRef" @onGetPageCommentNew="onGetPageCommentNew" />
		</div>
		<div>
			<TallList ref="tallList" v-show="!isState" />
		</div>
		<forumBtn :forumData="forumData" :isShow="[1, 3]"></forumBtn>
	</div>
</template>

<script setup>
	import Header from '@/views/portal/components/Header.vue'
	import BreadCrumb from '@/views/portal/components/BreadCrumb.vue'
	import Footer from '@/views/portal/components/Footer.vue'
	import VideoDetails from './components/VideoDetails.vue'
	import { useRoute, useRouter } from 'vue-router'
	import TallList from './components/TallList.vue'
	import { addViewCount, detail, add, queryList } from '@/api/portal'
	import EventBus from '@/utils/EventBus'
	import classCentre from '@/api/student/classCentre'

	const router = useRouter()

	const indexType = ref('resourceCenter')
	const itemData = ref({})
	const tallList = ref(null)
	const VideoDetailsRef = ref(null)
	const route = useRoute()
	const isState = ref(route.query.state || null)

	const onGetPageCommentNew = (item) => {
		tallList.value.onGetPageCommentNew(item)
	}
	const onChangeCurrent = (current) => {
		indexType.value = current

		router.push({
			path: '/' + current
		})
	}

	const setData = (item) => {
		getData(item)
	}
	const getData = (item) => {
		detail({ id: item.id })
			.then((res) => {
				if (res.code == 200) {
					itemData.value = res.data
					addFootprint()
				}
			})
			.catch((err) => {})
	}

	onMounted(() => {
		const id = route.query.id
		if (id != undefined && id != '') {
			addViewCount({ id: id })
			getData({ id: id })
		}
	})
	const addFootprint = () => {
		classCentre.footprintAdd({
			userFileId: route.query.id, //userfile文件id
			extendName: itemData.value.suffix, //扩展名
			fileId: itemData.value.fileId, //文件id
			fileName: itemData.value.fileName, //文件名称
			filePath: itemData.value.fileUrl, //文件路劲
			resourceRecordId: itemData.value.id //文件记录id
		})
	}
	const forumData = computed(() => {
		return {
			id: route.query.id,
			title: itemData.value.fileName
		}
	})
	defineExpose({
		setData
	})
</script>

<style scoped>
	.content {
		border: 1px solid #00000011; /* 灰色细边框 */
	}
	.scroll-container {
		height: 100vh;
		overflow-y: auto;
	}
</style>
