lsc 2 years ago
parent
commit
f998aede25
2 changed files with 142 additions and 201 deletions
  1. 2 2
      config/index.js
  2. 140 199
      src/components/pages/components/worksDetail2.vue

+ 2 - 2
config/index.js

@@ -51,8 +51,8 @@ module.exports = {
 
     productionSourceMap: true,
     // https://webpack.js.org/configuration/devtool/#production
-    // devtool: '#source-map',
-    devtool: 'cheap-module-eval-source-map',
+    devtool: '#source-map',
+    // devtool: 'cheap-module-eval-source-map',
 
     // Gzip off by default as many popular static hosts such as
     // Surge or Netlify already gzip all static assets for you.

+ 140 - 199
src/components/pages/components/worksDetail2.vue

@@ -10,21 +10,8 @@
       "
     >
       <div class="student_head">
-        <div class="student_search">
+        <!-- <div class="student_search">
           <div>班级筛选</div>
-          <!-- <el-select
-						v-model="subject"
-						placeholder="请选择课程"
-						@change="searchWork"
-					>
-						<el-option label="所有课程" value=""></el-option>
-						<el-option
-							v-for="(item, index) in subjectJuri"
-							:key="index"
-							:label="item.name"
-							:value="item.id"
-						></el-option>
-          </el-select>-->
           <el-select v-model="sClass" placeholder="请选择班级" @change="searchWork">
             <el-option label="所有班级" value></el-option>
             <el-option
@@ -34,6 +21,29 @@
               :value="item.id"
             ></el-option>
           </el-select>
+        </div>-->
+        <!-- chooseDy
+        chooseTask-->
+        <div class="student_search">
+          <div>课程筛选</div>
+          <el-select v-model="chooseDy" placeholder="请选择阶段" @change="searchWork1">
+            <el-option label="所有阶段" value></el-option>
+            <el-option
+              v-for="(item, index) in dyList"
+              :key="index"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+          <el-select v-model="chooseTask" placeholder="请选择任务" @change="searchWork2">
+            <el-option label="所有任务" value></el-option>
+            <el-option
+              v-for="(item, index) in dyList[chooseDy] ? dyList[chooseDy].taskList :[]"
+              :key="index"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
         </div>
       </div>
     </div>
@@ -52,10 +62,24 @@
           stripe
         >
           <el-table-column prop="sName" label="姓名" min-width="15" align="center"></el-table-column>
-          <el-table-column prop="class" label="班级" min-width="20" align="center"></el-table-column>
+          <el-table-column prop="class" label="班级" min-width="20" align="center">
+            <template slot-scope="scope">
+              <div>{{scope.row.class ? scope.row.class :'暂无班级' }}</div>
+            </template>
+          </el-table-column>
           <el-table-column prop="course" label="项目" min-width="20" align="center"></el-table-column>
-          <el-table-column prop="time" label="时间" min-width="15" align="center"></el-table-column>
-          <el-table-column label="操作" min-width="30">
+          <el-table-column prop="course" label="阶段" min-width="20" align="center">
+            <template slot-scope="scope">
+              <div>{{dyList.length > 0 ? dyList[scope.row.stage].name:''}}</div>
+            </template>
+          </el-table-column>
+          <el-table-column prop="course" label="任务" min-width="20" align="center">
+            <template slot-scope="scope">
+              <div>{{dyList.length > 0 ? dyList[scope.row.stage].taskList[scope.row.task].name :'' }}</div>
+            </template>
+          </el-table-column>
+          <el-table-column prop="time" label="时间" width="200px" align="center"></el-table-column>
+          <el-table-column label="操作" width="200px">
             <template slot-scope="scope">
               <el-button
                 type="primary"
@@ -78,88 +102,63 @@
           :before-close="handleClose"
           class="add_work"
         >
-          <div class="zyBoxC" v-for="(item, index) in worksDetail" :key="index">
+          <div class="zyBoxC">
             <div class="courseTitle">
-              <span>{{ "第" + (item.stage + 1) + "阶段 " + item.chapterTitle }}</span>
-              <span v-if="item.askJson" @click="checkAsk(item.askJson)">查看问卷</span>
+              <span
+                v-if="sInfo.course"
+              >{{ "第" + (sInfo.stage + 1) + "阶段 " + dyList[sInfo.stage].name }}</span>
+              <!-- <span v-if="item.askJson" @click="checkAsk(item.askJson)">查看问卷</span> -->
             </div>
             <div class="zyBox">
               <div class="left">
-                <div class="bigImg" v-if="item.tType == 0">
-                  <video-player
-                    class="video-player vjs-custom-skin"
-                    ref="videoPlayer"
-                    :playsinline="true"
-                    :options="item.playerO"
-                    @play="onPlayerPlay($event)"
-                    style="width: 100%; height: 100%"
-                  ></video-player>
+                <div class="bigImg" v-if="worksDetail.img && worksDetail.img.length">
+                  <img :src="worksDetail.img[worksDetail.imgIndex].src" alt />
                 </div>
-                <div class="bigImg" v-else>
-                  <img
-                    :src="
-                      item.thumbnail.length > 0 && item.thumbnail[1].length
-                        ? item.thumbnail[1][0].url
-                        : ''
-                    "
-                    alt
-                  />
-                </div>
-                <div class="thumbnail">
+                <div class="thumbnail" v-if="worksDetail.img && worksDetail.img.length">
                   <div
-                    style="background: #a3d4ff"
-                    v-if="item.upVedio.length"
-                    :class="item.tType == 0 ? 'isClick' : ''"
+                    v-for="(item,index) in worksDetail.img"
+                    :key="index"
+                    :class="worksDetail.imgIndex == index ? 'isClick' : ''"
                   >
-                    <img src="../../../assets/icon/spIcon.png" alt @click="item.tType = 0" />
-                  </div>
-                  <div :class="item.tType == 1 ? 'isClick' : ''">
                     <img
                       :src="
-                        item.thumbnail.length > 0 && item.thumbnail[1].length
-                          ? item.thumbnail[1][0].url
-                          : ''
+                        item.src
                       "
                       alt
-                      @click="item.tType = 1"
+                      @click="worksDetail.imgIndex = index"
                     />
                   </div>
                 </div>
-                <div style="margin: 5px 10px">{{ sInfo.course }}</div>
-                <div class="student_Answer">
-                  <div class="toux">
-                    <img :src="sInfo.tx != null ? sInfo.tx : tx" alt />
-                  </div>
-                  <div class="nav">
-                    <div class="studentName">{{ sInfo.sName }}</div>
-                    <div class="studentAnswer">
-                      {{ item.content != "" ? item.content : "暂无内容" }}
-                      <!-- 雨荒深院菊,霜倒半池莲.唐杜甫《宿赞公房》 -->
-                    </div>
-                  </div>
+                <div
+                  class="task_title"
+                  v-if="sInfo.course"
+                >{{ "任务"+(sInfo.task + 1)+' ' + dyList[sInfo.stage].taskList[sInfo.task].name }}</div>
+                <div class="ask_Answer">
+                  <div class="ask_Answer_title">问卷调查</div>
+                  <div class="ask_Answer_content">暂无提交问卷</div>
                 </div>
               </div>
-              <div style="width: 290px; margin-right: 10px">
+              <div style="width: 310px; margin-right: 10px">
                 <div class="sd_score" style="box-sizing: border-box; width: 100%; box-shadow: none">
                   <div class="score_box">
                     <span>意识能力</span>
-                    <el-rate v-model="item.rate.ca"></el-rate>
+                    <el-rate></el-rate>
                   </div>
                   <div class="score_box">
                     <span>科学探究能力</span>
-                    <el-rate v-model="item.rate.sia"></el-rate>
+                    <el-rate></el-rate>
                   </div>
                   <div class="score_box">
                     <span>实践创新能力</span>
-                    <el-rate v-model="item.rate.eta"></el-rate>
+                    <el-rate></el-rate>
                   </div>
                   <div class="score_box">
                     <span>学习反思能力</span>
-                    <el-rate v-model="item.rate.pia"></el-rate>
+                    <el-rate></el-rate>
                   </div>
                   <div class="score_box">
                     <span>工程思维能力</span>
-                    <el-rate v-model="item.rate.lra"></el-rate>
+                    <el-rate></el-rate>
                   </div>
                 </div>
                 <div class="data_body">
@@ -177,11 +176,8 @@
               </div>
               <div class="right">
                 <div class="comment">
-                  <div class="comment_title">
-                    评论
-                    <span>({{ commentCount }})</span>
-                  </div>
-                  <div class="other_Answer">暂无学生评论</div>
+                  <div class="comment_title">问答</div>
+                  <div class="other_Answer">暂无提交问答</div>
                   <!-- <div class="other_Answer">
 									<div class="toux">
 										<img src="../../../assets/portal.png" alt="" />
@@ -213,14 +209,14 @@
                       placeholder="还有要说的吗..."
                       :rows="8"
                       resize="none"
-                      v-model="item.rate.content"
                       style="background: #fafafa"
                     ></el-input>
                   </div>
                 </div>
               </div>
               <!-- <div class="rbButtom" @click="giveScore">评分</div> -->
-              <div class="rbButtom" @click="updateWorks(item.id, item.rate, index)">评分</div>
+              <!-- @click="updateWorks(item.id, item.rate, index)" -->
+              <div class="rbButtom">评分</div>
             </div>
           </div>
         </el-dialog>
@@ -401,7 +397,7 @@ export default {
   components: {
     StudentData,
   },
-  props:['cid','uid','ooid'],
+  props: ["cid", "uid", "ooid"],
   data() {
     return {
       tableHeight: "500px",
@@ -460,6 +456,8 @@ export default {
       studentMessage: [],
       subject: "",
       sClass: "",
+      chooseDy: "",
+      chooseTask: "",
       subjectJuri: [],
       projectJuri: [],
       grade: [],
@@ -486,7 +484,7 @@ export default {
       vedio: [],
       file: [],
       tType: 0,
-      chartObj: [],
+      chartObj: null,
       ooption: [
         { value: 0, name: "意识能力" },
         { value: 0, name: "科学探究能力" },
@@ -531,6 +529,7 @@ export default {
         ],
       },
       askJson: {},
+      dyList: [],
     };
   },
   mounted() {
@@ -601,113 +600,29 @@ export default {
           this.chapInfo = JSON.parse(res.data[0][0].chapters);
           var worksDetail = res.data[1];
           var askArray = res.data[2];
-          // this.chapInfo.filter((value, index, array) => {
-          //   for (var i = 0; i < worksDetail.length; i++) {
-          //     if (index == worksDetail[i].stage) {
-          //       var c = JSON.parse(worksDetail[i].content)[0];
-          //       var d =
-          //         worksDetail[i].rate != null && worksDetail[i].rate != ""
-          //           ? JSON.parse(worksDetail[i].rate)
-          //           : { ca: 0, sia: 0, eta: 0, pia: 0, lra: 0, content: "" };
-          //       var e =
-          //         worksDetail[i].rate != null && worksDetail[i].rate != ""
-          //           ? 0
-          //           : 1;
-          //       value.rateWrong = e;
-          //       value.content = c.content;
-          //       value.rate = d;
-          //       value.cover = c.cover;
-          //       value.upVedio = c.upVedio;
-          //       this.thumbnail.push(value.upVedio);
-          //       this.thumbnail.push(value.cover);
-          //       break;
-          //     }
-          //   }
-          // });
+          var workJson = {
+            img: [],
+            imgIndex: 0,
+          };
 
-          worksDetail.filter((value, index, array) => {
-            var c = JSON.parse(value.content)[0];
-            var d =
-              value.rate != null && value.rate != ""
-                ? JSON.parse(value.rate)
-                : { ca: 0, sia: 0, eta: 0, pia: 0, lra: 0, content: "" };
-            var e = value.rate != null && value.rate != "" ? 0 : 1;
-            value.rateWrong = e;
-            value.chapterTitle = this.chapInfo[value.stage].dyName;
-            value.content = c.content;
-            value.rate = d;
-            value.cover = c.cover;
-            value.upVedio = c.upVedio;
-            value.thumbnail = [c.upVedio, c.cover];
-            if (c.upVedio.length) {
-              value.tType = 0;
-            } else {
-              value.tType = 1;
-            }
-            for (let j = 0; j < askArray.length; j++) {
-              if (askArray[j].stage == value.stage) {
-                var _a = [];
-                var _radio = askArray[j].content.split(",");
-                for (var ij = 0; ij < _radio.length; ij++) {
-                  _a.push(parseInt(_radio[ij]));
-                }
-                value.askJson = {
-                  askTitle: this.chapInfo[value.stage].chapterInfo[0].askTitle,
-                  askJson: this.chapInfo[value.stage].chapterInfo[0].askJson,
-                  radio: _a,
-                };
-              }
-            }
+          for (var i = 0; i < worksDetail.length; i++) {
+            workJson.img.push({ src: worksDetail[i].content, id: i });
+          }
 
-            value.playerO = JSON.parse(JSON.stringify(this.playerOptions));
-            value.playerO.sources[0].src =
-              c.upVedio.length > 0
-                ? c.upVedio[0].url
-                : require("../../../assets/icon/kc1.png");
-          });
-          this.worksDetail = worksDetail;
+          this.worksDetail = workJson;
 
           this.courseDetail = res.data[0][0];
-          // this.playerOptions.sources[0].src =
-          //   this.chapInfo[this.publicIndex].upVedio.length > 0
-          //     ? this.chapInfo[this.publicIndex].upVedio[0].url
-          //     : require("../../../assets/icon/kc1.png");
-          // console.log(this.playerOptions.sources[0].src);
-          // this.playerO = this.playerOptions;
-          //   this.dialogVisible = true;
-          // this.rateList = this.chapInfo[this.publicIndex].rate;
+          this.$forceUpdate;
           this.dialogVisible3 = true;
-          // this.ooption[0].value = this.rateList.ca;
-          // this.ooption[1].value = this.rateList.sia;
-          // this.ooption[2].value = this.rateList.eta;
-          // this.ooption[3].value = this.rateList.pia;
-          // this.ooption[4].value = this.rateList.lra;
-          // if (this.chartObj) {
-          //   this.option.series[0].data = this.ooption;
-          //   this.chartObj.setOption(this.option);
+
+          // if (this.chartObj[index]) {
+          //   _option.series[0].data = _ooption;
+          //   this.chartObj[index].setOption(_option);
           // } else {
-          //   this.setChart(this.ooption);
+          //   _option.series[0].data = _ooption;
+          //   this.setChart(index, _option);
           // }
-
-          setTimeout(() => {
-            worksDetail.filter((value, index, array) => {
-              var _ooption = JSON.parse(JSON.stringify(this.ooption));
-              var _option = JSON.parse(JSON.stringify(this.option));
-
-              _ooption[0].value = value.rate.ca;
-              _ooption[1].value = value.rate.sia;
-              _ooption[2].value = value.rate.eta;
-              _ooption[3].value = value.rate.pia;
-              _ooption[4].value = value.rate.lra;
-              if (this.chartObj[index]) {
-                _option.series[0].data = _ooption;
-                this.chartObj[index].setOption(_option);
-              } else {
-                _option.series[0].data = _ooption;
-                this.setChart(index, _option);
-              }
-            });
-          }, 0);
+          this.setChart(this.option);
         })
         .catch((err) => {
           console.error(err);
@@ -717,7 +632,7 @@ export default {
       this.askJson = askJson;
       this.dialogVisible4 = true;
     },
-    setChart(index, option) {
+    setChart(option) {
       let _this = this;
       // 雷达图显示的标签
       let newPromise = new Promise((resolve) => {
@@ -730,23 +645,13 @@ export default {
         const chartObj = _this.$echarts.init(
           //劳动课程
           // _this.$el.querySelector("#charts_canvas")
-          document.getElementsByClassName("charts_canvas")[index]
+          document.getElementsByClassName("charts_canvas")[0]
         );
         // 初始化雷达图
-        _this.chartObj[index] = chartObj;
-        _this.chartObj[index].setOption(option);
+        _this.chartObj = chartObj;
+        _this.chartObj.setOption(option);
       });
     },
-    // doingAssess(index) {
-    // 	this.publicIndex = index;
-    // 	this.playerOptions.sources[0].src =
-    // 		this.chapInfo[this.publicIndex].upVedio.length > 0
-    // 			? this.chapInfo[this.publicIndex].upVedio[0].url
-    // 			: require("../../../assets/icon/kc1.png");
-    // 	console.log(this.playerOptions.sources[0].src);
-    // 	this.playerO = this.playerOptions;
-    // 	this.dialogVisible1 = true;
-    // },
     giveScore() {
       this.rateList = this.chapInfo[this.publicIndex].rate;
       this.dialogVisible2 = true;
@@ -781,7 +686,12 @@ export default {
           console.error(err);
         });
     },
-    searchWork() {
+    searchWork1() {
+      this.page = 1;
+      this.chooseTask = "";
+      this.getWorks();
+    },
+    searchWork2() {
       this.page = 1;
       this.getWorks();
     },
@@ -790,12 +700,13 @@ export default {
       this.isLoading = true;
       var mr = this.mr;
       let params = {
-        cn: this.sClass,
         cid: this.id,
+        stage: this.chooseDy,
+        task: this.chooseTask,
         page: this.page,
       };
       this.ajax
-        .get(this.$store.state.api + "getWorks", params)
+        .get(this.$store.state.api + "getCourseWorks", params)
         .then((res) => {
           this.isLoading = false;
           this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
@@ -811,6 +722,7 @@ export default {
         background: "rgba(255, 255, 255, 0.7)",
         target: document.querySelector(".student_table"),
       });
+      console.log(this.id);
       let params = {
         courseId: this.id,
       };
@@ -818,8 +730,19 @@ export default {
         .get(this.$store.state.api + "selectCourseDetail", params)
         .then((res) => {
           loading.close();
-          this.chapInfo = JSON.parse(res.data[0][0].chapters);
-          // element.imgUrl = JSON.parse(element.chapters).poster;
+          // this.chapInfo = JSON.parse(res.data[0][0].chapters);
+          var dyJSON = JSON.parse(res.data[0][0].chapters);
+          let dyList = [];
+          for (var i = 0; i < dyJSON.length; i++) {
+            dyList.push({ name: dyJSON[i].dyName, id: i, taskList: [] });
+            var a = dyJSON[i].chapterInfo[0].taskJson;
+            for (var j = 0; j < a.length; j++) {
+              dyList[i].taskList.push({ name: a[j].task, id: j });
+            }
+          }
+          console.log(dyList);
+          this.dyList = dyList;
+          // var dyJSON = JSON.parse()
         })
         .catch((err) => {
           loading.close();
@@ -875,10 +798,10 @@ export default {
   },
   created() {
     this.page = 1;
+    this.getCourseDetail();
     this.getClass();
     this.getGroup();
     this.getWorks();
-    // this.getCourseDetail();
   },
 };
 </script>
@@ -1089,8 +1012,8 @@ export default {
 .other_Answer {
   display: flex;
   margin: 5px 10px;
-  border-bottom: 1px solid #ccc;
-  padding-bottom: 15px;
+  padding: 15px 0;
+  justify-content: center;
 }
 .nav {
   margin-left: 5px;
@@ -1300,6 +1223,8 @@ export default {
   flex-direction: row;
   justify-content: flex-start;
   margin: 10px 0;
+  overflow-x: auto;
+  overflow-y: hidden;
 }
 
 .isClick {
@@ -1311,6 +1236,7 @@ export default {
   width: 80px;
   margin-right: 5px;
   cursor: pointer;
+  flex-shrink: 0;
 }
 
 .zyBoxC {
@@ -1446,4 +1372,19 @@ export default {
 .redioStyle >>> .el-radio__label {
   font-size: 18px;
 }
+.task_title {
+  font-size: 18px;
+  font-weight: 700;
+}
+.ask_Answer {
+  margin-top: 10px;
+}
+.ask_Answer_title {
+  font-size: 18px;
+}
+.ask_Answer_content {
+  display: flex;
+  justify-content: center;
+  margin: 10px 0;
+}
 </style>