功能完善

wwf

4 天以前 7f2343d38fa048f6ce179ea0ab2c1a04f41a213c

 entry/src/main/ets/pages/account/AccountPage.ets

@@ -1,22 +1,316 @@
import { ComponentContent, router } from "@kit.ArkUI"
import { PromptActionClass } from '../../utils/PromptActionClass';

class accountListItem {
  title: string = ''
  icon: string | Resource = ''
}
class DialogParams {
  text: string = "";

  constructor(text: string) {
    this.text = text;
  }
}
@Builder
function buildText(params: DialogParams) {
  Column({ space: 12 }) {
    Text('已沟通')
      .width('100%')
      .fontSize(18)
      .fontWeight(700)
      .textAlign(TextAlign.Center)
    Text('4')
      .fontSize(26)
      .fontWeight(700)
      .fontColor('#1761f4')
      .width('100%')
      .textAlign(TextAlign.Center)
    Text('累计沟通岗位数')
      .fontSize(14)
      .fontColor('#666666')
    Text('您是职场中的中流砥柱')
      .width('100%')
      .textAlign(TextAlign.Center)
      .padding(16)
      .fontSize(14)
      .fontColor(Color.Black)
      .fontWeight(500)
      .backgroundColor('#f6f7fa')
  }
  .width(300)
  .padding(20)
  .borderRadius(14)
  .backgroundColor(Color.White)
}

@Builder
function buildText1(params: DialogParams) {
  Column({ space: 12 }) {
    Text('帮助中心')
      .width('100%')
      .fontSize(18)
      .fontWeight(700)
      .fontColor(Color.Black)
      .textAlign(TextAlign.Center)
    Text('400-100-1212')
      .fontSize(26)
      .fontWeight(700)
      .fontColor(Color.Black)
      .width('100%')
      .textAlign(TextAlign.Center)
    Button('拨打电话')
      .width('100%')
      .type(ButtonType.Normal)
      .borderRadius(8)
  }
  .width(300)
  .padding(20)
  .borderRadius(14)
  .backgroundColor(Color.White)
}

@Entry
@Component
export struct AccountPage {
  @State message: string = 'Hello World';
  @State ListItems: accountListItem[] = [
    { title: '隐私设置', icon: $r('app.media.account_setting') },
    { title: '消息通知', icon: $r('app.media.account_message') },
    { title: '帮助中心', icon: $r('app.media.account_help') },
    { title: '关于我们', icon: $r('app.media.account_info') },
  ]
  @State dialogMessage: string = '注册成功';
  private ctx: UIContext = this.getUIContext();
  private contentNode: ComponentContent<Object> =
    new ComponentContent(this.ctx, wrapBuilder(buildText), new DialogParams((this.dialogMessage)));
  params: DialogParams = new DialogParams('注册成功')

