Merge branch 'master' of http://172.16.20.1:3000/duanhao/SocialNetworks_duan

2025-07-31 16:14:02 +08:00 · 2025-07-31 16:14:02 +08:00 · d38296b160
commit d38296b160
parent 982a8c98e2 960130fba1
6 changed files with 97 additions and 39 deletions
--- a/src/service/api/linkPrediction.js
+++ b/src/service/api/linkPrediction.js
@ -68,11 +68,22 @@ export function getSocialCommunityList() {
  return http.get(`/linkPrediction/triangle/community`)
 }

-// 社交紧密团体中社团内的
-
+// 社交紧密团体中社团内的社团内部节点 从用户组中点击，只显示这两个用户的关系
+export function getSocialCommunityDetailFromUserGroup(
+  relationId,
+  time = "2024-05-16 16:56:04"
+) {
+  return http.get(`/linkPrediction/user_detail?relationId=${relationId}&time=${time}`)
+}
 // 社交紧密团体的社团内部节点
-export function getSocialCommunityDetailNodes(ids, time = "2024-05-16 16:56:04") {
-  return http.get(`/linkPrediction/triangle/community_detail?groupIds=${ids}&dateTime=${time}`)
+export function getSocialCommunityDetailNodes(ids, relationId, time = "2024-05-16 16:56:04") {
+  if (relationId != -1) {
+    return http.get(
+      `/linkPrediction/triangle/community_detail?groupIds=${ids}&dateTime=${time}&relationId=${relationId}`
+    )
+  } else {
+    return http.get(`/linkPrediction/triangle/community_detail?groupIds=${ids}&dateTime=${time}`)
+  }
 }

 //获取人物社交隐关系预测社团节点
--- a/src/store/llinkPrediction/index.js
+++ b/src/store/llinkPrediction/index.js
@ -221,11 +221,17 @@ export const useSocialGroupsStore = defineStore("socialGroups", {
    curComponent: "CommunityNode",
    curSelecedGroupIds: [],
    communityDetailNodeList: [],
+    // 社交紧密团体的所有用户
+    communityAllNodeList: [],
    timeList: [],
    // 当前需要高亮的用户id
    curHighlightUserIdList: [],
+    // 当前的relationId
+    curRelationId: "",
    // 记录点击边的时序列表
    clickEdgeTimeList: [],
+    // 记录是从边点的还是列表项中的点击
+    clickEvent: "list", // list 表示从列表项点的， edge 表示从边点的
    statisticsList: [
      { id: 1, icon: nodePrefix, name: "节点数", key: "nodesCount" },
      { id: 2, icon: communityPrefix, name: "社团数", key: "groupCount" },
@ -451,15 +457,29 @@ 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", relationId = -1) {
      this.curSelecedGroupIds = ids
-      const res = await getSocialCommunityDetailNodes(ids, time)
+      const res = await getSocialCommunityDetailNodes(ids, relationId, time)
      if (res.code != 200) return
+      console.log("index.js:",res.data)
+      const customStatisticsObj = Object.assign({}, res.data.communityStatistics)
+      //计算两个用户是否同属与同一个社团
+      if (
+        customStatisticsObj.groupCount == null &&
+        customStatisticsObj.hiddenInteractionCount == null
+      ) {
+        customStatisticsObj.hiddenInteractionCount = 1
+        customStatisticsObj.groupCount = ids[0] === ids[1] ? 1 : 3
+      }
+
      this.statisticsDetailList = this.statisticsDetailList.map((item) => ({
        ...item,
-        count: res.data.communityStatistics[item.key]
+        count: customStatisticsObj[item.key]
      }))
+      // 设置社交紧密团体的所有用户id
+      this.communityAllNodeList = res.data.userList
      this.communityDetailNodeList = res.data.userRelation
+      this.curHighlightUserIdList = res.data.predictNodes
    },

    // 修改timeList
@ -468,10 +488,10 @@ export const useSocialGroupsStore = defineStore("socialGroups", {
    },
    // 点击边，先获取需要的timeList
    async getClickEdgeTimeList(ids, time = "2024-05-16 16:56:04") {
-      const res = await getSocialCommunityDetailNodes(ids, time)
+      const relationId = -1
+      const res = await getSocialCommunityDetailNodes(ids, relationId, time)
      if (res.code != 200) return
      console.log("3.获取边中的timelist并设置成它")
-      this.curHighlightUserIdList = res.data.predictNodes
      this.setTimeList(res.data.timeList)
    }
  },
--- a/src/views/LinkPrediction/socialGroups/components/detailNode.vue
+++ b/src/views/LinkPrediction/socialGroups/components/detailNode.vue
@ -26,10 +26,10 @@
        >
          <div
            class="time-sign"
-            :class="{ active: isTimeSignActive(time.timeStr) }"
            :style="{ left: `${time.position}px` }"
            @click="handleTimePointClick(time.timeStr)"
-          ></div>
+          >
+          </div>
        </el-tooltip>
        <div class="active-sign" :style="{ left: `${currentPosition}px` }">
          <div class="active-needle"></div>
@ -61,6 +61,9 @@ const socialGroupsStore = useSocialGroupsStore()
 const { communityDetailNodeList } = storeToRefs(socialGroupsStore)
 const { timeList } = storeToRefs(socialGroupsStore)
 const { curHighlightUserIdList } = storeToRefs(socialGroupsStore)
+// 用于监听是从 列表 点进来的还是从 边 点进来的
+const { clickEvent } = storeToRefs(socialGroupsStore)
+
 const chartsData = ref({})

 const emit = defineEmits(["click:goback"])
@ -82,11 +85,14 @@ watch(
  (newHiglightUserIdList) => {
    if(newHiglightUserIdList.length!=0) {
      nextTick(()=> {
-        console.log(newHiglightUserIdList)
        highLightUserNodes(newHiglightUserIdList)
      })
    }
-  }
+  },
+  { 
+    deep: true,
+    immediate: true
+   }
 )

 // 时间轴相关数据
@ -135,9 +141,9 @@ watch(timePointsWithPositions, (newTimePoints) => {
 }, { immediate: true })

 // 判断当前时间点是否激活
-const isTimeSignActive = (timeStr) => {
+/* const isTimeSignActive = (timeStr) => {
  return new Date(timeStr).getTime() === currentTime.value.getTime()
-}
+} */

 // 添加时间点点击事件处理函数
 const handleTimePointClick = (timeStr) => {
@ -170,7 +176,11 @@ const handlePointerDown = (e) => {

  // 点击后输出当前时间
  const currentTimes = TansTimestamp(currentTime.value, "YYYY-MM-DD HH:mm:ss")
-  socialGroupsStore.initGraphCommunityDetailNode(socialGroupsStore.curSelecedGroupIds, currentTimes)
+  if(socialGroupsStore.curRelationId === "") {
+    socialGroupsStore.initGraphCommunityDetailNode(socialGroupsStore.curSelecedGroupIds, currentTimes)
+  } else {
+    socialGroupsStore.initGraphCommunityDetailNode(socialGroupsStore.curSelecedGroupIds, currentTimes, socialGroupsStore.curRelationId)
+  }
 }

 // 时间点指针按下事件
@ -195,7 +205,11 @@ const handlePointPointerDown = (e) => {
    isDragging.value = false
    // 拖动结束时输出当前时间
    const currentTimes = TansTimestamp(currentTime.value, "YYYY-MM-DD HH:mm:ss")
-    socialGroupsStore.initGraphCommunityDetailNode(socialGroupsStore.curSelecedGroupIds, currentTimes)
+    if(socialGroupsStore.curRelationId === "") {
+      socialGroupsStore.initGraphCommunityDetailNode(socialGroupsStore.curSelecedGroupIds, currentTimes)
+    } else {
+      socialGroupsStore.initGraphCommunityDetailNode(socialGroupsStore.curSelecedGroupIds, currentTimes, socialGroupsStore.curRelationId)
+    }

    document.removeEventListener("pointermove", handlePointerMove)
    document.removeEventListener("pointerup", handlePointerUp)
@ -234,30 +248,36 @@ const initChart = async () => {
    else return 1
  }
  if (!Object.keys(socialGroupsStore.communityDetailNodeList).length) return
-  Object.entries(socialGroupsStore.communityDetailNodeList).forEach(([parentId, children]) => {
+  // 先获取到所有节点
+  socialGroupsStore.communityAllNodeList.forEach((item) => {
    nodes.push({
-      id: `parent_${parentId}`,
-      name: parentId
+      id: item.userId,
+      name: item.userName,
+      symbolSize: 40,
+      postNum: item.postNum,
+      fancy: item.fans
    })
+  })
+  Object.entries(socialGroupsStore.communityDetailNodeList).forEach(([parentId, children]) => {
    children.forEach((child) => {
-      if (!nodes.some((n) => n.id === child.id)) {
-        nodes.push(child)
-      }
      links.push({
-        source: `parent_${parentId}`,
+        source: parentId,
        target: child.id,
        edge: child.isHidden ? 1 : 0,
        interactionTimes: child.interactionTime,
        lineStyle: {
          width: child.isHidden ? 4 : edgeWidth(child.interactionTime),
-          color: child.isHidden ? "#37ACD7" : "#37ACD7", // 无互动=灰色，有互动=黄色
+          color: child.isHidden ? "#FF5E00" : "#37ACD7", // 无互动=灰色，有互动=黄色
          type: child.isHidden ? "dashed" : "solid" // 无互动=实线，有互动=虚线
        }
      })
+      
+      
    })
  })

-  if(curHighlightUserIdList.value && curHighlightUserIdList.value.length >= 2) {
+  // 强行加边
+  /* if(curHighlightUserIdList.value && curHighlightUserIdList.value.length >= 2) {
    // 获取timeList的最后一个时间
    const lastTimeStr = Array.isArray(timeList.value) && timeList.value.length > 0 
      ? timeList.value[timeList.value.length - 1] 
@ -296,7 +316,7 @@ const initChart = async () => {
        }
      }
    }
-  }
+  } */

  chartsData.value = { links, nodes }
  const data = { links, nodes }
@ -385,7 +405,8 @@ const initChart = async () => {
                    flex-direction: column;
                    ">
                <div style="color:#fff;letter-spacing: 0.14px;">
-                    <div >用户ID：${params.data.id}</div>
+                    <div >用户名：${params.data.id}</div>
+                    <div >用户名：${params.data.name}</div>
              </div>
            </div>`
        }
@ -396,7 +417,7 @@ const initChart = async () => {
      show: false,
      position: "middle",
      formatter: function (params) {
-        return params.data.interactionTimes
+        return `${params.data.interactionTimes}次互动`
      },
      fontSize: 14
    },
@ -477,7 +498,9 @@ const highLightUserNodes = (newHiglightUserIdList) => {
  setTimeout(() => {
    //等待所有节点添加完毕后再查找
    newHiglightUserIdList.forEach((id) => {
-      const index = chartsData.value.nodes.findIndex((node) => node.id === `parent_${id}`)
+      const index = chartsData.value.nodes.findIndex((node) => node.id === id)
+      console.log(index);
+      
      if (index != -1) {
        chart.dispatchAction({
          type: "highlight",
@ -619,10 +642,7 @@ onMounted(() => {
          height: 30px;
          background: transparent;
        }
-        &.active {
-          opacity: 0;
-          pointer-events: none;
-        }
+        
      }
      .active-sign {
        position: relative;
--- a/src/views/LinkPrediction/socialGroups/components/graph.vue
+++ b/src/views/LinkPrediction/socialGroups/components/graph.vue
@ -31,16 +31,19 @@ const handleClickNode = async (nodeInfo) => {
  // 点击节点
  socialGroupsStore.initGraphCommunityDetailNode([nodeInfo.id])
  socialGroupsStore.curComponent = "detailNode"
+  socialGroupsStore.curRelationId = ""
 }

 const handleClickEdge = async (edgeInfo) => {
  console.log("点击边");
  socialGroupsStore.curComponent = "detailNode"
+  socialGroupsStore.clickEvent = "edge"
+  socialGroupsStore.curRelationId = ""
  // 先设置socialGroupsStore.clickEdgeTimeList
-  console.log("1.初始化获取边中的详情节点-initGraphCommunityDetailNode");
-  await socialGroupsStore.initGraphCommunityDetailNode([edgeInfo.source, edgeInfo.target])
-  console.log("2.获取边中的timelist并设置");
  await socialGroupsStore.getClickEdgeTimeList([edgeInfo.source, edgeInfo.target])
+  const lastTime = socialGroupsStore.timeList[socialGroupsStore.timeList.length - 1]
+  await socialGroupsStore.initGraphCommunityDetailNode([edgeInfo.source, edgeInfo.target], lastTime)
+  
 }

 const handleClickGoBack = (currentComponentName) => {
--- a/src/views/LinkPrediction/socialGroups/components/userPanel.vue
+++ b/src/views/LinkPrediction/socialGroups/components/userPanel.vue
@ -59,7 +59,7 @@ const props = defineProps({
    default: 480
  }
 });
-
+// ssss
 const handleUserItem = (index, group = {}) => {
  curUserGroupIndex.value = index;
  // 设置需要高亮的用户id
--- a/src/views/LinkPrediction/socialGroups/index.vue
+++ b/src/views/LinkPrediction/socialGroups/index.vue
@ -81,12 +81,16 @@ const postDialog = ref(false);
 //当前选中的贴文数据
 const currentPostPost = ref(null);

+// 列表项的点击事件
 const handleSelectedUserGroup = (group) => {
  socialGroupsStore.curComponent = "detailkNode"
+  socialGroupsStore.clickEvent = "list"
+  console.log("点击列表group：",group)
  const groupIds = group.list.map((item)=>item.groupId)
+  socialGroupsStore.curRelationId = group.relationId //保存当前点击的relationid，为了区分到底是从哪点进二级界面的
  const length = group.timeList.length
  const lastTime = group.timeList[length - 1]
-  socialGroupsStore.initGraphCommunityDetailNode(groupIds, lastTime)
+  socialGroupsStore.initGraphCommunityDetailNode(groupIds, lastTime, group.relationId)
  socialGroupsStore.setTimeList(group.timeList)
  socialGroupsStore.getSocialGroupPostListByRelationId(group.relationId)
 };