commonList.vue 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. <template>
  2. <view>
  3. <view class="list_search card_banner flex">
  4. <uni-datetime-picker class="list_search_date" v-model="searchForm.createTime" type="daterange" />
  5. <u-icon class="list_search_icon" name="search" color="#fff" size="28" @click="doSearch"></u-icon>
  6. </view>
  7. <view class="list_content">
  8. <u-cell-group>
  9. <u-cell v-for="item in dataList" @click="toInfo(item)">
  10. <view slot="title">
  11. <view class="text-bold text-black">
  12. <view class="ellipsis-description">
  13. {{item.name}}
  14. </view>
  15. </view>
  16. </view>
  17. <view slot="value">
  18. <view class="text-grey text-sm list_label margin-top">
  19. {{item.createTime}}
  20. </view>
  21. <view>
  22. <u-tag v-if="type==5" :text="item.state==1?'待办':item.state == 3?'归档':'已办'" plain
  23. :type="item.state==1?'warning':item.state == 3?'primary':'success'">
  24. </u-tag>
  25. </view>
  26. </view>
  27. <view slot="label">
  28. <view class="text-grey margin-top">
  29. {{item.authorPerson}}
  30. </view>
  31. </view>
  32. </u-cell>
  33. </u-cell-group>
  34. </view>
  35. <u-loadmore :status="status" />
  36. </view>
  37. </template>
  38. <script>
  39. import yzCirculationCardService from '@/api/commonseal/yzCirculationCardService.js'
  40. import yzFlowService from '@/api/commonseal/yzFlowService.js'
  41. import * as $auth from "@/common/auth.js"
  42. export default {
  43. onShow() {
  44. // 先获取页面栈
  45. let pages = getCurrentPages();
  46. // 当前页面的前一个页面
  47. let prevPage = pages[pages.length - 1];
  48. if (prevPage.options.type) {
  49. this.dataList = []
  50. this.type = prevPage.options.type
  51. switch (prevPage.options.type) {
  52. case "1":
  53. uni.setNavigationBarTitle({
  54. title: '待办列表' // 设置为你想要显示的标题文本
  55. });
  56. break;
  57. case "3":
  58. uni.setNavigationBarTitle({
  59. title: '归档列表' // 设置为你想要显示的标题文本
  60. });
  61. break;
  62. case "4":
  63. uni.setNavigationBarTitle({
  64. title: '已办列表' // 设置为你想要显示的标题文本
  65. });
  66. break;
  67. case "5":
  68. uni.setNavigationBarTitle({
  69. title: '公文列表' // 设置为你想要显示的标题文本
  70. });
  71. break;
  72. }
  73. this.searchForm.state = prevPage.options.type
  74. this.tablePage.currentPage = 0
  75. this.status = 'loading';
  76. this.loadmore()
  77. }
  78. },
  79. data() {
  80. return {
  81. status: 'loadmore',
  82. type: "",
  83. time: "",
  84. value: "",
  85. range: [],
  86. dataList: [],
  87. searchForm: {
  88. yearNum: '',
  89. cardNum: '',
  90. state: '',
  91. createTime: ""
  92. },
  93. tablePage: {
  94. pages: 0,
  95. currentPage: 0,
  96. pageSize: 10,
  97. orders: [{
  98. column: "a.create_time",
  99. asc: false
  100. }],
  101. },
  102. loading: false,
  103. }
  104. },
  105. methods: {
  106. // 查看详情
  107. toInfo(item) {
  108. if (this.type == 3 || this.type == 5 || this.type == 4) {
  109. uni.navigateTo({
  110. url: '/pages/commonseal/commonInfo?id=' + item.id
  111. })
  112. } else {
  113. uni.navigateTo({
  114. url: '/pages/commonseal/examineCommon?id=' + item.id
  115. })
  116. }
  117. },
  118. // 搜索
  119. doSearch() {
  120. this.dataList = [];
  121. this.tablePage.currentPage = 0;
  122. this.tablePage.pageSize = 10;
  123. this.tablePage.pages = 0;
  124. this.loadmore()
  125. },
  126. onReachBottom() {
  127. this.loadmore()
  128. },
  129. loadmore() {
  130. if (this.tablePage.currentPage !== 0 && this.tablePage.pages <= this.tablePage.currentPage) {
  131. this.status = 'nomore';
  132. return;
  133. }
  134. this.tablePage.currentPage = ++this.tablePage.currentPage;
  135. //联网加载数据
  136. this.status = 'loading';
  137. let {
  138. createTime,
  139. ...newForm
  140. } = this.searchForm
  141. yzCirculationCardService.list({
  142. current: this.tablePage.currentPage,
  143. size: this.tablePage.pageSize,
  144. orders: this.tablePage.orders,
  145. beginCreateDate: this.searchForm.createTime ? this.searchForm.createTime[0] : '',
  146. endCreateDate: this.searchForm.createTime ? this.searchForm.createTime[1] : '',
  147. ...newForm
  148. }).then((data) => {
  149. //追加新数据
  150. this.dataList = this.dataList.concat(data.records);
  151. this.tablePage.pages = data.pages;
  152. if (this.tablePage.pages <= this.tablePage.currentPage) {
  153. this.status = 'nomore'
  154. } else {
  155. this.status = 'loadmore'
  156. }
  157. })
  158. }
  159. }
  160. }
  161. </script>
  162. <style>
  163. .card_banner {
  164. width: 100%;
  165. height: 60px;
  166. background-color: #36a7f3;
  167. }
  168. .ellipsis-description {
  169. font-size: 18px;
  170. }
  171. .u-transition {
  172. align-items: flex-end;
  173. }
  174. .list_search_icon {
  175. line-height: 60px;
  176. }
  177. .list_search_select {
  178. width: 200px;
  179. background-color: #fff;
  180. height: 30px;
  181. border-radius: 10px;
  182. margin: 15px 5px 0;
  183. }
  184. .list_search_date {
  185. margin: 8px 5px 0;
  186. }
  187. .t-c {
  188. height: 34px;
  189. line-height: 34px;
  190. }
  191. .list_content {
  192. background-color: #fff;
  193. }
  194. .list_label {
  195. margin-top: 33px;
  196. }
  197. </style>