manage.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. <template>
  2. <view class="mobile-item-container">
  3. <Navbar title="公告管理" bgColor="#fff" :h5Show="false"></Navbar>
  4. <Tabs :tabs="tabs" @change="tabChange" style="margin-bottom: 16px;"></Tabs>
  5. <Record v-if="activeKey == 'draft'" :list="list" @click="navigateTo"></Record>
  6. <Record v-if="activeKey == 'published'" :list="list" @click="navigateTo"></Record>
  7. <FloatButton type="primary" icon="plus" @click="navigateTo"></FloatButton>
  8. </view>
  9. </template>
  10. <script>
  11. import * as NoticeApi from '@/api/work/notice'
  12. import Navbar from '@/components/navbar/Navbar'
  13. import FloatButton from '@/components/button/FloatButton'
  14. import Tabs from '@/components/tabs/Tabs'
  15. import Record from './record'
  16. export default {
  17. components: {
  18. Navbar,
  19. FloatButton,
  20. Tabs,
  21. Record,
  22. },
  23. data () {
  24. return {
  25. activeKey: 'draft',
  26. tabs: [{
  27. name: '草稿',
  28. key: 'draft',
  29. }, {
  30. name: '已发布',
  31. key: 'published'
  32. }],
  33. params: {
  34. pageNum: 0,
  35. pageSize: 10
  36. },
  37. list: []
  38. }
  39. },
  40. created () {
  41. this.loadData()
  42. },
  43. methods: {
  44. // 加载通知公告数据
  45. loadData () {
  46. const app = this
  47. this.params.pageNum += 1;
  48. NoticeApi.noticeList(this.params).then(res => {
  49. app.list = res.rows;
  50. })
  51. },
  52. // 滚动分页加载数据
  53. scrolltolower () {
  54. this.loadData();
  55. },
  56. tabChange (tab) {
  57. this.activeKey = tab.key;
  58. this.params.pageNum = 0;
  59. this.loadData();
  60. },
  61. navigateTo (notice) {
  62. if (notice) {
  63. uni.navigateTo({ url: '/pages/work/notice/edit?id=' + notice.noticeId })
  64. } else {
  65. uni.navigateTo({ url: '/pages/work/notice/edit' })
  66. }
  67. }
  68. }
  69. }
  70. </script>
  71. <style lang="scss" scoped>
  72. .list-item {
  73. padding: 20rpx 0;
  74. border-bottom: 0.5px solid #ccc;
  75. }
  76. </style>