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

解决合并冲突

Browse Source
This commit is contained in:
duanhao 2025-07-29 20:19:07 +08:00
commit 48a76d89c3
6 changed files with 46 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/linkPrediction/icon/top-icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 439 B

7
src/service/api/linkPrediction.js
View File

@ -11,7 +11,7 @@ export function getInteractionCommunityNodes() {
}
//人物互动隐关系预测的社团内部节点
export function getInteractionCommunityDetailNodes(ids, time = "2024.05.16 16:56:04") {
export function getInteractionCommunityDetailNodes(ids, time = "2024-05-16 16:56:04") {
return http.get(`linkPrediction/interaction/community_detail?groupIds=${ids}&dateTime=${time}`)
}
@ -43,8 +43,7 @@ export function getInteractionPostList(userGroupId) {
return http.get(`/linkPrediction/triangle/post_list?page=${outoIncrement}`)
} */
// 社交紧密团体的对应紧密关系的帖文--根据relationId来查找
export function getSocialPostListByRelationId(relationId){
export function getSocialPostListByRelationId(relationId) {
return http.get(`/linkPrediction/user_posts_list?relationId=${relationId}`)
}
// 社交紧密团体识别的社团统计
@ -60,7 +59,7 @@ export function getSocialCommunityList() {
// 社交紧密团体中社团内的
// 社交紧密团体的社团内部节点
export function getSocialCommunityDetailNodes(ids, time = "2024-05-16 16:56:04") {
export function getSocialCommunityDetailNodes(ids, time = "2024-05-16 16:56:04") {
return http.get(`/linkPrediction/triangle/community_detail?groupIds=${ids}&dateTime=${time}`)
}

18
src/store/llinkPrediction/index.js
View File

@ -19,18 +19,17 @@ import nodePrefix from "@/assets/images/linkPrediction/icon/node-count-prefix.pn
import communityPrefix from "@/assets/images/linkPrediction/icon/community-count-prefix.png"
import hiddenPrefix from "@/assets/images/linkPrediction/icon/hidden-count-prefix.png"
import tightCommunityPrefix from "@/assets/images/linkPrediction/icon/tightCommunityPrefix.png"
import { init } from "echarts"
export const useCharacterInteractionStore = defineStore("characterInteraction", {
state: () => ({
userList: [], //用户组列表
userChartList: [], //组相关性
posts: [],
communityNodeList: [],
posts: [], //贴文列表
communityNodeList: [], //所有社团数据
curComponent: "CommunityNode",
curSelecedGroupIds: [],
communityDetailNodeList: [],
curSelectedGroup: [],
communityDetailNodeList: [], //点击一级界面后，通过组id查询到的组
curSelectedGroup: [], //从用户组列表选择任意一个item
anlysisList: [
{
id: 1,
@ -173,7 +172,7 @@ export const useCharacterInteractionStore = defineStore("characterInteraction",
if (res.code != 200) return
this.communityNodeList = res.data
},
async initGraphCommunityDetailNode(ids, time = "2024.05.16 16:56:04") {
async initGraphCommunityDetailNode(ids, time = "2024-05-16 16:56:04") {
this.curSelecedGroupIds = ids
const res = await getInteractionCommunityDetailNodes(ids, time)
if (res.code != 200) return
@ -407,7 +406,7 @@ export const useSocialGroupsStore = defineStore("socialGroups", {
}
},
// 获取对应用户组的postList
async getSocialGroupPostListByRelationId(relationId){
async getSocialGroupPostListByRelationId(relationId) {
const res = await getSocialPostListByRelationId(relationId)
if (res.code != 200) return
// console.log("打印对应relationId的帖文列表：", res.data)
@ -435,7 +434,7 @@ export const useSocialGroupsStore = defineStore("socialGroups", {
}))
},
// 传递社交团体的数组，获取其详情
async initGraphCommunityDetailNode(ids, time = "2024-05-16 16:56:04") {
async initGraphCommunityDetailNode(ids, time = "2024-05-16 16:56:04") {
this.curSelecedGroupIds = ids
const res = await getSocialCommunityDetailNodes(ids, time)
if (res.code != 200) return
@ -445,9 +444,8 @@ export const useSocialGroupsStore = defineStore("socialGroups", {
}))
console.log("打印社交团体详情：");
console.log(res.data);
this.timeList = res.data.timeList
this.timeList = res.data.timeList || [];
this.communityDetailNodeList = res.data.userRelation
}
},
persist: true // 开启持久化

1
src/views/LinkPrediction/characterInteraction/index.vue
View File

@ -52,6 +52,7 @@ const interactionStore = useCharacterInteractionStore()
//选择某个用户组，更新贴文列表 && 更新关系图二级界面
const handleSelectedUserGroup = (group) => {
interactionStore.curComponent = "detailNode"
interactionStore.curSelectedGroup = group //保存从用户列表选择的用户组，为了显示这两个用户交互的时间切片
interactionStore.initInteractionPostList(group.relationId)
interactionStore.initGraphCommunityDetailNode(group.list.map((item) => item.groupId))
}

47
src/views/LinkPrediction/components/detailNode.vue
View File

@ -16,6 +16,12 @@
<div class="time-axis">
<div class="time">{{ TansTimestamp(startTime, "YYYY.MM.DD HH:mm:ss") }}</div>
<div class="axis" ref="axisRef" @pointerdown="handlePointerDown">
<div
class="time-section"
v-for="time in curSelectedGroup.timeList"
:key="time"
:style="{ left: getTimeSectionLeft(time) + 'px' }"
></div>
<div class="progress-bar" :style="trackStyle"></div>
<div class="active-sign" :style="{ left: `${currentPosition}px` }">
<div class="active-needle"></div>
@ -30,9 +36,6 @@
</div>
<div class="time">{{ TansTimestamp(endTime, "YYYY.MM.DD HH:mm:ss") }}</div>
</div>
<div class="current-time-display">
<span>当前时间: {{ TansTimestamp(currentTime, "YYYY.MM.DD HH:mm:ss") }}</span>
</div>
</div>
</template>
@ -44,7 +47,7 @@ import * as echarts from "echarts"
import { storeToRefs } from "pinia"
import { useCharacterInteractionStore } from "@/store/llinkPrediction/index"
const interactionStore = useCharacterInteractionStore()
const { communityDetailNodeList } = storeToRefs(interactionStore)
const { communityDetailNodeList, curSelectedGroup } = storeToRefs(interactionStore)
const emit = defineEmits(["click:goback"])
const handleGoback = () => {
emit("click:goback", "CommunityNode")
@ -53,7 +56,7 @@ const handleGoback = () => {
//当点击时间轴的时候，communityDetailNodeList改变，重新更新关系图
watch(
communityDetailNodeList,
(newValue) => {
() => {
initChart()
},
{ deep: true }
@ -73,6 +76,14 @@ const startTimeMs = startTime.value.getTime()
const endTimeMs = endTime.value.getTime()
const totalDuration = endTimeMs - startTimeMs
//点击用户组列表后，显示这两个用户的交互时间切片，获得每一个时间距离时间轴初始位置的距离
const getTimeSectionLeft = computed(() => {
return (time) => {
const total = endTime.value.getTime() - startTime.value.getTime()
const offset = new Date(time).getTime() - startTime.value.getTime()
return Math.max(0, Math.min(426, (offset / total) * 426))
}
})
// 根据位置计算时间
const getTimeFromPosition = (position) => {
const ratio = Math.max(0, Math.min(1, position / axisWidth))
@ -275,7 +286,7 @@ const initChart = async () => {
show: false,
position: "middle",
formatter: function (params) {
return params.data.interactionTimes
return `${params.data.interactionTimes}次互动`
},
fontSize: 14
},
@ -447,6 +458,15 @@ onMounted(() => {
cursor: pointer;
transform: translateZ(0); // 启用硬件加速
position: relative;
.time-section {
position: absolute;
top: -8px;
width: 4px;
height: 22px;
background: #ffe066;
border-radius: 3px;
z-index: 3;
}
.progress-bar {
position: absolute;
top: 0;
@ -501,21 +521,6 @@ onMounted(() => {
}
}
}
.current-time-display {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
background: rgba(0, 67, 125, 0.8);
border: 1px solid #3aa1f8;
border-radius: 4px;
padding: 8px 16px;
color: #fff;
font-family: "PingFang SC";
font-size: 14px;
font-weight: 400;
backdrop-filter: blur(3px);
}
}
}
</style>

15
src/views/LinkPrediction/components/userPanel.vue
View File

@ -9,10 +9,7 @@
:class="{ active: curUserGroupIndex == index }"
>
<div class="group-type">
<img
src="@/assets/images/linkPrediction/title/group-item-title.png"
class="group-type-back"
/>
<img src="@/assets/images/linkPrediction/icon/top-icon.png" class="group-type-back" />
<div class="group-type-content">TOP{{ group.rank }}</div>
</div>
<div class="user-list-item" v-for="child in group.list" :key="child.id">
@ -89,10 +86,14 @@ const handleUserItem = (index, group = {}) => {
top: 10px;
.group-type-content {
position: absolute;
top: 0;
left: 10px;
font-size: 14px;
top: 2px;
left: 12px;
color: #8efbff;
text-shadow: 0 0.552px 1.105px rgba(0, 0, 0, 0.25);
font-family: "PingFang SC";
font-size: 14px;
font-style: normal;
font-weight: 400;
}
}
&:hover {