|
@@ -0,0 +1,271 @@
|
|
|
+<template>
|
|
|
+ <div class="part-box part-box-pad">
|
|
|
+ <el-table
|
|
|
+ :data="dataList"
|
|
|
+ border
|
|
|
+ :cell-style="cellStyleHandle"
|
|
|
+ :span-method="spanMethod"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ lang="课程信息"
|
|
|
+ fixed="left"
|
|
|
+ :summary-method="getSummaries"
|
|
|
+ show-summary
|
|
|
+ >
|
|
|
+ <el-table-column label="课程名称(代码)" min-width="200">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.courseName }}({{ scope.row.courseCode }})
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column lang="学分" width="60"></el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="毕业要求" align="center">
|
|
|
+ <template v-if="hasSubRequirements">
|
|
|
+ <el-table-column
|
|
|
+ v-for="(column, cindex) in columns"
|
|
|
+ :key="cindex"
|
|
|
+ :label="column.name"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ v-for="subr in column.subRequirements"
|
|
|
+ :key="subr.name"
|
|
|
+ :label="subr.name === 'null' ? '' : subr.name"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input-number
|
|
|
+ v-if="scope.row.canEdit"
|
|
|
+ v-model="scope.row[`${column.name}_${subr.name}`].value"
|
|
|
+ class="width-50"
|
|
|
+ :min="0"
|
|
|
+ :max="1"
|
|
|
+ :step="0.01"
|
|
|
+ step-strictly
|
|
|
+ :controls="false"
|
|
|
+ @change="
|
|
|
+ () =>
|
|
|
+ unitChange(
|
|
|
+ scope.row,
|
|
|
+ `${column.name}_${subr.name}`,
|
|
|
+ subr.columnIndex
|
|
|
+ )
|
|
|
+ "
|
|
|
+ ></el-input-number>
|
|
|
+ <span v-else>{{
|
|
|
+ scope.row[`${column.name}_${subr.name}`].value
|
|
|
+ }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-else>
|
|
|
+ <el-table-column
|
|
|
+ v-for="(column, cindex) in columns"
|
|
|
+ :key="cindex"
|
|
|
+ :label="column.name"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input-number
|
|
|
+ v-if="scope.row.canEdit"
|
|
|
+ v-model="scope.row[`${column.name}_null`].value"
|
|
|
+ class="width-50"
|
|
|
+ :min="0"
|
|
|
+ :max="1"
|
|
|
+ :step="0.01"
|
|
|
+ step-strictly
|
|
|
+ :controls="false"
|
|
|
+ @change="
|
|
|
+ () =>
|
|
|
+ unitChange(
|
|
|
+ scope.row,
|
|
|
+ `${column.name}_null`,
|
|
|
+ column.columnIndex
|
|
|
+ )
|
|
|
+ "
|
|
|
+ ></el-input-number>
|
|
|
+ <span v-else>{{ scope.row[`${column.name}_null`].value }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ trainingPlanCourseMatrixDetail,
|
|
|
+ trainingPlanCourseMatrixSave,
|
|
|
+} from "../../api";
|
|
|
+import { calcSum } from "@/plugins/utils";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "professional-matrix",
|
|
|
+ props: {
|
|
|
+ rowData: {
|
|
|
+ type: Object,
|
|
|
+ default() {
|
|
|
+ return {};
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dataList: [],
|
|
|
+ columns: [],
|
|
|
+ hasSubRequirements: false,
|
|
|
+ loading: false,
|
|
|
+ errorIndexs: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async getList() {
|
|
|
+ const res = await trainingPlanCourseMatrixDetail({
|
|
|
+ professionalId: this.rowData.id,
|
|
|
+ });
|
|
|
+ const tableData = res || [];
|
|
|
+ this.dataList = tableData.map((item, index) => {
|
|
|
+ if (!index) this.parseColumns(item.requirements);
|
|
|
+
|
|
|
+ const nitem = {
|
|
|
+ courseId: item.courseId,
|
|
|
+ courseCode: item.courseCode,
|
|
|
+ courseName: item.courseName,
|
|
|
+ canEdit: item.canEdit,
|
|
|
+ };
|
|
|
+ item.requirements.forEach((requirement) => {
|
|
|
+ requirement.subRequirements.forEach((subr) => {
|
|
|
+ nitem[`${requirement.name}_${subr.name + ""}`] = {
|
|
|
+ id: subr.id,
|
|
|
+ value: subr.content || undefined,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ return nitem;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ parseColumns(requirements) {
|
|
|
+ this.hasSubRequirements = requirements.some(
|
|
|
+ (item) => item.subRequirements[0].name !== null
|
|
|
+ );
|
|
|
+ if (!this.hasSubRequirements) {
|
|
|
+ this.columns = requirements.map((item, index) => {
|
|
|
+ return { name: item.name, columnIndex: index + 1 };
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ let cindex = 0;
|
|
|
+ this.columns = requirements.map((item) => {
|
|
|
+ return {
|
|
|
+ name: item.name,
|
|
|
+ subRequirements: item.subRequirements.map((subr) => {
|
|
|
+ return {
|
|
|
+ name: subr.name + "",
|
|
|
+ columnIndex: ++cindex,
|
|
|
+ };
|
|
|
+ }),
|
|
|
+ };
|
|
|
+ });
|
|
|
+ },
|
|
|
+ updateErrorIndexs([rowIndex, columnIndex]) {
|
|
|
+ const pos = this.errorIndexs.findIndex((item) => item[1] === columnIndex);
|
|
|
+ if (pos !== -1) {
|
|
|
+ this.errorIndexs.splice(pos, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.errorIndexs.push([rowIndex, columnIndex]);
|
|
|
+ },
|
|
|
+ clearErrorIndexs(columnIndex) {
|
|
|
+ this.errorIndexs = this.errorIndexs.filter(
|
|
|
+ (item) => item[1] !== columnIndex
|
|
|
+ );
|
|
|
+ },
|
|
|
+ async unitChange(row, key, columnIndex) {
|
|
|
+ const [fieldName, nodeName] = key.split("_");
|
|
|
+ const totalVal = calcSum(
|
|
|
+ this.dataList.map((item) => item[key].value || 0)
|
|
|
+ );
|
|
|
+ if (totalVal > 1) {
|
|
|
+ const columnName =
|
|
|
+ nodeName === "null" ? fieldName : `${fieldName}:${nodeName}`;
|
|
|
+ this.$message.error(`${columnName}列总和大于1,当前修改值将不会保存!`);
|
|
|
+
|
|
|
+ const rowIndex = this.dataList.findIndex(
|
|
|
+ (item) => item.courseCode === row.courseCode
|
|
|
+ );
|
|
|
+
|
|
|
+ this.updateErrorIndexs([rowIndex, columnIndex]);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ let saveData = [];
|
|
|
+ const curColumnHasError = this.errorIndexs.some(
|
|
|
+ (item) => item[1] === columnIndex
|
|
|
+ );
|
|
|
+ if (curColumnHasError) {
|
|
|
+ saveData = this.dataList.map((item) => {
|
|
|
+ return {
|
|
|
+ id: item[key].id,
|
|
|
+ content: item[key].value,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ saveData = [
|
|
|
+ {
|
|
|
+ id: row[key].id,
|
|
|
+ content: row[key].value,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ }
|
|
|
+
|
|
|
+ this.clearErrorIndexs(columnIndex);
|
|
|
+ await trainingPlanCourseMatrixSave(saveData);
|
|
|
+ },
|
|
|
+ cellStyleHandle({ rowIndex, columnIndex }) {
|
|
|
+ if (!this.errorIndexs.length) return;
|
|
|
+ if (
|
|
|
+ this.errorIndexs.some(
|
|
|
+ (item) => rowIndex === item[0] && columnIndex === item[1]
|
|
|
+ )
|
|
|
+ ) {
|
|
|
+ return {
|
|
|
+ backgroundColor: "#fde2e2",
|
|
|
+ };
|
|
|
+ }
|
|
|
+ },
|
|
|
+ spanMethod({ rowIndex, columnIndex }) {
|
|
|
+ if (rowIndex === 0 && columnIndex === 0) {
|
|
|
+ return { rowspan: 2, colspan: this.hasSubRequirements ? 2 : 1 };
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getSummaries(param) {
|
|
|
+ const { columns } = param;
|
|
|
+ const sums = [];
|
|
|
+ columns.forEach((column, index) => {
|
|
|
+ if (index === 0) {
|
|
|
+ sums[index] = "合计";
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (index === 1) {
|
|
|
+ sums[index] = "";
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ const key = ``;
|
|
|
+ sums[index] = calcSum(
|
|
|
+ this.dataList.map((item) => item[key].value || 0)
|
|
|
+ );
|
|
|
+ });
|
|
|
+ return sums;
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|