services_page.dart 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215
  1. import 'package:cpt_services/modules/services_list/services_list_page.dart';
  2. import 'package:shared/utils/log_utils.dart';
  3. import 'package:cs_resources/generated/assets.dart';
  4. import 'package:cs_resources/theme/app_colors_theme.dart';
  5. import 'package:flutter/material.dart';
  6. import 'package:auto_route/auto_route.dart';
  7. import 'package:flutter_hooks/flutter_hooks.dart';
  8. import 'package:hooks_riverpod/hooks_riverpod.dart';
  9. import 'package:router/ext/auto_router_extensions.dart';
  10. import 'package:shared/utils/color_utils.dart';
  11. import 'package:widgets/ext/ex_widget.dart';
  12. import 'package:widgets/load_state_layout.dart';
  13. import 'package:widgets/my_appbar.dart';
  14. import 'package:widgets/my_load_image.dart';
  15. import 'package:widgets/widget_export.dart';
  16. import '../../../router/page/services_page_router.dart';
  17. import 'services_view_model.dart';
  18. @RoutePage()
  19. class ServicesPage extends HookConsumerWidget {
  20. const ServicesPage({Key? key}) : super(key: key);
  21. //启动当前页面
  22. static void startInstance({BuildContext? context}) {
  23. if (context != null) {
  24. context.router.push(const ServicesPageRoute());
  25. } else {
  26. appRouter.push(const ServicesPageRoute());
  27. }
  28. }
  29. Widget _buildTop(BuildContext context, WidgetRef ref, _vm) {
  30. // List itemsList = _vm.state.list.toList();
  31. return Container(
  32. color: ColorUtils.string2Color('#FFFFFF'),
  33. child: Column(children: [
  34. Container(
  35. width: double.infinity,
  36. height: 160,
  37. decoration: const BoxDecoration(
  38. image: DecorationImage(
  39. image: AssetImage(
  40. 'packages/cs_resources/${Assets.propertyHomeLoanBg}'),
  41. fit: BoxFit.fill, // 设置图片平铺
  42. ),
  43. ),
  44. ).marginOnly(bottom: 15),
  45. Row(
  46. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  47. crossAxisAlignment: CrossAxisAlignment.center,
  48. children: [
  49. const Text(
  50. 'Home Services!',
  51. style: TextStyle(
  52. fontSize: 16.0,
  53. color: Colors.black,
  54. fontWeight: FontWeight.w400), // 设置字体大小
  55. ),
  56. TextButton(
  57. onPressed: () {
  58. _vm.doDeleteAccount();
  59. },
  60. style: TextButton.styleFrom(
  61. foregroundColor: Colors.black,
  62. backgroundColor: ColorUtils.string2Color('#4161D0'), // 背景颜色
  63. minimumSize: const Size(70, 30), // 最小宽度和高度
  64. padding: const EdgeInsets.symmetric(
  65. horizontal: 11.0, vertical: 9), // 内边距
  66. shape: RoundedRectangleBorder(
  67. borderRadius: BorderRadius.circular(5), // 圆角
  68. side: BorderSide(
  69. color: ColorUtils.string2Color('#4161D0'),
  70. width: 1.0,
  71. ), // 边框
  72. ),
  73. ),
  74. child: const Text(
  75. 'Filter',
  76. style: const TextStyle(
  77. color: Colors.white,
  78. ),
  79. ),
  80. ),
  81. ],
  82. ),
  83. ])).paddingOnly(top: 10, left: 15, right: 15);
  84. }
  85. Widget _buildItem(BuildContext context, WidgetRef ref, _vm, item) {
  86. return Container(
  87. width: MediaQuery.of(context).size.width / 2 - 25,
  88. height: 146,
  89. decoration: const BoxDecoration(
  90. color: Colors.white,
  91. borderRadius: BorderRadius.all(Radius.circular(6.0)),
  92. boxShadow: [
  93. BoxShadow(
  94. color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
  95. ],
  96. ),
  97. child: Column(
  98. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  99. children: [
  100. Row(
  101. crossAxisAlignment: CrossAxisAlignment.start,
  102. children: [
  103. Expanded(
  104. child: Text(
  105. maxLines: 2, // 设置最大行数为2
  106. overflow: TextOverflow.ellipsis, // 超出部分用省略号表示
  107. item['title'],
  108. style: const TextStyle(
  109. fontSize: 16.0,
  110. color: Colors.black,
  111. fontWeight: FontWeight.w700),
  112. ),
  113. )
  114. ],
  115. ),
  116. Row(
  117. mainAxisAlignment: MainAxisAlignment.end,
  118. children: [
  119. MyAssetImage(
  120. item['price'],
  121. width: 110,
  122. height: 80,
  123. )
  124. ],
  125. ),
  126. ],
  127. ).paddingOnly(top: 15, left: 15).onTap(() {
  128. // 去详情
  129. // _vm.goNewsDetail(item['title']);
  130. Navigator.push(
  131. context,
  132. MaterialPageRoute(builder: (context) => const ServicesListPage()),
  133. );
  134. }))
  135. .marginOnly(bottom: 15);
  136. }
  137. // list
  138. Widget _buildSaleList(BuildContext context, WidgetRef ref, _vm) {
  139. List itemsList = _vm.state.list.toList();
  140. return ListView.builder(
  141. itemCount: itemsList.length,
  142. itemBuilder: (context, index) {
  143. bool noLast = !(index == itemsList.length - 1);
  144. bool isLast = index == itemsList.length - 1;
  145. if (index % 2 == 0 && noLast) {
  146. return Row(
  147. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  148. children: [
  149. _buildItem(context, ref, _vm, itemsList[index]),
  150. _buildItem(context, ref, _vm, itemsList[index + 1]),
  151. ],
  152. );
  153. } else if (index % 2 != 0 && noLast) {
  154. return Row();
  155. } else if (index % 2 != 0 && isLast) {
  156. return Row();
  157. } else {
  158. return Row(
  159. mainAxisAlignment: MainAxisAlignment.spaceBetween,
  160. children: [
  161. _buildItem(context, ref, _vm, itemsList[index]),
  162. ],
  163. );
  164. }
  165. // _buildSaleItem(context, ref, itemsList[index], _vm);
  166. },
  167. );
  168. }
  169. @override
  170. Widget build(BuildContext context, WidgetRef ref) {
  171. final state = ref.watch(servicesVmProvider);
  172. final _vm = ref.read(servicesVmProvider.notifier);
  173. return Scaffold(
  174. appBar: MyAppBar.appBar(
  175. context,
  176. "Service",
  177. backgroundColor: context.appColors.backgroundWhite,
  178. ),
  179. body: Container(
  180. child: Column(
  181. children: [
  182. _buildTop(context, ref, _vm),
  183. Expanded(
  184. child: EasyRefresh(
  185. // 上拉加载
  186. onLoad: () async {
  187. Log.d("----onLoad");
  188. _vm.onLoadData();
  189. },
  190. // 下拉刷新
  191. onRefresh: () async {
  192. Log.d("----onRefresh");
  193. _vm.refreshListData();
  194. },
  195. child: Container(
  196. color: ColorUtils.string2Color('#F2F3F6'),
  197. padding: const EdgeInsets.only(
  198. bottom: 15, left: 15, right: 15, top: 15),
  199. child: _buildSaleList(context, ref, _vm)),
  200. ),
  201. )
  202. ],
  203. ),
  204. ),
  205. );
  206. }
  207. }