monitorList.vue 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <template>
  2. <view class="device-list-index">
  3. <project-drop-down @change="change"></project-drop-down>
  4. <view class="device-list">
  5. <view class="device-item-box" v-for="(item,index) in monitorList" :key="index"
  6. @click="$navigateTo('/pageIndex/monitor/monitor')">
  7. <view class="item-box">
  8. <view class="item-icon">
  9. <uni-icons :type="item.iconName" custom-prefix="iconfont" :size="item.iconSize" color="#c3c3c3">
  10. </uni-icons>
  11. </view>
  12. <view class="item-label">{{item.name}}</view>
  13. <view class="item-sub-label">
  14. <view class="label">{{item.positionName}}</view>
  15. <view class="line"></view>
  16. <view class="label" v-if="item.state === 1">{{item.isOpen ? item.describe : '在线'}}</view>
  17. <view class="label" v-else>离线</view>
  18. </view>
  19. </view>
  20. </view>
  21. </view>
  22. </view>
  23. </template>
  24. <script>
  25. import projectDropDown from '@/pageIndex/components/common/projectDropDown.vue'
  26. import monitorList from '@/uitls/monitorList.js';
  27. export default {
  28. data() {
  29. return {
  30. monitorList: []
  31. }
  32. },
  33. onShow() {
  34. this.monitorList = monitorList;
  35. },
  36. methods: {
  37. change(e) {
  38. if (e.name === 'room') {
  39. if (e.value === 'all') return this.monitorList = monitorList;
  40. this.monitorList = monitorList.filter(node => node.positionName === e.label);
  41. }
  42. }
  43. },
  44. components: {
  45. projectDropDown
  46. },
  47. }
  48. </script>
  49. <style lang="scss">
  50. </style>