duanhao/SocialNetworks_duan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

14修改

Browse Source
This commit is contained in:
duanhao 2025-08-14 15:35:15 +08:00
parent 1f2ccfc4ff
commit acc39199e4
2 changed files with 53 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/views/KeyNodeDiscern/bridgeCommunication/components/LeaderDetailDialog.vue
View File

@ -1,5 +1,10 @@
<template> <template>
<el-dialog v-model="isVisible" width="640" align-center class="leader-custom-dialog"> <el-dialog
v-model="isVisible"
:style="{ height: '560px' }"
align-center
class="leader-custom-dialog"
>
<template v-if="store.activeLeader"> <template v-if="store.activeLeader">
<img src="@/assets/images/chuanbo_node_Info.png" alt="" class="dialogTitleImg" /> <img src="@/assets/images/chuanbo_node_Info.png" alt="" class="dialogTitleImg" />
<div class="dialog-content"> <div class="dialog-content">
@ -8,9 +13,9 @@
<div class="leaderInfo-message"> <div class="leaderInfo-message">
<div class="leader-name">{{ store.activeLeader.name }}</div> <div class="leader-name">{{ store.activeLeader.name }}</div>
<div class="leader-heat"> <div class="leader-heat">
<div class="fancy">粉丝量:  {{ store.activeLeader.leaderOriginInfo.followers }}</div> <div class="fancy">粉丝量:   {{ store.activeLeader.leaderOriginInfo.followers }}</div>
<div class="post-number"> <div class="post-number">
发帖数:  {{ store.activeLeader.leaderOriginInfo.posts }} 发帖数:   {{ store.activeLeader.leaderOriginInfo.posts }}
</div> </div>
</div> </div>
</div> </div>
@ -42,25 +47,25 @@
</div> </div>
</div> </div>
<div class="dialog-content-heat-degree"> <div class="dialog-content-heat-degree">
<div class="heat-item"> <!-- <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
粉丝数量:   {{ store.activeLeader.leaderOriginInfo.followers }} 粉丝数量:   {{ store.activeLeader.leaderOriginInfo.followers }}
</div> </div> -->
<div class="heat-item"> <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
关注数量:{{ store.activeLeader.leaderOriginInfo.followerCount }} 关注数量:   {{ store.activeLeader.leaderOriginInfo.followerCount }}
</div> </div>
<div class="heat-item"> <!-- <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
发帖总数:   {{ store.activeLeader.leaderOriginInfo.posts }} 发帖总数:   {{ store.activeLeader.leaderOriginInfo.posts }}
</div> -->
<div class="heat-item">
<p class="diamond"></p>
贴文被转总数:   {{ store.activeLeader.leaderOriginInfo.labelling[0].transmit }}
</div> </div>
<div class="heat-item"> <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
贴文被转总数: {{ store.activeLeader.leaderOriginInfo.labelling[0].transmit }} 参与互动次数:   {{ store.activeLeader.leaderOriginInfo.interactionCount }}
</div>
<div class="heat-item">
<p class="diamond"></p>
参与互动次数:{{ store.activeLeader.leaderOriginInfo.interactionCount }}
</div> </div>
<div class="heat-item"> <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
@ -73,20 +78,20 @@
</template> </template>
<script setup> <script setup>
import { computed } from "vue"; import { computed } from "vue"
import { useKeyNodeStore2 } from "@/store/keyNodeStore2"; import { useKeyNodeStore2 } from "@/store/keyNodeStore2"
import { Icon } from "@iconify/vue"; import { Icon } from "@iconify/vue"
const store = useKeyNodeStore2(); const store = useKeyNodeStore2()
const isVisible = computed({ const isVisible = computed({
get: () => store.isLeaderDetailDialogVisible, get: () => store.isLeaderDetailDialogVisible,
set: (value) => { set: (value) => {
if (!value) { if (!value) {
store.closeLeaderDetail(); store.closeLeaderDetail()
} }
} }
}); })
</script> </script>
<style scoped> <style scoped>

54
src/views/KeyNodeDiscern/opinionLeader/components/LeaderDetailDialog.vue
View File

