Предпросмотр + мелкие правки

project/templates/lilcity/edit_index.html

@@ -47,7 +47,7 @@
         <a class="header__logo logo" href="/"></a>
         <div class="header__actions">
           <div id="course-redactor__saving-status" class="header__status"></div>
-          <button class="header__btn btn btn_icon">
+          <button id="course-redactor__preview-button" class="header__btn btn btn_icon">
             <svg class="icon icon-eye">
               <use xlink:href="{% static 'img/sprite.svg' %}#icon-eye"></use>
             </svg>

web/src/components/CourseRedactor.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id="lilcity__course-redactor" v-on:course_publish="onCoursePublish">
+  <div id="lilcity__course-redactor" v-on:course_publish="onCoursePublish" v-on:course_preview="onCoursePreview">
     <div v-if="!courseLoading">
       <form v-if="viewSection !== 'lessons-edit'" @submit.prevent="onSubmit">
         <div class="info">
@@ -510,6 +510,10 @@
                         publishButton.removeAttr('disabled');
                     });
             },
+            onCoursePreview() {
+                let newTab = window.open(`/course/${this.course.id}`, '_blank');
+                newTab.focus();
+            },
             saveCourseDraft: debounce(function (newValue, oldValue) {
                 if (!oldValue.id) {
                     return;

web/src/js/course-redactor.js

@@ -25,4 +25,8 @@ $(document).ready(function () {
         let event = new Event('course_publish');
         document.getElementById('lilcity__course-redactor').dispatchEvent(event);
     });
+    $('#course-redactor__preview-button').on('click', function () {
+        let event = new Event('course_preview');
+        document.getElementById('lilcity__course-redactor').dispatchEvent(event);
+    });
 });