message.vue 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  1. <template>
  2. <view class="content">
  3. <view class="" v-if="show == true">
  4. <view class="" v-for="(obj, index) in tabList" :key="index">
  5. <view class="title">
  6. <text>设备ID:</text>
  7. <!-- :style="obj.status == 1 ? 'color: #00ff08;' : 'color: #ff0000;'" -->
  8. <text>
  9. {{ obj.deviceId }}
  10. </text>
  11. </view>
  12. <view class="">
  13. <view class="content_boby">
  14. <view class="content_boby_view">
  15. <text>设备名称:</text>
  16. <text :class="obj.status == 1 ? 'showFalw' : 'showTres'">
  17. {{ obj.deviceName }}
  18. </text>
  19. </view>
  20. </view>
  21. <view class="content_boby">
  22. <view class="content_boby_view" style="width: 100%">
  23. <text>日志内容:</text>
  24. <text :class="obj.status == 1 ? 'showFalw' : 'showTres'">
  25. {{ obj.content }}
  26. </text>
  27. </view>
  28. </view>
  29. <view class="content_boby">
  30. <view class="content_boby_view">
  31. <text>状态:</text>
  32. <text
  33. :class="obj.status == 1 ? 'showFalw' : 'showTres'"
  34. v-if="obj.status == 1">
  35. 连接正常
  36. </text>
  37. <text :class="obj.status == 1 ? 'showFalw' : 'showTres'" v-else>
  38. 连接中断
  39. </text>
  40. </view>
  41. </view>
  42. <view class="content_boby">
  43. <view class="content_boby_view">
  44. <text>时间:</text>
  45. <text :class="obj.status == 1 ? 'showFalw' : 'showTres'">
  46. {{ obj.createTime }}
  47. </text>
  48. </view>
  49. </view>
  50. <!-- <view class="content_boby">
  51. <view class="content_boby_view">
  52. <text>备注:</text>
  53. <text>{{ obj.remark }}</text>
  54. </view>
  55. </view> -->
  56. <view class="hr"></view>
  57. </view>
  58. </view>
  59. </view>
  60. <view class="text" style="text-align: center; margin: 10vw 0" v-else>
  61. <text>暂无数据</text>
  62. </view>
  63. </view>
  64. </template>
  65. <script>
  66. export default {
  67. components: {},
  68. data() {
  69. return {
  70. obj: {},
  71. show: true,
  72. page: 1,
  73. tabList: [],
  74. host: "",
  75. num: 1,
  76. deviceId: "",
  77. };
  78. },
  79. onLoad(option) {
  80. let _this = this;
  81. this.deviceId = option.id;
  82. uni.getStorage({
  83. key: "hostappst",
  84. success(res) {
  85. console.log("获取成功", res.data);
  86. _this.host = res.data;
  87. },
  88. });
  89. this.getData();
  90. },
  91. onShow() {},
  92. created() {},
  93. mounted() {},
  94. onReachBottom() {
  95. this.page = this.page + 1;
  96. this.getData("addList");
  97. },
  98. methods: {
  99. logReter(id) {
  100. uni.navigateTo({
  101. url: "/pages/index/me/log/log?id=" + id,
  102. });
  103. },
  104. getData(type) {
  105. let that = this;
  106. let data = { pageNum: this.page, pageSize: 10 };
  107. uni.getStorage({
  108. key: "GetPhone_Token",
  109. success: function (res) {
  110. uni.request({
  111. url: `http://${that.host}` + "/device/log/list",
  112. header: {
  113. Authorization: res.data,
  114. "content-type": "application/x-www-form-urlencoded",
  115. },
  116. data: data,
  117. method: "GET",
  118. success(respenon) {
  119. console.log("chaoShiPanDuan", respenon);
  120. if (respenon.data.code == 200) {
  121. if (type == "addList") {
  122. that.tabList = [...that.tabList, ...respenon.data.rows];
  123. } else {
  124. that.tabList = respenon.data.rows;
  125. if (that.tabList.length > 0) {
  126. that.show = true;
  127. } else {
  128. that.show = false;
  129. }
  130. }
  131. } else {
  132. uni.showToast({
  133. title: respenon.data.msg,
  134. icon: "none",
  135. });
  136. }
  137. },
  138. });
  139. },
  140. });
  141. },
  142. },
  143. };
  144. </script>
  145. <style scoped lang="scss">
  146. .content {
  147. color: #787878;
  148. font-size: 14px;
  149. font-weight: 400;
  150. .title {
  151. height: 44px;
  152. padding: 12px 15px;
  153. font-size: 17px;
  154. font-weight: 600;
  155. color: #000;
  156. }
  157. .content_boby {
  158. padding: 0 15px;
  159. display: flex;
  160. justify-content: space-between;
  161. margin-bottom: 10px;
  162. .showFalw {
  163. color: #0bbc11;
  164. }
  165. .showTres {
  166. color: red;
  167. // display: -webkit-box;
  168. // overflow-wrap: anywhere;
  169. word-wrap: break-word;
  170. }
  171. }
  172. .hr {
  173. width: 100%;
  174. height: 1px;
  175. background: #cfcfcf;
  176. }
  177. }
  178. </style>