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: '这个岗位我十分感兴趣，请看一下我的简历，我...', 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() {
|
Column({space: 10}) {
|
Text('联系人')
|
.width('100%')
|
.textAlign(TextAlign.Start)
|
.fontWeight(800)
|
.fontSize(18)
|
.margin({ left: 16 })
|
Row() {
|
Image($r('app.media.search_icon'))
|
.width(14)
|
.height(14)
|
TextInput({ placeholder: '搜索想要查找的岗位' })
|
.placeholderFont({ size: 14})
|
.placeholderColor('#999999')
|
.backgroundColor('#f3f7fe')
|
}
|
.borderRadius(30)
|
.padding({ left: 20, right: 20 })
|
.backgroundColor('#f3f7fe')
|
.width('100%')
|
.margin({ top: 10 })
|
|
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%')
|
.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%')
|
.padding({ left: 10, right: 10 })
|
}
|
}
|
