rewards_page.dart 36 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922
  1. import 'package:cpt_rewards/modules/rewards_address/rewards_address_page.dart';
  2. import 'package:cpt_rewards/modules/rewards_code/rewards_code_page.dart';
  3. import 'package:cpt_rewards/modules/rewards_history/rewards_history_page.dart';
  4. import 'package:cpt_rewards/modules/rewards_home/rewards_home_page.dart';
  5. import 'package:cpt_rewards/modules/rewards_list/rewards_list_page.dart';
  6. import 'package:cpt_rewards/modules/rewards_my/rewards_my_page.dart';
  7. import 'package:cs_resources/generated/assets.dart';
  8. import 'package:flutter/material.dart';
  9. import 'package:auto_route/auto_route.dart';
  10. import 'package:hooks_riverpod/hooks_riverpod.dart';
  11. import 'package:plugin_platform/engine/image/image_nine_grid.dart';
  12. import 'package:router/ext/auto_router_extensions.dart';
  13. import 'package:shared/utils/color_utils.dart';
  14. import 'package:widgets/ext/ex_widget.dart';
  15. import 'package:widgets/my_load_image.dart';
  16. import '../../../router/page/rewards_page_router.dart';
  17. import './rewards_vm.dart';
  18. @RoutePage()
  19. class RewardsPage extends HookConsumerWidget {
  20. const RewardsPage({Key? key}) : super(key: key);
  21. //启动当前页面
  22. static void startInstance({BuildContext? context}) {
  23. if (context != null) {
  24. context.router.push(const RewardsPageRoute());
  25. } else {
  26. appRouter.push(const RewardsPageRoute());
  27. }
  28. }
  29. Widget _buildTop(BuildContext context, WidgetRef ref, _vm) {
  30. // List itemsList = _vm.state.list.toList();
  31. return Container(
  32. decoration: BoxDecoration(
  33. border: Border(
  34. bottom: BorderSide(
  35. color: ColorUtils.string2Color('#4161D0'), // 设置bottom边框的颜色
  36. width: 45.0, // 设置bottom边框的宽度
  37. )),
  38. borderRadius: const BorderRadius.only(
  39. topLeft: Radius.circular(0.0),
  40. topRight: Radius.circular(0.0),
  41. bottomLeft: Radius.circular(30.0),
  42. bottomRight: Radius.circular(30.0),
  43. ), // 圆角
  44. ),
  45. child: Column(
  46. crossAxisAlignment: CrossAxisAlignment.start,
  47. children: [
  48. const MyAssetImage(
  49. Assets.rewardsRewardsBack,
  50. width: 44,
  51. height: 44,
  52. ).onTap(() {
  53. // backCallback
  54. Navigator.pop(context);
  55. }),
  56. // const Text(
  57. // '1526 Available Points',
  58. // style: TextStyle(
  59. // fontSize: 18.0,
  60. // color: Colors.white,
  61. // fontWeight: FontWeight.w500), // 设置字体大小
  62. // ).paddingOnly(left: 10, top: 20, bottom: 18),
  63. Row(
  64. crossAxisAlignment: CrossAxisAlignment.center,
  65. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  66. children: [
  67. const Text(
  68. 'Available Points',
  69. style: TextStyle(
  70. fontSize: 17.0,
  71. color: Colors.white,
  72. fontWeight: FontWeight.w500), // 设置字体大小
  73. ),
  74. Container(
  75. decoration: BoxDecoration(
  76. border: Border.all(color: Colors.white, width: 1), // 边框
  77. borderRadius: BorderRadius.circular(8), // 圆角
  78. ),
  79. child: Row(
  80. children: [
  81. const MyAssetImage(
  82. Assets.rewardsRewardsIconJb,
  83. width: 23,
  84. height: 23,
  85. ).marginOnly(right: 5),
  86. const Text(
  87. '1022',
  88. style: TextStyle(
  89. fontSize: 15.0,
  90. color: Colors.white,
  91. fontWeight: FontWeight.w400), // 设置字体大小
  92. ),
  93. ],
  94. ).paddingOnly(left: 10, top: 7, bottom: 7, right: 10),
  95. ),
  96. ],
  97. ).paddingOnly(left: 10, top: 20, bottom: 18),
  98. ],
  99. )
  100. .paddingOnly(top: 15, left: 5, right: 15, bottom: 0)
  101. .border(bottom: 0, color: ColorUtils.string2Color('#4161D0'))
  102. .backgroundColor(ColorUtils.string2Color('#4161D0')));
  103. }
  104. Widget _buildSearch(BuildContext context, WidgetRef ref, _vm) {
  105. // List itemsList = _vm.state.list.toList();
  106. return Container(
  107. width: MediaQuery.of(context).size.width - 30,
  108. decoration: BoxDecoration(
  109. color: Colors.white,
  110. borderRadius: BorderRadius.circular(10),
  111. boxShadow: const [
  112. BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  113. ],
  114. ),
  115. child: Column(
  116. crossAxisAlignment: CrossAxisAlignment.start,
  117. mainAxisAlignment: MainAxisAlignment.center,
  118. children: [
  119. Text(
  120. 'Continuous Login 8 Day',
  121. style: TextStyle(
  122. fontSize: 15.0,
  123. color: ColorUtils.string2Color('#000000'),
  124. fontWeight: FontWeight.w500), // 设置字体大小
  125. ),
  126. Flex(
  127. direction: Axis.horizontal,
  128. children: [
  129. Expanded(
  130. flex: 1,
  131. child: Container(
  132. decoration: BoxDecoration(
  133. color: ColorUtils.string2Color('#F2F3F6'),
  134. borderRadius: BorderRadius.circular(10),
  135. border: Border.all(
  136. color: ColorUtils.string2Color('#4161D0'), width: 1),
  137. ),
  138. height: 78,
  139. child: Column(
  140. crossAxisAlignment: CrossAxisAlignment.center,
  141. mainAxisAlignment: MainAxisAlignment.center,
  142. children: [
  143. Text(
  144. '11/01',
  145. style: TextStyle(
  146. fontSize: 13.0,
  147. color: ColorUtils.string2Color('#4161D0'),
  148. fontWeight: FontWeight.w400), // 设置字体大小
  149. ),
  150. const MyAssetImage(
  151. Assets.rewardsRewardsIconJb,
  152. width: 23,
  153. height: 23,
  154. ),
  155. Text(
  156. '+2',
  157. style: TextStyle(
  158. fontSize: 15.0,
  159. color: ColorUtils.string2Color('#4161D0'),
  160. fontWeight: FontWeight.w500), // 设置字体大小
  161. ),
  162. ],
  163. ),
  164. ),
  165. ),
  166. const SizedBox(width: 15.0),
  167. Expanded(
  168. flex: 1,
  169. child: Container(
  170. decoration: BoxDecoration(
  171. color: ColorUtils.string2Color('#4161D0'),
  172. borderRadius: BorderRadius.circular(10),
  173. border: Border.all(
  174. color: ColorUtils.string2Color('#4161D0'), width: 1),
  175. ),
  176. height: 78,
  177. child: Column(
  178. crossAxisAlignment: CrossAxisAlignment.center,
  179. mainAxisAlignment: MainAxisAlignment.center,
  180. children: [
  181. Text(
  182. 'Today',
  183. style: TextStyle(
  184. fontSize: 13.0,
  185. color: ColorUtils.string2Color('#ffffff'),
  186. fontWeight: FontWeight.w400), // 设置字体大小
  187. ),
  188. const MyAssetImage(
  189. Assets.rewardsRewardsIconJb,
  190. width: 23,
  191. height: 23,
  192. ),
  193. Text(
  194. '+2',
  195. style: TextStyle(
  196. fontSize: 15.0,
  197. color: ColorUtils.string2Color('#ffffff'),
  198. fontWeight: FontWeight.w500), // 设置字体大小
  199. ),
  200. ],
  201. ),
  202. ),
  203. ),
  204. const SizedBox(width: 15.0),
  205. Expanded(
  206. flex: 1,
  207. child: Container(
  208. decoration: BoxDecoration(
  209. color: ColorUtils.string2Color('#F2F3F6'),
  210. borderRadius: BorderRadius.circular(10),
  211. border: Border.all(
  212. color: ColorUtils.string2Color('#F2F3F6'), width: 1),
  213. ),
  214. height: 78,
  215. child: Column(
  216. crossAxisAlignment: CrossAxisAlignment.center,
  217. mainAxisAlignment: MainAxisAlignment.center,
  218. children: [
  219. Text(
  220. 'Today',
  221. style: TextStyle(
  222. fontSize: 13.0,
  223. color: ColorUtils.string2Color('#000000'),
  224. fontWeight: FontWeight.w400), // 设置字体大小
  225. ),
  226. const MyAssetImage(
  227. Assets.rewardsRewardsIconJb,
  228. width: 23,
  229. height: 23,
  230. ),
  231. Text(
  232. '+2',
  233. style: TextStyle(
  234. fontSize: 15.0,
  235. color: ColorUtils.string2Color('#000000'),
  236. fontWeight: FontWeight.w500), // 设置字体大小
  237. ),
  238. ],
  239. ),
  240. ),
  241. ),
  242. const SizedBox(width: 15.0),
  243. Expanded(
  244. flex: 1,
  245. child: Container(
  246. decoration: BoxDecoration(
  247. color: ColorUtils.string2Color('#F2F3F6'),
  248. borderRadius: BorderRadius.circular(10),
  249. border: Border.all(
  250. color: ColorUtils.string2Color('#F2F3F6'), width: 1),
  251. ),
  252. height: 78,
  253. child: Column(
  254. crossAxisAlignment: CrossAxisAlignment.center,
  255. mainAxisAlignment: MainAxisAlignment.center,
  256. children: [
  257. Text(
  258. 'Today',
  259. style: TextStyle(
  260. fontSize: 13.0,
  261. color: ColorUtils.string2Color('#000000'),
  262. fontWeight: FontWeight.w400), // 设置字体大小
  263. ),
  264. const MyAssetImage(
  265. Assets.rewardsRewardsIconJb,
  266. width: 23,
  267. height: 23,
  268. ),
  269. Text(
  270. '+2',
  271. style: TextStyle(
  272. fontSize: 15.0,
  273. color: ColorUtils.string2Color('#000000'),
  274. fontWeight: FontWeight.w500), // 设置字体大小
  275. ),
  276. ],
  277. ),
  278. ),
  279. ),
  280. ],
  281. ).marginOnly(top: 13, bottom: 13),
  282. Flex(
  283. direction: Axis.horizontal,
  284. children: [
  285. Expanded(
  286. flex: 1,
  287. child: Container(
  288. decoration: BoxDecoration(
  289. color: ColorUtils.string2Color('#F2F3F6'),
  290. borderRadius: BorderRadius.circular(10),
  291. border: Border.all(
  292. color: ColorUtils.string2Color('#F2F3F6'), width: 1),
  293. ),
  294. height: 78,
  295. child: Column(
  296. crossAxisAlignment: CrossAxisAlignment.center,
  297. mainAxisAlignment: MainAxisAlignment.center,
  298. children: [
  299. Text(
  300. 'Today',
  301. style: TextStyle(
  302. fontSize: 13.0,
  303. color: ColorUtils.string2Color('#000000'),
  304. fontWeight: FontWeight.w400), // 设置字体大小
  305. ),
  306. const MyAssetImage(
  307. Assets.rewardsRewardsIconJb,
  308. width: 23,
  309. height: 23,
  310. ),
  311. Text(
  312. '+2',
  313. style: TextStyle(
  314. fontSize: 15.0,
  315. color: ColorUtils.string2Color('#000000'),
  316. fontWeight: FontWeight.w500), // 设置字体大小
  317. ),
  318. ],
  319. ),
  320. ),
  321. ),
  322. const SizedBox(width: 15.0),
  323. Expanded(
  324. flex: 1,
  325. child: Container(
  326. decoration: BoxDecoration(
  327. color: ColorUtils.string2Color('#F2F3F6'),
  328. borderRadius: BorderRadius.circular(10),
  329. border: Border.all(
  330. color: ColorUtils.string2Color('#F2F3F6'), width: 1),
  331. ),
  332. height: 78,
  333. child: Column(
  334. crossAxisAlignment: CrossAxisAlignment.center,
  335. mainAxisAlignment: MainAxisAlignment.center,
  336. children: [
  337. Text(
  338. 'Today',
  339. style: TextStyle(
  340. fontSize: 13.0,
  341. color: ColorUtils.string2Color('#000000'),
  342. fontWeight: FontWeight.w400), // 设置字体大小
  343. ),
  344. const MyAssetImage(
  345. Assets.rewardsRewardsIconJb,
  346. width: 23,
  347. height: 23,
  348. ),
  349. Text(
  350. '+2',
  351. style: TextStyle(
  352. fontSize: 15.0,
  353. color: ColorUtils.string2Color('#000000'),
  354. fontWeight: FontWeight.w500), // 设置字体大小
  355. ),
  356. ],
  357. ),
  358. ),
  359. ),
  360. const SizedBox(width: 15.0),
  361. Expanded(
  362. flex: 2,
  363. child: Container(
  364. decoration: BoxDecoration(
  365. color: ColorUtils.string2Color('#F2F3F6'),
  366. borderRadius: BorderRadius.circular(10),
  367. border: Border.all(
  368. color: ColorUtils.string2Color('#F2F3F6'), width: 1),
  369. ),
  370. height: 78,
  371. child: Row(
  372. crossAxisAlignment: CrossAxisAlignment.start,
  373. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  374. children: [
  375. Column(
  376. crossAxisAlignment: CrossAxisAlignment.center,
  377. // mainAxisAlignment: MainAxisAlignment.center,
  378. children: [
  379. Text(
  380. 'Today',
  381. style: TextStyle(
  382. fontSize: 13.0,
  383. color: ColorUtils.string2Color('#000000'),
  384. fontWeight: FontWeight.w400), // 设置字体大小
  385. ),
  386. Text(
  387. '+ More',
  388. style: TextStyle(
  389. fontSize: 12.0,
  390. color: ColorUtils.string2Color('#000000'),
  391. fontWeight: FontWeight.w500), // 设置字体大小
  392. ),
  393. ],
  394. ),
  395. const MyAssetImage(
  396. Assets.rewardsRewardsIconYdjb,
  397. width: 67,
  398. height: 57,
  399. ).paddingOnly(top: 7),
  400. ],
  401. ).paddingOnly(top: 8, left: 13, right: 4),
  402. ),
  403. ),
  404. ],
  405. ),
  406. ],
  407. ).paddingOnly(left: 15, right: 15, top: 15, bottom: 15),
  408. );
  409. }
  410. Widget _buildSwiper(BuildContext context, WidgetRef ref, _vm) {
  411. return Container(
  412. // color: Colors.white,
  413. height: 55,
  414. decoration: BoxDecoration(
  415. color: Colors.white,
  416. borderRadius: BorderRadius.circular(10),
  417. boxShadow: const [
  418. BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  419. ],
  420. ),
  421. child: Row(
  422. crossAxisAlignment: CrossAxisAlignment.center,
  423. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  424. children: [
  425. Text(
  426. 'How To Get Rewards?',
  427. style: TextStyle(
  428. fontSize: 15.0,
  429. color: ColorUtils.string2Color('#000000'),
  430. fontWeight: FontWeight.w500), // 设置字体大小
  431. ),
  432. Container(
  433. padding:
  434. const EdgeInsets.only(top: 10, bottom: 10, left: 17, right: 17),
  435. decoration: BoxDecoration(
  436. color: ColorUtils.string2Color('#4161D0'),
  437. borderRadius: BorderRadius.circular(5),
  438. ),
  439. child: Text(
  440. 'Rewards',
  441. style: TextStyle(
  442. fontSize: 14.0,
  443. color: ColorUtils.string2Color('#ffffff'),
  444. fontWeight: FontWeight.w400), // 设置字体大小
  445. ).onTap(() {
  446. RewardsHomePage.startInstance();
  447. }),
  448. ),
  449. ],
  450. ).paddingOnly(left: 15, right: 15),
  451. ).marginOnly(top: 12, bottom: 12);
  452. }
  453. Widget _buildList(BuildContext context, WidgetRef ref, _vm) {
  454. return Container(
  455. decoration: BoxDecoration(
  456. color: Colors.white,
  457. borderRadius: BorderRadius.circular(10),
  458. boxShadow: const [
  459. BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  460. ],
  461. ),
  462. child: Column(
  463. crossAxisAlignment: CrossAxisAlignment.center,
  464. mainAxisAlignment: MainAxisAlignment.center,
  465. children: [
  466. Container(
  467. padding:
  468. const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
  469. decoration: BoxDecoration(
  470. border: Border(
  471. bottom: BorderSide(
  472. width: 1.0, // 底边边框的宽度
  473. color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
  474. ))),
  475. child: Row(
  476. crossAxisAlignment: CrossAxisAlignment.center,
  477. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  478. children: [
  479. Row(
  480. children: [
  481. Container(
  482. padding: const EdgeInsets.only(
  483. top: 10, bottom: 10, left: 17, right: 17),
  484. decoration: BoxDecoration(
  485. color: ColorUtils.string2Color('#f2f3f6'),
  486. borderRadius: BorderRadius.circular(5),
  487. ),
  488. child: const MyAssetImage(
  489. Assets.rewardsRewardsIconIm,
  490. width: 29,
  491. height: 24,
  492. ),
  493. ).marginOnly(right: 12),
  494. Column(
  495. crossAxisAlignment: CrossAxisAlignment.start,
  496. mainAxisAlignment: MainAxisAlignment.center,
  497. children: [
  498. Text(
  499. 'Daily Login',
  500. style: TextStyle(
  501. fontSize: 15.0,
  502. color: ColorUtils.string2Color('#000000'),
  503. fontWeight: FontWeight.w500), // 设置字体大小
  504. ).marginOnly(bottom: 6),
  505. Row(
  506. children: [
  507. Text(
  508. '+2',
  509. style: TextStyle(
  510. fontSize: 15.0,
  511. color: ColorUtils.string2Color('#4161D0'),
  512. fontWeight: FontWeight.w500), // 设置字体大小
  513. ),
  514. const MyAssetImage(
  515. Assets.rewardsRewardsIconJb,
  516. width: 14,
  517. height: 14,
  518. )
  519. ],
  520. )
  521. ],
  522. )
  523. ],
  524. ),
  525. Container(
  526. width: 86,
  527. height: 30,
  528. decoration: BoxDecoration(
  529. color: ColorUtils.string2Color('#ffffff'),
  530. borderRadius: BorderRadius.circular(5),
  531. border: Border.all(
  532. color: ColorUtils.string2Color('#4161D0'), width: 1),
  533. ),
  534. child: Center(
  535. child: Text(
  536. 'Check In',
  537. style: TextStyle(
  538. fontSize: 14.0,
  539. color: ColorUtils.string2Color('#4161D0'),
  540. fontWeight: FontWeight.w400), // 设置字体大小
  541. ),
  542. ),
  543. ),
  544. ],
  545. ),
  546. ),
  547. Container(
  548. padding:
  549. const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
  550. decoration: BoxDecoration(
  551. border: Border(
  552. bottom: BorderSide(
  553. width: 1.0, // 底边边框的宽度
  554. color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
  555. ))),
  556. child: Row(
  557. crossAxisAlignment: CrossAxisAlignment.center,
  558. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  559. children: [
  560. Row(
  561. children: [
  562. Container(
  563. padding: const EdgeInsets.only(
  564. top: 10, bottom: 10, left: 17, right: 17),
  565. decoration: BoxDecoration(
  566. color: ColorUtils.string2Color('#f2f3f6'),
  567. borderRadius: BorderRadius.circular(5),
  568. ),
  569. child: const MyAssetImage(
  570. Assets.rewardsRewardsIconIm,
  571. width: 29,
  572. height: 24,
  573. ),
  574. ).marginOnly(right: 12),
  575. Column(
  576. crossAxisAlignment: CrossAxisAlignment.start,
  577. mainAxisAlignment: MainAxisAlignment.center,
  578. children: [
  579. Text(
  580. 'Daily Login',
  581. style: TextStyle(
  582. fontSize: 15.0,
  583. color: ColorUtils.string2Color('#000000'),
  584. fontWeight: FontWeight.w500), // 设置字体大小
  585. ).marginOnly(bottom: 6),
  586. Row(
  587. children: [
  588. Text(
  589. '+2',
  590. style: TextStyle(
  591. fontSize: 15.0,
  592. color: ColorUtils.string2Color('#4161D0'),
  593. fontWeight: FontWeight.w500), // 设置字体大小
  594. ),
  595. const MyAssetImage(
  596. Assets.rewardsRewardsIconJb,
  597. width: 14,
  598. height: 14,
  599. )
  600. ],
  601. )
  602. ],
  603. )
  604. ],
  605. ),
  606. Container(
  607. width: 86,
  608. height: 30,
  609. decoration: BoxDecoration(
  610. color: ColorUtils.string2Color('#ffffff'),
  611. borderRadius: BorderRadius.circular(5),
  612. border: Border.all(
  613. color: ColorUtils.string2Color('#4161D0'), width: 1),
  614. ),
  615. child: Center(
  616. child: Text(
  617. 'Check In',
  618. style: TextStyle(
  619. fontSize: 14.0,
  620. color: ColorUtils.string2Color('#4161D0'),
  621. fontWeight: FontWeight.w400), // 设置字体大小
  622. ),
  623. ),
  624. ),
  625. ],
  626. ),
  627. ),
  628. Container(
  629. padding:
  630. const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
  631. decoration: BoxDecoration(
  632. border: Border(
  633. bottom: BorderSide(
  634. width: 1.0, // 底边边框的宽度
  635. color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
  636. ))),
  637. child: Row(
  638. crossAxisAlignment: CrossAxisAlignment.center,
  639. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  640. children: [
  641. Row(
  642. children: [
  643. Container(
  644. padding: const EdgeInsets.only(
  645. top: 10, bottom: 10, left: 17, right: 17),
  646. decoration: BoxDecoration(
  647. color: ColorUtils.string2Color('#f2f3f6'),
  648. borderRadius: BorderRadius.circular(5),
  649. ),
  650. child: const MyAssetImage(
  651. Assets.rewardsRewardsIconIm,
  652. width: 29,
  653. height: 24,
  654. ),
  655. ).marginOnly(right: 12),
  656. Column(
  657. crossAxisAlignment: CrossAxisAlignment.start,
  658. mainAxisAlignment: MainAxisAlignment.center,
  659. children: [
  660. Text(
  661. 'Daily Login',
  662. style: TextStyle(
  663. fontSize: 15.0,
  664. color: ColorUtils.string2Color('#000000'),
  665. fontWeight: FontWeight.w500), // 设置字体大小
  666. ).marginOnly(bottom: 6),
  667. Row(
  668. children: [
  669. Text(
  670. '+2',
  671. style: TextStyle(
  672. fontSize: 15.0,
  673. color: ColorUtils.string2Color('#4161D0'),
  674. fontWeight: FontWeight.w500), // 设置字体大小
  675. ),
  676. const MyAssetImage(
  677. Assets.rewardsRewardsIconJb,
  678. width: 14,
  679. height: 14,
  680. )
  681. ],
  682. )
  683. ],
  684. )
  685. ],
  686. ),
  687. Container(
  688. width: 86,
  689. height: 30,
  690. decoration: BoxDecoration(
  691. color: ColorUtils.string2Color('#ffffff'),
  692. borderRadius: BorderRadius.circular(5),
  693. border: Border.all(
  694. color: ColorUtils.string2Color('#4161D0'), width: 1),
  695. ),
  696. child: Center(
  697. child: Text(
  698. 'Check In',
  699. style: TextStyle(
  700. fontSize: 14.0,
  701. color: ColorUtils.string2Color('#4161D0'),
  702. fontWeight: FontWeight.w400), // 设置字体大小
  703. ),
  704. ),
  705. ),
  706. ],
  707. ),
  708. )
  709. ],
  710. ),
  711. ).marginOnly(bottom: 12);
  712. }
  713. Widget _buildHistory(BuildContext context, WidgetRef ref, _vm) {
  714. return Container(
  715. decoration: BoxDecoration(
  716. color: Colors.white,
  717. borderRadius: BorderRadius.circular(10),
  718. boxShadow: const [
  719. BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  720. ],
  721. ),
  722. child: Column(
  723. crossAxisAlignment: CrossAxisAlignment.center,
  724. mainAxisAlignment: MainAxisAlignment.center,
  725. children: [
  726. Row(
  727. crossAxisAlignment: CrossAxisAlignment.center,
  728. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  729. children: [
  730. Text(
  731. 'Points History',
  732. style: TextStyle(
  733. fontSize: 15.0,
  734. color: ColorUtils.string2Color('#000000'),
  735. fontWeight: FontWeight.w500), // 设置字体大小
  736. ),
  737. Text(
  738. 'More >',
  739. style: TextStyle(
  740. fontSize: 15.0,
  741. color: ColorUtils.string2Color('#4161D0'),
  742. fontWeight: FontWeight.w500), // 设置字体大小
  743. ).onTap(() {
  744. RewardsHistoryPage.startInstance();
  745. })
  746. ]).paddingOnly(left: 15, right: 15, top: 15, bottom: 5),
  747. Container(
  748. padding:
  749. const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
  750. decoration: BoxDecoration(
  751. border: Border(
  752. bottom: BorderSide(
  753. width: 1.0, // 底边边框的宽度
  754. color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
  755. ))),
  756. child: Row(
  757. crossAxisAlignment: CrossAxisAlignment.center,
  758. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  759. children: [
  760. Column(
  761. crossAxisAlignment: CrossAxisAlignment.start,
  762. mainAxisAlignment: MainAxisAlignment.center,
  763. children: [
  764. Text(
  765. 'Daily Login',
  766. style: TextStyle(
  767. fontSize: 15.0,
  768. color: ColorUtils.string2Color('#000000'),
  769. fontWeight: FontWeight.w500), // 设置字体大小
  770. ).marginOnly(bottom: 6),
  771. Text(
  772. '14 Oct 2024 10:00PM',
  773. style: TextStyle(
  774. fontSize: 13.0,
  775. color: ColorUtils.string2Color('#808DAF'),
  776. fontWeight: FontWeight.w400), // 设置字体大小
  777. ),
  778. ],
  779. ),
  780. Text(
  781. '+2',
  782. style: TextStyle(
  783. fontSize: 20.0,
  784. color: ColorUtils.string2Color('#FDB429'),
  785. fontWeight: FontWeight.w500), // 设置字体大小
  786. ),
  787. ],
  788. ),
  789. ),
  790. Container(
  791. padding:
  792. const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
  793. decoration: BoxDecoration(
  794. border: Border(
  795. bottom: BorderSide(
  796. width: 1.0, // 底边边框的宽度
  797. color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
  798. ))),
  799. child: Row(
  800. crossAxisAlignment: CrossAxisAlignment.center,
  801. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  802. children: [
  803. Column(
  804. crossAxisAlignment: CrossAxisAlignment.start,
  805. mainAxisAlignment: MainAxisAlignment.center,
  806. children: [
  807. Text(
  808. 'Daily Login',
  809. style: TextStyle(
  810. fontSize: 15.0,
  811. color: ColorUtils.string2Color('#000000'),
  812. fontWeight: FontWeight.w500), // 设置字体大小
  813. ).marginOnly(bottom: 6),
  814. Text(
  815. '14 Oct 2024 10:00PM',
  816. style: TextStyle(
  817. fontSize: 13.0,
  818. color: ColorUtils.string2Color('#808DAF'),
  819. fontWeight: FontWeight.w400), // 设置字体大小
  820. ),
  821. ],
  822. ),
  823. Text(
  824. '+2',
  825. style: TextStyle(
  826. fontSize: 20.0,
  827. color: ColorUtils.string2Color('#FDB429'),
  828. fontWeight: FontWeight.w500), // 设置字体大小
  829. ),
  830. ],
  831. ),
  832. ),
  833. Container(
  834. padding:
  835. const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
  836. decoration: BoxDecoration(
  837. border: Border(
  838. bottom: BorderSide(
  839. width: 1.0, // 底边边框的宽度
  840. color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
  841. ))),
  842. child: Row(
  843. crossAxisAlignment: CrossAxisAlignment.center,
  844. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  845. children: [
  846. Column(
  847. crossAxisAlignment: CrossAxisAlignment.start,
  848. mainAxisAlignment: MainAxisAlignment.center,
  849. children: [
  850. Text(
  851. 'Daily Login',
  852. style: TextStyle(
  853. fontSize: 15.0,
  854. color: ColorUtils.string2Color('#000000'),
  855. fontWeight: FontWeight.w500), // 设置字体大小
  856. ).marginOnly(bottom: 6),
  857. Text(
  858. '14 Oct 2024 10:00PM',
  859. style: TextStyle(
  860. fontSize: 13.0,
  861. color: ColorUtils.string2Color('#808DAF'),
  862. fontWeight: FontWeight.w400), // 设置字体大小
  863. ),
  864. ],
  865. ),
  866. Text(
  867. '+2',
  868. style: TextStyle(
  869. fontSize: 20.0,
  870. color: ColorUtils.string2Color('#FDB429'),
  871. fontWeight: FontWeight.w500), // 设置字体大小
  872. ),
  873. ],
  874. ),
  875. ),
  876. ],
  877. ),
  878. ).marginOnly(bottom: 12);
  879. }
  880. @override
  881. Widget build(BuildContext context, WidgetRef ref) {
  882. final _vm = ref.read(rewardsVmProvider.notifier);
  883. return Scaffold(
  884. // appBar: AppBar(title: Text("奖励")),
  885. body: Column(children: [
  886. Expanded(
  887. child: SingleChildScrollView(
  888. scrollDirection: Axis.vertical,
  889. physics: const BouncingScrollPhysics(),
  890. clipBehavior: Clip.none,
  891. child: Column(
  892. children: [
  893. _buildTop(context, ref, _vm),
  894. Container(
  895. transform: Matrix4.translationValues(0.0, -45.0, 0.0),
  896. child: Column(
  897. children: [
  898. _buildSearch(context, ref, _vm),
  899. _buildSwiper(context, ref, _vm),
  900. _buildList(context, ref, _vm),
  901. _buildHistory(context, ref, _vm),
  902. ],
  903. ), // 使用负数margin
  904. ).paddingOnly(left: 15, right: 15),
  905. ],
  906. )),
  907. ),
  908. ]).backgroundColor(ColorUtils.string2Color('#F2F3F6')),
  909. );
  910. }
  911. }