app.scss 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750
  1. @import '~@/uni.scss';
  2. .nav-title {
  3. width: 100%;
  4. display: flex;
  5. flex-direction: row;
  6. justify-content: center;
  7. align-items: center;
  8. text {
  9. color: white;
  10. font-size: 1rem;
  11. }
  12. }
  13. .container {
  14. padding: 0 0 10rpx;
  15. }
  16. .decoration {
  17. width: 6px;
  18. height: 6px;
  19. margin-right: 4px;
  20. border-radius: 50%;
  21. background-color: cadetblue;
  22. }
  23. .items-line{
  24. display: flex;
  25. flex-direction: row;
  26. justify-content: flex-start;
  27. align-items: center;
  28. }
  29. .list-item-block{
  30. width: 100%;
  31. display: flex;
  32. flex-direction: column;
  33. justify-content: flex-start;
  34. .line{
  35. display: flex;
  36. flex-direction: row;
  37. justify-content: flex-start;
  38. align-items: center;
  39. flex-wrap: wrap;
  40. .block {
  41. display: flex;
  42. flex-direction: column;
  43. align-items: center;
  44. justify-content: center;
  45. }
  46. .title{
  47. padding-left: 2px;
  48. padding-right: 5px;
  49. font-size: 0.9rem;
  50. color: black;
  51. }
  52. .text{
  53. padding-left: 2px;
  54. padding-right: 5px;
  55. font-size: 0.8rem;
  56. color: black;
  57. }
  58. .lable {
  59. font-size: 0.8rem;
  60. min-width: 50px;
  61. color: black;
  62. }
  63. .content {
  64. margin-left: 5px;
  65. font-size: 0.8rem;
  66. color: gray;
  67. }
  68. .text-ellipsis {
  69. overflow: hidden;
  70. white-space: nowrap;
  71. text-overflow: ellipsis;
  72. }
  73. .text-underline {
  74. text-decoration-line: underline;
  75. }
  76. }
  77. }
  78. .item-title-run-status-icon {
  79. /* #ifndef APP-NVUE */
  80. display: block;
  81. /* #endif */
  82. // margin-right: 10px;
  83. width: 20px;
  84. height: 20px;
  85. border-radius: 50%;
  86. }
  87. .item-title-rtu-name {
  88. margin-left: 10rpx;
  89. font-size: 0.9rem;
  90. }
  91. .item-title-warn-name-ellipsis {
  92. overflow: hidden;
  93. margin-left: 10rpx;
  94. font-size: 0.8rem;
  95. white-space: nowrap;
  96. text-overflow: ellipsis;
  97. color: coral;
  98. text-decoration-line: underline;
  99. }
  100. .item-title-rtu-code {
  101. margin-left: 10rpx;
  102. font-size: 0.8rem;
  103. color: gray;
  104. }
  105. .item-adcd-adnm-text {
  106. overflow: hidden;
  107. margin-right: 5px;
  108. font-size: 0.7rem;
  109. white-space: nowrap;
  110. text-overflow: ellipsis;
  111. }
  112. .item-up-time-text {
  113. overflow: hidden;
  114. margin-right: 5px;
  115. font-size: 0.7rem;
  116. white-space: nowrap;
  117. text-overflow: ellipsis;
  118. }
  119. .item-text-lable {
  120. font-size: 0.7rem;
  121. min-width: 50px;
  122. }
  123. .item-text-content {
  124. margin-left: 5px;
  125. font-size: 0.7rem;
  126. color: gray;
  127. }
  128. .item-text-content-phone{
  129. margin-left: 5px;
  130. font-size: 0.7rem;
  131. color: skyblue;
  132. text-decoration-line: underline;
  133. }
  134. .text-under-line{
  135. text-decoration-line: underline;
  136. }
  137. .item-text-content-ellipsis {
  138. overflow: hidden;
  139. margin-left: 5px;
  140. font-size: 0.7rem;
  141. color: gray;
  142. white-space: nowrap;
  143. text-overflow: ellipsis;
  144. }
  145. .item-button-group {
  146. padding-top: 4px;
  147. display: flex;
  148. flex-direction: row;
  149. justify-content: flex-end;
  150. flex-flow: row wrap;
  151. .item-button {
  152. display: flex;
  153. flex-direction: row;
  154. justify-content: center;
  155. width: 90px;
  156. height: 28px;
  157. margin-left: 5px;
  158. margin-top: 3px;
  159. margin-bottom: 3px;
  160. border-radius: 7px;
  161. background-color: lightblue;
  162. .button-icon {
  163. display: flex;
  164. flex-direction: column;
  165. justify-content: center;
  166. }
  167. .button-text {
  168. display: flex;
  169. flex-direction: column;
  170. justify-content: center;
  171. padding-left: 5px;
  172. color: black;
  173. font-size: 0.6rem;
  174. }
  175. }
  176. .mid-size{
  177. width: 120px;
  178. }
  179. .item-button-disabled {
  180. display: flex;
  181. flex-direction: row;
  182. justify-content: center;
  183. width: 90px;
  184. height: 28px;
  185. margin-left: 5px;
  186. margin-top: 3px;
  187. margin-bottom: 3px;
  188. border-radius: 7px;
  189. background-color: lightgrey;
  190. .button-icon {
  191. display: flex;
  192. flex-direction: column;
  193. justify-content: center;
  194. }
  195. .button-text {
  196. display: flex;
  197. flex-direction: column;
  198. justify-content: center;
  199. padding-left: 5px;
  200. color: black;
  201. font-size: 0.6rem;
  202. }
  203. }
  204. }
  205. .pagination-block {
  206. width: 100%;
  207. }
  208. .search-block{
  209. width: 100%;
  210. display: flex;
  211. flex-direction: column;
  212. justify-content: flex-start;
  213. padding-bottom: 10px;
  214. }
  215. .search-block .name{
  216. margin-top: 5px;
  217. padding-left: 10px;
  218. padding-right: 10px;
  219. }
  220. .search-block .adcd-adnm{
  221. margin-top: 5px;
  222. padding-left: 10px;
  223. padding-right: 10px;
  224. }
  225. .search-block .rtu-name{
  226. margin-top: 5px;
  227. padding-left: 10px;
  228. padding-right: 10px;
  229. }
  230. .search-block .rtu-code{
  231. margin-top: 5px;
  232. padding-left: 10px;
  233. padding-right: 10px;
  234. }
  235. .search-block .submit-btn{
  236. margin-top: 5px;
  237. padding-left: 10px;
  238. padding-right: 10px;
  239. }
  240. .count-info-block{
  241. padding-top: 5px;
  242. padding-bottom: 5px;
  243. padding-left: 10px;
  244. padding-right: 10px;
  245. }
  246. .count-info-block .rtuCount{
  247. display: flex;
  248. flex-direction: row;
  249. align-items: center;
  250. .name{
  251. color: dimgray;
  252. font-size: 0.7rem;
  253. }
  254. .count{
  255. margin-left: 5px;
  256. color: dodgerblue;
  257. font-size: 0.7rem;
  258. }
  259. }
  260. .count-info-block .warnRtuCount {
  261. display: flex;
  262. flex-direction: row;
  263. align-items: center;
  264. .name{
  265. color: dimgray;
  266. font-size: 0.7rem;
  267. }
  268. .count{
  269. margin-left: 5px;
  270. color: red;
  271. font-size: 0.7rem;
  272. }
  273. }
  274. .count-info-block .orderCount {
  275. display: flex;
  276. flex-direction: row;
  277. align-items: center;
  278. .name{
  279. color: dimgray;
  280. font-size: 0.7rem;
  281. }
  282. .count{
  283. margin-left: 5px;
  284. color: dodgerblue;
  285. font-size: 0.7rem;
  286. }
  287. }
  288. .count-info-block .unconfirmOrderCount {
  289. display: flex;
  290. flex-direction: row;
  291. align-items: center;
  292. .name{
  293. color: dimgray;
  294. font-size: 0.7rem;
  295. }
  296. .count{
  297. margin-left: 5px;
  298. color: red;
  299. font-size: 0.7rem;
  300. }
  301. }
  302. .count-info-block .processOrderCount {
  303. display: flex;
  304. flex-direction: row;
  305. align-items: center;
  306. .name{
  307. color: dimgray;
  308. font-size: 0.7rem;
  309. }
  310. .count{
  311. margin-left: 5px;
  312. color: green;
  313. font-size: 0.7rem;
  314. }
  315. }
  316. .count-info-block .delayComfireOrders {
  317. display: flex;
  318. flex-direction: row;
  319. align-items: center;
  320. .name{
  321. color: dimgray;
  322. font-size: 0.7rem;
  323. }
  324. .count{
  325. margin-left: 5px;
  326. color: red;
  327. font-size: 0.7rem;
  328. }
  329. }
  330. .count-info-block .equipmentInspectionCount {
  331. display: flex;
  332. flex-direction: row;
  333. align-items: center;
  334. .name{
  335. color: dimgray;
  336. font-size: 0.7rem;
  337. }
  338. .count{
  339. margin-left: 5px;
  340. color: dodgerblue;
  341. font-size: 0.7rem;
  342. }
  343. }
  344. .count-info-block .equipmentInspectionBeforeRainCount {
  345. display: flex;
  346. flex-direction: row;
  347. align-items: center;
  348. .name{
  349. color: dimgray;
  350. font-size: 0.7rem;
  351. }
  352. .count{
  353. margin-left: 5px;
  354. color: dodgerblue;
  355. font-size: 0.7rem;
  356. }
  357. }
  358. .count-info-block .equipmentInspectionRainFirstCount {
  359. display: flex;
  360. flex-direction: row;
  361. align-items: center;
  362. .name{
  363. color: dimgray;
  364. font-size: 0.7rem;
  365. }
  366. .count{
  367. margin-left: 5px;
  368. color: dodgerblue;
  369. font-size: 0.7rem;
  370. }
  371. }
  372. .count-info-block .equipmentInspectionRainSecondCount {
  373. display: flex;
  374. flex-direction: row;
  375. align-items: center;
  376. .name{
  377. color: dimgray;
  378. font-size: 0.7rem;
  379. }
  380. .count{
  381. margin-left: 5px;
  382. color: dodgerblue;
  383. font-size: 0.7rem;
  384. }
  385. }
  386. /* start--演示页面使用的统一样式--start */
  387. .u-demo {
  388. padding: 25px 20px;
  389. }
  390. .u-demo-wrap {
  391. border-width: 1px;
  392. border-color: #ddd;
  393. border-style: dashed;
  394. background-color: rgb(250, 250, 250);
  395. padding: 20px 10px;
  396. border-radius: 3px;
  397. }
  398. .u-demo-area {
  399. text-align: center;
  400. }
  401. .u-no-demo-here {
  402. color: $u-tips-color;
  403. font-size: 13px;
  404. }
  405. .u-demo-result-line {
  406. border-width: 1px;
  407. border-color: #ddd;
  408. border-style: dashed;
  409. padding: 5px 20px;
  410. margin-top: 30px;
  411. border-radius: 5px;
  412. background-color: rgb(240, 240, 240);
  413. color: $u-content-color;
  414. font-size: 16px;
  415. /* #ifndef APP-NVUE */
  416. word-break: break-word;
  417. display: inline-block;
  418. /* #endif */
  419. text-align: left;
  420. }
  421. .u-demo-title,
  422. .u-config-title {
  423. text-align: center;
  424. font-size: 16px;
  425. font-weight: bold;
  426. margin-bottom: 20px;
  427. }
  428. .u-config-item {
  429. margin-top: 25px;
  430. }
  431. .u-config-title {
  432. margin-top: 20px;
  433. padding-bottom: 5px;
  434. }
  435. .u-item-title {
  436. position: relative;
  437. font-size: 15px;
  438. padding-left: 8px;
  439. line-height: 1;
  440. margin-bottom: 11px;
  441. }
  442. .u-item-title:after {
  443. position: absolute;
  444. width: 4px;
  445. top: -1px;
  446. height: 16px;
  447. /* #ifndef APP-NVUE */
  448. content: '';
  449. /* #endif */
  450. left: 0;
  451. border-radius: 10px;
  452. background-color: $u-content-color;
  453. }
  454. .view-flex-rs {
  455. display: flex;
  456. flex-direction: row;
  457. justify-content: flex-start;
  458. align-items: center;
  459. flex-wrap: wrap;
  460. }
  461. .view-flex-rc {
  462. display: flex;
  463. flex-direction: row;
  464. justify-content: center;
  465. align-items: center;
  466. }
  467. .view-flex-cc {
  468. display: flex;
  469. flex-direction: column;
  470. justify-content: center;
  471. align-items: center;
  472. }
  473. .view-flex-rs-flex-wrap {
  474. display: flex;
  475. flex-direction: row;
  476. justify-content: flex-start;
  477. flex-wrap: wrap;
  478. }
  479. .view-flex-block-center {
  480. display: flex;
  481. flex-direction: column;
  482. justialign-items: center;
  483. justify-content: center;
  484. align-items: center;
  485. }
  486. .view-flex-inline {
  487. display: flex;
  488. flex-direction: row;
  489. justify-content: flex-start;
  490. align-items: center;
  491. flex-wrap: wrap;
  492. }
  493. .view-flex-inline-center {
  494. display: flex;
  495. flex-direction: row;
  496. justify-content: center;
  497. align-items: center;
  498. flex-wrap: wrap;
  499. }
  500. .view-flex-inline-end {
  501. display: flex;
  502. flex-direction: row;
  503. justify-content: flex-end;
  504. align-items: center;
  505. flex-wrap: wrap;
  506. }
  507. .list-item-title {
  508. margin-left: 5rpx;
  509. font-size: 0.7rem;
  510. font-weight: bold;
  511. }
  512. .list-item-sub-title {
  513. margin-left: 5rpx;
  514. font-size: 0.6rem;
  515. color: gray;
  516. }
  517. .list-item-text{
  518. padding-left: 2px;
  519. padding-right: 5px;
  520. font-size: 0.7rem;
  521. }
  522. .list-item-text-ellipsis {
  523. width: 100%;
  524. overflow: hidden;
  525. white-space: nowrap;
  526. text-overflow: ellipsis;
  527. }
  528. .footer {
  529. position: fixed;
  530. bottom: 0;
  531. left: 0;
  532. right: 0;
  533. z-index: 1;
  534. height: 100rpx;
  535. padding: 20rpx;
  536. box-sizing: border-box;
  537. display: flex;
  538. align-items: center;
  539. justify-content: flex-end;
  540. background-color: whitesmoke;
  541. .ipt {
  542. width: 380rpx;
  543. height: 77rpx;
  544. background: #f7f7f7;
  545. border-radius: 38px;
  546. padding: 0 37rpx;
  547. box-sizing: border-box;
  548. margin-right: 20rpx;
  549. }
  550. .control {
  551. flex: 1;
  552. display: flex;
  553. align-items: center;
  554. justify-content: flex-end;
  555. .block {
  556. display: flex;
  557. align-items: center;
  558. justify-content: center;
  559. flex: 1;
  560. }
  561. .icon {
  562. height: auto;
  563. }
  564. .c {
  565. width: 41rpx;
  566. margin-right: 10rpx;
  567. }
  568. .s {
  569. width: 36rpx;
  570. }
  571. .t {
  572. width: 31rpx;
  573. }
  574. }
  575. }
  576. .img-container {
  577. margin-bottom: 0px;
  578. width: 100px;
  579. height: 100px;
  580. .note-image-box {
  581. margin-top: 0px;
  582. display: flex;
  583. flex-wrap: wrap;
  584. padding: 10px;
  585. .note-image-item {
  586. position: relative;
  587. width: 100%;
  588. height: 0;
  589. padding-top: 100%;
  590. box-sizing: border-box;
  591. // background-color: #18B566;
  592. .close-icon {
  593. display: flex;
  594. justify-content: center;
  595. align-items: center;
  596. position: absolute;
  597. right: 0px;
  598. top: 0px;
  599. width: 22px;
  600. height: 22px;
  601. border-radius: 50%;
  602. background-color: #d5d5d5;
  603. z-index: 2;
  604. }
  605. .image-box {
  606. display: flex;
  607. justify-content: center;
  608. align-items: center;
  609. position: absolute;
  610. top: 0px;
  611. right: 0px;
  612. border: 0px;
  613. left: 0px;
  614. border: 1px #eee solid;
  615. border-radius: 5px;
  616. overflow: hidden;
  617. width: 99%;
  618. height: 99%;
  619. }
  620. }
  621. }
  622. }
  623. /* end--演示页面使用的统一样式--end */