更新了首页，以及完善家根网的头像显示

Tcsm

2023-08-29 73949e79fdf76615209f72164f601a64a146729b

更新了首页，以及完善家根网的头像显示

 ruoyi-ui/src/assets/images/shouye.png

 ruoyi-ui/src/views/homeRoot/index.vue

@@ -31,152 +31,152 @@
            @click="getPersonInfo(rootList[0].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_1" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[0].url"
            @click="getPersonInfo(rootSecList[0].userId)">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[2].url"
            @click="getPersonInfo(rootSecList[2].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_2" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[0].spouse.url"
            @click="getPersonInfo(rootSecList[0].spouse.userId)">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[0].url"
            @click="getPersonInfo(rootSecList[0].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_3" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[1].url"
             @click="getPersonInfo(rootSecList[1].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_4" v-if="isShow_2">
          <img :src="'http://47.93.189.255:8080/'+ rootSecList[1].url"
            @click="getPersonInfo(rootSecList[1].spouse.userId)">
          <img :src="'http://47.93.189.255:8080/'+ rootSecList[3].url"
            @click="getPersonInfo(rootSecList[3].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_5" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[2].url"
                @click="getPersonInfo(rootSecList[2].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_6" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[2].spouse.url"
                 @click="getPersonInfo(rootSecList[2].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_6" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[0].spouse.url"
                 @click="getPersonInfo(rootSecList[0].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_7" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[3].url"
                 @click="getPersonInfo(rootSecList[3].userId)">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[1].spouse.url"
                 @click="getPersonInfo(rootSecList[1].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_2_8" v-if="isShow_2">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[3].spouse.url"
                 @click="getPersonInfo(rootSecList[3].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_1" v-if="isShow_3">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[4].url"
                 @click="getPersonInfo(rootSecList[4].userId)">
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_1" v-if="isShow_3">-->
<!--            <img :src="'http://47.93.189.255:8080/'+ rootThiList[0].url"-->
<!--                 @click="getPersonInfo(rootThiList[0].userId)">-->
<!--          </el-avatar>-->

          <el-avatar shape="circle" class="avater_3_2" v-if="isShow_3">
            <img :src="'http://47.93.189.255:8080/'+ rootSecList[4].spouse.url"
                 @click="getPersonInfo(rootSecList[4].spouse.userId)">
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_2" v-if="isShow_3">-->
<!--            <img :src="'http://47.93.189.255:8080/'+ rootThiList[0].url"-->
<!--                 @click="getPersonInfo(rootThiList[0].userId)">-->
<!--          </el-avatar>-->

          <el-avatar shape="circle" class="avater_3_3" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_3" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->

          <el-avatar shape="circle" class="avater_3_4" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_4" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->

          <el-avatar shape="circle" class="avater_3_5" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootThiList[0].url"
                 @click="getPersonInfo(rootThiList[0].userId)">
          </el-avatar>

          <el-avatar shape="circle" class="avater_3_6" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_6" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->

          <el-avatar shape="circle" class="avater_3_7" v-if="isShow_4">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_7" v-if="isShow_4">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->

          <el-avatar shape="circle" class="avater_3_8" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootThiList[0].spouse.url"
                 @click="getPersonInfo(rootThiList[0].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_9" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_9" v-if="isShow_3">-->
<!--            <img :src="'http://47.93.189.255:8080/'+ rootThiList[0].spouse.url"-->
<!--                 @click="getPersonInfo(rootThiList[0].spouse.userId)">-->
<!--          </el-avatar>-->
          <el-avatar shape="circle" class="avater_3_10" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootThiList[1].url"
                 @click="getPersonInfo(rootThiList[1].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_11" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_12" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_11" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
