oaNotifyList.vue 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. <template>
  2. <view>
  3. <uni-fab
  4. horizontal="right"
  5. vertical="bottom"
  6. @fabClick="toAdd"
  7. ></uni-fab>
  8. <u-search :show-action="false" v-model="searchForm.title" @change="inputWord" margin="20rpx 50rpx"></u-search>
  9. <view>
  10. <u-swipe-action>
  11. <view
  12. v-for="(notify, index) in dataList"
  13. :key="index">
  14. <u-swipe-action-item @click="del(notify.id)" :key="notify.id" :threshold="60" duration="500"
  15. :options="[ {
  16. text: '删除',
  17. style: {
  18. backgroundColor: '#f56c6c'
  19. }
  20. }]">
  21. <u-cell-group>
  22. <u-cell @click="toDetail(notify)">
  23. <u-avatar slot="icon" icon="bell-fill" fontSize="22" randomBgColor></u-avatar>
  24. <view slot="title" class="content">
  25. <view class="text-bold text-grey">
  26. <view class="ellipsis-description">
  27. 标题: {{notify.title}}
  28. </view>
  29. </view>
  30. <view class="text-gray text-sm">
  31. <view class="ellipsis-description">
  32. 发布者:{{notify.createBy.name}}, {{notify.createTime}}
  33. </view>
  34. </view>
  35. <view class="text-sm">
  36. <view class="ellipsis-description">
  37. 内容:{{notify.content}}
  38. </view>
  39. </view>
  40. </view>
  41. <view slot="right-icon">
  42. <u-tag :text="$dictUtils.getDictLabel('oa_notify_status', notify.status ,'')" v-if="notify.status === '1'" plain shape="circle"></u-tag>
  43. <u-tag :text="$dictUtils.getDictLabel('oa_notify_status', notify.status ,'')" v-else plain type="error" shape="circle"></u-tag>
  44. </view>
  45. </u-cell>
  46. </u-cell-group>
  47. </u-swipe-action-item>
  48. </view>
  49. </u-swipe-action>
  50. </view>
  51. <u-loadmore :status="status" @loadmore="loadmore" :line="true" />
  52. <u-gap height="40" bgColor="#fff"></u-gap>
  53. </view>
  54. </template>
  55. <script>
  56. import notifyService from "@/api/notify/notifyService";
  57. export default {
  58. data() {
  59. return {
  60. status: 'loadmore',
  61. searchForm: {
  62. title: ''
  63. },
  64. dataList: [],
  65. tablePage: {
  66. pages: 0,
  67. currentPage: 0,
  68. pageSize: 10,
  69. orders: [{ column: "a.create_time", asc: false }],
  70. },
  71. loading: false,
  72. }
  73. },
  74. created() {
  75. this.loadmore()
  76. },
  77. methods: {
  78. // 跳转到详细页面
  79. toDetail (notify) {
  80. if(notify.status === '1'){
  81. uni.navigateTo({
  82. url: '/pages/apps/notification/notificationDetail?id='+notify.id
  83. })
  84. }else{
  85. this.toEdit(notify)
  86. }
  87. },
  88. toEdit (notify) {
  89. uni.navigateTo({
  90. url: '/pages/apps/notification/oaNotifyForm?id='+notify.id
  91. })
  92. },
  93. toAdd (){
  94. uni.navigateTo({
  95. url: '/pages/apps/notification/oaNotifyForm'
  96. })
  97. },
  98. // 输入监听
  99. inputWord(e){
  100. this.searchTimer && clearTimeout(this.searchTimer)
  101. this.searchTimer = setTimeout(()=>{
  102. this.doSearch()
  103. },300)
  104. },
  105. // 搜索
  106. doSearch(){
  107. this.dataList = [];
  108. this.tablePage.currentPage = 0;
  109. this.tablePage.pageSize = 10;
  110. this.tablePage.pages = 0;
  111. this.loadmore()
  112. },
  113. onReachBottom() {
  114. this.loadmore()
  115. },
  116. loadmore() {
  117. if(this.tablePage.currentPage!==0 && this.tablePage.pages <= this.tablePage.currentPage ) {
  118. this.status = 'nomore';
  119. return;
  120. }
  121. this.tablePage.currentPage = ++ this.tablePage.currentPage;
  122. //联网加载数据
  123. this.status = 'loading';
  124. notifyService.list({
  125. current: this.tablePage.currentPage,
  126. size: this.tablePage.pageSize,
  127. orders: this.tablePage.orders,
  128. ...this.searchForm
  129. }).then((data)=>{
  130. //追加新数据
  131. this.dataList=this.dataList.concat(data.records);
  132. this.tablePage.pages = data.pages;
  133. if(this.tablePage.pages <= this.tablePage.currentPage){
  134. this.status = 'nomore'
  135. } else {
  136. this.status = 'loadmore'
  137. }
  138. })
  139. },
  140. del (id) {
  141. notifyService.delete(id).then((data)=>{
  142. this.doSearch()
  143. uni.showToast({
  144. title: data,
  145. icon:"success"
  146. })
  147. })
  148. },
  149. }
  150. }
  151. </script>