ImportConflictDialog.ets 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. import { CommonConstants } from '../common/constants/CommonConstants';
  2. import { ConflictResolution } from '../viewmodel/PlaylistBackup';
  3. @CustomDialog
  4. export struct ImportConflictDialog {
  5. controller?: CustomDialogController;
  6. onResolve?: (resolution: ConflictResolution, applyToAll: boolean) => void;
  7. onCancel?: () => void;
  8. conflictName: string = '';
  9. themeColor: string = CommonConstants.DEFAULT_THEME_COLOR;
  10. @State applyToAll: boolean = false;
  11. private handleResolve(resolution: ConflictResolution): void {
  12. this.onResolve?.(resolution, this.applyToAll);
  13. this.controller?.close();
  14. }
  15. private handleCancel(): void {
  16. this.onCancel?.();
  17. this.controller?.close();
  18. }
  19. build() {
  20. Column() {
  21. Text('导入冲突')
  22. .fontSize(20)
  23. .fontWeight(FontWeight.Medium)
  24. .margin({ bottom: 8 });
  25. Text(`歌单「${this.conflictName}」已存在,请选择处理方式:`)
  26. .fontSize(14)
  27. .fontColor(Color.Gray)
  28. .margin({ bottom: 16 })
  29. .textAlign(TextAlign.Center);
  30. // 三个操作按钮
  31. Button('覆盖现有歌单')
  32. .width('100%')
  33. .height(44)
  34. .backgroundColor(this.themeColor || CommonConstants.DEFAULT_THEME_COLOR)
  35. .fontColor(Color.White)
  36. .borderRadius(12)
  37. .margin({ bottom: 8 })
  38. .onClick(() => this.handleResolve(ConflictResolution.OVERWRITE));
  39. Button('重命名导入')
  40. .width('100%')
  41. .height(44)
  42. .backgroundColor(Color.Transparent)
  43. .fontColor(this.themeColor || CommonConstants.DEFAULT_THEME_COLOR)
  44. .border({ color: this.themeColor || CommonConstants.DEFAULT_THEME_COLOR, width: 1, radius: 12 })
  45. .borderRadius(12)
  46. .margin({ bottom: 8 })
  47. .onClick(() => this.handleResolve(ConflictResolution.RENAME));
  48. Button('跳过')
  49. .width('100%')
  50. .height(44)
  51. .backgroundColor(Color.Transparent)
  52. .fontColor(Color.Gray)
  53. .border({ color: Color.Gray, width: 1, radius: 12 })
  54. .borderRadius(12)
  55. .margin({ bottom: 12 })
  56. .onClick(() => this.handleResolve(ConflictResolution.SKIP));
  57. // 应用到全部复选框
  58. Row() {
  59. Checkbox()
  60. .select(this.applyToAll)
  61. .selectedColor(this.themeColor || CommonConstants.DEFAULT_THEME_COLOR)
  62. .onChange((value: boolean) => {
  63. this.applyToAll = value;
  64. });
  65. Text('应用到所有冲突')
  66. .fontSize(14)
  67. .fontColor(Color.Gray)
  68. .margin({ left: 8 });
  69. }
  70. .margin({ bottom: 8 });
  71. // 取消按钮
  72. Text('取消导入')
  73. .fontSize(14)
  74. .fontColor(Color.Gray)
  75. .onClick(() => this.handleCancel());
  76. }
  77. .padding(24)
  78. .width('100%')
  79. .backgroundColor($r('app.color.start_window_background'))
  80. .borderRadius(24);
  81. }
  82. }