<!--          <el-avatar shape="circle" class="avater_3_12" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
          <el-avatar shape="circle" class="avater_3_13" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootThiList[1].spouse.url"
                 @click="getPersonInfo(rootThiList[1].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_14" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootThiList[2].url"
                 @click="getPersonInfo(rootThiList[2].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_15" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootThiList[2].spouse.url"
                 @click="getPersonInfo(rootThiList[2].spouse.userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_16" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_16" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
          <el-avatar shape="circle" class="avater_3_17" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootThiList[3].url"
                 @click="getPersonInfo(rootThiList[3].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_18" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_19" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_20" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
          <el-avatar shape="circle" class="avater_3_21" v-if="isShow_3">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
          <el-avatar shape="circle" class="avater_4_1" v-if="isShow_4">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_3_18" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
<!--          <el-avatar shape="circle" class="avater_3_19" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
<!--          <el-avatar shape="circle" class="avater_3_20" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
<!--          <el-avatar shape="circle" class="avater_3_21" v-if="isShow_3">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
<!--          <el-avatar shape="circle" class="avater_4_1" v-if="isShow_4">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
          <el-avatar shape="circle" class="avater_4_2" v-if="isShow_4">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootFouList[0].url"
                 @click="getPersonInfo(rootFouList[0].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_4_3" v-if="isShow_4">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootFouList[1].url"
                 @click="getPersonInfo(rootFouList[1].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_4_4" v-if="isShow_4">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
            <img :src="'http://47.93.189.255:8080/'+ rootFouList[2].url"
                 @click="getPersonInfo(rootFouList[2].userId)">
          </el-avatar>
          <el-avatar shape="circle" class="avater_4_5" v-if="isShow_4">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
          <el-avatar shape="circle" class="avater_4_6" v-if="isShow_4">
            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"
            ></el-img>
          </el-avatar>
<!--          <el-avatar shape="circle" class="avater_4_5" v-if="isShow_4">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->
<!--          <el-avatar shape="circle" class="avater_4_6" v-if="isShow_4">-->
<!--            <el-img :src="'http://47.93.189.255:8080'+ rootList.url"-->
<!--            ></el-img>-->
<!--          </el-avatar>-->

        </div>
      </div>
@@ -198,9 +198,9 @@
      greeting: "",
      imageSrc: require('../../assets/images/Group 407.png') ,
      dropdownList: [
        { name: '只显示第一代', src: 'Group 445.png' },
        { name: '显示至第二代', src: 'Group 445.png' },
        { name: '显示至第三代', src: 'Group 445.png' },
        { name: '只显示第一代', src: 'Group 407.png' },
        { name: '显示至第二代', src: 'Group 407.png' },
        { name: '显示至第三代', src: 'Group 407.png' },
        { name: '显示全部', src: 'Group 407.png' }
      ],
      rootList:[],
