starwork_flutter/lib/views/main/teamNotice/team_notice_view.dart

406 lines
13 KiB
Dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:starwork_flutter/common/constant/app_colors.dart';
import 'package:starwork_flutter/views/main/teamNotice/team_notice_controller.dart';
class TeamNoticeView extends GetView<TeamNoticeController> {
const TeamNoticeView({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.white,
elevation: 0,
surfaceTintColor: Colors.transparent,
shadowColor: Colors.transparent,
scrolledUnderElevation: 0,
leading: null,
automaticallyImplyLeading: false,
title: Row(
children: [
Text(
'公告'.tr,
style: TextStyle(
fontSize: 18.sp,
fontWeight: FontWeight.w500,
color: Colors.black87,
),
),
],
),
),
body: Column(
children: [
TabBar(
controller: controller.tabController,
isScrollable: false,
// 改为false让TabBar占满宽度
labelColor: Colors.blue,
// 选中文字颜色改为蓝色
unselectedLabelColor: Colors.grey,
labelStyle: TextStyle(
fontSize: 16.sp,
fontWeight: FontWeight.w600,
),
unselectedLabelStyle: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w400,
),
indicatorColor: Colors.blue,
// 下划线颜色改为蓝色
indicatorWeight: 2.h,
// 稍微增加下划线粗细
indicatorSize: TabBarIndicatorSize.tab,
// 改为tab让指示器占满每个选项卡宽度
dividerColor: Colors.transparent,
tabs: controller.functionOptionList
.map((title) => Tab(text: title))
.toList(),
),
Expanded(
child: TabBarView(
controller: controller.tabController,
children: [
_buildNoticeManagementPage(),
_buildNoticeBoardPage(),
],
),
),
],
),
);
}
/// 构建公告管理页面
Widget _buildNoticeManagementPage() {
return Scaffold(
backgroundColor: AppColors.scaffoldBackgroundColor,
body: Column(
children: [
// 列表区域(可滚动)
Expanded(
child: _buildNoticeManageList(),
),
// 底部按钮(固定)
_buildBottomButtons(),
],
),
);
}
/// 构建公告管理列表
Widget _buildNoticeManageList() {
return RefreshIndicator(
onRefresh: () async {
// 模拟下拉刷新
await Future.delayed(const Duration(seconds: 2));
Get.snackbar('提示', '刷新成功');
},
color: Colors.blue,
displacement: 60.0,
child: ListView.separated(
physics: const AlwaysScrollableScrollPhysics(),
padding: EdgeInsets.symmetric(
horizontal: 16.w,
vertical: 16.h,
),
itemCount: 8,
// 模拟8条记录
separatorBuilder: (context, index) => SizedBox(height: 12.h),
itemBuilder: (context, index) {
return _buildNoticeManageListItem();
},
),
);
}
/// 构建底部按钮区域
Widget _buildBottomButtons() {
return Container(
padding: EdgeInsets.all(16.w),
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
spreadRadius: 0,
blurRadius: 4,
offset: const Offset(0, -2),
),
],
),
child: Row(
children: [
// 草稿箱按钮
Expanded(
flex: 1,
child: OutlinedButton(
onPressed: () {
// 草稿箱功能
Get.snackbar('提示', '保存到草稿箱');
},
style: OutlinedButton.styleFrom(
padding: EdgeInsets.symmetric(vertical: 12.h),
side: BorderSide(color: Colors.grey[300]!),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8.r),
),
),
child: Text(
'草稿箱',
style: TextStyle(
fontSize: 16.sp,
color: Colors.grey[700],
),
),
),
),
SizedBox(width: 12.w),
// 发布公告按钮
Expanded(
flex: 2,
child: ElevatedButton(
onPressed: () {
// 发布公告功能
Get.snackbar('提示', '公告发布成功');
},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.blue,
padding: EdgeInsets.symmetric(vertical: 12.h),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8.r),
),
elevation: 0,
),
child: Text(
'发布公告',
style: TextStyle(
fontSize: 16.sp,
color: Colors.white,
fontWeight: FontWeight.w500,
),
),
),
),
],
),
);
}
/// 构建公告栏页面
Widget _buildNoticeBoardPage() {
return Container(
padding: EdgeInsets.all(16.w),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'公告栏',
style: TextStyle(
fontSize: 20.sp,
fontWeight: FontWeight.w600,
color: Colors.black87,
),
),
SizedBox(height: 16.h),
Expanded(
child: ListView.builder(
itemCount: 5, // 模拟5条公告
itemBuilder: (context, index) {
return Container(
margin: EdgeInsets.only(bottom: 12.h),
padding: EdgeInsets.all(16.w),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8.r),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Container(
padding: EdgeInsets.symmetric(
horizontal: 8.w,
vertical: 4.h,
),
decoration: BoxDecoration(
color: Colors.red[50],
borderRadius: BorderRadius.circular(4.r),
),
child: Text(
'重要',
style: TextStyle(
fontSize: 12.sp,
color: Colors.red,
fontWeight: FontWeight.w500,
),
),
),
SizedBox(width: 8.w),
Expanded(
child: Text(
'公告标题 ${index + 1}',
style: TextStyle(
fontSize: 16.sp,
fontWeight: FontWeight.w600,
color: Colors.black87,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
],
),
SizedBox(height: 8.h),
Text(
'这里是公告的详细内容,包含了重要的信息和通知事项。请各位同事仔细阅读并遵照执行。',
style: TextStyle(
fontSize: 14.sp,
color: Colors.grey[700],
height: 1.5,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
SizedBox(height: 12.h),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'2024-01-${15 + index}',
style: TextStyle(
fontSize: 12.sp,
color: Colors.grey[500],
),
),
Row(
children: [
Icon(
Icons.visibility_outlined,
size: 16.w,
color: Colors.grey[500],
),
SizedBox(width: 4.w),
Text(
'${(index + 1) * 23}',
style: TextStyle(
fontSize: 12.sp,
color: Colors.grey[500],
),
),
],
),
],
),
],
),
);
},
),
),
],
),
);
}
_buildNoticeManageListItem() {
return Stack(
children: [
Container(
padding: EdgeInsets.symmetric(
horizontal: 10.w,
vertical: 10.h,
),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8.r),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: 0.8.sw, // 限制最大宽度
child: Text(
'1',
maxLines: 1, // 限制为一行
overflow: TextOverflow.ellipsis, // 超出部分显示省略号
style: TextStyle(
fontSize: 24.sp,
fontWeight: FontWeight.bold,
color: Colors.black87,
),
),
),
SizedBox(
height: 4.h,
),
SizedBox(
width: 0.8.sw, // 限制最大宽度
child: Text(
'112312',
maxLines: 3, // 限制为一行
overflow: TextOverflow.ellipsis, // 超出部分显示省略号
style: TextStyle(
fontSize: 16.sp,
color: Colors.black87,
),
),
),
SizedBox(
height: 4.h,
),
Text(
'HHMMail 30015524 2024-12-17',
style: TextStyle(
fontSize: 12.sp,
color: Colors.grey[600],
),
),
],
),
],
),
),
Positioned(
right: 0.w,
top: 0.h,
child: Container(
padding: EdgeInsets.symmetric(horizontal: 4.w, vertical: 4.h),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(8.r),
topRight: Radius.circular(8.r),
),
color: Colors.grey[300],
),
child: Text(
'已撤回'.tr,
style: TextStyle(
fontSize: 10.sp,
color: Colors.grey,
),
),
),
)
],
);
}
}