OnlineEducation-teacher-front/src/views/courseAdd/components/courseProduction/QueryView.vue

<template>
	<div style="display: flex; justify-content: space-between; align-items: center">
		<div>
			<a-form layout="inline" :model="formState">
				<a-form-item label="" style="width: 200px">
					<a-input v-model:value="formState.fileName" placeholder="请输入资源名称" allowClear />
				</a-form-item>

			</a-form>
		</div>
		<div>
			<a-button type="primary" @click="handleSearch">
				<template #icon><SearchOutlined /></template>
				查询
			</a-button>
			<a-button style="margin-left: 10px" @click="handleReset">
				<template #icon><ReloadOutlined /></template>
				重置
			</a-button>
		</div>
	</div>
</template>

<script setup>
	import { ref, onMounted } from 'vue'
	import { SearchOutlined, ReloadOutlined } from '@ant-design/icons-vue'
	import tool from '@/utils/tool'
	import { useRouter } from 'vue-router'
	import collegeApi from '@/api/college'

	const emit = defineEmits([])
	const router = useRouter()
	//发布按钮状态
	const releaseVisible = ref(false)
	const loading = ref(false) // 列表loading

	const formState = ref({
		fileName: '',
	}) // 列表loading

	const options = ref([
		// {
		// 	value: 'zhejiang',
		// 	label: 'Zhejiang',
		// 	isLeaf: false
		// },
		// {
		// 	value: 'jiangsu',
		// 	label: 'Jiangsu',
		// 	isLeaf: false
		// }
	])

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

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

	// 上传资源模态框
	const uploadModalVisible = ref(false)

	const loadData = (selectedOptions) => {
		const targetOption = selectedOptions[selectedOptions.length - 1]
		targetOption.loading = true

		// load options lazily
		setTimeout(() => {
			targetOption.loading = false
			targetOption.children = [
				{
					label: `${targetOption.label} Dynamic 1`,
					value: 'dynamic1'
				},
				{
					label: `${targetOption.label} Dynamic 2`,
					value: 'dynamic2'
				}
			]
			options.value = [...options.value]
		}, 1000)
	}
	const getList = () => {
		collegeApi.treeAll().then((data) => {
			options.value = data
		})
	}
	const handleSearch = () => {
		console.log('执行查询操作', formState.value)
		// 在这里添加查询逻辑

		emit('handlerSearch', formState.value)
	}

	// 重置按钮点击事件
	const handleReset = () => {
		formState.value = {
			fileName: '',
			// 其他需要重置的字段
		}
		emit('handlerSearch', formState.value)
	}
	onMounted(() => {
		// getListData()

		getList()
	})
</script>

<style scoped>
	.desc p {
		margin-bottom: 1em;
	}
</style>