添加项目组（65%

hejianhao

2025-05-08 fc5fb920066b4f2d9d2c1304890ce7dd513d05f4

 laboratory/src/views/projectList/addProject.vue

@@ -2,11 +2,11 @@
    <Card>
        <template>
            <el-form ref="form" :model="form" :rules="rules" inline label-position="top">
                <el-form-item prop="name" label="项目组名称">
                    <el-input v-model="form.name" placeholder="请输入" />
                <el-form-item prop="teamName" label="项目组名称">
                    <el-input v-model="form.teamName" placeholder="请输入" />
                </el-form-item>
                <el-form-item prop="description" label="项目组描述">
                    <el-input v-model="form.description" placeholder="请输入" />
                <el-form-item prop="personCharge" label="项目组负责人">
                    <el-input v-model="form.personCharge" placeholder="请输入" />
                </el-form-item>
            </el-form>
            <div class="header-title">
@@ -21,9 +21,12 @@
                    <div class="member-item">
                        <div class="member-title">{{ ['审批人', '工艺工程师', '实验员', '化验师'][item - 1] }}</div>
                        <div :class="item == 1 || item == 2 ? 'member-name-box' : 'member-name-box-2'">
                            <div v-for="i in memberList(item)" :key="i" class="member-name">张三</div>
                            <el-tooltip v-for="i in memberList(item)" :key="i.userId" class="member-name" effect="dark"
                                :content="i.nickName" placement="top">
                                <span>{{ i.nickName }}</span>
                            </el-tooltip>
                        </div>
                        <div class="member-edit">修改</div>
                        <div class="member-edit" v-if="memberList(item).length != 0" @click="editUserList">修改</div>
                    </div>
                </div>
            </div>
@@ -31,7 +34,7 @@
                <el-button type="primary">保存</el-button>
            </div>
        </template>
        <SelectMember ref="selectMember" />
        <SelectMember ref="selectMember" @submit="selectUser" />
    </Card>
</template>

@@ -42,9 +45,15 @@
        return {
            form: {},
            rules: {
                name: [{ required: true, message: '请输入项目组名称', trigger: 'blur' }],
                description: [{ required: true, message: '请输入项目组描述', trigger: 'blur' }]
            }
                teamName: [{ required: true, message: '请输入项目组名称', trigger: 'blur' }],
                personCharge: [{ required: true, message: '请输入项目组描述', trigger: 'blur' }]
            },
            selectMemberData: [],
            // 角色配置常量
            ROLE_CONFIG: {
                1: { key: 'approver', limit: 1, label: '审批人' },
                2: { key: 'engineer', limit: 1, label: '工艺工程师' },
            },
        }
    },
    methods: {
@@ -61,16 +70,33 @@
        memberList(i) {
            switch (i) {
                case 1:
                    return [1]
                    return this.selectMemberData.filter(item => item.roleName == '审批人')
                case 2:
                    return [1]
                    return this.selectMemberData.filter(item => item.roleName == '工艺工程师')
                case 3:
                    return [1, 2, 3, 4, 5, 6, 7, 8]
                    return this.selectMemberData.filter(item => item.roleName == '实验员')
                case 4:
                    return [1, 2, 3, 4, 5, 6, 7, 8]
                    return this.selectMemberData.filter(item => item.roleName == '化验师')
                default:
                    break;
            }
        },
        selectUser(data) {
            for (const [roleId, config] of Object.entries(this.ROLE_CONFIG)) {
                const members = data.filter(item => item.roleName === config.label);
                if (members.length > config.limit) {
                    this.$message.error(`${config.label}最多只能选择${config.limit}个`);
                    return
                }
            }
            this.selectMemberData = data;
            this.$refs.selectMember.close();
        },
        editUserList() {
            this.$refs.selectMember.open();
            this.$nextTick(() => {
                this.$refs.selectMember.setSelection(this.selectMemberData);
            });
        }
    }
}
@@ -188,6 +214,10 @@
                font-weight: 500;
                font-size: 16px;
                color: #FFFFFF;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                box-sizing: border-box;
            }

            .member-edit {