import { CommonConstantWX } from '../../common/CommonConstantWX'
|
import { WxMessageBase } from '../../data/WxMessageBase'
|
import { WxUserInfoBase } from '../../data/WxUserInfoBase'
|
import { TitleUtils } from '../../utils/TitleUtils'
|
|
/**
|
* @ProjectName : HealthNS
|
* @FileName : MessageDetailsPage
|
* @UserName : 修梦
|
* @Time : 2025/9/14 16:35
|
* @Description : 文件描述
|
*/
|
@Entry
|
@Component
|
struct MessageDetailsPage {
|
@State msgData: Array<WxMessageBase> = CommonConstantWX.mUserMessage
|
@State mContent:string = ''
|
private mScroller: Scroller = new Scroller()
|
@State mUserInfo: WxUserInfoBase = new WxMessageBase()
|
aboutToAppear(): void {
|
let params = this.getUIContext().getRouter().getParams() as Record<string,WxUserInfoBase>
|
this.mUserInfo = params.userInfo
|
}
|
build() {
|
RelativeContainer(){
|
TitleUtils({titleName:this.mUserInfo.name})
|
.id('heard')
|
List({space: 15,scroller:this.mScroller}){
|
ForEach(this.msgData,(item: WxMessageBase) => {
|
ListItem(){
|
MessageDetailsItem({item: item,icon: this.mUserInfo.img})
|
}
|
})
|
}
|
.id('list')
|
.alignRules({
|
top:{anchor: 'heard',align: VerticalAlign.Bottom},
|
bottom: {anchor: 'rowBottom',align: VerticalAlign.Top}
|
})
|
.padding(10)
|
Row({space: 5}){
|
Image($r('app.media.wx_voice_icon')).MessageImageSty()
|
TextArea({text: this.mContent})
|
.backgroundColor(Color.White)
|
.borderRadius(5)
|
.width('70%')
|
.offset({y: 5})
|
.onChange((value: string) => {
|
this.mContent = value
|
})
|
Image($r('app.media.wx_smile_icon')).MessageImageSty()
|
if (this.mContent.trim().length === 0 || !this.mContent){
|
Image($r('app.media.wx_more_icon')).MessageImageSty()
|
} else {
|
Button(){
|
Text('发送')
|
.fontSize(15)
|
.fontColor(Color.White)
|
}
|
.padding(5)
|
//发送数据，添加到了聊天列表
|
.onClick(() =>{
|
this.msgData.push({
|
id: 99,
|
content: this.mContent,
|
img: $r('app.media.avatar_icon1'),
|
category: 1
|
})
|
this.mContent = ''
|
//滚动到底部
|
this.mScroller.scrollToIndex(this.msgData.length - 1)
|
})
|
}
|
|
}
|
.width('100%')
|
.alignItems(VerticalAlign.Bottom)
|
.padding(10)
|
.backgroundColor("#ffe9e6e6")
|
.id('rowBottom')
|
.alignRules({
|
bottom: {anchor: '__container__',align: VerticalAlign.Bottom}
|
})
|
}
|
.width('100%')
|
.height('100%')
|
.backgroundColor('#ccc')
|
}
|
}
|
|
@Component
|
struct MessageDetailsItem {
|
@Prop item: WxMessageBase
|
@Prop icon: ResourceStr
|
build() {
|
if (this.item.category === 0){
|
Row({space:5}){
|
Image(this.icon)
|
.width(40)
|
.height(40)
|
Text(this.item.content)
|
.backgroundColor(Color.White)
|
.padding(5)
|
}
|
.width('78%')
|
} else {
|
Row({space:5}){
|
Row(){
|
Text(this.item.content)
|
.backgroundColor("#ff3cc12e")
|
.padding(5)
|
}
|
.justifyContent(FlexAlign.End)
|
.width('78%')
|
Image($r('app.media.avatar_icon1'))
|
.width(40)
|
.height(40)
|
}
|
.width('100%')
|
.justifyContent(FlexAlign.End)
|
}
|
|
}
|
}
|
|
@Extend(Image)
|
function MessageImageSty() {
|
.width(25)
|
.height(25)
|
.objectFit(ImageFit.Fill)
|
}
|
