styles.less 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275
  1. *{
  2. padding: 0;
  3. margin: 0;
  4. }
  5. body{
  6. height: 100%;
  7. overflow: hidden;
  8. }
  9. .storeCheck{
  10. height: calc(100vh);
  11. display: flex;
  12. flex-direction: column;
  13. // 进度条
  14. .loading{
  15. background: #fff;
  16. height: 100%;
  17. width: 100%;
  18. text-align: center;
  19. position: fixed;
  20. z-index: 10000;
  21. left:0;
  22. top:0;
  23. .ant-spin{
  24. margin-top: 50%;
  25. }
  26. }
  27. // 工作区域
  28. .checkWork{
  29. flex-grow: 1;
  30. display: flex;
  31. flex-direction: column;
  32. overflow: auto;
  33. // 摄像头切,换预置位及打分统计
  34. .checkWork-head{
  35. position: relative;
  36. .checkWork-head-row{
  37. &:first-child{
  38. > div{
  39. display: flex;
  40. align-items: center;
  41. width: 100%;
  42. > div{
  43. &:last-child{
  44. flex-grow: 1;
  45. }
  46. }
  47. }
  48. }
  49. > div{
  50. width: 100%;
  51. padding: 5px 10px;
  52. display: flex;
  53. align-items: center;
  54. &:first-child{
  55. border-bottom: 1px solid #eee;
  56. }
  57. > div{
  58. width: 33.3%;
  59. padding: 3px 0;
  60. }
  61. .ant-dropdown-link{
  62. width: 100%;
  63. display: block;
  64. text-align: right;
  65. color: #666666;
  66. }
  67. }
  68. }
  69. }
  70. .checkWork-body{
  71. flex-grow: 1;
  72. display: flex;
  73. background: #f8f8f8;
  74. overflow: auto;
  75. .checkWork-body-tabs{
  76. width: 26%;
  77. padding: 1px 0;
  78. overflow-y: scroll;
  79. box-shadow: 1px 1px 3px #eee;
  80. .tabs-items{
  81. text-align: center;
  82. padding:8px 5px;
  83. position: relative;
  84. margin: 5px;
  85. background: #fff;
  86. .edit{
  87. font-size: 14px;
  88. color: #ff0000;
  89. }
  90. .aicon{
  91. color: #fff;
  92. position: absolute;
  93. font-size: 12px;
  94. left: -5px;
  95. top: -6px;
  96. background: #ff0000;
  97. padding: 3px;
  98. border-radius: 100%;
  99. }
  100. }
  101. .tabs-items.active{
  102. background: #91D5FF;
  103. }
  104. }
  105. .checkWork-body-tabCons{
  106. width: 74%;
  107. padding: 5px;
  108. overflow-y: scroll;
  109. .tabCons-items{
  110. background: #fff;
  111. padding: 5px;
  112. margin-bottom: 10px;
  113. border-radius: 5px;
  114. box-shadow: 1px 1px 3px #eee;
  115. .remarks{
  116. padding: 5px;
  117. }
  118. .photos{
  119. span{
  120. border: 1px solid #eee;
  121. }
  122. display: block;
  123. > div{
  124. display: inline-block;
  125. }
  126. }
  127. > div{
  128. display: flex;
  129. align-items: center;
  130. > div{
  131. padding: 5px;
  132. &:first-child{
  133. flex-grow: 1;
  134. }
  135. .anticon{
  136. font-size: 30px;
  137. color: #666;
  138. margin-left: 15px;
  139. }
  140. .choose-bsy{
  141. color: #13C2C2;
  142. }
  143. .choose-bhg{
  144. color: #ff0000;
  145. }
  146. .choose-hg{
  147. color: #00be00;
  148. }
  149. }
  150. }
  151. }
  152. }
  153. }
  154. .checkWork-button{
  155. > div{
  156. padding: 10px;
  157. text-align: center;
  158. font-size: 18px;
  159. background: #FAAD14;
  160. color: #fff;
  161. }
  162. }
  163. }
  164. }
  165. // 播放器
  166. .videoPlay{
  167. position: relative;
  168. height: 240px;
  169. .control-yt,.control-yt-close{
  170. position: absolute;
  171. right: 15px;
  172. top: 15px;
  173. z-index: 100000;
  174. width: 32px;
  175. height: 32px;
  176. background: url(../static/icons/kz-mini.png) no-repeat center center;
  177. background-size: contain;
  178. }
  179. .control-yt-close{
  180. background: url(../static/icons/close.png) no-repeat center center;
  181. background-size: contain;
  182. }
  183. .ytBtns{
  184. position: absolute;
  185. width: 40px;
  186. height: 40px;
  187. z-index: 10000;
  188. opacity: 50%;
  189. }
  190. .yt-left{
  191. left: 20%;
  192. top: 100px;
  193. background: url(../static/icons/left.png) no-repeat center center;
  194. background-size: contain;
  195. }
  196. .yt-right{
  197. right: 20%;
  198. top: 100px;
  199. background: url(../static/icons/right.png) no-repeat center center;
  200. background-size: contain;
  201. }
  202. .yt-top{
  203. left: 50%;
  204. top: 20px;
  205. margin-left: -20px;
  206. background: url(../static/icons/up.png) no-repeat center center;
  207. background-size: contain;
  208. }
  209. .yt-bottom{
  210. left: 50%;
  211. bottom: 20px;
  212. margin-left: -20px;
  213. background: url(../static/icons/down.png) no-repeat center center;
  214. background-size: contain;
  215. }
  216. .prism-player .prism-controlbar{
  217. background: rgba(0, 0, 0, 0.5);
  218. }
  219. }
  220. // 拍照弹框
  221. .pzPopus{
  222. .pz-pinglun{
  223. display: flex;
  224. align-items: center;
  225. .remarks{
  226. flex-grow: 1;
  227. padding-right: 15px;
  228. }
  229. .icons{
  230. border: 1px solid #aaa;
  231. padding: 10px;
  232. border-radius: 100%;
  233. width: 60px;
  234. height: 60px;
  235. display: flex;
  236. align-items: center;
  237. justify-content: center;
  238. .aicon{
  239. font-size: 30px;
  240. color: #999;
  241. }
  242. }
  243. }
  244. .imglist{
  245. display: flex;
  246. align-items: center;
  247. flex-wrap: wrap;
  248. padding: 30px 0 20px;
  249. > div{
  250. position: relative;
  251. padding: 3px;
  252. border: 1px solid #eee;
  253. border-radius: 5px;
  254. margin-right: 10px;
  255. img{
  256. width: 45px;
  257. height: 45px;
  258. }
  259. .aicon{
  260. color: #fff;
  261. position: absolute;
  262. font-size: 12px;
  263. right: -6px;
  264. top: -8px;
  265. background: #FF0000;
  266. padding: 2px;
  267. border-radius: 100%;
  268. }
  269. }
  270. }
  271. .f-btns{
  272. padding: 10px 0;
  273. }
  274. }