From cdb545b8cb67c872c65b0f8911fb9f7d2d5986a6 Mon Sep 17 00:00:00 2001 From: chayoosang Date: Sun, 3 Dec 2023 13:01:42 +0900 Subject: [PATCH] =?UTF-8?q?[PDA-44]=20feat:=20=EB=B9=84=ED=92=88=20?= =?UTF-8?q?=EC=83=81=EC=84=B8=20=EC=A1=B0=ED=9A=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- asset/image/cancel.svg | 5 + .../equipment/component/equipment_cell.dart | 377 +++++++++++++++++- 2 files changed, 379 insertions(+), 3 deletions(-) create mode 100644 asset/image/cancel.svg diff --git a/asset/image/cancel.svg b/asset/image/cancel.svg new file mode 100644 index 0000000..03fff08 --- /dev/null +++ b/asset/image/cancel.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/lib/View/equipment/component/equipment_cell.dart b/lib/View/equipment/component/equipment_cell.dart index fcdefa1..75a7462 100644 --- a/lib/View/equipment/component/equipment_cell.dart +++ b/lib/View/equipment/component/equipment_cell.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; import 'package:frontend/Model/model/equipment/equipment_list_model.dart'; -import 'package:frontend/Model/model/notification/notification_response.dart'; +import 'package:frontend/View/colors.dart'; class EquipmentCell extends StatefulWidget { final EquipmentModel equipment; @@ -20,7 +20,10 @@ class _EquipmentCellState extends State { @override Widget build(BuildContext context) { - return equipmentCell(); + return GestureDetector( + onTap: showDetail, + child: equipmentCell(), + ); } Widget equipmentCell() { @@ -52,7 +55,7 @@ class _EquipmentCellState extends State { child: (widget.equipment.imgUrl == null) ? Image.asset('asset/image/pladi_icon.png') : Image.network(widget.equipment.imgUrl!, - fit: BoxFit.fitWidth), + fit: BoxFit.fill), )), Container( margin: const EdgeInsets.only( @@ -171,4 +174,372 @@ class _EquipmentCellState extends State { ], )); } + + void showDetail() { + showModalBottomSheet( + isScrollControlled: true, + context: context, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(15), + ), + builder: (BuildContext context) { + return Container( + width: MediaQuery.of(context).size.width, + height: MediaQuery.of(context).size.height * 0.7, + padding: const EdgeInsets.all(15), + decoration: const BoxDecoration( + borderRadius: BorderRadius.only( + topLeft: Radius.circular(12), topRight: Radius.circular(12)), + color: Colors.white, + ), + child: Column( + children: [ + SizedBox( + width: double.infinity, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + IconButton( + onPressed: didTapCancelButton, + icon: SvgPicture.asset( + 'asset/image/cancel.svg', + width: 15, + height: 15, + )), + Row( + children: [ + TextButton( + onPressed: editEquipment, + child: const Text( + '수정', + style: TextStyle( + color: Color(0xFF640FAF), + fontSize: 12, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w700, + letterSpacing: 0.08, + ), + )), + TextButton( + onPressed: showDeleteSheet, + child: const Text( + '삭제', + style: TextStyle( + color: Color(0xFF640FAF), + fontSize: 12, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w700, + letterSpacing: 0.08, + ), + )) + ], + ) + ], + ), + ), + const SizedBox( + height: 12, + ), + SizedBox( + width: double.infinity, + height: 200, + child: (widget.equipment.imgUrl == null) + ? Image.asset('asset/image/pladi_icon.png') + : Image.network( + widget.equipment.imgUrl!, + fit: BoxFit.fill, + ), + ), + const SizedBox( + height: 14, + ), + Row( + children: [ + const SizedBox( + width: 51, + child: Text( + '카테고리', + style: TextStyle( + color: Color(0xFF717171), + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + ), + ), + ), + const SizedBox( + width: 18, + ), + Text( + widget.equipment.category, + style: const TextStyle( + color: Colors.black, + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + height: 0, + ), + ), + ], + ), + const SizedBox( + height: 12, + ), + Row( + children: [ + const SizedBox( + width: 51, + child: Text( + '비품명', + style: TextStyle( + color: Color(0xFF717171), + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + ), + ), + ), + const SizedBox( + width: 18, + ), + Text( + widget.equipment.name, + style: const TextStyle( + color: Colors.black, + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + height: 0, + ), + ), + ], + ), + const SizedBox( + height: 12, + ), + Row( + children: [ + const SizedBox( + width: 51, + child: Text( + '수량', + style: TextStyle( + color: Color(0xFF717171), + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + ), + ), + ), + const SizedBox( + width: 18, + ), + Text( + widget.equipment.quantity, + style: const TextStyle( + color: Colors.black, + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + height: 0, + ), + ), + ], + ), + const SizedBox( + height: 12, + ), + Row( + children: [ + const SizedBox( + width: 51, + child: Text( + '책임자', + style: TextStyle( + color: Color(0xFF717171), + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + ), + ), + ), + const SizedBox( + width: 18, + ), + Text( + "${widget.equipment.keeper}(${widget.equipment.contact})", + style: const TextStyle( + color: Colors.black, + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + height: 0, + ), + ), + ], + ), + const SizedBox( + height: 12, + ), + Row( + children: [ + const SizedBox( + width: 51, + child: Text( + '보관장소', + style: TextStyle( + color: Color(0xFF717171), + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + ), + ), + ), + const SizedBox( + width: 18, + ), + Text( + widget.equipment.location == null + ? "보관 장소" + : widget.equipment.location!, + style: const TextStyle( + color: Colors.black, + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + height: 0, + ), + ), + ], + ), + const SizedBox( + height: 12, + ), + Row( + children: [ + const SizedBox( + width: 51, + child: Text( + '설명', + style: TextStyle( + color: Color(0xFF717171), + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + ), + ), + ), + const SizedBox( + width: 18, + ), + SizedBox( + width: (MediaQuery.of(context).size.width - 100), + child: Text( + widget.equipment.description == null + ? "설명" + : widget.equipment.description!, + style: const TextStyle( + color: Colors.black, + fontSize: 14, + fontFamily: 'NanumSquare_ac', + fontWeight: FontWeight.w400, + ), + ), + ), + ], + ), + const SizedBox( + height: 12, + ), + ], + ), + ); + }); + } + + void showDeleteSheet() { + showModalBottomSheet( + context: context, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(15), + ), + builder: (BuildContext context) { + return Container( + height: 180, + decoration: const BoxDecoration( + borderRadius: BorderRadius.only( + topLeft: Radius.circular(12), topRight: Radius.circular(12)), + color: Colors.white, + ), + child: Column( + children: [ + const SizedBox( + height: 30, + ), + const Text( + '비품을 삭제하시겠습니까?', + style: TextStyle(fontSize: 16, color: Color(0xFF656565)), + ), + const SizedBox( + height: 30, + ), + Container( + margin: const EdgeInsets.symmetric(horizontal: 10), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: [ + Expanded( + child: ElevatedButton( + onPressed: didTapCancelButton, + style: ElevatedButton.styleFrom( + elevation: 0, + backgroundColor: Colors.white, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(15), + side: const BorderSide( + color: Color(0xFFC9C9C9)))), + child: const Text( + '취소', + style: TextStyle( + fontSize: 14, color: Color(0xFF717171)), + ), + ), + ), + const SizedBox( + width: 10, + ), + Expanded( + child: ElevatedButton( + onPressed: deleteEquipment, + style: ElevatedButton.styleFrom( + elevation: 0, + backgroundColor: purple, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(15), + )), + child: const Text( + '확인', + style: TextStyle(fontSize: 14, color: Colors.white), + ), + ), + ), + ], + ), + ) + ], + ), + ); + }); + } + + void didTapCancelButton() { + Navigator.of(context).pop(); + } + + void editEquipment() {} + + void deleteEquipment() { + Navigator.of(context).pop(); + Navigator.of(context).pop(); + } }