view.dart 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531
  1. import 'package:electronic_assistant/base/base_page.dart';
  2. import 'package:electronic_assistant/module/talk/controller.dart';
  3. import 'package:electronic_assistant/resource/colors.gen.dart';
  4. import 'package:electronic_assistant/utils/expand.dart';
  5. import 'package:electronic_assistant/utils/fixed_size_tab_indicator.dart';
  6. import 'package:flutter/material.dart';
  7. import 'package:flutter/services.dart';
  8. import 'package:flutter_screenutil/flutter_screenutil.dart';
  9. import 'package:get/get.dart';
  10. import '../../data/bean/talks.dart';
  11. import '../../data/consts/event_report_id.dart';
  12. import '../../resource/assets.gen.dart';
  13. import '../../resource/string.gen.dart';
  14. import '../../router/app_pages.dart';
  15. import '../../utils/common_style.dart';
  16. import 'common_view.dart';
  17. class TalkPage extends BasePage<TalkController> {
  18. const TalkPage({super.key});
  19. static void start(TalkBean item, {String eventTag = EventId.id_002}) {
  20. if (Get.currentRoute == RoutePath.talkDetail) {
  21. Get.back();
  22. }
  23. Get.toNamed(RoutePath.talkDetail, arguments: {
  24. TalkController.argumentItem: item,
  25. TalkController.argumentEventTag: eventTag,
  26. });
  27. }
  28. static void startById(String talkId, {String eventTag = ''}) {
  29. if (Get.currentRoute == RoutePath.talkDetail) {
  30. Get.back();
  31. }
  32. Get.toNamed(RoutePath.talkDetail, arguments: {
  33. TalkController.argumentTalkId: talkId,
  34. TalkController.argumentEventTag: eventTag,
  35. });
  36. }
  37. @override
  38. Widget buildBody(BuildContext context) {
  39. return WillPopScope(
  40. onWillPop: () async {
  41. if (controller.isEditModel) {
  42. controller.onEditCancel();
  43. return false;
  44. }
  45. return true;
  46. },
  47. child: DefaultTabController(
  48. initialIndex: controller.tabIndex.value,
  49. length: controller.tabBeans.length,
  50. child: Stack(
  51. children: [
  52. buildTopGradient(),
  53. _buildTalkContentView(),
  54. buildBottomView(),
  55. buildAIAnalysisView()
  56. ],
  57. ),
  58. ),
  59. );
  60. }
  61. Scaffold _buildTalkContentView() {
  62. return Scaffold(
  63. backgroundColor: Colors.transparent,
  64. appBar: AppBar(
  65. actions: [
  66. _buildEditBtnView(),
  67. ],
  68. systemOverlayStyle: SystemUiOverlayStyle.dark,
  69. backgroundColor: Colors.transparent,
  70. leading: _buildAppbarBackView(),
  71. ),
  72. body: Builder(builder: (context) {
  73. return Column(
  74. crossAxisAlignment: CrossAxisAlignment.start,
  75. children: [
  76. _buildHeaderView(),
  77. buildTabBar(context),
  78. Obx(() {
  79. return Visibility(
  80. visible: !controller.isEditModel,
  81. child: Divider(
  82. height: 1,
  83. color: const Color(0xFFf6f6f6),
  84. indent: 12.w,
  85. endIndent: 12.w),
  86. );
  87. }),
  88. Obx(() {
  89. return Visibility(
  90. visible: !controller.isEditModel,
  91. child: SizedBox(height: 8.h));
  92. }),
  93. buildTalkContentView()
  94. ],
  95. );
  96. }),
  97. );
  98. }
  99. Padding _buildHeaderView() {
  100. return Padding(
  101. padding: EdgeInsets.symmetric(horizontal: 12.w),
  102. child: Obx(() {
  103. return Column(
  104. crossAxisAlignment: CrossAxisAlignment.start,
  105. children: [
  106. SizedBox(height: 8.h),
  107. _buildTalkTitle(),
  108. SizedBox(height: 4.h),
  109. Text(controller.talkBean.value?.createTime ?? '',
  110. style: TextStyle(
  111. fontSize: 12.sp, color: ColorName.secondaryTextColor)),
  112. SizedBox(height: 14.h),
  113. ],
  114. );
  115. }),
  116. );
  117. }
  118. Widget _buildTalkTitle() {
  119. if (!controller.isEditModel || controller.tabIndex.value == 1) {
  120. return Text(controller.talkBean.value?.title.value ?? '',
  121. style: TextStyle(
  122. fontSize: 22.sp,
  123. fontWeight: FontWeight.bold,
  124. color: ColorName.primaryTextColor));
  125. } else {
  126. return Container(
  127. decoration: BoxDecoration(
  128. color: ColorName.white,
  129. borderRadius: BorderRadius.circular(6.w),
  130. border: Border.all(color: "#E7E9F6".toColor(), width: 1),
  131. ),
  132. child: TextField(
  133. maxLines: null,
  134. maxLength: 15,
  135. decoration: InputDecoration(
  136. counterText: '',
  137. border: InputBorder.none,
  138. fillColor: Colors.transparent,
  139. contentPadding:
  140. EdgeInsets.symmetric(vertical: 6.w, horizontal: 8.w),
  141. ),
  142. style: TextStyle(
  143. fontSize: 22.sp,
  144. fontWeight: FontWeight.bold,
  145. color: ColorName.primaryTextColor),
  146. cursorColor: ColorName.primaryTextColor,
  147. controller: controller.editTalkNameController),
  148. );
  149. }
  150. }
  151. Container buildTabBar(BuildContext context) {
  152. TabController tabController = DefaultTabController.of(context);
  153. tabController.addListener(() {
  154. controller.updateTabIndex(tabController.index);
  155. });
  156. return Container(
  157. decoration: const BoxDecoration(
  158. color: Colors.white,
  159. borderRadius: BorderRadius.only(
  160. topLeft: Radius.circular(12),
  161. topRight: Radius.circular(12),
  162. )),
  163. child: Obx(() {
  164. if (!controller.isEditModel) {
  165. return TabBar(
  166. labelStyle:
  167. TextStyle(fontSize: 16.sp, fontWeight: FontWeight.bold),
  168. unselectedLabelStyle: TextStyle(fontSize: 14.sp),
  169. labelColor: ColorName.primaryTextColor,
  170. unselectedLabelColor: ColorName.secondaryTextColor,
  171. labelPadding: EdgeInsets.only(top: 4.h),
  172. dividerHeight: 0,
  173. indicator: FixedSizeTabIndicator(
  174. width: 16.w,
  175. height: 3.w,
  176. radius: 3,
  177. color: ColorName.colorPrimary),
  178. tabs: controller.tabBeans.map((txt) => Tab(text: txt)).toList());
  179. } else {
  180. return SizedBox(height: 8.h, width: double.infinity);
  181. }
  182. }),
  183. );
  184. }
  185. @override
  186. bool immersive() {
  187. return true;
  188. }
  189. Container buildTopGradient() {
  190. return Container(
  191. width: 1.sw,
  192. height: 180.h,
  193. decoration: BoxDecoration(
  194. gradient: LinearGradient(
  195. colors: ['#E1E9FF'.toColor(), '#F9FAFE'.toColor()],
  196. begin: Alignment.topCenter,
  197. end: Alignment.bottomCenter,
  198. stops: const [0.3, 1.0],
  199. ),
  200. ));
  201. }
  202. Widget buildTalkContentView() {
  203. return Obx(() {
  204. if (controller.talkBean.value?.status.value == TalkStatus.notAnalysis) {
  205. if (controller.isShowElectricLow.value) {
  206. return buildElectricLowView();
  207. } else if (controller.isUploading.value == true) {
  208. return buildElectricUploading();
  209. } else {
  210. return buildNotAnalysisView();
  211. }
  212. } else {
  213. return buildTabContentView();
  214. }
  215. });
  216. }
  217. Widget buildElectricUploading() {
  218. return getTalkUploadingView(controller.getUploadingProgress());
  219. }
  220. Widget buildTabContentView() {
  221. return Expanded(
  222. child: TabBarView(
  223. physics: controller.isEditModel
  224. ? const NeverScrollableScrollPhysics()
  225. : null,
  226. children: controller.pages,
  227. ),
  228. );
  229. }
  230. Widget buildNotAnalysisView() {
  231. return SizedBox(
  232. width: double.infinity,
  233. child: Column(
  234. children: [
  235. SizedBox(height: 119.h),
  236. SizedBox(
  237. width: 100.w,
  238. height: 100.w,
  239. child: Assets.images.iconTalkSummaryUnanalyzed.image()),
  240. SizedBox(height: 4.h),
  241. Text(StringName.talkUnAnalyzed.tr,
  242. style: TextStyle(
  243. fontSize: 15.sp, color: ColorName.primaryTextColor)),
  244. SizedBox(height: 2.h),
  245. Text(StringName.talkUnAnalyzedTips.tr,
  246. style: TextStyle(
  247. fontSize: 12.sp, color: ColorName.secondaryTextColor)),
  248. SizedBox(height: 24.h),
  249. GestureDetector(
  250. onTap: () {
  251. controller.checkCanAnalyze();
  252. },
  253. child: Container(
  254. decoration: getPrimaryBtnDecoration(8),
  255. width: 240.w,
  256. height: 48.w,
  257. child: Center(
  258. child: Text(
  259. StringName.talkAnalyzedBtnTxt.tr,
  260. style: TextStyle(fontSize: 16.sp, color: ColorName.white),
  261. ),
  262. ),
  263. ),
  264. )
  265. ],
  266. ),
  267. );
  268. }
  269. Widget buildElectricLowView() {
  270. return GestureDetector(
  271. onTap: () {
  272. controller.onGoElectricStore();
  273. },
  274. child: Container(
  275. color: const Color(0xFFDFE4FC),
  276. padding:
  277. EdgeInsets.only(left: 16.w, right: 12.w, top: 8.h, bottom: 8.h),
  278. child: Row(
  279. children: [
  280. SizedBox(
  281. width: 46.w,
  282. height: 56.w,
  283. child: Assets.images.iconTalkElectricLow.image()),
  284. SizedBox(width: 10.w),
  285. IntrinsicHeight(
  286. child: Column(
  287. crossAxisAlignment: CrossAxisAlignment.start,
  288. children: [
  289. SizedBox(
  290. width: 90.w,
  291. height: 21.w,
  292. child: Assets.images.iconTalkElectricLowTxt.image()),
  293. SizedBox(width: 1.w),
  294. Text(StringName.talkElectricLow.tr,
  295. style: TextStyle(
  296. fontSize: 12.sp,
  297. color: ColorName.secondaryTextColor)),
  298. ],
  299. ),
  300. ),
  301. const Spacer(),
  302. Container(
  303. decoration: getPrimaryBtnDecoration(8),
  304. width: 100.w,
  305. height: 36.w,
  306. child: Center(
  307. child: Text(StringName.talkGoStore.tr,
  308. style:
  309. TextStyle(fontSize: 16.sp, color: ColorName.white)),
  310. ))
  311. ],
  312. ),
  313. ),
  314. );
  315. }
  316. Widget buildBottomView() {
  317. return Obx(() {
  318. return Visibility(
  319. visible: controller.isEditModel == false,
  320. child: Align(
  321. alignment: Alignment.bottomCenter,
  322. child: Container(
  323. margin: EdgeInsets.only(bottom: 20.h), // 设置底部偏移距离
  324. child: IntrinsicHeight(
  325. child: Column(
  326. crossAxisAlignment: CrossAxisAlignment.end,
  327. children: [
  328. Obx(() {
  329. return Visibility(
  330. visible: controller.talkBean.value?.status.value ==
  331. TalkStatus.analysisSuccess,
  332. child: GestureDetector(
  333. onTap: () {
  334. controller.clickAIAnalysis();
  335. },
  336. child: Container(
  337. margin: EdgeInsets.only(right: 8.w),
  338. width: 64.w,
  339. height: 64.w,
  340. child: Assets.images.iconTalkLogo.image()),
  341. ),
  342. );
  343. }),
  344. SizedBox(height: 24.h),
  345. buildAudioView()
  346. ],
  347. ),
  348. ),
  349. ),
  350. ),
  351. );
  352. });
  353. }
  354. buildAIAnalysisView() {
  355. return Container();
  356. }
  357. buildAudioView() {
  358. return Container(
  359. decoration: BoxDecoration(
  360. color: Colors.white,
  361. borderRadius: BorderRadius.circular(100),
  362. boxShadow: [
  363. BoxShadow(
  364. color: ColorName.black5.withOpacity(0.1),
  365. spreadRadius: 2,
  366. blurRadius: 12,
  367. offset: const Offset(0, 3),
  368. ),
  369. ],
  370. ),
  371. margin: EdgeInsets.symmetric(horizontal: 12.w),
  372. padding: EdgeInsets.symmetric(vertical: 6.w, horizontal: 9.w),
  373. child: Row(
  374. children: [
  375. GestureDetector(
  376. onTap: () {
  377. controller.clickPlayAudio();
  378. },
  379. child: Obx(() {
  380. return SizedBox(
  381. width: 36.w,
  382. height: 36.w,
  383. child: (controller.isAudioPlaying.value)
  384. ? Assets.images.iconTalkAudioPlaying.image()
  385. : Assets.images.iconTalkAudioPause.image());
  386. }),
  387. ),
  388. SizedBox(width: 15.w),
  389. Builder(builder: (context) {
  390. return Flexible(
  391. // width: 226.w,
  392. // height: 18.w,
  393. child: Obx(() {
  394. return SliderTheme(
  395. data: SliderTheme.of(context).copyWith(
  396. thumbColor: Colors.white,
  397. overlayShape: SliderComponentShape.noOverlay,
  398. trackHeight: 8,
  399. activeTrackColor: "#8A89E9".toColor(),
  400. inactiveTrackColor: "#F6F5F8".toColor(),
  401. trackShape: CustomTrackShape(),
  402. ),
  403. child: Slider(
  404. value: controller.audioProgressValue.value,
  405. min: 0.0,
  406. max: controller.sliderMax,
  407. onChanged: (value) {
  408. controller.updateProgress(value);
  409. },
  410. ),
  411. );
  412. }),
  413. );
  414. }),
  415. SizedBox(width: 11.w),
  416. Obx(() {
  417. return Text(controller.audioDuration.value.toFormattedString(),
  418. style: TextStyle(
  419. fontSize: 10.sp, color: ColorName.secondaryTextColor));
  420. })
  421. ],
  422. ),
  423. );
  424. }
  425. Widget _buildAppbarBackView() {
  426. return Obx(() {
  427. return controller.isEditModel
  428. ? IconButton(
  429. icon: SizedBox(
  430. width: 24.w,
  431. height: 24.w,
  432. child: Assets.images.iconTalkEditCancel.image()),
  433. // Custom icon
  434. onPressed: () {
  435. controller.onEditCancel();
  436. },
  437. )
  438. : IconButton(
  439. icon: SizedBox(
  440. width: 24.w,
  441. height: 24.w,
  442. child: Assets.images.iconBack.image()),
  443. // Custom icon
  444. onPressed: () {
  445. Get.back();
  446. },
  447. );
  448. });
  449. }
  450. Widget _buildEditBtnView() {
  451. return Obx(() {
  452. return Visibility(
  453. visible: controller.talkBean.value?.status.value ==
  454. TalkStatus.analysisSuccess &&
  455. controller.tabIndex.value != 2,
  456. child: controller.isEditModel
  457. ? GestureDetector(
  458. onTap: () {
  459. controller.onEditDoneClick();
  460. },
  461. child: Padding(
  462. padding: EdgeInsets.symmetric(horizontal: 12.w),
  463. child: Text(StringName.done.tr,
  464. style: TextStyle(
  465. fontSize: 17.sp, color: ColorName.primaryTextColor)),
  466. ),
  467. )
  468. : Row(
  469. children: [
  470. IconButton(
  471. icon: SizedBox(
  472. width: 24.w,
  473. height: 24.w,
  474. child: Assets.images.iconTalkEdit.image()),
  475. onPressed: () {
  476. controller.onEditModelClick();
  477. },
  478. ),
  479. IconButton(
  480. icon: SizedBox(
  481. width: 24.w,
  482. height: 24.w,
  483. child: Assets.images.iconTalkShare.image()),
  484. onPressed: () {
  485. controller.onShareClick();
  486. },
  487. ),
  488. SizedBox(width: 12.w)
  489. ],
  490. ),
  491. );
  492. });
  493. }
  494. }
  495. class CustomTrackShape extends RoundedRectSliderTrackShape {
  496. @override
  497. Rect getPreferredRect({
  498. required RenderBox parentBox,
  499. Offset offset = Offset.zero,
  500. required SliderThemeData sliderTheme,
  501. bool isEnabled = false,
  502. bool isDiscrete = false,
  503. }) {
  504. final trackHeight = sliderTheme.trackHeight;
  505. final trackLeft = offset.dx;
  506. final trackTop = offset.dy + (parentBox.size.height - trackHeight!) / 2;
  507. final trackWidth = parentBox.size.width;
  508. return Rect.fromLTWH(trackLeft, trackTop, trackWidth, trackHeight);
  509. }
  510. }