|
@@ -0,0 +1,588 @@
|
|
|
+<template>
|
|
|
+ <div class="i_body">
|
|
|
+ <div class="i_body_title">
|
|
|
+ <span>测评项目</span>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" class="bgColor" @click="returnA()">返回</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="i_body_box">
|
|
|
+ <div class="check_nav">
|
|
|
+ <div class="nav all" :class="{ active: type == '' }" @click="checkType('')">所有评测</div>
|
|
|
+ <div class="nav"
|
|
|
+ :class="{ active: type == item.id, gr: item.name == '个人写真', md: item.name == '明灯导航', jy: item.name == '教师耕耘', yy: item.name == '煜煜星光' }"
|
|
|
+ @click="checkType(item.id)" v-for="(item, index) in typeArray" :key="index">{{ item.name }}</div>
|
|
|
+ <!-- <div class="nav gr" :class="{ active: type == 2 }" @click="checkType(2)">个人写真</div>
|
|
|
+ <div class="nav md" :class="{ active: type == 3 }" @click="checkType(3)">明灯导航</div>
|
|
|
+ <div class="nav jy" :class="{ active: type == 4 }" @click="checkType(4)">教研耕耘</div>
|
|
|
+ <div class="nav yy" :class="{ active: type == 5 }" @click="checkType(5)">煜煜星光</div> -->
|
|
|
+ </div>
|
|
|
+ <div class="check_box">
|
|
|
+ <div class="noneData" v-if="!worksArray.length" style="text-align: center;">暂无数据</div>
|
|
|
+ <div class="test_panel" v-for="(item, index) in worksArray" :key="index">
|
|
|
+ <div class="test_panel_title">
|
|
|
+ <div class="title">
|
|
|
+ <span>已完成</span>
|
|
|
+ <span>{{ item.title }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="time">
|
|
|
+ <span>提交时间: {{ item.time }}</span>
|
|
|
+ <span>修改时间: {{ item.utime }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="test_panel_box">
|
|
|
+ <div class="detail">
|
|
|
+ {{ item.brief ? item.brief : '暂无描述' }}
|
|
|
+ </div>
|
|
|
+ <div class="panel">
|
|
|
+ <div class="score">
|
|
|
+ <div><span>25</span><span>题</span></div>
|
|
|
+ <div>题目总数</div>
|
|
|
+ </div>
|
|
|
+ <div class="score">
|
|
|
+ <div><span>98</span><span>分</span></div>
|
|
|
+ <div>综合得分</div>
|
|
|
+ </div>
|
|
|
+ <div class="btn">
|
|
|
+ <div @click="doTest(item.courseid,item.id)"><span></span><span>编辑</span></div>
|
|
|
+ <div @click="checkTest(item.courseid,item.id)"><span></span><span>查看</span></div>
|
|
|
+ <div @click="copyTest(item.id)"><span></span><span>复制</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="test_add_box" v-if="item.array.length > 1">
|
|
|
+ <div class="test" v-for="(test) in item.array" :key="test.id">
|
|
|
+ <img src="../../../../assets/icon/test/teacher.jpg" />
|
|
|
+ <div class="time">
|
|
|
+ <span>提交时间</span>
|
|
|
+ <span>{{ test.time }}</span>
|
|
|
+ <span>修改时间</span>
|
|
|
+ <span>{{ test.utime }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="mask">
|
|
|
+ <div @click="doTest(test.courseid,test.id)"><span></span><span>编辑</span></div>
|
|
|
+ <div @click="checkTest(test.courseid,test.id)"><span></span><span>查看</span></div>
|
|
|
+ <div @click="copyTest(test.id)"><span></span><span>复制</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ props: {
|
|
|
+ userid: {
|
|
|
+ type: String,
|
|
|
+ },
|
|
|
+ oid: {
|
|
|
+ type: String,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ type: '',
|
|
|
+ typeArray: [],
|
|
|
+ typeArrayCheck: [],
|
|
|
+ worksArray: [],
|
|
|
+ org: this.$route.query.org,
|
|
|
+ role: this.$route.query.role,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ checkType(type) {
|
|
|
+ this.type = type
|
|
|
+ this.getWorks()
|
|
|
+ },
|
|
|
+ selectTestType() {
|
|
|
+ let params = {
|
|
|
+ oid: this.oid,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectTestType", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.typeArray = res.data[0];
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getWorks() {
|
|
|
+ let params = {
|
|
|
+ uid: this.userid,
|
|
|
+ typeid: this.type,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "getTestWorksPerson", params)
|
|
|
+ .then((res) => {
|
|
|
+ let array = res.data[0]
|
|
|
+ // 用于存储归类后的数据的对象
|
|
|
+ const worksArray = {};
|
|
|
+
|
|
|
+ // 遍历原始数据,根据 parentId 进行分组
|
|
|
+ array.forEach(item => {
|
|
|
+ if (!worksArray[item.courseid]) {
|
|
|
+ worksArray[item.courseid] = {
|
|
|
+ id: item.id,
|
|
|
+ courseid: item.courseid,
|
|
|
+ title: item.title,
|
|
|
+ time: item.time,
|
|
|
+ utime: item.utime,
|
|
|
+ chapters: item.chapters,
|
|
|
+ brief: item.brief,
|
|
|
+ array: []
|
|
|
+ };
|
|
|
+ }
|
|
|
+ worksArray[item.courseid].array.push(item);
|
|
|
+ });
|
|
|
+
|
|
|
+ this.worksArray = Object.values(worksArray);
|
|
|
+ this.$forceUpdate();
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ returnA() {
|
|
|
+ this.$router.push(
|
|
|
+ "/testStudent?userid=" +
|
|
|
+ this.userid +
|
|
|
+ "&oid=" +
|
|
|
+ this.oid +
|
|
|
+ "&org=" +
|
|
|
+ this.org +
|
|
|
+ "&role=" +
|
|
|
+ this.role
|
|
|
+ );
|
|
|
+ },
|
|
|
+ checkTest(cid, tid) {
|
|
|
+ this.$router.push(
|
|
|
+ "/checkTest?cid=" +
|
|
|
+ cid +
|
|
|
+ "&tid=" +
|
|
|
+ tid +
|
|
|
+ "&userid=" +
|
|
|
+ this.userid +
|
|
|
+ "&oid=" +
|
|
|
+ this.oid +
|
|
|
+ "&org=" +
|
|
|
+ this.org +
|
|
|
+ "&type=3" +
|
|
|
+ "&role=" +
|
|
|
+ this.role
|
|
|
+ );
|
|
|
+ },
|
|
|
+ doTest(cid,tid){
|
|
|
+ this.$router.push(
|
|
|
+ "/doTest?cid=" +
|
|
|
+ cid +
|
|
|
+ "&tid=" +
|
|
|
+ tid +
|
|
|
+ "&userid=" +
|
|
|
+ this.userid +
|
|
|
+ "&oid=" +
|
|
|
+ this.oid +
|
|
|
+ "&org=" +
|
|
|
+ this.org +
|
|
|
+ "&type=3" +
|
|
|
+ "&role=" +
|
|
|
+ this.role
|
|
|
+ );
|
|
|
+ },
|
|
|
+ copyTest(tid){
|
|
|
+ let params = [{
|
|
|
+ tid: tid,
|
|
|
+ uid: this.userid,
|
|
|
+ }];
|
|
|
+ this.ajax
|
|
|
+ .post(this.$store.state.api + "copyTestWorks", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.$message.success("复制成功");
|
|
|
+ this.getWorks();
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.selectTestType();
|
|
|
+ this.getWorks()
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.i_body {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100%);
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ padding: 20px 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.i_body_title {
|
|
|
+ font-size: 20px;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.i_body_box {
|
|
|
+ height: calc(100% - 30px);
|
|
|
+ padding: 30px 0 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav {
|
|
|
+ display: flex;
|
|
|
+ height: 50px;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.nav {
|
|
|
+ width: 120px;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ color: rgb(167, 167, 167);
|
|
|
+ /* background: #000000; */
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.active {
|
|
|
+ color: #3681fc;
|
|
|
+ background: rgb(248, 250, 254);
|
|
|
+ border-radius: 10px 10px 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.all::before,
|
|
|
+.check_nav>.gr::before,
|
|
|
+.check_nav>.md::before,
|
|
|
+.check_nav>.jy::before,
|
|
|
+.check_nav>.yy::before {
|
|
|
+ content: "";
|
|
|
+ display: block;
|
|
|
+ width: 18px;
|
|
|
+ height: 18px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ margin-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.all::before {
|
|
|
+
|
|
|
+ background-image: url('../../../../assets/icon/test/all_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.active.all::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/all_icon_active.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.gr::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/gr_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.active.gr::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/gr_icon_active.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.md::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/md_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.active.md::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/md_icon_active.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.jy::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/jy_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.active.jy::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/jy_icon_active.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.yy::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/yy_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_nav>.active.yy::before {
|
|
|
+ background-image: url('../../../../assets/icon/test/yy_icon_active.png');
|
|
|
+}
|
|
|
+
|
|
|
+.check_box {
|
|
|
+ height: calc(100% - 50px);
|
|
|
+ overflow: auto;
|
|
|
+ padding: 20px 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: rgb(248, 250, 254);
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel {
|
|
|
+ width: calc(100% - 40px);
|
|
|
+ margin: 0 auto;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 10px;
|
|
|
+ /* height: 300px; */
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel+.test_panel {
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_title {
|
|
|
+ height: 60px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-bottom: 2px solid #f0f0f0;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_title>.title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_title>.title>span:nth-child(1) {
|
|
|
+ color: rgb(100, 215, 155);
|
|
|
+ background: rgb(241, 255, 248);
|
|
|
+ font-size: 12px;
|
|
|
+ border: 1px solid rgb(100, 215, 155);
|
|
|
+ padding: 3px 5px;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_title>.title>span:nth-child(2) {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_title>.time {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #a1a1a1;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_title>.time > span + span{
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 20px 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.detail {
|
|
|
+ width: calc(100% - 350px - 20px);
|
|
|
+ margin-right: 20px;
|
|
|
+ color: #a1a1a1;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 24px;
|
|
|
+ word-break: break-all;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 4;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ width: 350px;
|
|
|
+ min-width: 350px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.score {
|
|
|
+ height: 110px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ flex-direction: column;
|
|
|
+ border: 1px solid #dbdbdb;
|
|
|
+ background: rgb(252, 252, 252);
|
|
|
+ width: 120px;
|
|
|
+ border-radius: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.score:nth-child(1) {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.score>div:nth-child(1)>span:nth-child(1) {
|
|
|
+ font-size: 30px;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.score>div:nth-child(1)>span:nth-child(2) {
|
|
|
+ margin-left: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.score>div:nth-child(2) {
|
|
|
+ font-size: 14px;
|
|
|
+ margin-top: 10px;
|
|
|
+ color: #a1a1a1;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.btn {
|
|
|
+ height: 100px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.btn>div {
|
|
|
+ display: flex;
|
|
|
+ color: rgb(69, 141, 255);
|
|
|
+ align-items: center;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+/* .test_panel_box > .panel >.btn > div + div{
|
|
|
+ margin: 15px 0 0 0;
|
|
|
+ } */
|
|
|
+.test_panel_box>.panel>.btn>div>span:nth-child(1) {
|
|
|
+ display: block;
|
|
|
+ width: 13px;
|
|
|
+ height: 13px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ margin-right: 7px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.btn>div:nth-child(1)>span:nth-child(1) {
|
|
|
+ background-image: url('../../../../assets/icon/test/edit_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.btn>div:nth-child(2)>span:nth-child(1) {
|
|
|
+ background-image: url('../../../../assets/icon/test/check_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.test_panel_box>.panel>.btn>div:nth-child(3)>span:nth-child(1) {
|
|
|
+ background-image: url('../../../../assets/icon/test/paste_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box {
|
|
|
+ height: 160px;
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 20px;
|
|
|
+ border-top: 2px solid #f0f0f0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.test_add_box>.test {
|
|
|
+ width: 120px;
|
|
|
+ min-width: 120px;
|
|
|
+ height: 120px;
|
|
|
+ border-radius: 5px;
|
|
|
+ overflow: hidden;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test:hover .mask {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test+.test {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.time {
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ flex-direction: column;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ color: #fff;
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
+ font-size: 14px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.time>span {
|
|
|
+ margin-top: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.mask {
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
+ /* display: flex; */
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ color: rgb(69, 141, 255);
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.mask>div {
|
|
|
+ display: flex;
|
|
|
+ color: #fff;
|
|
|
+ align-items: center;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.mask>div+div {
|
|
|
+ margin: 10px 0 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+/*
|
|
|
+.test_add_box>.test>.mask>div>span:nth-child(1) {
|
|
|
+ display: block;
|
|
|
+ width: 13px;
|
|
|
+ height: 13px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ margin-right: 7px;
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.mask>div:nth-child(1)>span:nth-child(1) {
|
|
|
+ background-image: url('../../../../assets/icon/test/edit_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.mask>div:nth-child(2)>span:nth-child(1) {
|
|
|
+ background-image: url('../../../../assets/icon/test/check_icon.png');
|
|
|
+}
|
|
|
+
|
|
|
+.test_add_box>.test>.mask>div:nth-child(3)>span:nth-child(1) {
|
|
|
+ background-image: url('../../../../assets/icon/test/paste_icon.png');
|
|
|
+} */
|
|
|
+
|
|
|
+.bgColor {
|
|
|
+ background: #466b99;
|
|
|
+}
|
|
|
+</style>
|