feige
2026-01-06 6508e19c8d2e266c7405439ac32c06df6f602439
ruoyi-ui/src/views/bignote/familyeventInfo.vue
@@ -47,6 +47,31 @@
         </div>
      </el-form-item>
      <!-- 其它人显示区域 -->
      <el-form-item label="其它人">
        <!-- 已选其它人标签显示 -->
        <div v-if="otherPeople.length > 0" class="selected-members" style="display: inline-block; vertical-align: middle; margin-right: 10px;">
          <el-tag
            v-for="(name, index) in otherPeople"
            :key="index"
            closable
            @close="handleOtherPeopleTagClose(index)"
          >
            {{ name }}
          </el-tag>
        </div>
        <!-- 编辑按钮 -->
        <el-button
          v-if="!dsb"
          type="primary"
          icon="el-icon-edit"
          size="mini"
          @click="openOtherPeopleDialog"
        >
          编辑其它人
        </el-button>
      </el-form-item>
      <el-form-item label="地点" prop="address">
        <el-input v-model="formData.address" placeholder="请输入地点" clearable :style="{width: '100%'}" :disabled="dsb">
@@ -292,6 +317,50 @@
      </div>
    </el-dialog>
    <!-- 其它人编辑弹窗 -->
    <el-dialog
      :visible.sync="otherPeopleDialogVisible"
      title="编辑其它人"
      width="500px"
      :close-on-click-modal="false"
      @close="handleOtherPeopleDialogClose"
    >
      <!-- 已添加的其它人标签 -->
      <div v-if="tempOtherPeople.length > 0" class="selected-members" style="margin-bottom: 20px;">
        <el-tag
          v-for="(name, index) in tempOtherPeople"
          :key="index"
          closable
          @close="handleTempOtherPeopleTagClose(index)"
        >
          {{ name }}
        </el-tag>
      </div>
      <!-- 添加输入框 -->
      <div style="display: flex; align-items: center;">
        <el-input
          v-model="otherPeopleInput"
          placeholder="请输入姓名,按回车或点击添加"
          clearable
          style="flex: 1; margin-right: 10px;"
          @keyup.enter.native="addOtherPeople"
        ></el-input>
        <el-button
          type="primary"
          icon="el-icon-plus"
          @click="addOtherPeople"
        >
          添加
        </el-button>
      </div>
      <!-- 弹窗底部按钮 -->
      <div slot="footer" class="dialog-footer">
        <el-button @click="otherPeopleDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="confirmOtherPeople">完成</el-button>
      </div>
    </el-dialog>
  </div>
</template>
@@ -316,6 +385,10 @@
      anotherFamilyMembers: [], //另外家族成员信息
      selectedMemberIds: [], // 弹窗中临时选中的成员ID(用于多选交互)
      displayMemberNames: [], // 显示用的成员名称数组
      otherPeople: [], // 其它人列表
      tempOtherPeople: [], // 弹窗中临时编辑的其它人列表
      otherPeopleInput: '', // 其它人输入框内容
      otherPeopleDialogVisible: false, // 其它人弹窗可见性
      memberSearch: '', // 成员搜索关键词
      loading: false, // 加载状态
      cdi:"家庭大事记信息",
@@ -512,6 +585,60 @@
      console.log(this.selectedMemberNames)
    },
    // 移除其它人标签
    handleOtherPeopleTagClose(index) {
      const removedName = this.otherPeople[index];
      this.otherPeople.splice(index, 1);
      this.$message.info(`已移除: ${removedName}`);
    },
    // 打开其它人编辑弹窗
    openOtherPeopleDialog() {
      // 复制当前其它人列表到临时列表
      this.tempOtherPeople = [...this.otherPeople];
      this.otherPeopleInput = '';
      this.otherPeopleDialogVisible = true;
    },
    // 弹窗内添加其它人
    addOtherPeople() {
      const name = this.otherPeopleInput.trim();
      if (!name) {
        this.$message.warning('请输入姓名');
        return;
      }
      if (this.tempOtherPeople.includes(name)) {
        this.$message.warning('该姓名已添加');
        return;
      }
      this.tempOtherPeople.push(name);
      this.otherPeopleInput = '';
      this.$message.success(`已添加: ${name}`);
    },
    // 弹窗内移除其它人标签
    handleTempOtherPeopleTagClose(index) {
      const removedName = this.tempOtherPeople[index];
      this.tempOtherPeople.splice(index, 1);
      this.$message.info(`已移除: ${removedName}`);
    },
    // 确认完成(保存弹窗中的更改)
    confirmOtherPeople() {
      if (this.tempOtherPeople.length > 0) {
        this.$message.success(`已保存 ${this.tempOtherPeople.length} 名其它人`);
      } else {
        this.$message.info('未添加任何其它人');
      }
      this.otherPeople = [...this.tempOtherPeople];
      this.otherPeopleDialogVisible = false;
    },
    // 其它人弹窗关闭处理
    handleOtherPeopleDialogClose() {
      this.otherPeopleInput = '';
      // 不保存临时列表的更改
    },
    // 确认选择成员(保存到表单)
    confirmMemberSelection() {
      console.log(this.selectedMemberIds)
@@ -530,16 +657,29 @@
      // 1. 判断 people 是否存在且为字符串,避免报错
      if (!people || typeof people !== "string") {
        this.displayMemberNames = [];
        this.otherPeople = [];
        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)
      // 2. 先按分号分割:第一部分是家族成员,第二部分是其它人
      const parts = people.split(';');
      // 第一部分:按逗号分割赋值给 displayMemberNames
      if (parts[0]) {
        this.displayMemberNames = parts[0].split(",").map(name => name.trim()).filter(name => name);
      } else {
        this.displayMemberNames = [];
      }
      // 第二部分:按逗号分割赋值给 otherPeople
      if (parts[1]) {
        this.otherPeople = parts[1].split(",").map(name => name.trim()).filter(name => name);
      } else {
        this.otherPeople = [];
      }
      console.log('家族成员:', this.displayMemberNames)
      console.log('其它人:', this.otherPeople)
    },
      // 打开成员多选弹窗
      async openMemberDialog() {
@@ -617,16 +757,11 @@
    },
    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
  var pel = ""
      pel = pel + this.selectedMemberNames.join(",")
      this.formData.people = pel;
      // 组合数据:家族成员按逗号分隔,其它人按逗号分隔,两部分用分号分隔
      const memberPart = this.selectedMemberNames.join(",");
      const otherPart = this.otherPeople.join(",");
      this.formData.people = `${memberPart};${otherPart}`;
      this.$refs['elForm'].validate(valid => {
        if (valid) {
          if (this.formData.id != undefined) {
@@ -924,3 +1059,12 @@
  background:center/11% no-repeat url('../../assets/icons/form.png') ;
}
</style>