@@ -499,7 +499,7 @@
}
.avater_2_1{
  position: absolute;
  top: 75%;
  top: 73%;
  left: 43%;
  transform: translate(-50%, -50%);
  width: 44px;
@@ -518,7 +518,7 @@
}
.avater_2_3{
  position: absolute;
  top: 67%;
  top: 66%;
  left: 55%;
  transform: translate(-50%, -50%);
  width: 44px;
@@ -528,7 +528,7 @@
}
.avater_2_4{
  position: absolute;
  top: 76%;
  top: 75%;
  left: 59%;
  transform: translate(-50%, -50%);
  width: 36px;
@@ -538,7 +538,7 @@
}
.avater_2_5{
  position: absolute;
  top: 73%;
  top: 72%;
  left: 38%;
  transform: translate(-50%, -50%);
  width: 37px;
@@ -548,7 +548,7 @@
}
.avater_2_6{
  position: absolute;
  top: 62%;
  top: 60%;
  left: 43%;
  transform: translate(-50%, -50%);
  width: 34px;
@@ -558,7 +558,7 @@
}
.avater_2_7{
  position: absolute;
  top: 62%;
  top: 60%;
  left: 59%;
  transform: translate(-50%, -50%);
  width: 35px;
@@ -617,7 +617,7 @@
}
.avater_3_5{
  position: absolute;
  top: 48%;
  top: 51%;
  left: 29%;
  transform: translate(-50%, -50%);
  width: 42px;
@@ -647,8 +647,8 @@
}
.avater_3_8{
  position: absolute;
  top: 22%;
  left: 34%;
  top: 26%;
  left: 33%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 58px;
@@ -666,7 +666,7 @@
}
.avater_3_10{
  position: absolute;
  top: 42%;
  top: 44%;
  left: 43%;
  transform: translate(-50%, -50%);
  width: 41px;
@@ -696,7 +696,7 @@
}
.avater_3_13{
  position: absolute;
  top: 37%;
  top: 40%;
  left: 51%;
  transform: translate(-50%, -50%);
  width: 41px;
@@ -706,7 +706,7 @@
}
.avater_3_14{
  position: absolute;
  top: 33%;
  top: 36%;
  left: 57%;
  transform: translate(-50%, -50%);
  width: 35px;
@@ -716,7 +716,7 @@
}
.avater_3_15{
  position: absolute;
  top: 35%;
  top: 38%;
  left: 64%;
  transform: translate(-50%, -50%);
  width: 38px;
@@ -736,7 +736,7 @@
}
.avater_3_17{
  position: absolute;
  top: 56%;
  top: 59%;
  left: 71%;
  transform: translate(-50%, -50%);
  width: 32px;
@@ -795,7 +795,7 @@
}
.avater_4_2{
  position: absolute;
  top: 23%;
  top: 26%;
  left: 40%;
  transform: translate(-50%, -50%);
  width: 35px;
@@ -805,7 +805,7 @@
}
.avater_4_3{
  position: absolute;
  top: 11%;
  top: 14%;
  left: 46%;
  transform: translate(-50%, -50%);
  width: 47px;
@@ -815,7 +815,7 @@
}
.avater_4_4{
  position: absolute;
  top: 17%;
  top: 20%;
  left: 57%;
  transform: translate(-50%, -50%);
  width: 39px;

 ruoyi-ui/src/views/index.vue

@@ -2,21 +2,6 @@
  <div class="app-container">
    <div class="image-container">
      <img class="bottom-image" src="../assets/images/shouye.png" alt="Bottom Image">
      <el-input
        class="text-box1"
        type="textarea" :rows="6" resize="none"
        placeholder="    参天大树必有其根，万里江河亦有其源。
      普天之下炎黄子孙，脉脉相传，不乏有识之士，栋梁之才。吾等不可忘其先人，亦不可不知我之本源。
      建谱之大事，上可告慰祖先在天之灵，下可使子孙后代有寻根之本。叶脉之于草木、子孙之于前根，血管之于人体，依托技术输送事件，供给经验，谱写根根相传一路走来的非凡。"
      ></el-input>
      <el-input
        class="text-box2"
        type="textarea" :rows="18" resize="none"
        placeholder="    家，是我们生命的驿站、漂泊的归所。
      众所周知，自从有了赖以生存的小家庭，家庭成员就有了成长的轨迹、学习的轨迹、工作的轨迹、生活的轨迹。家庭中每一人每一物都谱写着家庭的辉煌轨迹。让我们用 “本都都” 来收藏每个家族、每个家庭、每个人甜蜜昨天，记录幸福今天，拥抱美好明天。让我们真正感受生命诞生的欢声笑语，人生奋斗的酸甜苦辣，膝下弄儿的幸福温馨。
      活在当下，步履匆匆。当您在外地漂泊而急需某些必须的证明材料时；当您在使用某件物品需要帮助时；当您身心疲倦时；当您急于为自己整理健康日记时；当您在某个瞬间又回忆起亲人的笑貌时.......您不妨打开身边的 “本都都” ，细细地品味“本都都”记录的每一轨迹答案：原来可以在 “本都都” 收获材料证明；播放的那已经泛黄的照片、证书，唤起了往日旧时相知、如今已漂泊天涯的挚友；一本邮票、一沓标本，记录的是您那别样的童趣；手拿着孩子的出生证明，更是禁不住泪水打湿眼眶，如今事业有成的子女们似乎又变回那个天真烂漫的孩子；您的房产证、土地证、结婚证、健康报告、百年心愿...，或许在将来某个时间“本都都”能成为您维护权益的保障，抑或是留给子女的一份财富。
      希望 “本都都” 能成为助推您事业成功、家庭幸福、人生美满的好帮手！"
      ></el-input>
    </div>

  </div>

 ruoyi-ui/src/views/mindMap/index.vue

@@ -4,9 +4,7 @@
    <div class="image-container">
      <img class="top-image" src="../../assets/images/zhang.png" alt="Top Image">
    </div>


            <superMindmap v-if="showMindMap" :active='active' :data="mapData" @activeChange="activeChange"/>
  <superMindmap  v-if="showMindMap" :active='active' :data="mapData" @activeChange="activeChange" class="mind-map-container"/>

  </div>
</template>
@@ -60,7 +58,6 @@
                        }
                    )
                },


    setGreeting() {
      const currentTime = new Date();
@@ -129,64 +126,6 @@
      return data;
    },

    drawMindMap() {
      const mindMapData = this.rootList[0]; // 从rootList中获取数据
      console.log(mindMapData)
      // 清除现有的SVG元素
      // d3.select("#mind-map svg").remove();

      // // 创建一个新的 div 元素作为包裹思维导图的容器
      // const mindMapContainer = document.createElement("div");
      // mindMapContainer.setAttribute("id", "mind-map-container");
      // mindMapContainer.style.position = "absolute";
      // mindMapContainer.style.top = "0";
      // mindMapContainer.style.left = "0";
      // mindMapContainer.style.width = "100%";
      // mindMapContainer.style.height = "100%";
      // mindMapContainer.style.zIndex = "1";

      // // 将思维导图容器插入到 image-container 中
      // document.querySelector(".image-container").appendChild(mindMapContainer);

      // // 创建SVG元素，设置宽度和高度
      // const svg = d3.select("#mind-map-container")
      //   .append("svg")
      //   .attr("class", "svg-container") // 添加 className
      //   .attr("width", "100%")
      //   .attr("height", "100%");

      // // 创建根节点
      // const root = d3.hierarchy(mindMapData);
      // const treeLayout = d3.tree().size([500, 400]); // 设置树状布局的尺寸
      // treeLayout(root);

      // // 创建链接线
      // svg.selectAll(".link")
      //   .data(root.descendants().slice(1))
      //   .enter()
      //   .append("path")
      //   .attr("class", "link")
      //   .attr("d", d => {
      //     return "M" + d.x + "," + d.y + "C" + (d.x + d.parent.x) / 2 + "," + d.y + " " +
      //       (d.x + d.parent.x) / 2 + "," + d.parent.y + " " + d.parent.x + "," + d.parent.y;
      //   });

      // // 创建节点
      // const nodes = svg.selectAll(".node")
      //   .data(root.descendants())
      //   .enter()
      //   .append("g")
      //   .attr("class", "node")
      //   .attr("transform", d => "translate(" + d.x + "," + d.y + ")");

      // nodes.append("circle")
      //   .attr("r", 10);

      // nodes.append("text")
      //   .attr("dx", 12)
      //   .attr("dy", 5)
      //   .text(d => d.data.nickName);
    }
  }
};
</script>
@@ -198,15 +137,19 @@
}

.image-container {
  position: absolute;
  width: 100%;
  height: 100%;
  /*position: absolute;*/
  position: fixed;
  margin-left: -10px;
  width: 90%;
  height: 90%;
  z-index: -1;
}

.mind-map-container{
  z-index: 2;
  opacity: 0.5;
  opacity: 0.8;
  /*margin-top: 200px;*/
  background-color: transparent;
}
.top-image {
  width: 100%;
@@ -215,7 +158,4 @@
  position: static;
  opacity: 0.8;
}



</style>