common.scss 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841
  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. padding-left:24rpx;
  360. color:#999
  361. }
  362. // 未处理textarea样式
  363. /* // 处理内容 */
  364. .cu-form-group {
  365. background: #f5f5f5;
  366. }
  367. .processStatus {
  368. textarea {
  369. background: #F5F5F5;
  370. color: #999999;
  371. padding:20rpx;
  372. }
  373. }
  374. // textarea
  375. .JTxtArea {
  376. position: relative;
  377. &.sm {
  378. min-height: 60rpx;
  379. }
  380. &.lg {
  381. min-height: 120rpx;
  382. }
  383. &:after {
  384. content: attr(data-maxnum);
  385. position: absolute;
  386. right: 10rpx;
  387. bottom: 0px;
  388. }
  389. }
  390. // 设备类型
  391. .cu-list.menu-avatar .deviceTypeItem.cu-item{
  392. height:110rpx;
  393. .content{
  394. left:100rpx!important
  395. }
  396. .cu-avatar.round{
  397. width:70rpx;
  398. height:70rpx
  399. }
  400. .title{
  401. font-size:32rpx!important;
  402. }
  403. .num{
  404. color:#666;
  405. }
  406. }
  407. // 设备详情
  408. .radiusStatus{
  409. width:20rpx;height:20rpx;border-radius:50%;display:inline-block;
  410. margin-right:6rpx
  411. }
  412. .radiusStatus.offLine{
  413. }
  414. .bg-offLine{
  415. background:#ABABAB;
  416. color:#666666;
  417. .radiusStatus{
  418. background:#666
  419. }
  420. }
  421. .bg-onLine{
  422. background:#08BE04;
  423. color:#fff;
  424. .radiusStatus{
  425. background:#fff
  426. }
  427. }
  428. // 巡检计划
  429. .plan-sec{
  430. border-radius:10rpx;
  431. }
  432. .plan-tit{
  433. font-size:34rpx
  434. }
  435. // 巡检新增
  436. .cu-form-group {
  437. border-top: 0;
  438. background: #fff;
  439. padding:0
  440. }
  441. input{
  442. border: 1px solid #EDEDED!important;
  443. }
  444. input,
  445. select,
  446. option {
  447. line-height: 70rpx;
  448. padding: 0 20rpx;
  449. height: 70rpx;
  450. border: 1px solid #EDEDED;
  451. background-color: #fff;
  452. box-sizing: border-box;
  453. appearance: none;
  454. -moz-appearance: none;
  455. -webkit-appearance: none;
  456. color: #999;
  457. }
  458. select:focus,
  459. select:active,
  460. select:hover {
  461. outline: none;
  462. }
  463. select {
  464. background: url(/static/arrow2.png) no-repeat scroll 98% center;
  465. background-size:28rpx;
  466. }
  467. textarea{
  468. border:1px solid #EDEDED;
  469. padding:10px;
  470. color: #999;
  471. }
  472. .form-item label text {
  473. position: relative;
  474. top: 2rpx
  475. }
  476. .form-item {
  477. padding: 0 40rpx;
  478. display: flex;
  479. align-items: top;
  480. margin-bottom: 20rpx;
  481. .title {
  482. width: 200rpx;
  483. position: relative;
  484. .necessary {
  485. color: red;
  486. display: inline-block;
  487. position: absolute;
  488. top: -2rpx;
  489. left: -20rpx;
  490. font-size: 40rpx;
  491. }
  492. }
  493. input,
  494. select {
  495. width: 500rpx;
  496. font-size: 28rpx;
  497. }
  498. }
  499. // 巡检详情,已执行
  500. .planDetailDone{
  501. .form-item{
  502. margin-left:24rpx;
  503. padding:26rpx 10rpx;
  504. border-top:1px solid #f1f1f1;
  505. margin-bottom:0
  506. }
  507. }
  508. .repairSquare{
  509. padding:18rpx 20rpx;
  510. border-radius:10rpx;
  511. }
  512. .repairSquare .num,.repairSquare .title{
  513. color:#fff
  514. }
  515. .repairSquare .num{
  516. font-size:36rpx
  517. }
  518. // 设备管理
  519. uni-input, select, option{
  520. border:none
  521. }
  522. // 风险保障
  523. .viewDetail{
  524. color:#4074E7;
  525. }
  526. .qa{
  527. .cu-list+.cu-list{
  528. margin-top:0
  529. }
  530. }
  531. .qa-des{
  532. color:#666;
  533. line-height:1.5;
  534. text-indent:64rpx
  535. }
  536. .bottom-line{
  537. background: rgba(221,221,221,.5);
  538. height:2rpx;
  539. margin-left:30rpx;
  540. }
  541. .cu-list.menu-avatar>.cu-item.qa-tit{
  542. height:auto;
  543. .cu-avatar{
  544. width:32rpx;height:32rpx
  545. }
  546. .content{
  547. left:50rpx
  548. }
  549. }
  550. .messagePush{
  551. .uni-checkbox .uni-checkbox-input{
  552. width:40rpx;
  553. height:40rpx;
  554. }
  555. }
  556. .fireBashWrapper{
  557. .cu-avatar{
  558. width:120rpx;
  559. height:100rpx
  560. }
  561. .cu-list.menu-avatar > .cu-item .content{
  562. left:140rpx;
  563. .pro-date{
  564. position:absolute;
  565. right:20rpx;
  566. bottom:0
  567. }
  568. }
  569. }
  570. // 消防知识库详情页
  571. .fireBashDetailWrapper{
  572. font-size:28rpx;
  573. .cu-avatar{
  574. width:50rpx;
  575. height:50rpx
  576. }
  577. .fireD-content{
  578. position:relative
  579. }
  580. .fireD-content:before{
  581. position: absolute;
  582. top: -8px;
  583. left: -15px;
  584. box-sizing: border-box;
  585. width: calc(100% + 30px);
  586. height: 1px;
  587. background:#EDEDED;
  588. content: " ";
  589. }
  590. .fireD-content view{
  591. line-height:1.5;
  592. // text-indent:56rpx;
  593. }
  594. }
  595. .fireD-tit{
  596. font-size:32rpx;
  597. font-weight:bold
  598. }
  599. .preAndNext{
  600. color:#4074E7;
  601. margin:30rpx 0 80rpx;
  602. }
  603. // 月报详情
  604. .reportD-wrapper{
  605. .title-wrapper{
  606. background:#EFF4FF;
  607. }
  608. .title{
  609. line-height:2
  610. }
  611. .other view{
  612. margin-bottom:10rpx;
  613. }
  614. }
  615. .chart-tit{
  616. color:#4074E7;
  617. font-size:32rpx;
  618. }
  619. // 提交页面
  620. .successWrapper{
  621. text-align:center;
  622. padding-top:100rpx;
  623. img{
  624. width:313rpx;
  625. margin-right:32rpx;
  626. margin-bottom:20rpx
  627. }
  628. view{
  629. font-size:36rpx;
  630. }
  631. }
  632. // 设备注册
  633. .deviceRegistList{
  634. // height:calc(100vh - 490rpx);
  635. checkbox{
  636. position:absolute;
  637. left:0
  638. }
  639. .cu-list.menu-avatar > .cu-item > .cu-avatar{
  640. left:64rpx;
  641. }
  642. .cu-list.menu-avatar > .cu-item .content{
  643. left:170rpx
  644. }
  645. }
  646. .deviceRegistWrapper{
  647. .checkAll{
  648. position:absolute;
  649. top:-60rpx;
  650. left:22rpx
  651. }
  652. .cu-form-group{
  653. min-height:30rpx;
  654. margin-top:0
  655. }
  656. }
  657. // 导出页面样式start
  658. .cu-dialog{
  659. width:505rpx
  660. }
  661. .cu-modal .cu-dialog>.cu-bar:first-child .action{
  662. min-height:50rpx;
  663. min-width:auto;
  664. }
  665. .cu-dialog{
  666. border-radius:20rpx
  667. }
  668. .export-modal{
  669. .cu-bar .action:first-child{
  670. margin-left:70rpx;
  671. }
  672. .cu-bar.operate .action:last-child{
  673. margin-right:70rpx;
  674. color:#fff;
  675. background:#4074E7;
  676. }
  677. .cu-bar.operate .action{
  678. width:158rpx;
  679. border: 1px solid #bfbfbf;
  680. border-radius: 29rpx;
  681. line-height:56rpx;
  682. font-size:26rpx;
  683. }
  684. }
  685. // 导出页面样式end