H5/leshan-laboratory.git

			@@ -1,6 +1,6 @@
			<template>
			<el-dialog class="select-member" :visible.sync="visible" width="53.33%" :close-on-click-modal="false"
			:show-close="false">
			<el-dialog @open="openDialog" class="select-member" :visible.sync="visible" width="53.33%"
			:close-on-click-modal="false" :show-close="false">
			<template #title>
			<div>选择参与人员</div>
			</template>
			@@ -22,9 +22,10 @@
			<div class="select-member-content-left-list">
			<div class="select-member-content-left-list-title">角色列表</div>
			<div class="select-member-content-left-list-itemBox">
			<div v-for="item in 10" :key="item.id"
			class="select-member-content-left-list-itemBox-item">
			实验员
			<div @click="searchUserList(item.roleId)" v-for="item in roleList" :key="item.roleId"
			class="select-member-content-left-list-itemBox-item"
			:class="roleId == item.roleId && 'active'">
			{{ item.roleName }}
			</div>
			</div>
			</div>
			@@ -35,15 +36,15 @@
			<div class="select-member-content-right-header">
			<div class="select-member-content-right-header-text">人员列表</div>
			<div class="select-member-content-right-header-search">
			<el-input clearable v-model="searchName" placeholder="请输入姓名" />
			<el-input clearable v-model="nickNameOrPhone" placeholder="请输入姓名/手机号" />
			<el-button type="primary">搜索</el-button>
			</div>
			</div>
			<Table :data="tableData" :total="0" @selection-change="handleSelectionChange"
			:row-class-name="tableRowClassName">
			<Table ref="memberTable" :row-key="row => row.userId" :data="tableData" :total="0"
			@selection-change="handleSelectionChange" :row-class-name="tableRowClassName">
			<el-table-column type="selection" width="55" />
			<el-table-column label="角色" prop="role" />
			<el-table-column label="姓名" prop="name" />
			<el-table-column label="角色" prop="roleName" />
			<el-table-column label="姓名" prop="nickName" />
			<el-table-column label="创建时间" prop="createTime" />
			</Table>
			</div>
			@@ -52,40 +53,79 @@
			</div>
			<div class="select-member-footer">
			<el-button @click="close" type="default">关闭</el-button>
			<el-button type="primary">确认选择</el-button>
			<el-button type="primary" @click="submit">确认选择</el-button>
			</div>
			</el-dialog>
			</template>

			<script>
			import { mapState } from 'vuex'
			import { getRoleList, getUserList } from './service'
			export default {
			props: {
			projectId: {
			type: [String, Number],
			default: null
			}
			},
			data() {
			return {
			visible: false,
			search: '',
			searchName: '',
			tableData: [
			{
			name: '张三',
			role: '实验员',
			createTime: '2025-1-2 15:13:58'
			},
			{
			name: '李四',
			role: '实验员',
			createTime: '2025-1-2 15:13:58'
			},
			],
			selectData: []
			nickNameOrPhone: '',
			tableData: [],
			selectData: [],
			roleList: [],
			roleId: null,
			}
			},
			computed: {
			...mapState(['isFold'])
			},
			methods: {
			setSelection(selected) {
			this.selectData = selected
			this.$nextTick(() => {
			// 设置新选中
			this.tableData.forEach(row => {
			if (selected.some(i => i.userId === row.userId)) {
			this.$refs.memberTable.toggleRowSelection(row, true)
			}
			})
			})
			},
			openDialog() {
			// 获取角色列表并根据项目组ID进行过滤
			getRoleList().then(res => {
			if (this.projectId) {
			// 过滤出实验员和化验师角色
			this.roleList = res.filter(item => item.roleId == 4 \|\| item.roleId == 5);
			} else {
			this.roleList = res;
			}
			});
			this.searchUserList(null);
			},
			handleSelectionChange(val) {
			this.selectData = val
			},
			async searchUserList(roleId) {
			this.roleId = roleId
			// 根据是否有项目组ID来决定调用不同的接口
			const params = {
			roleIds: roleId ? [roleId] : [],
			nickNameOrPhone: this.searchName,
			pageSize: 9999,
			pageNum: 1
			};

			if (this.projectId) {
			params.projectId = this.projectId;
			// TODO: 这里需要替换为新的接口调用
			// const res = await getProjectUserList(params);
			} else {
			const res = await getUserList(params);
			this.tableData = res.records;
			}

			// 数据加载完成后重新应用选中状态
			this.setSelection(this.selectData)
			},
			searchRole() {
			this.search = ''
			@@ -96,8 +136,11 @@
			close() {
			this.visible = false
			},
			submit() {
			this.$emit('submit', this.selectData)
			},
			tableRowClassName({ row, rowIndex }) {
			if (this.selectData.findIndex(item => item.name === row.name) != -1) {
			if (this.selectData.findIndex(item => item.userId === row.userId) != -1) {
			return 'select-row';
			}
			return '';
			@@ -191,6 +234,12 @@
			&:last-child {
			margin-bottom: 0;
			}

			&:hover,
			&.active {
			background: rgba(4, 156, 154, 0.1);
			color: #049C9A;
			}
			}
			}
			}