rewards_successful_page.dart 15 KB

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