<template> <div class="respond-pop-mask"> <div class="respond-pop"> <div class="respond-pop-no flexcenter" v-if="JSON.stringify(respondDetail) == '{}'"> <img class="respond-title-icon" @click="closePopList()" src="//app.gter.net/image/gter/offer/imgdetails/cross-grey.png?v=5.1.78_206050707" /> <img src="//app.gter.net/image/gter/offer/imgdetails/no-discussion.png?v=5.1.78_206050707" class="respond-pop-no-icon" /> <div class="respond-pop-no-text">- 暂无数据 -</div> </div> <template v-else> <div class="respond-pop-title"> 共<span class="respond-pop-amount">{{ respondPopObj.user }}</span >人回应 <img class="respond-title-icon" @click="closePopList()" src="//app.gter.net/image/gter/offer/imgdetails/cross-grey.png?v=5.1.78_206050707" /> </div> <div class="respond-list"> <div class="respond-item" v-for="(item, index) in respondDetail" :key="index"> <div class="respond-code" :class="{ 'pitch': item.selected }" v-html="jointriposte(item.item)" @click="selectEomjiListPop(item.item, index)"></div> <div class="respond-content flex1"> <div class="respond-total">{{ item.user.length }} 人作此回应</div> <div class="user-item" v-for="(item, index) in item.user" :key="index" @click="TAHomePage(item.uin)"> <img class="user-avatar" :src="item.avatar" /> {{ item.nickname || item.username }} </div> </div> </div> </div> </template> </div> </div> </template> <script setup> const props = defineProps({ respondDetail: Array, respondPopObj: Object, }) // 点击ta的主页 const TAHomePage = uin => { redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&uid=${uin}`) } // 跳转 url const redirectToExternalWebsite = url => { const link = document.createElement("a") link.href = url link.target = "_blank" link.click() } let selectEomjiPop = ref(false) const emit = defineEmits(["closePopList","selectEomji"]) const selectEomjiListPop = key => { console.log("key",key); emit("selectEomji", key, props.respondPopObj.index || 0, false, true) } const closePopList = () => { emit("closePopList") } const jointriposte = item => { return `&#x${item};` } </script> <style scoped></style>