Создание карточки в коллекции + экран поиска коллекции

This commit is contained in:
2025-04-02 21:40:31 +03:00
parent fb7ff84087
commit 17dff72655
36 changed files with 2495 additions and 277 deletions

View File

@@ -13,7 +13,7 @@ import 'package:remever/components/extensions/context.dart';
import 'package:remever/database/database.dart';
import 'package:remever/gen/assets.gen.dart';
import 'package:remever/inject.dart';
import 'package:remever/screens/collections/widgets/learning_card.dart';
import 'package:remever/screens/collections/widgets/ticket_card.dart';
import 'package:remever/screens/dialogs/info_dialog.dart';
import 'package:remever/services/tickets/tickets_interface.dart';
import 'package:remever/widgets/primary_button.dart';
@@ -104,8 +104,8 @@ class CollectionDetailScreen extends StatelessWidget {
color: AppColors.disabled,
),
const WSpace(2),
StreamBuilder<List<Collection>>(
stream: getIt<TicketsInterface>().watchTicketsList(),
StreamBuilder<List<Ticket>>(
stream: getIt<TicketsInterface>().watchTicketsList(collection.id),
builder: (context, snapshot) {
return _buildCount(snapshot.data?.length ?? 0);
},
@@ -210,7 +210,7 @@ class CollectionDetailScreen extends StatelessWidget {
physics: BouncingScrollPhysics(),
itemCount: 10,
itemBuilder:
(BuildContext context, int index) => LearningCard(index: index),
(BuildContext context, int index) => TicketCard(index: index),
);
}
}

View File

