QueryView.vue 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <template>
  2. <div style="display: flex; justify-content: space-between; align-items: center">
  3. <div>
  4. <a-form layout="inline" :model="formState">
  5. <a-form-item label="" style="width: 200px">
  6. <a-input v-model:value="formState.fileName" placeholder="请输入资源名称" allowClear />
  7. </a-form-item>
  8. </a-form>
  9. </div>
  10. <div>
  11. <a-button type="primary" @click="handleSearch">
  12. <template #icon><SearchOutlined /></template>
  13. 查询
  14. </a-button>
  15. <a-button style="margin-left: 10px" @click="handleReset">
  16. <template #icon><ReloadOutlined /></template>
  17. 重置
  18. </a-button>
  19. </div>
  20. </div>
  21. </template>
  22. <script setup>
  23. import { ref, onMounted } from 'vue'
  24. import { SearchOutlined, ReloadOutlined } from '@ant-design/icons-vue'
  25. import tool from '@/utils/tool'
  26. import { useRouter } from 'vue-router'
  27. import collegeApi from '@/api/college'
  28. const emit = defineEmits([])
  29. const router = useRouter()
  30. //发布按钮状态
  31. const releaseVisible = ref(false)
  32. const loading = ref(false) // 列表loading
  33. const formState = ref({
  34. fileName: '',
  35. }) // 列表loading
  36. const options = ref([
  37. // {
  38. // value: 'zhejiang',
  39. // label: 'Zhejiang',
  40. // isLeaf: false
  41. // },
  42. // {
  43. // value: 'jiangsu',
  44. // label: 'Jiangsu',
  45. // isLeaf: false
  46. // }
  47. ])
  48. // 搜索值
  49. const searchValue = ref('')
  50. const pagination = reactive({
  51. pageSize: 10,
  52. pageNum: 1,
  53. total: 0
  54. })
  55. const onChangeCurrent = (current) => {
  56. router.push({
  57. path: '/' + current
  58. })
  59. }
  60. const publishedData = ref()
  61. //发布确定
  62. // 上传资源模态框
  63. const uploadModalVisible = ref(false)
  64. const loadData = (selectedOptions) => {
  65. const targetOption = selectedOptions[selectedOptions.length - 1]
  66. targetOption.loading = true
  67. // load options lazily
  68. setTimeout(() => {
  69. targetOption.loading = false
  70. targetOption.children = [
  71. {
  72. label: `${targetOption.label} Dynamic 1`,
  73. value: 'dynamic1'
  74. },
  75. {
  76. label: `${targetOption.label} Dynamic 2`,
  77. value: 'dynamic2'
  78. }
  79. ]
  80. options.value = [...options.value]
  81. }, 1000)
  82. }
  83. const getList = () => {
  84. collegeApi.treeAll().then((data) => {
  85. options.value = data
  86. })
  87. }
  88. const handleSearch = () => {
  89. console.log('执行查询操作', formState.value)
  90. // 在这里添加查询逻辑
  91. emit('handlerSearch', formState.value)
  92. }
  93. // 重置按钮点击事件
  94. const handleReset = () => {
  95. formState.value = {
  96. fileName: '',
  97. // 其他需要重置的字段
  98. }
  99. emit('handlerSearch', formState.value)
  100. }
  101. onMounted(() => {
  102. // getListData()
  103. getList()
  104. })
  105. </script>
  106. <style scoped>
  107. .desc p {
  108. margin-bottom: 1em;
  109. }
  110. </style>