|
|
@@ -1,5 +1,6 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
+
|
|
|
<el-form :inline="true">
|
|
|
<el-form-item label="应交学生数">
|
|
|
<!-- <el-input disabled
|
|
|
@@ -16,8 +17,11 @@
|
|
|
:value="repliedNum"></el-input>-->
|
|
|
<div class="inputStyle">{{ repliedNum}}</div>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="作业内容">
|
|
|
+ <p class="">{{content}}</p>
|
|
|
+ </el-form-item>
|
|
|
</el-form>
|
|
|
- <p class="work">老师布置的作业:{{content}}</p>
|
|
|
+
|
|
|
<div class="tableWrap">
|
|
|
<el-table :data="tableList"
|
|
|
:header-cell-style="{background:'#EDEEF0',color:'#444'}">
|
|
|
@@ -32,7 +36,7 @@
|
|
|
label="手机号"
|
|
|
width="120"></el-table-column>
|
|
|
<el-table-column align="center"
|
|
|
- prop="subjectName"
|
|
|
+ prop="subjectNames"
|
|
|
label="声部名称"></el-table-column>
|
|
|
<el-table-column align="center"
|
|
|
prop="createTime"
|
|
|
@@ -56,13 +60,13 @@
|
|
|
<div>{{ scope.row.isView ? '是' : '否' }}</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column align="center"
|
|
|
+ <!-- <el-table-column align="center"
|
|
|
prop="isReplied"
|
|
|
label="是否回复">
|
|
|
<template slot-scope="scope">
|
|
|
<div>{{ scope.row.isReplied ? '是' : '否' }}</div>
|
|
|
</template>
|
|
|
- </el-table-column>
|
|
|
+ </el-table-column> -->
|
|
|
<el-table-column align="center"
|
|
|
label="查看作业"
|
|
|
width="200px">
|
|
|
@@ -70,9 +74,11 @@
|
|
|
<div>
|
|
|
<!-- -->
|
|
|
<el-button type="text"
|
|
|
- v-for="(item,index) in scope.row.urlList"
|
|
|
- :key="index"
|
|
|
- @click="lookWork(item)">{{'作业'+(index+1) }}</el-button>
|
|
|
+ v-if="scope.row.urlList"
|
|
|
+ @click="lookWork(scope.row)">查看作业</el-button>
|
|
|
+ <el-button type="text"
|
|
|
+ v-if="scope.row.isReplied"
|
|
|
+ @click="lookReplied(scope.row)">查看回复</el-button>
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -84,18 +90,42 @@
|
|
|
</div>
|
|
|
<el-dialog title="查看作业"
|
|
|
@close="closeWorkVisible"
|
|
|
- width="680px"
|
|
|
+ width="480px"
|
|
|
append-to-body
|
|
|
:visible.sync="workVisible">
|
|
|
<!-- activeUrl -->
|
|
|
- <video style="width:640px;"
|
|
|
- :src="activeUrl"
|
|
|
- ref="dialogVideo"
|
|
|
- controls="controls">您的浏览器不支持视频播放</video>
|
|
|
+ <swiper ref="mySwiper"
|
|
|
+ :options="swiperOptions"
|
|
|
+ v-if="activeRow">
|
|
|
+ <swiper-slide v-for="
|
|
|
+ (item,index)
|
|
|
+ in
|
|
|
+ activeRow.urlList"
|
|
|
+ :key="index">
|
|
|
+ <video style="width:480px;"
|
|
|
+ :src="item"
|
|
|
+ ref="dialogVideo"
|
|
|
+ controls="controls">您的浏览器不支持视频播放</video>
|
|
|
+
|
|
|
+ </swiper-slide>
|
|
|
+ <div class="swiper-pagination"
|
|
|
+ slot="pagination"></div>
|
|
|
+ <div class="swiper-button-prev swiper-button-white"
|
|
|
+ @click="prev"
|
|
|
+ slot="button-prev"></div>
|
|
|
+ <div class="swiper-button-next swiper-button-white"
|
|
|
+ @click="next"
|
|
|
+ slot="button-next"></div>
|
|
|
+ </swiper>
|
|
|
+
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
|
|
|
+
|
|
|
+// import style (>= Swiper 6.x)
|
|
|
+import 'swiper/swiper-bundle.css'
|
|
|
import pagination from "@/components/Pagination/index";
|
|
|
import {
|
|
|
findStudentCourseHomeworks,
|
|
|
@@ -104,7 +134,13 @@ import {
|
|
|
} from "@/api/buildTeam";
|
|
|
export default {
|
|
|
props: ["courseScheduleId"],
|
|
|
- components: { pagination },
|
|
|
+ components: {
|
|
|
+ pagination, Swiper,
|
|
|
+ SwiperSlide
|
|
|
+ },
|
|
|
+ directives: {
|
|
|
+ swiper: directive
|
|
|
+ },
|
|
|
data () {
|
|
|
return {
|
|
|
tableList: [],
|
|
|
@@ -119,9 +155,24 @@ export default {
|
|
|
homeworkNum: null,
|
|
|
repliedNum: null,
|
|
|
activeUrl: null,
|
|
|
- content: null
|
|
|
+ content: null,
|
|
|
+ activeRow: null,
|
|
|
+ swiperOptions: {
|
|
|
+ loop: true,
|
|
|
+ pagination: '.swiper-pagination',
|
|
|
+ navigation: {
|
|
|
+ nextEl: '.swiper-button-next',
|
|
|
+ prevEl: '.swiper-button-prev'
|
|
|
+ }
|
|
|
+ // Some Swiper option/callback...
|
|
|
+ }
|
|
|
};
|
|
|
},
|
|
|
+ computed: {
|
|
|
+ swiper () {
|
|
|
+ return this.$refs.mySwiper.$swiper
|
|
|
+ }
|
|
|
+ },
|
|
|
mounted () {
|
|
|
this.init();
|
|
|
},
|
|
|
@@ -163,16 +214,26 @@ export default {
|
|
|
item.urlList = item.url ? item.url.split(",") : [];
|
|
|
return item;
|
|
|
});
|
|
|
+ console.log(this.tableList)
|
|
|
}
|
|
|
}
|
|
|
);
|
|
|
},
|
|
|
- lookWork (url) {
|
|
|
+ lookWork (row) {
|
|
|
+ this.activeRow = row
|
|
|
this.workVisible = true;
|
|
|
- this.activeUrl = url;
|
|
|
},
|
|
|
closeWorkVisible () {
|
|
|
this.activeUrl = "";
|
|
|
+ },
|
|
|
+ prev () {
|
|
|
+ this.swiper.slidePrev()
|
|
|
+ },
|
|
|
+ next () {
|
|
|
+ this.swiper.slideNext()
|
|
|
+ },
|
|
|
+ lookReplied (row) {
|
|
|
+
|
|
|
}
|
|
|
}, watch: {
|
|
|
courseScheduleId (val) {
|
|
|
@@ -189,7 +250,7 @@ export default {
|
|
|
text-align: center;
|
|
|
}
|
|
|
.work {
|
|
|
- margin-bottom: 30px;
|
|
|
- font-size: 16px;
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 14px;
|
|
|
}
|
|
|
</style>
|
