-
- {{ resultName }}
-
+
{{ resultType }}
-
- {{ resultDetail }}
-
+
@@ -24,109 +28,108 @@
import zu4992 from '@/static/image/chatList/zu4992@2x.png'
import zu4991 from '@/static/image/chatList/zu4991@2x.png'
import zu4989 from '@/static/image/chatList/zu4989@2x.png'
-import {
- ref,
- watch,
- computed,
- onMounted,
- onUnmounted,
- reactive,
- getCurrentInstance,
-} from 'vue'
-const { proxy } = getCurrentInstance()
+import zu5296 from '@/static/image/chatList/zu5296@2x.png'
+import { ref, watch, computed, onMounted, onUnmounted, reactive } from 'vue'
+import HighlightText from './highLightText.vue'
+import { useI18n } from 'vue-i18n'
+const { t } = useI18n()
const props = defineProps({
searchItem: Object | Number,
searchResultKey: String,
+ searchText: String,
})
+// 映射表-查找对应结构下的属性名
+const keyMapping = {
+ user_infos: { avatar: 'avatar', name: 'nickname' },
+ group_infos: { avatar: 'avatar', name: 'name' },
+ group_member_infos: {
+ avatar: 'group_avatar',
+ name: 'group_name',
+ detailKey: 'user_name',
+ },
+ general_infos: {
+ avatar: 'receiver_avatar',
+ name: 'receiver_name',
+ detailKey: 'count',
+ },
+}
+//获取key对应值
+const getKeyValue = (keys) => {
+ let keyValue = ''
+ if (keys) {
+ keyValue = props.searchItem[keys]
+ }
+ return keyValue
+}
+//头像
const avatarImg = computed(() => {
- let srcT = ''
- switch (props.searchItem?.group_type) {
- case 0:
- srcT = zu5296
- break
- case 1:
- srcT = zu4992
- break
- case 2:
- srcT = zu4991
- break
- case 3:
- srcT = zu4989
- break
- default:
- srcT = zu4992
+ let avatar = getKeyValue(keyMapping[props.searchResultKey]?.avatar)
+ if (!avatar) {
+ avatar = groupTypeMapping[props.searchItem?.group_type]?.defaultImg
}
- return srcT
+ return avatar
})
+//名称
const resultName = computed(() => {
- let data_key = ''
- switch (props.searchResultKey) {
- case 'user_infos':
- data_key = props.searchItem?.nickname
- break
- case 'group_member_infos':
- data_key = props.searchItem?.group_name
- break
- case 'general_infos':
- data_key = props.searchItem?.receiver_name
- break
- default:
- data_key = ''
- }
- return data_key
+ return getKeyValue(keyMapping[props.searchResultKey]?.name)
})
+// 映射表-根据groupType设置对应值
+const groupTypeMapping = {
+ 0: {},
+ 1: {
+ defaultImg: zu4992,
+ },
+ 2: {
+ result_type: t('index.mine.department'),
+ defaultImg: zu4989,
+ },
+ 3: {
+ result_type: t('index.mine.project'),
+ defaultImg: zu4991,
+ },
+ 4: {
+ defaultImg: zu5296,
+ },
+}
+//群类型tag
const resultType = computed(() => {
- let result_type = ''
- switch (props.searchItem?.group_type) {
- case 0:
- result_type = ''
- break
- case 1:
- result_type = ''
- break
- case 2:
- result_type = proxy.$t('index.mine.department')
- break
- case 3:
- result_type = proxy.$t('index.mine.project')
- break
- case 4:
- result_type = ''
- break
- default:
- result_type = ''
- }
- return result_type
+ return groupTypeMapping[props.searchItem?.group_type]?.result_type
})
+//详细内容
const resultDetail = computed(() => {
- let data_key = ''
- switch (props.searchResultKey) {
- case 'user_infos':
- data_key = ''
+ let result_detail =
+ props.searchItem[keyMapping[props.searchResultKey]?.detailKey]
+ switch (keyMapping[props.searchResultKey]?.detailKey) {
+ case 'count':
+ result_detail = result_detail + t('search.chat.count')
break
- case 'group_member_infos':
- data_key = ''
- break
- case 'general_infos':
- data_key = props.searchItem?.count + proxy.$t('search.chat.count')
+ case 'user_name':
+ result_detail = t('search.result.include') + result_detail
break
default:
- data_key = ''
+ result_detail = ''
}
- return data_key
+ return result_detail
})