table.stub 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. <template>
  2. <div>
  3. <Search :search="search" :reset="reset">
  4. <template v-slot:body>
  5. {search}
  6. </template>
  7. </Search>
  8. <div class="table-default">
  9. <Operate :show="open" />
  10. <el-table :data="tableData" class="mt-3" v-loading="loading"{tree}>
  11. {table}
  12. <el-table-column label="操作" width="200">
  13. <template #default="scope">
  14. <Update @click="open(scope.row.id)" />
  15. <Destroy @click="destroy(api, scope.row.id)" />
  16. </template>
  17. </el-table-column>
  18. </el-table>
  19. <Paginate />
  20. </div>
  21. <Dialog v-model="visible" :title="title" destroy-on-close>
  22. <Create @close="close(reset)" :primary="id" :api="api" />
  23. </Dialog>
  24. </div>
  25. </template>
  26. <script lang="ts" setup>
  27. import { computed, onMounted } from 'vue'
  28. import Create from './create.vue'
  29. import { useGetList } from '/admin/composables/curd/useGetList'
  30. import { useDestroy } from '/admin/composables/curd/useDestroy'
  31. import { useOpen } from '/admin/composables/curd/useOpen'
  32. const api = '{api}'
  33. {useList}
  34. const { destroy, deleted } = useDestroy()
  35. const { open, close, title, visible, id } = useOpen()
  36. const tableData = computed(() => data.value?.data)
  37. onMounted(() => {
  38. search()
  39. deleted(reset)
  40. })
  41. </script>