KindergartenUI/src/views/system/action/index.vue
2022-08-29 11:51:56 +08:00

825 lines
23 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<el-form
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="90px"
>
<el-form-item label="所属幼儿园" prop="categoryName" v-if="showyey">
<el-button
@click="kindergartenshow = true"
v-if="kindergartenName == '请选择幼儿园'"
style="width: 250px; text-align: left; height: 32px; color: #c0c4cc"
>{{ kindergartenName }}</el-button
>
<el-button
@click="kindergartenshow = true"
style="width: 250px; text-align: left; height: 32px"
v-else
>{{ kindergartenName }}</el-button
>
</el-form-item>
<el-form-item
label="所属班级"
prop="categoryName"
label-width="70px"
v-if="showbj"
>
<el-button
@click="classshowclick"
style="width: 250px; text-align: left; height: 32px; color: #c0c4cc"
v-if="className == '请选择班级'"
>{{ className }}</el-button
>
<el-button
@click="classshowclick"
style="width: 250px; text-align: left; height: 32px"
v-else
>{{ className }}</el-button
>
</el-form-item>
<el-form-item label="学生" prop="categoryName" label-width="45px">
<el-button
@click="studentshowclick"
v-if="studentname == '请选择学生'"
style="width: 250px; text-align: left; height: 32px; color: #c0c4cc"
>{{ studentname }}</el-button
>
<el-button
@click="studentshowclick"
style="width: 250px; text-align: left; height: 32px"
v-else
>{{ studentname }}</el-button
>
</el-form-item>
<el-form-item label="所属批次" prop="categoryName" label-width="70px">
<el-button
@click="batchCodeshowclick"
style="width: 250px; text-align: left; height: 32px; color: #c0c4cc"
v-if="batchCodeName == '请选择批次'"
>{{ batchCodeName }}</el-button
>
<el-button
@click="batchCodeshowclick"
style="width: 250px; text-align: left; height: 32px"
v-else
>{{ batchCodeName }}</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<!-- //批次 -->
<el-dialog
width="590px"
title="选择批次"
:visible.sync="batchCodeshow"
append-to-body
style="margin-top: 20px"
:before-close="batchCodecancel"
>
<el-table :data="testScorelist" align="center" style="margin-top: 0px">
<el-table-column label="请选择" width="100" align="center">
<template slot-scope="scope">
<el-button
type="primary"
style="width: 20px; height: 20px"
v-if="batchCodeId == scope.row.id"
circle
@click="batchCodeclick(scope.row)"
></el-button>
<el-button
v-else
style="width: 15px; height: 15px"
circle
@click="batchCodeclick(scope.row)"
></el-button>
</template>
</el-table-column>
<el-table-column
property="batchCode"
label="批次编号"
width="200"
align="center"
/>
<el-table-column
property="batchName"
label="批次名称"
width="200"
align="center"
/>
</el-table>
<pagination
v-show="total4 > 0"
:total="total4"
:page.sync="testqueryParams.pageNum"
:limit.sync="testqueryParams.pageSize"
@pagination="testScore"
/>
</el-dialog>
<!-- //学生 -->
<el-dialog
width="850px"
title="选择学生"
:visible.sync="studentshow"
append-to-body
style="margin-top: 70px"
:before-close="studentcancel"
>
<el-table :data="studentInfoList" align="center" style="margin-top: 10px">
<el-table-column label="请选择" width="70" align="center">
<template slot-scope="scope">
<el-button
type="primary"
style="width: 20px; height: 20px"
circle
v-if="studentId == scope.row.id"
@click="studentclick(scope.row)"
></el-button>
<el-button
v-else
style="width: 15px; height: 15px"
circle
@click="studentclick(scope.row)"
></el-button>
</template>
</el-table-column>
<el-table-column
property="className"
label="班级名称"
width="190"
align="center"
/>
<el-table-column
property="studentName"
label="学生姓名"
width="190"
align="center"
/>
<el-table-column
property="studentName"
label="性别"
width="190"
align="center"
>
<template slot-scope="scope">
{{ scope.row.studentSex == "MALE" ? "男" : "女" }}
</template>
</el-table-column>
<el-table-column
property="homeAddress"
label="住址"
width="190"
align="center"
/>
</el-table>
<pagination
v-show="total3 > 0"
:total="total3"
:page.sync="studentqueryParams.pageNum"
:limit.sync="studentqueryParams.pageSize"
@pagination="studentlist"
/>
</el-dialog>
<!-- //幼儿园 -->
<el-dialog
width="850px"
title="选择所属幼儿园"
:visible.sync="kindergartenshow"
append-to-body
:before-close="kindergartencancel"
>
<el-table :data="kindergartenList">
<el-table-column label="请选择" width="70" align="center">
<template slot-scope="scope">
<el-button
type="primary"
style="width: 15px; height: 15px"
circle
@click="kindergartenNameclick(scope.row)"
v-if="kindergartenId == scope.row.id"
></el-button>
<el-button
v-else
style="width: 15px; height: 15px"
circle
@click="kindergartenNameclick(scope.row)"
></el-button>
</template>
</el-table-column>
<el-table-column
property="kindergartenName"
label="幼儿园名字"
width="150"
align="center"
>
</el-table-column>
<el-table-column
property="kindergartenAddress"
label="幼儿园地址"
width="150"
align="center"
>
</el-table-column>
<el-table-column
label="幼儿园所在组织"
align="center"
prop="organizeName"
width="150"
>
</el-table-column>
<el-table-column
property="contacts"
label="联系人"
width="150"
align="center"
>
</el-table-column>
<el-table-column
property="phone"
label="联系电话"
width="150"
align="center"
>
</el-table-column>
</el-table>
<pagination
v-show="total1 > 0"
:total="total1"
:page.sync="kqueryParams.pageNum"
:limit.sync="kqueryParams.pageSize"
@pagination="getList"
/>
</el-dialog>
<!-- //班级 -->
<el-dialog
width="1000px"
title="选择所属班级"
:visible.sync="classshow"
append-to-body
:before-close="classcancel"
>
<el-table :data="classinfoList" align="center" style="margin-top: 10px">
<el-table-column label="请选择" width="70" align="center">
<template slot-scope="scope">
<el-button
type="primary"
style="width: 20px; height: 20px"
circle
@click="classclick(scope.row)"
v-if="classId == scope.row.id"
></el-button>
<el-button
v-else
style="width: 15px; height: 15px"
circle
@click="classclick(scope.row)"
></el-button>
</template>
</el-table-column>
<el-table-column
property="kindergartenName"
label="幼儿园名称"
width="190"
align="center"
/>
<el-table-column
property="className"
label="班级名称"
width="180"
align="center"
>
</el-table-column>
<el-table-column
property="classType"
label="班级类型"
width="160"
align="center"
>
<template slot-scope="scope">
{{ scope.row.classType == dictValue1 ? "大班" : "" }}
{{ scope.row.classType == dictValue2 ? "中班" : "" }}
{{ scope.row.classType == dictValue3 ? "小班" : "" }}
{{ scope.row.classType == dictValue4 ? "毕业" : "" }}
</template>
</el-table-column>
<el-table-column
property="classTeacher"
label="班主任姓名"
width="180"
align="center"
>
</el-table-column>
<el-table-column
property="phone"
label="联系电话"
width="190"
align="center"
>
</el-table-column>
</el-table>
<pagination
v-show="total2 > 0"
:total="total2"
:page.sync="classqueryParams.pageNum"
:limit.sync="classqueryParams.pageSize"
@pagination="classinfo"
/>
</el-dialog>
<el-row v-show="itemshow">
<el-col :span="24" class="card-box" style="">
<!-- <el-card> -->
<div slot="header" style="text-align: center; font-size: 25px">
<span></span>
</div>
<div style="width: 100%; display: flex; flex-wrap: wrap">
<el-table
:data="actionlist"
border
:span-method="arraySpanMethod"
style="width: 100%; margin-top: 20px"
>
<el-table-column
prop="categoryName"
label="测试分类"
width="150"
align="center"
>
</el-table-column>
<el-table-column
prop="itemName"
label="测试项目"
width="150"
align="center"
>
</el-table-column>
<el-table-column
prop="itemFraction"
label="动作技能总分"
width="120"
align="center"
>
</el-table-column>
<el-table-column
prop="unifiedStandardScore"
label="统一最高得分"
width="120"
align="center"
>
</el-table-column>
<el-table-column
prop="smallStandardScore"
label="小班最高得分"
width="120"
align="center"
>
</el-table-column>
<el-table-column
prop="middleStandardScore"
label="中班最高得分"
width="120"
align="center"
>
</el-table-column>
<el-table-column
prop="largeStandardScore"
label="大班最高得分"
width="120"
align="center"
>
</el-table-column>
<el-table-column
prop="itemScoreAll"
label="综合得分"
width="176"
align="center"
>
</el-table-column>
<el-table-column
prop="syntheticalAssess"
label="综合评价"
width="180"
align="center"
>
</el-table-column>
<el-table-column
prop="remark"
label="测试目的"
width="180"
align="center"
>
</el-table-column>
</el-table>
</div>
<!-- </el-card> -->
</el-col>
</el-row>
<el-row :gutter="20" v-if="itemshow2">
<el-col :span="24" :offset="0">
<el-card>
<div slot="header" style="text-align: center">
<img style="width: 40px" src="@/icons/笑脸.png" alt="" />
<div><!-- card title -->该学生此批次暂没数据</div>
</div>
<!-- card body -->
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
import {
listKindergartenInfo,
tKindergartenInfo,
} from "@/api/system/kindergartenInfo";
import { listStudentInfo } from "@/api/system/studentInfo";
import { listClassinfo } from "@/api/system/classinfo";
import { getRoleInfo, testScoreBatch } from "@/api/system/quality";
import { listAction } from "@/api/system/action";
export default {
name: "action",
components: {},
data() {
return {
itemshow: false,
itemshow2: false,
showyey: true,
showbj: true,
total1: 0,
total2: 0,
total3: 0,
total4: 0,
//遮罩层
kindergartenshow: false,
classshow: false,
studentshow: false,
batchCodeshow: false,
//班级类型
dictValue1: "",
dictValue2: "",
dictValue3: "",
dictValue4: "",
ClassType: "class_type",
// 显示搜索条件
showSearch: true,
// 表单参数
form: {},
//学生查询
studentqueryParams: {
pageNum: 1,
pageSize: 10,
classId: "",
nationDictId: null,
studentName: null,
studentSex: null,
studentNumber: null,
birthDate: null,
cardNumber: null,
onceName: null,
homeAddress: null,
},
//班级查询
classqueryParams: {
pageNum: 1,
pageSize: 10,
kindergartenId: "",
className: null,
classType: null,
},
//幼儿园查询参数
kqueryParams: {
pageNum: 1,
pageSize: 10,
organizeId: null,
kindergartenName: null,
kindergartenAddress: null,
kindergartenType: null,
phone: null,
contacts: null,
},
//幼儿园list
kindergartenList: [],
//幼儿园名字
kindergartenName: "请选择幼儿园",
//幼儿园ID
kindergartenId: "",
//班级list
classinfoList: [],
//班级名字
className: "请选择班级",
//班级ID
classId: "",
//学生list
studentInfoList: [],
//学生名字
studentname: "请选择学生",
//学生ID
studentId: "",
//批次名称
batchCodeName: "请选择批次",
//批次ID
batchCodeId: "",
//批次list
testScorelist: [],
//批次编号
testqueryParams: {
pageNum: 1,
pageSize: 10,
},
//
actionlist: [],
spanArr: [],
position: 0, // 标记位置
spanArr2: [],
position2: 0, // 标记位置
//查询传值
queryParams: {
pageNum: 1,
pageSize: 10,
// studentId: "10",
// batchCode: "PC202208030005",
studentId: "",
batchCode: "",
},
};
},
created() {
this.getList();
this.class();
// this.listActioninfo();
},
mounted() {
// 需求,也就是合并多少行,
// 对于被合并的单元格rowspan和colspan都为零。而合并的单元格他的colspan为1因为它不跨列。
// 对表格数据进行以下处理。假设要合并的字段为a。相同的a单元格合并起来。
},
methods: {
actionforeach() {
this.actionlist.forEach((item, index) => {
if (index == 0) {
this.spanArr.push(1);
this.position = 0;
this.spanArr2.push(1);
this.position2 = 0;
} else {
// 判断当前元素与上一个元素是否相同 也就是判断 a 的值是否相同
if (
this.actionlist[index].categoryName ==
this.actionlist[index - 1].categoryName
) {
// 如果相同 当前位置的 值 加1
this.spanArr[this.position] += 1;
this.spanArr.push(0); // 下一个位置 给 0
} else {
this.spanArr.push(1); // 不相等下一个位置给 1
this.position = index; // 标记位置 设置为当前位置
}
if (
this.actionlist[index].itemScoreAll ==
this.actionlist[index - 1].itemScoreAll
) {
this.spanArr2[this.position] += 1;
this.spanArr2.push(0); // 下一个位置 给 0
} else {
this.spanArr2.push(1); // 不相等下一个位置给 1
this.position2 = index; // 标记位置 设置为当前位置
}
}
});
// console.log(this.spanArr);
},
// 合并单元格
arraySpanMethod({ row, column, rowIndex, columnIndex }) {
// console.log(columnIndex);
// 对第一列 相对字段 a 进行合并
if (columnIndex == 0) {
// console.log(this.spanArr);
const _row = this.spanArr[rowIndex];
const _col = _row > 0 ? 1 : 0;
return {
rowspan: _row,
colspan: _col,
};
} else if (columnIndex == 7) {
// console.log(this.spanArr2);
const _row = this.spanArr2[rowIndex];
const _col = _row > 0 ? 1 : 0;
return {
rowspan: _row,
colspan: _col,
};
}
},
//动作发展检测
listActioninfo() {
listAction(this.queryParams).then((res) => {
if (!res.rows || res.rows == "") {
this.itemshow2 = true;
this.itemshow = false;
} else {
// res.rows.itemCategoryList.forEach((e) => {
// e.push(res.rows.categoryName);
// });
this.actionlist = res.rows;
this.actionforeach();
this.itemshow = true;
this.itemshow2 = false;
console.log(this.actionlist);
}
});
},
// 点击学生按钮
studentshowclick() {
if (this.studentqueryParams.classId == "") {
this.$message.error("请先选择班级");
} else {
this.studentshow = true;
this.studentlist();
}
},
//点击批次
batchCodeshowclick() {
if (this.queryParams.studentId == "") {
this.$message.error("请先选择学生");
} else {
this.testScore();
this.batchCodeshow = true;
}
},
//点击批次左边
batchCodeclick(row) {
this.spanArr = [];
this.position = 0; // 标记位置
this.spanArr2 = [];
this.position2 = 0; // 标记位置
console.log(row);
this.batchCodeName = row.batchName;
this.batchCodeId = row.id;
this.queryParams.batchCode = row.batchCode;
this.batchCodeshow = false;
this.listActioninfo();
},
//批次
testScore() {
testScoreBatch(this.testqueryParams).then((res) => {
this.testScorelist = res.rows;
this.total4 = res.total;
});
},
//获取学生
studentlist() {
listStudentInfo(this.studentqueryParams).then((res) => {
this.studentInfoList = res.rows;
this.total3 = res.total;
// console.log(this.studentInfoList);
});
},
//点击所属班级
classshowclick() {
if (
this.classqueryParams.kindergartenId == "" ||
this.classqueryParams.kindergartenId == null
) {
this.$message.error("请先选择幼儿园");
} else {
this.classshow = true;
this.classinfo();
}
// console.log(this.classqueryParams);
},
//批次关闭
batchCodecancel() {
this.batchCodeshow = false;
},
//学生关闭
studentcancel() {
this.studentshow = false;
},
//幼儿园关闭
kindergartencancel() {
this.kindergartenshow = false;
},
//班级关闭
classcancel() {
this.classshow = false;
}, //学生左侧按钮
studentclick(row) {
this.spanArr = [];
this.position = 0; // 标记位置
this.spanArr2 = [];
this.position2 = 0; // 标记位置
this.studentname = row.studentName;
this.studentId = row.id;
this.studentshow = false;
this.queryParams.studentId = row.id;
if (this.queryParams.batchCode != "") {
this.listActioninfo();
}
},
//班级左侧点击
classclick(row) {
// console.log(row);
this.className = row.className;
this.classId = row.id;
this.studentqueryParams.classId = row.id;
this.studentname = "请选择学生";
this.studentId = "";
this.queryParams.studentId = "";
this.classshow = false;
},
//幼儿园左侧点击
kindergartenNameclick(row) {
this.classqueryParams.kindergartenId = row.id;
this.kindergartenName = row.kindergartenName;
this.kindergartenId = row.id;
this.kindergartenId = row.id;
this.className = "请选择班级";
this.classId = "";
this.studentname = "请选择学生";
this.studentId = "";
this.queryParams.studentId = "";
this.kindergartenshow = false;
},
//班级类型
class() {
tKindergartenInfo(this.ClassType).then((res) => {
this.dictValue1 = res.data[0].dictValue;
this.dictValue2 = res.data[1].dictValue;
this.dictValue3 = res.data[2].dictValue;
this.dictValue4 = res.data[3].dictValue;
});
},
//班级list
classinfo() {
listClassinfo(this.classqueryParams).then((response) => {
this.classinfoList = response.rows;
this.total2 = response.total;
// console.log(this.classinfoList);
});
},
getList() {
//用户权限
getRoleInfo().then((res) => {
console.log(res);
this.classqueryParams.kindergartenId = res.data.kindergartenId;
var user = res.data.roleKeys;
console.log(user);
if (user.includes("enchou")) {
this.showyey = false;
return;
} else if (user.includes("teacher")) {
this.showyey = false;
return;
} else if (user.includes("parent")) {
this.showyey = false;
this.showbj = false;
return;
}
});
//获取幼儿园list
listKindergartenInfo(this.kqueryParams).then((response) => {
this.kindergartenList = response.rows;
this.total1 = response.total;
// console.log(this.kindergartenList);
});
},
// 表单重置
reset() {
this.form = {};
this.resetForm("form");
},
},
};
</script>
<style scoped='scss'>
::v-deep .el-card__header {
border: none;
}
</style>