common.scss 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725
  1. /* common */
  2. body {
  3. font-size: 32rpx;
  4. }
  5. radio,checkbox {
  6. transform: scale(0.7)
  7. }
  8. /* 修改placeholder颜色 */
  9. .uni-input-placeholder{
  10. color:#999
  11. }
  12. table{
  13. border-collapse: collapse;
  14. width:100%;
  15. text-align:center
  16. }
  17. table,tr,td,th{
  18. border:1px solid #e2e2e2;
  19. }
  20. td,th{
  21. padding:6rpx;
  22. font-size:26rpx;
  23. }
  24. /* 一行显示*/
  25. .inOneLine{
  26. white-space: nowrap;
  27. overflow: hidden;
  28. text-overflow: ellipsis;
  29. }
  30. /* 画面监控引入特殊字体 */
  31. @font-face {
  32. font-family: 'FANDOLFANG-REGULAR'; /* project id 2394829 */
  33. src: url('static/font/FANDOLFANG-REGULAR.OTF');
  34. }
  35. /* 巡检计划图表入特殊字体 */
  36. @font-face {
  37. font-family: 'IMPACT'; /* project id 2394829 */
  38. src: url('static/font/IMPACT.TTF');
  39. }
  40. .cu-bar .search-form uni-input{
  41. padding:0 30rpx
  42. }
  43. .searchSelect{
  44. position: -webkit-fixed;
  45. position: fixed;
  46. // top: 88rpx;
  47. top: var(--window-top);
  48. z-index: 999;
  49. -webkit-box-flex: 1;
  50. -webkit-flex: 1;
  51. flex: 1;
  52. -webkit-box-orient: vertical;
  53. -webkit-box-direction: normal;
  54. -webkit-flex-direction: column;
  55. flex-direction: column;
  56. overflow: hidden;
  57. background-color: #fff;
  58. width:254rpx;
  59. .search{
  60. min-height:80rpx;
  61. }
  62. .search-form{
  63. border:1px solid #E9E9E9;
  64. height:50rpx;
  65. line-height:50rpx;
  66. .cuIcon-search{
  67. color:#4074E7
  68. }
  69. input{
  70. padding-left:20rpx;
  71. padding-right:0rpx
  72. }
  73. }
  74. .select-item{
  75. padding:12rpx 32rpx;
  76. text-align:center;
  77. border-top:1px solid #E9E9E9;
  78. font-size:28rpx
  79. }
  80. }
  81. /* 九宫格样式 */
  82. .cu-list.grid>.cu-item uni-text {
  83. color: #333;
  84. font-size: 30rpx;
  85. margin-top:14rpx
  86. }
  87. .cu-list.menu-avatar>.cu-item>.cu-avatar {
  88. left: 24rpx;
  89. background-color:rgba(0,0,0,0)
  90. }
  91. .cu-list.menu-avatar>.cu-item .action {
  92. width: 132rpx
  93. }
  94. .iconfont.phone {
  95. color:#08BE04!important;
  96. font-size:45rpx;
  97. position:relative;
  98. top:6rpx;
  99. left:10rpx;
  100. }
  101. .iconfont.map{
  102. color:#4074E7!important;
  103. font-size:38rpx;
  104. }
  105. /* 列列表公共样式 */
  106. .processWrapper .cu-avatar {
  107. background-repeat: no-repeat;
  108. background-size: cover;
  109. background-color: #fff
  110. }
  111. .cu-avatar.lg {
  112. width: 90rpx;
  113. height: 90rpx
  114. }
  115. .cu-list.menu-avatar .cu-item {
  116. margin-left: 24rpx;
  117. padding: 30rpx 0;
  118. }
  119. .cu-list.menu-avatar>.cu-item>.cu-avatar {
  120. left: 0
  121. }
  122. .cu-list.menu-avatar>.cu-item .content {
  123. left: 120rpx;
  124. width: 580rpx;
  125. }
  126. .unProcess,.error {
  127. color: #FF4E00
  128. }
  129. .processed ,.online{
  130. color: #08BE04
  131. }
  132. .bg-error {
  133. background: #FF4E00;
  134. color:#fff;
  135. display:inline-block;
  136. padding:0 10px ;
  137. }
  138. .bg-online{
  139. background: #08BE04;
  140. color:#fff;
  141. display:inline-block;
  142. padding:0 10px ;
  143. }
  144. /* 页面样式 */
  145. /* 站点列表页 */
  146. /* 筛选框 */
  147. .filter-section {
  148. /* position: fixed; */
  149. /* top: 88rpx; */
  150. width: 100%;
  151. z-index: 9
  152. }
  153. .cu-bar .search-form {
  154. background: #fff
  155. }
  156. .cu-btn {
  157. padding: 0 46rpx;
  158. }
  159. /* 站点列表 */
  160. .site-items {
  161. margin-top:100rpx;
  162. width: 100%;
  163. height: calc(100% - 100rpx);
  164. overflow: scroll
  165. }
  166. .site-items .site-tit {
  167. font-size: 32rpx;
  168. color: #333;
  169. justify-content: space-between;
  170. }
  171. .site-items .cu-avatar {}
  172. /* 新增按钮 */
  173. .site-wrapper .plus {
  174. position: fixed;
  175. bottom: 20rpx;
  176. right: 20rpx
  177. }
  178. /* 已处理未处理列表 */
  179. .processList .cu-list.menu-avatar .cu-item {
  180. height: 180rpx;
  181. }
  182. .pro-title {
  183. color: #333;
  184. }
  185. .pro-des,
  186. .pro-date {
  187. font-size: 28rpx;
  188. color: #666;
  189. }
  190. .pro-res {}
  191. .processList {
  192. margin-top:100rpx;
  193. /* position: fixed; */
  194. width: 100%;
  195. height: calc(100% - 100rpx);
  196. overflow-y: scroll;
  197. }
  198. /* 已处理未处理详情页样式 */
  199. .timeBox {
  200. height: 88rpx;
  201. background: #EFF4FF;
  202. line-height: 88rpx;
  203. .time {
  204. color: #333
  205. }
  206. }
  207. .info-tit {
  208. color: #4074E7;
  209. line-height: 90rpx;
  210. height: 90rpx;
  211. }
  212. /* // 基本信息 */
  213. .info-content>view {
  214. margin-left: 24rpx;
  215. border-bottom: 1px solid #EDEDED;
  216. line-height: 92rpx;
  217. color: #666;
  218. .checkMore {
  219. color: #4074E7!important
  220. }
  221. }
  222. .info-content view text:first-child {
  223. width: auto!important;
  224. display: inline-block
  225. }
  226. //分析页面
  227. .analyse-wrapper {
  228. .top-banner {
  229. width: 100%;
  230. height: 273rpx;
  231. background: url(/static/analyse-bg.png) no-repeat;
  232. background-size:cover;
  233. }
  234. .cu-list.menu-avatar .cu-item{
  235. margin:30rpx 0 0;
  236. margin-left:0;
  237. .cu-avatar{
  238. background-color:rgba(0,0,0,0);
  239. left:26rpx;
  240. }
  241. .content{
  242. left:130rpx;
  243. font-size:32rpx;
  244. }
  245. }
  246. }
  247. //消息页面
  248. .info-wrapper {
  249. .top-banner {
  250. background: url(/static/info-bg.png) no-repeat;
  251. background-size:cover;
  252. }
  253. }
  254. .submitBottomBtn {
  255. position: fixed;
  256. width: 100%;
  257. left:0;
  258. bottom: 44rpx;
  259. z-index: 999;
  260. // background-color: #ffffff;
  261. }
  262. // 权限新增
  263. .siteItems{
  264. z-index:999;
  265. position:absolute;
  266. border:1px solid #eee;
  267. width:100%;
  268. .site-item{
  269. background:#fff;
  270. padding:10rpx;
  271. font-size:28rpx;
  272. }
  273. }
  274. .selectedBox .cuIcon-close{
  275. position:relative;
  276. top:3rpx;
  277. right:-10rpx;
  278. }
  279. .noResult{
  280. padding:0 20rpx;
  281. font-size:28rpx;
  282. color:#aaa
  283. }
  284. // 离线设备
  285. .ding{
  286. position:fixed;
  287. width:100%;
  288. top: var(--window-top);
  289. // position: sticky;
  290. /* #ifdef H5 */
  291. // top: 44px;
  292. /* #endif */
  293. /* #ifndef H5 */
  294. // top: 0;
  295. /* #endif */
  296. z-index: 999;
  297. flex: 1;
  298. flex-direction: column;
  299. overflow: hidden;
  300. background-color: #ffffff;
  301. }
  302. .cu-bar{
  303. min-height:0rpx;
  304. }
  305. .cu-bar .search-form {
  306. margin:26rpx 24rpx 0;
  307. }
  308. uni-textarea{
  309. width:500rpx;
  310. }
  311. select{
  312. outline:none;
  313. border:none;
  314. width:90%;
  315. padding-left:24rpx;
  316. color:#999
  317. }
  318. // 未处理textarea样式
  319. /* // 处理内容 */
  320. .cu-form-group {
  321. background: #f5f5f5;
  322. }
  323. .processStatus {
  324. textarea {
  325. background: #F5F5F5;
  326. color: #999999;
  327. padding:20rpx;
  328. }
  329. }
  330. // textarea
  331. .JTxtArea {
  332. position: relative;
  333. &.sm {
  334. min-height: 60rpx;
  335. }
  336. &.lg {
  337. min-height: 120rpx;
  338. }
  339. &:after {
  340. content: attr(data-maxnum);
  341. position: absolute;
  342. right: 10rpx;
  343. bottom: 0px;
  344. }
  345. }
  346. // 导出页面
  347. .cu-dialog{
  348. width:70%
  349. }
  350. .cu-modal .cu-dialog>.cu-bar:first-child .action{
  351. min-height:50rpx;
  352. min-width:auto;
  353. }
  354. .cu-dialog{
  355. border-radius:20rpx
  356. }
  357. // 设备类型
  358. .cu-list.menu-avatar .deviceTypeItem.cu-item{
  359. height:110rpx;
  360. .content{
  361. left:100rpx!important
  362. }
  363. .cu-avatar.round{
  364. width:70rpx;
  365. height:70rpx
  366. }
  367. .title{
  368. font-size:32rpx!important;
  369. }
  370. .num{
  371. color:#666;
  372. }
  373. }
  374. // 设备详情
  375. .radiusStatus{
  376. width:20rpx;height:20rpx;border-radius:50%;display:inline-block;
  377. margin-right:6rpx
  378. }
  379. .radiusStatus.offLine{
  380. }
  381. .bg-offLine{
  382. background:#ABABAB;
  383. color:#666666;
  384. .radiusStatus{
  385. background:#666
  386. }
  387. }
  388. .bg-onLine{
  389. background:#08BE04;
  390. color:#fff;
  391. .radiusStatus{
  392. background:#fff
  393. }
  394. }
  395. // 巡检计划
  396. .plan-sec{
  397. border-radius:10rpx;
  398. }
  399. .plan-tit{
  400. font-size:34rpx
  401. }
  402. // 巡检新增
  403. .cu-form-group {
  404. border-top: 0;
  405. background: #fff;
  406. padding:0
  407. }
  408. input,
  409. select,
  410. option {
  411. line-height: 70rpx;
  412. padding: 0 20rpx;
  413. height: 70rpx;
  414. border: 1px solid #EDEDED;
  415. // width:500rpx!important;
  416. background-color: #fff;
  417. box-sizing: border-box;
  418. appearance: none;
  419. -moz-appearance: none;
  420. -webkit-appearance: none;
  421. color: #999;
  422. }
  423. select:focus,
  424. select:active,
  425. select:hover {
  426. outline: none;
  427. }
  428. select {
  429. background: url(/static/arrow.png) no-repeat scroll 98% center;
  430. background-size: 6%;
  431. }
  432. textarea{
  433. border:1px solid #EDEDED;
  434. padding:10px;
  435. color: #999;
  436. }
  437. .form-item label text {
  438. position: relative;
  439. top: 2rpx
  440. }
  441. .form-item {
  442. padding: 0 40rpx;
  443. display: flex;
  444. align-items: top;
  445. margin-bottom: 20rpx;
  446. .title {
  447. width: 170rpx;
  448. position: relative;
  449. .necessary {
  450. color: red;
  451. display: inline-block;
  452. position: absolute;
  453. top: -2rpx;
  454. left: -20rpx;
  455. font-size: 40rpx;
  456. }
  457. }
  458. input,
  459. select {
  460. width: 500rpx;
  461. font-size: 28rpx;
  462. }
  463. }
  464. // 巡检详情,已执行
  465. .planDetailDone{
  466. .form-item{
  467. margin-left:24rpx;
  468. padding:26rpx 10rpx;
  469. border-top:1px solid #f1f1f1;
  470. margin-bottom:0
  471. }
  472. }
  473. .repairSquare{
  474. padding:18rpx 20rpx;
  475. border-radius:10rpx;
  476. }
  477. .repairSquare .num,.repairSquare .title{
  478. color:#fff
  479. }
  480. .repairSquare .num{
  481. font-size:36rpx
  482. }
  483. // 设备管理
  484. uni-input, select, option{
  485. border:none
  486. }
  487. // 风险保障
  488. .viewDetail{
  489. color:#4074E7;
  490. }
  491. .qa{
  492. .cu-list+.cu-list{
  493. margin-top:0
  494. }
  495. }
  496. .qa-des{
  497. color:#666;
  498. line-height:1.5;
  499. text-indent:64rpx
  500. }
  501. .bottom-line{
  502. background: rgba(221,221,221,.5);
  503. height:2rpx;
  504. margin-left:30rpx;
  505. }
  506. .cu-list.menu-avatar>.cu-item.qa-tit{
  507. height:auto;
  508. .cu-avatar{
  509. width:32rpx;height:32rpx
  510. }
  511. .content{
  512. left:50rpx
  513. }
  514. }
  515. .messagePush{
  516. .uni-checkbox .uni-checkbox-input{
  517. width:40rpx;
  518. height:40rpx;
  519. }
  520. }
  521. .fireBashWrapper{
  522. .cu-avatar{
  523. width:120rpx;
  524. height:100rpx
  525. }
  526. .cu-list.menu-avatar > .cu-item .content{
  527. left:140rpx;
  528. .pro-date{
  529. position:absolute;
  530. right:20rpx;
  531. bottom:0
  532. }
  533. }
  534. }
  535. // 消防知识库详情页
  536. .fireBashDetailWrapper{
  537. font-size:28rpx;
  538. .cu-avatar{
  539. width:50rpx;
  540. height:50rpx
  541. }
  542. .fireD-content{
  543. position:relative
  544. }
  545. .fireD-content:before{
  546. position: absolute;
  547. top: -8px;
  548. left: -15px;
  549. box-sizing: border-box;
  550. width: calc(100% + 30px);
  551. height: 1px;
  552. background:#EDEDED;
  553. content: " ";
  554. }
  555. .fireD-content view{
  556. line-height:1.5;
  557. // text-indent:56rpx;
  558. }
  559. .share{
  560. position:fixed;
  561. bottom:0;
  562. left:0;
  563. width:100%;
  564. background: #f4f5f7;
  565. border: 1px solid #e6e6e6;
  566. .share-item{
  567. padding:20rpx;
  568. }
  569. .share-item:nth-child(2){
  570. border-left:1px solid #e6e6e6;
  571. border-right:1px solid #e6e6e6;
  572. }
  573. }
  574. }
  575. .fireD-tit{
  576. font-size:32rpx;
  577. font-weight:bold
  578. }
  579. .preAndNext{
  580. color:#4074E7;
  581. margin:30rpx 0 80rpx;
  582. }
  583. // 月报详情
  584. .reportD-wrapper{
  585. .title-wrapper{
  586. background:#EFF4FF;
  587. }
  588. .title{
  589. line-height:2
  590. }
  591. .other view{
  592. margin-bottom:10rpx;
  593. }
  594. }
  595. .chart-tit{
  596. color:#4074E7;
  597. font-size:32rpx;
  598. }