monitor.wxml 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. <!--pages/teacher/monitor/monitor.wxml-->
  2. <view wx:if="{{pageState==0}}" class="container" style="background-color: #F4F4F4;">
  3. <view class="qrcode_layout">
  4. <view class="qrcode_layout_bg" bindtap="scanCode">
  5. <image src="../../../image/teacher/qrcode.png" style="width:60rpx;height:60rpx"></image>
  6. <text>扫一扫</text>
  7. </view>
  8. </view>
  9. <view class="center_layout">
  10. <text class="center_title">上课地点</text>
  11. <view class="center_picker_layout">
  12. <!--选择地区-->
  13. <view class="item_input_bg" style=" margin-top: 0rpx; box-shadow: 0px 1px 0px 0px #EEEEEE;">
  14. <text class="item_input_title">地区:</text>
  15. <picker mode="multiSelector" bindchange="bindRegionChange" bindcolumnchange="bindMultiPickerColumnChange" range="{{region}}" class="item_picker_bg" value="{{regionIndex}}">
  16. <view class="item_picker_content">
  17. <p> {{region[0][regionIndex[0]]}} </p>
  18. <p> {{region[1][regionIndex[1]]}} </p>
  19. <p> {{region[2][regionIndex[2]]}} </p>
  20. </view>
  21. </picker>
  22. <view class="item_picker_icon_layout">
  23. <image src="../../../image/teacher/dropdown_icon.png" class="item_picker_icon"></image>
  24. </view>
  25. </view>
  26. <!--选择地区 end-->
  27. <!--选择学校-->
  28. <view class="item_input_bg" style=" margin-top: 2rpx;box-shadow: 0px 1px 0px 0px #EEEEEE;">
  29. <text class="item_input_title">学校:</text>
  30. <picker mode="multiSelector" bindcolumnchange="bindSchoolPicker" range="{{schoolArray}}" value="{{[schoolIndex,0]}}" class="item_picker_bg">
  31. <view class="item_picker_content">
  32. {{schoolArray[0][schoolIndex]}}
  33. </view>
  34. </picker>
  35. <view class="item_picker_icon_layout">
  36. <image src="../../../image/teacher/dropdown_icon.png" class="item_picker_icon"></image>
  37. </view>
  38. </view>
  39. <!--选择学校end-->
  40. <!--选择班级-->
  41. <view class="item_input_bg" style=" margin-top: 2rpx;box-shadow: 0px 1px 0px 0px #EEEEEE;">
  42. <text class="item_input_title">班级:</text>
  43. <picker bindchange="bindClssPicker" value="{{classIndex}}" range="{{classArray}}" class="item_picker_bg">
  44. <view class="item_picker_content">
  45. {{classArray[classIndex]}}
  46. </view>
  47. </picker>
  48. <view class="item_picker_icon_layout">
  49. <image src="../../../image/teacher/dropdown_icon.png" class="item_picker_icon"></image>
  50. </view>
  51. </view>
  52. <!--选择班级end-->
  53. <view class="item_input_bg" style="margin-top: 1rpx;">
  54. <text class="item_input_title">设备ID:</text>
  55. <input class="item_input_content" placeholder="请输入设备ID" bindinput="bindDeviceInput" value="{{deviceId}}" />
  56. </view>
  57. </view>
  58. <view class="login_btn_layout" style="margin-left: 0rpx;margin-top: 190rpx;" bindtap="startMonitor">
  59. <button class="login_btn" style="width: 100%; margin-left: 0rpx;font-size: 36rpx;font-weight: 400;">开始上课</button>
  60. </view>
  61. </view>
  62. </view>
  63. <!--开始上课之后-->
  64. <view wx:if="{{pageState==1}}" class="container" style="background-color: #F4F4F4;">
  65. <view style="margin-top: 33rpx;">
  66. <text class="title">设备监控</text>
  67. </view>
  68. <!--播放视频的视频框-->
  69. <view style="width: 100%;height: 422rpx; background-color: blue;margin-top: 40rpx;;display: flex;">
  70. <live-player style="width: 100%; height: 100%; "></live-player>
  71. <view style="width: 100%;height: 422rpx; position: absolute;">
  72. <view class="light_green {{videostatus==1?'light_red':''}}"></view>
  73. </view>
  74. </view>
  75. <!--播放视频的视频框-->
  76. <!-- 快照-->
  77. <view style="margin-top:48rpx;font-size:25rpx;font-weight: 500;">
  78. <text style="margin-left:10rpx">快照</text>
  79. <scroll-view scroll-x class="image_scroll">
  80. <view wx:for="{{20}}" wx:key="index" style="display:inline-block;">
  81. <image class="image"></image>
  82. <view class="image_index">{{index}}</view>
  83. </view>
  84. </scroll-view>
  85. </view>
  86. <!-- 快照-->
  87. <!-- 下课按钮-->
  88. <view>
  89. <image bindtap="classOver" class="class_over" src="../../../image/teacher/class_over.png"></image>
  90. </view>
  91. <!-- 下课按钮-->
  92. </view>
  93. <!--开始上课之后-->