You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

650 lines
28 KiB

4 years ago
<template>
<div>
<el-form :disabled="isDetail">
<el-card shadow="hover" class="m-b-20">
<div class="flex-between">
<el-page-header @back="goBack" content="项目配置"></el-page-header>
<div v-if="!isDetail">
<el-button v-if="!projectId" type="success" size="small" @click="handleSubmit(0)">保存为草稿</el-button>
<el-button type="primary" size="small" @click="handleSubmit(1)">确定并发布</el-button>
4 years ago
</div>
</div>
4 years ago
</el-card>
<el-card shadow="hover" class="m-b-20">
<h6 class="p-title">基本信息</h6>
<div>
<el-form label-width="80px">
<div class="flex">
<el-form-item label="项目名称">
<el-input :disabled="isDetail" v-model.trim="projectManage.projectName" placeholder="20个字符以内" @blur="projectNameExistis"></el-input>
4 years ago
</el-form-item>
<el-form-item label="项目权限">
<el-select :disabled="isDetail" v-model="projectManage.permissions" placeholder="请选择">
<el-option label="练习" :value="0"></el-option>
<el-option label="考核" :value="1"></el-option>
<el-option label="竞赛" :value="2"></el-option>
4 years ago
</el-select>
</el-form-item>
<el-form-item label="系统">
<el-select :disabled="isDetail" v-model="projectManage.systemId" placeholder="请选择" @change="systemChange">
4 years ago
<el-option
v-for="item in systemList"
:key="item.value"
:label="item.label"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</div>
</el-form>
</div>
</el-card>
<el-card shadow="hover" class="m-b-20">
<h6 class="p-title">实验目标</h6>
<div>
<el-form label-width="0">
<el-form-item>
<quill :border="true" :readonly="isDetail" v-model="projectManage.experimentTarget" :minHeight="150" :height="150" />
4 years ago
</el-form-item>
</el-form>
</div>
</el-card>
<el-card shadow="hover" class="m-b-20">
<h6 class="p-title">案例描述</h6>
<div>
<el-form label-width="0">
<el-form-item>
<quill :border="true" :readonly="isDetail" v-model="projectManage.experimentDescription" :minHeight="150" :height="150" />
4 years ago
</el-form-item>
</el-form>
</div>
</el-card>
<el-card shadow="hover" class="m-b-20">
<div class="m-b-20 flex-between">
<h6 class="p-title" style="margin-bottom: 0">实验任务</h6>
<div>
<!--<el-button :disabled="isDetail" type="primary" @click="toJudgePoint('home')">进入判分点</el-button>-->
4 years ago
</div>
</div>
<div class="m-b-20 flex-between">
<div class="flex-center">
<div class="m-r-20" style="color: #f00">项目总分值100</div>
<!-- <div>权重&emsp;<div class="dib"><el-input></el-input></div></div> -->
</div>
4 years ago
<div>
<el-button :disabled="isDetail" class="m-r-20" type="text" @click="avgDistributionScore">平均分配分值</el-button>
<el-button :disabled="isDetail" class="m-r-20" type="text" @click="manualDistributionScore">手动分配分值</el-button>
<span>(待分配分值: {{ handDistributionScore }}/100)</span>
4 years ago
</div>
</div>
<el-button :disabled="isDetail" type="primary" icon="el-icon-plus" round @click="handleQueryJudgment" style="margin-bottom: 10px">判分点</el-button>
<el-button :disabled="isDetail" type="primary" icon="el-icon-delete" round @click="batchDeleteProjectJudgment" style="margin-bottom: 10px">批量删除</el-button>
<el-table
ref="projectJudgementTable"
:data="projectJudgmentData"
class="table"
stripe
header-align="center"
@selection-change="handleSelectionProjectJudgment"
row-key="judgmentId"
>
4 years ago
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column prop="id" label="序号" width="80" align="center">
<template slot-scope="scope">
{{ scope.$index + 1 }}
4 years ago
</template>
</el-table-column>
<el-table-column prop="name" label="判分指标" align="center"></el-table-column>
<el-table-column prop="name" label="判分点名称" align="center"></el-table-column>
<el-table-column label="排序" align="center">
<template slot-scope="scope">
<el-button
:disabled="isDetail"
v-show="scope.$index > 0"
type="text"
icon="el-icon-top"
@click="handleMoveUp(scope.$index)"
style="font-size: 24px"
></el-button>
<el-button
:disabled="isDetail"
v-show="(scope.$index+1) < projectJudgmentData.length"
type="text"
icon="el-icon-bottom"
@click="handleMoveDown(scope.$index)"
style="font-size: 24px"
></el-button>
</template>
4 years ago
</el-table-column>
<el-table-column label="实验要求" align="center">
<template slot-scope="scope">
4 years ago
<quill :border="true" :readonly="true" elseRead="true" v-model="scope.row.experimentalRequirements" :minHeight="150" :height="150" />
4 years ago
</template>
</el-table-column>
<el-table-column label="操作" width="140" align="center">
<template slot-scope="scope">
<!--<el-button :disabled="isDetail" type="text" style="margin-right: 10px" @click="toJudgePoint('edit', scope.row)">自定义</el-button>-->
<el-button :disabled="isDetail" type="text" @click="delJudgePoint(scope.$index)">删除</el-button>
4 years ago
</template>
</el-table-column>
<el-table-column prop="score" label="分数" align="center">
4 years ago
<template slot-scope="scope">
<!--type="number"-->
<el-input :disabled="isDetail" v-model.trim="scope.row.score" @input="scoreChange(scope.row, scope.$index)"></el-input>
4 years ago
</template>
</el-table-column>
</el-table>
</el-card>
<el-card shadow="hover" class="m-b-20">
<div class="m-b-20 flex-between">
<h6 class="p-title" style="margin-bottom: 0">实验提示</h6>
<div>
启用
<el-switch :disabled="isDetail" :active-value="0" :inactive-value="1" v-model="projectManage.hintOpen"></el-switch>
4 years ago
</div>
</div>
<div>
<el-form label-width="0">
<el-form-item prop="tips" label="">
<quill :border="true" :readonly="isDetail" v-model="projectManage.experimentHint" :minHeight="150" :height="150" />
4 years ago
</el-form-item>
</el-form>
</div>
</el-card>
</el-form>
<!--选择判分点对话框-->
<el-dialog title="添加判分点" :visible.sync="dialogVisible" width="40%" :close-on-click-modal="false">
4 years ago
<div class="text-right m-b-10">
<div>
<el-input placeholder="请输入需要查找的判分点" prefix-icon="el-icon-search" v-model.trim="judgementpointsquery" clearable></el-input>
</div>
4 years ago
</div>
<el-table
:data="judgementData"
ref="judgementTable"
class="table"
stripe
header-align="center"
max-height="400"
@selection-change="handleSelectionJudgment"
:row-key="rowKey"
>
4 years ago
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column>
<el-table-column prop="id" label="序号" align="center" width="100">
4 years ago
<template slot-scope="scope">
{{ scope.$index + 1 }}
4 years ago
</template>
</el-table-column>
<el-table-column prop="name" label="判分点名称" align="center"></el-table-column>
<el-table-column label="操作" align="center" width="100">
4 years ago
<template slot-scope="scope">
<el-button size="mini" @click="toJudgePoint('view', scope.row)">查看</el-button>
4 years ago
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" @click="addJudgment"> </el-button>
4 years ago
</div>
</el-dialog>
</div>
</template>
<script>
import Setting from "@/setting";
import util from "@/libs/util";
import { mapState, mapActions } from "vuex";
import quill from "@/components/quill";
4 years ago
export default {
components: {
quill
},
data() {
4 years ago
return {
4 years ago
host: Setting.apiBaseURL,
4 years ago
isHh: Setting.isHh,
projectId: this.$route.query.projectId,
4 years ago
systemList: Setting.systemList,
token: btoa(util.local.get(Setting.tokenKey)),
isDetail: Boolean(this.$route.query.show),
projectManage: {
founder: 0, // 创建人角色(0、系统 1、老师)
projectName: "", // 项目名称
permissions: 0, // 项目权限(0、练习 1、考核 2、竞赛)
schoolId: Setting.schoolId,
systemId: this.$store.state.project.lastSystemId, // 系统id
hintOpen: 0, // 实验提示是否开启(0开启 1不开启 默认0)
experimentHint: "", // 实验提示
experimentTarget: "", // 实验目标
experimentDescription: "", // 案例描述
state: 0, // 状态(0、草稿箱 1、已发布)
isOpen: 0, // 是否开启(0开启 1未开启 默认0)
isDel: 0 // 是否删除(0、未删除 1、已删除 默认0)
4 years ago
},
projectJudgmentData: [], //实验任务(项目判分点)
selectedProjectJudgment: [], // 选中的项目判分点
dialogVisible: false, // 选择判分点对话框
judgementpointsquery: "", //条件筛选判分点
judgementData: [], // 判分点列表数据
selectedJudgment: [], // 选中的判分点
rowKey: "", // 判分点行数据的 Key
projectNameRepeat: false, // 项目名称是否重复
flag: false, //判分点表格分数是否禁用
4 years ago
avgValuelist: [], //取得判分点平均分的数组
searchTimer: null,
isToPoint: false // 判断是否是跳转到判分点系统
};
4 years ago
},
4 years ago
computed: {
...mapState("project", [
"projectFields", "lastSystemId"
4 years ago
]),
handDistributionScore: function() {
//计算判分点分值,超出100提示,
let score = 0;
this.projectJudgmentData.forEach(e => {
score += parseInt(e.score);
});
if (isNaN(score)) {
return 0;
}
if (score > 100) {
util.warningMsg(res.message);
util.errorMsg("分配的数值已超过100");
}
return score;
4 years ago
}
},
watch: {
projectJudgmentData: {
4 years ago
handler(newValue) {
console.log("newValue:", newValue);
4 years ago
},
deep: true
},
judgementpointsquery(n) {
clearTimeout(this.searchTimer);
4 years ago
this.searchTimer = setTimeout(() => {
this.handleQueryJudgment();
}, 500);
}
},
created() {
console.log(this.projectManage.systemId, "this.projectManage.systemId", this.lastSystemId);
},
mounted() {
if (this.$route.query.projectId) {
this.projectId = this.$route.query.projectId;
this.getInfoData();
}
// 判断有没有缓存数据
if (JSON.stringify(this.projectFields) != '{}') {
let { projectManage, projectJudgmentData } = this.projectFields;
this.projectManage = projectManage;
this.projectJudgmentData = projectJudgmentData;
4 years ago
}
},
beforeDestroy() {
if (!this.isToPoint) {
this.setProject({});
4 years ago
}
},
methods: {
...mapActions("project", [
"setSystemId", "setProject"
4 years ago
]),
goBack() { // 返回
if (this.isDetail) {
this.$router.back();
} else {
this.$confirm("确定返回?未更新的信息将不会保存。", "提示", {
type: "warning"
}).then(() => {
this.$router.back();
}).catch(() => {
4 years ago
});
}
},
getInfoData() { // 获取详情数据
this.$get(`${this.api.getProjectDetail}?projectId=${this.projectId}&schoolId=${this.projectManage.schoolId}`).then(res => {
if (res.status === 200) {
let { projectManage, projectJudgmentVos } = res;
this.projectManage = projectManage;
this.projectJudgmentData = projectJudgmentVos;
} else {
util.warningMsg(res.message);
4 years ago
}
}).catch(err => {
console.log(err);
});
},
projectNameExistis() { // 项目管理名称判重
if (this.projectManage.projectName) {
this.$post(this.api.queryNameIsExist, { projectName: this.projectManage.projectName }).then(res => {
if (res.status === 200) {
this.projectNameRepeat = false;
} else {
this.projectNameRepeat = true;
}
}).catch(err => {
this.projectNameRepeat = true;
});
} else {
this.projectNameRepeat = false;
4 years ago
}
},
systemChange() { // 切换系统
if (this.projectJudgmentData.length) {
this.$confirm("更换系统会清空实验任务,确认更换?", "提示", {
type: "warning"
4 years ago
}).then(() => {
this.projectJudgmentData = [];
this.setSystemId(this.projectManage.systemId);
4 years ago
}).catch(() => {
this.projectManage.systemId = this.lastSystemId;
console.log(this.lastSystemId, "this.lastSystemId");
});
4 years ago
}
},
judgmentRelease() { //判断能否成功发布
let {
projectName,
experimentTarget,
experimentDescription,
experimentHint,
hintOpen
} = this.projectManage;
if (!projectName) {
util.warningMsg("请输入项目名称");
4 years ago
return false;
}
if (this.projectNameRepeat) {
util.warningMsg("该项目名称已存在");
4 years ago
return false;
}
if (!experimentTarget) {
util.warningMsg("请输入实验目标");
4 years ago
return false;
}
if (!experimentDescription) {
util.warningMsg("请输入案例描述");
4 years ago
return false;
}
if (this.projectJudgmentData.length == 0) {
util.warningMsg("请添加判分点");
4 years ago
return false;
}
if (this.handDistributionScore < 100) {
util.warningMsg("判分点分数未满100");
4 years ago
return false;
}
if (this.handDistributionScore > 100) {
util.warningMsg("判分点分数已超过100");
4 years ago
return false;
}
if (!experimentHint && hintOpen) {
util.warningMsg("请输入实验提示");
4 years ago
return false;
}
return true;
},
handleSubmit(state) { //处理提交
if (!this.judgmentRelease()) { //判断页面是否有没有输入的内容
4 years ago
return;
}
this.setSystemId(this.projectManage.systemId);
this.projectManage.state = state;
let tempArr = this.projectJudgmentData.map(i => {
let obj = {
projectId: this.projectId ? this.projectId : "",
judgmentId: i.judgmentId,
score: i.score
};
return obj;
});
4 years ago
let params = {
projectManage: this.projectManage,
projectJudgmentList: tempArr
};
let { systemId } = this.projectManage;
if (this.projectId) {
if (systemId == 2 || systemId == 3) {
console.log("系统id:", systemId);
} else {
// 更新
this.updateProject(params);
}
4 years ago
} else {
if (systemId == 2 || systemId == 3) {
console.log("系统id:", systemId);
} else {
// 添加
this.addProject(params);
}
4 years ago
}
},
updateProject(params) { // 更新项目
this.$post(`${this.api.updateProjectManage}`, params).then(res => {
if (res.status === 200) {
util.successMsg("更新实验项目成功");
this.$router.back();
}
}).catch(err => {
console.log(err);
4 years ago
});
},
addProject(params) { // 添加项目
this.$post(`${this.api.addProjectManage}`, params).then(res => {
if (res.status === 200) {
util.successMsg("添加实验项目成功");
this.$router.back();
}
}).catch(err => {
console.log(err);
});
},
manualDistributionScore() { //点击手动分配分值
4 years ago
4 years ago
},
avgDistributionScore() {
4 years ago
//点击平均分配分值
if (this.projectJudgmentData.length) {
this.$get(this.api.avgValues, {
number: this.projectJudgmentData.length
}).then(res => {
if (res.status === 200 && res.data) {
this.projectJudgmentData = this.projectJudgmentData.map((item, index) => {
item.score = res.data[index];
return item;
});
}
4 years ago
});
}
},
handleMoveUp(index) { // 处理上移
let x = index;
let y = index + 1;
this.projectJudgmentData.splice(x - 1, 1, ...this.projectJudgmentData.splice(y - 1, 1, this.projectJudgmentData[x - 1]));
4 years ago
},
handleMoveDown(index) { // 处理下移
let x = index + 1;
let y = index + 2;
this.projectJudgmentData.splice(x - 1, 1, ...this.projectJudgmentData.splice(y - 1, 1, this.projectJudgmentData[x - 1]));
4 years ago
},
scoreChange(row, index) { // 暂时解决,输入分数,页面没有更新
this.projectJudgmentData.splice(index, 1, row);
4 years ago
},
delJudgePoint(index) { // 删除判分点
this.$confirm("确定要删除吗?", "提示", {
type: "warning"
}).then(() => {
this.projectJudgmentData.splice(index, 1);
}).catch(() => {
4 years ago
});
},
handleSelectionProjectJudgment(val) {
this.selectedProjectJudgment = val;
4 years ago
},
batchDeleteProjectJudgment() { // 批量删除判分点
if (this.selectedProjectJudgment.length) {
this.$confirm("确定要删除吗?", "提示", {
type: "warning"
}).then(() => {
// this.projectJudgmentData.splice(index, 1);
let list = this.projectJudgmentData;
let result = [];
list.map(i => {
this.selectedProjectJudgment.find(j => j.judgmentId === i.judgmentId) || result.push(i);
});
this.projectJudgmentData = result;
}).catch(() => {
4 years ago
});
} else {
util.warningMsg("请选择判分点");
4 years ago
}
},
handleQueryJudgment() { // 查询判分点数据
let { systemId } = this.projectManage;
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.judgementTable.clearSelection();
});
let params = {
name: this.judgementpointsquery,
pageNum: 1,
pageSize: 10000,
systemId
};
if (systemId == 2 || systemId == 3) {
console.log("系统id:", systemId);
} else if (systemId == 11) {
// (流程)交易类
this.rowKey = "lcId";
this.getProcessClassData(params);
} else {
// 编程类
this.rowKey = "bcId";
this.getProgrammingClassData(params);
}
},
getProcessClassData(params) { // 获取流程类判分点列表数据
this.$post(`${this.api.getLcJudgmentPoint}`, params).then(res => {
if (res.status === 200) {
let list = res.message.records;
let result = [];
list.map(i => {
i.judgmentId = i.lcId;
this.projectJudgmentData.find(j => j.judgmentId === i.judgmentId) || result.push(i);
});
this.judgementData = result;
}
}).catch(err => {
console.log(err);
});
4 years ago
},
getProgrammingClassData(params) { // 获取编程类判分点列表数据
this.$post(this.api.getBcJudgmentPoint, params).then(res => {
if (res.status === 200) {
let list = res.message.records;
let result = [];
list.map(i => {
i.judgmentId = i.bcId;
this.projectJudgmentData.find(j => j.judgmentId === i.judgmentId) || result.push(i);
});
this.judgementData = result;
}
4 years ago
}).catch(err => {
console.log(err);
});
4 years ago
},
handleSelectionJudgment(val) { // 处理多选判分点
this.selectedJudgment = val;
4 years ago
},
addJudgment() { // 确认选择判分点
if (this.selectedJudgment.length) {
this.dialogVisible = false;
let tempArr = this.selectedJudgment.map(i => {
i.score = 0;
return i;
});
this.projectJudgmentData = this.projectJudgmentData.concat(tempArr);
this.$nextTick(() => {
this.$refs.projectJudgementTable.clearSelection();
});
} else {
util.warningMsg("请选择判分点");
4 years ago
}
},
handleCacheData() { // 处理缓存数据
this.isToPoint = true;
this.setProject({ projectManage: this.projectManage, projectJudgmentData: this.projectJudgmentData });
4 years ago
},
toJudgePoint(type, row) { // 进入判分点系统
this.handleCacheData();
// let host = this.host;
let host = "http://192.168.31.154:8087/"; // 本地
let { systemId } = this.projectManage;
let href = "";
if (type === "view") {
// 查看
if (systemId == 2) {
href = `${host}jdTrials/#/programOption?id=${row.judgmentPointsId}`;
} else if (systemId == 3) {
href = `${host}jdTrials/#/programOptions?id=${row.judgmentPointsId}`;
} else if (systemId == 11) {
// 交易类判分点(银行综合系统)
href = `${host}jdTrials/#/Transaction?isView=true&systemId=${systemId}&lcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
} else {
// 编程类判分点(python子系统)
href = `${host}jdTrials/#/program?isView=true&systemId=${systemId}&bcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
4 years ago
}
} else if (type === "edit") {
// 自定义(老师端隐藏此功能)
if (systemId == 2) {
href = `${host}jdTrials/#/programOption?id=${row.judgmentPointsId}`;
} else if (systemId == 3) {
href = `${host}jdTrials/#/programOptions?id=${row.judgmentPointsId}`;
} else if (systemId == 11) {
// 交易类判分点(银行综合系统)
href = `${host}jdTrials/#/Transaction?isEdit=true&systemId=${systemId}&lcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
} else {
// 编程类判分点(python子系统)
href = `${host}jdTrials/#/program?isEdit=true&systemId=${systemId}&bcId=${row.judgmentId}&token=${this.token}&referrer=${btoa(location.href)}`;
}
} else if (type === 'home') {
if (systemId == 2 || systemId == 3) {
href = `${host}jdTrials/#/list`;
} else {
// 进入判分点系统首页(老师端隐藏此功能)
href = `${host}#/?systemId=${systemId}&token=${this.token}&referrer=${btoa(location.href)}`;
4 years ago
}
}
location.href = href;
4 years ago
}
}
};
4 years ago
</script>
<style lang="scss" scoped>
/deep/ .readonly .ql-toolbar {
height: 0;
padding: 0;
border-bottom: 0;
}
4 years ago
</style>