index.wxss 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757
  1. page {
  2. background: #F5F5F5;
  3. }
  4. .privacy {
  5. position: fixed;
  6. top: 0;
  7. right: 0;
  8. bottom: 0;
  9. left: 0;
  10. background: rgba(0, 0, 0, .5);
  11. z-index: 9999999;
  12. display: flex;
  13. align-items: center;
  14. justify-content: center;
  15. }
  16. .contentview {
  17. width: 632rpx;
  18. padding: 48rpx;
  19. box-sizing: border-box;
  20. background: #fff;
  21. border-radius: 16rpx;
  22. }
  23. .contentview .title {
  24. text-align: center;
  25. color: #333;
  26. font-weight: bold;
  27. font-size: 32rpx;
  28. }
  29. .contentview .des {
  30. font-size: 26rpx;
  31. color: #666;
  32. margin-top: 40rpx;
  33. text-align: justify;
  34. line-height: 1.6;
  35. }
  36. .contentview .des .link {
  37. color: #07c160;
  38. text-decoration: underline;
  39. }
  40. button::after {
  41. border: none;
  42. }
  43. .btns {
  44. margin-top: 48rpx;
  45. display: flex;
  46. }
  47. .btns .item {
  48. justify-content: space-between;
  49. width: 244rpx;
  50. height: 80rpx;
  51. display: flex;
  52. align-items: center;
  53. justify-content: center;
  54. border-radius: 16rpx;
  55. box-sizing: border-box;
  56. border: none;
  57. }
  58. .btns .reject {
  59. background: #f4f4f5;
  60. color: #909399;
  61. }
  62. .btns .agree {
  63. background: #07c160;
  64. color: #fff;
  65. }
  66. .content {
  67. margin-top: 100rpx;
  68. }
  69. .slot-wrap {
  70. display: flex;
  71. justify-content: center;
  72. align-items: center;
  73. /* 如果您想让slot内容占满整个导航栏的宽度 */
  74. /* flex: 1; */
  75. /* 如果您想让slot内容与导航栏左右有空隙 */
  76. /* padding: 0 30rpx; */
  77. }
  78. .u-title {
  79. color: #000000 !important;
  80. font-size: 31rpx !important;
  81. font-weight: bold !important;
  82. }
  83. .solt {
  84. position: relative;
  85. }
  86. .slot_left {
  87. width: 60rpx;
  88. height: 60rpx;
  89. position: absolute;
  90. top: 15rpx;
  91. left: 20rpx;
  92. }
  93. .slot_left image {
  94. width: 60rpx;
  95. height: 60rpx;
  96. }
  97. .slot_content {
  98. width: 35rpx;
  99. height: 35rpx;
  100. position: absolute;
  101. top: 26rpx;
  102. left: 280rpx;
  103. }
  104. .slot_content image {
  105. width: 35rpx;
  106. height: 35rpx;
  107. }
  108. /* tabs */
  109. .u-tab-item {
  110. color: #333333 !important;
  111. /* font-size: 26rpx !important; */
  112. letter-spacing: 2rpx;
  113. }
  114. .u-tab-bar {
  115. width: 65rpx !important;
  116. height: 8rpx !important;
  117. background-color: #FF7F00 !important;
  118. border-radius: 0rpx !important;
  119. position: absolute !important;
  120. bottom: 0rpx !important;
  121. left: -14rpx !important;
  122. }
  123. .tabs_box {
  124. display: none;
  125. padding-bottom: 120rpx;
  126. }
  127. .dis {
  128. display: block;
  129. width: 100%;
  130. margin-bottom: 190rpx;
  131. }
  132. .list_box1 {
  133. width: 90%;
  134. margin: 0 auto;
  135. height: auto;
  136. background: #FFFFFF;
  137. border-radius: 23rpx;
  138. box-shadow: 0rpx 5rpx 5rpx 0rpx rgba(198, 186, 181, 0.20);
  139. margin-top: 20rpx;
  140. padding-bottom: 20rpx;
  141. }
  142. .list_box {
  143. width: 90%;
  144. margin: 0 auto;
  145. height: auto;
  146. background: #FFFFFF;
  147. border-radius: 23rpx;
  148. box-shadow: 0rpx 5rpx 5rpx 0rpx rgba(198, 186, 181, 0.20);
  149. margin-top: 20rpx;
  150. padding-bottom: 20rpx;
  151. }
  152. .list_box2{
  153. width: 90%;
  154. margin: 0 auto;
  155. height: auto;
  156. background: #FFFFFF;
  157. border-radius: 23rpx;
  158. box-shadow: 0rpx 5rpx 5rpx 0rpx rgba(198, 186, 181, 0.20);
  159. margin-top: 20rpx;
  160. }
  161. .part1 {
  162. width: 90%;
  163. margin: 0 auto;
  164. justify-content: left;
  165. align-items: center;
  166. display: flex;
  167. height: 100rpx;
  168. position: relative;
  169. }
  170. .box_one {
  171. background: #c4e2ff;
  172. color: #359CFF;
  173. /* width: 60px;
  174. height: 45rpx; */
  175. padding: 0px 10px;
  176. font-size: 26rpx;
  177. text-align: center;
  178. line-height: 45rpx;
  179. border-radius: 5rpx;
  180. }
  181. .box_four {
  182. color: #666666;
  183. border: 1rpx solid #666666;
  184. font-size: 22rpx;
  185. width: 95px;
  186. height: 40rpx;
  187. text-align: center;
  188. line-height: 40rpx;
  189. border-radius: 5rpx;
  190. margin-left: 20rpx;
  191. }
  192. .box_two {
  193. color: #666666;
  194. border: 1rpx solid #666666;
  195. font-size: 22rpx;
  196. /* width: 60px; */
  197. height: 40rpx;
  198. text-align: center;
  199. line-height: 40rpx;
  200. border-radius: 5rpx;
  201. margin-left: 20rpx;
  202. padding: 0 10rpx
  203. }
  204. .box_two1 {
  205. width: auto;
  206. padding: 0 10rpx;
  207. }
  208. .box_three {
  209. color: #666666;
  210. border: 1rpx solid #666666;
  211. font-size: 22rpx;
  212. width: 75px;
  213. height: 40rpx;
  214. text-align: center;
  215. line-height: 40rpx;
  216. border-radius: 5rpx;
  217. margin-left: 20rpx;
  218. }
  219. .part2 {
  220. width: 90%;
  221. margin: 0 auto;
  222. }
  223. /* 下线 */
  224. .address_name {
  225. font-size: 28rpx;
  226. font-weight: bold;
  227. letter-spacing: 2rpx;
  228. /* line-height: 60rpx; */
  229. display: -webkit-box;
  230. -webkit-box-orient: vertical;
  231. -webkit-line-clamp: 1;
  232. overflow: hidden;
  233. }
  234. .name {
  235. color: #999999;
  236. font-size: 21rpx;
  237. }
  238. .name text {
  239. /* margin-left: 10rpx; */
  240. }
  241. /* 上线 */
  242. .box_add {
  243. display: flex;
  244. }
  245. .distance {
  246. flex: 1;
  247. /* text-align: center; */
  248. font-size: 28rpx;
  249. display: flex;
  250. justify-content: left;
  251. align-items: center;
  252. }
  253. .a {
  254. font-size: 16rpx;
  255. }
  256. .add_name {
  257. /* display: flex; */
  258. flex: 4;
  259. }
  260. .sh_name {
  261. font-size: 28rpx;
  262. font-weight: bold;
  263. letter-spacing: 2rpx;
  264. }
  265. .sh_name1 {
  266. font-size: 28rpx;
  267. font-weight: bold;
  268. letter-spacing: 2rpx;
  269. color: #999999;
  270. }
  271. .xs_add {
  272. color: #999999;
  273. font-size: 21rpx;
  274. margin-top: 10rpx;
  275. }
  276. .jiantou {
  277. margin-left: 43rpx;
  278. display: flex;
  279. /* justify-content: space-between; */
  280. align-items: center;
  281. height: 40px;
  282. line-height: 40px;
  283. }
  284. .jiantou image {
  285. width: 20rpx;
  286. height: 40rpx;
  287. }
  288. .jiantou>view {
  289. margin-left: 10rpx;
  290. }
  291. .part3 {
  292. width: 90%;
  293. margin: 0 auto;
  294. display: flex;
  295. }
  296. .three_left {
  297. flex: 1;
  298. height: 100rpx;
  299. display: flex;
  300. justify-content: left;
  301. align-items: center;
  302. }
  303. .three_left image {
  304. width: 20px;
  305. height: 20px;
  306. }
  307. .three_left text {
  308. color: #FF7F00;
  309. font-size: 25rpx;
  310. margin-left: 10rpx;
  311. }
  312. .three_right {
  313. /* flex: 1; */
  314. height: 100rpx;
  315. display: flex;
  316. justify-content: flex-end;
  317. align-items: center;
  318. color: #FF7F00;
  319. font-size: 32rpx;
  320. font-weight: bold;
  321. }
  322. .part4 {
  323. width: 90%;
  324. margin: 0 auto;
  325. }
  326. .box_btn {
  327. width: 100%;
  328. background: #CCCCCC;
  329. height: 70rpx;
  330. color: white;
  331. text-align: center;
  332. line-height: 70rpx;
  333. font-size: 26rpx;
  334. letter-spacing: 2rpx;
  335. border-radius: 8rpx;
  336. }
  337. .box_btn1 {
  338. width: 100%;
  339. background: #FF7F00;
  340. height: 80rpx;
  341. color: white;
  342. text-align: center;
  343. line-height: 80rpx;
  344. font-size: 31rpx;
  345. letter-spacing: 2rpx;
  346. border-radius: 8rpx;
  347. }
  348. .box_btn5{
  349. width: 16%;
  350. margin-left: 40rpx;
  351. background: #FF7F00;
  352. height: 60rpx;
  353. color: white;
  354. text-align: center;
  355. line-height: 60rpx;
  356. font-size: 31rpx;
  357. letter-spacing: 2rpx;
  358. border-radius: 8rpx;
  359. }
  360. .part_six {
  361. width: 90%;
  362. margin: 0 auto;
  363. display: flex;
  364. }
  365. .phone {
  366. flex: 1;
  367. }
  368. .phone image {
  369. width: 29rpx;
  370. height: 33rpx;
  371. margin-left: 30rpx;
  372. }
  373. .conmm {
  374. font-size: 19rpx;
  375. text-align: center;
  376. letter-spacing: 5rpx;
  377. }
  378. .box_btn2 {
  379. flex: 5;
  380. width: 100%;
  381. background: #FF7F00;
  382. height: 70rpx;
  383. color: white;
  384. text-align: center;
  385. line-height: 70rpx;
  386. font-size: 26rpx;
  387. letter-spacing: 2rpx;
  388. border-radius: 6rpx;
  389. }
  390. /* tabbar */
  391. .tabbar {
  392. position: fixed;
  393. bottom: 0rpx;
  394. left: 0rpx;
  395. right: 0rpx;
  396. width: 100%;
  397. height: 100rpx;
  398. background: #ffffff;
  399. display: flex;
  400. }
  401. .tabbar_type {
  402. flex: 1;
  403. text-align: center;
  404. font-size: 22rpx;
  405. margin-top: 10rpx;
  406. }
  407. .type_image {
  408. width: 100%;
  409. display: flex;
  410. justify-content: center;
  411. align-items: center;
  412. }
  413. .type_image image {
  414. width: 47rpx;
  415. height: 47rpx;
  416. }
  417. .tabbar_btn {
  418. flex: 4;
  419. display: flex;
  420. justify-content: center;
  421. align-items: center;
  422. }
  423. .btn {
  424. width: 90%;
  425. height: 80rpx;
  426. background: #FF7F00;
  427. color: white;
  428. text-align: center;
  429. line-height: 80rpx;
  430. font-size: 26rpx;
  431. letter-spacing: 2rpx;
  432. border-radius: 8rpx;
  433. }
  434. .btn3 {
  435. width: 90%;
  436. height: 80rpx;
  437. background: #CCCCCC;
  438. color: white;
  439. text-align: center;
  440. line-height: 80rpx;
  441. font-size: 26rpx;
  442. letter-spacing: 2rpx;
  443. border-radius: 8rpx;
  444. }
  445. /* 接单设置弹框 */
  446. .u-drawer-bottom {
  447. background-color: #F5F5F5 !important;
  448. }
  449. .popup_box {
  450. width: 90%;
  451. margin: 0 auto;
  452. margin-top: 35rpx;
  453. }
  454. .title {
  455. font-size: 29rpx;
  456. font-weight: bold;
  457. letter-spacing: 2rpx;
  458. }
  459. .part_one {
  460. width: 100%;
  461. background: #ffffff;
  462. margin-top: 18rpx;
  463. border-radius: 20rpx;
  464. display: flex;
  465. height: 120rpx;
  466. }
  467. .left {
  468. flex: 3;
  469. line-height: 40rpx;
  470. margin-left: 20rpx;
  471. margin-top: 20rpx;
  472. }
  473. .gotype {
  474. font-size: 26rpx;
  475. font-weight: bold;
  476. letter-spacing: 2rpx;
  477. }
  478. .tit {
  479. color: #999999;
  480. font-size: 22rpx;
  481. letter-spacing: 2rpx;
  482. }
  483. .right {
  484. flex: 1;
  485. display: flex;
  486. justify-content: flex-end;
  487. align-items: center;
  488. margin-right: 30rpx;
  489. }
  490. .part_two {
  491. width: 100%;
  492. margin: 0 auto;
  493. background: #ffffff;
  494. border-radius: 20rpx;
  495. margin-top: 20rpx;
  496. height: 130rpx;
  497. display: flex;
  498. }
  499. .two_left {
  500. flex: 1;
  501. display: flex;
  502. justify-content: left;
  503. align-items: center;
  504. margin-left: 30rpx;
  505. font-size: 29rpx;
  506. font-weight: bold;
  507. letter-spacing: 2rpx;
  508. }
  509. .two_right {
  510. flex: 1;
  511. display: flex;
  512. justify-content: flex-end;
  513. align-items: center;
  514. margin-right: 30rpx;
  515. color: #999999;
  516. font-size: 25rpx;
  517. letter-spacing: 2rpx;
  518. }
  519. .slot-content {
  520. padding: 30rpx;
  521. }
  522. /* */
  523. .tabs_box {
  524. display: none;
  525. }
  526. .dis {
  527. display: block;
  528. width: 100%;
  529. }
  530. .u-tab-item {
  531. /* font-size: 26upx !important; */
  532. /* color: #666666 !important; */
  533. }
  534. .success_box {
  535. width: 100%;
  536. }
  537. .order_box {
  538. width: 90%;
  539. margin: 0 auto;
  540. /* height: 420rpx; */
  541. background: #FFFFFF;
  542. margin-top: 20rpx;
  543. border-radius: 16px;
  544. }
  545. .order_success {
  546. width: 90%;
  547. margin: 0 auto;
  548. display: flex;
  549. height: 80rpx;
  550. }
  551. .order_name {
  552. flex: 1;
  553. display: flex;
  554. justify-content: left;
  555. align-items: center;
  556. font-weight: bold;
  557. font-size: 29rpx;
  558. letter-spacing: 1rpx;
  559. }
  560. .order_data {
  561. flex: 1;
  562. color: #999999;
  563. display: flex;
  564. justify-content: flex-end;
  565. align-items: center;
  566. font-size: 26rpx;
  567. }
  568. .city_type {
  569. width: 90%;
  570. margin: 0 auto;
  571. height: 60rpx;
  572. line-height: 60rpx;
  573. display: flex;
  574. justify-content: left;
  575. align-items: center;
  576. }
  577. .type_name {
  578. font-size: 27rpx;
  579. }
  580. .city_text {
  581. width: 70rpx;
  582. line-height: 36rpx;
  583. color: #49A5FF;
  584. background: #c4e2ff;
  585. text-align: center;
  586. font-size: 19rpx;
  587. margin-left: 20rpx;
  588. }
  589. .city_address {
  590. width: 92%;
  591. margin: 0 auto;
  592. margin-top: -10rpx;
  593. }
  594. /* 发货地址 */
  595. .fh_box {
  596. display: flex;
  597. /* height: 80upx; */
  598. margin-top: 20rpx;
  599. }
  600. .fh_image {
  601. flex: 1;
  602. display: flex;
  603. /* justify-content: left;
  604. align-items: center; */
  605. }
  606. .box {
  607. flex: 9;
  608. }
  609. .fh_name {
  610. font-size: 26rpx;
  611. font-weight: 600;
  612. letter-spacing: 2rpx;
  613. }
  614. .fh_type {
  615. color: #999999;
  616. font-size: 22rpx;
  617. }
  618. .fh_type text {
  619. margin-left: 20rpx;
  620. }
  621. /* 送货地址 */
  622. .sh_box {
  623. display: flex;
  624. margin-bottom: 14rpx;
  625. margin-top: 14rpx;
  626. }
  627. .sh_image {
  628. flex: 1;
  629. display: flex;
  630. /* justify-content: left;
  631. align-items: center; */
  632. }
  633. .sh_name {
  634. font-size: 28rpx;
  635. font-weight: 600;
  636. letter-spacing: 2rpx;
  637. }
  638. .sh_type {
  639. color: #999999;
  640. font-size: 22rpx;
  641. }
  642. .sh_type text {
  643. margin-left: 20rpx;
  644. }
  645. .fh_image image {
  646. width: 40rpx;
  647. height: 40rpx;
  648. }
  649. .sh_image image {
  650. width: 40rpx;
  651. height: 40rpx;
  652. }
  653. .order_btn {
  654. display: flex;
  655. justify-content: flex-end;
  656. align-items: center;
  657. height: 100rpx;
  658. line-height: 100rpx;
  659. /* margin-top: 8upx; */
  660. }
  661. .btn1 {
  662. width: 170rpx;
  663. font-size: 28rpx;
  664. line-height: 60rpx;
  665. text-align: center;
  666. border: 1rpx solid #9C9C9C;
  667. border-radius: 20rpx;
  668. color: #9C9C9C;
  669. margin-right: 30rpx;
  670. }
  671. .btn2 {
  672. width: 170rpx;
  673. line-height: 60rpx;
  674. color: white;
  675. background: #FF6A04;
  676. font-size: 28rpx;
  677. text-align: center;
  678. margin-right: 30rpx;
  679. border-radius: 20rpx;
  680. }
  681. /* 收货码弹框 */
  682. .receipt_code {
  683. width: 90%;
  684. margin: 0 auto;
  685. }
  686. .code_title {
  687. width: 100%;
  688. line-height: 100rpx;
  689. font-size: 31rpx;
  690. font-weight: bold;
  691. text-align: center;
  692. letter-spacing: 2rpx;
  693. margin-top: 21rpx;
  694. margin-bottom: 25rpx;
  695. }
  696. .u-input--border {
  697. border: 1px solid #F2F2F2 !important;
  698. background: #F2F2F2 !important;
  699. color: #999999 !important;
  700. font-weight: 500 !important;
  701. letter-spacing: 2rpx !important;
  702. }
  703. .u-input__input {
  704. font-size: 30rpx;
  705. font-weight: bold;
  706. flex: 1;
  707. color: #999999 !important;
  708. min-height: 85rpx !important;
  709. margin-top: 7rpx;
  710. }
  711. .sure {
  712. width: 100%;
  713. height: 80rpx;
  714. background: #FF7F00;
  715. color: white;
  716. border-radius: 46rpx;
  717. text-align: center;
  718. line-height: 80rpx;
  719. margin-top: 30rpx;
  720. letter-spacing: 2rpx;
  721. }
  722. /* 确认送达拍照框 */
  723. .phone_title{
  724. margin-top: 10px;
  725. width: 100%;
  726. height: 40px;
  727. /* background-color: #FF7F00; */
  728. text-align: center;
  729. line-height: 40px;
  730. /* color:#FFFFFF; */
  731. }
  732. .phone_title2{
  733. margin-top: 10px;
  734. text-align: center;
  735. color:#9d9d9d;
  736. }
  737. .code_title2 {
  738. width: 100%;
  739. line-height: 50rpx;
  740. text-align: center;
  741. letter-spacing: 2rpx;
  742. margin-top: 21rpx;
  743. margin-bottom: 25rpx;
  744. }