@@ -0,0 +1,273 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:remever/common/resources.dart';
import 'package:remever/common/utils.dart';
import 'package:remever/common/widgets/loose_focus.dart';
import 'package:remever/common/widgets/typography.dart';
import 'package:remever/common/widgets/w_if.dart';
import 'package:remever/common/widgets/wspace.dart';
import 'package:remever/components/extensions/context.dart';
import 'package:remever/components/extensions/state.dart';
import 'package:remever/database/database.dart';
import 'package:remever/gen/assets.gen.dart';
import 'package:remever/inject.dart';
import 'package:remever/router.gr.dart';
import 'package:remever/screens/collections/collections_screen.dart';
import 'package:remever/screens/collections/widgets/collection_progress_bar.dart';
import 'package:remever/services/collection/collections_interface.dart';
@RoutePage()
class CollectionSearchScreen extends StatefulWidget {
const CollectionSearchScreen({super.key, required this.onCollectionSelect});
final void Function(Collection) onCollectionSelect;
@override
State<CollectionSearchScreen> createState() => _CollectionSearchScreenState();
}
class _CollectionSearchScreenState extends State<CollectionSearchScreen> {
final TextEditingController _searchController = TextEditingController();
String? _search;
@override
void initState() {
_searchController.addListener(() {
safeSetState(() {
_search = _searchController.text;
});
});
super.initState();
}
@override
void dispose() {
_searchController.dispose();
super.dispose();
}
void _onCreateTap() {
context.pushRoute(CrudCollectionRoute());
}
@override
Widget build(BuildContext context) {
return LooseFocus(
child: Scaffold(
backgroundColor: AppColors.bg,
appBar: _buildAppBar(context),
body: _buildBody(context),
),
);
}
AppBar _buildAppBar(BuildContext context) {
return AppBar(
toolbarHeight: 66.h,
backgroundColor: AppColors.white,
shadowColor: Colors.transparent,
title: SizedBox(
height: 48.h,
child: DecoratedBox(
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(12).r,
border: Border.all(color: AppColors.bg),
),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 12).r,
child: Center(
child: TextField(
autofocus: true,
controller: _searchController,
textCapitalization: TextCapitalization.sentences,
maxLines: 1,
cursorColor: AppColors.danger,
decoration: const InputDecoration.collapsed(
hintText: 'Поиск',
hintStyle: TextStyle(color: AppColors.gray),
),
),
),
),
),
),
centerTitle: true,
leading: IconButton(
onPressed: () async {
context.back();
},
icon: const Icon(CupertinoIcons.left_chevron, color: Colors.black),
),
);
}
Widget _buildBody(BuildContext context) {
return Column(
children: [
_buildCreateButton(),
Expanded(
child: StreamBuilder<List<Collection>>(
stream: getIt<CollectionsInterface>().watchCollectionsList(
search: _search,
),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const LoadingList();
}
if (snapshot.hasError) {
return const ErrorList();
}
final collections = snapshot.data;
if (collections == null || collections.isEmpty) {
return const EmptyList();
}
return ListView.builder(
itemCount: collections.length,
padding: const EdgeInsets.symmetric(horizontal: 16).r,
itemBuilder:
(context, index) => Padding(
padding: const EdgeInsets.only(bottom: 8).r,
child: GestureDetector(
onTap: () {
widget.onCollectionSelect(collections[index]);
context.back();
},
child: _Collection(collection: collections[index]),
),
),
);
},
),
),
],
);
}
Padding _buildCreateButton() {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 28).r,
child: GestureDetector(
onTap: () => _onCreateTap(),
child: Row(
children: [
SizedBox.square(
dimension: 20.r,
child: DecoratedBox(
decoration: BoxDecoration(
color: AppColors.white,
shape: BoxShape.circle,
),
child: Center(
child: Icon(Icons.add, color: AppColors.disabled, size: 15.r),
),
),
),
WSpace(4),
AppTypography('Создать новую коллекцию', type: Regular16px()),
],
),
),
);
}
}
class _Collection extends StatelessWidget {
const _Collection({required this.collection});
final Collection collection;
@override
Widget build(BuildContext context) {
return Container(
constraints: BoxConstraints(minHeight: 66.h, maxHeight: 84.h),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12).r,
color: AppColors.white,
),
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8).r,
child: Row(
children: <Widget>[_buildAvatar(), const WSpace(5), _buildInfo()],
),
);
}
///
/// Построение основной информации
///
Widget _buildInfo() {
return SizedBox(
width: 230.w,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
_buildTitle(),
const HSpace(4),
Row(
children: <Widget>[
Assets.icons.typeCards.image(
height: 18.h,
width: 18.w,
color: AppColors.disabled,
),
const WSpace(2),
AppTypography(
'${collection.likesCount.toString()} ${Utils.declOfNum(collection.likesCount, ['карточек', 'карточки', 'карточек'])}',
type: Regular14px(),
color: AppColors.disabled,
),
],
),
const HSpace(6),
const CollectionProgressBar(),
],
),
);
}
///
/// Название коллекции
///
Widget _buildTitle() {
return AppTypography(
collection.title,
type: Medium16px(),
maxLines: 2,
softWrap: true,
);
}
///
/// Обложка коллекции
///
Widget _buildAvatar() {
return SizedBox.square(
dimension: 50.r,
child: DecoratedBox(
decoration: BoxDecoration(shape: BoxShape.circle, color: AppColors.bg),
child: Wif(
condition: collection.image != null,
builder:
(context) => ClipOval(
child: Image.memory(collection.image!, fit: BoxFit.cover),
),
fallback:
(context) => Center(
child: AppTypography(
collection.title.substring(0, 1),
type: Bold34px(),
),
),
),
),
);
}
}

View File

