device.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. <template>
  2. <view>
  3. <view class="device" v-for="item in devices" :key="item.code">
  4. <view class="col">
  5. <view class="switch" @click="changeStatus(item)">
  6. <switch checked color="#007AFE" @change="switchChange" />
  7. </view>
  8. <view class="list" @tap="showDetail" :data-code="item.code">查看 ></view>
  9. </view>
  10. <text class="title">{{item.name}}</text>
  11. <view class="content">
  12. <text>设备SN:{{item.sn}}</text>
  13. <text>设备类型:{{item.type}}</text>
  14. </view>
  15. </view>
  16. </view>
  17. </template>
  18. <script>
  19. export default {
  20. data() {
  21. return {
  22. devices: [],
  23. }
  24. },
  25. onLoad(e) {
  26. console.log(e);
  27. uni.request({
  28. url: 'http://127.0.0.1:9999/device/list?gatewayCode=' + e.code,
  29. method: 'GET',
  30. data: {},
  31. success: res => {
  32. this.devices = res.data.data.devices;
  33. console.log(this.devices);
  34. },
  35. });
  36. },
  37. methods: {
  38. switchChange(e) {
  39. },
  40. async changeStatus(item) {
  41. item.deviceStatus == 1 ? item.deviceStatus = 0 : item.deviceStatus = 1;
  42. console.log(item.deviceStatus);
  43. let vm = this;
  44. let url = uni.$api.device.update;
  45. let data = {
  46. code: item.code,
  47. deviceStatus: item.deviceStatus,
  48. ip: item.ip,
  49. name: item.name,
  50. sn: item.sn,
  51. type: item.type,
  52. operatorNumber: item.operatorNumber,
  53. projectNumber: item.projectNumber,
  54. gatewayNumber: item.gatewayNumber,
  55. operatorCode: item.operatorCode,
  56. projectCode: item.projectCode,
  57. gatewayCode: item.gatewayCode,
  58. };
  59. let res = await uni.$http.get(url, data);
  60. console.log(res);
  61. },
  62. showDetail(e) {
  63. console.log(e);
  64. var code = e.currentTarget.dataset.code;
  65. uni.navigateTo({
  66. url: '/pages/device/deviceInfo/deviceInfo?code=' + code,
  67. });
  68. }
  69. }
  70. }
  71. </script>
  72. <style>
  73. .list {
  74. font-size: 28rpx;
  75. color: #007AFF;
  76. margin-right: 20rpx;
  77. margin-top: 85rpx;
  78. }
  79. .switch {
  80. transform: scale(0.6);
  81. }
  82. .col {
  83. float: right;
  84. }
  85. .device {
  86. width: 702rpx;
  87. height: 230rpx;
  88. background-color: white;
  89. margin-top: 30rpx;
  90. margin-left: 24rpx;
  91. border-radius: 10rpx;
  92. padding-top: 30rpx;
  93. }
  94. .content {
  95. display: flex;
  96. flex-direction: column;
  97. margin-top: 30rpx;
  98. margin-left: 30rpx;
  99. line-height: 60rpx;
  100. color: #444546;
  101. font-size: 28rpx;
  102. }
  103. .title {
  104. font-size: 36rpx;
  105. margin-left: 30rpx;
  106. color: #282828;
  107. font-weight: 600;
  108. }
  109. </style>