view.dart 16 KB

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