20200601-zlp-1

完善评分评价

ruoyi-ui/src/views/benyi_train/video_study/detail.vue

@@ -13,13 +13,44 @@
       </el-col>
       <el-col :xs="24" :sm="12" style="padding: 10px;">
         <el-card>
-          内容介绍
-          <br />标题：{{title}}
-          <br />讲师：{{lecturername}}
-          <br />简介：{{information}}
-          <br />评分：
-          <el-rate v-model="value"></el-rate>留言：
-          <el-input type="textarea" placeholder="请输入内容" />
+          <div slot="header" class="clearfix">
+            <span>内容介绍</span>
+          </div>
+          <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+            <div class="text item">
+              <el-form-item label="标题">{{title}}</el-form-item>
+            </div>
+            <div class="text item">
+              <el-form-item label="讲师">{{lecturername}}</el-form-item>
+            </div>
+            <div class="text item">
+              <el-form-item label="简介">{{information}}</el-form-item>
+            </div>
+            <div class="text item">
+              <el-form-item label="评分" prop="score">
+                <el-rate v-model="form.score" :disabled="dis" :show-score="dis"></el-rate>
+                <el-input v-model="form.videoid" v-if="false" />
+                <el-input v-model="form.lecturerid" v-if="false" />
+              </el-form-item>
+            </div>
+            <div class="text item">
+              <el-form-item label="意见建议" prop="content">
+                <el-input
+                  type="textarea"
+                  v-model="form.content"
+                  :disabled="dis"
+                  maxlength="500"
+                  placeholder="请您对视频内容和讲师作出评价，并告诉我们你喜欢或不喜欢的理由，以便使我们改进对您的服务品质。谢谢您的支持！"
+                />
+              </el-form-item>
+            </div>
+          </el-form>
+          <el-button
+            type="primary"
+            :disabled="dis"
+            @click="submitForm"
+            v-hasPermi="['benyi:feedback_score:add']"
+          >提交</el-button>
         </el-card>
       </el-col>
     </el-row>
@@ -28,31 +59,64 @@
 
 <script>
 import { getVideo } from "@/api/benyi_train/video";
+import { getScoreByVideo, addScore } from "@/api/benyi_train/score";
+import { addFeedback } from "@/api/benyi_train/feedback";
 
 export default {
   name: "detail",
   data() {
     return {
       title: "",
+      dis: false,
       lecturername: "",
+      lecturerid: null,
       information: "",
       //视频播放参数
       playerOptions: {},
-      value: null
+      // value: null,
+      // content: "",
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        score: [
+          { required: true, message: "请为讲师打个分数吧", trigger: "click" }
+        ],
+        content: [
+          { required: true, message: "意见或建议不能为空", trigger: "blur" }
+        ]
+      }
     };
   },
   created() {
     const id = this.$route.params && this.$route.params.id;
     //console.log(id);
     this.getVideoById(id);
+    this.getScore(id);
+    //this.value = 5;
+    //this.dis=true;
   },
   methods: {
+    //查询分数和评价
+    getScore(id) {
+      getScoreByVideo(id).then(res => {
+        //console.log(res.data == undefined);
+        if (res.msg == null) {
+          this.dis = false;
+        } else {
+          this.dis = true;
+          this.form.score = res.score;
+          this.form.content = res.content;
+        }
+      });
+    },
     /** 查询培训列表 */
     getVideoById(id) {
       getVideo(id).then(response => {
-          this.title=response.data.title;
-          this.lecturername=response.data.lecturername;
-          this.information=response.data.information;
+        this.title = response.data.title;
+        this.lecturername = response.data.lecturername;
+        this.lecturerid = response.data.lecturer;
+        this.information = response.data.information;
         //console.log(response.data);
         this.playerOptions = {
           autoplay: true,
@@ -63,7 +127,6 @@ export default {
           sources: [
             {
               type: response.data.filetype,
-              // mp4
               src: "https://files.benyiedu.com/" + response.data.videourl
             }
           ],
@@ -77,7 +140,38 @@ export default {
           }
         };
       });
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.dis=true;
+      const id = this.$route.params && this.$route.params.id;
+      if (this.form.score == 0) {
+        this.form.score = null;
+      }
+      this.form.lecturerid = this.lecturerid;
+      this.form.videoid = id;
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          addScore(this.form).then(response => {
+            if (response.code === 200) {
+              addFeedback(this.form).then(response => {
+                if (response.code === 200) {
+                  this.msgSuccess("感谢您的反馈，谢谢！");
+                  this.getScore(id);
+                } else {
+                  this.msgError(response.msg);
+                }
+              });
+            } else {
+              this.msgError(response.msg);
+              this.dis=false;
+            }
+          });
+        }else{
+           this.dis=false;
+        }
+      });
     }
   }
 };
-</script>
+</script>