rewards_successful_page.dart 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401
  1. import 'package:cpt_rewards/modules/rewards_address/rewards_address_page.dart';
  2. import 'package:cpt_rewards/modules/rewards_my/rewards_my_page.dart';
  3. import 'package:cs_resources/generated/l10n.dart';
  4. import 'package:cs_resources/theme/app_colors_theme.dart';
  5. import 'package:domain/entity/rewards_buy_entity.dart';
  6. import 'package:domain/entity/rewards_detail_entity.dart';
  7. import 'package:flutter/cupertino.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:router/ext/auto_router_extensions.dart';
  12. import 'package:shared/utils/log_utils.dart';
  13. import 'package:shared/utils/color_utils.dart';
  14. import 'package:widgets/ext/ex_widget.dart';
  15. import 'package:widgets/my_appbar.dart';
  16. import 'package:widgets/my_load_image.dart';
  17. import 'package:widgets/my_text_view.dart';
  18. import 'package:widgets/shatter/picker_container.dart';
  19. import 'package:widgets/widget_export.dart';
  20. import 'package:cs_resources/generated/assets.dart';
  21. import '../../../router/page/rewards_page_router.dart';
  22. import './rewards_successful_vm.dart';
  23. @RoutePage()
  24. class RewardsSuccessfulPage extends HookConsumerWidget {
  25. final int? amount;
  26. final String? title;
  27. final String? resources;
  28. final String? redeemedDate;
  29. final String? createdAt;
  30. const RewardsSuccessfulPage(
  31. {Key? key,
  32. @PathParam('amount') required this.amount,
  33. @PathParam('title') required this.title,
  34. @PathParam('resources') required this.resources,
  35. @PathParam('redeemedDate') required this.redeemedDate,
  36. @PathParam('createdAt') required this.createdAt})
  37. : super(key: key);
  38. //启动当前页面
  39. static void startInstance({
  40. BuildContext? context,
  41. int? amount,
  42. String? title = '',
  43. String? resources = '',
  44. String? redeemedDate = '',
  45. String? createdAt = '',
  46. }) {
  47. if (context != null) {
  48. context.router.push(RewardsSuccessfulPageRoute(
  49. amount: amount,
  50. title: title,
  51. resources: resources,
  52. redeemedDate: redeemedDate,
  53. createdAt: createdAt));
  54. } else {
  55. appRouter.push(RewardsSuccessfulPageRoute(
  56. amount: amount,
  57. title: title,
  58. resources: resources,
  59. redeemedDate: redeemedDate,
  60. createdAt: createdAt));
  61. }
  62. }
  63. // listitem
  64. Widget _buildSaleItem(BuildContext context, WidgetRef ref, _vm) {
  65. String? titles = title ?? '';
  66. String? resourcess = resources ?? '';
  67. return Column(
  68. children: [
  69. Container(
  70. decoration: const BoxDecoration(
  71. color: Colors.white,
  72. borderRadius: BorderRadius.all(Radius.circular(6.0)),
  73. boxShadow: [
  74. BoxShadow(
  75. color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  76. ],
  77. ),
  78. width: MediaQuery.of(context).size.width - 30,
  79. // height: 420,
  80. // margin: const EdgeInsets.only(left: 15, right: 15, top: 12.5),
  81. child: Column(
  82. crossAxisAlignment: CrossAxisAlignment.start,
  83. mainAxisAlignment: MainAxisAlignment.start,
  84. children: [
  85. MyLoadImage(
  86. resourcess,
  87. width: MediaQuery.of(context).size.width,
  88. height: 150,
  89. ),
  90. Column(
  91. crossAxisAlignment: CrossAxisAlignment.start,
  92. mainAxisAlignment: MainAxisAlignment.start,
  93. children: [
  94. Text(
  95. maxLines: 1, // 设置最大行数为2
  96. overflow: TextOverflow.ellipsis, // 超出部分用省略号表示
  97. titles,
  98. style: const TextStyle(
  99. fontSize: 17.0,
  100. color: Colors.black,
  101. fontWeight: FontWeight.w500),
  102. ),
  103. ],
  104. ).paddingOnly(left: 15, right: 15, top: 10, bottom: 30),
  105. ],
  106. )),
  107. ],
  108. ).marginOnly(left: 15, bottom: 15, right: 15);
  109. }
  110. Widget _buildDeal(BuildContext context, WidgetRef ref, _vm) {
  111. return Column(
  112. children: [
  113. Container(
  114. decoration: const BoxDecoration(
  115. color: Colors.white,
  116. borderRadius: BorderRadius.all(Radius.circular(6.0)),
  117. boxShadow: [
  118. BoxShadow(
  119. color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  120. ],
  121. ),
  122. width: MediaQuery.of(context).size.width - 30,
  123. child: Column(
  124. crossAxisAlignment: CrossAxisAlignment.start,
  125. children: [
  126. Row(
  127. mainAxisSize: MainAxisSize.min,
  128. mainAxisAlignment: MainAxisAlignment.start,
  129. crossAxisAlignment: CrossAxisAlignment.center,
  130. children: [
  131. const MyAssetImage(
  132. Assets.rewardsRewardsDetailDeal,
  133. width: 25,
  134. height: 25,
  135. ).marginOnly(right: 5),
  136. Text(
  137. S.current.redeem_deal_at,
  138. style: TextStyle(
  139. fontSize: 15.0,
  140. color: ColorUtils.string2Color('#000000'),
  141. fontWeight: FontWeight.w500),
  142. )
  143. ],
  144. ),
  145. Column(
  146. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  147. crossAxisAlignment: CrossAxisAlignment.center,
  148. children: [
  149. Text(
  150. '60 paya lebar rd, #09-13/17 paya lebar square, singapore 409051',
  151. maxLines: 2, // 设置最大行数为2
  152. overflow: TextOverflow.ellipsis, // 超出部分用省略号表示
  153. style: TextStyle(
  154. fontSize: 15.0,
  155. color: ColorUtils.string2Color('#54638C'),
  156. fontWeight: FontWeight.w400),
  157. ),
  158. ],
  159. ),
  160. ],
  161. ).paddingOnly(left: 15, right: 15, top: 12, bottom: 20),
  162. ),
  163. ],
  164. ).marginOnly(left: 15, bottom: 15, right: 15);
  165. }
  166. Widget _buildPackage(BuildContext context, WidgetRef ref, _vm) {
  167. String? redeemedDates = redeemedDate ?? '';
  168. return Column(
  169. children: [
  170. Container(
  171. decoration: const BoxDecoration(
  172. color: Colors.white,
  173. borderRadius: BorderRadius.all(Radius.circular(6.0)),
  174. boxShadow: [
  175. BoxShadow(
  176. color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  177. ],
  178. ),
  179. width: MediaQuery.of(context).size.width - 30,
  180. child: Column(
  181. crossAxisAlignment: CrossAxisAlignment.start,
  182. children: [
  183. Row(
  184. mainAxisSize: MainAxisSize.min,
  185. mainAxisAlignment: MainAxisAlignment.start,
  186. crossAxisAlignment: CrossAxisAlignment.center,
  187. children: [
  188. const MyAssetImage(
  189. Assets.rewardsRewardsIconDatd,
  190. width: 15,
  191. height: 15,
  192. ).marginOnly(right: 10),
  193. Text(
  194. S.current.redeem_from,
  195. style: TextStyle(
  196. fontSize: 15.0,
  197. color: ColorUtils.string2Color('#000000'),
  198. fontWeight: FontWeight.w500),
  199. )
  200. ],
  201. ).marginOnly(bottom: 10),
  202. Column(
  203. crossAxisAlignment: CrossAxisAlignment.start,
  204. children: [
  205. Text(
  206. redeemedDates,
  207. style: TextStyle(
  208. fontSize: 15.0,
  209. color: ColorUtils.string2Color('#54638C'),
  210. fontWeight: FontWeight.w400),
  211. ),
  212. ],
  213. ),
  214. ],
  215. ).paddingOnly(left: 15, right: 15, top: 12, bottom: 20),
  216. ),
  217. ],
  218. ).marginOnly(left: 15, bottom: 15, right: 15);
  219. }
  220. Widget _buildNotice(BuildContext context, WidgetRef ref, _vm) {
  221. String? createdAts = createdAt ?? '';
  222. return Column(
  223. children: [
  224. Container(
  225. decoration: const BoxDecoration(
  226. color: Colors.white,
  227. borderRadius: BorderRadius.all(Radius.circular(6.0)),
  228. boxShadow: [
  229. BoxShadow(
  230. color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  231. ],
  232. ),
  233. width: MediaQuery.of(context).size.width - 30,
  234. child: Column(
  235. crossAxisAlignment: CrossAxisAlignment.start,
  236. children: [
  237. Row(
  238. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  239. crossAxisAlignment: CrossAxisAlignment.center,
  240. children: [
  241. Text(
  242. '${S.current.date_time}:',
  243. style: TextStyle(
  244. fontSize: 15.0,
  245. color: ColorUtils.string2Color('#333333'),
  246. fontWeight: FontWeight.w400),
  247. ),
  248. Row(
  249. children: [
  250. Text(
  251. createdAts,
  252. style: TextStyle(
  253. fontSize: 15.0,
  254. color: ColorUtils.string2Color('#54638C'),
  255. fontWeight: FontWeight.w400),
  256. ),
  257. ],
  258. ),
  259. ],
  260. ),
  261. // Row(
  262. // mainAxisAlignment: MainAxisAlignment.spaceBetween,
  263. // crossAxisAlignment: CrossAxisAlignment.center,
  264. // children: [
  265. // Text(
  266. // 'Transaction ID:',
  267. // style: TextStyle(
  268. // fontSize: 15.0,
  269. // color: ColorUtils.string2Color('#333333'),
  270. // fontWeight: FontWeight.w400),
  271. // ),
  272. // Row(
  273. // children: [
  274. // Text(
  275. // 'PR00021837HY',
  276. // style: TextStyle(
  277. // fontSize: 15.0,
  278. // color: ColorUtils.string2Color('#54638C'),
  279. // fontWeight: FontWeight.w400),
  280. // ),
  281. // ],
  282. // ),
  283. // ],
  284. // ).marginOnly(top: 30, bottom: 10),
  285. ],
  286. ).paddingOnly(left: 15, right: 15, top: 30, bottom: 30),
  287. ),
  288. ],
  289. ).marginOnly(left: 15, bottom: 15, right: 15);
  290. }
  291. Widget _buildTop(BuildContext context, WidgetRef ref, _vm) {
  292. return Container(
  293. width: MediaQuery.of(context).size.width,
  294. color: ColorUtils.string2Color('#FFFFFF'),
  295. padding: const EdgeInsets.only(top: 15, bottom: 30),
  296. child: Column(
  297. mainAxisAlignment: MainAxisAlignment.center,
  298. crossAxisAlignment: CrossAxisAlignment.center,
  299. children: [
  300. const MyAssetImage(
  301. Assets.rewardsRewardsSuccess,
  302. width: 54,
  303. height: 54,
  304. ),
  305. Text(
  306. S.current.you_have_paid_points,
  307. style: TextStyle(
  308. fontSize: 18.0,
  309. color: ColorUtils.string2Color('#4161D0'),
  310. fontWeight: FontWeight.w500),
  311. ).marginOnly(top: 12, bottom: 15),
  312. Text(
  313. '$amount',
  314. style: TextStyle(
  315. fontSize: 30.0,
  316. color: ColorUtils.string2Color('#000000'),
  317. fontWeight: FontWeight.w500),
  318. ),
  319. ],
  320. ));
  321. }
  322. @override
  323. Widget build(BuildContext context, WidgetRef ref) {
  324. final _vm = ref.read(rewardsSuccessfulVmProvider.notifier);
  325. final state = ref.watch(rewardsSuccessfulVmProvider);
  326. // RewardsBuyEntity? datad = data;
  327. return Scaffold(
  328. appBar: MyAppBar.appBar(
  329. context,
  330. S.current.payment_successful,
  331. backgroundColor: context.appColors.whiteBG,
  332. ),
  333. body: Column(
  334. children: [
  335. Expanded(
  336. child: SingleChildScrollView(
  337. scrollDirection: Axis.vertical,
  338. physics: const BouncingScrollPhysics(),
  339. clipBehavior: Clip.none,
  340. child: Column(
  341. children: [
  342. _buildTop(context, ref, _vm),
  343. Container(
  344. color: ColorUtils.string2Color('#F2F3F6'),
  345. padding: const EdgeInsets.only(top: 15),
  346. child: Column(
  347. children: [
  348. _buildSaleItem(context, ref, _vm),
  349. _buildDeal(context, ref, _vm),
  350. _buildPackage(context, ref, _vm),
  351. _buildNotice(context, ref, _vm),
  352. ],
  353. )),
  354. ],
  355. ))),
  356. Container(
  357. height: 50,
  358. color: ColorUtils.string2Color('#4161D0'),
  359. child: Flex(
  360. direction: Axis.horizontal,
  361. children: [
  362. Expanded(
  363. flex: 1,
  364. child: Container(
  365. color: ColorUtils.string2Color('#4161D0'),
  366. height: 100,
  367. child: Row(
  368. mainAxisAlignment: MainAxisAlignment.center,
  369. crossAxisAlignment: CrossAxisAlignment.center,
  370. children: [
  371. MyTextView(
  372. S.current.check_my_rewards,
  373. fontSize: 16,
  374. textColor: Colors.white,
  375. isFontMedium: true,
  376. ),
  377. ],
  378. ),
  379. ).onTap(() {
  380. // 去详情
  381. RewardsMyPage.startInstance();
  382. }),
  383. ),
  384. ],
  385. ),
  386. )
  387. ],
  388. ),
  389. );
  390. }
  391. }