消息、个人中心

wwf

5 天以前 8e1b89c65db438797d2d89c508f3e9883bbd7c20

 entry/src/main/ets/pages/message/MessagePage.ets

@@ -1,18 +1,31 @@
import { router } from "@kit.ArkUI"

class Message {
  avatar: string | Resource = ''
  name: string = ''
  company: string = ''
  desc: string = ''
  price: string = ''
}

@Entry
@Component
export struct MessagePage {
  @State messageList: Message[] = [
    { avatar: '', name: '李女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...' },
    { avatar: '', name: '林先生', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...' },
    { avatar: '', name: '吴女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...' }
    { avatar: '', name: '李女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '林先生', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '吴女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K' },
    { avatar: '', name: '李女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '林先生', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '吴女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K' },
    { avatar: '', name: '李女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '林先生', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '吴女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K' },
    { avatar: '', name: '李女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '林先生', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '吴女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K' },
    { avatar: '', name: '李女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '林先生', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K·14薪' },
    { avatar: '', name: '吴女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...', price: '20-35K' },
  ]

  build() {
@@ -40,14 +53,59 @@

      List({ space: 10, initialIndex: 0 }){
        ForEach(this.messageList, (item: Message) => {

        })
          ListItem() {
            Row() {
              Image($r('app.media.avatar'))
                .width(40)
                .height(40)
                .margin({ right: 10 })
              Column() {
                Row({ space: 6 }) {
                  Text(item.name)
                    .fontSize(14)
                  Text(item.company)
                    .maxLines(1)
                    .textOverflow({ overflow: TextOverflow.Ellipsis })
                    .fontColor('#999999')
                    .width(150)
                    .fontSize(12)
                  Text(item.price)
                    .width(80)
                    .fontColor('#999999')
                    .fontSize(12)
                    .textAlign(TextAlign.End)
                }
                .width('100%')
                .justifyContent(FlexAlign.Start)
                Text(item.desc)
                  .fontColor('#999999')
                  .fontSize(13)
                  .maxLines(1)
                  .textOverflow({ overflow: TextOverflow.Ellipsis })
                  .width('100%')
      }
      .height('100%')
      .padding({top:10})
      .margin({bottom: 30})
      .backgroundColor(Color.White)
      .divider({strokeWidth: 2,color: '#ccc'})
              .justifyContent(FlexAlign.SpaceBetween)
              .width(290)
            }
            .width('100%')
            .height(40)
            .margin({ top: 10, bottom: 10 })
            .onClick(() => {
              router.pushUrl({
                url: 'pages/message/MessageDetailsPage'
              })
            })
          }
        })
      }
      .listDirection(Axis.Vertical) // 排列方向
      .scrollBar(BarState.Off)
      .friction(0.6)
      .edgeEffect(EdgeEffect.Spring)
      .width('100%')
      .height(560)
      .divider({strokeWidth: 1,color: '#f0f0f0'})
    }
    .height('100%')
    .width('100%')