rtuwarninglist.vue 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. <!--
  2. * @Title:
  3. * @Description: 测站异常列表信息
  4. * @Author: swp
  5. * @Date: 2022-08-24 10:49:21
  6. * @LastEditors:
  7. * @LastEditTime: 2022-08-24 10:49:21
  8. -->
  9. <template>
  10. <view class="wrap">
  11. <uni-nav-bar dark :fixed="true" backgroundColor="#3F9EFF" statusBar="false" left-icon="left" left-text="返回"
  12. @clickLeft="toBack">
  13. <view class="nav-title">
  14. <text>{{title}}</text>
  15. </view>
  16. </uni-nav-bar>
  17. <view class="container">
  18. <uni-list>
  19. <uni-list-item v-for="item in list" :key="item.id">
  20. <template v-slot:body>
  21. <view class="list-item-block">
  22. <view class="items-line">
  23. <image class="item-title-run-status-icon" src="/static/images/icon_warning.png"
  24. mode="widthFix">
  25. </image>
  26. <text class="item-title-rtu-name">{{item.rtuName}}</text>
  27. <text class="item-title-rtu-code">[{{item.rtuCode}}]</text>
  28. </view>
  29. <view class="items-line">
  30. <uni-icons class="input-uni-icon" type="calendar" size="18" color="lightblue" />
  31. <text class="item-text-lable">创建时间:</text>
  32. <text class="item-text-content">{{item.warningHappenTime}}</text>
  33. </view>
  34. <view class="items-line">
  35. <uni-icons class="input-uni-icon" type="reload" size="18" color="lightblue" />
  36. <text class="item-text-lable">恢复时间:</text>
  37. <text v-if="item.warningRecoveryTime!=null"
  38. class="item-text-content">{{item.warningRecoveryTime}}</text>
  39. </view>
  40. <view class="items-line">
  41. <uni-icons class="input-uni-icon" type="list" size="18" color="lightblue" />
  42. <text class="item-text-lable">异常类型:</text>
  43. <text v-if="item.warningKind==1" class="item-text-content">测站离线</text>
  44. <text v-else-if="item.warningKind==2" class="item-text-content">测站时钟异常</text>
  45. <text v-else-if="item.warningKind==3" class="item-text-content">测站雨量小时报漏报</text>
  46. <text v-else-if="item.warningKind==4" class="item-text-content">测站水位小时报漏报</text>
  47. <text v-else-if="item.warningKind==5" class="item-text-content">雨量5分钟上报延时</text>
  48. <text v-else-if="item.warningKind==6" class="item-text-content">雨量站小时上报延时</text>
  49. <text v-else-if="item.warningKind==7" class="item-text-content">水位站小时上报延时</text>
  50. <text v-else-if="item.warningKind==8" class="item-text-content">雨量疑似异常值</text>
  51. </view>
  52. <view class="items-line">
  53. <uni-icons class="input-uni-icon" type="compose" size="18" color="lightblue" />
  54. <text class="item-text-lable">异常信息:</text>
  55. </view>
  56. <view class="items-line">
  57. <text class="item-text-content" style="margin-left: 0px;">{{item.warningDesc}}</text>
  58. </view>
  59. </view>
  60. </template>
  61. </uni-list-item>
  62. </uni-list>
  63. <uni-group>
  64. <view class="pagination-block">
  65. <uni-pagination show-icon :page-size="pageSize" :current="pageCurrent" :total="total"
  66. @change="pageChange" />
  67. </view>
  68. </uni-group>
  69. </view>
  70. </view>
  71. </template>
  72. <script>
  73. import http from '@/http/api.js';
  74. export default {
  75. name: '',
  76. components: {
  77. },
  78. onLoad(option) {
  79. this.rtuCode = option.rtuCode;
  80. this.query = {};
  81. this.query['rtuCode'] = this.rtuCode;
  82. this.getPage();
  83. },
  84. data() {
  85. return {
  86. list: [],
  87. title: '异常测站信息',
  88. query: {},
  89. rtuCode: '',
  90. pageSize: 10,
  91. // 当前页
  92. pageCurrent: 1,
  93. // 数据总量
  94. total: 0,
  95. }
  96. },
  97. computed: {
  98. },
  99. onShow() {
  100. this.getPage();
  101. },
  102. created() {
  103. },
  104. methods: {
  105. toBack() {
  106. uni.navigateBack({
  107. delta: 1
  108. })
  109. },
  110. // 分页触发
  111. pageChange(e) {
  112. this.pageCurrent = e.current;
  113. this.getPage()
  114. },
  115. getPage(params = {}) {
  116. var that = this;
  117. const current = this.pageCurrent;
  118. const size = this.pageSize;
  119. let postData = Object.assign(params, this.query);
  120. http.request({
  121. url: '/galaxy-business/rtu/warning/page',
  122. method: 'GET',
  123. data: postData,
  124. params: {
  125. current,
  126. size,
  127. },
  128. }).then(res => {
  129. if (res.data.records != null) {
  130. that.list = res.data.records;
  131. }
  132. this.total = res.data.total;
  133. }).catch(err => {
  134. console.log(err)
  135. })
  136. },
  137. toWarningPage(id) {
  138. var url = '/pages/warning/warninginfodetail?id=' + id;
  139. uni.navigateTo({
  140. url: url
  141. })
  142. },
  143. }
  144. }
  145. </script>
  146. <style>
  147. /* page {
  148. background-color: rgb(240, 242, 244);
  149. } */
  150. </style>
  151. <style lang="scss" scoped>
  152. </style>