完善功能

wwf

6 天以前 e794ed885a75be8ab5c789c2ea8db902ce338b0b

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

@@ -1,63 +1,49 @@
import { CommonConstantWX } from "../../common/CommonConstantWX"
import { WxUserInfoBase } from "../../data/WxUserInfoBase"

/*
 * Search({placeholder: '请输入您要搜索的内容',value: 'DeepSeek'})
        .width('90%')
        .backgroundColor(Color.White)
        .searchButton('搜索')
        .onChange((value: string) => {
          console.info(`输入的内容为：${value}`)
        })
        //提交方法
        .onSubmit((value:string) => {
          console.info(`提交的内容为：${value}`)
        })
 * */
class Message {
  avatar: string | Resource = ''
  name: string = ''
  company: string = ''
  desc: string = ''
}

@Entry
@Component
export struct MessagePage {
  @State userList:Array<WxUserInfoBase> = CommonConstantWX.mUser
  @State searchUser:Array<WxUserInfoBase> = []
  @State messageList: Message[] = [
    { avatar: '', name: '李女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...' },
    { avatar: '', name: '林先生', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...' },
    { avatar: '', name: '吴女士', company: '摩米移动科技|移动端开发工程师', desc: '这个岗位我十分感兴趣，请看一下我的简历，我...' }
  ]

  build() {
    Column({space: 10}) {
      Search({placeholder: '搜索'})
        .backgroundColor(Color.White)
        .width('90%')
        .borderRadius(5)
        .onChange((value: string) =>{
          //每次输入都要清空searchUser数组
          this.searchUser = []
          let searchCount = 0
          //进行遍历，在数组源头查找和value相关的数据
          for (let index = 0; index < this.userList.length; index++) {
            const element = this.userList[index];
            //判断每一条数据是否有和Value相关的内容
            if (element.name?.indexOf(value) != -1) {
              //找到相关的数据，添加到search数组当中，并且数据加一
              searchCount ++
              this.searchUser.push(element)
      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')
            }
          }
          //判断SearchCount是否为0
          if (searchCount === 0) {
            //表示查无此人
            this.searchUser.push({
              id: 999,
              name: '无此用户',
              img:$r('app.media.avatar_icon')
            })
          }
      .borderRadius(30)
      .padding({ left: 20, right: 20 })
      .backgroundColor('#f3f7fe')
      .width('100%')
      .margin({ top: 10 })

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

        })
      List({space: 20}){
        ForEach(this.searchUser.length === 0 ? this.userList: this.searchUser,(item: WxUserInfoBase) => {
          ListItem(){
            userInfoItem({item: item})
          }
        })
      }
      .height('90%')
      .height('100%')
      .padding({top:10})
      .margin({bottom: 30})
      .backgroundColor(Color.White)
@@ -65,30 +51,6 @@
    }
    .height('100%')
    .width('100%')
    .backgroundColor('#ccc')
  }
}

@Component
struct userInfoItem {
  @Prop item: WxUserInfoBase
  build() {
    Row({space: 15}){
      Image(this.item.img)
        .width(40)
        .height(40)
        .objectFit(ImageFit.Cover)
      Text(this.item.name)
        .fontSize(20)
    }
    .onClick(() => {
      this.getUIContext().getRouter().pushUrl({
        url: 'pages/message/MessageDetailsPage',
        params:{
          userInfo: this.item
        }
      })
    })
    .padding(10)
    .padding({ left: 10, right: 10 })
  }
}