修改了代码

feige

2025-12-22 f43ef0c77c6f437bd0f7459d75168e6f77e334bb

 ruoyi-ui/src/views/bignote/familyeventInfo.vue

@@ -2,7 +2,7 @@
  <div class="app-container" id="printable-content">
    <div class="form-header mt">
      <h1 style="font-size:21px;padding-top:30px;display: flex;justify-content: space-between;align-items: center;" >
        <span>家大事记详情</span>
        <span>事纪</span>
        <div style="display: flex; align-items: center;">
          <el-button size="mini" type="text"  v-print="'#printable-content'" v-hasPermi="['person:information:memo']">
            <div class="form" ><el-icon  style="padding-right:100px;"></el-icon>
@@ -18,10 +18,36 @@
        <el-input v-model="formData.title" placeholder="请输入标题" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
      </el-form-item>

      <el-form-item label="人物" prop="people">
      <!-- <el-form-item label="人物" prop="people">
        <el-input v-model="formData.people" placeholder="请输入人物" clearable :style="{width: '100%'}" :disabled="dsb">
        </el-input>
        </el-input> -->

        <el-form-item label="家族成员" prop="selectedMemberIds">
        <!-- 已选成员回显区域 -->
        <div v-if="selectedMemberNames.length > 0" class="selected-members">
          <el-tag
            v-for="(name, index) in selectedMemberNames"
            :key="index"
            closable
            @close="handleTagClose(index)"
          >
            {{ name }}
          </el-tag>
        </div>
        <!-- 触发弹窗按钮 -->
         <div style="display: flex; align-items: center;" v-if="!dsb" >
        <el-button
          type="primary"
          icon="el-icon-user-plus"
          @click="openMemberDialog"
          :disabled="loading"
        >
          选择家族成员
        </el-button>
         </div>
      </el-form-item>


      <el-form-item label="地点" prop="address">
        <el-input v-model="formData.address" placeholder="请输入地点" clearable :style="{width: '100%'}" :disabled="dsb">
        </el-input>
@@ -31,7 +57,14 @@
                        :editable="false" :clearable="false" :style="{width: '100%'}" :disabled="dsb" value-format="yyyy-MM-dd"
        ></el-date-picker>
      </el-form-item>
        <el-form-item label="是否隐藏" prop="isHide">

          <el-radio-group v-model="formData.isHide" :style="{width: '100%'}">
            <el-radio label="是">是</el-radio>
            <el-radio label="否">否</el-radio>
          </el-radio-group>

     </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="formData.remark" placeholder="请输入备注" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
      </el-form-item>
@@ -41,7 +74,7 @@
<!--      </el-form-item>-->
    <!--    :http-request="requestUpload" -->

      <h4 class="form-header">相关图片 </h4>
      <h4 class="form-header">相关图片</h4>
      <el-upload
        action="#"
        list-type="picture-card"
@@ -199,6 +232,60 @@
    <el-dialog  :visible.sync="dialogVisible">
      <img w-full :src="dialogImageUrl"    style="width: 100%; height: 100%" alt="Preview Image" />
    </el-dialog>



    <el-dialog
      :visible.sync="memberDialogVisible"
      title="选择家族成员"
      width="50%"
      :close-on-click-modal="false"
    >
      <!-- 弹窗内容区 -->
      <div class="member-dialog-content">
        <!-- 搜索框 -->
        <el-input
          v-model="memberSearch"
          placeholder="搜索成员姓名..."
          prefix-icon="el-icon-search"
          style="margin-bottom: 20px;"
        ></el-input>



        <!-- 加载状态 -->
       <div v-if="loading" class="loading-container">
          <el-loading-spinner></el-loading-spinner>
          <p>加载家族成员中...</p>
        </div>

       <div v-else-if="familyMembers.length === 0" class="no-data">
          <el-empty description="暂无家族成员数据"></el-empty>
        </div>
<label v-for="item in familyMembers" :key="item.userId" class="signature-checkbox">
     <input type="checkbox" v-model="selectedMemberIds" :value="item.userId">
                                 <span>{{ item.oldName }}</span>
                  </label>
        <!-- 多选列表（有数据） -->
<!--    <el-checkbox-group>
         <el-checkbox


          >
          4545

         </el-checkbox>
        </el-checkbox-group> -->

