| | |
| | | ref="table" |
| | | :data="tableData" |
| | | :total="0" |
| | | :height="null" |
| | | class="rwuTable" |
| | | @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55"></el-table-column> |
| | |
| | | </div> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="handleClose">关闭</el-button> |
| | | <el-button type="primary" @click="handleSubmit">保存</el-button> |
| | | <el-button type="primary" @click="handleSubmit" style="margin-left: 10px;">保存</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </template> |
| | |
| | | dialogVisible: false, |
| | | title: "新增任务", |
| | | form: { |
| | | id: "", // 任务id |
| | | taskName: "", |
| | | startTime: "", |
| | | selectedUsers: [], // 存储选中用户的id数组 |
| | |
| | | { required: true, message: "请选择开始时间", trigger: "change" } |
| | | ] |
| | | }, |
| | | tableData: [], |
| | | tableData: [], // 参与人员列表 |
| | | pickerOptions: { |
| | | shortcuts: [ |
| | | { |
| | |
| | | }; |
| | | }, |
| | | methods: { |
| | | open(row) { |
| | | open(row, participants) { |
| | | this.dialogVisible = true; |
| | | this.getAvailableUsers(); |
| | | // 使用传入的参与人员数据 |
| | | this.tableData = participants.map(user => ({ |
| | | id: user.userId, |
| | | role: user.roleName, |
| | | name: user.nickName, |
| | | avatar: user.avatar, |
| | | createTime: new Date().toLocaleString() |
| | | })); |
| | | |
| | | if (row) { |
| | | this.title = "编辑任务"; |
| | | // 处理负责人数据 |
| | | const selectedNames = row.personCharge ? row.personCharge.split('、') : []; |
| | | const selectedUsers = []; |
| | | |
| | | // 根据负责人名称找到对应的用户ID |
| | | this.tableData.forEach(user => { |
| | | if (selectedNames.includes(user.name)) { |
| | | selectedUsers.push(user.id); |
| | | } |
| | | }); |
| | | |
| | | this.form = { |
| | | id: row.id || '', |
| | | taskName: row.taskName || '', |
| | | startTime: row.startTime || '', |
| | | selectedUsers: row.selectedUsers || [], |
| | | leader: row.leader || '' |
| | | selectedUsers: selectedUsers, |
| | | leader: row.personCharge || '' |
| | | }; |
| | | |
| | | // 在表格数据加载完成后设置选中状态 |
| | | this.$nextTick(() => { |
| | | if (this.$refs.table && this.form.selectedUsers.length) { |
| | | if (this.$refs.table) { |
| | | this.tableData.forEach(row => { |
| | | if (this.form.selectedUsers.includes(row.id)) { |
| | | if (selectedNames.includes(row.name)) { |
| | | this.$refs.table.toggleRowSelection(row, true); |
| | | } |
| | | }); |
| | |
| | | } else { |
| | | this.title = "新增任务"; |
| | | this.form = { |
| | | id: "", |
| | | taskName: "", |
| | | startTime: "", |
| | | selectedUsers: [], |
| | |
| | | this.$refs.table.clearSelection(); |
| | | } |
| | | this.form = { |
| | | id: "", |
| | | taskName: "", |
| | | startTime: "", |
| | | selectedUsers: [], |
| | |
| | | } |
| | | |
| | | const submitData = { |
| | | id: this.form.id, |
| | | taskName: this.form.taskName, |
| | | startTime: this.form.startTime, |
| | | selectedUsers: this.form.selectedUsers, |
| | |
| | | this.handleClose(); |
| | | } |
| | | }); |
| | | }, |
| | | getAvailableUsers() { |
| | | // 这里可以调用接口获取人员列表 |
| | | this.tableData = [ |
| | | { |
| | | id: 1, |
| | | role: "实验师", |
| | | name: "曾奇胜", |
| | | avatar: "", |
| | | createTime: "2024-09-18 00:00:00" |
| | | }, |
| | | { |
| | | id: 2, |
| | | role: "实验师", |
| | | name: "李四", |
| | | avatar: "", |
| | | createTime: "2024-09-18 00:00:00" |
| | | }, |
| | | { |
| | | id: 3, |
| | | role: "实验师", |
| | | name: "王五", |
| | | avatar: "", |
| | | createTime: "2024-09-18 00:00:00" |
| | | } |
| | | ]; |
| | | } |
| | | } |
| | | }; |