index.wxss 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648
  1. @font-face {
  2. font-family: "ysbth";
  3. src: url(data:font/ttf;base64,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) format("truetype");
  4. }
  5. page {
  6. font-size: 16px;
  7. }
  8. ax-body {
  9. display: block;
  10. height: 100%;
  11. background: linear-gradient(
  12. 180deg,
  13. #c7fffd 0%,
  14. #97e8fa 10%,
  15. #f6f6f6 74%,
  16. #f6f6f6 100%
  17. );
  18. }
  19. ax-body .ax-body .__root {
  20. display: flex;
  21. flex-direction: column;
  22. padding-left: 0 !important;
  23. padding-right: 0 !important;
  24. position: relative;
  25. overflow: hidden !important;
  26. padding-bottom: var(--app-navigation-heiht) !important;
  27. }
  28. .main-scroll-wrap {
  29. flex: 1;
  30. position: relative;
  31. height: 1200rpx;
  32. }
  33. .root-scroll {
  34. position: absolute;
  35. top: 0;
  36. left: 0;
  37. right: 0;
  38. bottom: 0;
  39. }
  40. .concat-father {
  41. position: absolute;
  42. bottom: 170rpx;
  43. right: 16rpx;
  44. }
  45. .concat-icon {
  46. width: 120rpx;
  47. height: 120rpx;
  48. }
  49. .contet-root {
  50. height: 100%;
  51. }
  52. .base {
  53. padding-left: 10px;
  54. padding-right: 10px;
  55. }
  56. /* 导航栏 */
  57. app-navigation {
  58. display: block;
  59. position: fixed;
  60. left: 0;
  61. right: 0;
  62. bottom: 0;
  63. }
  64. /* 标题栏 */
  65. .titlebar {
  66. display: flex;
  67. align-items: center;
  68. padding-left: 3px;
  69. }
  70. .titlebar .page-title {
  71. width: 133px;
  72. height: 33px;
  73. }
  74. .titlebar .page-subtitle {
  75. font-size: 12px;
  76. }
  77. /* 定位城市 */
  78. .search-view {
  79. position: -webkit-sticky;
  80. position: sticky;
  81. top: 0;
  82. z-index: 90;
  83. }
  84. .arrears-tips {
  85. margin: auto;
  86. margin-top: 20rpx;
  87. display: flex;
  88. align-items: center;
  89. justify-content: space-between;
  90. transition: opacity 0.3s;
  91. opacity: 1;
  92. width: 702rpx;
  93. height: 72rpx;
  94. background: #fff6e8;
  95. border-radius: 16rpx;
  96. }
  97. .arrears-left {
  98. display: flex;
  99. align-items: center;
  100. gap: 20rpx;
  101. }
  102. .arrears-icon {
  103. width: 30rpx;
  104. height: 30rpx;
  105. margin-left: 20rpx;
  106. }
  107. .arrears-text {
  108. font-size: 24rpx;
  109. color: #fab04d;
  110. }
  111. .arrears-btn {
  112. width: 112rpx;
  113. height: 48rpx;
  114. background: #fab14f;
  115. border-radius: 24rpx;
  116. font-size: 24rpx;
  117. color: #ffffff;
  118. text-align: center;
  119. line-height: 48rpx;
  120. margin-right: 20rpx;
  121. }
  122. .locate-city {
  123. display: flex;
  124. align-items: center;
  125. margin-right: 6px;
  126. justify-content: ;
  127. }
  128. .locate-city ._icon {
  129. display: inline-block;
  130. width: 20px;
  131. height: 20px;
  132. margin-right: 5px;
  133. }
  134. .locate-city .__name {
  135. margin-bottom: 6rpx;
  136. }
  137. /* 搜索条 */
  138. .search-bar {
  139. flex: 1;
  140. display: flex;
  141. align-items: center;
  142. height: 30px;
  143. padding: 0 10px;
  144. border-radius: 8px;
  145. background: rgba(255, 255, 255, 0.6);
  146. }
  147. .search-bar input {
  148. flex: 1;
  149. display: block;
  150. font-size: 14px;
  151. background-color: transparent;
  152. }
  153. .search-bar ._icon-search {
  154. display: inline-block;
  155. width: 20px;
  156. height: 20px;
  157. margin-left: 10px;
  158. }
  159. .search-map-mode {
  160. display: flex;
  161. align-items: center;
  162. gap: 20rpx;
  163. width: 220rpx;
  164. height: 60rpx;
  165. background: rgba(255, 255, 255, 0.6);
  166. border-radius: 16rpx;
  167. justify-content: center;
  168. }
  169. .search-map-icon {
  170. width: 40rpx;
  171. height: 40rpx;
  172. }
  173. /* 快捷栏 */
  174. .shortcut-bar {
  175. display: flex;
  176. align-items: center;
  177. justify-content: space-between;
  178. gap: 20rpx;
  179. padding: 15px 0px;
  180. }
  181. .buy-charge-coupon {
  182. position: relative;
  183. width: 340rpx;
  184. height: 376rpx;
  185. background: #ffffff;
  186. box-shadow: inset 0rpx 20rpx 40rpx 2rpx rgba(100, 255, 218, 0.26);
  187. border-radius: 16rpx;
  188. text-align: center;
  189. }
  190. .coupon-tag {
  191. position: absolute;
  192. top: 0;
  193. right: 0;
  194. width: 116rpx;
  195. height: 52rpx;
  196. background: linear-gradient(134deg, #25eb64 0%, #0ad549 100%);
  197. box-shadow: inset 0rpx 20rpx 40rpx 2rpx rgba(100, 255, 218, 0.26);
  198. border-radius: 0rpx 16rpx 0rpx 16rpx;
  199. font-size: 28rpx;
  200. color: #ffffff;
  201. line-height: 52rpx;
  202. }
  203. .charge-title {
  204. margin-top: 62rpx;
  205. display: flex;
  206. align-items: center;
  207. gap: 20rpx;
  208. margin-left: 24rpx;
  209. }
  210. .title-coupon-text {
  211. font-family: Consolas, Menlo, "Courier New", monospace;
  212. font-weight: 800;
  213. font-size: 34rpx;
  214. /* font-style: italic; */
  215. }
  216. .title-right-text {
  217. width: 34rpx;
  218. height: 34rpx;
  219. background: #000;
  220. border-radius: 50%;
  221. text-align: center;
  222. line-height: 34rpx;
  223. }
  224. .ax-iconline {
  225. color: #fff;
  226. display: flex;
  227. align-items: center;
  228. justify-content: center;
  229. }
  230. .charge-text-dsc {
  231. margin-top: 20rpx;
  232. font-size: 28rpx;
  233. color: #aaaaaa;
  234. text-align: left;
  235. margin-left: 24rpx;
  236. }
  237. .charge-coupon-img {
  238. position: absolute;
  239. bottom: 0;
  240. left: 50%;
  241. -webkit-transform: translate(-50%, 0);
  242. transform: translate(-50%, 0);
  243. width: 170rpx;
  244. height: 214rpx;
  245. }
  246. .order-center {
  247. display: flex;
  248. align-items: center;
  249. width: 340rpx;
  250. height: 178rpx;
  251. background: #ffffff;
  252. box-shadow: inset 0rpx 20rpx 60rpx 2rpx rgba(100, 234, 255, 0.26);
  253. border-radius: 16rpx;
  254. }
  255. .order-center-number {
  256. margin-top: 20rpx;
  257. margin-left: 24rpx;
  258. font-size: 28rpx;
  259. color: #aaaaaa;
  260. }
  261. .order-center-icon {
  262. width: 100rpx;
  263. height: 100rpx;
  264. }
  265. .shortcut-bar ._item {
  266. display: flex;
  267. align-items: center;
  268. justify-content: center;
  269. flex-direction: column;
  270. }
  271. .shortcut-bar ._item ._icon {
  272. width: 40px;
  273. height: 40px;
  274. }
  275. .shortcut-bar ._item ._name {
  276. font-size: 12px;
  277. margin-top: 6px;
  278. }
  279. /* 版头广告 */
  280. .banner {
  281. width: 100%;
  282. height: calc((100vw - 20px) * (5 / 20));
  283. }
  284. .banner .swiper-item {
  285. display: flex;
  286. width: 100%;
  287. }
  288. .banner .swiper-item .swiper-item-image {
  289. display: block;
  290. width: 100%;
  291. border-radius: 5px;
  292. }
  293. /* 选项条 */
  294. .options-bar {
  295. display: flex;
  296. align-items: center;
  297. padding: 15px 0px;
  298. gap: 20rpx;
  299. }
  300. .options-tabs {
  301. width: 152rpx;
  302. height: 60rpx;
  303. background: #ffffff;
  304. border-radius: 16rpx;
  305. font-size: 28rpx;
  306. color: #2b303a;
  307. text-align: center;
  308. line-height: 60rpx;
  309. transition: all 0.3s ease-in-out;
  310. position: relative;
  311. overflow: hidden;
  312. }
  313. .options-tabs::before {
  314. content: "";
  315. position: absolute;
  316. top: 0;
  317. left: 0;
  318. right: 0;
  319. bottom: 0;
  320. background: linear-gradient(99deg, #8ff8fb 0%, #47aeff 100%);
  321. border-radius: 16rpx;
  322. opacity: 0;
  323. transition: opacity 0.3s ease-in-out;
  324. z-index: 1;
  325. }
  326. .options-tabs text {
  327. position: relative;
  328. z-index: 2;
  329. }
  330. .options-bar .options-tabs.active {
  331. width: 152rpx;
  332. height: 60rpx;
  333. background: #ffffff;
  334. /* 保持白色背景,用伪元素显示渐变 */
  335. border-radius: 16rpx;
  336. font-size: 28rpx;
  337. color: #2b303a;
  338. text-align: center;
  339. line-height: 60rpx;
  340. font-weight: bold;
  341. /* 过渡效果 */
  342. transition: all 0.3s ease-in-out;
  343. }
  344. .options-bar .options-tabs.active::before {
  345. opacity: 1;
  346. }
  347. /* 可选:添加点击反馈动画 */
  348. .options-tabs:active {
  349. -webkit-transform: scale(0.95);
  350. transform: scale(0.95);
  351. transition: -webkit-transform 0.1s ease;
  352. transition: transform 0.1s ease;
  353. transition: transform 0.1s ease, -webkit-transform 0.1s ease;
  354. }
  355. .options-bar .option-item::after {
  356. content: "";
  357. display: block;
  358. width: 30px;
  359. height: 6px;
  360. -webkit-transform: translateY(5px) scaleX(0);
  361. transform: translateY(5px) scaleX(0);
  362. border-radius: 10pc;
  363. background: linear-gradient(to right, #8ff8fb, #47aeff);
  364. transition: all 400ms ease;
  365. }
  366. .options-bar .option-item.active::after {
  367. -webkit-transform: translateY(5px) scaleX(1);
  368. transform: translateY(5px) scaleX(1);
  369. }
  370. .options-bar .separ {
  371. flex: 1;
  372. }
  373. .options-bar .separ::before {
  374. content: "";
  375. display: block;
  376. height: 13px;
  377. border-left: 1px solid #3eb6f8;
  378. }
  379. .options-bar .map-mode {
  380. color: #3eb6f8;
  381. }
  382. .options-bar .map-mode ._icon {
  383. width: 17px;
  384. height: 17px;
  385. margin-right: 5px;
  386. }
  387. /* 电站列表 */
  388. .list-scroll-wrap {
  389. height: var(--list-heiht);
  390. position: relative;
  391. }
  392. .list-scroll-wrap > .list-scroll {
  393. position: absolute;
  394. top: 0;
  395. left: 0;
  396. right: 0;
  397. bottom: 0;
  398. }
  399. .list {
  400. padding: 10px;
  401. }
  402. .list .item {
  403. display: block;
  404. border-radius: 8px;
  405. background-color: #fff;
  406. box-shadow: 0 1px 10px rgba(0, 39, 52, 0.1);
  407. overflow: hidden;
  408. }
  409. .list .item + .item {
  410. margin-top: 10px;
  411. }
  412. .list .item .contet {
  413. padding: 10px;
  414. background: #fff;
  415. /* url('@/static/img/charging_station_item_background.png') no-repeat center */
  416. }
  417. .list .item .name {
  418. display: flex;
  419. font-weight: bold;
  420. position: relative;
  421. }
  422. .list .item .name > .txt {
  423. flex: 1;
  424. line-height: 1.5em;
  425. }
  426. .list .item .name > .firm-price {
  427. position: absolute;
  428. right: -20rpx;
  429. top: -20rpx;
  430. width: 200rpx;
  431. height: 52rpx;
  432. background: linear-gradient(132deg, #ff6464 0%, #ff3a3a 100%);
  433. border-radius: 0rpx 16rpx 0rpx 40rpx;
  434. text-align: center;
  435. line-height: 52rpx;
  436. color: #fff;
  437. }
  438. .list .item .name > .icon {
  439. display: flex;
  440. align-items: center;
  441. justify-content: center;
  442. width: 20px;
  443. height: 20px;
  444. border-radius: 4px;
  445. background: linear-gradient(to bottom, #2a67f0, #769ffc);
  446. margin-right: 10px;
  447. }
  448. .list .item .name > .icon image {
  449. display: block;
  450. width: 10px;
  451. }
  452. .list .item .parkade {
  453. display: flex;
  454. font-size: 12px;
  455. color: #aaa;
  456. margin-top: 15px;
  457. }
  458. .list .item .parkade > .txt {
  459. flex: 1;
  460. line-height: 1.5em;
  461. }
  462. .list .item .parkade > .icon {
  463. display: inline-flex;
  464. align-items: center;
  465. justify-content: center;
  466. width: 20px;
  467. height: 20px;
  468. background-color: #5be7ff;
  469. margin-right: 10px;
  470. }
  471. .list .item .parkade > .icon image {
  472. display: block;
  473. width: 10px;
  474. }
  475. .list .item .info {
  476. margin-top: 24rpx;
  477. width: 654rpx;
  478. height: 84rpx;
  479. background: linear-gradient(
  480. 90deg,
  481. rgba(170, 255, 235, 0.3) 0%,
  482. rgba(175, 247, 252, 0.2) 44%,
  483. rgba(139, 232, 252, 0) 100%
  484. );
  485. border-radius: 16rpx 16rpx 16rpx 16rpx;
  486. padding-left: 20rpx;
  487. }
  488. .list .item .info .charge {
  489. display: inline-flex;
  490. align-items: center;
  491. justify-content: center;
  492. }
  493. .list .item .info .charge > .icon {
  494. display: inline-flex;
  495. align-items: center;
  496. justify-content: center;
  497. width: 20px;
  498. height: 20px;
  499. color: #fff;
  500. font-size: 13px;
  501. border-radius: 4px;
  502. background: linear-gradient(to bottom, #4fef86, #00aa3a);
  503. }
  504. .list .item .info .charge > .icon.blue {
  505. background: linear-gradient(to bottom, #8eb1ff, #3071ff);
  506. }
  507. .list .item .info .charge > .value {
  508. margin-left: 5px;
  509. }
  510. .list .item .info .charge > .max {
  511. color: #aaa;
  512. font-size: 12px;
  513. }
  514. .list .item .info .charge > .max::before {
  515. content: "/";
  516. }
  517. .list .item .info .charge + .charge {
  518. margin-left: 30px;
  519. }
  520. .list .item .info .distance {
  521. display: flex;
  522. align-items: center;
  523. height: 22px;
  524. border: 1px solid #3eb6f8;
  525. border-radius: 100pc;
  526. font-size: 12px;
  527. color: #3eb6f8;
  528. padding-right: 7px;
  529. overflow: hidden;
  530. }
  531. .list .item .info .distance > .icon {
  532. display: inline-flex;
  533. align-items: center;
  534. justify-content: center;
  535. width: 20px;
  536. height: 20px;
  537. background-color: #3eb6f8;
  538. margin-right: 5px;
  539. }
  540. .list .item .info .distance > .icon image {
  541. display: block;
  542. width: 10px;
  543. }
  544. .list .item .price {
  545. display: flex;
  546. align-items: center;
  547. justify-content: space-between;
  548. background-color: #fff;
  549. height: 45px;
  550. font-size: 14px;
  551. padding: 0 10px;
  552. box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
  553. }
  554. .list .item .price .value {
  555. font-size: 20px;
  556. font-weight: bold;
  557. }
  558. .list .item .price .unit {
  559. margin-left: 6rpx;
  560. font-weight: bold;
  561. font-size: 12px;
  562. margin-left: 6rpx;
  563. }
  564. .card-bottom-text {
  565. width: 212rpx;
  566. height: 52rpx;
  567. background: url(data:image/png;base64,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);
  568. background-size: cover;
  569. background-position: center;
  570. line-height: 52rpx;
  571. }
  572. .card-bottom-text-minitext {
  573. margin-left: 110rpx;
  574. font-weight: bold;
  575. font-size: 28rpx;
  576. color: #ff5d50;
  577. }
  578. .operation-price-btn {
  579. margin-left: 10rpx;
  580. width: 140rpx;
  581. height: 40rpx;
  582. background: #ff6457;
  583. border-radius: 22rpx 22rpx 22rpx 22rpx;
  584. font-style: italic;
  585. text-align: center;
  586. line-height: 40rpx;
  587. font-weight: 400;
  588. font-size: 22rpx;
  589. color: #ffffff;
  590. }
  591. .ordinary-price {
  592. margin-left: 12rpx;
  593. font-size: 24rpx;
  594. color: #aaaaaa;
  595. text-decoration: line-through;
  596. }
  597. .ad-popup {
  598. height: 1000rpx;
  599. }
  600. .ad-swiper {
  601. height: 100%;
  602. }
  603. .ad-swiper-item {
  604. height: 700rpx;
  605. }
  606. .close-get {
  607. margin-left: 550rpx;
  608. width: 50rpx;
  609. height: 50rpx;
  610. border-radius: 50%;
  611. border: 2rpx solid #133a4f;
  612. color: #fff;
  613. font-size: 28rpx;
  614. font-weight: bold;
  615. text-align: center;
  616. line-height: 50rpx;
  617. }
  618. .ad-image {
  619. margin-top: 10rpx;
  620. width: 600rpx;
  621. border-radius: 16rpx;
  622. }
  623. .discount {
  624. flex: 1;
  625. text-align: right;
  626. padding-right: 5px;
  627. }
  628. .discount view {
  629. display: inline-flex;
  630. align-items: center;
  631. height: 22px;
  632. border: 1px solid #ccc;
  633. border-radius: 5px;
  634. font-size: 12px;
  635. color: #F59C79;
  636. padding: 0 7px;
  637. overflow: hidden;
  638. }