common.scss 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842
  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:left
  16. }
  17. table,tr,td,th{
  18. border:1px solid #e2e2e2;
  19. }
  20. td,th{
  21. padding:14rpx 10rpx;
  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. .share{
  146. position:fixed;
  147. bottom:0;
  148. left:0;
  149. width:100%;
  150. background: #f4f5f7;
  151. border: 1px solid #e6e6e6;
  152. .share-item{
  153. padding:20rpx;
  154. }
  155. .share-item:nth-child(2){
  156. border-left:1px solid #e6e6e6;
  157. border-right:1px solid #e6e6e6;
  158. }
  159. }
  160. /* 页面样式 */
  161. /* 站点列表页 */
  162. /* 筛选框 */
  163. .filter-section {
  164. /* position: fixed; */
  165. /* top: 88rpx; */
  166. width: 100%;
  167. z-index: 9
  168. }
  169. .cu-bar .search-form {
  170. background: #fff
  171. }
  172. .cu-btn {
  173. padding: 0 46rpx;
  174. }
  175. /* 站点列表 */
  176. .site-items {
  177. margin-top:100rpx;
  178. width: 100%;
  179. height: calc(100% - 100rpx);
  180. overflow: scroll
  181. }
  182. .site-items .site-tit {
  183. font-size: 32rpx;
  184. color: #333;
  185. justify-content: space-between;
  186. }
  187. .site-items .cu-avatar {}
  188. /* 新增按钮 */
  189. .site-wrapper .plus {
  190. position: fixed;
  191. bottom: 20rpx;
  192. right: 20rpx
  193. }
  194. /* 已处理未处理列表 */
  195. .processList .cu-list.menu-avatar .cu-item {
  196. height: 180rpx;
  197. }
  198. .pro-title {
  199. color: #333;
  200. }
  201. .pro-des,
  202. .pro-date {
  203. font-size: 28rpx;
  204. color: #666;
  205. }
  206. .pro-res {}
  207. .processList{
  208. width: 100%;
  209. height: calc(100% - 90rpx);
  210. overflow-y: scroll;
  211. }
  212. .fireBashWrapper.pushListWrapper{
  213. margin-top:0rpx;
  214. }
  215. .share-item.active{
  216. color:red
  217. }
  218. /* 已处理未处理详情页样式 */
  219. .timeBox {
  220. height: 88rpx;
  221. background: #EFF4FF;
  222. line-height: 88rpx;
  223. .time {
  224. color: #333
  225. }
  226. }
  227. .info-tit {
  228. color: #4074E7;
  229. line-height: 90rpx;
  230. height: 90rpx;
  231. }
  232. /* // 基本信息 */
  233. .info-content>view {
  234. margin-left: 24rpx;
  235. border-bottom: 1px solid #EDEDED;
  236. line-height: 92rpx;
  237. color: #666;
  238. .checkMore {
  239. color: #4074E7!important
  240. }
  241. }
  242. .info-content view text:first-child {
  243. width: auto!important;
  244. display: inline-block
  245. }
  246. //分析页面
  247. .analyse-wrapper {
  248. .top-banner {
  249. width: 100%;
  250. height: 273rpx;
  251. background: url(/static/analyse-bg.png) no-repeat;
  252. background-size:cover;
  253. }
  254. .cu-list.menu-avatar .cu-item{
  255. margin:30rpx 0 0;
  256. margin-left:0;
  257. .cu-avatar{
  258. background-color:rgba(0,0,0,0);
  259. left:26rpx;
  260. }
  261. .content{
  262. left:130rpx;
  263. font-size:32rpx;
  264. }
  265. }
  266. }
  267. //消息页面
  268. .info-wrapper {
  269. .top-banner {
  270. background: url(/static/info-bg.png) no-repeat;
  271. background-size:cover;
  272. }
  273. }
  274. .submitBottomBtn {
  275. position: fixed;
  276. width: 100%;
  277. left:0;
  278. bottom: 44rpx;
  279. z-index: 999;
  280. // background-color: #ffffff;
  281. }
  282. // 权限新增
  283. .perAppWrapper{
  284. input,
  285. select,
  286. option {
  287. line-height: 70rpx;
  288. padding: 0 20rpx;
  289. height: 70rpx;
  290. border: 1px solid #EDEDED;
  291. // width:500rpx!important;
  292. background-color: #fff;
  293. box-sizing: border-box;
  294. appearance: none;
  295. -moz-appearance: none;
  296. -webkit-appearance: none;
  297. color: #999;
  298. }
  299. .form-item .title {
  300. width: 170rpx
  301. }
  302. }
  303. .siteItems{
  304. z-index:999;
  305. position:absolute;
  306. border:1px solid #eee;
  307. width:100%;
  308. .site-item{
  309. background:#fff;
  310. padding:10rpx;
  311. font-size:28rpx;
  312. }
  313. }
  314. .selectedBox .cuIcon-close{
  315. position:relative;
  316. top:3rpx;
  317. right:-10rpx;
  318. }
  319. .noResult{
  320. padding:0 20rpx;
  321. font-size:28rpx;
  322. color:#aaa
  323. }
  324. // 离线设备
  325. .ding{
  326. position:fixed;
  327. width:100%;
  328. top: var(--window-top);
  329. // position: sticky;
  330. /* #ifdef H5 */
  331. // top: 44px;
  332. /* #endif */
  333. /* #ifndef H5 */
  334. // top: 0;
  335. /* #endif */
  336. z-index: 999;
  337. flex: 1;
  338. flex-direction: column;
  339. overflow: hidden;
  340. background-color: #ffffff;
  341. }
  342. .cu-bar{
  343. min-height:0rpx;
  344. }
  345. .cu-bar .search-form {
  346. margin:26rpx 24rpx 0;
  347. }
  348. uni-textarea{
  349. width:500rpx;
  350. }
  351. uni-label uni-text{
  352. position: relative;
  353. top: 2px;
  354. }
  355. select{
  356. outline:none;
  357. border:none;
  358. // width:90%;
  359. width:98%;
  360. padding-left:24rpx;
  361. color:#999
  362. }
  363. // 未处理textarea样式
  364. /* // 处理内容 */
  365. .cu-form-group {
  366. background: #f5f5f5;
  367. }
  368. .processStatus {
  369. textarea {
  370. background: #F5F5F5;
  371. color: #999999;
  372. padding:20rpx;
  373. }
  374. }
  375. // textarea
  376. .JTxtArea {
  377. position: relative;
  378. &.sm {
  379. min-height: 60rpx;
  380. }
  381. &.lg {
  382. min-height: 120rpx;
  383. }
  384. &:after {
  385. content: attr(data-maxnum);
  386. position: absolute;
  387. right: 10rpx;
  388. bottom: 0px;
  389. }
  390. }
  391. // 设备类型
  392. .cu-list.menu-avatar .deviceTypeItem.cu-item{
  393. height:110rpx;
  394. .content{
  395. left:100rpx!important
  396. }
  397. .cu-avatar.round{
  398. width:70rpx;
  399. height:70rpx
  400. }
  401. .title{
  402. font-size:32rpx!important;
  403. }
  404. .num{
  405. color:#666;
  406. }
  407. }
  408. // 设备详情
  409. .radiusStatus{
  410. width:20rpx;height:20rpx;border-radius:50%;display:inline-block;
  411. margin-right:6rpx
  412. }
  413. .radiusStatus.offLine{
  414. }
  415. .bg-offLine{
  416. background:#ABABAB;
  417. color:#666666;
  418. .radiusStatus{
  419. background:#666
  420. }
  421. }
  422. .bg-onLine{
  423. background:#08BE04;
  424. color:#fff;
  425. .radiusStatus{
  426. background:#fff
  427. }
  428. }
  429. // 巡检计划
  430. .plan-sec{
  431. border-radius:10rpx;
  432. }
  433. .plan-tit{
  434. font-size:34rpx
  435. }
  436. // 巡检新增
  437. .cu-form-group {
  438. border-top: 0;
  439. background: #fff;
  440. padding:0
  441. }
  442. input{
  443. border: 1px solid #EDEDED!important;
  444. }
  445. input,
  446. select,
  447. option {
  448. line-height: 70rpx;
  449. padding: 0 20rpx;
  450. height: 70rpx;
  451. border: 1px solid #EDEDED;
  452. background-color: #fff;
  453. box-sizing: border-box;
  454. appearance: none;
  455. -moz-appearance: none;
  456. -webkit-appearance: none;
  457. color: #999;
  458. }
  459. select:focus,
  460. select:active,
  461. select:hover {
  462. outline: none;
  463. }
  464. select {
  465. background: url(/static/arrow2.png) no-repeat scroll 98% center;
  466. background-size:28rpx;
  467. }
  468. textarea{
  469. border:1px solid #EDEDED;
  470. padding:10px;
  471. color: #999;
  472. }
  473. .form-item label text {
  474. position: relative;
  475. top: 2rpx
  476. }
  477. .form-item {
  478. padding: 0 40rpx;
  479. display: flex;
  480. align-items: top;
  481. margin-bottom: 20rpx;
  482. .title {
  483. width: 200rpx;
  484. position: relative;
  485. .necessary {
  486. color: red;
  487. display: inline-block;
  488. position: absolute;
  489. top: -2rpx;
  490. left: -20rpx;
  491. font-size: 40rpx;
  492. }
  493. }
  494. input,
  495. select {
  496. width: calc(100% - 200rpx);
  497. font-size: 28rpx;
  498. }
  499. }
  500. // 巡检详情,已执行
  501. .planDetailDone{
  502. .form-item{
  503. margin-left:24rpx;
  504. padding:26rpx 10rpx;
  505. border-top:1px solid #f1f1f1;
  506. margin-bottom:0
  507. }
  508. }
  509. .repairSquare{
  510. padding:18rpx 20rpx;
  511. border-radius:10rpx;
  512. }
  513. .repairSquare .num,.repairSquare .title{
  514. color:#fff
  515. }
  516. .repairSquare .num{
  517. font-size:36rpx
  518. }
  519. // 设备管理
  520. uni-input, select, option{
  521. border:none
  522. }
  523. // 风险保障
  524. .viewDetail{
  525. color:#4074E7;
  526. }
  527. .qa{
  528. .cu-list+.cu-list{
  529. margin-top:0
  530. }
  531. }
  532. .qa-des{
  533. color:#666;
  534. line-height:1.5;
  535. text-indent:64rpx
  536. }
  537. .bottom-line{
  538. background: rgba(221,221,221,.5);
  539. height:2rpx;
  540. margin-left:30rpx;
  541. }
  542. .cu-list.menu-avatar>.cu-item.qa-tit{
  543. height:auto;
  544. .cu-avatar{
  545. width:32rpx;height:32rpx
  546. }
  547. .content{
  548. left:50rpx
  549. }
  550. }
  551. .messagePush{
  552. .uni-checkbox .uni-checkbox-input{
  553. width:40rpx;
  554. height:40rpx;
  555. }
  556. }
  557. .fireBashWrapper{
  558. .cu-avatar{
  559. width:120rpx;
  560. height:100rpx
  561. }
  562. .cu-list.menu-avatar > .cu-item .content{
  563. left:140rpx;
  564. .pro-date{
  565. position:absolute;
  566. right:20rpx;
  567. bottom:0
  568. }
  569. }
  570. }
  571. // 消防知识库详情页
  572. .fireBashDetailWrapper{
  573. font-size:28rpx;
  574. .cu-avatar{
  575. width:50rpx;
  576. height:50rpx
  577. }
  578. .fireD-content{
  579. position:relative
  580. }
  581. .fireD-content:before{
  582. position: absolute;
  583. top: -8px;
  584. left: -15px;
  585. box-sizing: border-box;
  586. width: calc(100% + 30px);
  587. height: 1px;
  588. background:#EDEDED;
  589. content: " ";
  590. }
  591. .fireD-content view{
  592. line-height:1.5;
  593. // text-indent:56rpx;
  594. }
  595. }
  596. .fireD-tit{
  597. font-size:32rpx;
  598. font-weight:bold
  599. }
  600. .preAndNext{
  601. color:#4074E7;
  602. margin:30rpx 0 80rpx;
  603. }
  604. // 月报详情
  605. .reportD-wrapper{
  606. .title-wrapper{
  607. background:#EFF4FF;
  608. }
  609. .title{
  610. line-height:2
  611. }
  612. .other view{
  613. margin-bottom:10rpx;
  614. }
  615. }
  616. .chart-tit{
  617. color:#4074E7;
  618. font-size:32rpx;
  619. }
  620. // 提交页面
  621. .successWrapper{
  622. text-align:center;
  623. padding-top:100rpx;
  624. img{
  625. width:313rpx;
  626. margin-right:32rpx;
  627. margin-bottom:20rpx
  628. }
  629. view{
  630. font-size:36rpx;
  631. }
  632. }
  633. // 设备注册
  634. .deviceRegistList{
  635. // height:calc(100vh - 490rpx);
  636. checkbox{
  637. position:absolute;
  638. left:0
  639. }
  640. .cu-list.menu-avatar > .cu-item > .cu-avatar{
  641. left:64rpx;
  642. }
  643. .cu-list.menu-avatar > .cu-item .content{
  644. left:170rpx
  645. }
  646. }
  647. .deviceRegistWrapper{
  648. .checkAll{
  649. position:absolute;
  650. top:-60rpx;
  651. left:22rpx
  652. }
  653. .cu-form-group{
  654. min-height:30rpx;
  655. margin-top:0
  656. }
  657. }
  658. // 导出页面样式start
  659. .cu-dialog{
  660. width:505rpx
  661. }
  662. .cu-modal .cu-dialog>.cu-bar:first-child .action{
  663. min-height:50rpx;
  664. min-width:auto;
  665. }
  666. .cu-dialog{
  667. border-radius:20rpx
  668. }
  669. .export-modal{
  670. .cu-bar .action:first-child{
  671. margin-left:70rpx;
  672. }
  673. .cu-bar.operate .action:last-child{
  674. margin-right:70rpx;
  675. color:#fff;
  676. background:#4074E7;
  677. }
  678. .cu-bar.operate .action{
  679. width:158rpx;
  680. border: 1px solid #bfbfbf;
  681. border-radius: 29rpx;
  682. line-height:56rpx;
  683. font-size:26rpx;
  684. }
  685. }
  686. // 导出页面样式end