</div>
      <!-- 弹窗底部按钮 -->
      <div slot="footer" class="dialog-footer">
        <el-button @click="memberDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="confirmMemberSelection">确认选择</el-button>
      </div>
    </el-dialog>


  </div>
</template>

@@ -208,12 +295,21 @@
import errorCode from "@/utils/errorCode";
import {Message} from "element-ui";
import { getFamilyeventInfo, updateFamilyevent, uploadPic, download} from "@/api/bignote/index";
import { getFamilyMembers } from '@/api/root'; // 假设获取家族成员的API

export default {
  components: {},
  props: [],
  data() {
    return {

      // 成员多选相关
      memberDialogVisible: false, // 弹窗可见性
      familyMembers: [], // 家族成员列表（原始数据）
      selectedMemberIds: [], // 弹窗中临时选中的成员ID（用于多选交互）
      displayMemberNames: [], // 显示用的成员名称数组
      memberSearch: '', // 成员搜索关键词
      loading: false, // 加载状态
      cdi:"家庭大事记信息",
      udi:"家庭大事记修改",

@@ -273,11 +369,38 @@
      typeOptions: [],
    }
  },
  computed: {},
  computed: {
       // 已选成员姓名（用于回显）
       selectedMemberNames() {
       //  alert(this.familyMembers.length)
        // 优先使用直接设置的显示名称
        if(this.displayMemberNames && this.displayMemberNames.length > 0) {
          return this.displayMemberNames;
        }
        // 否则根据选中的ID计算
        return this.familyMembers
          .filter(member => this.selectedMemberIds.includes(member.userId))
         .map(member => member.oldName);
      },
    // 过滤后的成员列表（搜索功能）
    filteredMembers() {
      if (!this.memberSearch) return this.familyMembers;
      console.log(this.familyMembers)
      console.log("-sdf")
      const keyword = this.memberSearch.toLowerCase();
      return this.familyMembers;
      //.filter(member =>
     //   member.filteredMembers.toLowerCase().includes(keyword)
        //||
     //   member.role.toLowerCase().includes(keyword)
    //  );
    }
  },
  watch: {},
  created() {
    const id = this.$route.params && this.$route.params.id;
    let jd;

    if(this.$route.query.detail!=undefined)
    {
      jd =  this.$route.query.detail
@@ -285,11 +408,11 @@
      this.dsb = !jd
      this.isShow=true
     // document.title = "修改大事记详细信息";
      this.$route.meta.title = "修改大事记详细信息";//列表的名称
      this.$route.meta.title = "修改事纪详细信息";//列表的名称
    }
    else{
    //  document.title = "家大事记详细信息";
      this.$route.meta.title = "家大事记详细信息";//列表的名称
      this.$route.meta.title = "家事纪详细信息";//列表的名称
      this.btn = false;
      this.isShow=false
     //       alert(this.btn)
@@ -310,10 +433,18 @@
      //   alert(pth)
            if (_this.fot.includes(pth) === true)
         {
            if(paths[i][0]=="/")
              _this.fileList.push({name:paths[i],url: process.env.VUE_APP_BASE_TRUE_API+paths[i].substr(1),res:false})
           else
              _this.fileList.push({name:paths[i],url: process.env.VUE_APP_BASE_TRUE_API+paths[i],res:false})
        if(paths[i].includes(process.env.VUE_APP_BASE_TRUE_API)){
          if(paths[i][0]=="/")
                _this.fileList.push({name:paths[i],url: paths[i].substr(1),res:false})
          else
             _this.fileList.push({name:paths[i],url: paths[i],res:false})
        }else{
          if(paths[i][0]=="/")
                _this.fileList.push({name:paths[i],url: process.env.VUE_APP_BASE_TRUE_API+paths[i].substr(1),res:false})
          else
             _this.fileList.push({name:paths[i],url: process.env.VUE_APP_BASE_TRUE_API+paths[i],res:false})
        }

           }
            else {
              // alert(paths[i])
@@ -330,11 +461,66 @@
      //  _this.fileList1 = _this.fileList
        }
        this.loading = false;
        this.splitPeopleToSelectedNames(this.formData.people); // 初始化时处理已选成员
      });
    }
    console.log(this.fileList,'fileListfilelllllllllllll')
    console.log(this.fileListOther,'fileListOtherfileListOtherfileListOther')
  },
  mounted() {},
  methods: {
    splitPeopleToSelectedNames(people) {
      // 处理逻辑：
      // 1. 判断 people 是否存在且为字符串，避免报错
      if (!people || typeof people !== "string") {
        this.displayMemberNames = [];
        return;
      }
      console.log(people.split(","))
      // 2. 按逗号分割字符串，去除每个元素的前后空格，过滤空值（如连续逗号的情况）
      this.displayMemberNames = people.split(",")
      // people
        //.split(",") // 按逗号分割为数组
        //.map((name) => name.trim()) // 去除每个元素的前后空格
      //  .filter((name) => name); // 过滤空字符串（处理 "a,,b" 这类情况）
      console.log(this.displayMemberNames)
    },
      // 打开成员多选弹窗
      async openMemberDialog() {
      this.memberDialogVisible = true;
      this.memberSearch = ''; // 重置搜索
      // 初始化弹窗选中状态（回显已选成员）
  //    this.selectedMemberIds = [...this.familyForm.selectedMemberIds];
      // 加载家族成员列表
      await this.loadFamilyMembers();
    },
        // 加载家族成员列表
        async loadFamilyMembers() {
      this.loading = true;

      let clanId = this.$store.state.user.clanId
      try {
        const res = await getFamilyMembers(clanId); // 假设需要家族ID参数


    console.log(res)
    console.log(res.data)
       this.familyMembers = res.data;
       console.log(this.familyMembers)
       console.log(this.familyMembers.length)
       // console.log(this.familyMembers.length)
      //  console.log(this.familyMembers.length)
       // console.log(this.familyMembers[0])
        // for(let i=0; i < this.familyMembers.length; i++)
        //   console.log(this.familyMembers[i])
        // console.log("---999")
        // 格式：[{ id: 1, name: '张三', role: '家长', relation: '父子', avatar: 'xxx' }, ...]
      } catch (err) {
        this.$message.error('加载家族成员失败，请重试');
      } finally {
        this.loading = false;
      }
    },
    getData(){
          const id = this.$route.params && this.$route.params.id;
          let _this = this
@@ -497,7 +683,7 @@
      // this.dialogFileUrl = 'https://47.93.189.255:8080/profile/upload/2023/03/19/test7_20230319222030A007.jpg'
      if(this.dialogFileUrl.includes("47.93.189.255")==true)
        this.dialogFileUrl = this.dialogFileUrl.replace("47.93.189.255","www.bendudu.com")
      //alert(this.dialogFileUrl)
      // alert(this.dialogFileUrl)
      const Base64 = require('js-base64').Base64

      this.desurl = process.env.VUE_APP_BASE_OTHER_API+"preview/"+'onlinePreview?url='+encodeURIComponent(Base64.encode(this.dialogFileUrl));
@@ -509,7 +695,7 @@
    },
    handleDownload(url) {
      var formData = {'path':"/"+url.replace(process.env.VUE_APP_BASE_TRUE_API,"")};

      alert(formData['path'])
      let lens = formData.path.split(".")
      let suffix = lens[lens.length-1]
      download(formData).then(async (response) => {
@@ -581,21 +767,16 @@
   },
   picUpload()
   {

      var formData = new FormData();
      //this.$refs.upload.submit();
      //alert(this.uploadFileList.length)
   if(this.uploadFileList.length==0){
        this.$modal.msgSuccess("图像上传列表不能为空！");
        return}

      this.uploadFileList.forEach((elem)=>{
         formData.append("files", elem)

      })
      let _this = this


        uploadPic(formData).then(response => {
         // console.log(response.originalFilenames)
         // console.log(response.urls)
@@ -617,19 +798,15 @@
      //console.log(_this.fileList)
   //   alert(response.fileNames)
          _this.formData.url = _this.formData.url+","+response.fileNames

      _this.uploadFileList = []
          _this.uploadFileList = []
         // alert(87)
          updateFamilyevent(_this.formData).then(response => {
            _this.$modal.msgSuccess("图片上传成功");

            // this.open = false;

          });
        // }
        // else{
        //   _this.fileListOther.push({name:response.data.fileName, url:response.data.url})

        // }
      });
   },