<template>
|
<Card>
|
<template>
|
<div class="header-title" style="margin-bottom: 18px">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>所属实验调度</div>
|
</div>
|
<el-button
|
class="el-icon-plus"
|
type="primary"
|
v-if="isEdit"
|
@click="showScheduling = true"
|
>
|
选择实验调度</el-button
|
>
|
</div>
|
<Table :data="tableData" :total="0" :height="null">
|
<template>
|
<el-table-column
|
type="index"
|
label="序号"
|
width="80"
|
></el-table-column>
|
<el-table-column
|
prop="projectName"
|
label="所属项目课题方案"
|
></el-table-column>
|
<el-table-column
|
prop="experimentCode"
|
label="实验编号"
|
></el-table-column>
|
<el-table-column
|
prop="experimentName"
|
label="实验名称"
|
></el-table-column>
|
<el-table-column
|
prop="experimentDate"
|
label="通知时间"
|
></el-table-column>
|
<el-table-column
|
prop="experimentStartTime"
|
label="实验开始时间"
|
></el-table-column>
|
<el-table-column
|
prop="experimentEndTime"
|
label="实验结束时间"
|
></el-table-column>
|
<el-table-column
|
prop="participantsName"
|
label="参加人员"
|
></el-table-column>
|
<el-table-column prop="status" label="状态">
|
<template slot-scope="scope">
|
<el-tag :type="getStatusType(scope.row.status)">
|
{{ getStatusText(scope.row.status) }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
</template>
|
</Table>
|
<div class="header-title" style="margin-top: 60px">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>被评定实验员</div>
|
</div>
|
<el-button
|
class="el-icon-plus"
|
v-if="isEdit"
|
type="primary"
|
@click="addMember"
|
>
|
选择实验员</el-button
|
>
|
</div>
|
<div class="member-list">
|
<div class="member-list-card">
|
<div class="member-item">
|
<div class="member-title">实验员</div>
|
<div class="member-name-box-2">
|
<div
|
v-for="i in selectedParticipants"
|
:key="i.id"
|
class="member-name"
|
>
|
{{ i.nickName }}
|
</div>
|
</div>
|
<div class="member-edit" @click="handleEditMember" v-if="isEdit">
|
修改
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="header-title" style="margin-bottom: 18px; margin-top: 60px">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>工作标准评定</div>
|
</div>
|
</div>
|
<EvaluateTable :type="2" ref="evaluateTable" />
|
<div class="add-project-footer">
|
<el-button type="primary" @click="submitForm()">保存</el-button>
|
<!-- <el-button>存草稿</el-button> -->
|
</div>
|
</template>
|
<SelectMemberSimple
|
ref="selectMember"
|
@submit="handleMemberSubmit"
|
roleType="5"
|
/>
|
<ExperimentalScheduling
|
:show="showScheduling"
|
@submit="handleSchedulingSubmit"
|
@close="handleSchedulingClose"
|
/>
|
</Card>
|
</template>
|
|
<script>
|
import SelectMemberSimple from "@/components/SelectMemberSimple/index.vue";
|
import ExperimentalScheduling from "@/views/dataManagement/schemeManagement/components/experimental-scheduling";
|
import { getEvaluateChemist, add } from "./service.js";
|
import moment from "moment";
|
|
export default {
|
name: "AddTesterWorkerEvaluate",
|
components: {
|
ExperimentalScheduling,
|
SelectMemberSimple,
|
},
|
data() {
|
return {
|
showScheduling: false,
|
participantsData: [],
|
selectedParticipants: [],
|
tableData: [],
|
isEdit: true, // 是否为编辑模式
|
// 状态映射表
|
statusTypeMap: {
|
"-1": "info",
|
1: "warning",
|
2: "success",
|
3: "info",
|
},
|
statusTextMap: {
|
"-1": "草稿箱",
|
1: "待确认",
|
2: "已确认",
|
3: "已封存",
|
},
|
};
|
},
|
async created() {
|
// const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
|
// this.userRole = userInfo.roleType || "";
|
// 检查是否为编辑模式
|
this.participantsData = [];
|
this.selectedParticipants = [];
|
this.tableData = [];
|
this.isEdit = true; // 是否为编辑模式
|
|
if (this.$route.query.id) {
|
this.isEdit = this.$route.query.type === "view" ? false : true;
|
this.editId = this.$route.query.id;
|
await this.loadEditData();
|
}
|
},
|
methods: {
|
handleSchedulingClose() {
|
this.showScheduling = false;
|
},
|
handleSchedulingSubmit(data) {
|
console.log("data data", data);
|
this.tableData = data || [];
|
if (data && data.length > 0 && data[0].id) {
|
getEvaluateChemist({ dispatchId: data[0].id })
|
.then((res) => {
|
console.log("获取参加人员列表：", res);
|
if (res) {
|
this.participantsData = res.map((item) => {
|
return {
|
...item,
|
roleType: 5,
|
};
|
});
|
} else {
|
this.$message.error(res.msg || "获取参加人员列表失败");
|
}
|
})
|
.catch((err) => {
|
this.$message.error("获取参加人员列表失败");
|
console.error("获取参加人员列表失败:", err);
|
});
|
}
|
},
|
getStatusType(status) {
|
return this.statusTypeMap[status] || "info";
|
},
|
getStatusText(status) {
|
return this.statusTextMap[status] || "未知";
|
},
|
handleEditMember() {
|
this.$refs.selectMember.open(
|
this.participantsData,
|
this.selectedParticipants
|
);
|
},
|
// ===== 人员相关方法 =====
|
addMember() {
|
if (this.tableData.length == 0) {
|
this.$message.error("请先选择所属实验调度");
|
return;
|
}
|
this.$refs.selectMember.open(this.participantsData, []);
|
},
|
handleMemberSubmit(selectedMembers) {
|
this.selectedParticipants = selectedMembers;
|
this.$refs.selectMember.close();
|
},
|
// 将分数转换为评定值
|
getEvaluateValue(score) {
|
// 2分 = 良好(1), 1分 = 正确(2), 0分 = 失误(3)
|
const scoreMap = {
|
2: 1, // 良好
|
1: 2, // 正确
|
0: 3, // 失误
|
};
|
return scoreMap[score] || 3; // 默认返回失误
|
},
|
submitForm() {
|
const evaluateTable = this.$refs.evaluateTable;
|
if (!evaluateTable) {
|
this.$message.warning("评价表格未加载完成");
|
return;
|
}
|
const activeIndex = evaluateTable.activeIndex;
|
|
const evaluateData = {
|
evaluateOne: this.getEvaluateValue(activeIndex[0].score),
|
evaluateTwo: this.getEvaluateValue(activeIndex[1].score),
|
evaluateThree: this.getEvaluateValue(activeIndex[2].score),
|
evaluateFour: this.getEvaluateValue(activeIndex[3].score),
|
evaluateFive: this.getEvaluateValue(activeIndex[4].score),
|
evaluateSix: this.getEvaluateValue(activeIndex[5].score),
|
evaluateTime: moment().format("YYYY-MM-DD HH:mm:ss"),
|
resultEvaluateJson: JSON.stringify(activeIndex),
|
dispatchId: this.tableData[0]?.id,
|
evaluateType: 3,
|
userId: this.selectedParticipants[0].userId,
|
dispatchId: this.tableData[0]?.id,
|
status: 1,
|
};
|
add(evaluateData).then((res) => {
|
if (res.code == 200) {
|
this.$message.success("保存成功");
|
this.$router.back();
|
} else {
|
this.$message.error(res.msg || "保存失败");
|
}
|
});
|
},
|
},
|
};
|
</script>
|
|
<style scoped lang="less">
|
.el-form--inline .el-form-item {
|
margin-right: 83px;
|
}
|
|
.header-title {
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
gap: 13px;
|
|
.header-title-left {
|
display: flex;
|
align-items: center;
|
gap: 13px;
|
|
img {
|
width: 12px;
|
height: 19px;
|
}
|
|
div {
|
flex-shrink: 0;
|
font-weight: bold;
|
font-size: 18px;
|
color: #222222;
|
line-height: 27px;
|
font-family: "Source Han Sans CN Bold Bold";
|
|
&:before {
|
content: "*";
|
color: #f56c6c;
|
margin-right: 4px;
|
}
|
}
|
}
|
}
|
|
.member-list {
|
margin-top: 18px;
|
display: flex;
|
flex-wrap: wrap;
|
gap: 28px;
|
|
.member-list-card {
|
position: relative;
|
width: 340px;
|
height: 400px;
|
border-radius: 8px;
|
border: 1px solid #dcdfe6;
|
background: linear-gradient(
|
to bottom,
|
rgba(255, 77, 79, 0.2) 0%,
|
rgba(255, 242, 194, 0) 70%
|
);
|
|
.member-item {
|
height: 100%;
|
display: flex;
|
flex-direction: column;
|
|
.member-title {
|
margin-top: 20px;
|
width: 100%;
|
font-family: "Source Han Sans CN Bold Bold";
|
font-weight: bold;
|
font-size: 16px;
|
color: rgba(0, 0, 0, 0.8);
|
line-height: 16px;
|
text-align: center;
|
}
|
|
.member-name-box-2 {
|
padding: 0 20px;
|
padding-top: 40px;
|
display: grid;
|
grid-template-columns: repeat(4, 1fr);
|
align-items: flex-start;
|
flex-wrap: wrap;
|
gap: 20px;
|
justify-content: center;
|
}
|
|
.member-name {
|
width: 60px;
|
height: 60px;
|
background: #7d8b79;
|
border-radius: 50%;
|
text-align: center;
|
line-height: 60px;
|
font-weight: 500;
|
font-size: 16px;
|
color: #ffffff;
|
}
|
|
.member-edit {
|
cursor: pointer;
|
position: absolute;
|
bottom: 10px;
|
left: 50%;
|
transform: translateX(-50%);
|
font-weight: 400;
|
font-size: 12px;
|
color: #ff4d4f;
|
line-height: 22px;
|
width: 40px;
|
background: #fff1f0;
|
border-radius: 4px;
|
border: 1px solid #ffccc7;
|
text-align: center;
|
}
|
}
|
}
|
}
|
|
.add-project-footer {
|
display: flex;
|
gap: 20px;
|
margin-top: 43px;
|
|
button {
|
width: 220px;
|
}
|
}
|
</style>
|
