common.scss 13 KB

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