index1.wxss 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443
  1. page {
  2. width: 100%;
  3. display: flex;
  4. flex-direction: column;
  5. align-items: center;
  6. padding-top: 88rpx;
  7. }
  8. #back {
  9. width: 100%;
  10. height: 10rpx;
  11. background: #f3f3f3;
  12. }
  13. .top {
  14. width: 100%;
  15. height: 100%;
  16. }
  17. van-dropdown-menu {
  18. height: 80rpx !important;
  19. position: fixed;
  20. top: 0rpx;
  21. left: 0rpx;
  22. width: 100%;
  23. background: white;
  24. z-index: 99;
  25. padding-top: 34rpx;
  26. }
  27. .van-dropdown-menu__item {
  28. flex: 0.25 !important;
  29. }
  30. van-sticky {
  31. position: fixed;
  32. top: 115rpx;
  33. z-index: 88;
  34. width: 100%;
  35. }
  36. van-tab .view {
  37. width: 100%;
  38. display: flex;
  39. flex-direction: column;
  40. align-items: center;
  41. justify-content: space-around;
  42. }
  43. van-tab .view .view1 {
  44. width: 690rpx;
  45. height: 220rpx;
  46. background-image: url('http://resource.weilaibike.com/bg1.png');
  47. background-size: 100% 100%;
  48. position: relative;
  49. display: flex;
  50. flex-direction: column;
  51. align-items: flex-end;
  52. justify-content: center;
  53. }
  54. van-tab .view .view1 .text {
  55. position: absolute;
  56. top: 10rpx;
  57. left: 34rpx;
  58. font-size: 24rpx;
  59. font-family: PingFang SC;
  60. color: rgba(255, 255, 255, 1);
  61. display: flex;
  62. flex-direction: column;
  63. align-items: center;
  64. }
  65. van-tab .view1 .view2 {
  66. width: 68%;
  67. display: flex;
  68. font-size: 26rpx;
  69. font-family: PingFang SC;
  70. color: rgba(255, 255, 255, 1);
  71. padding: 10rpx 0rpx;
  72. }
  73. van-tab .view1 .view2 view {
  74. display: flex;
  75. padding-left: 20rpx;
  76. }
  77. van-tab .car {
  78. width: 100%;
  79. display: flex;
  80. flex-direction: column;
  81. align-items: center;
  82. padding-top: 164px;
  83. }
  84. van-tab .car .top {
  85. display: flex;
  86. flex-direction: column;
  87. align-items: center;
  88. }
  89. .car .car_top {
  90. position: fixed;
  91. top: 200rpx;
  92. width: 100%;
  93. left: 0rpx;
  94. background: white;
  95. z-index: 89;
  96. border-top: 2rpx solid #e5e5e5;
  97. border-bottom: 2rpx solid #e5e5e5;
  98. }
  99. van-tab .car .top1 {
  100. display: flex;
  101. width: 100%;
  102. align-items: center;
  103. flex-wrap: wrap;
  104. }
  105. van-tab .car .top1 .view_a {
  106. display: flex;
  107. width: 25%;
  108. flex-direction: column;
  109. align-items: center;
  110. padding: 10rpx 0rpx;
  111. }
  112. van-tab .car .top1 .view_a text:nth-of-type(1) {
  113. font-size: 28rpx;
  114. font-family: PingFang SC;
  115. font-weight: 800;
  116. color: rgba(254, 87, 34, 1);
  117. padding-bottom: 20rpx;
  118. }
  119. van-tab .car .top1 .view_a text:nth-of-type(2) {
  120. font-size: 28rpx;
  121. font-family: PingFang SC;
  122. color: rgba(71, 71, 71, 1);
  123. }
  124. van-tab .car .list {
  125. width: 100%;
  126. display: flex;
  127. flex-direction: column;
  128. align-items: center;
  129. padding-bottom: 20rpx;
  130. }
  131. /* van-tab .car .list .active{
  132. box-shadow: 0px 0px 13rpx 0px rgba(0, 255, 0, 1) !important;
  133. border: 2rpx solid blue;
  134. } */
  135. van-tab .car .list .view_list {
  136. width: 690rpx;
  137. background: rgba(255, 255, 255, 1);
  138. box-shadow: 0px 0px 13rpx 0px rgba(216, 216, 216, 1);
  139. border-radius: 10rpx;
  140. display: flex;
  141. align-items: center;
  142. margin-top: 20rpx;
  143. justify-content: space-between;
  144. position: relative;
  145. }
  146. van-tab .car .list .view_list .left {
  147. width: 70%;
  148. display: flex;
  149. flex-direction: column;
  150. margin-left: 30rpx;
  151. height: 100%;
  152. justify-content: center;
  153. font-size: 26rpx;
  154. font-family: PingFang SC;
  155. color: rgba(40, 40, 40, 1);
  156. border-right: 2rpx solid #eee;
  157. }
  158. van-tab .car .list .view_list .left text {
  159. padding: 5rpx 0rpx;
  160. }
  161. van-tab .car .list .view_list .left view {
  162. display: flex;
  163. width: 100%;
  164. }
  165. van-tab .car .list .view_list .right {
  166. display: flex;
  167. width: 25%;
  168. align-items: center;
  169. justify-content: center;
  170. height: 80%;
  171. }
  172. van-tab .car .list .view_list .right .view2 {
  173. position: absolute;
  174. top: 0rpx;
  175. right: 0rpx;
  176. width: 129rpx;
  177. height: 42rpx;
  178. box-shadow: 0px 0px 0.06rem 0px #18d5b9;
  179. border-radius: 0px 2rpx 0px 20rpx;
  180. display: flex;
  181. align-items: center;
  182. justify-content: center;
  183. font-size: 22rpx;
  184. font-family: PingFang SC;
  185. color: rgba(255, 255, 255, 1);
  186. }
  187. van-tab .car .list .list_child {
  188. width: 690rpx;
  189. height: 226rpx;
  190. background: rgba(255, 255, 255, 1);
  191. box-shadow: 0px 0px 6rpx 0px rgba(216, 216, 216, 1);
  192. border-radius: 10rpx;
  193. display: flex;
  194. flex-direction: column;
  195. margin-top: 20rpx;
  196. padding-left: 20rpx;
  197. box-sizing: border-box;
  198. position: relative;
  199. }
  200. van-tab .car .list .list_child .view1 {
  201. display: flex;
  202. width: 80%;
  203. justify-content: space-between;
  204. padding: 4rpx 0rpx;
  205. font-size: 24rpx;
  206. font-family: PingFang SC;
  207. color: rgba(77, 77, 77, 1);
  208. }
  209. van-tab .car .list .list_child .view1 .status{
  210. padding: 0rpx 20rpx 5rpx 20rpx;
  211. color: white;
  212. font-size: 24rpx;
  213. border-radius: 18rpx;
  214. }
  215. van-tab .car .list .list_child .view1 .status1{
  216. background: #009900;
  217. }
  218. van-tab .car .list .list_child .view1 .status2{
  219. background: #FF1493;
  220. }
  221. van-tab .car .list .list_child .view1 .status3{
  222. background: #00BFFF;
  223. }
  224. van-tab .car .list .list_child .view1 .status4{
  225. background: #FFA500;
  226. }
  227. van-tab .car .list .list_child .view2 {
  228. display: flex;
  229. align-items: center;
  230. justify-content: center;
  231. width: 168rpx;
  232. height: 42rpx;
  233. background: linear-gradient(163deg, rgba(255, 139, 102, 1) 0%, rgba(254, 87, 34, 1) 100%);
  234. border-radius: 0px 2rpx 0px 20rpx;
  235. position: absolute;
  236. top: 0rpx;
  237. right: 0rpx;
  238. font-size: 22rpx;
  239. font-family: PingFang SC;
  240. color: rgba(255, 255, 255, 1);
  241. }
  242. van-tab .user {
  243. display: flex;
  244. flex-direction: column;
  245. align-items: center;
  246. width: 100%;
  247. padding-top: 128px;
  248. }
  249. .user .user_top {
  250. position: fixed;
  251. top: 200rpx;
  252. background: white;
  253. z-index: 89;
  254. width: 100%;
  255. left: 0rpx;
  256. }
  257. van-tab .user .top {
  258. display: flex;
  259. align-items: center;
  260. background: rgba(255, 255, 255, 1);
  261. border-top: 2rpx solid #e5e5e5;
  262. border-bottom: 2rpx solid #e5e5e5;
  263. justify-content: space-around;
  264. }
  265. van-tab .user .view_a {
  266. display: flex;
  267. width: 22%;
  268. flex-direction: column;
  269. align-items: center;
  270. padding: 15rpx 0rpx;
  271. }
  272. van-tab .user .view_a text:nth-of-type(1) {
  273. font-size: 26rpx;
  274. font-family: PingFang SC;
  275. font-weight: 800;
  276. color: rgba(254, 87, 34, 1);
  277. padding-bottom: 20rpx;
  278. }
  279. van-tab .user .view_a text:nth-of-type(2) {
  280. font-size: 28rpx;
  281. font-family: PingFang SC;
  282. color: rgba(71, 71, 71, 1);
  283. }
  284. van-tab .user .list {
  285. display: flex;
  286. flex-direction: column;
  287. align-items: center;
  288. width: 100%;
  289. padding-bottom: 20rpx;
  290. }
  291. van-tab .user .list .list_view {
  292. flex-direction: column;
  293. font-size: 26rpx;
  294. font-family: PingFang SC;
  295. color: rgba(77, 77, 77, 1);
  296. justify-content: space-around;
  297. height: 190rpx;
  298. position: relative;
  299. width: 690rpx;
  300. background: rgba(255, 255, 255, 1);
  301. box-shadow: 0px 0px 13rpx 0px rgba(216, 216, 216, 1);
  302. border-radius: 10rpx;
  303. display: flex;
  304. margin-top: 20rpx;
  305. padding-left: 20rpx;
  306. box-sizing: border-box;
  307. }
  308. van-tab .user .list .list_view .state {
  309. display: flex;
  310. align-items: center;
  311. justify-content: center;
  312. width: 158rpx;
  313. height: 42rpx;
  314. background: linear-gradient(163deg, rgba(255, 139, 102, 1) 0%, rgba(254, 87, 34, 1) 100%);
  315. border-radius: 0px 2rpx 0px 20rpx;
  316. position: absolute;
  317. top: 0rpx;
  318. right: 0rpx;
  319. font-size: 22rpx;
  320. font-family: PingFang SC;
  321. color: rgba(255, 255, 255, 1);
  322. }
  323. van-tab .user .list .list_view .userName{
  324. display:flex;
  325. }
  326. van-tab .user .list .list_view .name{
  327. display: inline-block;
  328. width:230rpx;
  329. overflow: hidden;
  330. text-overflow: ellipsis;
  331. white-space: nowrap;
  332. }
  333. van-tab .user .list .view_list {
  334. font-size: 26rpx;
  335. font-family: PingFang SC;
  336. color: rgba(77, 77, 77, 1);
  337. height: 190rpx;
  338. position: relative;
  339. width: 690rpx;
  340. background: rgba(255, 255, 255, 1);
  341. box-shadow: 0px 0px 13rpx 0px rgba(216, 216, 216, 1);
  342. border-radius: 10rpx;
  343. display: flex;
  344. margin-top: 20rpx;
  345. justify-content: space-between;
  346. }
  347. van-tab .user .list .view_list .left {
  348. width: 67%;
  349. font-size: 26rpx;
  350. font-family: PingFang SC;
  351. color: rgba(77, 77, 77, 1);
  352. height: 100%;
  353. display: flex;
  354. flex-direction: column;
  355. justify-content: space-around;
  356. padding-left: 20rpx;
  357. box-sizing: border-box;
  358. }
  359. van-tab .user .list .view_list .left view {
  360. width: 100%;
  361. display: flex;
  362. justify-content: space-between;
  363. }
  364. van-tab .user .list .view_list .left text {
  365. padding: 8rpx 0rpx;
  366. }
  367. van-tab .user .list .view_list .right {
  368. position: absolute;
  369. top: 0rpx;
  370. right: 0rpx;
  371. width: 129rpx;
  372. height: 42rpx;
  373. border-radius: 0px 2rpx 0px 20rpx;
  374. display: flex;
  375. align-items: center;
  376. justify-content: center;
  377. font-size: 22rpx;
  378. font-family: PingFang SC;
  379. color: rgba(255, 255, 255, 1);
  380. }
  381. .cut {
  382. position: fixed;
  383. left: 0rpx;
  384. top: 322rpx;
  385. z-index: 88;
  386. width: 100%;
  387. background: white;
  388. height: 100rpx;
  389. margin: 0 !important;
  390. display: flex;
  391. justify-content: center;
  392. align-items: center;
  393. }
  394. .cut text:last-child {
  395. border-top-right-radius: 10rpx !important;
  396. border-bottom-right-radius: 10rpx !important;
  397. }
  398. .cut text {
  399. padding: 10rpx 80rpx !important;
  400. }