chat-app/src/pages/search/moreResult/moreResult.vue

<template>
  <div class="outer-layer search-page">
    <div class="root">
      <div class="searchRoot">
        <tm-input
          class="searchRoot_input"
          placeholder="请输入…"
          color="#F9F9FD"
          :round="1"
          prefix="tmicon-search"
          prefixColor="#46299D"
          v-model.lazy="state.searchText"
          @input="inputSearchText"
        ></tm-input>
        <span
          class="searchRoot_cancelBtn text-[32rpx] font-medium"
          @click="cancelSearch"
        >
          {{ $t('cancel') }}
        </span>
      </div>
      <div
        class="search-result"
        :style="
          !state.searchText ? 'align-items:center;justify-content:center;' : ''
        "
      >
        <searchList
          :searchResult="state.searchResult"
          :searchText="state.searchText"
        ></searchList>
      </div>
    </div>
  </div>
</template>
<script setup>
import searchList from '../components/searchList.vue'
import { onLoad } from '@dcloudio/uni-app'
import { ServeSeachQueryAll } from '@/api/search/index'
import { ref, watch, computed, onMounted, onUnmounted, reactive } from 'vue'
import { useAuth } from '@/store/auth'
import { nextTick } from 'process'
const state = reactive({
  searchText: '', //搜索内容
  searchResult: null, //搜索结果
  searchResultPageSize: 10, //搜索结果每页数据量
  searchResultKey: '',
})

onLoad((options) => {
  console.log(options)
  if (options.searchResultKey) {
    state.searchResultKey = options.searchResultKey
  }
  if (options.searchText) {
    state.searchText = options.searchText
  }
})

//输入搜索文本
const inputSearchText = (e) => {
  console.log(e)
  let searchText = e
  queryAllSearch(searchText)
}

// ES搜索聊天记录-指定用户、指定群、群与用户概览
const queryAllSearch = (searchText) => {
  let talk_type = 0
  if (state.searchResultKey === 'user_infos') {
    talk_type = 1
  } else if (state.searchResultKey === 'combinedGroup') {
    talk_type = 2
  } else if (state.searchResultKey === 'general_infos') {
    talk_type = 0
  }
  let params = {
    talk_type: talk_type, //1私聊2群聊
    receiver_id: 0, //需要查详情的时候，送recevier_id
    key: searchText, //关键字
    size: state.searchResultPageSize, //搜索结果每页数据量
    last_group_id: 0,
    last_member_id: 0, //,
  }
  const resp = ServeTalkRecord(params)
  resp.then(({ code, data }) => {
    console.log(data)
    if (code == 200) {
    } else {
    }
  })

  resp.catch(() => {})
}

//点击取消搜索
const cancelSearch = () => {
  uni.navigateBack({
    delta: 1,
  })
}
</script>
<style scoped lang="scss">
uni-page-body,
page {
  height: 100%;
}

.outer-layer {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.root {
  flex: 1;
  padding: 20rpx 32rpx;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.search-page {
  .searchRoot {
    padding: 0 16rpx;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;

    .searchRoot_input {
      width: 100%;
    }

    .searchRoot_cancelBtn {
      line-height: 44rpx;
      color: $theme-primary;
      margin: 0 0 0 20rpx;
      flex-shrink: 0;
    }
  }

  .search-result {
    width: 100%;
    flex: 1;

    min-height: 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
  }
}
</style>