  aboutToAppear(): void {
    PromptActionClass.setContext(this.ctx);
    PromptActionClass.setContentNode(this.contentNode);
    PromptActionClass.setOptions({ alignment: DialogAlignment.Center, offset: { dx: 0, dy: 0 } });
  }
  build() {
    RelativeContainer() {
      Text(this.message)
        .id('AccountPageHelloWorld')
        .fontSize($r('app.float.page_text_font_size'))
        .fontWeight(FontWeight.Bold)
        .alignRules({
          center: { anchor: '__container__', align: VerticalAlign.Center },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
    Column() {
      Text('个人中心')
        .fontSize(20)
        .fontWeight(700)
        .textAlign(TextAlign.Center)
        .width('100%')
        .backgroundColor(Color.White)
        .padding({ top: 10,  bottom: 10 })

      Column({ space: 10 }) {
        Row() {
          Image($r('app.media.me_icon'))
            .width(50)
            .height(50)
          Column() {
            Text('李强')
              .fontSize(16)
              .width('100%')
              .fontWeight(600)
              .fontColor(Color.Black)
              .textAlign(TextAlign.Start)
            Text('男 | 28岁 | 前端开发工程师')
              .fontColor('#333333')
              .fontSize(14)
              .width('100%')
              .textAlign(TextAlign.Start)
          }
          .width(100)
          .height(40)
          .margin({ left: 10 })
          .justifyContent(FlexAlign.SpaceBetween)
          .layoutWeight(1)
          Image($r('app.media.chevron_right'))
            .width(18)
            .height(18)
        }
        .width('100%')
        .onClick(() =>{
          router.pushUrl({
            url: ''
          })
        })

        Column({ space: 16 }) {
          Row() {
            Text('学习记录')
              .fontSize(16)
              .fontColor(Color.White)
              .fontWeight(700)
            Text('去应聘 > ')
              .fontSize(13)
              .borderRadius(20)
              .fontWeight(500)
              .backgroundColor(Color.White)
              .padding({ left: 10, right: 10, top: 4, bottom: 4 })
              .fontColor('#1756f4')
          }
          .width('100%')
          .justifyContent(FlexAlign.SpaceBetween)

          Text('当前学习级别：青铜')
            .width('100%')
            .fontColor(Color.White)
            .fontSize(14)
          Row() {
            Column({ space: 4 }) {
              Text('学习时长')
                .fontColor(Color.White)
                .fontSize(12)
                .width('100%')
              Text() {
                Span('10').fontWeight(700).fontSize(14)
                Span('分钟').fontSize(12)
              }
              .width('100%')
              .fontColor(Color.White)
            }
            .width(80)
            Column({ space: 4 }) {
              Text('学习最长的课程')
                .fontColor(Color.White)
                .fontSize(12)
                .width('100%')
              Text('全栈开发：前后端打通实战')
                .fontWeight(700)
                .fontSize(14)
                .width('100%')
                .fontColor(Color.White)
            }
          }
          .width('100%')
        }
        .width('100%')
        .padding(16)
        .borderRadius(14)
        .linearGradient({
          direction: GradientDirection.Right,
          colors: [['#36BCFF', 0.0], ['#2D74FF', 1.0]]
        })
      }
      .backgroundColor(Color.White)
      .padding(16)
      .margin({ top: 1 })

      Row() {
        Column({ space: 6 }) {
          Image($r('app.media.account_learning'))
            .width(40)
            .height(40)
          Text('学习记录')
            .fontSize(14)
            .fontWeight(500)
            .fontColor(Color.Black)
        }
        Column({ space: 6 }) {
          Image($r('app.media.account_course'))
            .width(40)
            .height(40)
          Text('课程收藏')
            .fontSize(14)
            .fontWeight(500)
            .fontColor(Color.Black)
        }
        Column({ space: 6 }) {
          Image($r('app.media.account_vitae'))
            .width(40)
            .height(40)
          Text('个人简历')
            .fontSize(14)
            .fontWeight(500)
            .fontColor(Color.Black)
        }
        Column({ space: 6 }) {
          Image($r('app.media.account_communicated'))
            .width(40)
            .height(40)
          Text('已沟通')
            .fontSize(14)
            .fontWeight(500)
            .fontColor(Color.Black)
        }
        .onClick(() => {
          this.message = 'Welcome';
          console.log('点击')
          this.contentNode = new ComponentContent(this.ctx, wrapBuilder(buildText), new DialogParams((this.dialogMessage)));
          PromptActionClass.setContentNode(this.contentNode);
          PromptActionClass.openDialog()
        })
      }
      .width('100%')
      .backgroundColor(Color.White)
      .padding({ bottom: 10 })
      .justifyContent(FlexAlign.SpaceEvenly)

      Column() {
        List({ space: 10, initialIndex: 0 }){
          ForEach(this.ListItems, (item: accountListItem) => {
            ListItem() {
              Row() {
                Image(item.icon)
                  .width(20)
                  .height(20)
                Text(item.title)
                  .fontSize(13)
                  .fontWeight(500)
                  .fontColor(Color.Black)
                  .layoutWeight(1)
                  .margin({ left: 8 })

                Image($r('app.media.chevron_right'))
                  .width(12)
                  .height(12)
              }
              .width('100%')
              .padding(8)
              .onClick(() => {
                if (item.title == '隐私设置') {
                  router.pushUrl({
                    url: ''
                  })
                } else if (item.title == '消息通知') {

                } else if (item.title == '帮助中心') {
                  this.contentNode = new ComponentContent(this.ctx, wrapBuilder(buildText1), new DialogParams((this.dialogMessage)));
                  PromptActionClass.setContentNode(this.contentNode);
                  PromptActionClass.openDialog()
                } else if (item.title == '关于我们') {

                }
              })
            }
          })
        }
        .listDirection(Axis.Vertical) // 排列方向
        .scrollBar(BarState.Off)
        .friction(0.6)
        .edgeEffect(EdgeEffect.Spring)
        .width('100%')
        .divider({strokeWidth: 1,color: '#f0f0f0'})
      }
      .padding(16)
      .backgroundColor(Color.White)
      .margin({ top: 1 })

      Column() {
        Button('退出应用')
          .fontSize(14)
          .height(36)
          .type(ButtonType.Normal)
          .borderRadius(6)
          .width('100%')
          .fontColor(Color.White)
          .backgroundColor('#1761f4')
      }
      .padding(16)
      .width('100%')
      .background(Color.White)
      .height(300)

    }
    .backgroundColor('#f5f5f7')
    .height('100%')
    .width('100%')
  }