monitor.wxml 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. <!--pages/teacher/monitor/monitor.wxml-->
  2. <view>
  3. <view wx:if="{{pageState==0}}" class="container" style="background-color: #F4F4F4;">
  4. <view class="qrcode_layout">
  5. <view class="qrcode_layout_bg" bindtap="scanCode">
  6. <image src="../../../image/teacher/qrcode.png" style="width:60rpx;height:60rpx"></image>
  7. <text>扫一扫</text>
  8. </view>
  9. </view>
  10. <view class="center_layout">
  11. <text class="center_title">上课地点</text>
  12. <view class="center_picker_layout">
  13. <!--选择地区-->
  14. <view class="item_input_bg" style=" margin-top: 0rpx; box-shadow: 0px 1px 0px 0px #EEEEEE;">
  15. <text class="item_input_title">地区:</text>
  16. <picker mode="multiSelector" bindchange="bindRegionChange" bindcolumnchange="bindMultiPickerColumnChange" range="{{region}}" class="item_picker_bg" value="{{regionIndex}}">
  17. <view class="item_picker_content">
  18. <p> {{region[0][regionIndex[0]]}} </p>
  19. <p> {{region[1][regionIndex[1]]}} </p>
  20. <p> {{region[2][regionIndex[2]]}} </p>
  21. </view>
  22. </picker>
  23. <view class="item_picker_icon_layout">
  24. <image src="../../../image/teacher/dropdown_icon.png" class="item_picker_icon"></image>
  25. </view>
  26. </view>
  27. <!--选择地区 end-->
  28. <!--选择学校-->
  29. <view class="item_input_bg" style=" margin-top: 2rpx;box-shadow: 0px 1px 0px 0px #EEEEEE;">
  30. <text class="item_input_title">学校:</text>
  31. <picker mode="multiSelector" bindcolumnchange="bindSchoolPicker" range="{{schoolArray}}" value="{{[schoolIndex,0]}}" class="item_picker_bg">
  32. <view class="item_picker_content">
  33. {{schoolArray[0][schoolIndex]}}
  34. </view>
  35. </picker>
  36. <view class="item_picker_icon_layout">
  37. <image src="../../../image/teacher/dropdown_icon.png" class="item_picker_icon"></image>
  38. </view>
  39. </view>
  40. <!--选择学校end-->
  41. <!--选择班级-->
  42. <view class="item_input_bg" style=" margin-top: 2rpx;box-shadow: 0px 1px 0px 0px #EEEEEE;">
  43. <text class="item_input_title">班级:</text>
  44. <picker bindchange="bindClssPicker" value="{{classIndex}}" range="{{classArray}}" class="item_picker_bg">
  45. <view class="item_picker_content">
  46. {{classArray[classIndex]}}
  47. </view>
  48. </picker>
  49. <view class="item_picker_icon_layout">
  50. <image src="../../../image/teacher/dropdown_icon.png" class="item_picker_icon"></image>
  51. </view>
  52. </view>
  53. <!--选择班级end-->
  54. <view class="item_input_bg" style="margin-top: 1rpx;">
  55. <text class="item_input_title">设备ID:</text>
  56. <input class="item_input_content" placeholder="请输入设备ID" bindinput="bindDeviceInput" value="{{deviceId}}" hidden="{{hiddenInput}}" />
  57. </view>
  58. </view>
  59. <view class="login_btn_layout" style="margin-left: 0rpx;margin-top: 190rpx;" bindtap="startMonitor">
  60. <button class="login_btn" style="width: 100%; margin-left: 0rpx;font-size: 36rpx;font-weight: 400;">开始上课</button>
  61. </view>
  62. </view>
  63. </view>
  64. <!--开始上课之后-->
  65. <view wx:if="{{pageState==1}}" class="container" style="background-color: #F4F4F4;">
  66. <view style="margin-top: 33rpx;">
  67. <text class="title">设备监控</text>
  68. </view>
  69. <!--播放视频的视频框-->
  70. <view style="width: 100%;height: 422rpx; background-color: blue;margin-top: 40rpx;;display: flex;">
  71. <live-player style="width: 100%; height: 100%; " src="{{videoUrl}}" autoplay="{{true}}"></live-player>
  72. <view style="width: 100%;height: 422rpx; position: absolute;">
  73. <view class="light_green {{videostatus==1?'light_red':''}}"></view>
  74. </view>
  75. </view>
  76. <!--播放视频的视频框-->
  77. <!-- 快照-->
  78. <view style="margin-top:48rpx;font-size:25rpx;font-weight: 500;">
  79. <text style="margin-left:10rpx">快照</text>
  80. <scroll-view scroll-x class="image_scroll">
  81. <view wx:for="{{imgList}}" wx:key="index" style="display:inline-block;">
  82. <image class="image" src="{{item.url}}"></image>
  83. <view class="image_index">{{index+1}}</view>
  84. </view>
  85. </scroll-view>
  86. </view>
  87. <!-- 快照-->
  88. <!-- 下课按钮-->
  89. <view>
  90. <image bindtap="classOver" class="class_over" src="../../../image/teacher/class_over.png"></image>
  91. </view>
  92. <!-- 下课按钮-->
  93. </view>
  94. <!--开始上课之后-->
  95. </view>
  96. <!--扫码显示弹窗-->
  97. <view class="container" hidden="{{windowHidden}}" catchtap="hideWindow">
  98. <view style="width: 100%; height: 100%; background-color: rgba(0,0,0,0.60);;position: absolute; left: 0;top: 0;display: flex;justify-content: center;">
  99. <view class="center_picker_layout">
  100. <!--选择地区-->
  101. <view class="item_input_bg" style=" margin-top: 300rpx; box-shadow: 0px 1px 0px 0px #EEEEEE;">
  102. <text class="item_input_title">地区:</text>
  103. <text class="item_picker_content">{{windowRegion}}</text>
  104. <view class="item_picker_icon_layout">
  105. </view>
  106. </view>
  107. <!--选择地区 end-->
  108. <!--选择学校-->
  109. <view class="item_input_bg" style=" margin-top: 2rpx;box-shadow: 0px 1px 0px 0px #EEEEEE;">
  110. <text class="item_input_title">学校:</text>
  111. <text class="item_picker_content">{{windowSchool}}</text>
  112. <view class="item_picker_icon_layout">
  113. </view>
  114. </view>
  115. <!--选择学校end-->
  116. <!--选择班级-->
  117. <view class="item_input_bg" style=" margin-top: 2rpx;box-shadow: 0px 1px 0px 0px #EEEEEE;">
  118. <text class="item_input_title">班级:</text>
  119. <text class="item_picker_content">{{windowClass}}</text>
  120. <view class="item_picker_icon_layout">
  121. </view>
  122. </view>
  123. <!--选择班级end-->
  124. <view class="item_input_bg" style="margin-top: 1rpx;">
  125. <text class="item_input_title">设备ID:</text>
  126. <text class="item_input_content" style="overflow: hidden;text-overflow: ellipsis;">{{deviceId}}</text>
  127. </view>
  128. <view class="login_btn_layout" style="margin-left: 0rpx;margin-top: 30rpx;justify-content: center;width: 100%;" bindtap="startMonitor">
  129. <button class="login_btn" style="width: 100%; margin-left: 0rpx;font-size: 36rpx;font-weight: 400;">开始上课</button>
  130. </view>
  131. </view>
  132. </view>
  133. </view>
  134. <!--扫码显示弹窗-->