| | |
| | | <template #dropdown> |
| | | <el-dropdown-menu> |
| | | <el-dropdown-item :disabled="multiple" icon="el-icon-top" style="height: 32px;width:240px;color: #0099ff;" @click.native="handleShare">分享</el-dropdown-item> |
| | | |
| | | |
| | | <el-dropdown-item icon="el-icon-top" @click.native="whoShare">分享给我的数据</el-dropdown-item> |
| | | <el-dropdown-item icon="el-icon-top" @click.native="handleWho">分享给谁了什么数据</el-dropdown-item> |
| | | <el-dropdown-item icon="el-icon-top" @click.native="showData">展示下载的分享数据</el-dropdown-item> |
| | | </el-dropdown-menu> |
| | | </template> |
| | | </el-dropdown> |
| | | |
| | | |
| | | |
| | | <right-toolbar :parentValue.sync="valueFromParent" :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> |
| | | </el-row> |
| | |
| | | <el-form-item label="大事标题" prop="title"> |
| | | <el-input v-model="formDat.title" placeholder="请输入大事标题" clearable :style="{width: '100%'}" ></el-input> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="人物" prop="people"> |
| | | <el-input v-model="formDat.people" placeholder="请输入人物" clearable :style="{width: '100%'}" > |
| | | </el-input> |
| | | </el-form-item> |
| | | <!-- 家族成员选择字段 --> |
| | | <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> |
| | | <!-- 触发弹窗按钮 --> |
| | | <el-button |
| | | type="primary" |
| | | icon="el-icon-user-plus" |
| | | @click="openMemberDialog" |
| | | :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> |
| | |
| | | <el-date-picker v-model="formDat.happenTime" type="date" placeholder="请选择日期" |
| | | @click.native.stop |
| | | ref="datePicker" |
| | | |
| | | |
| | | |
| | | |
| | | :editable="false" :clearable="false" :style="{width: '100%'}" value-format="yyyy-MM-dd" |
| | | ></el-date-picker> |
| | | </el-form-item> |
| | |
| | | |
| | | </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> |
| | | <!-- 分享对话框1 --> |
| | | <el-dialog :title="title1" :visible.sync="open1" width="500px" append-to-body @close="handleClose2"> |
| | | |
| | |
| | | |
| | | |
| | | <script> |
| | | import { listRole, getRole, delRole, addRole, |
| | | import { listRole, getRole, delRole, addRole, |
| | | updateRole, dataScope, changeRoleStatus, deptTreeSelect } from "@/api/system/role"; |
| | | import { treeselect as menuTreeselect, roleMenuTreeselect } from "@/api/system/menu"; |
| | | |
| | | |
| | | import { Notification, MessageBox, Message, Loading } from 'element-ui' |
| | | import {getAllInfo} from "@/api/system/user" |
| | | import { getFamilyMembers } from '@/api/root'; // 假设获取家族成员的API |
| | | |
| | | //在system/note/index.js中导入接口函数 --接好了 |
| | | import {listFamilyevent,enload, delFamilyevent , addFamilyevent , uploadPic, |
| | | share,shareToWho,getWhoShare,downShareData,deleteShareData,showShareData,showShareUser |
| | |
| | | data() { |
| | | return { |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | // 成员多选相关 |
| | | memberDialogVisible: false, // 弹窗可见性 |
| | | familyMembers: [], // 家族成员列表(原始数据) |
| | | selectedMemberIds: [], // 弹窗中临时选中的成员ID(用于多选交互) |
| | | memberSearch: '', // 成员搜索关键词 |
| | | loading: false, // 加载状态 |
| | | total1: 0, |
| | | // 分享给谁的list |
| | | listRoot: [], |
| | |
| | | dateRange: [], |
| | | // 数据范围选项 |
| | | fot:['.bmp','.jpg','.jpeg','.png','.tif','.gif','.pcx','.tga','.exif','.fpx', |
| | | '.svg','.psd','.cdr','.pcd','.dxf','.ufo','.eps','.ai','.aw','.WMF','.webp','.apng','.m4a'], |
| | | '.svg','.psd','.cdr','.pcd','.dxf','.ufo','.eps','.ai','.aw','.WMF','.webp','.apng','.m4a','.M4A'], |
| | | fileList:[], |
| | | fileList1:[], |
| | | uploadFileList: [], |
| | |
| | | uploading: false, |
| | | formDat: { |
| | | // type: undefined, |
| | | selectedMemberIds: [], |
| | | title: undefined, |
| | | location: undefined, |
| | | holder: undefined, |
| | |
| | | }, |
| | | // 表单校验 |
| | | rules: { |
| | | selectedMemberIds: [ |
| | | { type: 'array', required: true, message: '请至少选择一名家族成员', trigger: 'change' } |
| | | ], |
| | | title: [{ |
| | | required: true, |
| | | message: '请输入大事标题', |
| | |
| | | this.getInfo() |
| | | |
| | | this.getList1(); |
| | | |
| | | |
| | | |
| | | }, |
| | | computed: { |
| | | // 已选成员姓名(用于回显) |
| | | selectedMemberNames() { |
| | | 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) |
| | | // ); |
| | | } |
| | | }, |
| | | methods: { |
| | | handleDialogClick() |
| | |
| | | this.loading1 = true; |
| | | let userId = this.$store.state.user.userId |
| | | // alert(userId) |
| | | |
| | | this.userOptions = [] |
| | | showShareUser(userId, 2013).then(response=>{ |
| | | console.log("===========ddddddddddddd") |
| | | console.log(response.data) |
| | |
| | | const shareList = {} |
| | | shareList.shareContents = this.id1 || this.ids; |
| | | shareList.shareIds = this.ids1 |
| | | if(shareList.shareIds.length==0) |
| | | { |
| | | this.$modal.msgSuccess("请选择分享对象"); |
| | | return; |
| | | } |
| | | console.log(shareList,'sharelistsharelist') |
| | | |
| | | |
| | | |
| | | |
| | | this.$modal.confirm('是否确认分享?').then(function() { |
| | | return share(shareList); |
| | | }).then(() => { |
| | |
| | | |
| | | close(){ |
| | | //alert(234) |
| | | |
| | | |
| | | |
| | | this.open = false |
| | | }, |
| | | // 取消按钮 |
| | | cancelData() { |
| | | |
| | | |
| | | this.open = false; |
| | | this.reset(); |
| | | }, |
| | |
| | | /** 查看详细信息 */ |
| | | handleCheck(row){ |
| | | const id = row.id; |
| | | this.open2 = false; |
| | | this.open2 = false; |
| | | this.$router.push("/familymodel/bignote/familyeventInfo/" + id); |
| | | }, |
| | | /** 修改按钮操作 */ |
| | |
| | | // }).join(",") |
| | | // this.formDat.url = ul+","+uls |
| | | // alert(this.formDat.url) |
| | | //把名字连在一起 |
| | | var pel = "" |
| | | pel = pel + this.selectedMemberNames.join(",") |
| | | this.formDat.people = pel; |
| | | this.$refs["elForm"].validate(valid => { |
| | | if (valid) { |
| | | |
| | |
| | | Message({ message: "导入失败", type: 'error' }) |
| | | } |
| | | |
| | | }, |
| | | // 打开成员多选弹窗 |
| | | 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.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; |
| | | } |
| | | }, |
| | | |
| | | // 确认选择成员(保存到表单) |
| | | confirmMemberSelection() { |
| | | this.formDat.selectedMemberIds = [...this.selectedMemberIds]; // 将弹窗选中的ID同步到表单 |
| | | this.memberDialogVisible = false; |
| | | this.$modal.message(`已选择 ${this.selectedMemberNames.length} 名家族成员`); |
| | | }, |
| | | |
| | | // 移除已选成员标签 |
| | | handleTagClose(index) { |
| | | const removedId = this.familyForm.selectedMemberIds[index]; |
| | | this.familyForm.selectedMemberIds = this.familyForm.selectedMemberIds.filter(id => id !== removedId); |
| | | } |
| | | |
| | | } |
| | |
| | | .button-container { |
| | | display: inline-flex; /* 设置按钮容器为行内元素 */ |
| | | } |
| | | |
| | | |
| | | /* 已选成员标签样式 */ |
| | | .selected-members { |
| | | margin-bottom: 12px; |
| | | .el-tag { |
| | | margin-right: 8px; |
| | | margin-bottom: 8px; |
| | | } |
| | | } |
| | | |
| | | /* 多选弹窗样式 */ |
| | | .member-dialog-content { |
| | | max-height: 400px; |
| | | overflow-y: auto; |
| | | padding: 0 10px; |
| | | } |
| | | |
| | | /* 成员列表样式 */ |
| | | .member-checkbox-group { |
| | | .el-checkbox { |
| | | display: block; |
| | | padding: 12px; |
| | | border-bottom: 1px solid #f5f5f5; |
| | | &:last-child { |
| | | border-bottom: none; |
| | | } |
| | | } |
| | | } |
| | | |
| | | /* 成员项样式 */ |
| | | .member-item { |
| | | display: flex; |
| | | align-items: center; |
| | | .member-avatar { |
| | | width: 40px; |
| | | height: 40px; |
| | | border-radius: 50%; |
| | | margin-right: 12px; |
| | | } |
| | | .member-info { |
| | | .member-name { |
| | | font-weight: 500; |
| | | margin-bottom: 4px; |
| | | } |
| | | .member-role { |
| | | font-size: 12px; |
| | | color: #606266; |
| | | } |
| | | } |
| | | } |
| | | |
| | | /* 加载状态样式 */ |
| | | .loading-container { |
| | | text-align: center; |
| | | padding: 40px 0; |
| | | .el-loading-spinner { |
| | | margin-bottom: 16px; |
| | | } |
| | | } |
| | | .signature-checkbox |
| | | { |
| | | margin-right: 15px; |
| | | } |
| | | /* 无数据样式 */ |
| | | .no-data { |
| | | padding: 60px 0; |
| | | } |
| | | </style> |