index.scss 22 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207
  1. .common-table-action {
  2. display: flex;
  3. justify-content: flex-end;
  4. flex-direction: column;
  5. line-height: 1.5;
  6. }
  7. * {
  8. box-sizing: border-box;
  9. }
  10. swiper {
  11. flex: 1;
  12. }
  13. .swiper-item {
  14. padding: 0.2rem;
  15. height: 100%;
  16. box-sizing: border-box;
  17. overflow-y: scroll;
  18. }
  19. .table-content {
  20. margin-top: 0.2rem;
  21. }
  22. .panel-head {
  23. align-items: center;
  24. button {
  25. margin: 0 0.1rem 0 0;
  26. }
  27. .status {
  28. align-items: center;
  29. view {
  30. line-height: 1;
  31. }
  32. .color {
  33. width: 0.16rem;
  34. height: 0.16rem;
  35. margin: 0 0.1rem 0 0.3rem;
  36. }
  37. }
  38. }
  39. .wait_confirm {
  40. background: $uni-color-primary;
  41. border-color: $uni-color-primary;
  42. }
  43. .wait_to_store {
  44. background: #1475fa;
  45. border-color: #1475fa;
  46. }
  47. .arrived_store {
  48. background: #fa5b14;
  49. border-color: #fa5b14;
  50. }
  51. .completed {
  52. background-color: #10c610;
  53. border-color: #10c610;
  54. }
  55. .cancelled {
  56. background-color: #cccccc;
  57. border-color: #cccccc;
  58. }
  59. .panel-body {
  60. margin-top: 0.2rem;
  61. border: 0.01rem solid #e6e6e6;
  62. height: calc(100% - 0.6rem);
  63. .head-time {
  64. height: 0.7rem;
  65. border-bottom: 0.01rem solid #e6e6e6;
  66. position: relative;
  67. justify-content: center;
  68. & > .item {
  69. display: flex;
  70. align-items: center;
  71. justify-content: center;
  72. margin: 0 0.2rem;
  73. .iconfont {
  74. font-size: 0.18rem;
  75. }
  76. .active {
  77. color: #fff;
  78. background-color: $primary-color;
  79. border-color: $primary-color;
  80. }
  81. }
  82. .time-box {
  83. display: flex;
  84. align-items: center;
  85. justify-content: center;
  86. font-size: 0.18rem;
  87. }
  88. .head-time-switch {
  89. position: absolute;
  90. right: 0.2rem;
  91. width: 0.7rem;
  92. display: flex;
  93. bottom: 0.2rem;
  94. view {
  95. border: 0.01rem solid #ccc;
  96. width: 0.35rem;
  97. box-sizing: border-box;
  98. text-align: center;
  99. padding: 0.03rem;
  100. &.active {
  101. color: #fff;
  102. background-color: $primary-color;
  103. border-color: $primary-color;
  104. }
  105. }
  106. view:first-child {
  107. border-right: 0;
  108. }
  109. }
  110. }
  111. .head,
  112. .body {
  113. & > .item {
  114. display: flex;
  115. align-items: center;
  116. justify-content: center;
  117. flex: 1;
  118. border-right: 0.01rem solid #e6e6e6;
  119. width: calc(100% / 7);
  120. &:last-child {
  121. border-right: 0;
  122. }
  123. }
  124. }
  125. .head {
  126. height: 0.6rem;
  127. border-bottom: 0.01rem solid #e6e6e6;
  128. button {
  129. font-size: 0.12rem;
  130. padding: 0 0.1rem;
  131. &.active {
  132. background-color: $primary-color !important;
  133. color: #fff !important;
  134. border-color: $primary-color !important;
  135. }
  136. }
  137. uni-button:after {
  138. width: 199%;
  139. }
  140. text {
  141. font-size: 0.12rem;
  142. margin-left: 0.05rem;
  143. }
  144. }
  145. .body {
  146. height: calc(100% - 1.3rem);
  147. & > view {
  148. height: 100%;
  149. }
  150. .common-scrollbar {
  151. // overflow-y: scroll;
  152. // padding-bottom: 0.5rem;
  153. }
  154. .iconqianhou1,
  155. .iconqianhou2 {
  156. font-size: 0.28rem;
  157. color: #cccccc;
  158. }
  159. .panel-item {
  160. width: calc(100% - 0.14rem);
  161. margin: 0rem 0.07rem 0.15rem 0.07rem;
  162. padding: 0.1rem;
  163. border-width: 0.04rem 0.01rem 0.01rem 0.01rem;
  164. border-style: solid;
  165. box-sizing: border-box;
  166. border-radius: 0.04rem;
  167. background-color: #fff !important;
  168. &:last-child {
  169. margin-bottom: 0.2rem;
  170. }
  171. }
  172. .common-scrollbar {
  173. display: flex;
  174. justify-content: start;
  175. flex-direction: column;
  176. padding-top: 0.1rem;
  177. }
  178. .username {
  179. font-size: 0.14rem;
  180. line-height: 1;
  181. overflow: hidden;
  182. text-overflow: ellipsis;
  183. white-space: nowrap;
  184. }
  185. .time {
  186. color: #fff;
  187. font-size: 0.12rem;
  188. padding: 0.05rem;
  189. line-height: 1;
  190. width: auto;
  191. display: inline-block;
  192. margin-top: 0.1rem;
  193. border-radius: 0.02rem;
  194. }
  195. .service {
  196. margin-top: 0.1rem;
  197. line-height: 1.3;
  198. }
  199. .action {
  200. text-align: right;
  201. margin-top: 0.05rem;
  202. .iconfont {
  203. font-size: 0.2rem;
  204. color: #cccccc;
  205. }
  206. }
  207. }
  208. }
  209. .dropdown-menu {
  210. padding: 0.1rem 0;
  211. margin-top: 0.05rem;
  212. background-color: #fff;
  213. border: 0.01rem solid #ebeef5;
  214. border-radius: 0.04rem;
  215. box-shadow: 0 0.01rem 0.12rem 0 rgba(0, 0, 0, 0.1);
  216. position: relative;
  217. .arrow {
  218. position: absolute;
  219. top: -0.06rem;
  220. right: 0.06rem;
  221. width: 0;
  222. height: 0;
  223. border-left: 0.06rem solid transparent;
  224. border-right: 0.06rem solid transparent;
  225. border-bottom: 0.06rem solid #fff;
  226. }
  227. .menu-item {
  228. height: 0.35rem;
  229. display: flex;
  230. align-items: center;
  231. justify-content: center;
  232. margin: 0;
  233. padding: 0 0.1rem;
  234. text-align: center;
  235. cursor: pointer;
  236. transition: all 0.3s;
  237. font-size: 0.14rem;
  238. overflow: hidden;
  239. text-overflow: ellipsis;
  240. white-space: nowrap;
  241. &:hover {
  242. color: $primary-color;
  243. background: #f5f5f5;
  244. }
  245. }
  246. }
  247. // pop弹框
  248. .pop-box {
  249. background: #ffffff;
  250. width: 8rem;
  251. height: 7rem;
  252. .pop-header {
  253. padding: 0 0.15rem 0 0.2rem;
  254. height: 0.5rem;
  255. line-height: 0.5rem;
  256. border-bottom: 0.01rem solid #f0f0f0;
  257. font-size: 0.14rem;
  258. color: #333;
  259. overflow: hidden;
  260. border-radius: 0.02rem 0.2rem 0 0;
  261. box-sizing: border-box;
  262. display: flex;
  263. justify-content: space-between;
  264. .pop-header-text {
  265. }
  266. .pop-header-close {
  267. cursor: pointer;
  268. i {
  269. font-size: 0.18rem;
  270. }
  271. }
  272. }
  273. .pop-content {
  274. height: calc(100% - 1.05rem);
  275. overflow-y: scroll;
  276. padding: 0.2rem;
  277. box-sizing: border-box;
  278. }
  279. .pop-bottom {
  280. padding: 0.1rem;
  281. height: 0.65rem;
  282. border-top: 0.01rem solid #eee;
  283. button {
  284. width: 1rem;
  285. }
  286. }
  287. }
  288. //表单
  289. .form-content {
  290. .form-item {
  291. margin-bottom: 0.1rem;
  292. display: flex;
  293. .form-label {
  294. width: 1.3rem;
  295. text-align: right;
  296. padding-right: 0.1rem;
  297. box-sizing: border-box;
  298. height: 0.32rem;
  299. line-height: 0.32rem;
  300. .required {
  301. color: red;
  302. margin-right: 0.03rem;
  303. }
  304. }
  305. .form-inline {
  306. width: 2.4rem;
  307. line-height: 0.32rem;
  308. margin-right: 0.1rem;
  309. box-sizing: border-box;
  310. .form-input {
  311. border-width: 0.01rem;
  312. border-style: solid;
  313. background-color: #fff;
  314. color: rgba(0, 0, 0, 0.85);
  315. border-radius: 0.02rem;
  316. padding-left: 0.1rem;
  317. height: 0.32rem;
  318. line-height: 0.32rem;
  319. font-size: 0.14rem;
  320. border-color: #e6e6e6;
  321. border-radius: 0.02rem;
  322. }
  323. .form-textarea {
  324. border-width: 0.01rem;
  325. border-style: solid;
  326. background-color: #fff;
  327. color: rgba(0, 0, 0, 0.85);
  328. border-radius: 0.02rem;
  329. padding-left: 0.1rem;
  330. line-height: 0.32rem;
  331. font-size: 0.14rem;
  332. border-color: #e6e6e6;
  333. }
  334. }
  335. .search-wrap {
  336. position: relative;
  337. i {
  338. position: absolute;
  339. top: 50%;
  340. right: 0.1rem;
  341. transform: translateY(-50%);
  342. border-left: 0.01rem solid #e6e6e6;
  343. line-height: 0.3rem;
  344. padding-left: 0.1rem;
  345. cursor: pointer;
  346. }
  347. }
  348. }
  349. }
  350. .empty-member {
  351. color: #999;
  352. }
  353. .member-info {
  354. display: inline-flex;
  355. padding: 0.1rem;
  356. border: 0.01rem solid #e6e6e6;
  357. min-width: 3rem;
  358. max-width: 5.9rem;
  359. image {
  360. width: 0.5rem;
  361. height: 0.5rem;
  362. }
  363. .info {
  364. flex: 1;
  365. display: flex;
  366. flex-direction: column;
  367. padding-left: 0.1rem;
  368. justify-content: space-around;
  369. view {
  370. line-height: 1;
  371. }
  372. text {
  373. margin-right: 0.1rem;
  374. }
  375. }
  376. }
  377. .service-info {
  378. display: flex;
  379. flex-direction: revert;
  380. padding: 0.1rem;
  381. border: 0.01rem solid #e6e6e6;
  382. min-width: 3rem;
  383. max-width: 5.9rem;
  384. margin-bottom: 0.1rem;
  385. image {
  386. width: 0.5rem;
  387. height: 0.5rem;
  388. }
  389. .info {
  390. flex: 1;
  391. display: flex;
  392. flex-direction: column;
  393. padding-left: 0.1rem;
  394. justify-content: space-around;
  395. width: 2rem;
  396. view {
  397. line-height: 1.3;
  398. }
  399. .name {
  400. line-height: 1.5;
  401. }
  402. .text {
  403. color: #999;
  404. font-size: 0.12rem;
  405. margin-top: 0.05rem;
  406. text {
  407. margin-right: 0.05rem;
  408. }
  409. }
  410. }
  411. .action {
  412. display: flex;
  413. align-items: center;
  414. width: 0.5rem;
  415. view {
  416. color: $primary-color;
  417. cursor: pointer;
  418. }
  419. }
  420. }
  421. .select-btn {
  422. width: 1rem;
  423. margin: 0;
  424. margin-top: 0.1rem;
  425. }
  426. .service-list {
  427. background: #ffffff;
  428. width: 6rem;
  429. height: 4rem;
  430. }
  431. /deep/ .uni-scroll-view {
  432. &::-webkit-scrollbar {
  433. width: 0.06rem;
  434. height: 0.06rem;
  435. background-color: rgba($color: #000000, $alpha: 0);
  436. }
  437. &::-webkit-scrollbar-button {
  438. display: none;
  439. }
  440. &::-webkit-scrollbar-thumb {
  441. border-radius: 0.06rem;
  442. box-shadow: inset 0 0 0.06rem rgba(45, 43, 43, 0.45);
  443. background-color: #ddd;
  444. display: none;
  445. }
  446. &:hover::-webkit-scrollbar-thumb {
  447. display: block;
  448. }
  449. &::-webkit-scrollbar-track {
  450. background-color: transparent;
  451. }
  452. }
  453. // 预约详情
  454. .yuyue-info {
  455. background: #ffffff;
  456. width: 6.7rem;
  457. height: 6.5rem;
  458. }
  459. .make-server {
  460. max-height: 2rem;
  461. width: 4.5rem !important;
  462. }
  463. .yuyue-pop.form-content {
  464. .form-item {
  465. margin-bottom: 0.1rem;
  466. display: flex;
  467. .form-label {
  468. width: 1.6rem;
  469. text-align: right;
  470. padding-right: 0.1rem;
  471. box-sizing: border-box;
  472. height: 0.32rem;
  473. line-height: 0.32rem;
  474. .required {
  475. color: red;
  476. margin-right: 0.03rem;
  477. }
  478. }
  479. .form-inline {
  480. line-height: 0.32rem;
  481. margin-right: 0.1rem;
  482. box-sizing: border-box;
  483. .form-input {
  484. border-width: 0.01rem;
  485. border-style: solid;
  486. background-color: #fff;
  487. color: rgba(0, 0, 0, 0.85);
  488. border-radius: 0.02rem;
  489. padding-left: 0.1rem;
  490. height: 0.32rem;
  491. line-height: 0.32rem;
  492. font-size: 0.14rem;
  493. border-color: #e6e6e6;
  494. }
  495. .form-textarea {
  496. border-width: 0.01rem;
  497. border-style: solid;
  498. background-color: #fff;
  499. color: rgba(0, 0, 0, 0.85);
  500. border-radius: 0.02rem;
  501. padding-left: 0.1rem;
  502. line-height: 0.32rem;
  503. font-size: 0.14rem;
  504. border-color: #e6e6e6;
  505. }
  506. }
  507. .search-wrap {
  508. position: relative;
  509. i {
  510. position: absolute;
  511. top: 50%;
  512. right: 0.1rem;
  513. transform: translateY(-50%);
  514. border-left: 0.01rem solid #e6e6e6;
  515. line-height: 0.3rem;
  516. padding-left: 0.1rem;
  517. cursor: pointer;
  518. }
  519. text {
  520. margin-right: 0.2rem;
  521. }
  522. }
  523. }
  524. .table-container {
  525. width: 4rem;
  526. border: 0.01rem solid #e6e6e6;
  527. border-bottom: 0;
  528. .iconcheckbox_weiquanxuan,
  529. .iconfuxuankuang1,
  530. .iconfuxuankuang2 {
  531. color: $primary-color;
  532. cursor: pointer;
  533. font-size: 0.16rem;
  534. transition: all 0.3s;
  535. }
  536. .iconfuxuankuang2 {
  537. color: #e6e6e6;
  538. &:hover {
  539. color: $primary-color;
  540. }
  541. }
  542. }
  543. .thead {
  544. display: flex;
  545. width: 100%;
  546. height: 0.35rem;
  547. background: #f7f8fa;
  548. align-items: center;
  549. .th {
  550. padding: 0 0.1rem;
  551. flex: 5 1 0%;
  552. text-align: center;
  553. display: flex;
  554. .content {
  555. white-space: nowrap;
  556. width: 100%;
  557. overflow: hidden;
  558. text-overflow: ellipsis;
  559. }
  560. }
  561. }
  562. .tr {
  563. display: flex;
  564. border-bottom: 0.01rem solid #e6e6e6;
  565. min-height: 0.35rem;
  566. align-items: center;
  567. transition: background-color 0.3s;
  568. padding: 0.03rem 0;
  569. box-sizing: border-box;
  570. &:hover {
  571. background: #f5f5f5;
  572. }
  573. .td {
  574. padding: 0 0.1rem;
  575. flex: 5 1 0%;
  576. text-align: center;
  577. display: flex;
  578. .content {
  579. white-space: nowrap;
  580. width: 100%;
  581. overflow: hidden;
  582. text-overflow: ellipsis;
  583. }
  584. }
  585. }
  586. }
  587. // 添加预约表格
  588. .service-item,
  589. .servicer-item {
  590. display: flex;
  591. border: 0.01rem solid #e6e6e6;
  592. align-items: center;
  593. cursor: pointer;
  594. height: 0.52rem;
  595. width: 100%;
  596. }
  597. .service-item .iconfont,
  598. .servicer-item .iconfont {
  599. margin-right: 0.05rem;
  600. }
  601. .service-item .info,
  602. .servicer-item .info {
  603. flex: 1;
  604. padding: 0.06rem 0.1rem;
  605. width: calc(100% - 0.25rem);
  606. }
  607. .service-item .iconfont,
  608. .servicer-item .iconfont {
  609. width: 0.2rem;
  610. }
  611. .service-item .info .desc,
  612. .servicer-item .info .desc {
  613. font-size: 0.12rem;
  614. color: #999;
  615. }
  616. .service-item .info .title,
  617. .servicer-item .info .title {
  618. width: 100%;
  619. overflow: hidden;
  620. text-overflow: ellipsis;
  621. white-space: nowrap;
  622. }
  623. .select-service {
  624. width: 4rem;
  625. height: 2.2rem;
  626. box-sizing: border-box;
  627. padding: 0.15rem;
  628. .service-wrap {
  629. overflow-y: scroll;
  630. height: 100%;
  631. &::-webkit-scrollbar {
  632. width: 0.06rem;
  633. height: 0.06rem;
  634. background-color: transparent;
  635. }
  636. &::-webkit-scrollbar-button {
  637. display: none;
  638. }
  639. &::-webkit-scrollbar-thumb {
  640. border-radius: 0.06rem;
  641. box-shadow: inset 0 0 0.06rem rgba(45, 43, 43, 0.45);
  642. background-color: #ddd;
  643. }
  644. &::-webkit-scrollbar-track {
  645. background-color: transparent;
  646. }
  647. .flex-wrap {
  648. display: flex;
  649. flex-wrap: wrap;
  650. }
  651. .item {
  652. margin: 0 0.08rem 0.08rem 0;
  653. background: #eee;
  654. padding: 0.08rem;
  655. width: 1.78rem;
  656. cursor: pointer;
  657. transition: all 0.3s;
  658. &:hover {
  659. background: #fff5ed;
  660. }
  661. &:nth-child(2n + 2) {
  662. margin-right: 0;
  663. }
  664. }
  665. .title {
  666. width: 100%;
  667. overflow: hidden;
  668. text-overflow: ellipsis;
  669. white-space: nowrap;
  670. }
  671. .desc {
  672. font-size: 0.12rem;
  673. color: #999;
  674. }
  675. }
  676. }
  677. .save-wrap-block {
  678. height: 0.5rem;
  679. }
  680. .save-wrap {
  681. position: fixed;
  682. bottom: 0;
  683. left: 0;
  684. background: #fff;
  685. height: 0.5rem;
  686. display: flex;
  687. align-items: center;
  688. justify-content: center;
  689. border-top: 0.01rem solid #eee;
  690. width: 100%;
  691. }
  692. .select-servicer {
  693. width: 1.5rem;
  694. height: 2rem;
  695. box-sizing: border-box;
  696. padding: 0.15rem 0.1rem;
  697. overflow-y: scroll;
  698. }
  699. .select-servicer .select-item {
  700. width: 100%;
  701. height: 0.4rem;
  702. line-height: 0.4rem;
  703. overflow: hidden;
  704. text-overflow: ellipsis;
  705. padding: 0 0.1rem;
  706. background: #f5f5f5;
  707. cursor: pointer;
  708. margin-bottom: 0.1rem;
  709. transition: all 0.3s;
  710. }
  711. .select-servicer .select-item:hover {
  712. background: #fff5ed;
  713. }
  714. .select-servicer::-webkit-scrollbar {
  715. width: 0.06rem;
  716. height: 0.06rem;
  717. background-color: transparent;
  718. }
  719. .select-servicer::-webkit-scrollbar-button {
  720. display: none;
  721. }
  722. .select-servicer::-webkit-scrollbar-thumb {
  723. border-radius: 0.06rem;
  724. box-shadow: inset 0 0 0.06rem rgba(45, 43, 43, 0.45);
  725. background-color: #ddd;
  726. }
  727. .select-servicer::-webkit-scrollbar-track {
  728. background-color: transparent;
  729. }
  730. .table {
  731. display: flex;
  732. flex-direction: column;
  733. width: 6rem;
  734. border-width: 0.01rem 0.01rem 0 0.01rem;
  735. border-color: #e5e5e5;
  736. border-style: solid;
  737. .table-tr {
  738. width: 100%;
  739. display: flex;
  740. align-items: center;
  741. padding: 0.1rem 0;
  742. box-sizing: border-box;
  743. }
  744. .table-head.table-tr {
  745. background-color: #f7f8fa;
  746. .table-th {
  747. padding: 0 0.15rem;
  748. &:first-child {
  749. width: 50%;
  750. }
  751. &:nth-child(2) {
  752. width: 35%;
  753. }
  754. &:nth-child(3) {
  755. width: 15%;
  756. }
  757. }
  758. }
  759. .table-content.table-tr {
  760. border-bottom: 0.01rem solid #e5e5e5;
  761. margin-top: 0;
  762. .table-td {
  763. padding: 0 0.15rem;
  764. box-sizing: border-box;
  765. &:first-child {
  766. width: 50%;
  767. }
  768. &:nth-child(2) {
  769. width: 35%;
  770. }
  771. &:nth-child(3) {
  772. width: 15%;
  773. }
  774. .action-btn {
  775. color: $primary-color;
  776. cursor: pointer;
  777. }
  778. }
  779. }
  780. }
  781. .dropdown-content-box {
  782. padding: 0.05rem 0;
  783. margin-top: 0.05rem;
  784. background-color: #fff;
  785. border: 0.01rem solid #ebeef5;
  786. border-radius: 0.04rem;
  787. box-shadow: 0 0.01rem 0.12rem 0 rgba(0, 0, 0, 0.1);
  788. position: relative;
  789. .arrow {
  790. position: absolute;
  791. top: -0.06rem;
  792. right: 0.06rem;
  793. width: 0;
  794. height: 0;
  795. border-left: 0.06rem solid transparent;
  796. border-right: 0.06rem solid transparent;
  797. border-bottom: 0.06rem solid #fff;
  798. }
  799. .text {
  800. display: flex;
  801. align-items: center;
  802. justify-content: center;
  803. margin: 0;
  804. padding: 0 0.1rem;
  805. transition: all 0.3s;
  806. font-size: 0.12rem;
  807. width: 1.5rem;
  808. box-sizing: border-box;
  809. text-align: left;
  810. line-height: 1.5;
  811. }
  812. }
  813. .yuyuelist {
  814. width: 100%;
  815. height: 100%;
  816. display: flex;
  817. align-items: center;
  818. justify-content: space-between;
  819. padding: 0;
  820. box-sizing: border-box;
  821. .yuyuelist-box {
  822. width: 100%;
  823. height: 100%;
  824. background: #ffffff;
  825. display: flex;
  826. .yuyuelist-left {
  827. width: 5rem;
  828. height: 100%;
  829. border-right: 0.01rem solid #e6e6e6;
  830. box-sizing: border-box;
  831. .yuyue-title {
  832. text-align: center;
  833. line-height: 0.6rem;
  834. font-size: 0.18rem;
  835. font-weight: 500;
  836. height: 0.6rem;
  837. border-bottom: 0.01rem solid #e6e6e6;
  838. box-sizing: border-box;
  839. position: relative;
  840. .icongengduo1 {
  841. position: absolute;
  842. top: 50%;
  843. right: 0.2rem;
  844. transform: translateY(-50%);
  845. font-size: 0.3rem;
  846. color: $uni-color-primary;
  847. }
  848. }
  849. .yuyue-search {
  850. width: 100%;
  851. height: 0.6rem;
  852. border-bottom: 0.01rem solid #e6e6e6;
  853. display: flex;
  854. align-items: center;
  855. justify-content: center;
  856. padding: 0 0.2rem;
  857. box-sizing: border-box;
  858. .search {
  859. width: 5.6rem;
  860. height: 0.4rem;
  861. border-radius: 0.04rem;
  862. background: #f5f5f5;
  863. display: flex;
  864. align-items: center;
  865. padding: 0 0.2rem;
  866. box-sizing: border-box;
  867. .iconfont {
  868. font-size: 0.16rem;
  869. color: #909399;
  870. margin-right: 0.11rem;
  871. }
  872. input {
  873. width: 80%;
  874. height: 60%;
  875. border: none;
  876. font-size: 0.14rem;
  877. }
  878. }
  879. }
  880. .yuyue-list-scroll {
  881. width: 100%;
  882. height: calc(100% - 1.2rem);
  883. .itemhover {
  884. background: #f3eeff;
  885. }
  886. .item {
  887. width: 100%;
  888. display: flex;
  889. flex-direction: column;
  890. padding: 0.15rem;
  891. box-sizing: border-box;
  892. border-bottom: 0.01rem solid #e6e6e6;
  893. .item-head{
  894. display: flex;
  895. align-items: center;
  896. margin-bottom: 20rpx;
  897. }
  898. image {
  899. width: 0.35rem;
  900. height: 0.35rem;
  901. margin-right: 0.1rem;
  902. border-radius: 50%;
  903. }
  904. .item-right {
  905. flex: 1;
  906. display: flex;
  907. align-items: center;
  908. width: calc(100% - 0.6rem);
  909. .yuyue-name {
  910. max-width: 2.35rem;
  911. margin-right: .05rem;
  912. overflow: hidden;
  913. text-overflow: ellipsis;
  914. white-space: nowrap;
  915. font-size: 0.16rem;
  916. }
  917. .yuyue-desc {
  918. font-size: 0.14rem;
  919. }
  920. }
  921. .item-common{
  922. margin-top: 14rpx;
  923. line-height: 1;
  924. color: $uni-text-color-grey;
  925. font-size: $uni-font-size-base;
  926. }
  927. .yuyue-project{
  928. line-height: 1.3;
  929. overflow: hidden;
  930. text-overflow: ellipsis;
  931. display: -webkit-box;
  932. -webkit-line-clamp: 2;
  933. -webkit-box-orient: vertical;
  934. }
  935. }
  936. .item.active {
  937. background-color: #f3eeff;
  938. }
  939. }
  940. }
  941. .yuyuelist-right {
  942. width: calc(100% - 5rem);
  943. height: 100%;
  944. box-sizing: border-box;
  945. position: relative;
  946. padding-bottom: 1rem;
  947. .yuyue-title {
  948. text-align: center;
  949. line-height: 0.6rem;
  950. font-size: 0.18rem;
  951. font-weight: 500;
  952. height: 0.6rem;
  953. border-bottom: 0.01rem solid #e6e6e6;
  954. box-sizing: border-box;
  955. position: relative;
  956. .icongengduo1 {
  957. position: absolute;
  958. top: 50%;
  959. right: 0.2rem;
  960. transform: translateY(-50%);
  961. font-size: 0.3rem;
  962. color: $uni-color-primary;
  963. }
  964. }
  965. .button-box {
  966. width: 100%;
  967. position: absolute;
  968. bottom: 0;
  969. left: 0;
  970. background: #fff;
  971. padding: 0.15rem;
  972. border-top: 0.01rem solid #e6e6e6;
  973. .button {
  974. height: 0.3rem;
  975. color: $uni-color-primary;
  976. text-align: center;
  977. line-height: 0.3rem;
  978. float: right;
  979. font-size: 0.16rem;
  980. margin-left: 0.1rem;
  981. border: 0.01rem solid $uni-color-primary;
  982. }
  983. .buttonhvoer {
  984. color: #ffffff;
  985. background: $uni-color-primary;
  986. }
  987. }
  988. .button-box:after {
  989. overflow: hidden;
  990. content: '';
  991. height: 0;
  992. display: block;
  993. clear: both;
  994. }
  995. .yuyue-information {
  996. width: 100%;
  997. padding: 0.2rem 0.4rem 0.2rem 0.2rem;
  998. box-sizing: border-box;
  999. height: calc(100% - 0.6rem);
  1000. overflow: scroll;
  1001. .title {
  1002. font-size: 0.18rem;
  1003. margin-bottom: 0.32rem;
  1004. }
  1005. .title2 {
  1006. margin-bottom: 0.35rem;
  1007. }
  1008. .information-box {
  1009. display: flex;
  1010. justify-content: space-between;
  1011. .box-left {
  1012. width: 5rem;
  1013. .information {
  1014. width: 100%;
  1015. padding-left: 0.1rem;
  1016. box-sizing: border-box;
  1017. display: flex;
  1018. align-items: center;
  1019. margin-bottom: 0.3rem;
  1020. view {
  1021. color: #303133;
  1022. font-size: 0.14rem;
  1023. }
  1024. view:nth-child(1) {
  1025. width: 1.2rem;
  1026. text-align: right;
  1027. }
  1028. view:nth-child(2) {
  1029. width: calc(100% - 1.2rem);
  1030. margin-right: 0.23rem;
  1031. text-overflow: ellipsis;
  1032. overflow: hidden;
  1033. white-space: nowrap;
  1034. }
  1035. }
  1036. .information:last-child {
  1037. margin-bottom: 0.35rem;
  1038. }
  1039. }
  1040. .yuyue-img {
  1041. width: 2rem;
  1042. height: 2rem;
  1043. }
  1044. }
  1045. .table {
  1046. width: 100%;
  1047. box-sizing: border-box;
  1048. .single-specification {
  1049. width: 100%;
  1050. max-height: 100%;
  1051. padding-left: 0.1rem;
  1052. box-sizing: border-box;
  1053. .item {
  1054. width: 100%;
  1055. margin-bottom: 0.3rem;
  1056. display: flex;
  1057. align-items: center;
  1058. image {
  1059. width: 0.5rem;
  1060. }
  1061. .name {
  1062. display: flex;
  1063. align-items: center;
  1064. margin-right: 0.16rem;
  1065. width: 0.7rem;
  1066. text-align: right;
  1067. }
  1068. .message {
  1069. width: 74%;
  1070. text-overflow: ellipsis;
  1071. overflow: hidden;
  1072. white-space: nowrap;
  1073. }
  1074. }
  1075. }
  1076. .table-all {
  1077. width: 100%;
  1078. display: flex;
  1079. align-items: center;
  1080. justify-content: space-between;
  1081. padding: 0 0.38rem;
  1082. box-sizing: border-box;
  1083. .table-td {
  1084. font-size: 0.14rem;
  1085. text-align: left;
  1086. text-overflow: ellipsis;
  1087. overflow: hidden;
  1088. white-space: nowrap;
  1089. }
  1090. }
  1091. .table-th {
  1092. height: 0.46rem;
  1093. background: #f7f8fa;
  1094. }
  1095. .table-tb {
  1096. width: 100%;
  1097. // height: calc(100% - .3rem);
  1098. .table-tr {
  1099. height: 0.6rem;
  1100. border-bottom: 0.01rem solid #e6e6e6;
  1101. box-sizing: border-box;
  1102. .table-td {
  1103. image {
  1104. width: 0.5rem;
  1105. height: 0.5rem;
  1106. }
  1107. text-overflow: -o-ellipsis-lastline;
  1108. overflow: hidden;
  1109. text-overflow: ellipsis;
  1110. display: -webkit-box;
  1111. -webkit-line-clamp: 2;
  1112. line-clamp: 2;
  1113. -webkit-box-orient: vertical;
  1114. }
  1115. }
  1116. }
  1117. }
  1118. }
  1119. }
  1120. }
  1121. }
  1122. .no-center {
  1123. width: 100%;
  1124. height: 100%;
  1125. display: flex;
  1126. align-items: center;
  1127. justify-content: center;
  1128. font-size: 0.3rem;
  1129. color: #909399;
  1130. }
  1131. view {
  1132. color: #303133;
  1133. }
  1134. /deep/ .uni-scroll-view::-webkit-scrollbar {
  1135. width: 0.05rem;
  1136. height: 0.3rem;
  1137. }
  1138. /deep/ .uni-scroll-view::-webkit-scrollbar-thumb {
  1139. border-radius: 0.1rem;
  1140. box-shadow: inset 0 0 0.05rem rgba(0, 0, 0, 0.2);
  1141. background: rgba(193, 193, 193, 1);
  1142. }
  1143. .empty {
  1144. text-align: center;
  1145. padding-top: 1.2rem;
  1146. image {
  1147. width: 2rem;
  1148. }
  1149. .tips {
  1150. color: #999;
  1151. margin-top: 0.15rem;
  1152. }
  1153. }