post.vue 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. <script setup lang="ts">
  2. import { ref } from 'vue'
  3. import { token } from '../plugins/pinia'
  4. import service from '../plugins/axios'
  5. import { Search } from '@element-plus/icons-vue'
  6. import Postlist from '../views/post/postlist.vue'
  7. const totalPage = ref(0)
  8. const handleCurrentChange = async (val: number) => {
  9. if (postsearch.value) {
  10. const data = (
  11. await service({
  12. url: `admin/searchPost?page=1&limit=5&search=${val}`,
  13. method: 'get',
  14. headers: {
  15. Authorization: `Bearer ${token().token}`,
  16. },
  17. })
  18. ).data
  19. posts.value = data.data
  20. totalPage.value = data.totalPage
  21. } else {
  22. const data = (
  23. await service({
  24. url: `/admin/getPostList?page=${val}&limit=5`,
  25. method: 'get',
  26. headers: {
  27. Authorization: `Bearer ${token().token}`,
  28. },
  29. })
  30. ).data
  31. posts.value = data.data
  32. totalPage.value = data.totalPage
  33. }
  34. }
  35. const data = (
  36. await service({
  37. url: `/admin/getPostList?page=1&limit=5`,
  38. method: 'get',
  39. headers: {
  40. Authorization: `Bearer ${token().token}`,
  41. },
  42. })
  43. ).data
  44. const posts = ref(data.data)
  45. totalPage.value = data.totalPage
  46. // console.log(posts.value)
  47. const postsearch = ref('')
  48. const bt_search = async (val: string) => {
  49. const data = (
  50. await service({
  51. url: `admin/searchPost?page=1&limit=5&search=${val}`,
  52. method: 'get',
  53. headers: {
  54. Authorization: `Bearer ${token().token}`,
  55. },
  56. })
  57. ).data
  58. posts.value = data.data
  59. totalPage.value = data.totalPage
  60. }
  61. </script>
  62. <template>
  63. <el-input v-model="postsearch"
  64. placeholder="请输入标题/内容搜索">
  65. <template #append>
  66. <el-button :icon="Search"
  67. @click="bt_search(postsearch)" />
  68. </template>
  69. </el-input>
  70. <Postlist :posts="posts" />
  71. <el-pagination background
  72. layout="prev, pager, next"
  73. :page-count="totalPage"
  74. @current-change="handleCurrentChange" />
  75. </template>
  76. <style scoped lang="scss">
  77. </style>