index.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. <template>
  2. <div class="app-container">
  3. <SearchBoxVue :data="searchData" @search="handleSearch" />
  4. <TableBoxVue :loading="loading" :data="tableData" style="margin-top: -40px;" @refresh="handleRefresh" @export="handleExport" />
  5. <pagination
  6. :auto-scroll="false"
  7. :total="paginationData.total"
  8. :page="paginationData.page"
  9. :limit="paginationData.limit"
  10. @pagination="handlePagination"
  11. />
  12. </div>
  13. </template>
  14. <script>
  15. import SearchBoxVue from './components/SearchBox.vue'
  16. import TableBoxVue from './components/TableBox.vue'
  17. import { data_source_list, options_list } from '@/api/rule/data'
  18. export default {
  19. components: {
  20. SearchBoxVue,
  21. TableBoxVue
  22. },
  23. data() {
  24. return {
  25. loading: false,
  26. searchData: {
  27. qingmiao_table_name: '',
  28. qingmiao_field_name: '',
  29. qingmiao_field: '',
  30. hospital_name: '',
  31. hospital_field: ''
  32. },
  33. tableData: [],
  34. paginationData: {
  35. total: 0,
  36. page: 1,
  37. limit: 10
  38. },
  39. options: {
  40. qingmiao_table_name: [],
  41. qingmiao_field_name: [],
  42. qingmiao_field: [],
  43. hospital_name: [],
  44. hospital_field: []
  45. }
  46. }
  47. },
  48. created() {
  49. this.getOptionsData()
  50. this.getList()
  51. },
  52. methods: {
  53. // 质控项目
  54. getOptionsData() {
  55. options_list().then(res => {
  56. const { p } = res
  57. this.objects = Array.isArray(p) ? p : []
  58. })
  59. },
  60. handleRefresh() {
  61. this.getList()
  62. },
  63. async getList() {
  64. const {
  65. qingmiao_table_name,
  66. qingmiao_field_name,
  67. qingmiao_field,
  68. hospital_name,
  69. hospital_field
  70. } = this.searchData
  71. const { page, limit } = this.paginationData
  72. const params = {
  73. qingmiao_table_name,
  74. qingmiao_field_name,
  75. qingmiao_field,
  76. hospital_name,
  77. hospital_field,
  78. page,
  79. page_size: limit
  80. }
  81. this.loading = true
  82. data_source_list(params).then(res => {
  83. const { p } = res
  84. this.paginationData.total = p.count
  85. this.tableData = p.list
  86. }).catch(error => {
  87. console.log(error)
  88. }).finally(() => {
  89. this.loading = false
  90. })
  91. },
  92. handlePagination(param) {
  93. this.paginationData.page = param.page
  94. this.paginationData.limit = param.limit
  95. this.getList()
  96. },
  97. handleSearch() {
  98. this.paginationData.page = 1
  99. this.getList()
  100. }
  101. }
  102. }
  103. </script>
  104. <style lang="scss" scoped>
  105. </style>