@@ -83,16 +83,16 @@ class _CollectionScreenState extends State<CollectionScreen> {
stream: getIt<CollectionsInterface>().watchCollectionsList(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const _LoadingList();
return const LoadingList();
}
if (snapshot.hasError) {
return const _ErrorList();
return const ErrorList();
}
final collections = snapshot.data;
if (collections == null || collections.isEmpty) {
return const _EmptyList();
return const EmptyList();
}
return ListView.builder(
@@ -113,8 +113,8 @@ class _CollectionScreenState extends State<CollectionScreen> {
}
}
class _LoadingList extends StatelessWidget {
const _LoadingList();
class LoadingList extends StatelessWidget {
const LoadingList({super.key});
@override
Widget build(BuildContext context) {
@@ -125,8 +125,8 @@ class _LoadingList extends StatelessWidget {
}
}
class _ErrorList extends StatelessWidget {
const _ErrorList();
class ErrorList extends StatelessWidget {
const ErrorList({super.key});
@override
Widget build(BuildContext context) {
@@ -139,8 +139,8 @@ class _ErrorList extends StatelessWidget {
}
}
class _EmptyList extends StatelessWidget {
const _EmptyList();
class EmptyList extends StatelessWidget {
const EmptyList({super.key});
@override
Widget build(BuildContext context) {

View File

@@ -14,8 +14,8 @@ import 'package:remever/screens/dialogs/replace_diaog.dart';
enum CardType { CREATE, SHOW }
class LearningCard extends StatelessWidget {
LearningCard({
class TicketCard extends StatelessWidget {
TicketCard({
required this.index,
super.key,
this.type = CardType.SHOW,

View File

@@ -1,22 +1,91 @@
import 'dart:io';
import 'dart:math';
import 'package:auto_route/auto_route.dart';
import 'package:file_picker/file_picker.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:remever/common/functions.dart';
import 'package:remever/common/resources.dart';
import 'package:remever/common/utils.dart';
import 'package:remever/common/widgets/typography.dart';
import 'package:remever/common/widgets/w_if.dart';
import 'package:remever/common/widgets/wspace.dart';
import 'package:remever/components/extensions/context.dart';
import 'package:remever/components/extensions/state.dart';
import 'package:remever/gen/assets.gen.dart';
import 'package:remever/inject.dart';
import 'package:remever/models/create_ticket_dto.dart';
import 'package:remever/router.gr.dart';
import 'package:remever/screens/collections/widgets/collection_progress_bar.dart';
import 'package:remever/screens/collections/widgets/learning_card.dart';
import 'package:remever/screens/create_card/widgets/crud_ticket.dart';
import 'package:remever/services/tickets/tickets_interface.dart';
import 'package:remever/widgets/debug/app_debug.dart';
import 'package:remever/widgets/primary_button.dart';
@RoutePage()
class CreateScreen extends StatelessWidget {
class CreateScreen extends StatefulWidget {
const CreateScreen({super.key});
@override
State<CreateScreen> createState() => _CreateScreenState();
}
class _CreateScreenState extends State<CreateScreen> {
CreateTicketDto _dto = CreateTicketDto();
void _pickImage(bool isQuestion) async {
final result = await FilePicker.platform.pickFiles();
if (result == null || result.files.isEmpty) {
showErrorToast('Файл не выбран');
return;
}
final filePath = result.files.single.path;
if (filePath == null) {
showErrorToast('Не удалось получить путь к файлу');
return;
}
final file = File(filePath);
final bytes = await file.readAsBytes();
_dto =
isQuestion
? _dto.copyWith(questionImage: bytes)
: _dto.copyWith(answerImage: bytes);
safeSetState(() {});
}
void _onCollectionTap() {
{
context.pushRoute(
CollectionSearchRoute(
onCollectionSelect: (collection) {
safeSetState(() => _dto = _dto.copyWith(collection: collection));
},
),
);
}
}
void _onCreateTap() async {
if (_dto.collection == null ||
_dto.answer == null ||
_dto.question == null) {
showErrorToast('Необходимо заполнить все поля');
return;
}
await getIt<TicketsInterface>().createTicket(_dto);
context.pushRoute(CollectionRoute());
}
@override
Widget build(BuildContext context) {
return Scaffold(
@@ -59,42 +128,55 @@ class CreateScreen extends StatelessWidget {
const HSpace(16),
AppTypography('Вопрос', type: Medium16px()),
const HSpace(4),
LearningCard(
index: 0,
type: CardType.CREATE,
CrudTicket(
onTextTap: () {
context.pushRoute(
CrudCollectionFullscreenField(
title: 'Вопрос',
hint: '',
height: 313,
onEditingComplete: (p0) {},
content: _dto.question,
onEditingComplete: (res) {
safeSetState(() {
_dto = _dto.copyWith(question: res);
});
},
),
);
},
onImageTap: () => _pickImage(true),
isQuestion: true,
dto: _dto,
),
const HSpace(16),
AppTypography('Ответ', type: Medium16px()),
LearningCard(
index: 1,
type: CardType.CREATE,
const HSpace(4),
CrudTicket(
onTextTap: () {
context.pushRoute(
CrudCollectionFullscreenField(
title: 'Ответ',
hint: '',
height: 313,
onEditingComplete: (p0) {},
content: _dto.answer,
onEditingComplete: (res) {
safeSetState(() {
_dto = _dto.copyWith(answer: res);
});
},
),
);
},
onImageTap: () => _pickImage(false),
isQuestion: false,
dto: _dto,
),
revertCard(),
],
),
),
),
_createBtn(),
_buildCreateButton(),
const HSpace(31),
],
),
@@ -124,8 +206,12 @@ class CreateScreen extends StatelessWidget {
fit: BoxFit.contain,
child: CupertinoSwitch(
activeTrackColor: AppColors.primary,
value: false,
onChanged: (bool value) {},
value: _dto.needRevert ?? false,
onChanged: (bool value) {
safeSetState(() {
_dto = _dto.copyWith(needRevert: value);
});
},
),
),
),
@@ -134,17 +220,22 @@ class CreateScreen extends StatelessWidget {
);
}
Row _filters() {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
_buildFilterButton(AppColors.gray_bg, 'Запомнить', () {}),
_buildFilterButton(AppColors.white, 'Держать в фокусе', () {}),
],
Widget _filters() {
return AppDebug(
builder: (context, isDebug) {
if (!isDebug) return SizedBox();
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
_buildFilterButton(AppColors.gray_bg, 'Запомнить', () {}),
_buildFilterButton(AppColors.white, 'Держать в фокусе', () {}),
],
);
},
);
}
Widget _createBtn() {
Widget _buildCreateButton() {
return PrimaryButton(
color: AppColors.primary,
child: AppTypography(
@@ -152,7 +243,7 @@ class CreateScreen extends StatelessWidget {
type: Medium14px(),
color: AppColors.white,
),
onTap: () {},
onTap: () => _onCreateTap(),
);
}
@@ -176,7 +267,7 @@ class CreateScreen extends StatelessWidget {
Widget _buildCollection(BuildContext context) {
return GestureDetector(
onTap: () {},
onTap: () => _onCollectionTap(),
child: Container(
constraints: BoxConstraints(minHeight: 66.h, maxHeight: 84.h),
decoration: BoxDecoration(
@@ -184,8 +275,21 @@ class CreateScreen extends StatelessWidget {
color: AppColors.white,
),
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8).r,
child: Row(
children: <Widget>[_buildAvatar(), const WSpace(5), _buildInfo()],
child: Wif(
condition: _dto.collection != null,
builder: (context) {
return Row(
children: <Widget>[_buildAvatar(), const WSpace(5), _buildInfo()],
);
},
fallback: (context) {
return Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
AppTypography('Выберите коллекцию ', type: Bold14px()),
],
);
},
),
),
);
@@ -212,7 +316,7 @@ class CreateScreen extends StatelessWidget {
),
const WSpace(2),
AppTypography(
Random().nextInt(654).toString(),
'${_dto.collection!.likesCount.toString()} ${Utils.declOfNum(_dto.collection!.likesCount, ['карточек', 'карточки', 'карточек'])}',
type: Regular14px(),
color: AppColors.disabled,
),
@@ -230,7 +334,7 @@ class CreateScreen extends StatelessWidget {
///
Widget _buildTitle() {
return AppTypography(
'Астрономия',
_dto.collection!.title,
type: Medium16px(),
maxLines: 2,
softWrap: true,
@@ -244,9 +348,21 @@ class CreateScreen extends StatelessWidget {
return SizedBox.square(
dimension: 50.r,
child: DecoratedBox(
decoration: BoxDecoration(
shape: BoxShape.circle,
image: DecorationImage(image: Assets.images.img.provider()),
decoration: BoxDecoration(shape: BoxShape.circle, color: AppColors.bg),
child: Wif(
condition: _dto.collection?.image != null,
builder:
(context) => ClipOval(
child: Image.memory(_dto.collection!.image!, fit: BoxFit.cover),
),
fallback:
(context) => Center(
child: AppTypography(
_dto.collection!.title.substring(0, 1),
type: Bold34px(),
),
),
),
),
);

View File

@@ -0,0 +1,140 @@
import 'package:flutter/material.dart';
import 'package:readmore/readmore.dart';
import 'package:remever/common/resources.dart';
import 'package:remever/common/typography.dart';
import 'package:remever/common/widgets/w_if.dart';
import 'package:remever/components/extensions/context.dart';
import 'package:remever/gen/assets.gen.dart';
import 'package:remever/models/create_ticket_dto.dart';
class CrudTicket extends StatelessWidget {
CrudTicket({
super.key,
this.onTextTap,
this.onImageTap,
required this.isQuestion,
required this.dto,
});
void Function()? onTextTap;
void Function()? onImageTap;
final bool isQuestion;
final CreateTicketDto dto;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTextTap,
child: Container(
width: double.infinity,
decoration: BoxDecoration(
borderRadius: const BorderRadius.all(Radius.circular(12)).r,
color: Colors.white,
),
constraints: BoxConstraints(minHeight: 50.h),
child: Stack(
children: <Widget>[
SizedBox(
height: 50.h,
width: double.infinity,
child: DecoratedBox(decoration: getDecoration()),
),
Padding(
padding: const EdgeInsets.all(12).r,
child: Column(
children: <Widget>[
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[_buildImage(), _buildText(context)],
),
],
),
),
],
),
),
);
}
Widget _buildText(BuildContext context) {
return SizedBox(
width: 228.w,
child: ReadMoreText(
isQuestion
? dto.question ?? 'Ввести текст вопроса'
: dto.answer ?? 'Ввести текст ответа',
isExpandable: true,
trimMode: TrimMode.Line,
trimLines: 3,
trimCollapsedText: '\nРазвернуть',
trimExpandedText: '\nСвернуть',
style: Regular16px().style,
moreStyle: Regular12px().style.copyWith(color: AppColors.primary_blue),
lessStyle: Regular12px().style.copyWith(color: AppColors.primary_blue),
),
);
}
/// Картинка
Widget _buildImage() {
return GestureDetector(
onTap: onImageTap,
child: Padding(
padding: const EdgeInsets.only(right: 8).r,
child: SizedBox.square(
dimension: 64.r,
child: DecoratedBox(
decoration: BoxDecoration(
borderRadius: const BorderRadius.all(Radius.circular(8)).r,
gradient: const LinearGradient(
colors: <Color>[Color(0xFFDBD7F4), Color(0xFFB6AAFE)],
begin: Alignment.topRight,
end: Alignment.bottomLeft,
),
),
child: Wif(
condition:
isQuestion
? dto.questionImage != null
: dto.answerImage != null,
builder: (context) {
return ClipRRect(
borderRadius: const BorderRadius.all(Radius.circular(8)).r,
child: Image.memory(
isQuestion ? dto.questionImage! : dto.answerImage!,
fit: BoxFit.cover,
),
);
},
fallback: (context) {
return Center(
child: Assets.icons.typePhoto.image(
height: 24.h,
width: 24.w,
color: AppColors.primary,
),
);
},
),
),
),
),
);
}
/// Декорирование контейнера
BoxDecoration getDecoration() {
return BoxDecoration(
borderRadius: const BorderRadius.all(Radius.circular(12)).r,
gradient: LinearGradient(
colors: <Color>[
isQuestion ? AppColors.question : AppColors.answer,
Colors.white,
],
begin: Alignment.topLeft,
end: const Alignment(-0.6, 1),
stops: const <double>[0.25, 0.25],
),
);
}
}

View File

@@ -15,7 +15,7 @@ import 'package:remever/components/extensions/context.dart';
import 'package:remever/database/database.dart';
import 'package:remever/gen/assets.gen.dart';
import 'package:remever/inject.dart';
import 'package:remever/models/collection_dto.dart';
import 'package:remever/models/crud_collection_dto.dart';
import 'package:remever/router.gr.dart';
import 'package:remever/screens/crud_collection/widgets/crud_collection_field.dart';
import 'package:remever/screens/dialogs/alert_dialog.dart';
@@ -39,7 +39,7 @@ class _CrudCollectionScreenState extends State<CrudCollectionScreen> {
/// Флаг публичности коллекции
bool _isPublic = false;
CollectionDto? _collection;
CrudCollectionDto? _collection;
/// Смена публичности
void _setPublic(bool public) {
@@ -49,7 +49,7 @@ class _CrudCollectionScreenState extends State<CrudCollectionScreen> {
@override
void initState() {
_collection = CollectionDto(
_collection = CrudCollectionDto(
desc: widget.editedCollection?.desc ?? '',
title: widget.editedCollection?.title ?? '',
isPublic: widget.editedCollection?.isPublic ?? false,