<template>
	<div class="courseManagement">
		<QueryView style="margin-top: 10px" @handlerSearch="handlerSearch"></QueryView>
		<!-- 新建课程按钮 -->
		<a-button style="margin-top: 10px" type="primary" @click="handleNewCourse">
			<template #icon>
				<PlusOutlined />
			</template>
			新建课程
		</a-button>
		<div style="height: 10px"></div>
		<ListView
			ref="listViewRef"
			style="margin-top: 10px"
			@handleEdit="handleEdit"
			@handleDetail="handleDetail"
		></ListView>
		<DialogView ref="dialogViewRef"></DialogView>
		<a-modal v-model:visible="courseModalVisible" :title="courseModalTitle" width="70%" :footer="null">
			<CourseAdd :courseInfoId="courseInfoId"></CourseAdd>
		</a-modal>
		<a-modal v-model:visible="courseDetailModalVisible" title="详情" width="70%">
			<CourseDetail :courseId="courseInfoId"></CourseDetail>
		</a-modal>
	</div>
</template>

<script setup>
	import { ref, onMounted } from 'vue'
	import { PlusOutlined } from '@ant-design/icons-vue'
	import QueryView from './components/QueryView.vue'
	import ListView from './components/ListView.vue'
	import DialogView from './components/DialogView.vue'
	import CourseAdd from '@/views/courseAdd/index.vue'
	import CourseDetail from '@/views/courseDetails/index.vue'
	import EventBus from '@/utils/EventBus'
	const listViewRef = ref(null)
	const dialogViewRef = ref(null)
	const courseModalVisible = ref(false)
	const courseModalTitle = ref('')
	const courseInfoId = ref('')
	const courseDetailModalVisible = ref(false)

	// 搜索值
	const searchValue = ref('')
	const open = ref(false)

	const handleNewCourse = () => {
		// 在这里添加新建课程的逻辑
		// dialogViewRef.value.open()

		// router.push({
		// 	path: '/portal/courseAdd'
		// })
		courseInfoId.value = null
		courseModalVisible.value = true
		courseModalTitle.value = '新建课程'
	}
	const handlerSearch = (data) => {
		// 在这里添加新建课程的逻辑
		listViewRef.value.setList(data)
	}
	const handleEdit = (item) => {
		// router.push({
		// 	path: '/portal/courseAdd',
		// 	query: {
		// 		id: item.courseId
		// 	}
		// })
		courseModalVisible.value = true
		courseModalTitle.value = '编辑课程'
		courseInfoId.value = item.courseId
	}
	const handleDetail = (item) => {
		courseDetailModalVisible.value = true
		courseInfoId.value = item.courseId
	}

	const pagination = reactive({
		pageSize: 10,
		pageNum: 1,
		total: 0
	})
	const onChangeCurrent = (current) => {
		// router.push({
		// 	path: '/' + current
		// })
	}
	const publishedData = ref()
	//发布确定

	// 上传资源模态框
	const uploadModalVisible = ref(false)
	EventBus.on('handleEdit', (data) => {
		handleEdit(data)
	})
	onMounted(() => {
		// getListData()
	})
</script>

<style lang="less" scoped>
	.courseManagement {
		background: #fff;
		padding: 24px;
		border-radius: 8px;
	}
	.desc p {
		margin-bottom: 1em;
	}
</style>
