From 52b5d9e2597df2b117cb97b40b2731199622a78d Mon Sep 17 00:00:00 2001 From: debuggerx Date: Thu, 13 Jan 2022 18:41:13 +0800 Subject: [PATCH] feat: market logic. --- app/lib/http/api.dart | 24 ++++ app/lib/models/scheme_list_refresh_key.dart | 9 ++ app/lib/pages/content.dart | 4 + app/lib/pages/gesture_editor.dart | 4 + app/lib/widgets/market.dart | 200 +++++++++++++++++++++++++++- app/lib/widgets/me.dart | 18 ++- 6 files changed, 253 insertions(+), 6 deletions(-) create mode 100644 app/lib/models/scheme_list_refresh_key.dart diff --git a/app/lib/http/api.dart b/app/lib/http/api.dart index 8fe7a4f..cdb6142 100644 --- a/app/lib/http/api.dart +++ b/app/lib/http/api.dart @@ -6,6 +6,7 @@ import 'package:dde_gesture_manager/extensions.dart'; import 'package:dde_gesture_manager/models/scheme.dart' as AppScheme; import 'package:dde_gesture_manager/utils/helper.dart'; import 'package:dde_gesture_manager/utils/notificator.dart'; +import 'package:dde_gesture_manager/widgets/market.dart'; import 'package:dde_gesture_manager/widgets/me.dart'; import 'package:dde_gesture_manager_api/apis.dart'; import 'package:dde_gesture_manager_api/models.dart'; @@ -173,4 +174,27 @@ class Api { Apis.scheme.download(schemeId: schemeId.param), SchemeForDownloadSerializer.fromMap, ); + + static Future marketSchemes( + {required MarketSortType type, required int page, int pageSize = 30}) => + _get( + Apis.scheme.market(type: type.name.param, page: page.param, pageSize: pageSize.param), + MarketSchemeTransMetaDataResp.fromMap, + ); + + static Future?> userLikes() => _get( + Apis.scheme.userLikes, + (e) => (e['list'] as List).cast(), + ); +} + +class MarketSchemeTransMetaDataResp { + bool hasMore; + List items; + + MarketSchemeTransMetaDataResp.fromMap(Map map) + : hasMore = map['hasMore'], + items = (map['items'] as List) + .map((e) => MarketSchemeTransMetaDataSerializer.fromMap(e)) + .toList(); } diff --git a/app/lib/models/scheme_list_refresh_key.dart b/app/lib/models/scheme_list_refresh_key.dart new file mode 100644 index 0000000..1b8d9af --- /dev/null +++ b/app/lib/models/scheme_list_refresh_key.dart @@ -0,0 +1,9 @@ +import 'package:dde_gesture_manager/builder/provider_annotation.dart'; + +@ProviderModel() +class SchemeListRefreshKey { + @ProviderModelProp(nullable: false) + int refreshKey; + + SchemeListRefreshKey() : refreshKey = DateTime.now().millisecondsSinceEpoch; +} diff --git a/app/lib/pages/content.dart b/app/lib/pages/content.dart index 5068b75..abe0d5c 100644 --- a/app/lib/pages/content.dart +++ b/app/lib/pages/content.dart @@ -1,6 +1,7 @@ import 'package:dde_gesture_manager/extensions.dart'; import 'package:dde_gesture_manager/models/content_layout.provider.dart'; import 'package:dde_gesture_manager/models/scheme.provider.dart'; +import 'package:dde_gesture_manager/models/scheme_list_refresh_key.provider.dart'; import 'package:dde_gesture_manager/pages/gesture_editor.dart'; import 'package:dde_gesture_manager/pages/local_manager.dart'; import 'package:dde_gesture_manager/pages/market_or_me.dart'; @@ -36,6 +37,9 @@ class _ContentState extends State { ChangeNotifierProvider( create: (context) => CopiedGesturePropProvider.empty(), ), + ChangeNotifierProvider( + create: (context) => SchemeListRefreshKeyProvider(), + ), ], builder: (context, child) { if (widthChanged && mounted) { diff --git a/app/lib/pages/gesture_editor.dart b/app/lib/pages/gesture_editor.dart index 78a89a1..3ff5710 100644 --- a/app/lib/pages/gesture_editor.dart +++ b/app/lib/pages/gesture_editor.dart @@ -7,6 +7,7 @@ import 'package:dde_gesture_manager/models/content_layout.provider.dart'; import 'package:dde_gesture_manager/models/local_schemes_provider.dart'; import 'package:dde_gesture_manager/models/scheme.dart'; import 'package:dde_gesture_manager/models/scheme.provider.dart'; +import 'package:dde_gesture_manager/models/scheme_list_refresh_key.provider.dart'; import 'package:dde_gesture_manager/models/settings.provider.dart'; import 'package:dde_gesture_manager/pages/content.dart'; import 'package:dde_gesture_manager/utils/helper.dart'; @@ -332,6 +333,9 @@ class GestureEditor extends StatelessWidget { .firstWhere((ele) => ele.scheme.id == schemeProvider.id); localSchemeEntry.scheme.uploaded = true; localSchemeEntry.save(localSchemesProvider); + context + .read() + .setProps(refreshKey: DateTime.now().millisecondsSinceEpoch); } else { Notificator.error(context, title: LocaleKeys.info_upload_failed.tr()); } diff --git a/app/lib/widgets/market.dart b/app/lib/widgets/market.dart index 33886a7..39957d7 100644 --- a/app/lib/widgets/market.dart +++ b/app/lib/widgets/market.dart @@ -1,7 +1,16 @@ +import 'package:auto_size_text/auto_size_text.dart'; +import 'package:cached_network_image/cached_network_image.dart'; import 'package:dde_gesture_manager/constants/constants.dart'; +import 'package:dde_gesture_manager/http/api.dart'; +import 'package:dde_gesture_manager/models/configs.provider.dart'; +import 'package:dde_gesture_manager/models/settings.provider.dart'; import 'package:dde_gesture_manager/widgets/dde_button.dart'; +import 'package:dde_gesture_manager_api/models.dart'; import 'package:flutter/material.dart'; import 'package:dde_gesture_manager/extensions.dart'; +import 'package:markdown_editor_ot/markdown_editor.dart'; +import 'package:numeral/numeral.dart'; +import 'package:collection/collection.dart'; enum MarketSortType { recommend, @@ -18,10 +27,69 @@ class MarketWidget extends StatefulWidget { } class _MarketWidgetState extends State { + List _schemes = []; + bool _hasMore = true; + int _currentPage = 0; MarketSortType _type = MarketSortType.recommend; + String? _selected; + String? _hovering; + int _refreshKey = 0; + List _likedSchemes = []; + + @override + void initState() { + super.initState(); + Api.userLikes().then((value) { + if (mounted && value != null) + setState(() { + _likedSchemes = value; + }); + }); + Api.marketSchemes(type: _type, page: _currentPage).then((value) { + if (mounted && value != null) + setState(() { + _schemes = value.items; + _selected = value.items.isNotEmpty ? value.items.first.uuid : null; + _hasMore = value.hasMore; + }); + }); + } + + Color _getItemBackgroundColor(int index, String? schemeId) { + Color _color = index % 2 == 0 ? context.t.scaffoldBackgroundColor : context.t.backgroundColor; + if (schemeId == _hovering) _color = context.t.dialogBackgroundColor; + if (schemeId == _selected) _color = context.read().currentActiveColor; + return _color; + } + + _refreshList() { + Future.delayed(const Duration(milliseconds: 100), () { + Api.marketSchemes(type: _type, page: 0).then((value) { + if (mounted && value != null) + setState(() { + _schemes = value.items; + _hasMore = value.hasMore; + _selected = value.items.first.uuid; + }); + }); + }); + } + + _getMoreSchemes() { + 'try to fetch page: ${_currentPage + 1}'.sout(); + if (_hasMore) + Api.marketSchemes(type: _type, page: ++_currentPage).then((value) { + if (mounted && value != null) + setState(() { + _schemes.addAll(value.items); + _hasMore = value.hasMore; + }); + }); + } @override Widget build(BuildContext context) { + var currentSelectedScheme = _schemes.firstWhereOrNull((e) => e.uuid == _selected); return Column( mainAxisSize: MainAxisSize.max, mainAxisAlignment: MainAxisAlignment.spaceBetween, @@ -46,6 +114,7 @@ class _MarketWidgetState extends State { onTap: () { setState(() { _type = e; + _refreshList(); }); }, child: Center( @@ -71,7 +140,107 @@ class _MarketWidgetState extends State { borderRadius: BorderRadius.circular(defaultBorderRadius), ), child: Column( - children: [Text('asd')], + children: [ + Flexible( + child: Padding( + padding: EdgeInsets.symmetric(horizontal: 1, vertical: 2), + child: ListView.builder( + itemBuilder: (context, index) { + if (index == _schemes.length - 1) _getMoreSchemes(); + return GestureDetector( + onTap: () { + setState(() { + _selected = _schemes[index].uuid; + }); + }, + child: MouseRegion( + cursor: SystemMouseCursors.click, + onEnter: (_) { + setState(() { + _hovering = _schemes[index].uuid; + }); + }, + child: Container( + color: _getItemBackgroundColor(index, _schemes[index].uuid), + child: Padding( + padding: const EdgeInsets.only(left: 6, right: 12.0), + child: DefaultTextStyle( + style: context.t.textTheme.bodyText2!.copyWith( + color: _selected == _schemes[index].uuid ? Colors.white : null, + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text(_schemes[index].name ?? ''), + Row( + children: [ + SizedBox( + width: 50, + child: Align( + alignment: Alignment.centerRight, + child: AutoSizeText( + '${numeral(_schemes[index].downloads ?? 0, fractionDigits: 1)}' + .padLeft(5), + ), + ), + ), + Icon( + Icons.file_download, + size: 18, + ), + SizedBox( + width: 50, + child: Align( + alignment: Alignment.centerRight, + child: AutoSizeText( + '${numeral(_schemes[index].likes ?? 0, fractionDigits: 1)}'.padLeft(5), + ), + ), + ), + Icon( + _likedSchemes.contains(_schemes[index].id) + ? Icons.thumb_up + : Icons.thumb_up_off_alt, + size: 17), + ] + .map((e) => Padding( + padding: const EdgeInsets.only(right: 3), + child: e, + )) + .toList(), + ), + ], + ), + ), + ), + ), + ), + ); + }, + itemCount: _schemes.length, + ), + ), + ), + Divider(thickness: .5), + Flexible( + child: Padding( + padding: const EdgeInsets.only(left: 8), + child: MdPreview( + text: _schemes.firstWhereOrNull((e) => e.uuid == _selected)?.description ?? '', + widgetImage: (imageUrl) => CachedNetworkImage( + imageUrl: imageUrl, + placeholder: (context, url) => const SizedBox( + width: double.infinity, + height: 300, + child: Center(child: CircularProgressIndicator()), + ), + errorWidget: (context, url, error) => const Icon(Icons.error), + ), + onCodeCopied: () {}, + ), + ), + ), + ], ), ), ), @@ -81,12 +250,35 @@ class _MarketWidgetState extends State { mainAxisAlignment: MainAxisAlignment.end, children: [ DButton.like( - enabled: true, - onTap: () {}, + enabled: context.watch().accessToken.notNull, + onTap: () { + bool liked = _likedSchemes.contains(currentSelectedScheme!.id!); + Api.likeScheme(schemeId: currentSelectedScheme.uuid!, isLike: !liked).then((value) { + if (value) { + setState(() { + if (liked) { + _likedSchemes.remove(currentSelectedScheme.id); + currentSelectedScheme.likes = currentSelectedScheme.likes! - 1; + } else { + _likedSchemes.add(currentSelectedScheme.id!); + currentSelectedScheme.likes = currentSelectedScheme.likes! + 1; + } + }); + } + }); + }, ), DButton.download( enabled: true, - onTap: () {}, + onTap: () { + Api.downloadScheme(schemeId: currentSelectedScheme!.uuid!).then((value) { + /// todo: 下载逻辑 + value.sout(); + setState(() { + currentSelectedScheme.downloads = currentSelectedScheme.downloads! + 1; + }); + }); + }, ), ] .map((e) => Padding( diff --git a/app/lib/widgets/me.dart b/app/lib/widgets/me.dart index 7b63474..3c4054d 100644 --- a/app/lib/widgets/me.dart +++ b/app/lib/widgets/me.dart @@ -5,8 +5,10 @@ import 'package:dde_gesture_manager/constants/constants.dart'; import 'package:dde_gesture_manager/extensions.dart'; import 'package:dde_gesture_manager/http/api.dart'; import 'package:dde_gesture_manager/models/configs.provider.dart'; +import 'package:dde_gesture_manager/models/scheme_list_refresh_key.provider.dart'; import 'package:dde_gesture_manager/models/settings.provider.dart'; import 'package:dde_gesture_manager/utils/notificator.dart'; +import 'package:dde_gesture_manager/utils/simple_throttle.dart'; import 'package:dde_gesture_manager_api/models.dart'; import 'package:flutter/material.dart'; import 'package:flutter_platform_alert/flutter_platform_alert.dart'; @@ -33,6 +35,7 @@ class _MeWidgetState extends State { SchemeListType _type = SchemeListType.uploaded; String? _selected; String? _hovering; + int _refreshKey = 0; @override void initState() { @@ -66,6 +69,12 @@ class _MeWidgetState extends State { @override Widget build(BuildContext context) { + var refreshKey = context.watch().refreshKey; + if (_refreshKey != refreshKey) { + Future.microtask(SimpleThrottle.bind(_refreshList)); + } + _refreshKey = refreshKey; + var currentSelectedScheme = _schemes.firstWhereOrNull((e) => e.uuid == _selected); return Padding( padding: EdgeInsets.only(top: 10), @@ -264,7 +273,9 @@ class _MeWidgetState extends State { Api.likeScheme(schemeId: currentSelectedScheme!.uuid!, isLike: !currentSelectedScheme.liked) .then((value) { if (value) { - _refreshList(); + context + .read() + .setProps(refreshKey: DateTime.now().millisecondsSinceEpoch); } }); }, @@ -273,8 +284,11 @@ class _MeWidgetState extends State { enabled: true, onTap: () { Api.downloadScheme(schemeId: currentSelectedScheme!.uuid!).then((value) { + /// todo: 下载逻辑 value.sout(); - _refreshList(); + context + .read() + .setProps(refreshKey: DateTime.now().millisecondsSinceEpoch); }); }, ),