修改了代码

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,14 +74,14 @@
<!--      </el-form-item>-->
    <!--    :http-request="requestUpload" -->

      <h4 class="form-header">相关图片 </h4>
      <h4 class="form-header">相关图片</h4>
      <el-upload
        action="#"
        list-type="picture-card"
        multiple
      ref="upload"
              :show-file-list="true"
 :http-request="requestUpload" 
 :http-request="requestUpload"
        :file-list="fileList"
      :on-change="handleChange"
     :auto-upload="false"
@@ -56,7 +89,7 @@
        :class="{ hide: !btn }"

      >
	  

  <!--      <div v-if="uploading" class="upload-status">正在上传...</div> -->
        <i v-if="!uploading" slot="default" class="el-icon-plus"></i>
        <div slot="file" slot-scope="{file}">
@@ -105,29 +138,29 @@
                @click="picUpload"
              >上传到服务器</el-button>
      <h4 class="form-header">其他附件 </h4>
	  

<!--      <el-upload
            action="#"
            list-type="picture-card"
            multiple
           ref="upload"
	  		
     :http-request="requestUpload" 

     :http-request="requestUpload"
            :file-list="fileList"
          :on-change="handleChange"
          :auto-upload="false"
            :disabled="!btn"
            :class="{ hide: !btn }"
	  

          >
     -->
	  

      <el-upload
        action="#"
        multiple
        list-type="picture-card"
                 ref="upload1"
 
   :on-remove="handleRemoveFile"
        :http-request="requestUpload1"
             :file-list="fileListOther"
      :on-change="handleChange1"
@@ -136,7 +169,7 @@

        :class="{ hide: !btn }"
      >
<!-- 
<!--
        <div v-if="uploading" class="upload-status">正在上传...</div> -->
        <i v-if="!uploading" slot="default" class="el-icon-plus"></i>
        <div slot="file" slot-scope="{file}">
@@ -150,7 +183,7 @@
          ></video>
          <img v-else
               class="el-upload-list__item-thumbnail"
               :src="file.url"
               src="../../assets/images/deviceLis.png"
               alt=""
               style="width: 100%; height: 100%"
               fit="cover">
@@ -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:"家庭大事记修改",

@@ -225,6 +321,7 @@
      fileListOther:[

      ],
      fileListOther1:[],
      fot:['.bmp','.jpg','.jpeg','.png','.tif','.gif','.pcx','.tga','.exif','.fpx',
        '.svg','.psd','.cdr','.pcd','.dxf','.ufo','.eps','.ai','.aw','.WMF','.webp','.apng'],
      dsb:true,
@@ -238,8 +335,9 @@
        people: undefined,
        address: undefined,
        remark: undefined,
        url: undefined,
        url: "",
      },
     ID: undefined,
      dialogImageUrl: '',
      url1:undefined,
      dialogVisible: false,
@@ -271,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
@@ -283,20 +408,21 @@
      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)
    }

   this.ID = id;
    let _this = this
    if (id) {
      this.loading = true;
      getFamilyeventInfo(id).then((response) => {
        // console.log(response,'666666666')
        this.formData = response.data;
        let paths = this.formData.url.split(",");
        for(let i = 0; i < paths.length; i++)
@@ -307,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])
@@ -321,26 +455,117 @@
              _this.fileListOther.push({name:nm, url: process.env.VUE_APP_BASE_TRUE_API+paths[i].substr(1),res:false})
            else
            _this.fileListOther.push({name:nm, url: process.env.VUE_APP_BASE_TRUE_API+paths[i],res:false})
				

         }
          }
      //  _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
          if (id) {
            this.loading = true;
            getFamilyeventInfo(id).then((response) => {
              // console.log(response,'666666666')
              this.formData = response.data;
              let paths = this.formData.url.split(",");
              for(let i = 0; i < paths.length; i++)
              {
                if(paths[i]!="") {

                  let pth = paths[i].substr(paths[i].length - 4, paths[i].length)
          //   alert(pth)
                  if (_this.fot.includes(pth) === true)
             {
              console.log()
               }
                  else {
                    let nms = paths[i].split("\/")
                    let nm = nms[nms.length - 1]
               if(paths[i][0]=="/")
                    _this.fileListOther1.push({name:nm, url: process.env.VUE_APP_BASE_TRUE_API+paths[i].substr(1),res:false})
                else
                _this.fileListOther1.push({name:nm, url: process.env.VUE_APP_BASE_TRUE_API+paths[i],res:false})

             }
                }

              }
              _this.fileListOther = _this.fileListOther1
              this.loading = false;
            });
          }
    },

    submitForm() {
      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      let uls = this.fileListOther.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      this.formData.url = ul+","+uls
      // let ul = this.fileList.map(function (elem){
      //   return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      // }).join(",")
      // let uls = this.fileListOther.map(function (elem){
      //   return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      // }).join(",")
      // this.formData.url = ul+","+uls

      this.$refs['elForm'].validate(valid => {
        if (valid) {
@@ -386,10 +611,10 @@
            this.$delete(this.uploadFileList1, Math.abs(i - this.uploadFileList1.length-1))
         }
          this.$delete(this.fileListOther,i);
    

      }
      }
	  

     let ul = ""
     this.fileList.map(function (elem){
           if(elem.res==false)
@@ -401,16 +626,16 @@
              uls = uls +","+elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
     })
     this.formData.url = ul+","+uls;
     alert(this.formData.url)
   //  alert(this.formData.url)
     if(res==true){
        updateFamilyevent(this.formData).then(response => {
         this.$modal.msgSuccess("删除成功");
         // this.open = false;
		  

        });
     }
    },
    handleRemove(file) {	  
    handleRemove(file) {
           //判断是否是之前的图片
     let res = false
   //  alert(this.fileList.length)
@@ -430,7 +655,7 @@
             //     alert(this.uploadFileList.length)
          }
          this.$delete(this.fileList,i);
   

      }
     }
     let ul = ""
@@ -441,7 +666,7 @@
     let uls = ""
     this.fileListOther.map(function (elem){
       if(elem.res==false)
         elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
         uls = uls +","+elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
     })
     this.formData.url = ul+","+uls;
     if(res==true){
@@ -458,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));
@@ -470,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) => {
@@ -498,9 +723,9 @@
      this.fileList.push({name:file.name,url:file.url,res:true})
    },
   //自定义上传方法
   handleChange1(file, fileListOther1) {
   handleChange1(file, fileListOther12) {
          //定义一个全局数组uploadFileList来做存储
	

        // this.uploadFileList.push(file.raw);
       this.uploadFileList1.push(file.raw);
        this.fileListOther.push({name:file.name,url:file.url,res:true})
@@ -519,10 +744,10 @@
      if(this.uploadFileList1.length==0){
           this.$modal.msgSuccess("文档上传列表不能为空！");
           return}
		

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

      })
      console.log(this.uploadFileList1)
      let _this = this
@@ -534,27 +759,24 @@
          updateFamilyevent(_this.formData).then(response => {
            this.$modal.msgSuccess("文档上传成功");
            // this.open = false;
          this.getData()
          this.fileListOther1=[]
          });
        })

   },
   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)
@@ -576,17 +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})

        // }
      });
   },
@@ -596,8 +816,8 @@
//    this.uploadFileList.push(params.file);

     //alert(34)
 
	


    },
    requestUpload1(params)
    {