| ruoyi-ui/src/views/bignote/familyeventInfo.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| ruoyi-ui/src/views/bignote/index.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| ruoyi-ui/vue.config.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
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>
@@ -276,6 +276,30 @@ 选择家族成员 </el-button> </el-form-item> <!-- 其它人选择字段 --> <el-form-item label="其它人" prop="otherPeople"> <!-- 已选其它人回显区域 --> <div v-if="formDat.otherPeople && formDat.otherPeople.length > 0" class="selected-members"> <el-tag v-for="(name, index) in formDat.otherPeople" :key="index" closable @close="handleOtherPeopleTagClose(index)" > {{ name }} </el-tag> </div> <!-- 触发弹窗按钮 --> <el-button type="primary" icon="el-icon-user" @click="openOtherPeopleDialog" :disabled="loading" > 添加其它人 </el-button> </el-form-item> <el-form-item label="地点" prop="address"> <el-input v-model="formDat.address" placeholder="请输入地点" clearable :style="{width: '100%'}" > </el-input> @@ -481,6 +505,49 @@ <el-button type="primary" @click="confirmMemberSelection">确认选择</el-button> </div> </el-dialog> <!-- 其它人弹窗 --> <el-dialog :visible.sync="otherPeopleDialogVisible" title="添加其它人" width="400px" :close-on-click-modal="false" @close="handleOtherPeopleDialogClose" > <div class="other-people-dialog"> <el-input v-model="otherPeopleInput" placeholder="请输入姓名，按回车或点击添加按钮添加" @keyup.enter.native="addOtherPeople" style="margin-bottom: 20px;" > <el-button slot="append" icon="el-icon-plus" @click="addOtherPeople">添加</el-button> </el-input> <!-- 已添加的其它人列表 --> <div v-if="formDat.otherPeople && formDat.otherPeople.length > 0" class="added-people-list"> <el-divider content-position="left">已添加 ({{ formDat.otherPeople.length }}人)</el-divider> <el-tag v-for="(name, index) in formDat.otherPeople" :key="index" closable @close="handleOtherPeopleTagClose(index)" style="margin-right: 8px; margin-bottom: 8px;" > {{ name }} </el-tag> </div> <div v-else class="no-people" style="padding: 20px 0;"> <el-empty description="暂未添加任何人" :image-size="60"></el-empty> </div> </div> <div slot="footer" class="dialog-footer"> <el-button type="primary" @click="confirmOtherPeople">完成</el-button> </div> </el-dialog> <!-- 分享对话框1 --> <el-dialog :title="title1" :visible.sync="open1" width="500px" append-to-body @close="handleClose2"> @@ -711,9 +778,13 @@ dsb:true, btn:false, uploading: false, // 其它人弹窗相关 otherPeopleDialogVisible: false, otherPeopleInput: '', formDat: { // type: undefined, selectedMemberIds: [], otherPeople: [], // 存储其它人名字 title: undefined, location: undefined, holder: undefined, @@ -798,7 +869,7 @@ return this.displayMemberNames; } // 否则根据选中的ID计算 // 合并过滤后的成员名称和displayMemberNames内容 console.log(this.selectedMemberIds) @@ -1109,6 +1180,50 @@ } ); }, openOtherPeopleDialog(){ this.otherPeopleDialogVisible = true; this.otherPeopleInput = ''; // 清空输入框 }, // 添加其它人（支持回车和点击添加按钮） addOtherPeople() { const name = this.otherPeopleInput.trim(); if (!name) { this.$message.warning('请输入姓名'); return; } if (this.formDat.otherPeople.includes(name)) { this.$message.warning('该姓名已添加'); return; } this.formDat.otherPeople.push(name); this.otherPeopleInput = ''; // 清空输入框，准备输入下一个 this.$message.success(`已添加: ${name}`); }, // 确认完成（关闭弹窗） confirmOtherPeople() { if (this.formDat.otherPeople.length > 0) { this.$message.success(`已添加 ${this.formDat.otherPeople.length} 名其它人`); } else { this.$message.info('未添加任何其它人'); } this.otherPeopleDialogVisible = false; }, // 关闭其它人标签 handleOtherPeopleTagClose(index) { const removedName = this.formDat.otherPeople[index]; this.formDat.otherPeople.splice(index, 1); this.$message.info(`已移除: ${removedName}`); }, // 其它人弹窗关闭处理 handleOtherPeopleDialogClose() { this.otherPeopleInput = ''; }, // ------------------- 恢复被删除的方法 ------------------- // 取消按钮 cancel() { @@ -1157,7 +1272,6 @@ // 多选框选中数据 handleSelectionChange(selection) { this.ids = selection.map(item => item.id) // alert(this.ids) this.single = selection.length!=1 this.multiple = !selection.length }, @@ -1169,11 +1283,10 @@ this.title = "添加家庭大事记信息"; }, /** 查看详细信息 */ handleCheck(row){ const id = row.id; this.open2 = false; this.open2 = false; this.$router.push("/familymodel/bignote/familyeventInfo/" + id); }, /** 修改按钮操作 */ @@ -1190,33 +1303,23 @@ }, handleRemove(file) { //alert(98) //alert(this.fileList.length) for(let i = 0; i < this.fileList.length; i++) { if(this.fileList[i].url==file.url) { this.$delete(this.fileList,i); this.$delete(this.uploadFileList,i); } } // let ul = this.fileList.map(function (elem){ // return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"") // }).join(",") // alert(this.fileListOther.length) // let uls = this.fileListOther.map(function (elem){ // return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"") // }).join(",") // this.formDat.url = ul+","+uls; for(let i = 0; i < this.fileList.length; i++) { if(this.fileList[i].url==file.url) { this.$delete(this.fileList,i); this.$delete(this.uploadFileList,i); } } }, handleRemoveFile(file) { for(let i = 0; i < this.fileListOther.length; i++) { if(this.fileListOther[i].url==file.url) { { this.$delete(this.fileListOther,i); this.$delete(this.uploadFileList1,i); } this.$delete(this.uploadFileList1,i); } } }, @@ -1224,6 +1327,8 @@ this.dialogImageUrl = file.url; this.dialogVisible = true; }, // handleTagClose(index, name) { // 从 selectedMemberNames 数组中移除当前关闭的标签名称 // const index = this.selectedMemberNames.findIndex(item=== name); @@ -1255,6 +1360,11 @@ //把名字连在一起 var pel = "" pel = pel + this.selectedMemberNames.join(",") if(this.formDat.otherPeople.length != 0) { pel = pel +";"+ this.formDat.otherPeople.join(",") } // alert(pel) this.formDat.people = pel; this.$refs["elForm"].validate(valid => { if (valid) { @@ -1480,6 +1590,7 @@ selectedMemberNames: this.selectedMemberNames.filter( item => item !== name // 过滤掉与关闭名称相同的元素 ) this.displayMemberNames = this.selectedMemberNames console.log(this.selectedMemberNames) }, ruoyi-ui/vue.config.js
@@ -37,8 +37,8 @@ // detail: https://cli.vuewww.bendudu.comjs.org/config/#devserver-proxy [process.env.VUE_APP_BASE_API]: { // target: `https://10.39.2.234:8080/`, target: `https://10.39.18.174:8080/`, //target: 'https://www.bendudu.com:8080/', //target: `https://10.39.18.174:8080/`, target: 'https://www.bendudu.com:8080/', changeOrigin: true, pathRewrite: { ['^' + process.env.VUE_APP_BASE_API]: ''
