You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
654 lines
21 KiB
654 lines
21 KiB
import 'package:flutter/material.dart';
|
|
import 'package:supplier_new/common/settings.dart';
|
|
import 'package:supplier_new/financials/add_transactions.dart';
|
|
import 'package:supplier_new/financials/building_transactions_details.dart';
|
|
import 'package:supplier_new/financials/create_credit_accounts.dart';
|
|
|
|
|
|
class FinancialMainScreen extends StatefulWidget {
|
|
const FinancialMainScreen({super.key});
|
|
|
|
@override
|
|
State<FinancialMainScreen> createState() => _FinancialMainScreenState();
|
|
}
|
|
|
|
Color _amountColor(Map<String, dynamic> txn) {
|
|
if ((txn["status"] ?? "").toString().toLowerCase() == "failed") {
|
|
return const Color(0xFF9F9F9F); // gray
|
|
}
|
|
|
|
final amt = (txn["amount"] ?? "").toString().trim();
|
|
if (amt.startsWith('+')) return const Color(0xFF0A9E04); // green
|
|
if (amt.startsWith('-')) return const Color(0xFFE2483D); // red
|
|
return const Color(0xFF2D2E30); // default/dark text
|
|
}
|
|
class _FinancialMainScreenState extends State<FinancialMainScreen>
|
|
with SingleTickerProviderStateMixin {
|
|
late TabController _tabController;
|
|
|
|
final transactions = [
|
|
{
|
|
"name": "My Home Bhooja",
|
|
"date": "21 August",
|
|
"amount": "+ ₹2,580",
|
|
"color": Colors.green,
|
|
"status": "success",
|
|
},
|
|
{
|
|
"name": "Ramakrishna",
|
|
"date": "20 August",
|
|
"amount": "- ₹748",
|
|
"color": Colors.red,
|
|
"status": "success",
|
|
},
|
|
{
|
|
"name": "Malleshan Water Supplies",
|
|
"date": "21 August",
|
|
"amount": "- ₹10,000",
|
|
"color": Colors.red,
|
|
"status": "success",
|
|
},
|
|
{
|
|
"name": "My Home Bhooja",
|
|
"date": "21 August",
|
|
"amount": "+ ₹2,580",
|
|
"color": Colors.grey,
|
|
"status": "failed",
|
|
},
|
|
{
|
|
"name": "My Home Bhooja",
|
|
"date": "21 August",
|
|
"amount": "+ ₹2,580",
|
|
"color": Colors.green,
|
|
"status": "success",
|
|
},
|
|
];
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_tabController = TabController(length: 2, vsync: this);
|
|
_tabController.addListener(() {
|
|
setState(() {}); // rebuilds FAB visibility when tab changes
|
|
});
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_tabController.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
Widget fab() {
|
|
final index = _tabController.index;
|
|
|
|
if (index == 0) {
|
|
return SizedBox(
|
|
width: 52,
|
|
height: 52,
|
|
child: FloatingActionButton(
|
|
shape: const CircleBorder(),
|
|
backgroundColor: Colors.black,
|
|
onPressed: _onFabPressed,
|
|
child: Image.asset(
|
|
"images/plus.png",
|
|
width: 20,
|
|
height: 20,
|
|
color: Colors.white,
|
|
),
|
|
),
|
|
);
|
|
} else {
|
|
return Container();
|
|
}
|
|
}
|
|
|
|
void _onFabPressed() {
|
|
final index = _tabController.index;
|
|
|
|
if (index == 0) {
|
|
// Tab 1 → Navigate to Create Account
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => AddTransactionScreen(),
|
|
),
|
|
);
|
|
} else if (index == 1) {
|
|
// Tab 2 → Navigate to Transactions
|
|
/*Navigator.push(
|
|
context,
|
|
MaterialPageRoute(builder: (_) => const TransactionsPage()),
|
|
);*/
|
|
}
|
|
}
|
|
|
|
|
|
Widget Transactions() {
|
|
return Container(
|
|
color: Color(0XFFFFFFFF),
|
|
child: Column(
|
|
children: [
|
|
// Filters row
|
|
SingleChildScrollView(
|
|
scrollDirection: Axis.horizontal,
|
|
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
|
child: Row(
|
|
children: [
|
|
_buildFilterChip("Status"),
|
|
_buildFilterChip("Payment Method"),
|
|
_buildFilterChip("Date"),
|
|
_buildFilterChip("Amount"),
|
|
],
|
|
),
|
|
),
|
|
|
|
Expanded(
|
|
child: ListView.builder(
|
|
padding: EdgeInsets.zero,
|
|
itemCount: transactions.length,
|
|
itemBuilder: (context, index) {
|
|
final txn = transactions[index];
|
|
|
|
return ListTile(
|
|
dense: true, //
|
|
minVerticalPadding: 0,
|
|
visualDensity: const VisualDensity(vertical: 0, horizontal: 0), // ✅ tighter
|
|
contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 0), // ✅ no extra top/bottom
|
|
horizontalTitleGap: 8,
|
|
minLeadingWidth: 40,
|
|
leading: const CircleAvatar(
|
|
radius: 18,
|
|
backgroundColor: Colors.blue,
|
|
child: Icon(Icons.person, color: Colors.white, size: 18),
|
|
),
|
|
title: Text(
|
|
txn["name"].toString(),
|
|
style: fontTextStyle(14, Color(0xFF2D2E30), FontWeight.w500)
|
|
.copyWith(height: 1.1), // ✅ tighter line height
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
subtitle: Text(
|
|
txn["date"].toString(),
|
|
style: fontTextStyle(12, Color(0xFF939495), FontWeight.w400)
|
|
.copyWith(height: 1.0), // ✅ tighter line height
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
|
|
trailing: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.end,
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Text(
|
|
txn["amount"].toString(),
|
|
style: fontTextStyle(12, _amountColor(txn), FontWeight.w600),
|
|
),
|
|
if ((txn["status"] ?? "").toString().toLowerCase() == "failed")
|
|
Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
const Icon(Icons.error, color: Color(0xFF9F9F9F), size: 14), // gray
|
|
const SizedBox(width: 4),
|
|
Text(
|
|
"Failed",
|
|
style: fontTextStyle(10, const Color(0xFF9F9F9F), FontWeight.w400),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
|
|
);
|
|
},
|
|
),
|
|
)
|
|
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget CreditAccounts() {
|
|
return SingleChildScrollView(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Column(
|
|
children: [
|
|
// Account Summary
|
|
|
|
Align(
|
|
alignment: Alignment.centerRight, // aligns button to the right
|
|
child: OutlinedButton(
|
|
style: OutlinedButton.styleFrom(
|
|
foregroundColor: Color(0xFFFFFFFF),
|
|
backgroundColor: Color(0xFF000000),
|
|
side: BorderSide(color: Color(0xFF000000)),
|
|
padding: EdgeInsets.symmetric(
|
|
vertical: 10, horizontal: 16), // padding around content
|
|
),
|
|
onPressed: () {
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => CreateCreditAccountScreen(),
|
|
),
|
|
);
|
|
},
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
// shrink button to fit content
|
|
children: [
|
|
Image.asset('images/plus.png', height: 20, width: 20),
|
|
SizedBox(width: 4),
|
|
Text(
|
|
"Create Account",
|
|
style: fontTextStyle(
|
|
14, const Color(0xFFFFFFFF), FontWeight.w400),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
|
|
Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(16),
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
const Expanded(
|
|
child: Text(
|
|
"Account Summary",
|
|
style: TextStyle(
|
|
fontSize: 16, fontWeight: FontWeight.w600),
|
|
),
|
|
),
|
|
Column(
|
|
children: const [
|
|
Text(
|
|
"05",
|
|
style: TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.blue),
|
|
),
|
|
SizedBox(height: 2),
|
|
Text(
|
|
"4 active, 1 overdue",
|
|
style: TextStyle(
|
|
fontSize: 12,
|
|
color: Colors.grey,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 16),
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(12),
|
|
color: const Color(0xfffafafa),
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: const [
|
|
Text(
|
|
"Receivable Balance",
|
|
style: TextStyle(
|
|
fontSize: 12, color: Colors.black54),
|
|
),
|
|
SizedBox(height: 4),
|
|
Text(
|
|
"₹24,000",
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.red),
|
|
),
|
|
Text(
|
|
"40.6% of total credit",
|
|
style: TextStyle(
|
|
fontSize: 11, color: Colors.grey),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(width: 12),
|
|
Expanded(
|
|
child: Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(12),
|
|
color: const Color(0xfffafafa),
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: const [
|
|
Text(
|
|
"Advance Balance",
|
|
style: TextStyle(
|
|
fontSize: 12, color: Colors.black54),
|
|
),
|
|
SizedBox(height: 4),
|
|
Text(
|
|
"₹24,000",
|
|
style: TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.green),
|
|
),
|
|
Text(
|
|
"60.4% of total credit",
|
|
style: TextStyle(
|
|
fontSize: 11, color: Colors.grey),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(height: 20),
|
|
|
|
// Search Bar
|
|
Container(
|
|
padding:
|
|
const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(12),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
const Icon(Icons.search, color: Colors.grey),
|
|
const SizedBox(width: 8),
|
|
const Expanded(
|
|
child: TextField(
|
|
decoration: InputDecoration(
|
|
hintText: "Search",
|
|
border: InputBorder.none,
|
|
),
|
|
),
|
|
),
|
|
IconButton(
|
|
onPressed: () {},
|
|
icon: const Icon(Icons.sort, color: Colors.grey),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(height: 20),
|
|
|
|
// Accounts List
|
|
_accountTile(
|
|
name: "SVG Towers",
|
|
status: "active",
|
|
orders: "48 orders",
|
|
balance: "₹10,000",
|
|
credit: "₹10,000",
|
|
lastPayment: "₹5,000 | 12 Aug",
|
|
balanceColor: Colors.red,
|
|
creditColor: Colors.green,
|
|
),
|
|
_accountTile(
|
|
name: "Canvas Creations",
|
|
status: "active",
|
|
orders: "32 orders",
|
|
balance: "₹7,500",
|
|
credit: "₹7,500",
|
|
lastPayment: "₹3,000 | 5 Aug",
|
|
balanceColor: Colors.red,
|
|
creditColor: Colors.green,
|
|
),
|
|
_accountTile(
|
|
name: "Digital Designs",
|
|
status: "inactive",
|
|
orders: "15 orders",
|
|
balance: "₹2,000",
|
|
credit: "₹2,000",
|
|
lastPayment: "₹1,000 | 1 Aug",
|
|
balanceColor: Colors.red,
|
|
creditColor: Colors.green,
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _accountTile({
|
|
required String name,
|
|
required String status,
|
|
required String orders,
|
|
required String balance,
|
|
required String credit,
|
|
required String lastPayment,
|
|
required Color balanceColor,
|
|
required Color creditColor,
|
|
}) {
|
|
return GestureDetector(
|
|
onTap: () {
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => BuildingTransactionsDetails(),
|
|
),
|
|
);
|
|
},
|
|
child: Container(
|
|
margin: const EdgeInsets.only(bottom: 12),
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(16),
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
// Name + Status
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: Text(
|
|
name,
|
|
style: const TextStyle(
|
|
fontSize: 16, fontWeight: FontWeight.bold),
|
|
),
|
|
),
|
|
Container(
|
|
padding:
|
|
const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
|
decoration: BoxDecoration(
|
|
color: status == "active"
|
|
? Colors.green.withOpacity(0.1)
|
|
: Colors.red.withOpacity(0.1),
|
|
borderRadius: BorderRadius.circular(12),
|
|
),
|
|
child: Text(
|
|
status,
|
|
style: TextStyle(
|
|
color:
|
|
status == "active" ? Colors.green : Colors.redAccent,
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
)
|
|
],
|
|
),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
orders,
|
|
style: const TextStyle(color: Colors.grey, fontSize: 12),
|
|
),
|
|
const SizedBox(height: 12),
|
|
|
|
// Balance - Credit - Last Payment
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text("Available Balance",
|
|
style: TextStyle(fontSize: 12, color: Colors.black54)),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
balance,
|
|
style: TextStyle(fontSize: 14,
|
|
fontWeight: FontWeight.bold,
|
|
color: balanceColor),
|
|
),
|
|
],
|
|
),
|
|
Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text("Available Credit",
|
|
style: TextStyle(
|
|
fontSize: 12, color: Colors.black54)),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
credit,
|
|
style: TextStyle(fontSize: 14,
|
|
fontWeight: FontWeight.bold,
|
|
color: creditColor),
|
|
),
|
|
],
|
|
),
|
|
Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text("Last Payment",
|
|
style: TextStyle(fontSize: 12, color: Colors.black54)),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
lastPayment,
|
|
style: fontTextStyle(
|
|
12, Color(0XFFF1F1F1), FontWeight.w500),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
)
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: AppBar(
|
|
elevation: 0,
|
|
backgroundColor: Colors.white,
|
|
bottom: PreferredSize(
|
|
preferredSize: const Size.fromHeight(0.0),
|
|
child: Container(
|
|
height: 38,
|
|
margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
|
child: AnimatedBuilder(
|
|
animation: _tabController,
|
|
builder: (context, _) {
|
|
return TabBar(
|
|
controller: _tabController,
|
|
indicatorColor: Colors.transparent,
|
|
// remove underline
|
|
dividerColor: Colors.transparent,
|
|
isScrollable: false,
|
|
overlayColor: MaterialStateProperty.all(Colors.transparent),
|
|
// equal width
|
|
tabs: List.generate(2, (index) {
|
|
final labels = ['Transactions', 'Credit Accounts'];
|
|
final isSelected = _tabController.index == index;
|
|
|
|
return Container(
|
|
decoration: BoxDecoration(
|
|
color: isSelected ? const Color(0XFFF1F1F1) : Colors
|
|
.transparent,
|
|
borderRadius: BorderRadius.circular(27),
|
|
),
|
|
alignment: Alignment.center,
|
|
child: Text(
|
|
labels[index],
|
|
style: fontTextStyle(
|
|
12, Color(0XFF000000), FontWeight.w600,
|
|
),
|
|
),
|
|
);
|
|
}),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
),
|
|
),
|
|
body: TabBarView(
|
|
controller: _tabController,
|
|
children: [
|
|
// Tab 1: Transactions
|
|
Transactions(),
|
|
|
|
// Tab 2: Credit Accounts
|
|
CreditAccounts()
|
|
],
|
|
),
|
|
|
|
|
|
floatingActionButton: _tabController.index == 0 ? fab() : null,
|
|
);
|
|
}
|
|
|
|
Widget _buildFilterChip(String text) {
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 4),
|
|
child: FilterChip(
|
|
label: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Text(
|
|
text,
|
|
style: const TextStyle(
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.w500,
|
|
color: Colors.black,
|
|
),
|
|
),
|
|
const SizedBox(width: 4),
|
|
const Icon(
|
|
Icons.keyboard_arrow_down, // ⬇️ Down arrow
|
|
size: 18,
|
|
color: Colors.black,
|
|
),
|
|
],
|
|
),
|
|
backgroundColor: Colors.white,
|
|
selectedColor: const Color(0XFFF1F1F1),
|
|
side: const BorderSide(color: Color(0XFF444444)),
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(16),
|
|
),
|
|
onSelected: (val) {
|
|
},
|
|
),
|
|
);
|
|
}
|
|
|
|
} |