discount_ticket_dialog.dart 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312
  1. import 'package:flutter/material.dart';
  2. import 'package:flutter_screenutil/flutter_screenutil.dart';
  3. import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
  4. import 'package:get/get.dart';
  5. import 'package:lottie/lottie.dart';
  6. import '../../../data/consts/constants.dart';
  7. import '../../../resource/assets.gen.dart';
  8. import '../../../resource/colors.gen.dart';
  9. import '../../../utils/styles.dart';
  10. import '../suprise/goods_surprise_controller.dart';
  11. // 折扣券一杯奶茶弹窗
  12. class DiscountTicketDialog {
  13. static const String tag = 'DiscountTicketDialog';
  14. static void show({VoidCallback? clickConfirm, VoidCallback? clickCancel}) {
  15. SmartDialog.show(
  16. tag: tag,
  17. backType: SmartBackType.block,
  18. clickMaskDismiss: false,
  19. maskColor: ColorName.black70,
  20. animationType: SmartAnimationType.centerScale_otherSlide,
  21. onDismiss: () => Get.delete<GoodsSurpriseController>(),
  22. builder: (_) {
  23. final controller = Get.find<GoodsSurpriseController>();
  24. return Stack(
  25. children: [
  26. Positioned(
  27. top: 0,
  28. left: 0,
  29. right: 0,
  30. bottom: 0,
  31. child: Column(
  32. crossAxisAlignment: CrossAxisAlignment.center,
  33. mainAxisAlignment: MainAxisAlignment.center,
  34. children: [
  35. Stack(
  36. clipBehavior: Clip.none,
  37. children: [
  38. Column(
  39. mainAxisAlignment: MainAxisAlignment.center,
  40. crossAxisAlignment: CrossAxisAlignment.center,
  41. children: [
  42. SizedBox(
  43. width: 360.h,
  44. height: 110.h,
  45. child: IgnorePointer(
  46. child: Lottie.asset(
  47. Assets.anim.animDiscountTicketDialogData,
  48. repeat: false,
  49. fit: BoxFit.contain,
  50. ),
  51. ),
  52. ),
  53. Container(
  54. margin: EdgeInsets.only(left: 31.h, right: 14.h),
  55. width: 317.w,
  56. height: 364.h,
  57. decoration: BoxDecoration(
  58. image: DecorationImage(
  59. image: Assets.images.bgTicketDialog.provider(),
  60. fit: BoxFit.contain,
  61. ),
  62. boxShadow: [
  63. BoxShadow(
  64. color: Colors.black.withAlpha(4), // 阴影颜色
  65. blurRadius: 10, // 模糊程度
  66. spreadRadius: 2, // 扩散程度
  67. offset: Offset(4, 4), // 偏移量 (x, y)
  68. ),
  69. ],
  70. ),
  71. child: Stack(
  72. children: [
  73. Column(
  74. mainAxisAlignment: MainAxisAlignment.start,
  75. crossAxisAlignment: CrossAxisAlignment.center,
  76. children: [
  77. SizedBox(height: 160.h),
  78. Container(
  79. margin: EdgeInsets.only(right: 16.h),
  80. decoration: BoxDecoration(
  81. image: DecorationImage(
  82. image:
  83. Assets.images.bgTicketDialogPrices
  84. .provider(),
  85. fit: BoxFit.cover,
  86. alignment: Alignment.center,
  87. ),
  88. ),
  89. width: 260.w,
  90. height: 100.h,
  91. child: Column(
  92. children: [
  93. Container(
  94. margin: EdgeInsets.only(top: 10.h),
  95. child: Obx(() {
  96. return Text(
  97. controller.secondAmount?.name ??
  98. "",
  99. style: TextStyle(
  100. color: const Color(
  101. 0xFFC39858,
  102. ),
  103. fontSize: 14.sp,
  104. fontWeight: FontWeight.w400,
  105. ),
  106. );
  107. }),
  108. ),
  109. Obx(() {
  110. return Text.rich(
  111. TextSpan(
  112. children: [
  113. TextSpan(
  114. text: '¥',
  115. style: TextStyle(
  116. color: const Color(
  117. 0xFFF55208,
  118. ),
  119. fontSize: 27.sp,
  120. fontWeight:
  121. FontWeight.w700,
  122. height: 0,
  123. ),
  124. ),
  125. TextSpan(
  126. text:
  127. controller
  128. .secondAmount
  129. ?.amountText,
  130. style: TextStyle(
  131. color: const Color(
  132. 0xFFF55208,
  133. ),
  134. height: 0,
  135. fontSize: 36.sp,
  136. fontWeight:
  137. FontWeight.w700,
  138. ),
  139. ),
  140. ],
  141. ),
  142. );
  143. }),
  144. Obx(() {
  145. return Text(
  146. controller
  147. .secondAmount
  148. ?.description ??
  149. "",
  150. style: TextStyle(
  151. color: Colors.black.withAlpha(
  152. 66,
  153. ),
  154. fontSize: 10.sp,
  155. fontWeight: FontWeight.w400,
  156. ),
  157. );
  158. }),
  159. ],
  160. ),
  161. ),
  162. Container(
  163. margin: EdgeInsets.only(right: 25.h),
  164. width: 317.w,
  165. height: 16.h,
  166. decoration: BoxDecoration(
  167. image: DecorationImage(
  168. image:
  169. Assets
  170. .images
  171. .bgTicketDialogPrices2
  172. .provider(),
  173. fit: BoxFit.contain,
  174. ),
  175. ),
  176. ),
  177. SizedBox(height: 9.h),
  178. GestureDetector(
  179. onTap: () {
  180. clickConfirm?.call();
  181. SmartDialog.dismiss(tag: tag);
  182. },
  183. child: Container(
  184. margin: EdgeInsets.only(right: 20.h),
  185. width: 200.w,
  186. height: 54.h,
  187. child: Assets
  188. .images
  189. .iconTicketDialogButton
  190. .image(width: 200.w, height: 54.h),
  191. ),
  192. ),
  193. ],
  194. ),
  195. // 倒计时
  196. Visibility(
  197. visible: isNotHWChannel(),
  198. child: Positioned(
  199. right: 40.w,
  200. child: Container(
  201. height: 24.h,
  202. width: 107.w,
  203. alignment: Alignment.center,
  204. decoration: ShapeDecoration(
  205. gradient: LinearGradient(
  206. begin: Alignment.centerLeft,
  207. end: Alignment.centerRight,
  208. colors: [
  209. const Color(0xFFFF68F4),
  210. const Color(0xFFF96432),
  211. ],
  212. ),
  213. shape: RoundedRectangleBorder(
  214. side: BorderSide(
  215. width: 1,
  216. color: Colors.white,
  217. ),
  218. borderRadius: BorderRadius.only(
  219. topLeft: Radius.circular(15.r),
  220. topRight: Radius.circular(16.r),
  221. bottomRight: Radius.circular(16.r),
  222. ),
  223. ),
  224. ),
  225. margin: EdgeInsets.only(top: 140.h),
  226. child: Obx(() {
  227. int totalMilliseconds =
  228. controller.timeLeft.value;
  229. int minutes =
  230. (totalMilliseconds ~/ 6000);
  231. int seconds =
  232. (totalMilliseconds ~/ 100) % 60;
  233. int milliseconds =
  234. (totalMilliseconds % 100); // 毫秒
  235. return Text(
  236. "${minutes.toString().padLeft(2, '0')}:${seconds.toString().padLeft(2, '0')}:${milliseconds.toString().padLeft(2, '0')} 后过期",
  237. style: TextStyle(
  238. color: Colors.white,
  239. fontSize: 12.sp,
  240. fontWeight: FontWeight.w500,
  241. ),
  242. );
  243. }),
  244. ),
  245. ),
  246. ),
  247. ],
  248. ),
  249. ),
  250. ],
  251. ),
  252. ],
  253. ),
  254. Container(
  255. margin: EdgeInsets.only(top: 24.h),
  256. child: GestureDetector(
  257. onTap: () {
  258. SmartDialog.dismiss(tag: tag);
  259. clickCancel?.call();
  260. },
  261. child: Assets.images.iconCharacterDialogClose.image(
  262. width: 40.r,
  263. height: 40.r,
  264. ),
  265. ),
  266. ),
  267. ],
  268. ),
  269. ),
  270. ],
  271. );
  272. },
  273. );
  274. }
  275. }
  276. class VerticalDots extends StatelessWidget {
  277. final double dotSize;
  278. final double height;
  279. final Color? color;
  280. const VerticalDots({
  281. super.key,
  282. required this.dotSize,
  283. required this.height,
  284. this.color = Colors.white,
  285. });
  286. @override
  287. Widget build(BuildContext context) {
  288. return SizedBox(
  289. width: 2.w,
  290. height: 8.h,
  291. child: Column(
  292. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  293. children: List.generate(2, (index) {
  294. return Container(
  295. width: dotSize,
  296. height: dotSize,
  297. decoration: BoxDecoration(color: color, shape: BoxShape.circle),
  298. );
  299. }),
  300. ),
  301. );
  302. }
  303. }