课程保存

src/views/course/AddCurriculum.vue

@@ -10,7 +10,7 @@
                             <span class="per_school" v-text="form.cid ? '编辑课程' : '新建课程'"></span>
                         </div>
                         <el-button type="primary" round class="mag" v-preventReClick
-                                   @click="saveAdd('form')">确定
+                                   @click="saveAdd">确定
                         </el-button>
                     </div>
                 </el-card>
@@ -352,10 +352,19 @@ export default {
             assessmentData: [],
             assessmentTotal: 0,
             multipleAssessment: [],
-            submiting: false // 新增编辑防抖标识
+            submiting: false, // 新增编辑防抖标识
+            loadIns: null,
+            updateTime: 0
         };
     },
     watch: {
+        // 监听信息是否有更改,有的话页面离开的时候要询问是否要保存
+        form: {
+          handler(){
+            this.updateTime++
+          },
+          deep:true
+        },
         configSearch: function(val) {
             clearTimeout(this.searchTimer);
             this.searchTimer = setTimeout(() => {
@@ -375,16 +384,26 @@ export default {
     },
     methods: {
         goback() {
-            if (this.isDetail) {
+          const id = this.form.cid
-                this.$router.back();
+          const updateTime = this.updateTime
-            } else {
+          // 更改了信息才需要提示
-                this.$confirm("确定返回？未更新的信息将不会保存。", "提示", {
+          if ((id && updateTime > 1) || (!id && updateTime)) {
-                    type: "warning"
+            this.$confirm(`编辑的内容未保存，是否保存？`, '提示', {
+              type: 'warning'
             }).then(() => {
-                        this.$router.back();
+              this.saveAdd(1)
-                }).catch(() => {});
+            }).catch(() => {
+              this.backPage()
+            })
+          } else {
+            this.backPage()
           }
         },
+        // 返回上一页
+        backPage() {
+          this.$router.back()
+          this.loadIns.close()
+        },
         getInfoData() {
             this.$post(`${this.api.curriculumDetail}?cid=${this.form.cid}`).then(res => {
                 let { data } = res;
@@ -603,8 +622,8 @@ export default {
                 this.$message.info("已取消移除");
             });
         },
-        saveAdd(form) {
+        saveAdd(fromBack) {
-            this.$refs[form].validate((valid) => {
+            this.$refs.form.validate((valid) => {
                 if (valid) {
                     if (this.submiting) return false
                     if (!this.form.coverUrl) {
@@ -642,26 +661,34 @@ export default {
                         this.form.systemIdByAssessment.sort((a, b) => a.sort - b.sort)
                     }
                     this.submiting = true
+                    this.loadIns = this.$loading({
+                      lock: true,
+                      text: 'Loading',
+                      spinner: 'el-icon-loading',
+                      background: 'rgba(0, 0, 0, 0.7)'
+                    })
                     if (this.form.cid) {
                         this.$post(this.api.modifyCourse, this.form).then((res) => {
                             this.$message.success("编辑成功");
-                            this.$router.back();
+                            this.backPage()
                         }).catch((res) => {
                             this.submiting = false
+                            this.loadIns.close()
                         });
                     } else {
                         this.$post(this.api.createCurriculum, this.form).then((res) => {
-                            this.$confirm("课程创建成功，是否马上进行课程内容设置？", "提示", {
+                            !fromBack ? this.$confirm("课程创建成功，是否马上进行课程内容设置？", "提示", {
                                 type: "success",
                                 confirmButtonText: "马上设置",
                                 cancelButtonText: "稍后操作"
                             }).then(() => {
                                 this.$router.push(`/contentSettings?cid=${res.cid}`);
                             }).catch(() => {
-                                this.$router.back();
+                                this.backPage()
-                            });
+                            }) : this.backPage()
                         }).catch((res) => {
                             this.submiting = false
+                            this.loadIns.close()
                         });
                     }
                 } else {