index.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. <template>
  2. <div class="table-box">
  3. <div class="card table-main">
  4. <!-- 表格头部 操作按钮 -->
  5. <div class="table-header">
  6. <div class="header-button-lf">
  7. <el-form :model="queryParams" label-width="auto" :inline="true">
  8. <el-form-item label="自动站:">
  9. <el-select v-model="queryParams.name" placeholder="请选择" clearable style="width: 200px;margin-left: 10px">
  10. <el-option label="站1" value="1" />
  11. <el-option label="站2" value="2" />
  12. </el-select>
  13. </el-form-item>
  14. <el-form-item label="观测时间:">
  15. <el-date-picker
  16. v-model="queryParams.time"
  17. type="date"
  18. placeholder="请选择"
  19. />
  20. </el-form-item>
  21. <el-form-item>
  22. <el-button type="primary" @click="handleQuery"> 查询 </el-button>
  23. <el-button style="margin-left: 10px" @click="resetQuery"> 重置 </el-button>
  24. </el-form-item>
  25. </el-form>
  26. </div>
  27. </div>
  28. <pdfViewer></pdfViewer>
  29. </div>
  30. </div>
  31. </template>
  32. <script setup lang="ts">
  33. import pdfViewer from "@/components/PDFEmbed/PdfViewer.vue";
  34. import { ref} from "vue";
  35. const queryParams = ref({
  36. name: '',
  37. time:''
  38. });
  39. // 查询功能
  40. const handleQuery = () => {
  41. };
  42. //搜索功能
  43. const resetQuery = () => {
  44. };
  45. </script>