@ -1,5 +1,11 @@
<template> <template>
<el-dialog v-model="isVisible" width="640" align-center :show-close="false" class="custom-leader-dialog"> <el-dialog
v-model="isVisible"
:style="{ height: '618px' }"
align-center
:show-close="false"
class="custom-leader-dialog"
>
<!-- <img src="@/assets/images/leaderDialogTitle.png" alt="" class="dialogTitleImg" /> --> <!-- <img src="@/assets/images/leaderDialogTitle.png" alt="" class="dialogTitleImg" /> -->
<!-- 自定义标题栏插槽，包含关闭按钮 --> <!-- 自定义标题栏插槽，包含关闭按钮 -->
<template #header="{ close }"> <template #header="{ close }">
@ -13,7 +19,7 @@
/> />
</div> </div>
</template> </template>
<div class="dialog-content" style="padding: 14px, 23px;"> <div class="dialog-content" style="padding: 14px, 23px">
<div class="dialog-content-leaderInfo"> <div class="dialog-content-leaderInfo">
<img class="leaderInfo-avatar" :src="store.activeLeader.leaderOriginInfo.avatar" alt="" /> <img class="leaderInfo-avatar" :src="store.activeLeader.leaderOriginInfo.avatar" alt="" />
<div class="leaderInfo-message"> <div class="leaderInfo-message">
@ -26,14 +32,16 @@
</div> </div>
<div class="dialog-content-postInfo"> <div class="dialog-content-postInfo">
<div class="post-type"> <div class="post-type">
<img src="@/assets/images/postTag.png" alt=""> <img src="@/assets/images/postTag.png" alt="" />
</div> </div>
<span class="timestamp">{{ store.activeLeader.leaderOriginInfo.labelling[0].time }}</span> <span class="timestamp">{{ store.activeLeader.leaderOriginInfo.labelling[0].time }}</span>
<span class="author">【{{ store.activeLeader.name }}】发布了帖文</span> <span class="author">【{{ store.activeLeader.name }}】发布了帖文</span>
<span class="influence">影响力：{{ store.activeLeader.leaderOriginInfo.labelling[0].influence }}</span> <span class="influence"
>影响力：{{ store.activeLeader.leaderOriginInfo.labelling[0].influence }}</span
>
</div> </div>
<div class="post-bottom-line"> <div class="post-bottom-line">
<img src="@/assets/images/post_bottom_line.png" alt=""> <img src="@/assets/images/post_bottom_line.png" alt="" />
</div> </div>
<div class="dialog-content-post"> <div class="dialog-content-post">
<div class="leader-post-detail-content"> <div class="leader-post-detail-content">
@ -48,13 +56,13 @@
<div class="item-time">{{ item.time }}</div> <div class="item-time">{{ item.time }}</div>
<div class="item-heat-detail"> <div class="item-heat-detail">
<div class="item-heat-like"> <div class="item-heat-like">
<img src="@/assets/images/icon/like_icon.png" alt=""> {{ item.like }} <img src="@/assets/images/icon/like_icon.png" alt="" /> {{ item.like }}
</div> </div>
<div class="item-heat-comment"> <div class="item-heat-comment">
<img src="@/assets/images/icon/commit_icon.png" alt=""> {{ item.comment }} <img src="@/assets/images/icon/commit_icon.png" alt="" /> {{ item.comment }}
</div> </div>
<div class="item-heat-transmit"> <div class="item-heat-transmit">
<img src="@/assets/images/icon/transmit_icon.png" alt=""> {{ item.transmit }} <img src="@/assets/images/icon/transmit_icon.png" alt="" /> {{ item.transmit }}
</div> </div>
</div> </div>
</div> </div>
@ -62,18 +70,18 @@
</div> </div>
</div> </div>
<div class="dialog-content-heat-degree"> <div class="dialog-content-heat-degree">
<div class="heat-item"> <!-- <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
粉丝数量:   {{ store.activeLeader.leaderOriginInfo.followers }} 粉丝数量:   {{ store.activeLeader.leaderOriginInfo.followers }}
</div> </div> -->
<div class="heat-item"> <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
关注数量:   1329 关注数量:   1329
</div> </div>
<div class="heat-item"> <!-- <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
发帖总数:   {{ store.activeLeader.leaderOriginInfo.posts }} 发帖总数:   {{ store.activeLeader.leaderOriginInfo.posts }}
</div> </div> -->
<div class="heat-item"> <div class="heat-item">
<p class="diamond"></p> <p class="diamond"></p>
贴文被转总数:   1329 贴文被转总数:   1329
@ -92,33 +100,33 @@
</template> </template>
<script setup> <script setup>
import { computed, watch } from "vue"; import { computed, watch } from "vue"
import { useKeyNodeStore1 } from "@/store/keyNodeStore1"; import { useKeyNodeStore1 } from "@/store/keyNodeStore1"
const store = useKeyNodeStore1(); const store = useKeyNodeStore1()
console.log('store.activeLeader:', store.activeLeader); console.log("store.activeLeader:", store.activeLeader)
watch( watch(
() => store.activeLeader, () => store.activeLeader,
(newValue) => { (newValue) => {
console.log('store.activeLeader 变化:', newValue); console.log("store.activeLeader 变化:", newValue)
}, },
{ immediate: true } // 立即执行一次 { immediate: true } // 立即执行一次
); )
// 添加关闭弹窗的方法 // 添加关闭弹窗的方法
const handleClose = () => { const handleClose = () => {
store.closeLeaderDetail(); store.closeLeaderDetail()
}; }
const isVisible = computed({ const isVisible = computed({
get: () => store.isLeaderDetailDialogVisible, get: () => store.isLeaderDetailDialogVisible,
set: (value) => { set: (value) => {
if (!value) { if (!value) {
store.closeLeaderDetail(); store.closeLeaderDetail()
} }
} }
}); })
</script> </script>
<style scoped> <style scoped>
@ -152,7 +160,6 @@ const isVisible = computed({
z-index: 10; z-index: 10;
} }
.dialog-content-leaderInfo { .dialog-content-leaderInfo {
width: 100%; width: 100%;
height: 70px; height: 70px;
@ -216,7 +223,6 @@ const isVisible = computed({
border-radius: 4px; border-radius: 4px;
overflow-y: auto; overflow-y: auto;
background: linear-gradient(90deg, #3e607c71 0%, #2f455f62 100%); background: linear-gradient(90deg, #3e607c71 0%, #2f455f62 100%);
} }
.leader-post-detail-content::-webkit-scrollbar { .leader-post-detail-content::-webkit-scrollbar {